@import url("../../css/basic2.css");
body,html{background:#ebf7f5;}
/*banner*/
.banner{background: url(banner1920.jpg) no-repeat center 0; height: 500px; }
.top{margin-top: 90px; background: #fff; padding: 20px;}
.top_box{display: flex; justify-content: space-between; }
.top_l{width: 65%; position: relative; }
.top_l img.img_block{display: block; width: 100%; }
.top_text{width: 33%;}
.top_text .title{font-size: 30px; line-height: 1; color: #06c; padding: 20px 0 10px;}
.top_text .text{font-size: 24px; line-height: 30px; color: #06c; margin-bottom: 20px;}
.top_text  p{font-size: 18px; line-height: 27px; color: #666;}
.top-opacity{width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: absolute; left: 0; top: 0;}
.top_l img.top_player{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100px; cursor: pointer;}

.block-title{margin: 60px 0 40px; display: flex;}
.block-title img{display: block; margin: 0 auto; width: auto;}

.cmcc-list{display: flex; gap: 30px;}
.cmcc-left,.cmcc-right{flex: 1;}
.cmcc-box{min-height: 530px; box-sizing: border-box;}
.cmcc-box,.cmcc-right-item{background: #fff; padding: 20px;}
.cmcc-right-item:first-child{margin-bottom: 30px;}
.cmcc-box img{display: block; width: 100%; margin-bottom: 20px;}
.cmcc-list p{font-size: 16px; line-height: 24px; color: #666;}
.cmcc-list .s-title{color: #06c; font-size: 16px; line-height: 24px;}
.cmcc-list .m-title{color: #06c; font-size: 24px; line-height: 32px;}
.cmcc-list  .cmcc-right-item{min-height: 250px; box-sizing: border-box;}
.cmcc-list  .cmcc-right-item a{color: #29cccc; font-size: 16px; line-height: 24px;}
.cmcc-list  .cmcc-right-item p{margin: 10px 0;}


.block-title-text{font-size: 30px; line-height: 1; color: #06c; text-align: center; margin: 60px 0 10px;}
.title-bottom-img{display: block; width: auto; margin: 0 auto; margin-bottom: 30px;}
.swiper-threeDa{width: 100%;}
.header,.threeDa-item{display: flex; align-items: center;}
.one-block{width: 13%;}
.two-block,.thr-block,.four-block{width: 29%;}
.threeDa-item:nth-child(odd){background: #fff;}
.threeDa-item{background: #ebf7f5; padding: 16px 0;}
.one-block{display: flex; justify-content: center; align-items: center;}
.one-block .name{font-size: 16px; color: #666;}
.header{height: 50px;}
.header>div{height: 100%; position: relative;}
.header .one-block::after{content: '';width: 1px; height: 36px; background: #88cce3; position: absolute; right: 0; top: 7px;}
.header .two-block::after{content: '';width: 1px; height: 36px; background: #88cce3; position: absolute; right: 0; top: 7px;}
.header .thr-block::after{content: '';width: 1px; height: 36px; background: #88cce3; position: absolute; right: 0; top: 7px;}
.header-title{color: #fff;}
.header .one-block{background: linear-gradient(to right,#06c, #0370cb);}
.header .two-block{background: linear-gradient(to right,#0370cb, #1098c7); display: flex; justify-content: center; align-items: center;}
.header .thr-block{background: linear-gradient(to right,#1098c7, #1dc4c2); display: flex; justify-content: center; align-items: center;}
.header .four-block{background: linear-gradient(to right,#1dc4c2, #27e3bf); display: flex; justify-content: center; align-items: center;}
.header img{display: block; width: auto;}
.threeDa-item ul li{font-size: 16px; line-height: 24px; color: #666; position: relative; padding-left: 15px;}
.threeDa-item ul li::before{ content: ''; width: 5px; height: 5px; background: #27e4bf; position: absolute; left: 0; top: 10px; }
/*foot*/
.foot{background:#06c; padding: 80px 0; margin-top: 60px;}
.foot p{color:#fff; text-align: center;}

.video_area{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100001; display: none;}
.video_background{width: 100%; height: 100%; background:#000; opacity: 0.75;}
.video_area .video_father{width: 100%; height: 100%; position: absolute; left: 0; top: 0;}
.video_area video{width: 70%; display: block; margin: 0 auto; margin-top: 100px;}
.video_close_icon{position: fixed; top: 100px; right: 10%;}

@media screen and (max-width: 1199px){
	.top_text .title{padding-top: 5px; font-size: 24px;}
	.top_text .text{font-size: 18px; line-height: 27px; margin-bottom: 15px;}
	.cmcc-list .m-title{font-size: 20px; line-height: 27px;}
	.cmcc-list .cmcc-right-item{min-height: 240px;}
	.cmcc-right-item:first-child{margin-bottom: 20px;}
	.cmcc-list .cmcc-right-item p{margin: 8px 0 9px;}
	.top_text p{font-size: 16px; line-height: 24px;}
}
@media screen and (max-width: 991px){
	.top{margin-top: 30px;}
	.top_box,.cmcc-list{flex-wrap: wrap;}
	.top_l{width: 100%;}
	.top_text{width: 100%;}
	.block-title img{width: 200px;}
	.block-title{margin: 30px 0 20px;}
	.cmcc-left, .cmcc-right{flex: auto;}
	.cmcc-list .cmcc-right-item{min-height: auto;}
	.block-title-text{font-size: 20px; margin: 30px 0 7px;}
	.title-bottom-img{width: 120px;}
	.threeDa-itembox{width: 1000px;}
	.title-bottom-img{margin-bottom: 20px;}
	.threeDa .swiper-slide{width: auto;}
	.cmcc-box{min-height: auto;}
	.cmcc-list{gap: 20px;}
}

@media screen and (max-width: 768px){
	p,span{font-size: 16px; line-height: 24px;}
	.container{margin: 0 15px;}
	
	.top_text .title{padding-top: 20px; padding-bottom: 4px; font-size: 20px;}
	.top_text .text{margin-bottom: 10px;}

	.foot{padding: 50px 0; margin-top: 30px;}

	.video_area video{width: 100%; }
	.video_close_icon{top: 10px; right: 10px;}
	.top_l img.top_player{width: 60px;}
}

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