.main {

	/* padding-bottom: 40px; */

}



.gameDevelopment-menu {

	margin-top: -90px;

	margin-bottom: 10px;

	/* position: relative;

	z-index: 10; */

}



.gameDevelopment-menu .gm-item {

	cursor: pointer;

	background-color: #FFFFFF;

	width: 24%;

	padding: 28px;

	box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);

	border-radius: 5px;

	transition: all 0.3s;



}



.gameDevelopment-menu .gm-item:hover {

	transform: translateY(-10px);

}



.gameDevelopment-menu .gm-item img {

	width: 57px;

	height: auto;

}



.gameDevelopment-menu .gm-item .Subtitle {

	font-size: 26px;

	color: #333333;

	margin: 10px 0;

}



.gameDevelopment-menu .gm-item .Subtitle2 {

	font-size: 16px;

	color: #333333;

	text-transform: uppercase;

	text-align: center;

}



.game-cn {

	margin-top: 40px;

}



.game-cn .game-title {

	font-size: 48px;

	font-weight: bold;

	color: #333333;

	margin-bottom: 50px;

	text-align: center;

}



.carve {

	margin-top: 20px;

	min-height: 60px;

}

.carve img {

	

	min-height: 60px;

	object-fit: cover;

}



.gameDevelopment-cn {

	padding: 50px 0;

}



.gameDevelopment-cn .Popular-items {

	display: flex;

}



.gameDevelopment-cn .Popular-items .Main-graph {

	flex: 1;

border-radius: 8px;

	overflow: hidden;

}



.gameDevelopment-cn .Popular-items .Main-graph img {

	transition: all 0.3s;

}



.gameDevelopment-cn .Popular-items .Main-graph:hover img {

	transform: scale(1.1);

}



.gameDevelopment-cn .Popular-items .right-cn {

	width: calc((100% - 2*15px)/3);

	margin-left: 15px;

	background: #EE9B01;
	border-radius: 8px;

	display: flex;

	flex-direction: column;

	justify-content: center;

	padding: 4%;

}



.module-title {

	color: #FFFFFF;

	font-size: 42px;

	position: relative;

	margin-bottom: 35px;

}



.module-title::after {

	content: '';

	width: 100px;

	height: 2px;

	background-color: #FFFFFf;

	position: absolute;

	bottom: -15px;

	left: 0;

	z-index: 99;

}



.module-title2 {

	font-size: 24px;

	color: #FFFFFF;

}



.project-box {

	margin-top: 15px;

	display: flex;

	flex-wrap: wrap;

}



.project-box .project-item {

	width: calc((100% - 2 * 15px)/3);

	margin-right: 15px;

	margin-bottom: 15px;

	overflow: hidden;
	border-radius: 8px;
	position: relative;
	

}



.project-box .project-item img {

	transition: all 0.3s;

}



.project-box .project-item:hover img {

	transform: scale(1.1);

}

.project-box .project-item .describe{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 0;
	overflow: hidden;
	background: rgba(0,0,0,0.5);
	transition: 0.3s all;
	border-radius: 8px;
	color: #fff;
}
.project-box .project-item:hover .describe{
height: 50%;
}
.project-box .project-item .describe h4{
font-size: 18px;
position: relative;
}
.project-box .project-item .describe h4::after{
	content: '';
	position: absolute;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	width: 50%;
	height: 1px;

}
.project-box .project-item .describe span{
	margin-top: 10px;
	font-size: 14px;
	border: 1px solid #fff;
	border-radius:  20px;
	    padding: 2px 10px;
	    font-size: 12px;
}

.project-box .project-item:nth-child(3n) {

	margin-right: 0;

}



.cooperation {

	display: flex;

}



.cooperation .right-img {

	flex: 1;

	overflow: hidden;
	border-radius: 8px;


}



.cooperation .right-img img {

	transition: all 0.3s;

}



.cooperation .right-img:hover img {

	transform: scale(1.05);

}



.cooperation .left-cn {

	width: calc((100% - 2*15px)/3);

	margin-right: 15px;

	display: flex;

	flex-direction: column;

}



