@charset "utf-8";
#canvas{position: absolute;top: 0;left: 0;z-index: -1}
.banner{ position:relative;overflow:hidden;width: 100%;height: auto;z-index: 3}
.banner img{width: 100%;height: auto;}
.banner .swiper-slide{opacity: 0!important}
.banner .swiper-slide-active{opacity: 1!important}
.banner .bPrev{position: absolute;width: 65px;height: 80px;background: url(bPrev.png) no-repeat;top: 50%;margin-top: -40px;left: 100px;z-index: 9;display: block;}
.banner .bNext{position: absolute;width: 65px;height: 80px;background: url(bNext.png) no-repeat;top: 50%;margin-top: -40px;right: 100px;z-index: 9;display: block;}
#bannerpagination{position: absolute; left:0;bottom:10%;height:8px;width: 100%; z-index:980;display: none}
#bannerpagination{width: 100%;height:8px;text-align: center;}
#bannerpagination .swiper-pagination-bullet{display: inline-block;background:#ffffff;width:72px; height:6px;text-indent:99999px; overflow:hidden; margin:0 4px;cursor: pointer;transition: all 0.5s;opacity: 1;border-radius: 0}
#bannerpagination .swiper-pagination-bullet-active{background: #b81f30;}

.sj-banner{ position:relative;overflow:hidden;width: 100%;height: auto;z-index: 3;display: none}
.sj-banner img{width: 100%;height: auto;}
#sjpagination{position: absolute; left:0;bottom:10%;height:8px;width: 100%; z-index:980;display: block;}
#sjpagination{width: 100%;height:8px;text-align: center;}
#sjpagination .swiper-pagination-bullet{display: inline-block;overflow:hidden; margin:0 4px;cursor: pointer;transition: all 0.5s;opacity: 1;background: #fff}
#sjpagination .swiper-pagination-bullet-active{background: #1f4789}

@media screen and (max-width: 750px){
	.banner{display: none}
	.sj-banner{display: block;}
}


