﻿@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{overflow-x:hidden;color:#333;font:14px/30px 'kanitregular', "Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;background:#fff;}
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;}
input[type=text],input[type=submit],textarea,button{-webkit-border-radius:0;font-family:'kanitregular', "Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;-webkit-appearance:none;}
input:focus{outline:0;}
textarea{resize:none;}
h1,h2,h3,h4,h5,h6{font-style:normal;font-size:100%;}
abbr,em,i,li,ol,ul{list-style-type:none;font-style:normal;}
img{border:0;vertical-align:middle;}
table{border-collapse:collapse;border-spacing:0;}
.clearfix{display:block;zoom:1;}
.clearfix:before{display:table;content:"";}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:"";}
* html .clearfix{height:1%;}
*{box-sizing:border-box;}
a{color:#333;text-decoration:none;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
a:hover{color:#8ac53f;text-decoration:none;}
.hide,.none,ins{display:none;}
.fl{float:left;display:inline-block;}
.fr{float:right;display:inline-block;}
.wrap{clear:both;display:block;margin:0 auto;max-width:1440px;width:100%;padding:0 0}
.animate img{position:relative;opacity:1;-webkit-transition:.5s all;-moz-transition:.5s all;-o-transition:.5s all;transition:.5s all;-webkit-transform:scale(1,1) rotate(0);-ms-transition:.5s all;}
a:hover .animate img{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.animate img:hover{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.tran,.tran a,a.tran,.tran img{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
.rotate,.rotate2 img{-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
a:hover .rotate,a:hover rotate2 img{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
.bor_box::after,.bor_box::before{pointer-events:none;}
.bor_box::after,.bor_box::before{position:absolute;top:20px;right:20px;bottom:20px;left:20px;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;}
.bor_box::before{border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1);}
.bor_box::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0);}
a:hover .bor_box::after,a:hover .bor_box::before{opacity:.7;-webkit-transform:scale(1);transform:scale(1);}

@font-face{
	
	src:url('../fonts/quicksand.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}
@font-face{
	font-family:"din";
	src:url("../fonts/din-medium.woff") format("woff"),
		url("../fonts/din-medium.ttf") format("truetype"),
		url("../fonts/din-medium.eot") format("embedded-opentype"),
		url("../fonts/din-medium.svg") format("svg");
	font-weight:normal;
	font-style:normal;
}
@font-face{
    font-family:'Stolzl';
    src:url('../fonts/Stolzl-Regular.eot');
    src:url('../fonts/Stolzl-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Stolzl-Regular.woff2') format('woff2'),
        url('../fonts/Stolzl-Regular.woff') format('woff'),
        url('../fonts/Stolzl-Regular.ttf') format('truetype');
    font-weight:normal;
    font-style:normal;
}



#header{width:100%;position:fixed;left:0;top:0;z-index:9999;width:100%; padding:0 5%}
#header{display:flex;justify-content:space-between;align-items:center;height:80px;}
#header .logo img{height:60px}
#header .logo img.green{display:none}
#header .right{display:flex;justify-content:flex-end;align-items:center;gap:0 150px;}
#header .right .nav ul{display:flex;align-items:center;gap:0 50px}
#header .right .nav ul li{ position:relative}
#header .right .nav ul li{ position:relative}
#header .right .nav ul li h3 a{font-size:18px; font-weight:normal;color:#fff;position:relative;display:flex;align-items:center;line-height:40px}
#header .right .nav ul li h3 a i{ font-size:12px; opacity:.9; margin-left:5px}
#header .right .nav ul li h3 a:before{content:"";position:absolute;background-color:#fff;height:1px;width:0;top:0;right:0;transition:all 300ms ease-in-out;}
#header .right .nav ul li h3 a:after{content:"";position:absolute;background-color:#fff;height:1px;width:0;bottom:0;left:0;transition:all 300ms ease-in-out;}
#header .right .nav ul li h3 a:hover:before{width:100%}
#header .right .nav ul li h3 a:hover:after{width:100%}
#header .right .nav ul li.on h3 a:before{width:100%}
#header .right .nav ul li.on a:after{width:100%}
#header .right .nav ul li.active h3 a:before{width:100%}
#header .right .nav ul li.active a:after{width:100%}
#header .right .nav ul li .sub{display:none;position:absolute;left:50%;top:40px; margin-left:-70px;z-index:99;}
#header .right .nav ul li .sub dl{padding:10px 0 20px 0;width:140px; margin-top:30px;background:#fff;box-shadow: 0 2px 10px 0 rgba(28,28,28,.1); position:relative}
#header .right .nav ul li .sub dl::before{content:'';display:block;width:0;height:0;border:10px solid transparent;border-bottom:10px solid #fff;position:absolute;left:50%;transform:translateX(-50%);top:-15px;}
#header .right .nav ul li .sub dl dd a{padding:10px 0;display:block;line-height:1.5; text-align:center}
#header .right .nav ul li .sub dl dd a:hover{background:#8ac53f;color:#fff;}
#header .right .lan{position:relative;height:80px;display:flex;align-items:center;justify-content:flex-end;}
#header .right .lan .title{display:flex;justify-content:center;align-items:center;gap:0 5px;border:2px solid #fff;border-radius:60px;color:#fff;padding:0 20px; cursor:pointer}
#header .right .lan .title span{}
#header .right .lan .title i{line-height:1;}
#header .right .lan .title i.fa-globe-americas{font-size:20px;}
#header .right .lan .title i.fa-chevron-down{font-size:12px;}
#header .right .lan .sub{display:none;position:absolute;width:100%;right:0;top:80px;z-index:99;}
#header .right .lan .sub dl{background:#fff;box-shadow: 0 2px 10px 0 rgba(28,28,28,.1);margin-top:10px; position:relative}
#header .right .lan .sub dl::before{content:'';display:block;width:0;height:0;border:10px solid transparent;border-bottom:10px solid #fff;position:absolute;left:50%;transform:translateX(-50%);top:-15px;}
#header .right .lan .sub dl a{display:block;text-align:center;padding:5px 0;}
#header .right .mnav{display:none}
#header.active{background:#fff;box-shadow: 0 2px 10px 0 rgba(28,28,28,.1);}
#header.active .logo img.green{display:block}
#header.active .logo img.whrite{display:none}
#header.active .right .nav ul li a{color:#333}
#header.active .right .lan .title{background:#258bd6}
#header.active .right .nav ul li a:before{background-color:#666;}
#header.active .right .nav ul li a:after{background-color:#666;}
#header.active2{background:#fff;box-shadow: 0 2px 10px 0 rgba(28,28,28,.1);}
#header.active2 .logo img.green{display:block}
#header.active2 .logo img.whrite{display:none}
#header.active2 .right .nav ul li a{color:#333}
#header.active2 .right .lan .title{background:#258bd6}
#header.active2 .right .nav ul li a:before{background-color:#666;}
#header.active2 .right .nav ul li a:after{background-color:#666;}

#banner{width:100%; background:#04161f;}
#banner .focus{position:relative;overflow:hidden;}
#banner .focus .swiper-slide{position:relative;height:100vh;}
#banner .focus .swiper-slide .img{width:100%;height:100%;}
#banner .focus .swiper-slide .img img{width:100%;height:100%;object-fit:cover;}
#banner .focus .swiper-slide video{width:100%;height:100%;object-fit:cover;}
#banner .focus .swiper-slide .info{position:absolute;left:0;top:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;}
#banner .focus .swiper-slide .info .text{text-align:center}
#banner .focus .swiper-slide .info .text .circle{display:block;width:580px;border-radius:50%;border:1px solid rgba(255,255,255,.6);position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);aspect-ratio:1 / 1;}
#banner .focus .swiper-slide .info .text .circle i{display:block;width:100%;height:100%;border-radius:50%;animation:circle linear 10s infinite;}
#banner .focus .swiper-slide .info .text .circle i::before{content:'';display:block;width:15px;height:15px;background-color:#8ac53f;position:absolute;left:50%;top:-7.5px;border-radius:50%;transform:translateX(-50%);}
#banner .focus .swiper-slide .info .text .title{font-size:80px;line-height:1;font-weight:700;color:#fff;text-shadow:0 2px 24px rgba(0, 0, 0, .5); font-family:"Stolzl"}
#banner .focus .swiper-slide .info .text .intro{font-size:80px;line-height:1;font-weight:700;color:#fff;margin-top:20px;text-shadow:0 2px 24px rgba(0, 0, 0, .5); font-family:"Stolzl"}
#banner .focus .swiper-pagination-bullet{width:8px;height:8px;border-radius:10px;background:#fff;opacity:.9;margin:0 5px;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#banner .focus .swiper-pagination-bullet-active{background:#8ac53f;width:30px}

.stitle{display:flex;justify-content:space-between;;align-items:center;}
.stitle .left h2{ font-size:34px; line-height:1; position:relative;}
.stitle .left h2::before{content:'';display:block;width:30px;height:5px;background:#8ac53f;position:absolute;right:-20px;bottom:0;}
.stitle .right{ font-size:16px}
.stitle .right i{ margin-left:5px; color:#258bd6}

.more span{background:#8ac53f;color:#fff;border-radius:40px;display:inline-block;padding:5px 20px;}
.more span{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
.more span i{margin-left:5px;}
.more span:hover{ background:#258bd6}
.more2 span{background:#fff; color:#8ac53f}

#tech{ width:100%; padding:50px 0}
#tech .list{padding-top:40px}
#tech .list ul{display: flex;flex-wrap:wrap;gap:30px}
#tech .list ul li{ width:calc((100% - 60px) / 3)}
#tech .list ul li .img{ overflow:hidden; border-radius:6px}
#tech .list ul li .img img{ width:100%}
#tech .list ul li .info{ margin-top:20px; text-align:center}
#tech .list ul li .info .title{ font-size:18px; font-weight:700}
#tech .list ul li .info .desc{ line-height:1.8; margin-top:10px; color:#666}
#tech .list ul li .info .desc{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}
#tech .list ul li .info .more{ margin-top:20px}
#tech .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}
#tech .list ul li:hover .info .more span{ background:#258bd6}

#about{ width:100%; position:relative; background:#8ac53f;}
#about .left{ width:50%; padding:100px 0 150px}
#about .left .text{ padding-right:20%}
#about .left .text .title{ font-size:46px; color:#fff; font-weight:700; line-height:1}
#about .left .text .dhimg{ margin-top:30px;}
#about .left .text .desc{ font-size:30px; color:#fff;line-height:1; position:relative; margin-top:-20px}
#about .left .text .content{ font-size:16px; color:#fff; opacity:.9; line-height:1.8; margin-top:30px}
#about .left .text .more{ margin-top:30px}
#about .left .count{ margin-top:80px;display: flex;gap:0 10px}
#about .left .count .item{ width:calc((100% - 40px) / 5);background: linear-gradient(0deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); border-radius:10px; padding:15px 0; text-align: center}
#about .left .count .item:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}
#about .left .count .item .num{ display:flex;justify-content:center;;align-items:flex-end}
#about .left .count .item .num big{ font-size:66px; color:#fff; font-family:"din"; font-weight:700; line-height:1}
#about .left .count .item .num small{ font-size:16px; color:#fff; line-height:1.5; margin-left:5px}
#about .left .count .item .desc{ color:#fff; margin-top:10px;}
#about .right{ position:absolute; right:0; top:0; height:100%; overflow:hidden; width:48%}
#about .right .bgimg img{ opacity:.2; width:100%}
#about .right .img {position: absolute;right: 0;top: 0;aspect-ratio: 1049 / 849;-webkit-mask: url(../images/icon2.png);-webkit-mask-size: cover;transform: scale(0.98);transform-origin: right top;overflow: hidden;} 
#about .right .img img{ max-width:100%; height:120%;animation: movepoint 10s infinite; position:relative; top:-50px;object-fit:cover}
#about .right .text{ color:#fff; font-size:80px; font-weight:700; position:absolute; left:20%; bottom:40px; line-height:1; font-family:"Stolzl";animation: movetext 2s infinite;}

#hezuo{ width:100%; background:#8ac53f; padding:0 0 80px}
#hezuo ul{display:flex;justify-content:space-between;;align-items:center;}
#hezuo ul li img{ height:70px}
#hezuo ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}

#news{ width:100%; padding:50px 0}
#news .list{padding-top:40px}
#news .list  ul{display: flex;flex-wrap:wrap;gap:30px}
#news .list  ul li{ width:calc((100% - 60px) / 3)}
#news .list  ul li .img{border-radius:6px;overflow:hidden;}
#news .list  ul li .img img{width:100%;}
#news .list  ul li .info{margin-top:30px;}
#news .list  ul li .info time{color:#666;}
#news .list  ul li .info .title{font-size:16px;font-weight:700;line-height:1.4; margin-top:10px}
#news .list  ul li .info .title{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical}
#news .list  ul li .info .desc{ margin-top:10px; line-height:1.6; color:#666}
#news .list  ul li .info .desc{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}
#news .list  ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}

#footer{ width:100%; background: url(../images/bg_footer.jpg) center center no-repeat; background-size:cover}
#footer .map{ padding:40px 0;display: flex;justify-content:space-between ; }
#footer .map .logo img{ width:150px}
#footer .map .item h3{ font-size:16px; color:#fff; margin-bottom:10px}
#footer .map .item .contact{ color:#fff; line-height:1.7;}
#footer .map .item.qrcode{ color:#fff; margin-top:10px; text-align:center}
#footer .map .item.qrcode img{ width:140px}
#footer .map .item p{ line-height:2}
#footer .map .item p a{ color:#fff;}
#footer .map .item .input .text{ border:0; width:300px; line-height:40px; background:#fff; display: block; margin-bottom:10px; text-indent:10px}
#footer .map .item .input .btn{ border:0; line-height:40px; color:#fff; background:#e00d1c; padding: 0 10px}
#footer .copyright{ padding:15px 0;display: flex;justify-content:space-between ; border-top:1px solid rgba(255,255,255,.2) }
#footer .copyright .left{ color:#fff}
#footer .copyright .left a{ color:#fff; margin-left:10px}
#footer .copyright .right{display: flex;}
#footer .copyright .right a{ color:#fff; margin-left:10px}

@media (max-width:1440px){
	#header{padding:0 20px}
	.wrap{ padding:0 20px}
}
@media (max-width:1200px){
	#header .right{display:flex;justify-content:flex-end;align-items:center;gap:0 50px;}
	#header .right .nav ul{display:flex;align-items:center;gap:0 30px}
}
@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}
	.wrap{ padding:0}
	#header{padding:0 .25rem}
	#header{height:1rem;}
	#header .logo img{height:.6rem}
	#header .right{gap:0 .4rem;}
	#header .right .nav{position: absolute;background:#fff;height:auto;min-height:100vh;width:100%;top:1rem;z-index:105;padding:.1rem .25rem 0;transform:translatex(100%);left:0;border-top:1px solid #eee;}
	#header .right .nav ul{display:block;}
	#header .right .nav ul li{ position:relative}
	#header .right .nav ul li h3 a{font-size:.24rem;color:#333;line-height:.8rem; border-bottom:1px solid #eee;justify-content:space-between;}
	#header .right .nav ul li h3 a i{ font-size:.22rem; opacity:.5; margin-left:0}
	#header .right .nav ul li h3 a:before{background-color:#8ac53f;}
	#header .right .nav ul li h3 a:after{background-color:#8ac53f;}
	#header .right .nav ul li h3 a:hover{ color:#8ac53f; font-weight:700}
	#header .right .nav ul li .sub{display:none;position: inherit;left:0;top:0; margin-left:0;}
	#header .right .nav ul li .sub dl{padding:.2rem 0;width: auto; margin-top:0;box-shadow: 0 0 0 0;}
	#header .right .nav ul li .sub dl::before{ display:none}
	#header .right .nav ul li .sub dl dd a{padding:0 .2rem; line-height:.7rem; font-size:.24rem;border-bottom:1px solid #eee;  text-align:left; color:#888}
	#header .right .nav ul li .sub dl dd a:hover{background: none;color:#8ac53f;}
	#header .right .nav.isopen{transform:translatex(0);display:block;}
	#header .right .lan{height:1rem;}
	#header .right .lan .title{gap:0 .1rem;border-radius:.6rem;padding:0 .15rem; font-size:.2rem; line-height:.34rem}
	#header .right .lan .title i.fa-globe-americas{font-size:.2rem;}
	#header .right .lan .sub{top:1rem;}
	#header .right .lan .sub dl{margin-top:.1rem;}
	#header .right .lan .sub dl a{padding:.05rem 0; font-size:.2rem}
	#header .right .mnav{display:none}
	#header .right .mnav{position:relative;display:block;width:.34rem;height:.25rem;cursor:pointer;}
	#header .right .mnav span{position:absolute;display:block;width:.34rem;height:.05rem;background:#fff;transition:all .5s;border-radius:.05rem}
	#header .right .mnav .s1{top:0;}
	#header .right .mnav .s2{top:.1rem;width:.26rem;}
	#header .right .mnav .s3{top:.2rem;}
	#header .right .mnav.isopen .s1{top:.1rem;transform:rotate(45deg);}
	#header .right .mnav.isopen .s2{width:0;opacity:0;}
	#header .right .mnav.isopen .s3{top:.1rem;transform:rotate(-45deg);}
	#header{background:#fff;box-shadow: 0 2px 10px 0 rgba(28,28,28,.1);}
	#header .logo img.green{display:block}
	#header .logo img.whrite{display:none}
	#header .right .nav ul li a{color:#333}
	#header .right .lan .title{background:#258bd6}
	#header .right .nav ul li a:before{background-color:#666;}
	#header .right .nav ul li a:after{background-color:#666;}
	#header .right .mnav span{background:#8ac53f;}
	
	#banner .focus .swiper-slide{position:relative;height:calc(100vh - 1rem);}	
	#banner .focus .swiper-slide .info .text .circle{width:60%;}
	#banner .focus .swiper-slide .info .text .circle i::before{width:.2rem;height:.2rem;top:-.1rem;}
	#banner .focus .swiper-slide .info .text .title{font-size:.5rem;}
	#banner .focus .swiper-slide .info .text .intro{font-size:.5rem;}
	#banner .focus .swiper-pagination-bullet{width:.1rem;height:.1rem;}
	#banner .focus .swiper-pagination-bullet-active{background:#8ac53f;width:.3rem}
	
	.stitle .left h2{ font-size:.36rem;}
	.stitle .left h2::before{width:.3rem;height:.05rem;right:-.2rem;}
	.stitle .right{ font-size:.22rem}
	.stitle .right i{ margin-left:.05rem;}
	
	.more span{border-radius:.6rem;padding:.1rem .3rem; font-size:.22rem}
	.more span i{margin-left:.1rem;}
	
	#tech{ width:100%; padding:.5rem .2rem}
	#tech .list{ padding-top:.4rem}
	#tech .list ul{gap:.3rem}
	#tech .list ul li{ width:100%}
	#tech .list ul li .info{ margin-top:.2rem;}
	#tech .list ul li .info .title{ font-size:.26rem;}
	#tech .list ul li .info .desc{margin-top:.1rem; font-size:.22rem}
	#tech .list ul li .info .more{ margin-top:.2rem}
	
	#about{ padding:0 .25rem}
	#about .left{ width:100%; padding:.8rem 0 .5rem}
	#about .left .text{ padding-right:0}
	#about .left .text .title{ font-size:.5rem;}
	#about .left .text .dhimg{ margin-top:.3rem;}
	#about .left .text .desc{ font-size:.3rem; margin-top:-.3rem}
	#about .left .text .content{ font-size:.22rem;  margin-top:.3rem}
	#about .left .text .more{ margin-top:.3rem}
	#about .left .count{ margin-top:.5rem;flex-wrap:wrap;gap:.2rem}
	#about .left .count .item{ width:calc((100% - .4rem) / 3);padding:.2rem 0; }
	#about .left .count .item .num big{ font-size:.7rem;}
	#about .left .count .item .num small{ font-size:.22rem; margin-left:.1rem}
	#about .left .count .item .desc{margin-top:.1rem; font-size:.22rem;}
	#about .right{ display:none}
	
	#hezuo{ padding:.5rem .25rem .8rem}
	#hezuo ul{flex-wrap:wrap;gap:.3rem;justify-content:flex-start;}
	#hezuo ul li img{ height:.8rem}
	
	#news{padding:.5rem .25rem}
	#news .list{ padding-top:.4rem}
	#news .list ul{gap:.3rem}
	#news .list ul li{ width:100%}
	#news .list ul li .info{margin-top:.3rem;}
	#news .list ul li .info .title{font-size:.3rem;margin-top:.1rem}
	#news .list ul li .info .title{-webkit-line-clamp:3;}
	#news .list ul li .info .desc{ margin-top:.1rem; font-size:.22rem;}
	#news .list ul li .info .desc{-webkit-line-clamp:8;}
	
	#footer .map{ padding:.5rem .3rem; }
	#footer .map{ display:block}
	#footer .map .logo{ text-align:center}
	#footer .map .item{ text-align:center}
	#footer .map .item h3{ font-size:.24rem; margin-bottom:.1rem}
	#footer .map .item .contact{ font-size:.22rem}
	#footer .map .item.qrcode{ margin-top:.1rem;}
	#footer .map .item .input .text{ border:0; width:100%; font-size:.22rem}
	#footer .map .item .input .btn{ border:0; line-height:40px; padding: 0 20px}
	#footer .map .item:nth-child(2){ display:none}
	#footer .map .item:nth-child(3){ display:none}
	#footer .map .item:nth-child(4){ margin-top:.5rem}
	#footer .copyright{ padding:.2rem .25rem;display: block; font-size:.2rem}
	#footer .copyright .left{ text-align:center}
	#footer .copyright .right{justify-content:center ;}
	#footer .copyright .right a{margin:0 .1rem}
}


@keyframes circle{
	to{transform:rotate(360deg);}
}
@keyframes movepoint {
	0% {top:-50px}
	50% {top:0px}
	100%{top:-50px}
}
@keyframes movetext {
	0% {bottom: 140px}
	50% {bottom:130px}
	100%{bottom:140px}
}

#nbanner{ width:100%; position:relative}
#nbanner .img{ overflow:hidden}
#nbanner .img img{ width:100%}
#nbanner .text{ position:absolute; left:0; top:0; width:100%; height:100%}
#nbanner .text{display:flex;justify-content:space-between;align-items:center;}
#nbanner .text .box .title{ font-size:60px; color:#fff}

#main{ width:100%}
#main .contact{ padding:80px 0;}
#main .contact .content{display:flex;justify-content:space-between;align-items:center;}
#main .contact .content .text{ width:50%}
#main .contact .content .text .company{ font-size:40px; padding-bottom:40px}
#main .contact .content .text .item{ margin-top:50px;display:flex;align-items:center;}
#main .contact .content .text .item .icon{ width:40px; height:40px; background:#8ac53f; border-radius:40px; overflow:hidden}
#main .contact .content .text .item .icon{display:flex;justify-content:center;align-items:center;}
#main .contact .content .text .item .icon i{ color:#fff; font-size:18px}
#main .contact .content .text .item .right{ margin-left:25px}
#main .contact .content .text .item .right .title{ font-size:16px; color:#999; line-height:1}
#main .contact .content .text .item .right .desc{ font-size:20px; font-weight:700;; line-height:1; margin-top:10px}
#main .contact .content .map{ width:40%}
#main .contact .content .map iframe{ width:100%; height:400px}
#main .contact .feedback{ margin-top:80px; border-top:2px solid #eee; padding-top:80px;}
#main .contact .feedback .ctitle{ text-align:center}
#main .contact .feedback .ctitle .title{ font-size:36px; font-weight:700;}
#main .contact .feedback .ctitle .desc{ color:#888; line-height:1.5; margin-top:20px}
#main .contact .feedback .formbox{ margin-top:50px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px 20px}
#main .contact .feedback .formbox .item{ width:calc((100% - 20px) / 2)}
#main .contact .feedback .formbox .item .text{ width:100%; border:1px solid #ddd; border-radius:8px; padding:20px 20px; font-size:16px}
#main .contact .feedback .formbox .item .textarea{ width:100%; border:1px solid #ddd; border-radius:8px; padding:20px 20px; font-size:16px; height:150px}
#main .contact .feedback .formbox .item2{ width:100%}
#main .contact .feedback .button{ text-align:center; width:100%}
#main .contact .feedback .button .btn{ display:inline-block; border:0; background:#8ac53f; border-radius:10px; padding:20px 100px; font-size:20px; color:#fff; cursor:pointer}
#main .contact .feedback .button .btn:hover{ background:#258bd6}

#main .news{padding:80px 0}
#main .news ul{display: flex;flex-wrap:wrap;gap:40px 30px}
#main .news ul li{ width:calc((100% - 60px) / 3)}
#main .news ul li .img{border-radius:6px;overflow:hidden;}
#main .news ul li .img img{width:100%;}
#main .news ul li .info{margin-top:30px;}
#main .news ul li .info time{color:#8ac53f;}
#main .news ul li .info .title{font-size:16px;font-weight:700;line-height:1.4; margin-top:10px}
#main .news ul li .info .title{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical}
#main .news ul li .info .desc{ margin-top:10px; line-height:1.6; color:#666}
#main .news ul li .info .desc{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}
#main .news ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}

#main .news_view{ padding:80px 0}
#main .news_view .title{ border-bottom:1px solid #eee; padding-bottom:20px}
#main .news_view .title h1{ font-size:26px; text-align:center; line-height:1.5}
#main .news_view .title .info{ color:#999; text-align:center; margin-top:20px}
#main .news_view .title .info span{ margin:0 10px}
#main .news_view .content{ padding:30px 0; font-size:16px; line-height:1.6; min-height:300px}
#main .news_view .content img{ max-width:1000px}
#main .news_view .content  p{ margin-bottom:10px}
#main .news_view .updown{ margin-top:20px; padding-top:20px; border-top:1px solid #eee}

#main .tech{ padding:50px 0}
#main .tech ul li{padding:30px 0;display:flex;justify-content:space-between ;align-items:center;}
#main .tech ul li .info{width:48%;}
#main .tech ul li .info .title{font-size:30px;font-weight:700;font-family:"Stolzl";}
#main .tech ul li .info .desc{margin-top:20px;line-height:1.8; font-size:16px; color:#666}
#main .tech ul li .info .more{margin-top:20px;}
#main .tech ul li .info .more a{background:#8ac53f;display:inline-block;border-radius:40px;padding:5px 20px;color:#fff;}
#main .tech ul li .info .more a i{margin-left:5px;}
#main .tech ul li .info .more a:hover{background:#258bd6;}
#main .tech ul li .img{width:48%; overflow:hidden;border-radius:6px;}
#main .tech ul li .img img{width:100%}
#main .tech ul li:nth-child(2n){flex-direction:row-reverse;}

#main .tech_view{ padding:80px 0}
#main .tech_view .intro{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eee;padding-bottom:80px}
#main .tech_view .intro .img{ width:40%}
#main .tech_view .intro .img img{ width:100%;border-radius:8px}
#main .tech_view .intro .info{ width:55%}
#main .tech_view .intro .info .title{ font-size:24px;font-weight:700}
#main .tech_view .intro .info .desc{ margin-top:10px;line-height:1.8;color:#666;font-size:16px}
#main .tech_view .intro .info .buy{ margin-top:20px;display:flex;}
#main .tech_view .intro .info .buy a{background:#8ac53f;color:#fff;border-radius:64px;display:inline-block;padding:10px 40px; font-size:18px}
#main .tech_view .intro .info .buy a:hover{background:#258bd6;}
#main .tech_view .content{ margin-top:80px;}
#main .tech_view .content .title{ text-align:center}
#main .tech_view .content .title h2{ font-size:24px;font-weight:700;position:relative;display:inline-block}
#main .tech_view .content .title h2:after{content:"";position:absolute;background-color:#999;height:1px;width:100px;top:50%;right:-120px;margin-top:-1px}
#main .tech_view .content .title h2:before{content:"";position:absolute;background-color:#999;height:1px;width:100px;top:50%;left:-120px;margin-top:-1px}
#main .tech_view .content .text{ min-height:300px;font-size:16px;line-height:1.8;margin-top:30px}
#main .tech_view .content .text img{ max-width:100%}
#main .tech_view .content .text table {	width: 100%;	border-collapse: collapse;	background-color: #fff;	border: 1px solid #949494;}
#main .tech_view .content .text table th,
#main .tech_view .content .text table td {	border: 1px solid #949494;	text-align: center;	padding:10px;word-wrap:break-word;word-break:break-all;}
#main .tech_view .content .text table th {	background-color:#8ac53f;	color: #fff;}
#main .tech_view .updown{ margin-top:30px;padding-top:30px;border-top:1px solid #eee;}

#mabout{ padding:80px 0;}
#mabout .wrap{display:flex;justify-content:space-between;}
#mabout .left{ width:48%}
#mabout .left .since{ font-size:36px; font-weight:700; font-family:"din"; line-height:1.6}
#mabout .left .content{ font-size:16px; line-height:1.8; margin-top:30px}
#mabout .left .content p{ margin-bottom:10px}
#mabout .img{ width:45%}
#mabout .img img{ width:100%; border-radius:10px}

#fz{ width:100%; padding:80px 0; background:url(../images/bg_fz.jpg) no-repeat center center; background-size:cover}
#fz .list{ margin-top:50px}
#fz .list .swiper-slide{  border-left:1px solid #8ac53f; padding-left:30px; position:relative;}
#fz .list .swiper-slide:before{content:"";position:absolute;background-color:#fff;height:10px;width:10px; bottom:-9px;left:-9px; border:4px solid #8ac53f; border-radius:20px}
#fz .list .swiper-slide .title{ font-size:34px; font-weight:700; font-family:"din"; line-height:1.5; color:#8ac53f}
#fz .list .swiper-slide .desc{ max-width:240px; font-size:16px; line-height:1.8; margin-top:30px; height:200px}
#fz .list .swiper-container{padding:50px 10px}
#fz .list .swiper-container:before{content:"";position:absolute;background-color:#8ac53f;height:1px;width:100%; bottom:50px;left:0;}

#fz .list .btn {display: flex;align-items:center;justify-content:center;;}
#fz .list .btn .p_btn{background:#8ac53f;width:50px;height:50px;border-radius:100px;display: flex;align-items:center;justify-content:center;cursor: pointer;margin:0 5px ;}
#fz .list .btn .p_btn i{font-size:24px;color:#fff;}
#fz .list .btn .p_btn.button-prev{left: auto;right:-70px;}
#fz .list .btn .p_btn.swiper-button-disabled{opacity:.1;}

#zizhi{ width:100%; padding:80px 0; background: url(../images/bg_zz.jpg) no-repeat center center; background-size:cover; background-attachment:fixed}
#zizhi .stitle .left h2{ color:#fff}
#zizhi .list{ margin-top:40px}
#zizhi .list ul{display:flex;align-items:center;flex-wrap:wrap;gap:30px;}
#zizhi .list ul li{ width:calc((100% - 150px) / 6)}
#zizhi .list ul li .img{ background:#fff; padding:20px; display: flex;align-items:center;justify-content:center;}
#zizhi .list ul li .img img{width:100%}
#zizhi .list ul li .title{ text-align:center; color:#fff; margin-top:10px}

#hzhb{ width:100%; padding:80px 0}
#hzhb .list{ margin-top:40px}
#hzhb .list ul{display:flex;align-items:center;flex-wrap:wrap; border-left:1px solid #eee; border-bottom:1px solid #eee}
#hzhb .list ul li{ width:20%; border:1px solid #eee; height:250px;;display: flex;align-items:center;justify-content:center; border-left:0; border-bottom:0}
#hzhb .list ul li img{ max-width:50%; max-height:50%}

@media (max-width:800px){
	body,html{font-size:.22rem;line-height:.34rem;}
	
	#nbanner{ margin-top:1rem}
	#nbanner .img img{ width:100%}
	#nbanner .text .box{ padding:0 .25rem}
	#nbanner .text .box .title{ font-size:.5rem;}
	
	#main .contact{ padding:.8rem .25rem;}
	#main .contact .content{display: block}
	#main .contact .content .text{ width:100%}
	#main .contact .content .text .company{ font-size:.4rem; padding-bottom:.4rem; font-weight:700}
	#main .contact .content .text .item{ margin-top:.4rem;}
	#main .contact .content .text .item .icon{ width:.5rem; height:.5rem;  border-radius:.5rem;}
	#main .contact .content .text .item .icon i{font-size:.22rem}
	#main .contact .content .text .item .right{ margin-left:.2rem}
	#main .contact .content .text .item .right .title{ font-size:.22rem;}
	#main .contact .content .text .item .right .desc{ font-size:.26rem; line-height:1.5; margin-top:.1rem}
	#main .contact .content .map{ width:100%; margin-top:.5rem}
	#main .contact .content .map iframe{height:4rem}
	#main .contact .feedback{ margin-top:.8rem;padding-top:.8rem;}
	#main .contact .feedback .ctitle .title{ font-size:.4rem;}
	#main .contact .feedback .ctitle .desc{ margin-top:.2rem; font-size:.22rem}
	#main .contact .feedback .formbox{ margin-top:.5rem;gap:.3rem}
	#main .contact .feedback .formbox .item{ width:100%}
	#main .contact .feedback .formbox .item .text{ padding:.2rem; font-size:.22rem}
	#main .contact .feedback .formbox .item .textarea{ padding:.2rem; font-size:.22rem; height:2rem}
	#main .contact .feedback .button .btn{  padding:.2rem 1rem; font-size:.24rem;}
	
	#main .news{ padding:.8rem .25rem;}
	#main .news ul{gap:.4rem}
	#main .news ul li{ width:100%}
	#main .news ul li .info{margin-top:.3rem;}
	#main .news ul li .info .title{font-size:.3rem;margin-top:.1rem}
	#main .news ul li .info .title{-webkit-line-clamp:3;}
	#main .news ul li .info .desc{ margin-top:.1rem; font-size:.22rem;}
	#main .news ul li .info .desc{-webkit-line-clamp:5;}
	
	#main .news_view{ padding:.8rem .25rem}
	#main .news_view .title{padding-bottom:.2rem}
	#main .news_view .title h1{ font-size:.3rem;}
	#main .news_view .title .info{margin-top:.2rem; font-size:.2rem}
	#main .news_view .title .info span{ margin:0 .1rem}
	#main .news_view .content{ padding:.3rem 0; font-size:.24rem; line-height:1.8; min-height:3rem}
	#main .news_view .content img{ max-width:100%}
	#main .news_view .content  p{ margin-bottom:.1rem}
	#main .news_view .updown{ margin-top:.2rem; padding-top:.2rem;}
	
	#main .tech{ padding:.5rem .25rem}
	#main .tech ul{}
	#main .tech ul li{padding:.3rem 0;flex-wrap:wrap;gap:.3rem;}
	#main .tech ul li .info{width:100%;}
	#main .tech ul li .info .title{font-size:.3rem;}
	#main .tech ul li .info .desc{margin-top:.2rem;line-height:1.6;font-size:.22rem;}
	#main .tech ul li .info .more{margin-top:.3rem;}
	#main .tech ul li .info .more a{padding:.1rem .2rem;}
	#main .tech ul li .info .more a i{margin-left:.1rem;}
	#main .tech ul li .img{width:100%;}
	#main .tech ul li .img img{width:100%;}
	
	#main .tech_view{ padding:.8rem .25rem}
	#main .tech_view .intro{display:block;padding-bottom:.3rem}
	#main .tech_view .intro .img{ width:100%}
	#main .tech_view .intro .img img{ width:100%}
	#main .tech_view .intro .info{ width:100%;margin-top:.4rem}
	#main .tech_view .intro .info .title{ font-size:.3rem;}
	#main .tech_view .intro .info .desc{ margin-top:.2rem;font-size:.22rem}
	#main .tech_view .intro .info .buy{ margin-top:.3rem;justify-content:center;}
	#main .tech_view .intro .info .buy a{border-radius:.6rem;padding:.2rem .6rem;margin:0 .1rem; font-size:.24REM}
	#main .tech_view .content{ margin-top:.5rem;}
	#main .tech_view .content .title h2{ font-size:.3rem;}
	#main .tech_view .content .title h2:after{width:1rem;right:-1.2rem;}
	#main .tech_view .content .title h2:before{width:1rem;left:-1.2rem;}
	#main .tech_view .content .text{ min-height:3rem;font-size:.24rem;margin-top:.3rem;}
	#main .tech_view .content .text table { overflow:scroll}
	#main .tech_view .updown{ margin-top:.3rem;padding-top:.3rem;}
	
	#mabout{ padding:.8rem .25rem;}
	#mabout .wrap{display: block;}
	#mabout .left{ width:100%}
	#mabout .left .since{ font-size:.4rem;}
	#mabout .left .content{ font-size:.24rem; margin-top:.3rem}
	#mabout .left .content p{ margin-bottom:.1rem}
	#mabout .img{ width:100%; margin-top:.5rem}
	
	#fz{padding:.8rem .25rem}
	#fz .list{ margin-top:.5rem}
	#fz .list .swiper-slide{ padding-left:.3rem;}
	#fz .list .swiper-slide:before{height:.1rem;width:.1rem; bottom:-.09rem;left:-.09rem; border:.04rem solid #8ac53f;}
	#fz .list .swiper-slide .title{ font-size:.4rem;}
	#fz .list .swiper-slide .desc{ max-width: inherit; font-size:.22rem; margin-top:.3rem; height:2.5rem}
	#fz .list .swiper-container{padding:.5rem .2rem}
	#fz .list .swiper-container:before{bottom:.5rem;}
	
	#fz .list .btn .p_btn{width:.5rem;height:.5rem;border-radius:.5rem;}
	#fz .list .btn .p_btn i{font-size:.24rem;}
	#fz .list .btn .p_btn.button-prev{left: auto;right:-.7rem;}
	#fz .list .btn .p_btn.swiper-button-disabled{opacity:.5;}
	
	#zizhi{padding:.8rem .25rem; background-attachment:inherit}
	#zizhi .list{ margin-top:.4rem}
	#zizhi .list ul{;gap:.3rem;}
	#zizhi .list ul li{ width:calc((100% - .3rem) / 2)}
	#zizhi .list ul li .img{ padding:.2rem;}
	#zizhi .list ul li .title{ margin-top:.1rem}
	
	#hzhb{padding:.8rem .25rem}
	#hzhb .list{ margin-top:.4rem}
	#hzhb .list ul{}
	#hzhb .list ul li{ width:20%; height:1.5rem;}
	#hzhb .list ul li img{ max-width:60%; max-height:60%}
}

#fenye{padding:50px 0 0px;display:flex;align-items:center;justify-content:center;gap:0 10px}
#fenye a{color:#5a5a5a;padding:8px 15px;border:1px solid #eee;border-radius:4px}
#fenye .prev,#fenye .next{width:52px;text-align:center}
#fenye a.page-num-current{font-weight:700;color:#fff;background:#8ac53f;border:1px solid #8ac53f}
#fenye a:hover{background:#8ac53f;color:#fff;border:1px solid #8ac53f}

@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}
	#fenye{padding:.5rem 0 0px;gap:0 .1rem}
	#fenye a{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .prev,#fenye .next{width:.55rem;}
	#fenye .num,#fenye .prev{ display:none}
}