﻿.br-pc{
    display: inline-block;
}
.br-phone{
    display: none;
}
.fl{
    float: left;
}
.fr{
    float: right;
}
.mar50{ margin-top: 70px;}
.desc-title { color: initial;}
/* banner1 start */
.banner-wrap{
    height: 920px;
    width: 100%;
    background: url(../img/ctc/bg.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}
.banner-box{
    width: 1200px;
    height: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    padding-top: 71px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}
.banner-ctc{
    padding: 165px 0 18px;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
	font-size: 42px;
	color: #fff;
}
.banner-ctc span{ font-size: 42px; color: #fff; font-weight: bold;}
.banner-ctc img{ margin-right: 15px; width: 58px;}
.banner-title{
    font-size: 88px;
    text-align: center;
    color: #60daf6;
    font-weight: bold;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
    
}
.banner-title span{ font-size:88px; color: #60daf6; font-weight: bold;letter-spacing:8px;}
.banner-con{
    font-size: 40px;
    color: #fff;
    text-align: center;
    padding-top: 24px;
    font-weight:initial;
}
.banner-con span{ font-weight: 500; color: #60daf6;}

/* banner1 end */

/* video start */
.block4-video-box{
    width: 100%;
    max-height: 806px;
    height:100vh;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    display: none !important;
}
.block4-video{
    width: 100%;
    height: 100%;
    background: url(../img/ctc/video.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    object-fit: fill;
}
.block4-play{
    width: 116px;
    height: 116px;
    position: absolute;
    top:-60px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    z-index: 3;
    cursor: pointer;
    user-select: none;
    -webkit-user-drag: none;
    display: none;
}
.block4-poster{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    background: url(../img/ctc/video.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

/* video end */




/* ctc start */
.ctc-wrap{
    height: 918px;
    background: url(../img/ctc/bg2.jpg) center no-repeat;
    background-size: cover;
}
.ctc-box{
    width: 1200px;
    margin: 0 auto;
    height: 100%;
    /* display: flex;
    justify-content: right;
    box-sizing: border-box; */
}
.ctc{
	width: 702px;
    height: 142px;
    display: block;
    margin: 50px auto 0;
    color: #fff;
    line-height: 40px;
    font-size: 17.6px;
    background: url(../img/ctc/ctc_gs.png) no-repeat;
    background-position:center;
    background-size: cover;
    text-align: center;
    padding-top: 18px;
}
.ctc-title{
    padding: 110px 0 26px;
    width: 100%;
    text-align: center;
}
.ctc-title .desc-title{
    font-size: 48px;
    line-height: 50px;
}
.ctc-title .desc-title > span > span.word1{ color:#2fc5e7 !important;}
.ctc-subhead{
    font-size: 28px;
    color: #2fc5e7;
    text-align: center;
    font-weight: initial;
}

.ctc-con{
    font-size: 16px;
    line-height: 32px;
    color: #fff;
    width: 1200px;
    text-align: center;
}
.ctc-con span{ color: #2fc5e7;}
.ctc-con .keynote{display: block; width: 100%; padding-top:4px; background: url(../img/ctc/fg.png)top center no-repeat; background-size: 721px 114px; height: 114px;}
.ctc-con .keynote span{font-weight: bold;font-size: 25px; color: #FFFFFF; line-height: 46px; color: #2fc5e7;}

.jt_icon{ width: 100%; text-align: center; margin-top: 12px;}


/* 箭头定义闪烁动画 */
@keyframes blink {
  0% {
    opacity: 1; /* 完全不透明 */
  }
  50% {
    opacity: 0; /* 完全透明 */
  }
  100% {
    opacity: 1; /* 重新不透明 */
  }
}
 
/* 应用动画到图片 */
.blinking-image {
  animation: blink 2.5s infinite; /* 每秒闪烁一次，无限循环 */
}

.ctc_cp{ width: 100%; text-align: center; display: flex; justify-content: space-between; margin-top: 26px;}
.ctc_cp .cp1,.ctc_cp .cp2,.ctc_cp .cp3{ width: 100%; max-width: 336px; height: 122px; border: 1px solid #2a445d; cursor: pointer; color: #fff; font-size: 20px; line-height: 36px; padding: 20px 0 0 0; position: relative;}
.ctc_cp .cp1 a,.ctc_cp .cp2 a,.ctc_cp .cp3 a{ color: #fff; font-size: 20px;}
.ctc_cp .cp1 span,.ctc_cp .cp2 span,.ctc_cp .cp3 span{ font-size: 28px; color: #2fc5e7; font-weight: bold;}
.ctc_cp .cp1 img,.ctc_cp .cp2 img,.ctc_cp .cp3 img{ position: absolute; bottom: 0; left: 37%;}
.ctc_cp .cp1 img.l_x,.ctc_cp .cp2 img.l_x,.ctc_cp .cp3 img.l_x{ display: none;}
.ctc_cp .cp1 img.l_x2,.ctc_cp .cp2 img.l_x2,.ctc_cp .cp3 img.l_x2{ display: block;}
.ctc_cp .cp1:hover img.l_x,.ctc_cp .cp2:hover img.l_x,.ctc_cp .cp3:hover img.l_x{ display: block;}
.ctc_cp .cp1:hover img.l_x2,.ctc_cp .cp2:hover img.l_x2,.ctc_cp .cp3:hover img.l_x2{ display: none;}
.ctc_cp .cp1:hover,.ctc_cp .cp2:hover,.ctc_cp .cp3:hover{border: 1px solid #2FC5E7;}
.ctc_cp .cp1{ background: url(../img/ctc/cp_img.jpg) no-repeat; background-size: cover;}
.ctc_cp .cp2{ background: url(../img/ctc/cp_img2.jpg) no-repeat; background-size: cover;}
.ctc_cp .cp3{ background: url(../img/ctc/cp_img3.jpg) no-repeat; background-size: cover;}

/* ctc end */


/* cp-assemble start */
.cp-assemble{
	width: 100%;
    height: 2632px;
    background: url(../img/ctc/cpbg.jpg) center no-repeat;
    background-size: cover;
    color: #fff;
}

.assemble-title{
    padding: 88px 0 26px;
    width: 100%;
    text-align: center;
    
}
.assemble-title>span{
	font-size: 26px;
	font-weight: initial;
	margin-bottom: 16px;
}
.assemble-title .desc-title{
    font-size: 48px;
    margin-top: 14px;
}
.assemble-title .desc-title > span > span.word1{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char1{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char2{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char3{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char4{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char5{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char6{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char7{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char8{ color:#2fc5e7 !important;}
.assemble-title .desc-title > span > span.word3>.char9{ color:#2fc5e7 !important;}
.assemble-subhead{
    font-size: 20px;
    color: #fff;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
}
.assemble-subhead img{ width: 30px; margin:  0 3px;}
.assemble{ margin-top: 100px; width: 100%; padding: 0 40px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; justify-content:flex-start; display: flex;}
.assemble .cpimg1{ width: 60%; max-width: 1004px; position: relative;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.assemble .cpimg1 .imgw {width: 100%; height: 646px; overflow: hidden; display: flex; justify-content: center; /* 水平居中 */ align-items: center; /* 垂直居中 */}
.assemble .cpimg1 .imgw img.cpimg{ height: 646px;}
.assemble .cpimg1 img.cp-x{ width: 15px; height: 120px; position: absolute; right: -15px; top: 40px;}
.rightctc .cpimg1 img.cp-x {
		right: inherit;
		left: -15px;
}
.rightctc .assemble-con{padding-left: 0; padding-right: 90px;}
.assemble-con{
	width: 100%;
	min-width: 570px;
	max-width: 100%;
    font-size: 16px;
    color: #fff;
    text-align: left;
    padding-left: 112px;
}
.assemble-con .ctc_name{ width: 100%; font-size: 18px; color: #cbcdcd; display: flex; justify-content: left; /* 水平居中 */ align-items: center; /* 垂直居中 */}
.assemble-con .ctc_name img{ width: 41px; margin-right: 12px;}
.assemble-con h2{ width: 100%; display: block; font-size: 42px; color: #fff; padding-top: 5px; white-space: nowrap; line-height: 58px;font-weight: 400;}
.assemble-con h2 b{font-size: 50px; color: #2fc5e7; font-weight: bold;}

.assemble-con .ctc_c{ width: 100%; font-size: 17px; line-height: 46px; padding-top: 24px;}
.assemble-con .ctc_c ul,.assemble-con .ctc_c ul li{ width: 100%; display: block;white-space: nowrap;}
.assemble-con .ctc_c ul li.xbg span{ background: url(../img/ctc/tmbg.png) bottom repeat-x; background-size:100% 9px;}
.assemble-con .ctc_c ul li b{font-weight: bold;}
.assemble-con .td_img{ width: 100%; padding-top: 20px;}
.assemble-con .td_img img{ width: 100%; max-width:612px; display: block; margin-bottom: 16px;}
.rightctc .assemble-con .td_img img{max-width: 520px;}
.assemble-con .td_img span{ width: 100%; display: block; font-size: 13px; opacity: 0.3; line-height:24px; margin-top: 10px;}
/* assemble end */

.cpmore{ width: 100%; padding-top: 60px; text-align: center; margin-bottom: 60px;}
.cpmore a{ padding: 0 30px; height: 66px; line-height: 66px; border: 1px solid #404040; text-align: center; margin: 0 auto; display: inline-block; color: #fff; font-size: 22px;}
.cpmore a:hover{ color: #2fc5e7; border: 1px solid #2fc5e7;}


@media (max-width: 1660px) {
	.cpimg1{ width: 50% !important;}
	.assemble-con { width: 50% !important;}
}

@media (max-width: 992px) {
	.dy_m{ display: none !important;}
    .play-wrap{
        width: 100%;
    }
    .close{
        display: none;
    }
    .br-pc{
        display: none;
    }
    .br-phone{
        display:inline-block;
    }
    /* banner1 start */
    .banner-wrap{
        width: 100%;
        height: 7.66rem;
        background: url(../img/ctc/bg-wap.jpg) no-repeat;
        background-size: cover;
    }
    .banner-box{
        width: 100%;
        height: 100%;
        padding-top: .71rem;
    }
    
    .banner-ctc{
		padding: 0.72rem 0 0.24rem;
		font-size: 0.38rem;
	}
	.banner-ctc span{ font-size: 0.38rem;}
	.banner-ctc img{ margin-right: 0.10rem; width: 0.54rem; margin-top: -0.02rem; }
    .banner-title{ font-size: 0.88rem; }
    .banner-title span{ font-size:0.82em; color: #60daf6; font-weight: bold;letter-spacing:0.08rem;}
	.banner-title img{ width: 1.84rem;}
    .banner-con{ font-size: .38rem; padding-top: 0.12rem; }
    .banner-con img{ width: 1.65rem; margin-top: 0.1rem;}

    /* banner1 end */


    /* ctc start */
    .ctc-wrap{
        height:8.9rem;
        background: url(../img/ctc/bg2-wap.jpg) center no-repeat;
        background-size: cover;
    }
    .ctc-box{
        width: 100%;
        height: 100%;
        padding: 0 0rem;
        justify-content: left;
    }
    .ctc{
    	height: 1.42rem;
        padding-top: .18rem;
        width: auto !important; 
        margin: 0.46rem auto 0;
        line-height: 0.40rem;
        font-size: 0.17rem;
        background-size: 7.02rem 1.42rem;
    }
    .ctc-title{
        padding: 0.98rem 0 .2rem;
    }
    .ctc-subhead {font-size: 0.28rem;}
    .ctc-title .desc-title{
        font-size: .44rem;
        line-height: .5rem;
    }

    .ctc-con{
    	width: 100%;
        font-size: .18rem;
        line-height: .32rem;
    }
    .ctc-con .keynote {
	    display: block;
	    width: 100%;
	    padding-top: 0.08rem;
	    background-size: 7.21rem 1.14rem;
		height: 1.14rem;
	}
	.ctc-con .keynote span{
		letter-spacing: 0.02rem;
		font-weight: normal;
		font-size: 0.26rem;
		color: #2fc5e7;
		line-height: 0.46rem;
	}
	
	.jt_icon{margin-top: 0.12rem;}
	
	/* 应用动画到图片 */
	.blinking-image {
	  width: 0.37rem;
	}
	
	.ctc_cp{ width: 100%; text-align: center; display: flex; justify-content: space-between; margin-top: 0.26rem; padding: 0 0.26rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	.ctc_cp .cp1,.ctc_cp .cp2,.ctc_cp .cp3{ width:31%; max-width: 3.36rem; height: 1.22rem; border: 1px solid #2a445d; cursor: pointer; color: #fff; font-size: 0.18rem; line-height: 0.36rem; padding: 0.22rem 0 0 0; position: relative;}
	.ctc_cp .cp1 a,.ctc_cp .cp2 a,.ctc_cp .cp3 a{ color: #fff; font-size: 0.18rem;}
	.ctc_cp .cp1 span,.ctc_cp .cp2 span,.ctc_cp .cp3 span{ font-size: 0.26rem; color: #2fc5e7; font-weight: bold;}
	.ctc_cp .cp1 img,.ctc_cp .cp2 img,.ctc_cp .cp3 img{ position: absolute; bottom: 0; left: 30%; width: 0.86rem;}

    /* ctc end */
   
   /* 版块4 start */
    .block4-video-box{
        width: 100%;
        height: auto !important;
		min-height: auto !important;
		display: none !important;
    }
    .block4-video{
        /* min-height: 5.48rem; */
		min-height: 4.63rem;
        background: url(../img/ctc/video-wap.jpg) no-repeat;
        background-size: cover;
        background-position: center;
    }
    .block4-play{
        width: 1.16rem;
	    height: 1.16rem;
	    position: absolute;
	    top:-0.60rem;
	    right: 0;
	    bottom: 0;
	    left: 0;
	    margin: auto;
	    z-index: 3;
	    cursor: pointer;
	    user-select: none;
	    -webkit-user-drag: none;
	    display: none;
    }
   
    /* 版块4 end */
   
   /* cp-assemble start */
    .cp-assemble{
        height: 38.37rem;
        background: url(../img/ctc/cpbg-wap.jpg) top center no-repeat;
        background-size: cover;
        color: #fff;
    }
    .assemble-title{
        padding: 0.72rem 0 .2rem;
    }
    .assemble-title > span {
	    font-size: 0.26rem;
	    font-weight: initial;
	    margin-bottom: 0.16rem;
	}
    .assemble-title .desc-title{
        font-size: .44rem;
    	line-height: .5rem;
    }
    .assemble-subhead {
    font-size: 0.20rem;
    color: #fff;
    text-align: center;
	}
	.assemble-subhead img {
	    width: 0.30rem;
	    margin: 0 0.03rem;
	}
    
    .assemble{
    	width: 100%;
        margin-top: 0.46rem;
        display: inherit;
        padding: 0 0.40rem;
    }
   
    .assemble .cpimg1{ max-width:100%; width: 100% !important; position: relative;}
    .assemble .cpimg1 .imgw {
	  width: 100%;
	  height: auto;
	  overflow: hidden;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	}
	
    .assemble .cpimg1 .imgw img.cpimg{ width: 100%;  height: auto;}
    .assemble .cpimg1 img.cp-x {
	  width: 0.10rem;
	  height: 0.80rem;
	  position: absolute;
	  right: -0.10rem;
	  top: 0.40rem;
	}
	.rightctc .cpimg1 img.cp-x {
		right: inherit;
		left: -0.10rem;
	}
    .assemble-con{
        font-size:.18rem;
	    color: #fff;
	    width: 100% !important;
	    padding-left:0;
	    min-width: 100%;
		max-width: 100%;
		padding-top: 0.42rem;
    }
    .rightctc .assemble-con {
  padding-left: 0;
  padding-right: 0;
}
    .assemble-con .ctc_name{font-size: 0.19rem;}
    .assemble-con .ctc_name img {
	  width: 0.41rem;
	  margin-right: 0.12rem;
	  margin-bottom: 0.05rem;
	}
    .assemble-con h2 {
	  font-size: 0.42rem;
	  padding-top: 0.20rem;
	  line-height: 0.58rem;
	  font-weight: 400;
	}
	.assemble-con h2 b {
	  font-size: 0.50rem;
	  color: #2fc5e7;
	  font-weight: bold;
	}
	
	.assemble-con .ctc_c {
	  width: 100%;
	  font-size: 0.18rem;
	  line-height: 0.46rem;
	  padding-top: 0.24rem;
	}
	.assemble-con .ctc_c ul li.xbg span {background-size: 100% 0.09rem;}
	.assemble-con .td_img {
	  width: 100%;
	  padding-top: 0.20rem;
	}
	.assemble-con .td_img img {
	  width: 100%;
	  max-width: 6.12rem;
	  display: block;
	  margin-bottom: 0.26rem;
	}
	.rightctc .assemble-con .td_img img{max-width: 5.20rem;}
	.assemble-con .td_img span {
	  width: 100%;
	  display: block;
	  font-size: 0.14rem;
	  opacity: 0.3;
	  line-height: 0.24rem;
	  margin-top: 0.10rem;
	}
	
	.mar50{ margin-top: 0;}
    /* assemble end */
	.cpmore{ width: 100%; padding-top: 0.6rem; text-align: center; margin-bottom: 0.1rem;}
	.cpmore a{ padding: 0 0.46rem; height: 0.66rem; line-height: 0.66rem; border: 1px solid #404040; text-align: center; margin: 0 auto; display: inline-block; color: #fff; font-size: 0.22rem;}
	.cpmore a:hover{ color: #2fc5e7; border: 1px solid #2fc5e7;}
}


/*抖音号:VKOOL_China*/
.dy_m{
    width: 100px;
    height: 100px;
    position: fixed;
    right: 0;
    top: 62%;
    display: block;
    z-index: 9;
}

.dy_m img{
  cursor: pointer;
  transition: all 0.6s;
  width: 100%;
  height: 100%;
}



/* 加载GIF */

.loading {
	width      : 100%;
	height     : 100%;
	background : #000;
	position   : fixed;
	top        : 0;
	left       : 0;
	z-index    : 10001;
	line-height: 100%;
	text-align : center;
}

.loading img {
	position         : absolute;
	top              : 50%;
	left             : 50%;
	-webkit-transform: translate(-50%, -50%);
	transform        : translate(-50%, -50%);
}

.loading-wrap {
			    position: fixed;
			    width: 100%;
			    height: 100%;
			    top: 0;
			    left: 0;
			    /* background: rgba(0, 0, 0, .6); */
			    z-index: 999999;
}
.loading-box {
				position: absolute;
				width: 100px;
				height: 100px;
				border-radius: 10px;
				background-color: rgba(0, 0, 0, .3);
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
}
			
.loading-son {
				position: absolute;
				width: 40px;
				height: 40px;
				border-radius: 50%;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%) rotate(0deg);
				border-top: 3px solid #fff;
				border-right: 3px solid transparent;
				border-bottom: 3px solid transparent;
				border-left: 3px solid transparent;
				animation: roll 1.6s infinite ease-in-out;
}
@keyframes roll {
				from {
					transform: translate(-50%, -50%) rotate(0deg);
				}
			
				to {
					transform: translate(-50%, -50%) rotate(360deg);
				}
}
