@charset "utf-8";
*{box-sizing: border-box;}
body{margin:0;padding:0;line-height:22px;font-weight: 14px;font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Source Han Sans CN", sans-serif;-webkit-text-size-adjust:none;color:#333;overflow-x: hidden; }
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,p{margin:0;padding:0;}
input,select,textarea{font-size:12px;line-height:16px;}img,button{border:0;}ul,li{list-style-type:none;}
a{color:#333;text-decoration:none;}
.tc{text-align:center;}.tl{text-align:left;}.tr{text-align:right;}
.dis{display:block;}.undis{display:none;}
.fl{float:left;}.fr{float:right;}.cl{clear:both;}.fb{font-weight:bold;}.fnb{font-weight:200;margin-left:-1px;}
.hr_1,.hr_10{font-size:1px;line-height:1px;clear:both;}
.hr_1{height:1px;}.hr_10{height:10px;}
input[type="text"]:focus,input[type="password"]:focus,textarea:focus{outline:none;}
.wc{width:1600px;margin: 0 auto;}
img{padding: 0;margin: 0;vertical-align: middle;display: block;width: 100%;}
i{font-style:normal}
.clearfix::after {content: "";display: table;clear: both;}
.swiper {width: 100%;height: 100%;}
.swiper-slide {display: flex;justify-content: center;align-items: center;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.vh120{display: block;height: 120px;}

.wap-header{display: none;}
.top{background: #1a1a1a;line-height: 54px;height: 54px;color: #fff;}
.top .marquee{position: relative;}
.top .div{position:absolute;left: -100%;top: 0;}
.top .div span{width: 400px;float: left;position: relative;}
.top .div span::after {content: "";display: block;width: 4px;height: 4px;border-radius: 50%;background: #fff;position: absolute;top: 50%;right: 75px;margin-top: -2px;}

.banzhe{position: fixed;z-index: 998;width: 100%;left: 0;top: 0;background: rgba(0,0,0,.4);height: 100%;display: none;}

.banner{background: url(../images/index_main_banner.jpg)no-repeat bottom;background-size: cover;height: calc(100vh - 54px);}
.banner .zhe{width: 100%;height: 100%;background: rgba(0,0,0,.4);display: flex;justify-content: center;align-items: center;position: relative;}
.banner .zhe .com{width: 860px;text-align: center;color: #fff;padding-top: 50px;}
.banner .zhe .com .p0{}
.banner .zhe .com .p1{font-size: 50px;font-weight: bold;margin: 5% 0 6%;}
.banner .zhe .com .a{width: 230px;height: 60px;text-align: center;line-height: 60px;border-radius: 30px;background: #000;display: block;margin:  0 auto;color: #fff;}
.banner .zhe .com .a:hover{background: rgba(0,0,0,.8);}
.header{position:absolute;width: 100%;top: 0;transition: background-color 0.3s ease-in-out;z-index: 999}
.header .logo{float: left;height: 120px;padding: 20px 0;}
.header .nav{float: right;}
.header .nav ul li{float: left;height: 120px;line-height: 120px;position: relative;}
.header .nav ul li .a{color: #fff;font-size: 16px;margin: 0 20px;display: block;}
.header .nav ul li .a i{display: inline-block;transform: rotate(90deg);font-size: 12px;margin-left: 10px;font-weight: bold;}
.header .nav ul li .mune{position: absolute;left: 0;top: 120px;text-align: center;display: none;z-index: 9;}
.header.mou{background-color: #ffffff;}
.header.mou .nav ul li .a{color: #000;}
.header .nav ul li:hover .a{color: #000;}
.h120{width: 100vw;height: 120px;background: #fff;position: fixed;top: 174px;z-index: 999;border-top: 1px solid #969696;display: none;}
.h120 .con{text-align: center;}
.h120 .con a{font-weight: bold;color: #000;margin: 0 20px;font-size: 20px;display: inline-block;height: 120px;line-height: 120px;}

.bannertit{background: #1a1a1a;height: 80px;line-height: 80px;}
.bannertit .li{float: left;width: 20%;color: #fff;font-size: 12px;}
.bannertit .li i{font-size: 24px;margin-right: 10px;}

.ind1{padding-top: 3%;}
.ind1 .mySwiper{position: relative;}
.ind1 .mySwiper .swiper-slide{background: #b2b2b2;border-radius: 10px;overflow:hidden;position: relative;}
.ind1 .mySwiper .swiper-slide img{transform-origin: center;transition: transform 1.5s cubic-bezier(.22,1,.36,1);}
.ind1 .mySwiper .swiper-slide:hover img{transform: scale(1.06);}
.ind1 .mySwiper .swiper-slide .zao{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.3);}
.ind1 .mySwiper .swiper-button-next, .ind1 .mySwiper .swiper-button-prev{width: 45px;height: 45px;border-radius: 50%;background: #fff;color: #000;display: none;text-align: center;line-height: 45px;}
.ind1 .mySwiper:hover .swiper-button-next{display:block;}
.ind1 .mySwiper:hover .swiper-button-prev{display:block;}
.ind1 .mySwiper .zao .com{width: 86%;position: absolute;bottom: 10%;right: 7%;text-align: right}
.ind1 .mySwiper .zao .com i{display: inline-block;width: 38px;height: 38px;border-radius: 50%;color: #666;background: #fff;text-align: center;line-height: 38px;transform: translateY(20px);opacity: 0;transition: all 0.5s ease-in-out;}
.ind1 .mySwiper .zao .com p{font-weight: bold;font-size: 26px;color: #fff;margin-top: 5%;transition: transform 0.5s ease-in-out;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;height: 28px;}
.ind1 .mySwiper .swiper-slide:hover .zao .com i{transform: translateY(0);opacity: 1;}
.ind1 .mySwiper .swiper-slide:hover .zao .com p{transform: translateY(8px);}
.mySwiper .swiper-button-next.swiper-button-disabled,.mySwiper .swiper-button-prev.swiper-button-disabled{opacity: 0;}
.ind1 .p{padding: 5% 0 8%;text-align: center;font-weight: bold;font-size: 40px;}

.ind2{width: 100%;height:100vh;background: #1a1a1a;}
.ind2 .ind2_l{width: 55%;float: left;height: 100%;padding: 3%;color: #fff}
.ind2 .ind2_l h3{font-size: 40px;}
.ind2 .ind2_l p{margin-top: 5%;}
.ind2 .ind2_l a{display: block;width: 300px;height: 60px;line-height: 60px;border-radius: 30px;background: #fff;text-align: center;font-size: 12px;color: #000;margin-top: 5%;}
.ind2 .ind2_r{height: 100%;width: 45%;float: right;background: url(../images/0.jpg)no-repeat top;background-size: cover;} 

.ind3 .h3{padding: 5% 0 8%;text-align: center;font-weight: bold;font-size: 40px;}
.ind3 .p{font-size: 24px;font-weight: bold;} 
.ind3 .mySwiper1{position: relative;margin-top: 2%;}
.ind3 .mySwiper1 .swiper-slide{background: #b2b2b2;border-radius: 10px;overflow:hidden;position: relative;}
.ind3 .mySwiper1 .swiper-slide img{transform-origin: center;transition: transform 1.5s cubic-bezier(.22,1,.36,1);}
.ind3 .mySwiper1 .swiper-slide:hover img{transform: scale(1.06);}
.ind3 .mySwiper1 .swiper-slide .zao{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.3);}
.ind3 .mySwiper1 .swiper-button-next, .ind3 .mySwiper1 .swiper-button-prev{width: 45px;height: 45px;border-radius: 50%;background: #fff;color: #000;display: none;text-align: center;line-height: 45px;}
.ind3 .mySwiper1:hover .swiper-button-next{display:block;}
.ind3 .mySwiper1:hover .swiper-button-prev{display:block;}
.ind3 .mySwiper1 .zao .com{width: 86%;position: absolute;bottom: 10%;right: 7%;text-align: left;}
.ind3 .mySwiper1 .zao .com i{display: inline-block;width: 38px;height: 38px;border-radius: 50%;color: #666;background: #fff;text-align: center;line-height: 38px;transform: translateY(20px);opacity: 0;transition: all 0.5s ease-in-out;}
.ind3 .mySwiper1 .zao .com span{display: block;color: #fff;line-height: 28px;margin-top: 5%;}
.ind3 .mySwiper1 .zao .com p{font-weight: bold;font-size: 20px;color: #fff;margin-top: 3%;transition: transform 0.5s ease-in-out;}
.ind3 .mySwiper1 .swiper-slide:hover .zao .com i{transform: translateY(0);opacity: 1;}
.ind3 .mySwiper1 .swiper-slide:hover .zao .com p{transform: translateY(8px);}
.mySwiper1 .swiper-button-next.swiper-button-disabled,.mySwiper1 .swiper-button-prev.swiper-button-disabled{opacity: 0;}


.cent{width: 100%;padding: 4% 0 6%;font-size: 50px;font-weight: bold;}
.cent .marquee{height: 70px;line-height: 70px;position: relative;}
.cent .marquee .div{position:absolute;left: -100%;top: 0;}
.cent .marquee .div span{float: left;margin: 0 40px;}

.ind4{background: url(../images/12.jpg)no-repeat top;background-size: cover;}
.ind4 .p0{margin-bottom: 5%;}

.footer{padding: 3% 0;}
.footer p{color: #000;font-weight: bold;margin-bottom: 2%;}
.footer .a{line-height: 32px;display: block;color: #969696}

.footer .i{margin-top: 4%;}
.footer .i a{margin-right: 20px;}
.footer .i i{font-size: 26px;}

.footer .bot{margin-top: 3%;line-height: 50px;color: #969696;height: 50px;position: relative;}
.footer .bot .smalllogo{position: absolute;right: 0;bottom: 3%;}
.footer .bot .smalllogo img{width: 32px;height: auto;display: inline-block;margin: 0 2px;}

.nvbanne{position: relative;}
.nvbanne .header .nav li .a{color: #000}
.fixed{position: fixed;background: #fff;z-index: 999;}
.fixed .nav ul li .a{color: #000}

.product{}
.tihe{padding: 5% 0;font-weight: 400;text-align: center;font-size: 34px;}
.product .ul li{float: left;width: 23.5%;margin-right: 2%;border-radius: 10px;overflow: hidden;margin-bottom: 2%;}
.product .ul li .img{display: block;overflow: hidden;}
.product .ul li .img img{transform-origin: center;transition: transform 1.5s cubic-bezier(.22,1,.36,1);}
.product .ul li:nth-child(4n){margin-right: 0;}
.product .ul li .com{padding: 10px 15px;background: #fafafa;line-height: 30px;}
.product .ul li .com p{height: 30px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 14px;}
.product .ul li .com span{display: block;height: 30px;font-size: 12px;color: #969696;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.product .ul li:hover img{transform: scale(1.06)}

.text-center{text-align: center;}
.pagination {display: flex;justify-content: center;align-items: center;gap: 5px; font-size: 14px;padding: 3% 0;}
.pagination a, .pagination span { padding: 8px 12px;border: 1px solid #ddd;background-color: #fff;border-radius: 4px;color: #333;text-decoration: none;font-size: 14px;transition: all 0.3s ease;margin: 0 2px;}
.pagination a:hover {border-color: #08903b;color: #160e4c;}
.pagination .active a{background-color: #08903b;color: #fff;border-color: #08903b;}

.spro{padding:  40px 0;}
.spro-l{width: 50%;float: left;padding-right: 4%;}
#magnifier {
  position: relative;
  width: 100%;
}
.small-box {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  height: 700px;
}
.small-box img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
}
.small-box .hover {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 200px;
  height: 200px;
  border: 1px solid #aaa;
  background: #0099ff;
  opacity: .5;
  filter: alpha(opacity: 50);
  cursor: move;
}
.thumbnail-box {
  position: relative;
  width: 100%;
}
.thumbnail-box .btn {
  position: absolute;
  width: 22px;
  height: 100px;
}
.thumbnail-box .btn-prev {
  left: 0px;
  background: url(../images/btn_prev.png) no-repeat;
}
.thumbnail-box .btn-next {
  right:0px;
  background: url(../images/btn_next.png) no-repeat;
}
.thumbnail-box .list {
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
}
.thumbnail-box .wrapper {
  width: 100000px;
}
.thumbnail-box .list .item {
  float: left;
  margin: 0 10px;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #fff;
  border-radius: 3px;

}
.thumbnail-box .list .item img{max-width: 100%;  float: unset;max-height: 100%;width: auto!important;}
.thumbnail-box .list .item-cur {padding: 2px;}
.thumbnail-box .list .item{
  border: 1px solid #fff;
}
.thumbnail-box .list .item-cur{
  border: 1px solid #08903b;
}
.big-box {
  display: none;
  overflow: hidden;
  position: absolute;
  left: 451px;
  top: 0;
  width: 540px;
  height: 540px;
  border: 1px solid #e4e4e4;
}
.big-box img {
  display: block;
}

.spro-r{background: #fff;overflow: hidden;padding: 3%;border-radius: 10px;}
.spro-r .p{color: #39aee2;}
.spro-r .h3{font-size: 36px;color: #000;position: relative;color: #08903b;font-weight: 400;margin: 4% 0;line-height: 36px;font-weight: bold;}
.spro-r .div{}
.spro-r a{display: block;width: 100%;text-align: center;height: 50px;line-height: 50px;border-radius: 3px;background: #08903b;color: #fff;margin-top: 6%;}
.spro-r a i{margin-left: 10px;}

.proshow2{padding-top: 5%;}
.proshow2 .h3{font-size: 30px;margin-bottom: 3%;}
.proshow2 .div img{max-width: 100%;width: auto;display: inline-block;}

.contact{padding-top: 5%;}
.contact-l{width: 40%;float: left;padding-top: 3%;}
.contact-l h3{font-weight: 400;font-size: 34px;}
.contact-l div{padding: 6% 0;}
.contact-l p{color: #000;line-height: 45px;}

.contact-r{float: right;width: 55%;background: #f3f3f3;padding: 3.5%;border-radius: 10px;overflow: hidden;}
.contact-r .inp{width: 100%;height: 56px;line-height: 56px;border: 1px solid #d8d8d8;border-radius: 5px;background: #f3f3f3;padding: 0 2%;margin-bottom: 2%}
.contact-r .w50{width: 48.5%;float: left;}
.contact-r .lfe{margin-left: 3%;}
.contact-r textarea{width: 100%;height: 135px;background: #f3f3f3;padding: 3% 2%;border: 1px solid #d8d8d8;}
.contact-r .sub{width: 200px;text-align: center;height: 60px;line-height: 60px;border-radius: 30px;background: #000;color: #fff;font-size: 16px;margin-top: 3%;}

.protype .ul li{float: left;width: 23.5%;margin-right: 2%;border-radius: 6px;overflow: hidden;margin-bottom: 2%;position: relative;}
.protype .ul li .img{display: block;overflow: hidden;}
.protype .ul li .img img{transform-origin: center;transition: transform 1.5s cubic-bezier(.22,1,.36,1);}
.protype .ul li:nth-child(4n){margin-right: 0;}
.protype .ul li:hover img{transform: scale(1.06)}
.protype .ul li .com{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.4);padding: 0 15%;display: flex;justify-content: center;align-items: center;color: #fff;font-size: 24px;line-height: 35px;}

.about{width: 900px;margin: 0 auto;padding-bottom: 3%}