.cooperation .left-cn .upper {
	border-radius: 8px;

	background-color: #6BAA32;

	height: 50%;

	padding: 0% 12%;

	display: flex;

	flex-direction: column;

	justify-content: center;

}



.cooperation .case-box {



	flex: 1;

	display: flex;

	flex-direction: column;

}



.cooperation .case-box .case-i {

	height: 50%;

	margin-top: 15px;

	/* padding-top: 25px; */

	overflow: hidden;
	border-radius: 8px;
	position: relative;

}



.cooperation .case-box .case-i img {

	transition: all 0.3s;

}



.cooperation .case-box .case-i:hover img {

	transform: scale(1.1);

}

.cooperation .case-box .case-i .describe{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 0;
	overflow: hidden;
	background: rgba(0,0,0,0.5);
	transition: 0.3s all;
	border-radius: 8px;
	color: #fff;
}
.cooperation .case-box .case-i:hover .describe{
height: 50%;
}
.cooperation .case-box .case-i .describe h4{
font-size: 18px;
position: relative;
}
.cooperation .case-box .case-i .describe h4::after{
	content: '';
	position: absolute;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	width: 50%;
	height: 1px;

}
.cooperation .case-box .case-i .describe span{
	margin-top: 10px;
	font-size: 14px;
	border: 1px solid #fff;
	border-radius:  20px;
	    padding: 2px 10px;
	    font-size: 12px;
}

.superiority {

	margin-top: 100px;

}



.superiority .superiority-title {

	font-size: 48px;

	font-weight: bold;

	color: #333333;

	text-align: center;

}



.superiority .type-box {

	margin: 38px 0;

}



.superiority .type-box .type-i {

	margin-right: 80px;

}



.superiority .type-box .type-i .cn {

	font-size: 26px;

	color: #666666;

	font-weight: bold;

}



.superiority .type-box .type-i .en {

	font-size: 18px;

	margin-bottom: 4px;

	color: #999999;

}



.advantag-list {

	display: flex;

	flex-wrap: wrap;

}



.advantag-list .advantag-item {

	width: calc((100% - 4 * 24px)/5);

	margin-right: 24px;

	margin-bottom: 24px;

	/* height: 187px; */

	background: #FFFFFF;

	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);

	padding: 14px 18px;

	cursor: pointer;

	transition: all 0.3s;



}



.advantag-list .advantag-item:hover {

	transform: translateY(-10px);

}



.advantag-list .advantag-item img {

	width: auto;

	height: auto;

}



.advantag-list .advantag-item:nth-child(5n) {

	margin-right: 0;

}



.advantag-list .advantag-item .stro {

	font-size: 24px;

	/* font-weight: bold; */

	color: #333333;

	margin: 20px 0 10px;

}



.advantag-list .advantag-item .dec {

	font-size: 16px;

	color: #333333;

}



.communicate {

	display: block;

	margin-top: 60px;

	min-height: 100px;

}

.communicate img {
    width: 100%;
    min-height: 120px;

	object-fit: cover;
}

	#left-cn{

		display: none;

	}

@media screen and (max-width: 1400px) {

	.gameDevelopment-menu .gm-item img {

		width: 47px;

	}



	.gameDevelopment-menu .gm-item .Subtitle {

		font-size: 24px;



	}

}



@media screen and (max-width: 1280px) {

	.gameDevelopment-menu .gm-item img {

		width: 30px;

	}



	.gameDevelopment-menu .gm-item .Subtitle {

		font-size: 18px;

	}



	.gameDevelopment-menu .gm-item {

		padding: 20px 10px;

	}



	.gameDevelopment-menu .gm-item .Subtitle2 {

		font-size: 14px;

	}



	.module-title {

		font-size: 32px;

		margin-bottom: 30px;

	}



	.module-title2 {

		font-size: 20px;

		color: #FFFFFF;

	}



	.superiority {

		margin-top: 40px;

	}



	.superiority .superiority-title {

		font-size: 36px;

	}



	.superiority .type-box .type-i .cn {

		font-size: 20px;

	}



	.superiority .type-box .type-i {

		margin-right: 40px;

	}



	.superiority .type-box .type-i .en {

		font-size: 14px;

	}



	.advantag-list .advantag-item .stro {

		font-size: 20px;

	}



	.advantag-list .advantag-item .dec {

		font-size: 14px;

	}



	.advantag-list .advantag-item {

		padding: 10px 10px;

	}



	.communicate {

		margin-top: 30px;

	}

}