.topShow{background: #f7f8fa}
.topShow ul li{display: table-cell;width: 433px;box-sizing: border-box;border-left: 1px solid #e4e4e4;padding: 36px 0 36px 22px}
.topShow ul li:last-child{border-right: 1px solid #e4e4e4}
.topShow ul li .icon{float: left;margin-right: 14px}
.topShow ul li .h{font-size: 18px;color: #333333}
.topShow ul li .p{font-size: 16px;color: #666666;}

@media screen and (max-width: 1340px){
	.topShow ul li{padding: 15px 0 15px 10px}
	.topShow ul li .h{font-size: 16px}
	.topShow ul li .p{font-size: 13px}
}
@media screen and (max-width: 1024px){
	.topShow ul li{padding: 10px 0 10px 0}
	.topShow ul li .icon{display: none}
	.topShow ul li .h{font-size: 14px}
	.topShow ul li{text-align: center;}
	.topShow ul li .p{font-size: 14px;}
}
@media screen and (max-width: 750px){
	.topShow ul li .icon{display: inline-block;float: unset;margin-right: 0}
	.topShow ul li .icon img{width: 60%;height: auto;}
	.topShow ul li .p{display: none}
}
@media screen and (max-width: 340px){
	
}

.topArea{text-align: center;}
.topArea .or{color: #ff5a00}
.topArea .h{font-size: 35px;color: #333333;font-weight: bold;display: inline-block;position: relative;}
.topArea .h:before{content: '';position: absolute;width: 40px;height: 4px;background: #ff5a00;right: -70px;top: 50%;margin-top: -2px}
.topArea .h:after{content: '';position: absolute;width: 40px;height: 4px;background: #ff5a00;left: -70px;top: 50%;margin-top: -2px}
.topArea .p{font-size: 18px;color: #666666;margin-top: 6px}

@media screen and (max-width: 1340px){
	.topArea .h{font-size: 30px}
}
@media screen and (max-width: 1024px){
	
}
@media screen and (max-width: 750px){
	.topArea .h{font-size: 20px}
	.topArea .p{font-size: 14px;margin-top: 0}
}
@media screen and (max-width: 340px){
	
}

.s1{padding: 62px 0 80px}
.s1 .s1-c{margin-top: 100px}
.s1 .s1-c ul li{float: left;width: 240px;margin-right: 25px;transition: all .5s ease;}
.s1 .s1-c ul li:last-child{margin-right: 0}
.s1 .s1-c ul li a{display: block;padding: 38px 20px 42px;text-align: center;border-radius: 5px;background: linear-gradient(to bottom,#fff,#fff);box-shadow: 0 0 27px rgba(0,0,0,.1);}
.s1 .s1-c ul li:nth-child(1) a{border-top: 3px solid #fad15d;}
.s1 .s1-c ul li:nth-child(2) a{border-top: 3px solid #7aecfd;}
.s1 .s1-c ul li:nth-child(3) a{border-top: 3px solid #4997f9;}
.s1 .s1-c ul li:nth-child(4) a{border-top: 3px solid #f25d44;}
.s1 .s1-c ul li:nth-child(5) a{border-top: 3px solid #be79f3;}
.s1 .s1-c ul li:hover{transform: translateY(-20px);}
.s1 .s1-c ul li:hover a{background: linear-gradient(to bottom,#0063ff,#3ee6ff);}
.s1 .s1-c ul li .icon{display: inline-block;position: relative;}
.s1 .s1-c ul li .icon .img1{opacity: 1;transition: all .5s ease;}
.s1 .s1-c ul li .icon .img2{position: absolute;top: 0;left: 0;opacity: 0;transition: all .5s ease;}
.s1 .s1-c ul li .h{font-size: 18px;color: #333333;margin-top: 6px;transition: all .5s ease;}
.s1 .s1-c ul li .cont{font-size: 15px;color: #666666;line-height: 26px;height: 78px;overflow: hidden;margin-top: 35px;transition: all .5s ease;}
.s1 .s1-c ul li:hover .h{color: #fff}
.s1 .s1-c ul li:hover .cont{color: #fff}
.s1 .s1-c ul li:hover .icon .img1{opacity: 0}
.s1 .s1-c ul li:hover .icon .img2{opacity: 1}
.s1 .go-more{width: 203px;height: 53px;line-height: 53px;text-align: center;font-size: 16px;color: #fefefe;display: block;background: linear-gradient(to right,#0063ff,#00bcfa);border-radius: 40px;overflow: hidden;margin: 96px auto 0 auto}

@media screen and (max-width: 1340px){
	.s1{padding: 50px 0 60px}
	.s1 .s1-c{margin-top: 50px}
	.s1 .s1-c ul li{width: 188px;margin-right: 15px}
	.s1 .s1-c ul li .cont{height: 96px;line-height: 24px;}
	.s1 .go-more{margin-top: 30px}
}
@media screen and (max-width: 1024px){
	.s1 .s1-c ul li{width: 32%;margin-right: 1.5%;margin-bottom: 20px}
	.s1 .s1-c ul li:nth-child(3){margin-right: 0}
}
@media screen and (max-width: 750px){
	.s1{padding: 30px 0 35px}
	.s1 .s1-c{margin-top: 30px}
	.s1 .s1-c ul li{width: 100%;margin-right: 0!important}
	.s1 .s1-c ul li .icon{width: 25%;height: auto;display: table-cell;vertical-align: middle;margin-right: 2%}
	.s1 .s1-c ul li .icon img{width: 100%;height: auto;}
	.s1 .s1-c ul li .h{font-size: 14px}
	.s1 .s1-c ul li .txt{display: table-cell;vertical-align: middle;}
	.s1 .s1-c ul li .txt .cont{height: auto;margin-top: 0;text-align: left;}
	.s1 .s1-c ul li a{padding: 10px 2% 14px}
	.s1 .go-more{padding: 10px 0;height: auto;line-height: unset;}
}
@media screen and (max-width: 340px){
	.s1{}
}

.s2{padding: 126px 0 85px;background: url(bg_01.jpg) no-repeat top center;background-size: cover;}
.s2 .s2-a{}
.s2 .s2-a .leftArea{float: left;width: 585px;padding-top: 16px}
.s2 .s2-a .leftArea .h a{font-size: 35px;color: #fefefe;font-weight: bold;}
.s2 .s2-a .leftArea .p{font-size: 24px;color: #ffffff;margin-top: 12px;}
.s2 .s2-a .leftArea .cont{font-size: 16px;color: #fefefe;line-height: 28px;margin-top: 36px}
.s2 .s2-a .leftArea .go-more{font-size: 14px;color: #fefefe;padding-left: 46px;background: url(arrow.png) no-repeat 8px center;margin-top: 60px;display: inline-block;}
.s2 .s2-a .rightArea{float: right;width: 620px;height: 345px;}
.s2 .s2-b{margin-top: 78px;background: #fff;border-radius: 5px;overflow: hidden;}
.s2 .s2-b ul{display: block;text-align: center;}
.s2 .s2-b ul li{text-align: center;padding: .44rem 0 .3rem;display: inline-block;margin: 0 80px}
.s2 .s2-b ul li .h{font-size: 18px;color: #666666;}
.s2 .s2-b ul li .h .num{font-size: 83px;color: #009cff;position: relative;margin-right: 5px}
.s2 .s2-b ul li .p{font-size: 18px;color: #666666;margin-top: 12px}
.s2 .s2-b ul li.up .h .num:after{position: absolute;content: '';width: 28px;height: 38px;right: -32px;top: 0;background: url(up.png) no-repeat;background-size: contain;}
.s2 .s2-b ul li.down .h .num:after{position: absolute;content: '';width: 28px;height: 38px;right: -32px;top: 0;background: url(down.png) no-repeat;background-size: contain;}

@media screen and (max-width: 1340px){
	.s2 .s2-a .leftArea{width: 480px;padding-top: 0}
	.s2 .s2-a .leftArea .h a{font-size: 22px;}
	.s2 .s2-a .leftArea .p{font-size: 18px}
	.s2 .s2-a .leftArea .cont{font-size: 14px;line-height: 24px;margin-top: 20px}
	.s2 .s2-a .leftArea .go-more{margin-top: 45px}
	.s2 .s2-a .rightArea{width: 500px;height: auto;}
	.s2 .s2-a .rightArea video{width: 100%;height: auto;}
	.s2 .s2-b{margin-top: 30px}
	.s2 .s2-b ul li{margin: 0 55px}
	.s2 .s2-b ul li .h .num{font-size: 55px;}
	.s2 .s2-b ul li .p{font-size: 16px;margin-top: 0}
}
@media screen and (max-width: 1024px){
	.s2{padding: 85px 0 50px}
	.s2 .s2-a .leftArea{width: 45%}
	.s2 .s2-a .rightArea{width: 50%}
	.s2 .s2-b ul li{margin: 0 .83rem}
}
@media screen and (max-width: 750px){
	.s2{padding: 40px 0 30px}
	.s2 .s2-a .leftArea{float: unset;width: 100%}
	.s2 .s2-a .leftArea .h a{font-size: 18px}
	.s2 .s2-a .leftArea .p{margin-top: 8px;}
	.s2 .s2-a .leftArea .cont{margin-top: 12px}
	.s2 .s2-a .leftArea .go-more{margin-top: 20px}
	.s2 .s2-a .rightArea{float: unset;width: 100%;margin-top: 20px;height: auto;}
	.s2 .s2-b ul li{margin: 0 .45rem}
	.s2 .s2-b ul li .h{font-size: 14px;}
	.s2 .s2-b ul li .h .num{font-size: 28px}
	.s2 .s2-b ul li.up .h .num:after{width: .35rem;height: .45rem;right: -.32rem;}
	.s2 .s2-b ul li.down .h .num:after{width: .35rem;height: .45rem;right: -.32rem}
	.s2 .s2-b ul li .p{font-size: 14px}
}
@media screen and (max-width: 475px){
	.s2 .s2-b ul li{width: 50%;float: left;margin: 0}
}

.s3{padding: 78px 0 64px}
.s3 .s3-c{}
.s3 .s3-c .gallery-top{}
.s3 .s3-c .gallery-top .swiper-slide{box-sizing: border-box;padding: 115px 226px 115px 95px}
.s3 .s3-c .gallery-top .pic{padding: 6px;background: #fff;border-radius: 100%;overflow: hidden;float: left;box-shadow: 0 0 21px rgba(0,0,0,.1);margin-top: .2rem}
.s3 .s3-c .gallery-top .pic img{display: block;width: 140px;height: 140px;border: 1px solid #f5f5f5;border-radius: 100%;overflow: hidden;}
.s3 .s3-c .gallery-top .txt{float: right;width: 700px;position: relative;}
.s3 .s3-c .gallery-top .txt:before{content: '';position: absolute;left: -1rem;top: -.3rem;width: .50rem;height: .40rem;background: url(ico_01.png) no-repeat;background-size: contain;}
.s3 .s3-c .gallery-top .txt:after{content: '';position: absolute;right: -1.4rem;bottom: -.3rem;width: .50rem;height: .40rem;background: url(ico_02.png) no-repeat;background-size: contain;}
.s3 .s3-c .gallery-top .txt .h{padding-left: 40px;background: url(dp.png) no-repeat left center;}
.s3 .s3-c .gallery-top .txt .h a{font-size: 24px;color: #333333}
.s3 .s3-c .gallery-top .txt .p{font-size: 18px;color: #ff5a00;margin-top: 10px;padding-left: 32px}
.s3 .s3-c .gallery-top .txt .cont{font-size: 16px;color: #666666;line-height: 29px;margin-top: 12px;padding-left: 32px}
.s3 .s3-c .gallery-thumbs{margin: 0 55px;background: #fff;}
.s3 .s3-c .gallery-thumbs .swiper-slide{cursor: pointer;}
.s3 .s3-c .gallery-thumbs .swiper-slide img{width: 100%;height: auto;}
.s3 .s3-c .swiper-button-next{background: url(next.png) no-repeat;background-size: contain;z-index: 9;opacity: 1;cursor: pointer;right: 10px}
.s3 .s3-c .swiper-button-prev{background: url(prev.png) no-repeat;background-size: contain;z-index: 9;opacity: 1;cursor: pointer;left: 10px}

@media screen and (max-width: 1340px){
	.s3{padding: 58px 0 50px}
	.s3 .s3-c .gallery-top .swiper-slide{padding: 1.15rem 2.26rem 1.15rem .95rem}
	.s3 .s3-c .gallery-top .txt{width: 540px}
}
@media screen and (max-width: 1024px){
	.s3 .s3-c .gallery-top .txt{width: 10.5rem}
}
@media screen and (max-width: 750px){
	.s3{padding: 30px 0 40px}
	.s3 .s3-c .gallery-top .pic{float: unset;width: 3.6rem;margin: 0 auto 10px auto}
	.s3 .s3-c .gallery-top .pic img{width: 100%;height: auto;}
	.s3 .s3-c .gallery-top .txt{float: unset;width: 100%}
	.s3 .s3-c .gallery-top .txt .p{margin-top: 5px}
	.s3 .s3-c .gallery-top .txt .cont{margin-top: 5px}
}
