@charset "utf-8";
.layui-layer {transition: none;}
/* title */
.index-title {padding-bottom: 20px; border-bottom: 1px solid #D8D8D8;}
.index-title h3 {position: relative; font-size: 36px; line-height:1.4; font-weight: bold; color: #333;}
.index-title p {position: relative; margin-top: 20px; font-size: 16px; color: #707070; 
text-transform: uppercase;
-ms-text-transform: uppercase; 
-webkit-text-transform: uppercase;}
.index-title-white h3{color: #fff;}
.index-title-white p {color: #fff;}
.index-title-center{text-align: center;}
@media (max-width:1400px) {
    .index-title h3 { font-size: 24px;}
}

@media (max-width:768px) {
    .index-title {padding-bottom: 25px;}
    .index-title h3 {font-size: 22px;}
    .index-title p { margin-top: 10px; font-size: 14px;}
}
@media (max-width:640px) {
    .index-title {padding-bottom: 15px;}
    .index-title p {font-size: 12px;}
}

.index-more {padding-top: 60px;text-align: center;}
.index-more a {position: relative;display: inline-block;padding: 0 35px;line-height: 55px; font-size: 16px;border: 1px solid #999; color: #999; border-radius: 4px;}
.index-more a i{display: inline-block; margin-left: 0; font-size: 24px; vertical-align: middle; transition: .8s; }
.index-more a:hover { background-color: #153D82; border-color:  #153D82; color: #fff; box-shadow: 0 13px 10px rgba(0, 140, 214,.4);}
.index-more a:hover i{ color: #fff; 
transform: translateX(8px);
-ms-transform: translateX(8px);
-webkit-transform: translateX(8px);}

.an-poster{position: absolute; top: 0; right: 0; z-index: 9; content: ''; width: 0; height: 100%; background-color: #f5f5f5;}
.goPoster {
	-webkit-animation-name: picPoster;
	animation-name: picPoster;
	animation-timing-function: cubic-bezier(0.46, 0.64, 0.18, 0.93);
}
@keyframes picPoster{
	0%{width: 100%;}
	100%{width: 0%;}
}

/* banner */


.index-banner{ position: fixed; top: 0; left: 0; z-index: -1; width: 100%; transition: none;}
.index-banner .swiper-slide{position: relative; transition: none;}
.index-banner-item{ position: relative; width: 100%; height: 100%; 
display: flex; 
align-items: center; 
justify-content: center; 
text-align: center;}

.index-banner-item video{ position: absolute; top: 0; left: 50%; z-index: -1; min-width: 100%; min-height: 100%; transform: translateX(-50%);}
.index-banner-item video source {margin: 0 auto; min-width: 100%; min-height: 100%;}

.index-banner-title{width: 100%; margin-top: 80px; padding: 0 15px;}
.index-banner-title img {max-width: 100%; transform:translateY(-10px); opacity:0; visibility: hidden; transition: .5s;}
.index-banner-title h3{ margin-top: 20px; font-size: 64px; color: #fff; transform:translateY(-50px); opacity:0; visibility: hidden; transition-delay: .2s; transition: .8s;line-height:1.4;}
.index-banner-title h3 span{color: #153D82;}
.index-banner-title a{ margin-top: 77px; position: relative; display: inline-block; padding: 0 60px; line-height: 56px; font-size: 24px; background-color: #fff; color: #333; border-radius: 56px;  transform:translateY(-20px); opacity: 0; transition-delay: .3s; visibility: hidden; overflow: hidden;}
.index-banner-title a span{position: relative;z-index: 1;}
.index-banner-title a::before{position: absolute; bottom: 0; left: 0;z-index: 1; content: ''; width: 100%; height: 0; background-color: #153D82; transition: .3s;}

@media(min-width:768px){
    .index-banner-title a:hover span{color: #fff;}
    .index-banner-title a:hover::before{height: 100%;}
}


.ani-slide .index-banner-title img{transform:translateY(0); opacity:1; visibility: visible;}
.ani-slide .index-banner-title h3{transform:translateY(0); opacity:1; visibility: visible;}
.ani-slide .index-banner-title a{transform:translateY(0); opacity:1;visibility: visible}

.index-banner-mb{display:none;}
.index-banner-pc{display:block;}


@media (max-width:1600px) {
	.index-banner-title h3{font-size: 48px;  line-height: 1.5;}
}

@media (max-width:1200px) {
	.index-banner-title h3{font-size: 32px;}
	.index-banner-title a{ padding: 0 40px; line-height: 45px; font-size: 18px;}
}

@media (max-width:768px) {
    .index-banner-mb{display:block;}
    .index-banner-pc{display:none;}
    
	.index-banner-title h3{font-size: 24px;}
		.index-banner-title img{width:60%!important;}
	/*#banner-video{display:none;}*/
}

.index-main{background-color: #fff; margin-top: 100%; transition: none;}



/* about */
.index-about{ padding: 60px 0; justify-content: space-between; align-items: flex-start; }
.index-about-desc{ flex: 1; padding-left:30px; line-height: 1.8; font-size: 18px;}
.index-about-desc p{color: #4C4C4C;}
.index-about-number{ background-color: #F9F9F9;}

.index-about-number-item{ position: relative; padding: 30px 50px; margin-right: 35px; color: #153D82;}
.index-about-number-item:last-child::before{position: absolute; top: 50%; left: 0; content: ''; margin-top: -40px; width: 1px; height: 80px; background-color: #D0D1D5;}
.index-about-number-item p{ margin-bottom: 10px; font-size: 24px;}
.index-about-number-item h3{ position: relative; display: inline-block; font-size: 54px;}
.index-about-number-item h3>span{ position: absolute; left:102%; top: 8px; font-size: 40px;}
.index-about-number-item sup{font-size: 24px;}
.index-about-number-item sup sup{font-size: 14px;}

.index-about-number-counter{width:100%; height:50px; text-align:center;}
.inrow{display: flex;}
.inrow>li,
.inrow span{ display:block;}
.inrow .dataOne{ width:30px; height:50px;}
.inrow .dataBoc {position: relative; width: 100%; height: 100%; overflow: hidden;}
.inrow .dataBoc .tt {position: absolute; top: 0;  left: 0; width: 100%;  height: 100%;}
.inrow .tt span{width:100%;height:100%; font-size:54px;}


.index-about-poster{ position: relative; overflow: hidden;}
.index-about-poster img{width: 100%; }
@media (max-width:1600px) {
 
}

@media (max-width:1400px) {
 
}

@media (max-width:1300px) {
 
}

@media (max-width:1200px) {
	.index-about-desc{ flex:auto;padding-left:0; width: 100%;}
	.index-about-number{text-align: ; margin: 0 auto 25px; }
	.index-about-number-item h3{font-size: 42px;}
	.index-about-number-item h3>span{ top: 0; font-size: 30px;}
	.index-about-number-item sup{font-size: 20px;}
	.inrow .dataOne{ width:23.5px; height:50px;}
	.inrow .tt span{ font-size: 42px;}
	.index-about-number-item h3{margin-right: 80px; }
}

@media (max-width:960px) {
	.index-about-number-item{ padding: 25px 30px; margin-right: 0;}
	.index-about-number{ margin-bottom: 25px; display: flex;}
	.index-about-number .index-about-number-item:last-child{margin-top: 0;}
}

@media (max-width:640px) {
	/* .index-about-number-item h3{ font-size: 32px;} */
	.index-about-number{ width:100%; margin: 0 auto 25px;  justify-content: center;}
	.index-about-number-item p{ margin-bottom: 10px; font-size: 16px;}
	.index-about-desc{ font-size: 14px;}
	.index-about-number-item{ padding: 25px 20px 10px; margin-right: 0;}
	.index-about-number-item h3{font-size: 24px;}
	.index-about-number-item h3>span{ top: -8px; font-size: 24px;}
	.index-about-number-item sup{font-size: 14px;}
	.inrow .dataOne{ width:18px; height:30px;}
	.inrow .tt span{ font-size: 24px;}
	.index-about-number-item h3{margin-right: 40px; }
}


/* solution */
.index-solution-title{ padding: 30px 0 40px;}
.index-solution-title h3{font-size: 36px; color: #153D82;}
@media (max-width:1600px) {
	.index-solution-title h3{font-size: 24px; line-height: 1.4;}
}
.index-solution{ position: relative;  background-color: #F7F9FE; overflow: hidden;}
.solution-scena {position: relative; width: 100%;height: 100%;}
.solution-scena .bd .tempWrap {width: 100% !important;}
/* 用 !important覆盖SuperSlide自动生成的宽度，这样就可以手动控制可视宽度。 */
.solution-scena .bd ul {overflow: hidden;zoom: 1;transition: none;}
.solution-scena .bd ul li {position: relative; float: left; _display: inline;}
.solution-scena .bd ul li img {width: 1600px;height: 870px;}
.solution-scena-imgs,
.solution-scena-btns{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

@media (max-width:768px){
	.solution-scena .bd ul li img{ width: 644px; height: 350px;}
}

.solution-scena-imgs{ z-index: 1;}
.solution-scena-btns{ z-index: 2;}

.solution-scena .bd ul li .solution-scena-svg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2;}
.solution-scena .bd ul li .solution-scena-svg svg{width: 100%; height: 100%;}
.svg-line{stroke-dasharray: 1000;stroke-dashoffset: 1000;animation: svgLine 10s linear infinite;}
.svg-corrugated path { opacity: 0; stroke:#FE7537; animation: svgCorrugated 1s linear infinite;}
.svg-corrugated path:nth-child(2){ animation-delay: .2s;}
.svg-corrugated path:nth-child(3){ animation-delay: .5s;}
@keyframes svgCorrugated {
	0% {
		 opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes svgLine {
	  0%{
		  stroke-dasharray:4 ,6;
		  /* stroke-dasharray: 0, 800; */
	  }
	  100%{
		  stroke-dasharray:6 ,8;
		  /* stroke-dasharray: 800, 0; */
	  }
}

.solution-scena-btns a{position: absolute; bottom: 60px ; display: inline-block; padding: 0 25px; line-height: 35px; background-color: #fff; color: #153D82; border-radius: 35px; border: 1px solid #153D82;}
.solution-scena-btns a span,
.solution-scena-btns a span::after{position: absolute; left: 50%; content: ""; width: 1px; background-color: #eee;}

.solution-scena-btns a span{ bottom: 40px ;}
.solution-scena-btns a span::after{ bottom: 0; left: 0; height: 0; transition: 1s;}

.solution-scena-btns a:hover{background-color: #153D82; color: #fff; border-color: #153D82;}
.solution-scena-btns a:hover span::after{background-color: #FE7537; height: 100%;}

.solution-scena-1 .solution-scena-btns a:nth-child(1){left: 174px;}
.solution-scena-1 .solution-scena-btns a:nth-child(2){left: 542px;}
.solution-scena-1 .solution-scena-btns a:nth-child(3){left: 742px;}
.solution-scena-1 .solution-scena-btns a:nth-child(4){left: 946px;}
.solution-scena-1 .solution-scena-btns a:nth-child(5){left: 1301px;}

.solution-scena-1 .solution-scena-btns a:nth-child(1) span{ height: 40px;}
.solution-scena-1 .solution-scena-btns a:nth-child(2) span{ height: 40px;}
.solution-scena-1 .solution-scena-btns a:nth-child(3) span{ height: 520px;}
.solution-scena-1 .solution-scena-btns a:nth-child(4) span{ height: 50px;}
.solution-scena-1 .solution-scena-btns a:nth-child(5) span{ height: 600px;}

.solution-scena-2 .solution-scena-btns a:nth-child(1){left: 800px;}
.solution-scena-2 .solution-scena-btns a:nth-child(2){left: 1100px;}

.solution-scena-2 .solution-scena-btns a:nth-child(1) span{ height: 40px;}
.solution-scena-2 .solution-scena-btns a:nth-child(2) span{ height: 40px;}

.solution-scena-3 .solution-scena-btns a:nth-child(1){left: 610px;}
.solution-scena-3 .solution-scena-btns a:nth-child(2){left: 910px;}
.solution-scena-3 .solution-scena-btns a:nth-child(3){left: 1170px;}

.solution-scena-3 .solution-scena-btns a:nth-child(1) span{ height: 40px;}
.solution-scena-3 .solution-scena-btns a:nth-child(2) span{ height: 40px;}
.solution-scena-3 .solution-scena-btns a:nth-child(3) span{ height: 40px;}

@media (max-width:768px){
	.solution-scena-btns{display: none;}
}

/* news */
.index-onews-title{ justify-content:space-between;align-items:center;}
.index-onews-title a{ display:inline-block; margin-top:20px; color:#666;}
.index-onews-title a:hover{ color:#153D82;}

@media(max-width:768px){
    .index-onews-title a{font-size:14px;}
}

.index-news-pic{ position: relative; overflow: hidden;}
.index-news-pic img{width: 100%;}
.index-news-content{ 
    justify-content: space-between;
    -ms-justify-content: space-between;
    -webkit-justify-content: space-between;
    
    flex-direction: column;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
}
.index-news-content em{font-style: normal; color: #ABABAB; font-size: 16px;}

.index-news-date span{ position: relative; display: inline-block; color: #ABABAB;}
.index-news-date span:first-child{padding-right: 10px; margin-right: 10px;}
.index-news-date span:first-child::before{position: absolute; right: 0; top: 1px; content: ''; width: 1px; height: 10px; background-color: #ABABAB;}

.index-news-title h3{ margin-top: 10px; font-size: 24px; line-height: 1.5; color: #333; overflow: hidden; }
.index-news-title p{margin-top: 30px; line-height: 20px; color: #A4A4A4;}
/*  */
.index-news-list{flex: 1; -webkit-flex:1; -ms-flex:1; padding-left: 50px; padding-top: 25px;}
.index-news-list ul li{padding: 30px 0; border-bottom: 1px solid #D8D8D8;}

.index-news-item{ 
    flex-direction: row-reverse; 
    -ms-flex-direction: row-reverse;
    -webkit-flex-direction: row-reverse;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -webkit-justify-content: space-between;
    
}
.index-news-item .index-news-pic{width: 42.6%;}
.index-news-item .index-news-content{flex: 1; -webkit-flex: 1; -ms-flex: 1; padding-right: 45px;}

/*  */
.index-news-poster{ margin-top: 50px; width: 45%; 

flex-direction: column; 
-ms-flex-direction: column;
-webkit-flex-direction: column;
justify-content: space-between;
-ms-justify-content: space-between;
-webkit-justify-content: space-between;
    
} 
.index-news-poster .index-news-content{margin-top: 40px;}
.index-news-poster .index-news-content .index-news-title h3{font-size: 36px; line-height: 1.5;}
.index-news-poster em { position: relative; margin-top:30px; display: inline-block; padding: 0 50px; line-height: 38px; font-style: normal; border: 1px solid #153D82; color: #153D82; border-radius: 40px;}

@media(min-width:768px){
    .index-news-poster em:hover{box-shadow: 0 -60px 0 #153D82 inset; color: #fff;} 
    .index-news-list ul li:hover .index-news-content em{color: #153D82;}
    .index-news-list ul li:hover{border-bottom-color: #153D82;}  
    
    .index-news-list ul li:hover h3{color: #153D82;}
	
	.index-news-pic:hover img{transform: scale(1.1);}
}


@media (max-width:1600px) {
	.index-news-poster .index-news-content .index-news-title h3{font-size: 24px;}
	.index-news-title h3{ font-size: 20px;}
}

@media (max-width:1200px) {
	.index-news-item .index-news-content{padding-right: 15px;}
	.index-news-poster .index-news-content .index-news-title h3{font-size: 20px; line-height: 1.2;}
	.index-news-title h3{ font-size: 18px; line-height: 1.2;}
	.index-news-title p{margin-top: 15px;}
}

@media (max-width:1000px) {
	.index-news{display: block;}
	.index-news-poster{ margin-top: 50px; width: 100%; display: block;} 
	.index-news-poster .index-news-content{margin-top: 20px;}
	.index-news-poster em{margin-top: 30px;}
	.index-news-list{flex: 1; padding-left: 0; }
	.index-news-item{ 
	    flex-direction: row; 
	    -ms-flex-direction: row; 
	    -webkit-flex-direction: row; 
	    justify-content: space-between; 
	    -ms-justify-content: space-between;
	    -webkit-justify-content: space-between;
	    align-items: flex-start;
	    -ms-align-items: flex-start;
	    -webkit-align-items: flex-start;
	    
	}
	.index-news-item .index-news-content{flex: 1; padding-right: 0; padding-left: 25px;}
	.index-news-content em{margin-top: 10px;}
}


@media (max-width:600px) {
	.index-news-title h3,
	.index-news-poster .index-news-content .index-news-title h3{font-size: 16px; font-weight: normal;}
	.index-news-content{ display: block; }
	.index-news-content em{ display: inline-block; margin-top: 25px;}
	  .index-news-title p{font-size: 14px;}
}

/* quality */
.index-quality{ background-color: #153D82;
    
    justify-content: space-between;
    -ms-justify-content: space-between;
    -webkit-justify-content: space-between;
    
    align-items: center;
    -ms-align-items: center;
    -webkit-align-items: center;
    
}
.index-quality-title h3{font-size: 36px;}
.index-quality-content-swiper{ padding: 8%; width: 50%;}

.index-quality-item h3{font-size: 20px; font-weight: bold; color: #fff;;}
.index-quality-item p{margin-top: 25px; font-size: 16px; line-height: 26px; color: #fff;}
.index-quality-item a{position: relative; margin-top: 80px; display: inline-block; padding: 0 50px; line-height: 40px; color: #153D82; border-radius: 40px; background-color: #fff; overflow: hidden;}
.index-quality-item a span{position: relative;z-index: 1;}
.index-quality-item a::before{position: absolute; bottom: 0; left: 0;z-index: 1; content: ''; width: 100%; height: 0; background-color: #153D82; transition: .3s;}


.index-quality-item a:hover span{color: #fff;}
.index-quality-item a:hover::before{height: 100%; opacity:.5;}

.index-quality-pic-swiper{width: 50%; position: relative;}
.index-quality-pic-swiper .swiper-slide img{width: 100%;}

/*  */
.index-quality-swiper-arr{padding: 25px 0 40px;}
.index-quality-swiper-arr .swiper-button-next,
.index-quality-swiper-arr .swiper-button-prev{position: static; top: inherit; left: inherit; right: inherit; bottom: inherit; margin: 0; background: none; width: 50px; height: 50px; border-radius: 50%; border: 1px solid #fff; justify-content:center; align-items:center;}
.index-quality-swiper-arr .swiper-button-next{margin-left: 10px;}

.swiper-button-next:after,
.swiper-button-prev:after{display: none;}

@media (max-width:1600px) {
	.index-quality-content-swiper{ padding: 0 5%;}
}

@media (max-width:1400px) {
	/* .index-quality{background-color: #fff;} */
	.index-quality-content-swiper{width: 50%;  padding:5%; }
	.index-quality-pic-swiper{width: 50%;  padding:5% 5% 5% 0; }
	.index-quality-swiper-arr{padding: 25px 0;}
	.index-quality-swiper-arr .swiper-button-next,
	.index-quality-swiper-arr .swiper-button-prev{width: 30px; height: 30px;}
}

@media (max-width:1200px) {
	.index-quality-item a{margin-top: 50px;}
}


@media (max-width: 768px) {
	.index-quality{display: block; margin-bottom: 50px;}
	.index-quality-content-swiper{width: 100%;  padding:30px; }
	.index-quality-pic-swiper{width: 100%;  padding:0; }
	.index-quality-pic-swiper{padding-top: 0;}
}