body{font-size: 16px;    overflow-x: hidden;} 
.container{ max-width: 1070px; margin: 0 auto;  }
.samllcontainer{ max-width:940px; margin: 0 auto;  }
.litcontainer{  width:780px; margin: 0 auto; }
header .top{ color: #e4dfdf; background: #333131; line-height: 35px; font-size: 12px;}
header .top a:hover,header .top a.on{ background-color: var(--green) ; color: #fff;}
.topSearch{ pointer-events: none;  opacity: 0; transform: translateX(15px); position: absolute ; right: 0; top: 50%; margin-top: -15px; background: #f7f7f7; height: 30px; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; -webkit-transform: translateX(15px); -moz-transform: translateX(15px); -ms-transform: translateX(15px); -o-transform: translateX(15px); }
.topSearch .submit{ width: 30px; height: 40px; background: url(../images/search.png) no-repeat center left; background-size: auto 40%; }
.searchBtn:hover .topSearch {pointer-events: auto; z-index: 10; transform: translateX(0); opacity: 1; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); }
header .bottom{  height: ;}
nav li{ position: relative;}
nav li::after{ position: absolute ; right: 0; top: 50%; width: 1px; height: 30px; margin-top: -15px; background: #e9e7e8; display: block; content: '';}
nav li:last-child::after{ display: none;}
.oneNav{ line-height: 90px; font-size: 16px; color: var(--blue); padding: 0 15px;}

nav li dl{ position: absolute; left: 0;  z-index: 10; background-color: #fff; width: auto; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15);}
nav li dl .iconfont{ color: var(--green);}
nav li dl dd{ line-height: 60px; border-bottom: 1px solid #e9e8e8;}
nav li dl dd:hover{ color: var(--green);}
nav li dl dd:last-child{ border-bottom: none;}
nav  li dl{ visibility:hidden; opacity:0; filter:alpha(opacity=0); transform: translateY(20px);  pointer-events: none;  }
nav  li:hover dl{ visibility:visible; opacity:1; filter:alpha(opacity=100);  transform:translateY(0); pointer-events: auto;}

.rightlogoImg{ height: 25px; }
.idxAbout .more{   height: 44px; }


/*.idxProUl li{ height: 500px; width: calc((100% - 20px)/2); margin-right: 20px; margin-bottom: 20px; border-radius: 30px 0 30px 0; -webkit-border-radius: 30px 0 30px 0; -moz-border-radius: 30px 0 30px 0; -ms-border-radius: 30px 0 30px 0; -o-border-radius: 30px 0 30px 0; }*/


.idxProUl li{  width: calc((100% - 20px)/2); margin-right: 20px; margin-bottom: 20px; border-radius: 30px 0 30px 0; -webkit-border-radius: 30px 0 30px 0; -moz-border-radius: 30px 0 30px 0; -ms-border-radius: 30px 0 30px 0; -o-border-radius: 30px 0 30px 0; }

.idxProUl li .img{ border-radius: 30px 0 30px 0; }
.idxProUl li:nth-child(2n){ margin-right: 0;}
.idxProUl li:hover .img{opacity: .3;}
.idxProUl  li:hover .more{ text-decoration: underline;}

.idxful .con{ position: absolute; border-radius: 30px 0 30px 0; width: 460px; right: 15.3%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-border-radius: 30px 0 30px 0; -moz-border-radius: 30px 0 30px 0; -ms-border-radius: 30px 0 30px 0; -o-border-radius: 30px 0 30px 0; }
footer{    background: url(../images/bg-footer2.png) center top no-repeat #f7f6f6;}
.footNav a:last-child{ border-right: none;}
.footNav a:hover{ color: var(--blue);}
.footLink a{ color: #c1c9c9; width: 50px; height: 50px;}
.footLink a:hover{ color: #abb9b9;}

.mobilLogo{ height: 47px;}
.wapSearchBtn{ width: 52px; height: 52px;}
.wapSearchBtn .iconfont{ font-size: 26px;}
.navBtn{ width: 52px; height: 52px; padding: 15px 12px; }
.navBtn span{ display: block; width: 100%; height: 2px; background-color: #999;}
.navBtn.close{align-items: center; justify-content: center;} 
.navBtn.close .burger:first-child{ display: none;}
.navBtn.close .burger:nth-of-type(3){ display: none;}
.navBtn.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
.navBtn.close .burger:nth-of-type(2):before, .navBtn.close .burger:nth-of-type(2):after {      content: '';   position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #999;      opacity: 0;      z-index: 1;}
.navBtn.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
.navBtn.close .burger:nth-of-type(2):before, .navBtn.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.navBtn.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .navBtn .burger:nth-of-type(2):after {     transform: rotate(-45deg); }

nav li.on .oneNav{ color: var(--green);}

.mobileNav{ border-top: 1px solid rgba(143, 139, 139, 0.2);}
.mobileNav{ width: 100vw; height: auto; z-index: 100; transform: translateX(-105%) ; font-size: 14px; transition: all .6s; position: fixed; top: 52px; left: 0; -webkit-transition: all .6s; -moz-transition: all .6s; -ms-transition: all .6s; -o-transition: all .6s; -webkit-transform: translateX(-105%) ; -moz-transform: translateX(-105%) ; -ms-transform: translateX(-105%) ; -o-transform: translateX(-105%) ; }
.mobileNav.show{ transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); }
 
 .erji .iconfont{ display: block; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } 
 .go-child.on .erji .iconfont{ color: #666; transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }
 .mobileNav a{ border-bottom:1px solid rgba(143, 139, 139, 0.2) ;}
 .mobileNav li.go-child>a{ display: block; line-height: 42px;  font-size: 16px; margin-left: 40px;}
 .erji{ width: 42px; height: 42px; position: absolute; left: 0 ; top: 0; display: flex; align-items: center; justify-content: center;  z-index: 10; }
 .nav-down a{ display: block;  line-height: 3; font-size: 14px; margin-left: 24px;}
 #element{ z-index: 100; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);}

 .subNav{  margin-top: -20px;}
 
 .subNav li{ flex: 1;}
 .subNav li.on{ background: url(../images/active.png) no-repeat center top; }
 .subNav li.on a, .subNav li:hover a{color: var(--green);}
 .subNav a{color: var(--blue);  display: block ; text-align: center;  font-size: 16px;line-height: 1.5;padding: 35px 0 25px 0;}
 .subNav li::after{ width: 1px; height: 50%; top: 25%; left: 0; position: absolute; display: block; content: ''; background-color: #e9e8e8;z-index: 5;}
 .subNav ul li:last-child:before{ width: 1px; height: 50%; top: 25%; right:  0; position: absolute; display: block; content: ''; background-color: #e9e8e8; z-index: 5;}
 main{ background: url(../images/main-slice.png) repeat-x top left;   }

 .subNav::after, .subNav::before{ height: 100%; width: calc((100vw - 940px)/2); position: absolute; top: 0; display: block; content: ''; background-color: #fff;}
 .subNav::before{ left: 0;}
 .subNav::after{ right: 0;}

 .otherNavTitle::after {  width: 100%; height: 1px;  display: block; content: ''; background-color: #e9e8e8; position: absolute; left: 0; top: 50%;}

 .otherNavUl li .img{ width: 117px; height: 117px; border: 1px solid rgba(143, 139, 139, 0.4);}
 .otherNavUl li .img img{ width: 100%; height: 100%; object-fit: cover;}
 .otherNavUl li{ flex: 1;}
 .otherNavUl li:hover .img{ border: 2px solid var(--green);}
.otherNavUl li:hover .img{ opacity: .6;}
.otherNavUl li::after {  width:30%; height: 1px;  display: block; content: ''; background-color: rgba(143, 139, 139, 0.4); position: absolute; right: -15%; top: 57px;}
.otherNavUl li:last-child::after{ display: none;}
 
.otherNavUl li:hover .color-666{ color: var(--green);}
.mobileHeader{ z-index: 100;}
.componentContent P{    margin: 8px 0; list-style: 1.5;}
.componentContent a {color:var(--green);text-decoration: none;border-bottom: 1px solid var(--green);}

.screenUl a{ width: calc((100% - 40px)/3); margin-right: 20px; margin-bottom: 10px; line-height: 2;}
.screenUl a:nth-child(3n){ margin-right: 0;}
.screenUl a.on,.screenUl a:hover{background: var(--green); color: #fff;}
.screenUl:hover >a:not(:hover)  { background: #fff; color: #666;}
.screenUl a.on::before{ display: block; content: "\e688"; font-family: "iconfont" !important; position: absolute; right: 10%; top: 50%; font-size: 18px ; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }


.line-height1-5{ line-height: 1.5;}
.prolist li{ width: calc((100% - 60px)/3); margin-right: 30px; margin-bottom: 20px;  }
.prolist li:nth-child(3n){ margin-right: 0;}

.proTitUp::after{display: none; content: ''; position: absolute; bottom: -17px; left: 50%; margin-left: -5px;width: 0;height: 0;border-style: solid;border-width: 17.3px 10px 0 10px;border-color: var(--blue) transparent transparent transparent;}
.proTitUp::before{ display: block;   content: "\e689"; font-family: "iconfont" !important; position: absolute; right: 10%; top: 50%; font-size: 18px; margin-top: -9px;  }

.proTitUp.on{ background: var(--blue); color: #fff;}
.proTitUp.on::before{ transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; }

.buyNowBtn{ color: #fff  ;border: 1px solid #f29dc2; background-image: linear-gradient(to bottom, #f29dc2, #db69a4); font-size: 22px;  height: 44px; width: 166px;    border-radius: 30px;   -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; }
.buyNowBtn:hover{ background: var(--blue);}

.bgProducts{ background: url(../images/bg-products.png) no-repeat center bottom; padding-bottom: 140px;}
.prolistBan{ background: url(../images/main-slice.png) repeat-x top left, url(../images/banner-bg.png) center bottom no-repeat;}

.centerlist a{ width: 170px; margin: 0 1vw; position: relative;}
.centerlist a::after{ width: 1px; height: 50%; top:20%; position: absolute; right: 0; display: block; content: ''; background: #e9e8e8;}
.centerlist a:last-child::after{ display: none;}

.componentContent ul { margin: 20px auto;}
.componentContent ul li{ float: left; font-size: 14px; line-height: 2;  background: url(../images/product-tick.jpg) no-repeat left top; background-size: auto 25px; padding-left: 30px; width: 40%; }
.componentContent ul:after {content: "";display: block;clear: both;width: 100%;height: 0;line-height: 0;font-size: 0;}

.outlogoUl li{ width: 23%; margin-right: 2.6%; margin-top:40px;}
.outlogoUl li:nth-child(4n){ margin-right: 0;}
.outlogoUl .buyNowBtn{ width: 78px; height: 26px; font-size: 12px;}
.outlogoUl li .img{ width: 100%; height: 110px;}

.selectUl li{ cursor: pointer; width: calc((100% - 40px)/3); margin-right: 20px; margin-bottom: 10px; line-height: 2.4;  }
.selectUl li:nth-child(3n){ margin-right: 0;}
.selectUl li.on,.selectUl li:hover{background: var(--green); color: #fff;}
 .jixunBtn.on{ color: #fff; background-color: var(--green);}

.yinTit::before {content: '';width: 37px;height: 27px;background: url(../images/top-double-cots.png) left top no-repeat;position: absolute;left: -30px;top: 0;font-size: 0;}
.yinTit::after {content: '';width: 37px;height: 27px;background: url(../images/bottom-double-cots.png) left top no-repeat;position: absolute;right: -30px;top: 0;font-size: 0;}

.histlist{ padding: 70px;}
.histlist li { padding-bottom: 60px; }
.histlist li .img img{ border: 1px solid #e5e5e5; width: 120px; height: 120px; object-fit: cover; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.histlist li .txt{ width: calc(100% - 150px);}
.histlist li::before {content: '';width: 1px;height: 40px;position: absolute;left: 60px;bottom: 10px;font-size: 0;background: var(--green);}
.histlist li:last-child::before{ display: none;}

.videolist li{ width: 30%; margin-right: 5%;}
.videolist li:nth-child(3n){ margin-right: 0;}
.videolist li .play{ width: 40px; height: 40px; background: rgba(0, 0, 0, 0.5);}

.QAlist .top{background: url(../images/plus-icon.png) no-repeat left center; }
.QAlist .bottom{ display: none;}
.QAlist li { cursor: pointer;}
.QAlist li .top span{ padding-bottom: 2px;   }
.QAlist li.on .top span{ border-bottom: 1px solid var(--blue);   }
.QAlist li.on .top{background: url(../images/minus-icon.png) no-repeat left center; }

.border-bottom-green{ border-bottom: 1px solid var(--green);}
.sitemapUl a{ font-size: 14px;}
.sitemapUl a:hover{ color: var(--blue); border-bottom: 1px solid var(--blue);}

.ljgmBtn{ color: #fff  ;  background:  #f29dc2; font-size: 22px;  height: 44px; width: 166px;    border-radius: 30px;   -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; }
.ljgmBtn:hover{ background: var(--blue);}

.bbSwiper .next,.bbSwiper .prev{ display: none !important;}


.leadSwiperCon li { 
    position: relative;
}

.leadSwiperCon {
    width: calc(100% - 60px);
}

.leadSwiperCon li img {
    transform: scale(0.8);
    z-index: 5;
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
}

.leadSwiperCon li.swiper-slide-thumb-active img {
    transform: scale(.9);
}

.leadSwiperCon li::after {
    content: '.';
    width: 60px;
    height: 1px;
    background: rgba(143, 139, 139, 0.4);
    font-size: 0;
    right: -30px;
    top: 50%;
    position: absolute;
}

.leadSwiperCon li:last-child::after {
    display: none;
}

@media screen and (max-width:1040px) {
    
.leadSwiperCon li::after{ display: none;}
}
