a.bor{display:inline-block; padding:12px; font-size:16px; line-height:16px; position:relative; }
a.bor>b{float:left; font-weight:normal; position:relative; z-index:1;}
a.bor>i{float:left; line-height:inherit; position:relative; z-index:1; margin-left:70px; transform:translateX(2px); transition:.3s;}
a.bor:before{position: absolute; top:-25px; bottom:-12px; right:-28px; width:90px; border-radius:50%; transition: .3s; content: ''; border:1px dashed #555;}
a.bor:hover{color:#181818;}
a.bor:hover:before{top:0; right: 0; bottom: 0; width: 100%; border-radius:0;}
a.bor:after{display: block; clear: both; padding-top:12px; width:100%; content: ''; border-bottom:1px solid #555;}
@media(max-width:1200px){
a.bor{padding:10px; font-size:15px; line-height:15px;}
a.bor>i{margin-left:50px;}
a.bor:before{top:-15px; bottom:-2px; right:-16px; width:63px;}
a.bor:after{padding-top:10px;}
}
@media(max-width:767px){
a.bor{padding:8px; font-size:14px; line-height:14px;}
a.bor>i{margin-left:30px;}
a.bor:before{top:-4px; bottom:8px; right:-4px; width:35px;}
a.bor:after{padding-top:8px;}
}

.product{padding:120px 0; overflow:hidden; position:relative;}
.product:before{position:absolute; z-index:1; width:10%; width:calc(50vw - 700px); left:0; top:0; bottom:0; content:''; background:linear-gradient(to right,#fff 5%,transparent);}
.product:after{position:absolute; z-index:1; width:10%; width:calc(50vw - 700px); right:0; top:0; bottom:0; content:''; background:linear-gradient(to left,#fff 5%,transparent);}
.product-title{display:block;}
.product-title:after{display:block; content:''; clear:both;}
.product-title>span{float:left;}
.product-title>span>em{display:block; font-style:normal; font-size:16px; color:#686868;}
.product-title>span>h2{font-size:38px;}

.product-title>a{float:right; margin-top:30px;}

.product-swiper{display:block; padding-top:60px; margin:0 -20px;}
.product-wrapper{width:10000%;}
.product-wrapper:after{display:block; content:''; clear:both;}
.product-slide{float:left; width:.3333%; padding:0 12px;}
.product-slide>aside{display:block;}
.product-slide>aside>span{display:block; margin-top:25px; padding:0 5px;}
.product-slide a.img{display:block; overflow:hidden;}
.product-slide a.img>img{display:block; width:100%;}
.product-swiper[reach="true"] .product-slide.swiper-slide-visible:not(.swiper-slide-next) a.img,
.product-swiper[reach="true"] .product-slide.swiper-slide-visible:not(.swiper-slide-next) a.img>img{transition-delay:.2s;}
.product-swiper[reach="true"] .product-slide.swiper-slide-duplicate a.img,
.product-swiper[reach="true"] .product-slide.swiper-slide-duplicate a.img>img{transition-delay:.4s;}
.product-swiper[reach="true"] .product-slide a.img:hover>img{transform:scale(1.05);}
.product-slide a.tit{font-size:20px; display:block; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.product-slide a.more{font-size:16px; display:inline-block; padding-top:5px; color:#686868;}
.product-slide a.more>b{display:inline-block; font-weight:normal; transition:.3s;}
.product-slide a.more>i{transition:.3s;}
.product-slide a.more:hover{color:#768047;}
.product-slide a.more:hover>b{transform:translateX(2px);}
.product-slide a.more:hover>i{transform:translateX(5px);}
.product-pager{display:none;}
.product-ctrl{text-align:center; margin-top:50px;}
.product-ctrl>i{cursor:pointer; width:50px; height:50px; margin:0 10px; line-height:48px; text-align:center; transition:.3s; border-radius:50%; font-size:35px; border:2px solid #bbb; color:#999;}
.product-ctrl>i:hover{color:#fff; border-color:#768047; background:#768047;}
@media(max-width:1440px){
.product:before,
.product:after{display:none;}
}
@media(max-width:1200px){
.product{padding:60px 0;}
.product-title>span>h2{font-size:32px;}
.product-swiper{padding-top:30px; margin:0 -10px;}
.product-slide{padding:0 10px;}
.product-slide>aside>span{margin-top:15px;}
.product-slide a.tit{font-size:18px;}
.product-slide a.more{font-size:15px;}
.product-ctrl{margin-top:30px;}
.product-ctrl>i{width:40px; height:40px; margin:0 5px; line-height:38px; font-size:30px;}
}
@media(max-width:992px){
.product-slide{width:.5%;}
.product-pager{display:block; text-align:center; margin-top:20px;}
.product-pager>span{display:inline-block; width:8px; height:8px; border-radius:50%; margin:0 4px; background:#686868;}
.product-pager>span.on{background:#768047;}
.product-ctrl{display:none;}
}
@media(max-width:767px){
.product{padding:20px 0;}
.product-title>span>em{font-size:14px;}
.product-title>span>h2{font-size:22px;}
.product-swiper{padding-top:15px; margin:0 -4px;}
.product-slide{padding:0 4px;}
.product-slide{width:1%;}
.product-slide>aside>span{margin-top:10px;}
.product-slide a.tit{font-size:16px;}
.product-slide a.more{font-size:14px; padding-top:0;}
.product-pager{margin-top:5px;}
.product-pager>span{width:8px; height:8px;}
}


.service{padding:120px 0; overflow:hidden; position:relative; background:#f8fafd;}
.service:before{position:absolute; z-index:1; width:10%; width:calc(50vw - 700px); left:0; top:0; bottom:0; content:''; background:linear-gradient(to right,#fff 5%,transparent);}
.service:after{position:absolute; z-index:1; width:10%; width:calc(50vw - 700px); right:0; top:0; bottom:0; content:''; background:linear-gradient(to left,#fff 5%,transparent);}
.service-title{display:block;}
.service-title:after{display:block; content:''; clear:both;}
.service-title>span{float:left;}
.service-title>span>em{display:block; font-style:normal; font-size:16px; color:#686868;}
.service-title>span>h2{font-size:38px;}
.service-title>a{float:right; margin-top:30px;}
.service-box{margin-top:50px; position:relative;}
.service-box+.service-box{margin-top:80px;}
.service-box:after{display:block; content:''; clear:both;}
.service-img{position:absolute; top:0; bottom:0; overflow:hidden; width:49%;}
.service-img:hover{cursor:none;}
.service-img:before{position:absolute; content:''; z-index:6; top:0; left:0; right:0; bottom:0; opacity:0; transition:.3s; background:#000;}
.service-img:hover:before{opacity:0.3;}
.service-img>strong{position:absolute; display:none; z-index:8; top:0; left:0; font-size:34px; line-height:1; color:#fff; white-space:nowrap;}
.service-img:hover>strong{display:block;}
.service-img>ul{display:block; width:10000%; height:100%;}
.service-img>ul>li{float:left; width:1%; height:100%; overflow:hidden; transition:.5s;}
.service-img>ul>li>img{display:block; width:100%; height:100%; object-fit:cover;}
.service-img>ol{position:absolute; z-index:8; left:0; right:0; bottom:5%; text-align:center; font-size:0;}
.service-img>ol>li{display:inline-block; width:10px; height:10px; margin:0 5px; cursor:pointer; background:#fff; border-radius:50%;}
.service-img>ol>li.on{background:#768047;}
.service-text{width:51%;}
.service-text>aside{display:block;}
.service-text>aside>h3{font-size:32px; margin-top:60px;}
.service-text>aside>p{font-size:16px; margin-top:40px;}
.service-text>aside>a{margin-top:50px;}
.service-text>span{display:block; margin-top:50px;}
.service-text>span:after{display:block; content:''; clear:both;}
.service-text>span>ins>img{display:block; height:165px;}
.service-box.s0 .service-img{left:0;}
.service-box.s0 .service-text{float:right;}
.service-box.s0 .service-text>aside{padding:0 25% 0 15%;}
.service-box.s0 .service-text>span>ins{float:right;}
.service-box.s1 .service-img{right:0;}
.service-box.s1 .service-text{float:left;}
.service-box.s1 .service-text>aside{padding:0 25% 0 0;}
.service-box.s1 .service-text>aside>ins:first-child{margin-top:50px;}
.service-box.s1 .service-text>aside>ins:first-child>img{height:185px;}
.service-box.s2 .service-img{left:0;}
.service-box.s2 .service-text{float:right;}
.service-box.s2 .service-text>aside{padding:0 20%; text-align:center;}
.service-box.s2 .service-text>aside>h3+ins{margin-top:40px; }
.service-box.s2 .service-text>aside>h3+ins>img{height:175px;}
.service-box.s3 .service-img{right:0;}
.service-box.s3 .service-text{float:left;}
.service-box.s3 .service-text>aside{padding:0 25% 0 0;}
.service-box.s3 .service-text>span{margin-bottom:30px;}
.service-box .service-text ins{display:inline-block; font-size:0; overflow:hidden;}
.service-box .service-text ins>img{transition:.8s;}
.service-box .service-text ins:hover>img{transform:scale(1.05);}
@media(max-width:1200px){
.service{padding:60px 0;}
.service-title>span>h2{font-size:32px;}
.service-text>aside>h3{font-size:28px; margin-top:40px;}
.service-text>aside>p{font-size:14px; margin-top:30px;}
.service-text>aside>a{margin-top:30px;}
.service-text>span>ins>img{height:130px;}
.service-box{margin-top:30px;}
.service-box+.service-box{margin-top:50px;}
.service-box.s0 .service-text>aside{padding:0 0 0 20px;}
.service-box.s1 .service-text>aside{padding:0 20px 0 0;}
.service-box.s2 .service-text>aside{padding:0 0 0 20px;}
.service-box.s3 .service-text>aside{padding:0 20px 0 0;}
.service-box.s1 .service-text>aside>ins:first-child{margin-top:30px;}
.service-box.s1 .service-text>aside>ins:first-child>img{height:150px;}
.service-box.s2 .service-text>aside>h3+ins{margin-top:30px;}
.service-box.s2 .service-text>aside>h3+ins>img{height:140px; }
.service-img>strong{font-size:28px;}
}
@media(max-width:767px){
.service{padding:15px 0;}
.service-title>span>em{font-size:14px;}
.service-title>span>h2{font-size:22px;}
.service-title>a{margin-top:20px;}
.service-box{margin-top:15px;}
.service-box+.service-box{margin-top:15px;}
.service-img{width:100%; position:relative; top:0; left:0; right:0; bottom:0;}
.service-img>ul>li>img{height:200px;}
.service-text{width:100%;}
.service-text ins,
.service-text>span{display:none !important;}
.service-text>aside{padding:0 !important; text-align:left !important;}
.service-text>aside>h3{font-size:20px; margin:10px 0 0;}
.service-text>aside>p{margin-top:2px;}
.service-text>aside>a{margin-top:10px;}
.service-img>strong{font-size:18px;}
}




.introduce{position:relative;  background:#768047; color:#fff;}
.introduce-image{position:absolute; width:50%; height:100%; right:0; top:0; overflow:hidden; transition:.5s;}
.introduce-image>img{display:block; width:100%; height:100%; object-fit:cover; transition:1s;}
.introduce-play{position:absolute; z-index:8; top:50%; left:50%; margin:-40px 0 0 -40px;}
.introduce-play>i{width:80px; height:80px; line-height:68px; border-radius:50%; font-size:46px; cursor:pointer; text-align:center; color:#fff; 
transition:.3s; animation:pulse 1s infinite; border:6px solid #768047; background:#768047;}
.introduce-play>i:before{position:relative; left:3px;}
.introduce-play>i:hover{background:#fff; font-size:40px; color:#768047;}
@keyframes pulse{
0% {box-shadow:0 0 0 0 #76804788;}
70% {box-shadow:0 0 0 16px transparent;}
100% {box-shadow:0 0 0 0 transparent;}
}
.introduce-box{width:42%; padding:120px 0;}
.introduce-title{display:block;}
.introduce-title:after{display:block; content:''; clear:both;}
.introduce-title>span{float:left;}
.introduce-title>span>em{display:block; font-style:normal; font-size:16px; color:#fff;}
.introduce-title>span>h2{font-size:38px;}
.introduce-box>aside{margin:40px 0; font-size:16px; color:#fafafa;}
.introduce-param{display:block;}
.introduce-param>ul{display:block;}
.introduce-param>ul:after{display:block; content:''; clear:both;}
.introduce-param>ul>li{float:left; min-width:50%; position:relative; margin:15px 0; padding:0 10px 0 40px; line-height:28px;}
.introduce-param>ul>li>i{position:absolute; left:0; top:0; width:28px; height:28px; border-radius:50%; line-height:28px; font-size:18px; text-align:center; color:#fff; background:rgba(255,255,255,.1);}
.introduce-param>ul>li>b{display:block; font-weight:normal; font-size:15px; color:#fff;}
.introduce-button{margin-top:60px;}
.introduce-button>a{display:inline-block; border-radius:6px; padding:8px 20px; font-size:16px; position:relative; overflow:hidden; color:#eee; border:1px solid rgba(255,255,255,.3);}
.introduce-button>a:after{display:block; content:''; clear:both;}
.introduce-button>a>b{float:left; font-weight:normal; position:relative; z-index:1;}
.introduce-button>a>i{float:left; line-height:inherit; position:relative; z-index:1; margin-left:10px; transform:translateX(2px); transition:.3s;}
.introduce-button>a:before{position:absolute; left:-200px; bottom:-200px; content:''; width:0; height:0; border-radius:50%; transition:.8s; background:#768047;}
.introduce-button>a:hover{color:#fff; border-color:#768047;}
.introduce-button>a:hover:before{width:500px; height:500px;}
.introduce-button>a:hover>i{transform:translateX(-3px);}
.introduce-video{position:fixed; padding:2%; top:0; right:0; bottom:0; left:0; z-index:88888888; background:rgba(0,0,0,.88);
display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-o-box; display:box; 
-webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -o-box-pack:center; box-pack:center; 
-webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -o-box-align:center; box-align:center;}
.introduce-video>aside{position:relative; max-width:100%; max-height:100%; background:#000;
display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-o-box; display:box; 
-webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -o-box-pack:center; box-pack:center; 
-webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -o-box-align:center; box-align:center;}
.introduce-video>aside>i{position:absolute; color:#fff; top:-30px; right:0; font-size:22px; cursor:pointer;}
.introduce-video>aside>video{display:block; max-width:100%; max-height:100%; max-height:calc(90vh);}
@media(max-width:1200px){
.introduce-box{padding:60px 0;}
.introduce-title>span>h2{font-size:32px;}
.introduce-box>aside{font-size:15px; margin:30px 0;}
.introduce-param>ul>li{margin:10px 0;}
.introduce-button{margin-top:40px;}
.introduce-button>a{padding:5px 15px; font-size:14px;}
}
@media(max-width:992px){
.introduce>article{position:relative;}
.introduce-play{top:100%;}
.introduce-box{padding:60px 0; width:100%;}
.introduce-image{position:static; width:100%;}
}
@media(max-width:767px){
.introduce-box{padding:20px 0;}
.introduce-box>aside{font-size:14px; margin:15px 0;}
.introduce-title>span>em{font-size:14px;}
.introduce-title>span>h2{font-size:22px;}
.introduce-param>ul>li{margin:5px 0;}
.introduce-param>ul>li>b{font-size:14px;}
.introduce-button{margin-top:20px;} 
.introduce-button>a{padding:2px 10px;}
.introduce-play{margin:-25px 0 0 -25px;}
.introduce-play>i{width:50px; height:50px; line-height:46px; font-size:32px; border-width:2px;}
.introduce-play:hover>i{font-size:28px;}
}



.info{padding:120px 0; overflow:hidden; position:relative;}
.info-title{display:block;}
.info-title:after{display:block; content:''; clear:both;}
.info-title>span{float:left; max-width:30%;}
.info-title>span>em{display:block; font-style:normal; font-size:16px; color:#686868;}
.info-title>span>h2{font-size:38px;}
.info-title>p{float:right; max-width:70%; font-size:16px; margin-top:10px; padding-top:25px; text-align:right; border-top:2px solid #d8d8d8;}
.info-pager{display:block; text-align:right; margin-bottom:20px; padding-right:30px;}
.info-pager>span{display:inline-block; width:8px; height:8px; border-radius:50%; margin:0 4px; cursor:pointer; background:#c8c8c8;}
.info-pager>span.on{background:#768047;}
.info-swiper{display:block; padding-top:15px; margin:0 -30px; overflow:hidden;}
.info-wrapper{width:10000%;}
.info-wrapper:after{display:block; content:''; clear:both;}
.info-slide{float:left; width:.3333%; padding:0 30px 50px 30px; position:relative; transition:.3s;}
.info-swiper:not(.swiper-container-horizontal) .info-slide:nth-child(2),
.info-slide.swiper-slide-next{transform:translateY(45px);}
.info-slide:before{position:absolute; top:0; left:25px; z-index:6; content:attr(data); font-size:120px; font-weight:bold; line-height:.8; color:#76804722; transition:.3s;}
.info-slide:hover:before{color:#768047cc;}
.info-slide>aside{display:block; position:relative; z-index:8; padding-top:50px;}
.info-slide>aside>h3{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.info-slide>aside>em{display:block; font-style:normal; margin-top:15px; color:#686868;}
.info-slide>aside>em:before{float:left; width:15px; height:1px; content:''; margin:12px 8px 0 0; background:#768047;}
.info-slide>aside>p{display:block; font-size:15px; height:78px; margin:10px 0 35px 0; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; color:#686868;}
.info-slide>aside>span{display:block; margin-top:15px; padding:0 5px;}
.info-slide a.img{display:block; overflow:hidden; box-shadow:0 0 8px rgba(0,0,0,.1);}
.info-slide a.img>img{display:block; width:100%; transition:.3s;}
.info-slide a.img:hover>img{transform:scale(1.05);}
.info-slide a.tit{font-size:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.info-slide a.more{font-size:16px; display:inline-block; padding-top:5px; color:#686868;}
.info-slide a.more>b{display:inline-block; font-weight:normal; transition:.3s;}
.info-slide a.more>i{transition:.3s;}
.info-slide a.more:hover{color:#768047;}
.info-slide a.more:hover>b{transform:translateX(2px);}
.info-slide a.more:hover>i{transform:translateX(5px);}
@media(max-width:1200px){
.info{padding:60px 0;}
.info-title>a{padding:5px 15px; font-size:14px;}
.info-title>span>h2{font-size:32px;}
.info-title>p{font-size:14px; margin-top:5px; padding-top:15px;}
.info-pager{margin-bottom:10px; padding-right:10px;}
.info-swiper{padding-top:10px; margin:0 -10px;}
.info-slide{padding:0 10px;}
.info-slide a.tit{font-size:18px;}
.info-slide a.more{font-size:15px;}
.info-ctrl{margin-top:30px;}
.info-ctrl>i{width:40px; height:40px; margin:0 5px; line-height:38px; font-size:30px;}
}
@media(max-width:992px){
.info-title>p br{display:none;}
.info-slide{width:.5%;}
.info-ctrl{display:none;}
}
@media(max-width:767px){
.info{padding:20px 0; overflow:hidden;}
.info-title>span>em{font-size:14px;}
.info-title>span>h2{font-size:22px;}
.info-title>a{padding:0 8px; margin-top:20px; border-radius:88px;}
.info-title>a>b{display:none;}
.info-title>a>i{margin-left:0; transform:translateX(0);}
.info-title>p{display:none;}
.info-swiper{padding-top:0; margin:0 -4px; overflow:visible;}
.info-slide{padding:0 4px;}
.info-slide{width:1%;}
.info-slide>aside{padding-top:35px;}
.info-slide>aside>span{margin-top:10px;}
.info-slide>aside>em{margin-top:10px;}
.info-slide>aside>p{font-size:14px; height:74px; margin:10px 0 20px 0;}
.info-slide a.tit{font-size:16px;}
.info-slide a.more{font-size:14px; padding-top:0;}
.info-slide:before{font-size:90px;}
.info-pager{margin-top:-35px; margin-bottom:20px; padding-right:4px;}
.info-pager>span{width:6px; height:6px; margin:0 3px;}
}