@media screen and (max-width: 768px) {

	.game-cn .game-title {

		margin-top: 20px;

	}

		.gameDevelopment-menu{

			margin-bottom: 0;

		}

	.gameDevelopment-menu .gm-item .Subtitle {

		font-size: 14px;

	}

#ssss{

	margin-top: 20px;

}

	.gameDevelopment-menu .gm-item img {

		width: auto;

		height: 30px;

	}



	.gameDevelopment-menu .gm-item {

		margin-bottom: 15px;

	}



	.game-cn {

		margin-top: 0px;

	}



	.gameDevelopment-cn {

		padding: 0px 0;

	}



	.gameDevelopment-cn .Popular-items {

		flex-direction: column-reverse;

	}



	.gameDevelopment-cn .Popular-items .right-cn {

		width: 100%;

		margin-left: 0;

		background-color: #FFFFFF;

	}



	.module-title::after {

		display: none;

	}



	.module-title {

		text-align: center;

		font-size: 18px;

		margin-bottom: 0px;

		color: #333;

	}



	.module-title2 {

		text-align: center;

		font-size: 16px;

		color: #FFFFFF;

		color: #999;

	}



	.project-box {

		margin-top: 15px;

		justify-content: space-between;



	}

	

	.project-box .project-item {

	    width: 48%;

	    margin-right: 0;

	    margin-bottom: 10px;

	    overflow: hidden;

	}

	.cooperation {

	    flex-direction: column;

	}

	.cooperation .left-cn {

		margin-top: 10px;

	    width: 100%;

	    margin-right: 0;

	    display: flex;

	    flex-direction: column;

	}

	.cooperation .left-cn .upper{

		background-color: #FFFFFF;

	}

	.cooperation .case-box{

		display: none;

	}

	.cooperation .right-img {

	    margin-top: 10px;

	}

	#left-cn{

		display: block;

	}

	#case-box{

		display: flex;

		flex-direction: row;

		justify-content: space-between;

	}

	.cooperation #case-box .case-i{

		width: 48%;

		height: auto;

		margin-top: 0;

	}

	.superiority {

	    margin-top: 20px;

	}

	.superiority .superiority-title {

	    font-size: 18px;

	}

	.superiority .type-box {

	    margin: 15px 0;

		justify-content: space-between;

	}

	.superiority .type-box .type-i .cn {

	    font-size: 14px;

	}

	.superiority .type-box .type-i{

		margin-right: 0;

	}

	.superiority .type-box .type-i .en {

	    font-size: 12px;

	}

	.advantag-list .advantag-item {

	    width: 85px;

		margin-right: 0;

		height: 85px;

		margin-right: 5px;

		border-radius: 50%;

		margin-bottom: 15px;

		display: flex;

		flex-direction: column;

		align-items: center;

		justify-content: space-between;

	 

	}

	.advantag-list .advantag-item .dec {

	 display: none;

	}

	.advantag-list .advantag-item .stro {

	    font-size: 14px;

		margin: 5px 0;

	}

	.advantag-list {

	    display: flex;

	    justify-content: center;

	}

	.advantag-list .advantag-item img {

	    width: 25px; 

		

		object-fit: cover;

	}

	.advantag-list .advantag-item:nth-child(5n) {

	    margin-right: 5px

	}

	.communicate {

	    margin-top: 20px;

	}
	.project-box .project-item:hover .describe,
	.project-box .project-item .describe,
	.cooperation .case-box .case-i .describe,
	.cooperation .case-box .case-i:hover .describe{
height: 100%;
}



}
