.header{position: fixed;width: 100%;z-index: 1000;top:0;background:white;box-shadow:0 0 12px rgba(0,0,0,0.2)} .header.is_header{box-shadow:0 0 12px rgba(0,0,0,0.2)} .header .top_hei{height:5px;width:100%;background:#009e96;} .header .w1200{display:flex;height:.85rem;line-height:.85rem;justify-content: space-between;} .header .w1200 .logo{width:21.8%} .header .w1200 .navs ul{display:flex} .header .w1200 .navs ul>li>a{text-transform:uppercase;padding:0 .25rem;font-size:.17rem;color:#222222} .header .w1200 .navs ul>li.active >a{background:#009e96;color:white} .header .w1200 .navs ul>li>a:hover{background:#009e96;color:white} .header .w1200 .navs ul>li dl{position:absolute;line-height:normal;box-shadow:3px 5px 5px 0px rgba(0,0,0,0.15);transition:none;display:none} .header .w1200 .navs ul>li dl dd a{width:2rem;height:.45rem;background:white;padding-left:.25rem;line-height:.45rem;border-bottom:1px solid #dcdcdc;font-size:.14rem;color:#777777} .header .w1200 .navs ul>li dl dd a:hover{color:#009e96} .header .w1200 .right{line-height:normal;display:flex;align-items: center;gap:.32rem} .header .w1200 .right .langs{position:relative} .header .w1200 .right .langs.acts>a:after{transform:translateY(-50%) rotate(180deg) } .header .w1200 .right .langs>a{font-size:.16rem;color:#222222;padding-right:.18rem;position:relative} .header .w1200 .right .langs>a:after{content:"";position:absolute;background:url(../images/2.png) 0 0 no-repeat;width:9px;height:8px;right:0;top:50%;transform:translateY(-50%);background-size:100%;transition:.5s} .header .w1200 .right .langs dl{position:absolute;width:130%;top:110%;text-align:center;left:50%;transform:translateX(-50%);display:none;transition:none} .header .w1200 .right .langs dl a{background:#009e96;font-size:.15rem;color:white;height:.25rem;line-height:.25rem} .header .right .search .content{position: fixed;width:100%;height: 100%;top:0;left: 0;background: rgba(0, 0, 0, 0.45);z-index: 999;display: none;transition: none;} .header .right .search .content .container{position: relative;height: 100%;} .header .right .search .content .s-content{background: #fff;text-align: center;padding:6vh 20px;position: absolute;top:30%;width: 100%;left: 0;transform: translateY(20px);opacity: 0;transition: 0.5s;} .header .right .search .content a.close{position: absolute;font-size:.32rem;top:.1rem;right: .2rem;} .header .right .search .content .title{color:#242424;margin-bottom:.1rem;font-size:.2rem;line-height: 1.5;} .header .right .search .content .input{font-size: 0;line-height: 1;max-width: 600px;margin: 0 auto;} .header .right .search .content input{height:.6rem;outline: none;vertical-align: middle} .header .right .search .content .inpt3{padding-left:.2rem;border:1px solid #d2d2d2;font-size: .16rem;width: calc(100% - 60px);color:#292929;} .header .right .search .content .inpt3::-webkit-input-placeholder {color: #b6b6b6;} .header .right .search .content .inpt3:-moz-placeholder {color: #b6b6b6;} .header .right .search .content .inpt3::-moz-placeholder {color: #b6b6b6;} .header .right .search .content .inpt3:-ms-input-placeholder {color: #b6b6b6;} .header .right .search .content .inpt4{width:.6rem;background: #222;border:none;} .header .right .search .content button{height:.6rem;outline: none;vertical-align: middle} .header .right .search .content .inpt4 i {font-size: .24rem;color:#fff;} .header .right .search .content.active .s-content{transform: none;opacity: 1;transition-delay: 0.36s;} .tem_banner.indise .flash {position: fixed;top:0;left: 0;width: 100%;padding:.9rem 0 0} .tem_banner.indise .flash .bg{background-size:cover;background-repeat:no-repeat;background-position:center center;transition:none} .tem_banner.indise .flash .col_banner{position:relative} .tem_banner.indise .flash .bl_box{position:absolute;width:100%;height:100%;background:rgba(0,0,0,1);left:0;top:0;opacity:0;z-index:1;transition:none} .tem_banner.indise .txt{position:absolute;left:3.2rem;z-index:2;padding:0 0 2.13rem;transition:none;bottom:0} .tem_banner.indise .txt h1{font-size:.72rem;color:white;text-transform:uppercase;font-weight:bold} .tem_banner.indise .pro_txt{padding:0 0 1.35rem;} .tem_banner.indise .pro_txt h1{color:#009e96} .tem_banner.indise{} .about_box{position:relative;z-index:2;background:white} .about_box .company .bg{padding:0 0 0 3.2rem;position:relative} .about_box .company .title{padding:1rem 0 .4rem;text-align:right;} .about_box .company .title h2{font-size:.55rem;color:#eeeeee;text-transform:uppercase;font-weight:bold;padding:0 .9rem 0 0 } .about_box .company .box{background:#222222;padding:.9rem 3.2rem 1.1rem 5.8rem} .about_box .company .box h2{font-size:.48rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .35rem} .about_box .company .box p{font-size:.16rem;color:#ffffff;font-family:"MONTSERRAT-LIGHT";line-height:.25rem} .about_box .company .video{position:absolute;top:1rem;left:0;width:41.6%} .about_box .company .video a{overflow:hidden;position:relative} .about_box .company .video a:hover .img img{transform:scale(1.1)} .about_box .company .video a .plays{cursor:pointer;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:.58rem;height:.58rem;line-height:.58rem;text-align:center} .about_box .company .video a .plays img{max-width:.2rem} .about_box .company .video a .plays:after{content:"";position:absolute;width:100%;height:100%;border-radius:100%;background:#009d96;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .about_box .company .video a .plays:before{content:"";position:absolute;width:135%;height:135%;border-radius:100%;background:rgba(0,157,150,.25);;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .about_box .company .video a:hover .plays:after{ animation: scalepulse 1.3s linear .3s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} .about_box .company .video a:hover .plays:before{ animation: scalepulse 1.3s linear .15s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} @keyframes scalepulse { 20% { -webkit-transform: translate3d(-50%, -50%, 0) scale(1.15); transform: translate3d(-50%, -50%, 0) scale(1.15); -webkit-animation-timing-function: ease; animation-timing-function: ease } 50% { -webkit-transform: translate3d(-50%, -50%, 0) scale(1); transform: translate3d(-50%, -50%, 0) scale(1); -webkit-animation-timing-function: ease; animation-timing-function: ease } } .about_box .company ul{display:flex;padding:.65rem 3.2rem .5rem .8rem;background:#009e96} .about_box .company ul li{width:33.33%} .about_box .company ul li h2{margin:0 0 .1rem} .about_box .company ul li h2 em{font-size:.85rem;color:#ffffff;font-weight:bold;height:.7rem;line-height:.7rem} .about_box .company ul li h2{font-size:.36rem;color:#ffffff;font-weight:bold;display:flex;align-items: flex-end;} .about_box .company ul li p{font-size:.2rem;color:#ffffff;font-family:"MONTSERRAT-LIGHT";text-transform:uppercase;} .video_fixed{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:9999;transition:none;display:none;} .video_fixed .mains{position:absolute;top:80%;left:50%;width:100%;max-width:10rem;transform:translate(-50%,-50%);opacity:0;} .video_fixed .mains.on {top:50%;opacity:1} .video_fixed .close_{position:absolute;top:22%;right:20%;cursor:pointer;} .video_fixed .close_ i {width:.41rem;height:.41rem;border:2px solid white;font-size:.24rem;color:white;line-height:.41rem;text-align:center;border-radius:100%;display:block;} .video_fixed .mains video {width:100%;height:5rem;object-fit:cover;} .about_box .choose>div{padding:1rem 0 .9rem} .about_box .choose>div>h2{font-size:.48rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .55rem} .about_box .choose ul{display:grid;display:grid;grid-template-columns:1fr 1fr 1fr ;grid-gap:0 1.15rem} .about_box .choose ul li h2{width:1.4rem;height:1.4rem;border-radius:100%;border:2px solid #009e96;text-align:center;line-height:1.4rem;font-size:.72rem;font-weight:bold;margin:0 0 .35rem} .about_box .choose ul li p{font-size:.17rem;color:#222222;font-family:"MONTSERRAT-LIGHT";line-height:.25rem} .about_box .history{background:#009e96;padding:1rem 1.6rem} .about_box .history>div{background:white;border-radius:30px} .about_box .history .history_top {padding:0 0 .8rem} .about_box .history .history_top .title{padding:.85rem 0 .45rem} .about_box .history .history_top .title h2{font-size:.48rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .55rem} .about_box .history .history_top .title h3{font-size:.3rem;color:#009e96;font-weight:bold} .about_box .history .history_top .lists{position:relative;} .about_box .history .history_top .lists:after{content:'';position:absolute;background:#009e96;width:100%;height:2px;top:50%;transform:translateY(-50%);left:0} .about_box .history .history_top .lists .items{height:3.4rem;display:flex;flex-direction: column;position:relative} .about_box .history .history_top .lists .items>div{height:50%} .about_box .history .history_top .lists .items.flt{flex-direction:column-reverse} .about_box .history .history_top .lists .items.flt .tit{display:flex;flex-direction: column;align-items: center;justify-content: flex-end;padding:0 0 .25rem;} .about_box .history .history_top .lists .items.fl .tit{display:flex;flex-direction: column;align-items: center;padding: .25rem 0 0} .about_box .history .history_top .lists .items:after{content:"";position:absolute;background:#009e96;width:.15rem;height:.15rem;border-radius:100%;left:50%;top:50%;transform:translate(-50%,-50%)} .about_box .history .history_top .lists .items .tit h2{font-size:.4rem;color:#009e96;font-weight:bold;} .about_box .history .history_top .lists .items.flt .info{padding:.2rem 0 0} .about_box .history .history_top .lists .items.fl .info{padding:0 0 .2rem} .about_box .history .history_top .lists .items .info .text{height:1.5rem;overflow-y:auto} .about_box .history .history_top .lists .items .info .text::-webkit-scrollbar-thumb{background:#009e96} .about_box .history .history_top .lists .items .info .text p{font-size:.16rem;color:#777777;line-height:.23rem;font-family:"MONTSERRAT-LIGHT";padding-left:.2rem;position:relative} .about_box .history .history_top .lists .items .info .text p:after{content:"";position:absolute;width:.11rem;height:.11rem;border-radius:100%;border:1px solid #009e96;left:0;top:6px} .about_box .history .history_top .lists .swiper-page>div{position:absolute;left:-.8rem;top:50%;transform:translateY(-50%);width:.6rem;height:.6rem;background:#eeeeee;text-align:center;line-height:.6rem;border-radius:100%;font-size:.3rem;color:#222222} .about_box .history .history_top .lists .swiper-page>div.slide-button-next{left:auto;right:-.8rem} .about_box .history .history_top .lists .swiper-page>div:hover{background:#009e96;color:white} .about_box .brand{display:flex;padding:0 0 .7rem} .about_box .brand>h2{width:18%;font-size:.3rem;color:#009e96;font-weight:bold} .about_box .brand .list{width:82%} .about_box .brand .list ul{height:5.1rem;overflow-y:auto;padding-right:.3rem} .about_box .brand .list ul::-webkit-scrollbar-thumb{background:#009e96} .about_box .brand .list ul::-webkit-scrollbar{background:#e6e6e6;width:5px;border-radius:10px} .about_box .brand .list ul li{margin:0 0 .3rem} .about_box .brand .list ul li h2{font-size:.2rem;color:#009e96;font-weight:bold;padding-left:.35rem;position:relative;margin:0 0 .18rem} .about_box .brand .list ul li h2:after{content:"";position:absolute;background:url(../images/4.png) 0 0 no-repeat;width:.18rem;height:.18rem;left:0;top:50%;transform:translateY(-50%);background-size:100%} .about_box .brand .list ul li .infos{padding-left:.35rem;font-size:.16rem;color:#777777;font-family:"MONTSERRAT-LIGHT";line-height:.25rem} .about_box .brand .list ul li .infos p{text-indent: 2em;margin:0 0 .1rem} .factory{padding:0 0 1rem} .factory>div>h3{padding:1rem 0 .4rem;font-size:.48rem;color:#009e96;text-transform:uppercase;font-weight:bold} .factory .lists .swiper-slide{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:.2rem} .factory .lists .swiper-slide a{overflow:hidden} .factory .lists .swiper-slide a:hover img{transform:scale(1.1)} .factory .lists .slide-pagination{text-align:center;margin:.3rem 0 0} .factory .lists .slide-pagination span{width:12px;height:12px;background:#e5e5e5;margin:0 9px;opacity:1} .factory .lists .slide-pagination span.swiper-pagination-bullet-active{background:#009e96;} .honor{padding:0 0 1rem} .honor>div>h3{padding:0 0 .4rem;font-size:.48rem;color:#009e96;text-transform:uppercase;font-weight:bold} .honor .lists a:hover img{transform:scale(.95);box-shadow:0 0 12px rgba(0,0,0,0.2)} .fot_img{position:relative;z-index:2;background:white} .fot_img ul{display:flex} .fot_img ul li{width:16.7%} .fot_img ul li:hover img{transform:scale(1.1)} .footer{position:relative;z-index:2;background:white} .footer>div{padding:.45rem 0 .4rem} .footer .top{display:flex;justify-content: space-between;align-items: flex-end;margin:0 0 .3rem} .footer .top .fot_nav ul{display:flex;} .footer .top .fot_nav ul li{padding:0 .25rem;position:relative} .footer .top .fot_nav ul li:after{content:"";position:absolute;background:#222222;width:2px;height:70%;top:50%;transform:translateY(-50%);right:-1px} .footer .top .fot_nav ul li a{text-transform:uppercase;font-size:.16rem;color:#222222 } .footer .top .fot_nav ul li:last-child{padding-right:0} .footer .top .fot_nav ul li:last-child:after{display:none} .footer .top .fot_nav ul li a:hover{color:#009e96} .footer .bot{display:flex;justify-content: space-between;} .footer .bot p{font-size:.15rem;color:#222222;margin:0 0 .2rem} .footer .bot .text{display:flex;;gap:10px;font-size:.15rem;color:#222222} .footer .bot .text a{font-size:.15rem;color:#222222} .footer .bot .text a:hover{color:#009e96} .product_box{position:relative;z-index:22;background:white;padding:.8rem 0 0} .product_box .pro_nav ul{display:flex;border-bottom:3px solid #009d96} .product_box .pro_nav ul li{width:33.33%;padding:0 0 .45rem;position:relative} .product_box .pro_nav ul li a{height:.6rem;} .product_box .pro_nav ul li:nth-child(1) a{background:url(../images/pro1.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .product_box .pro_nav ul li:nth-child(2) a{background:url(../images/pro2.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .product_box .pro_nav ul li:nth-child(3) a{background:url(../images/pro3.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .product_box .pro_nav ul li:nth-child(1) a:hover{background:url(../images/pro1-1.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li:nth-child(2) a:hover{background:url(../images/pro2-2.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li:nth-child(3) a:hover{background:url(../images/pro3-3.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li.active:nth-child(1) a{background:url(../images/pro1-1.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li.active:nth-child(2) a{background:url(../images/pro2-2.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li.active:nth-child(3) a{background:url(../images/pro3-3.png) center top no-repeat;background-size:3rem .6rem} .product_box .pro_nav ul li:after{content:"";position:absolute;background:url(../images/6.png) 0 0 no-repeat;width:.2rem;height:.1rem;left:50%;transform:translateX(-50%);bottom:0;background-size:100%;opacity:0} .product_box .pro_nav ul li.active:after{opacity:1} .product_box .text{padding:.35rem 0 .3rem} .product_box .text p{font-size:.15rem;color:#222222;font-family:"MONTSERRAT-LIGHT"} .product_box .pro_nav_two ul{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;grid-gap:.15rem} .product_box .pro_nav_two ul li{position:relative} .product_box .pro_nav_two ul li>a{height:.45rem;display:flex;flex-direction: column;align-items: center;justify-content: center;border-radius:50px;border:1px solid #009d96;font-size:.18rem;color:#222222;font-family:"MONTSERRAT-LIGHT"} .product_box .pro_nav_two ul li:hover>a{background:#009d96;color:white} .product_box .pro_nav_two ul li.active>a{background:#009d96;color:white} .product_box .pro_nav_two ul li:hover dl{display:block} .product_box .pro_nav_two ul li dl{position:absolute;z-index:8;padding:.08rem 0 0;display:none} .product_box .pro_nav_two ul li dl .box{border:1px solid #d2d2d2;;box-shadow:0 0 12px rgba(0,0,0,0.15)} .product_box .pro_nav_two ul li dl dd{border-bottom:1px solid #d2d2d2 } .product_box .pro_nav_two ul li dl dd:last-child{border:0} .product_box .pro_nav_two ul li dl dd a{font-size:.16rem;color:#333;white-space:nowrap;background:white;padding:.1rem .2rem;font-family:"MONTSERRAT-LIGHT";} .product_box .pro_nav_two ul li dl dd a:hover,.product_box .pro_nav_two ul li dl dd a.acts{background:#009d96;color:white} .product_box .main{display:flex;padding:.7rem 0 0;justify-content: space-between;} .product_box .main .shaixuan{width:21.5%} .product_box .main .shaixuan .items{margin:0 0 .3rem } .product_box .main .shaixuan .items>a{display:none} .product_box .main .shaixuan .items h2{margin:0 0 .2rem} .product_box .main .shaixuan .items select{width:100%;height:.4rem;border:0;border-radius:50px;background:#eeeeee url(../images/7.png) right.2rem center no-repeat;padding:0 .2rem;font-family:"MONTSERRAT-LIGHT";font-size:.14rem;color:#222222;appearance: none;position:relative;transition:.3s;} .product_box .main .shaixuan .items select:focus {outline: none; border-color:#009d96;box-shadow: 0 0 10px #009d96a8;} .product_box .main .shaixuan .items option{font-size:.15rem;;color:#222222} .product_box .main .lists{width:75%} .product_box .main .lists ul{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:.4rem .2rem} .product_box .main .lists ul li a .img span{background:none !important} .product_box .main .lists ul li a .img img{} .product_box .main .lists ul li a .txt{padding:.2rem 0 0} .product_box .main .lists ul li a .txt h2{font-size:.14rem;color:#222222;line-height:.2rem;height:.6rem} .product_box .main .lists ul li a .img {position:relative} .product_box .main .lists ul li a .img:after{content:"";position:absolute;width:100%;height:100%;border:2px solid #009e96;left:0;top:0;left:0;opacity:0;transition:.5s} .product_box .main .lists ul li a:hover .img:after{opacity:1} .product_box .main .lists ul li a:hover img{transform:scale(1.05)} .product_box .main .lists ul li a .img:before{position:absolute;content:"";background:url(../images/8.png) 0 0 no-repeat;width:.25rem;height:.25rem;right:.1rem;bottom:.1rem;z-index:2;opacity:0;transition:.5s;background-size:100%} .product_box .main .lists ul li a:hover .img:before{opacity:1} .product_box .main .lists ul li a:hover .txt h2{color:#009e96} .product_box .main .lists .page{padding:.5rem 0 1rem;display:flex;justify-content: center;} .product_box .main .lists .page a{width:.4rem;height:.4rem;line-height:.4rem;font-size:.16rem;color:#959595;font-family:"MONTSERRAT-LIGHT";margin:0 5px;} .product_box .main .lists .page a.page-link{width:.7rem;border:1px solid #d2d2d2} .product_box .main .lists .page a.page-links{border:1px solid #d2d2d2;} .product_box .main .lists .page a.page-links i{font-size:.16rem;color:#959595;} .product_box .main .lists .page a.page-link:hover{background:#009e96;color:white;border-color:#009e96} .product_box .main .lists .page a.page-links:hover{background:#009e96;color:white;border-color:#009e96} .product_box .main .lists .page a.page-links:hover i{color:white} .product_box .main .lists .page a:hover{background:#009e96;color:white;border-color:#009e96} .product_box .main .lists .page a.page-num-current{background:#009e96;color:white;border-color:#009e96} .product_box .like_pro{padding:0 0 1rem} .product_box .like_pro>h3{font-size:.36rem;color:#009e96;font-weight:bold;text-transform:uppercase;margin:0 0 .45rem} .product_box .like_pro a .txt{padding:.2rem 0 0} .product_box .like_pro a .txt h2{font-size:.14rem;color:#222222;line-height:.2rem;height:.6rem} .product_box .like_pro a .img {position:relative} .product_box .like_pro a .img:after{content:"";position:absolute;width:100%;height:100%;border:2px solid #009e96;left:0;top:0;left:0;opacity:0;transition:.5s} .product_box .like_pro a:hover .img:after{opacity:1} .product_box .like_pro a:hover img{transform:scale(1.05)} .product_box .like_pro a .img:before{position:absolute;content:"";background:url(../images/8.png) 0 0 no-repeat;width:.25rem;height:.25rem;right:.1rem;bottom:.1rem;z-index:2;opacity:0;transition:.5s;background-size:100%} .product_box .like_pro a:hover .img:before{opacity:1} .product_box .like_pro a:hover .txt h2{color:#009e96} .product_detailed{padding:.9rem 0 0} .product_detailed .pro_banner{background:url(../images/9.jpg) 0 0 no-repeat;background-size:cover;padding:.5rem 0 .45rem;} .product_detailed .pro_banner .text h2{font-size:.24rem;color:white;margin:0 0 .15rem} .product_detailed .pro_banner .text .mbx{display:flex;font-size:.14rem;color:white;;font-family:"MONTSERRAT-LIGHT";gap:4px;} .product_detailed .pro_banner .text .mbx a{font-size:.14rem;color:white;;font-family:"MONTSERRAT-LIGHT";} .product_detailed .product_info>div{display:flex;padding:.65rem 0 .8rem;justify-content: space-between;align-items: flex-start;} .product_detailed .product_info .left{width:26.5%} .product_detailed .product_info .left .big_img{border:2px solid #eeeeee} .product_detailed .product_info .left .swiper-wrapper{align-items: center;} .product_detailed .product_info .left .img_list{margin:.2rem 0 ;padding:0 .4rem;position:relative} .product_detailed .product_info .left .img_list .img{border:2px solid transparent } .product_detailed .product_info .left .img_list .swiper-slide-thumb-active .img{border:2px solid #009e96 } .product_detailed .product_info .left .img_list .swiper-page>div{position:absolute;height:.8rem;width:.3rem;line-height:.8rem;left:0;top:50%;transform:translateY(-50%);background:#f8f8f8;border-radius:5px;text-align:center;font-size:.24rem;color:black} .product_detailed .product_info .left .img_list .swiper-page>div.slide-button-next{left:auto;right:0} .product_detailed .product_info .left .img_list .swiper-page>div:hover{background:#009e96;color:white} .cloudzoom-zoom *,.cloudzoom-blank *,.cloudzoom-zoom,.cloudzoom-blank{transition:none !important} .product_detailed .product_info .right{width:69%} .product_detailed .product_info .right .biaoge table{width:100%} .product_detailed .product_info .right .biaoge table tr td{padding: .05rem;font-size:.15rem;color:#222222} .product_detailed .product_info .right .biaoge table tr:nth-child(2n-1) td{background:#eeeeee;border:2px solid white} .product_detailed .product_info .right .download{margin:.3rem 0 0;display:flex;gap:10px} .product_detailed .product_info .right .download a{width:2.1rem;height:.4rem;line-height:.4rem;border-radius:50px;border:1px solid #009e96;text-align:center;font-size:.16rem;color:#222222} .product_detailed .product_info .right .download a:last-child{background:#009e96;color:white} .product_detailed .product_info .right .download a:hover{background:#009e96;color:white;box-shadow:0 0 12px rgba(0,0,0,0.2)} .product_detailed .product_text h3{font-size:.2rem;color:#222222;text-transform:uppercase;padding:0 0 .15rem;border-bottom:2px solid #009e96} .product_detailed .product_text .conent{text-align:center;padding:.3rem 0 .7rem} .product_detailed .pro_contact{padding:0 1rem} .product_detailed .pro_contact>div{background:#009e96;padding:.9rem 0;border-radius:20px} .product_detailed .pro_contact>div>div{display:grid;grid-template-columns:1fr 1fr;} .product_detailed .pro_contact .left{display:flex;flex-direction: column;justify-content: space-between;padding-right:.3rem} .product_detailed .pro_contact .left>h2{font-size:.36rem;color:white;font-weight:bold;text-transform:uppercase;padding:0 0 .1rem} .product_detailed .pro_contact .left ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.55rem .45rem;} .product_detailed .pro_contact .left ul li h2{font-size:.2rem;color:white;margin:0 0 .15rem} .product_detailed .pro_contact .left ul li p{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white} .product_detailed .pro_contact .left ul li p a{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white;display:inline-block;border-bottom:1px solid white} .product_detailed .pro_contact .left .share h3{font-size:.2rem;color:white;margin:0 0 .2rem} .product_detailed .pro_contact .left .share .dd{display:flex;gap:.18rem} .product_detailed .pro_contact .left .share .dd a{width:.4rem;height:.4rem;background:#007d77;border-radius:100%;line-height:.45rem;text-align:center;} .product_detailed .pro_contact .left .share .dd a i{color:white;font-size:.2rem} .product_detailed .pro_contact .left .share .dd a:hover{background:white} .product_detailed .pro_contact .left .share .dd a:hover i{color:black} .product_detailed .pro_contact .left .share .dd a:nth-child(3){line-height:.4rem} .product_detailed .pro_contact .left .share .dd a img{max-width:.2rem;} .product_detailed .pro_contact .left .share .dd a:hover img{filter:brightness(1) invert(1)} .product_detailed .pro_contact .form{background:white;padding:.5rem .3rem .5rem;border-radius:20px} .product_detailed .pro_contact .form h3{font-size:.36rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .4rem} .product_detailed .pro_contact .form .box ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.2rem;margin:0 0 .2rem} .product_detailed .pro_contact .form .box ul li{position:relative;} .product_detailed .pro_contact .form .box ul li:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:50%;transform:translateY(-50%);height:.2rem} .product_detailed .pro_contact .form .box ul li:nth-child(3):after,.product_detailed .pro_contact .form .box ul li:nth-child(4):after{display:none} .product_detailed .pro_contact .form .box ul li input{height:.5rem;border-radius:50px;width:100%;border:1px solid #dcdcdc;padding:0 .25rem;font-size:.16rem;color:black} .product_detailed .pro_contact .form .box .area{position:relative} .product_detailed .pro_contact .form .box .area:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:.15rem;height:.2rem} .product_detailed .pro_contact .form .box .area textarea{width:100%;height:1.5rem;border-radius:30px;padding:.18rem .25rem;font-size:.16rem;color:black;border:1px solid #dcdcdc;} .product_detailed .pro_contact .form .sub{margin:.2rem 0 0} .product_detailed .pro_contact .form .sub button{width:2.8rem;background:#009e96;border-radius:50px;height:.5rem;border:0;font-size:.2rem;color:white;text-transform:uppercase;font-weight:bold} .product_detailed .pro_contact .form .sub button:hover{box-shadow:0 0 12px rgba(0,0,0,0.5)} .product_detailed .like_pro{padding:1rem 0} .product_detailed .like_pro>div>h3{font-size:.36rem;color:#009e96;font-weight:bold;text-transform:uppercase;margin:0 0 .45rem} .product_detailed .like_pro a .txt{padding:.2rem 0 0} .product_detailed .like_pro a .txt h2{font-size:.14rem;color:#222222;line-height:.2rem;height:.6rem} .product_detailed .like_pro a .img {position:relative} .product_detailed .like_pro a .img:after{content:"";position:absolute;width:100%;height:100%;border:2px solid #009e96;left:0;top:0;left:0;opacity:0;transition:.5s} .product_detailed .like_pro a:hover .img:after{opacity:1} .product_detailed .like_pro a:hover img{transform:scale(1.05)} .product_detailed .like_pro a .img:before{position:absolute;content:"";background:url(../images/8.png) 0 0 no-repeat;width:.25rem;height:.25rem;right:.1rem;bottom:.1rem;z-index:2;opacity:0;transition:.5s} .product_detailed .like_pro a:hover .img:before{opacity:1} .product_detailed .like_pro a:hover .txt h2{color:#009e96} .news_box{position:relative;background:white;z-index:2;padding:.3rem 0 0} .news_box ul li{padding:.5rem 0;border-bottom:1px solid #e5e5e5} .news_box ul li:last-child{border:0} .news_box ul li a{display:flex;justify-content: space-between;} .news_box ul li a .img{width:40.7%} .news_box ul li a .text{width:55.5%;display:flex;flex-direction: column;justify-content: space-between;} .news_box ul li a .text h2{font-size:.26rem;color:#191919} .news_box ul li a .text span{font-size:.15rem;color:#777777;font-family:"MONTSERRAT-LIGHT";display:inline-block;margin:.05rem 0 .13rem} .news_box ul li a .text p{font-size:.16rem;color:#777777;font-family:"MONTSERRAT-LIGHT";height:.66rem;line-height:.22rem} .news_box ul li a .text em{display:inline-block;width:2rem;height:.5rem;color:white;font-size:.16rem;background:#222222;text-align:center;line-height:.5rem;border-radius:50px;text-transform:uppercase} .news_box ul li a:hover img{transform:scale(1.1)} .news_box ul li a:hover .text em{background:#009e96;box-shadow:0 0 12px rgba(0,0,0,0.2)} .news_box ul li a:hover .text h2{color:#009e96} .news_box .page{padding:.5rem 0 1rem;display:flex;justify-content: center;} .news_box .page a{width:.4rem;height:.4rem;line-height:.4rem;font-size:.16rem;color:#959595;font-family:"MONTSERRAT-LIGHT";margin:0 5px;} .news_box .page a.page-link{width:.7rem;border:1px solid #d2d2d2} .news_box .page a.page-links{border:1px solid #d2d2d2;} .news_box .page a.page-links i{font-size:.16rem;color:#959595;} .news_box .page a.page-link:hover{background:#009e96;color:white;border-color:#009e96} .news_box .page a.page-links:hover{background:#009e96;color:white;border-color:#009e96} .news_box .page a.page-links:hover i{color:white} .news_box .page a:hover{background:#009e96;color:white;border-color:#009e96} .news_box .page a.page-num-current{background:#009e96;color:white;border-color:#009e96} .contact_box{position:relative;background:#009e96;z-index:2;padding:.9rem 0} .contact_box>div{display:grid;grid-template-columns:1fr 1fr;} .contact_box .left{display:flex;flex-direction: column;justify-content: space-between;padding-right:.3rem} .contact_box .left>h2{font-size:.36rem;color:white;font-weight:bold;text-transform:uppercase;padding:0 0 .1rem} .contact_box .left ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.55rem .45rem;} .contact_box .left ul li h2{font-size:.2rem;color:white;margin:0 0 .15rem} .contact_box .left ul li p{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white} .contact_box .left ul li p a{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white;display:inline-block;border-bottom:1px solid white} .contact_box .left .share h3{font-size:.2rem;color:white;margin:0 0 .2rem} .contact_box .left .share .dd{display:flex;gap:.18rem} .contact_box .left .share .dd a{width:.4rem;height:.4rem;background:#007d77;border-radius:100%;line-height:.45rem;text-align:center;} .contact_box .left .share .dd a i{color:white;font-size:.2rem} .contact_box .left .share .dd a:hover{background:white} .contact_box .left .share .dd a:hover i{color:black} .contact_box .left .share .dd a:nth-child(3){line-height:.4rem} .contact_box .left .share .dd a img{max-width:.2rem;} .contact_box .left .share .dd a:hover img{filter:brightness(1) invert(1)} .contact_box .form{background:white;padding:.5rem .3rem .5rem;border-radius:20px} .contact_box .form h3{font-size:.36rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .4rem} .contact_box .form .box ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.2rem;margin:0 0 .2rem} .contact_box .form .box ul li{position:relative;} .contact_box .form .box ul li:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:50%;transform:translateY(-50%);height:.2rem} .contact_box .form .box ul li:nth-child(3):after,.contact_box .form .box ul li:nth-child(4):after{display:none} .contact_box .form .box ul li input{height:.5rem;border-radius:50px;width:100%;border:1px solid #dcdcdc;padding:0 .25rem;font-size:.16rem;color:black} .contact_box .form .box .area{position:relative} .contact_box .form .box .area:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:.15rem;height:.2rem} .contact_box .form .box .area textarea{width:100%;height:1.5rem;border-radius:30px;padding:.18rem .25rem;font-size:.16rem;color:black;border:1px solid #dcdcdc;} .contact_box .form .sub{margin:.2rem 0 0} .contact_box .form .sub button{width:2.8rem;background:#009e96;border-radius:50px;height:.5rem;border:0;font-size:.2rem;color:white;text-transform:uppercase;font-weight:bold} .contact_box .form .sub button:hover{box-shadow:0 0 12px rgba(0,0,0,0.5)} .mobile_index{display:none} .tem_banner.index{padding:.9rem 0 0} .tem_banner.index .swiper {overflow:hidden} .tem_banner.index .swiper .banner_txt{position:absolute;left:3.2rem;top:50%;transform:translateY(-50%);z-index:2;width:20%;text-align:left} .tem_banner.index .swiper .banner_txt h2{font-size:.8rem;color:white;text-transform:uppercase;font-weight:bold;margin:0 0 .6rem;transform:translateY(-3vw);opacity:0;transition:all .8s linear} .tem_banner.index .swiper .banner_txt a{font-size:.16rem;color:white;padding-left:.8rem;display:inline-block;position:relative;transform:translateY(3vw);opacity:0;transition:all .8s linear} .tem_banner.index .swiper .banner_txt a .plays{position:absolute;left:0;top:50%;transform:translateY(-50%);width:.58rem;height:.58rem;line-height:.58rem;text-align:center;} .tem_banner.index .swiper .banner_txt a .plays img{max-width:.14rem} .tem_banner.index .swiper .banner_txt a .plays:after{content:"";position:absolute;width:100%;height:100%;border-radius:100%;background:#009d96;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .tem_banner.index .swiper .banner_txt a .plays:before{content:"";position:absolute;width:135%;height:135%;border-radius:100%;background:rgba(0,157,150,.25);;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .tem_banner.index .swiper .banner_txt a:hover .plays:after{ animation: scalepulse 1.3s linear .3s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} .tem_banner.index .swiper .banner_txt a:hover .plays:before{ animation: scalepulse 1.3s linear .15s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} .tem_banner.index .swiper .swiper-slide-active .banner_txt h2{transform:none;opacity:1;transition-delay:300ms} .tem_banner.index .swiper .swiper-slide-active .banner_txt a{transform:none;opacity:1;transition-delay:300ms} .tem_banner.index .slide-pagination {position:absolute;left:50%;transform:translateX(-50%);bottom:.05rem;z-index:2;text-align:center} .tem_banner.index .slide-pagination span{opacity:1;width:.16rem;height:.16rem;background:none;border:2px solid white;margin:0 .1rem} .tem_banner.index .slide-pagination span.swiper-pagination-bullet-active{background:#009e96;border-color:#009e96} .index_about{background-size:cover;position:relative;z-index:2;background-repeat:no-repeat} .index_about:after{content:'';position:absolute;background:#009e96;width:100%;height:100%;left:0;top:0;opacity:.75;z-index:-1} .index_about .titles{padding:.9rem 0 .65rem} .index_about .titles h2{font-size:.48rem;color:#ffffff;text-transform:uppercase;font-weight:bold;margin:0 0 .18rem} .index_about .titles p{font-size:.2rem;color:white;font-family:"MONTSERRAT-LIGHT"} .index_about .infos ul{display:flex;} .index_about .infos ul li{width:33.33%} .index_about .infos ul li h2{margin:0 0 .1rem} .index_about .infos ul li h2 em{font-size:.85rem;color:#ffffff;font-weight:bold;height:.7rem;line-height:.7rem} .index_about .infos ul li h2{font-size:.36rem;color:#ffffff;font-weight:bold;display:flex;align-items: flex-end;} .index_about .infos ul li p{font-size:.2rem;color:#ffffff;font-family:"MONTSERRAT-LIGHT";text-transform:uppercase;} .index_about .more{padding:.6rem 0 1rem;} .index_about .more a{display:inline-block;width:2rem;height:.5rem;background:white;border-radius:50px;background:white;color:#009e96;font-size:.16rem;text-align:center;line-height:.5rem;text-transform:uppercase} .index_about .more a:hover{background:#009e96;box-shadow:0 0 30px rgba(255,255,255,1);color:white} .index_product{background:url(../images/12.jpg) 0 0 no-repeat;background-size:cover} .index_product .title{padding:1rem 0 .75rem} .index_product .title h2{font-size:.48rem;color:#009e96;font-weight:bold;text-transform:uppercase} .index_product ul{display:flex;border-bottom:3px solid #009d96} .index_product ul li{width:33.33%;padding:0 0 .4rem;position:relative;overflow:hidden} .index_product ul li a{height:.6rem;} .index_product ul li:nth-child(1) a{background:url(../images/pro1.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .index_product ul li:nth-child(2) a{background:url(../images/pro2.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .index_product ul li:nth-child(3) a{background:url(../images/pro3.png) center top no-repeat;background-size:3rem .6rem;transition:.5s} .index_product ul li:nth-child(1) a:hover{background:url(../images/pro1-1.png) center top no-repeat;background-size:3rem .6rem} .index_product ul li:nth-child(2) a:hover{background:url(../images/pro2-2.png) center top no-repeat;background-size:3rem .6rem} .index_product ul li:nth-child(3) a:hover{background:url(../images/pro3-3.png) center top no-repeat;background-size:3rem .6rem} .index_product ul li.tcl-active:nth-child(1) a{background:url(../images/pro1-1.png) center top no-repeat;background-size:3rem .6rem;} .index_product ul li.tcl-active:nth-child(2) a{background:url(../images/pro2-2.png) center top no-repeat;background-size:3rem .6rem} .index_product ul li.tcl-active:nth-child(3) a{background:url(../images/pro3-3.png) center top no-repeat;background-size:3rem .6rem} .index_product ul li:after{content:"";position:absolute;background:url(../images/6.png) 0 0 no-repeat;width:.2rem;height:.1rem;left:50%;transform:translateX(-50%);bottom:-.1rem;background-size:100%;opacity:0;transition:.5s} .index_product ul li.tcl-active:after{opacity:1;bottom:0} .index_product .infos .items {display:none} .index_product .infos .items:first-child{display:block} .index_product .infos .items .txt{padding:.2rem 0 .55rem;font-size:.15rem;color:#222222;font-family:"MONTSERRAT-LIGHT"} .index_product .infos .items a .img{background:white;position:relative} .index_product .infos .items a h2{margin:.2rem 0 0;font-size:.14rem;color:#222222;font-family:"MONTSERRAT-LIGHT";line-height:.18rem;height:.36rem} .index_product .infos .items a:hover img{transform:scale(1.1)} .index_product .infos .items a .img:after{content:"";position:absolute;width:100%;height:100%;border:2px solid #009e96;left:0;top:0;left:0;opacity:0;transition:.5s} .index_product .infos .items a:hover .img:after{opacity:1} .index_product .infos .items a:hover img{transform:scale(1.05)} .index_product .infos .items a .img:before{position:absolute;content:"";background:url(../images/8.png) 0 0 no-repeat;width:.25rem;height:.25rem;right:.1rem;bottom:.1rem;z-index:2;opacity:0;transition:.5s;background-size:100%} .index_product .infos .items a:hover .img:before{opacity:1} .index_product .more{padding:.5rem 0 .85rem;text-align:center} .index_product .more a{display:inline-block;width:2.5rem;height:.5rem;background:#009e96;line-height:.5rem;text-align:center;border-radius:50px;font-size:.16rem;color:white;text-transform:uppercase;border:2px solid white} .index_product .more a:hover{background:white;color:#009e96;box-shadow:0 0 12px rgba(0,0,0,0.5)} .index_factory{padding:0 0 1rem} .index_factory .title{padding:1rem 0 .4rem;display:flex;justify-content: space-between;} .index_factory .title .swiper-page{display:flex;gap:.3rem;align-items: center;} .index_factory .title .swiper-page>div i{color:#dcdcdc;font-size:.36rem} .index_factory .title .swiper-page>div:hover i{color:#009e96} .index_factory .title h2{font-size:.48rem;color:#009e96;font-weight:bold;text-transform:uppercase} .index_factory .lists a .img img{width:100%} .index_factory .lists a:hover img{transform:scale(1.1)} .index_news{padding:0 0 1rem} .index_news .title h2{font-size:.48rem;color:#009e96;font-weight:bold;text-transform:uppercase;margin:0 0 .55rem} .index_news ul{display:grid;grid-template-columns:1fr 1fr 1fr ;grid-gap:0 1.15rem;position:relative} .index_news ul li{position:relative} .index_news ul li:nth-child(2):after{content:"";position:absolute;width:1px;height:100%;background:#e6e6e6;left:-.575rem;top:0} .index_news ul li:nth-child(2):before{content:"";position:absolute;width:1px;height:100%;background:#e6e6e6;right:-.575rem;top:0} .index_news ul li a:hover img{transform:scale(1.1)} .index_news ul li a .text{padding:.14rem 0 0} .index_news ul li a .text span{font-size:.16rem;color:#999999;font-family:"MONTSERRAT-LIGHT";display:inline-block;margin:0 0 .25rem} .index_news ul li a .text h2{font-size:.24rem;color:#222222;height:.78rem;line-height:.26rem;margin:0 0 .3rem} .index_news ul li a .text em{width:2rem;height:.5rem;text-align:center;border-radius:50px;background:#222222;display:inline-block;line-height:.5rem;font-size:.16rem;color:white;text-transform:uppercase} .index_news ul li a:hover .text em{background:#009e96;box-shadow:0 0 12px rgba(0,0,0,0.5)} .index_news ul li a:hover .text h2{color:#009e96} .index_about_info{position:relative} .index_about_info .swiper-page{display:none} .index_about_info .swiper-page>div{position:absolute;left:0rem;top:50%;transform:translateY(-50%);width:.7rem;height:.7rem;background:#eeeeee;text-align:center;line-height:.7rem;border-radius:100%;font-size:.48rem;color:#222222;z-index:2} .index_about_info .swiper-page>div.slide-button-next{left:auto;right:0rem} .index_about_info .swiper-page>div:hover{background:#009e96;color:white} .index_about_info a{height:6rem;background-size:cover;background-repeat:no-repeat;position:relative;overflow:hidden} .index_about_info a .text{position:absolute;width:100%;height:100%;background:#009e96;padding:1rem .46rem 0;right:100%;transition:.7s } .index_about_info a .text h2{font-size:.4rem;color:white;font-weight:bold;margin:0 0 .35rem} .index_about_info a .text p{font-size:.16rem;color:white;font-family:"MONTSERRAT-LIGHT";line-height:.23rem} .index_about_info a .text em{margin:.8rem 0 0;display:inline-block;font-size:.16rem;color:white} .index_about_info a>h3{font-size:.26rem;color:#222222;position:absolute;;bottom:.45rem;left:.5rem;} .index_about_info a:hover>h3{bottom:-1rem} .index_about_info a:hover .text {right:0;;transition-delay:400ms} .index_contact{padding:1rem} .index_contact>div{background:#009e96;padding:.9rem 0;border-radius:20px} .index_contact>div>div{display:grid;grid-template-columns:1fr 1fr;} .index_contact .left{display:flex;flex-direction: column;justify-content: space-between;padding-right:.3rem;} .index_contact .left>h2{font-size:.36rem;color:white;font-weight:bold;text-transform:uppercase;padding:0 0 .1rem} .index_contact .left ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.55rem .45rem;} .index_contact .left ul li h2{font-size:.2rem;color:white;margin:0 0 .15rem} .index_contact .left ul li p{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white} .index_contact .left ul li p a{font-family:"MONTSERRAT-LIGHT";font-size:.16rem;color:white;display:inline-block;border-bottom:1px solid white} .index_contact .left .share h3{font-size:.2rem;color:white;margin:0 0 .2rem} .index_contact .left .share .dd{display:flex;gap:.18rem} .index_contact .left .share .dd a{width:.4rem;height:.4rem;background:#007d77;border-radius:100%;line-height:.45rem;text-align:center;} .index_contact .left .share .dd a i{color:white;font-size:.2rem} .index_contact .left .share .dd a:hover{background:white} .index_contact .left .share .dd a:hover i{color:black} .index_contact .left .share .dd a:nth-child(3){line-height:.4rem} .index_contact .left .share .dd a img{max-width:.2rem;} .index_contact .left .share .dd a:hover img{filter:brightness(1) invert(1)} .index_contact .form{background:white;padding:.5rem .3rem .5rem;border-radius:20px} .index_contact .form h3{font-size:.36rem;color:#009e96;text-transform:uppercase;font-weight:bold;margin:0 0 .4rem} .index_contact .form .box ul{display:grid;grid-template-columns:1fr 1fr;grid-gap:.2rem;margin:0 0 .2rem} .index_contact .form .box ul li{position:relative;} .index_contact .form .box ul li:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:50%;transform:translateY(-50%);height:.2rem} .index_contact .form .box ul li:nth-child(3):after,.index_contact .form .box ul li:nth-child(4):after{display:none} .index_contact .form .box ul li input{height:.5rem;border-radius:50px;width:100%;border:1px solid #dcdcdc;padding:0 .25rem;font-size:.16rem;color:black} .index_contact .form .box .area{position:relative} .index_contact .form .box .area:after{content:"*";position:absolute;font-size:.2rem;color:red;left:.12rem;top:.15rem;height:.2rem} .index_contact .form .box .area textarea{width:100%;height:1.5rem;border-radius:30px;padding:.18rem .25rem;font-size:.16rem;color:black;border:1px solid #dcdcdc;} .index_contact .form .sub{margin:.2rem 0 0} .index_contact .form .sub button{width:2.8rem;background:#009e96;border-radius:50px;height:.5rem;border:0;font-size:.2rem;color:white;text-transform:uppercase;font-weight:bold} .index_contact .form .sub button:hover{box-shadow:0 0 12px rgba(0,0,0,0.5)} /********<=767 mobile nav style css********/ .fl-page{position:relative;top:-1.5rem;} #menu {display:none;} #menu.mm-menu.mm-current{display:block;} .m-header {background:#FFF;box-shadow:0 0 12px rgba(0,0,0,0.2)} .m-header >.col-xs-6>div {color:#333;line-height:normal;} .m-header >.col-xs-6 .langs>*{display:inline-block;font-size:14px;color:#333;line-height:normal;} .m-header >.col-xs-6 .langs em {padding:0 5px;} .m-header >.col-xs-6 .langs a{width:30px;height:30px;background:#333;color:#FFF;line-height:30px;text-align:center;border-radius:100%;margin:0 0 0 5px;} .m-header >.col-xs-6 .menu{margin-left:.15rem;} .m-header >.col-xs-6 .menu a{font-size:16px;color:#333} .m-header >.col-xs-6 .menu a>* {display:inline-block;vertical-align:middle;} .m-header >.col-xs-6 .menu a i {font-size:20px;} .m-header >.col-xs-6 img {max-height:45px;} .st-container .st-menu {background:white; -webkit-transition: all .6s cubic-bezier(.77,0,.175,1) 0s; -o-transition: all .6s cubic-bezier(.77,0,.175,1) 0s; transition: all .6s cubic-bezier(.77,0,.175,1) 0s; } .st-container .st-menu ul li a {color:#333;position:relative;font-size:.25rem} .st-container .st-menu ul li>a:hover,.st-container .st-menu ul li.active>a {background:#009e96;box-shadow:0 4px 8px rgba(0,0,0,0.2);border-radius:5px;color:#FFF} .st-container .st-menu ul li>a>i {position:absolute;right:1em;top:50%;transform:translateY(-50%);color:#333} .st-container .st-menu ul li.active>a>i,.st-container .st-menu ul li>a:hover>i {color:#FFF} .st-container .st-menu ul li>dl {transition:none;margin:0} .st-container .st-menu ul li>dl dd a {background:none;box-shadow:none;color:#333;padding-left:0} .st-container .st-menu ul li>dl dd a i {padding-right:10px;} .st-container .st-menu ul li>dl dd.on2 a,.st-container .st-menu ul li>dl dd a:hover {color:#009e96} .st-container .st-menu ul li>dl dd.on2 a i,.st-container .st-menu ul li>dl dd a:hover i {padding-right:16px} .st-effect-1.st-menu {display:block;} .st-btn.menu i{font-size:.4rem} .fixed_box{position:fixed;right:.15rem;z-index:999;top:30%} .fixed_box ul li{margin:0 0 5px;position:relative} .fixed_box ul li>a{width:.48rem;height:.48rem;border-radius:3px;border:1px solid #009e96;box-shadow:0 0 12px rgba(0,0,0,0.1)} .fixed_box ul li:nth-child(1)>a{background:white url(../images/13.png) center center no-repeat;background-size:.25rem .18rem} .fixed_box ul li:nth-child(2)>a{background:white url(../images/14.png) center center no-repeat;background-size:.22rem .23rem} .fixed_box ul li:nth-child(3)>a{background:white url(../images/15.png) center center no-repeat;background-size:.25rem .26rem} .fixed_box ul li:nth-child(4)>a{background:white url(../images/wx1.png) center center no-repeat;background-size:.28rem .28rem} .fixed_box ul li:nth-child(1):hover>a{background:#009e96 url(../images/13-1.png) center center no-repeat;background-size:.25rem .18rem} .fixed_box ul li:nth-child(2):hover>a{background:#009e96 url(../images/14-1.png) center center no-repeat;background-size:.22rem .23rem} .fixed_box ul li:nth-child(3):hover>a{background:#009e96 url(../images/15-1.png) center center no-repeat;background-size:.25rem .26rem} .fixed_box ul li:nth-child(4):hover>a{background:#009e96 url(../images/wx-1.png) center center no-repeat;background-size:.28rem .28rem} .fixed_box ul li .txt{position:absolute;right:-2.5rem;width:2.5rem;top:50%;transform:translateY(-50%);opacity:0;z-index:-1} .fixed_box ul li .txt{padding-right:.1rem} .fixed_box ul li .txt a{height:.45rem;line-height:.45rem;background:white;text-align:center;font-size:.15rem;color:black;box-shadow:0 0 12px rgba(0,0,0,0.2)} .fixed_box ul li:hover .txt{right:100%;opacity:1;} .fixed_box ul li .txt a:hover{background:#009e96;color:white} .fixed_box ul li .txts{position:absolute;right:-1.45rem;top:50%;transform:translateY(-50%);opacity:0;z-index:-1} .fixed_box ul li .txts{padding-right:.1rem} .fixed_box ul li .txts img{max-width:1.43rem} .fixed_box ul li:hover .txts{right:100%;opacity:1;} /********<=767 mobile nav style css 2********/ /**************************/ /******ipad****/ @media(max-width:1800px){ .video_fixed .close_{right: 18%;} .tem_banner.index .swiper .banner_txt{left:1.5rem} .tem_banner.index .swiper .banner_txt h2{font-size:.72rem} .index_about_info ul li a .text{padding:.45rem .3rem 0 } .tem_banner.indise .txt{left:1.5rem} .about_box .company .title h2{font-size:.46rem} .about_box .company .box{padding:.9rem 1.2rem 1.1rem 4.5rem} .about_box .company ul{padding:.65rem 1.2rem .5rem .8rem} .about_box .history>div{padding:0 1rem} .about_box .history{padding:1rem } } @media(max-width:1700px){ .video_fixed .close_{right: 18%;} .tem_banner.index .swiper .banner_txt{left:1.5rem} .tem_banner.index .swiper .banner_txt h2{font-size:.72rem} .index_about_info ul li a .text{padding:.45rem .3rem 0 } .tem_banner.indise .txt{left:1.5rem} .about_box .company .title h2{font-size:.42rem} .about_box .company .box{padding:.9rem 1.2rem 1.1rem 4.5rem} .about_box .company ul{padding:.65rem 1.2rem .5rem .8rem} .about_box .history>div{padding:0 1rem} .about_box .history{padding:1rem } } @media(max-width:1440px){ .index_contact>div{padding:.9rem} .tem_banner.indise .txt{left:1.5rem} } @media(max-width:990px){ body{overflow-x:hidden;} .st-menu {display:block;} .header {display:none;} .m-header {top:0;opacity:1;} .tem_banner{padding:60px 0 0 !important} .m-header,.m_header2 {top:0;opacity:1;} } /********mobile*********/ @media(max-width:767px){ .about_box .company .title{padding:.2rem 0;} .tem_banner.index .swiper .banner_txt h2{font-size:.36rem;margin:0 0 .35rem;line-height:.4rem} .tem_banner.index .swiper .banner_txt{width:50%;left:.55rem} .video_fixed .mains{width:90%} .video_fixed .mains.on{top:45%} .video_fixed .close_{right:5%;top:26%} .index_about{background-position:center center} .index_about .titles h2{font-size:.36rem} .index_about .infos ul li h2 em{font-size:.5rem} .index_about .infos ul li h2 em{height:.5rem;line-height:.5rem} .index_about .infos ul{display:inherit} .index_about .infos ul li{width:100%;margin:0 0 .2rem} .index_about .more{padding:.3rem 0 .8rem} .index_about .more a{width:3rem} .index_product ul li:nth-child(1) a{background-size:100%} .index_product ul li:nth-child(2) a{background-size:100%} .index_product ul li:nth-child(3) a{background-size:90%} .index_product ul li:nth-child(1) a:hover{background-size:100%} .index_product ul li:nth-child(2) a:hover{background-size:100%} .index_product ul li:nth-child(3) a:hover{background-size:90%} .index_product ul li.tcl-active:nth-child(1) a{background-size:100%} .index_product ul li.tcl-active:nth-child(2) a{background-size:100%} .index_product ul li.tcl-active:nth-child(3) a{background-size:90%} .index_product ul li.tcl-active:after{bottom:-1px} .index_product .infos .items a h2{height:.6rem;line-height:.3rem;font-size:.2rem;} .index_product .more a{width:4rem;height:.7rem;line-height:.7rem} .index_news ul{grid-gap:.2rem} .index_news ul li:after{display:none} .index_news ul li:before{display:none} .index_about_info a>h3{font-size:.48rem} .index_about_info a .text p{font-size:.2rem;line-height:.35rem} .index_about_info a .text h2{font-size:.48rem} .index_about_info a{background-position:center center;height:7rem} .index_news ul li a .text h2{height:.9rem;line-height:.3rem} .index_contact{padding:.2rem} .index_contact>div{padding:.3rem .1rem} .index_contact>div>div{grid-template-columns:1fr} .index_contact .form{padding:.2rem} .index_contact .left{padding:0;margin:0 0 .5rem} .index_contact .left>h2{padding:0 0 .3rem;line-height:.6rem} .index_contact .left ul {grid-template-columns:1fr} .index_contact .left .share{margin:.3rem 0 0} .index_contact .left .share .dd a{width:.6rem;height:.6rem;line-height:.6rem} .index_contact .left .share .dd a:nth-child(3){line-height:.6rem} .index_contact .left .share .dd a img{max-width:.22rem} .index_contact .form{border-radius:10px} .index_contact .form .box ul{grid-template-columns:1fr} .index_contact .form .box ul li input{border-radius:5px;height:.8rem} .index_contact .form .box .area textarea{border-radius:5px;height:2.5rem} .index_contact>div{border-radius:10px} .fot_img ul{display:flex;flex-wrap: wrap;} .fot_img ul li{width:33.33%} .footer .top{display:inherit} .footer .top .logo{width:60%} .footer .top .fot_nav ul{display:none} .footer .bot{display:inherit} .tem_banner.indise .col_banner{height:130px !important} .tem_banner.indise .col_banner.abouts{height:200px !important} .tem_banner.indise .abouts .flash .bg{height:200px !important} .tem_banner.indise .txt{left:.5rem;;padding:0 0 1rem} .tem_banner.indise .flash{padding:60px 0 0} .tem_banner.indise .txt h1{font-size:.48rem} .tem_banner.indise .flash .bg{height:130px !important} .about_box .company .video{position:relative;width:100%;top:0;margin:.5rem 0 0} .about_box .company .bg{padding: 0 .2rem} .about_box .company .title h2{font-size:.48rem;text-align:left;padding:0} .about_box .company .box{padding:.3rem} .about_box .company .box p{line-height:.4rem} .about_box .company ul{padding:.2rem 0} .about_box .company ul{display:inherit} .about_box .company ul li{width:100%;text-align:center;margin:0 0 .2rem} .about_box .company ul li h2{display:flex;justify-content: center;align-items: flex-end;} .about_box .choose ul{display:inherit} .about_box .choose ul li{margin:0 0 .3rem} .about_box .choose ul li p{line-height:.4rem} .about_box .history{padding:.2rem} .about_box .history>div{padding:0 .3rem} .about_box .history .history_top .lists .items .info .text p{line-height:.4rem} .about_box .history .history_top .lists .items{height:6rem} .about_box .history .history_top .lists .items .info .text{height:2.5rem} .about_box .brand .list ul li .infos{line-height:.4rem} .factory .lists .swiper-slide{grid-template-columns:1fr 1fr} .about_box .history .history_top .lists .swiper-page>div{left:-.6rem} .about_box .history .history_top .lists .swiper-page>div.slide-button-next{left:auto;right:-.6rem} .product_box .pro_nav ul li:nth-child(1) a{background-size:100%} .product_box .pro_nav ul li:nth-child(2) a{background-size:100%} .product_box .pro_nav ul li:nth-child(3) a{background-size:90%} .product_box .pro_nav ul li:nth-child(1) a:hover{background-size:100%} .product_box .pro_nav ul li:nth-child(2) a:hover{background-size:100%} .product_box .pro_nav ul li:nth-child(3) a:hover{background-size:90%} .product_box .pro_nav ul li.active:nth-child(1) a{background-size:100%} .product_box .pro_nav ul li.active:nth-child(2) a{background-size:100%} .product_box .pro_nav ul li.active:nth-child(3) a{background-size:90%} .product_box .pro_nav_two ul{grid-template-columns:1fr 1fr} .product_box .pro_nav_two ul li a{height:.7rem} .product_box .main{display:inherit} .product_box .main .shaixuan{width:100%;display:grid;grid-template-columns:1fr 1fr;grid-gap:.2rem} .product_box .main .shaixuan .items select{height:.6rem;background-size:.24rem .12rem} .product_box .main .lists ul{display:grid;grid-template-columns:1fr 1fr} .product_box .main .lists{width:100%} .product_box .main .lists ul li a .txt h2{height:1.2rem;line-height:.4rem} .product_box .like_pro a .txt h2{height:1.2rem;line-height:.4rem} .product_detailed .pro_banner .text .mbx{display:flex;flex-wrap: wrap;} .product_detailed .pro_banner .text h2{font-size:.36rem} .product_detailed .pro_banner{background-position:center center;} .product_detailed{margin:60px 0 0;padding:0} .product_detailed .product_info>div{display:inherit} .product_detailed .product_info .left{width:100%} .product_detailed .product_info .right{width:100%;margin:.5rem 0 0} .product_detailed .product_info .right .biaoge{overflow-x:auto} .product_detailed .product_info .right .biaoge table{width:auto !important} .product_detailed .product_info .right .download{display:inherit} .product_detailed .product_info .right .download a{width:100%;;margin:0 0 .2rem;height:.6rem;line-height:.6rem} .product_detailed .like_pro a .txt h2{height:1.2rem;line-height:.4rem} .product_detailed .pro_contact{padding:.2rem} .product_detailed .pro_contact>div{padding:.3rem .1rem} .product_detailed .pro_contact>div>div{grid-template-columns:1fr} .product_detailed .pro_contact .form{padding:.2rem} .product_detailed .pro_contact .left{padding:0;margin:0 0 .5rem} .product_detailed .pro_contact .left>h2{padding:0 0 .3rem} .product_detailed .pro_contact .left ul {grid-template-columns:1fr} .product_detailed .pro_contact .left .share{margin:.3rem 0 0} .product_detailed .pro_contact .left .share .dd a{width:.6rem;height:.6rem;line-height:.6rem} .product_detailed .pro_contact .left .share .dd a:nth-child(3){line-height:.6rem} .product_detailed .pro_contact .left .share .dd a img{max-width:.3rem} .product_detailed .pro_contact .form{border-radius:10px} .product_detailed .pro_contact .form .box ul{grid-template-columns:1fr} .product_detailed .pro_contact .form .box ul li input{border-radius:5px;height:.8rem} .product_detailed .pro_contact .form .box .area textarea{border-radius:5px;height:2.5rem} .product_detailed .pro_contact>div{border-radius:10px} .news_box ul li a{display:inherit} .news_box ul li a .img{width:100%;margin:0 0 .2rem} .news_box ul li a .text{width:100%} .news_box ul li a .text h2{height:.8rem;line-height:.4rem} .news_box ul li a .text p{height:1.2rem;line-height:.4rem} .news_box ul li a .text em{width:2.5rem;margin:.3rem 0 0} .contact_box{padding:.2rem} .contact_box>div{padding:.3rem .1rem} .contact_box>div{grid-template-columns:1fr} .contact_box .form{padding:.2rem} .contact_box .left{padding:0;margin:0 0 .5rem} .contact_box .left>h2{padding:0 0 .3rem} .contact_box .left ul {grid-template-columns:1fr} .contact_box .left .share{margin:.3rem 0 0} .contact_box .left .share .dd a{width:.6rem;height:.6rem;line-height:.6rem} .contact_box .left .share .dd a:nth-child(3){line-height:.6rem} .contact_box .left .share .dd a img{max-width:.3rem} .contact_box .form{border-radius:10px} .contact_box .form .box ul{grid-template-columns:1fr} .contact_box .form .box ul li input{border-radius:5px;height:.8rem} .contact_box .form .box .area textarea{border-radius:5px;height:2.5rem} .video_fixed .close_{right:5%;top:22%} .index_about_info .swiper-page{display:block} .index_about_info a .text{padding:1rem .75rem 0} .mobile_index{display:block} .tem_banner.pc{display:none} .mobile_index .mobile_txt{position:absolute;left:1rem;top:10%;;z-index:8;width:60%;text-align:left} .mobile_index .mobile_txt h2{font-size:.8rem;color:white;text-transform:uppercase;font-weight:bold;margin:0 0 .6rem;transform:translateY(-3vw);opacity:0;transition:all .8s linear} .mobile_index .mobile_txt a{font-size:.16rem;color:white;padding-left:.8rem;display:inline-block;position:relative;transform:translateY(3vw);opacity:0;transition:all .8s linear} .mobile_index .mobile_txt a .plays{position:absolute;left:0;top:50%;transform:translateY(-50%);width:.58rem;height:.58rem;line-height:.58rem;text-align:center;} .mobile_index .mobile_txt a .plays img{max-width:.14rem} .mobile_index .mobile_txt a .plays:after{content:"";position:absolute;width:100%;height:100%;border-radius:100%;background:#009d96;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .mobile_index .mobile_txt a .plays:before{content:"";position:absolute;width:135%;height:135%;border-radius:100%;background:rgba(0,157,150,.25);;z-index:-2;left:50%;top:50%;transform:translate(-50%,-50%)} .mobile_index .mobile_txt a:hover .plays:after{ animation: scalepulse 1.3s linear .3s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} .mobile_index .mobile_txt a:hover .plays:before{ animation: scalepulse 1.3s linear .15s infinite both;transform: translate3d(-50%, -50%, 0) scale(1);} .mobile_index .swiper .swiper-slide-active .mobile_txt h2{transform:none;opacity:1;transition-delay:300ms} .mobile_index .swiper .swiper-slide-active .mobile_txt a{transform:none;opacity:1;transition-delay:300ms} .fixed_box ul li .txt{width:3.5rem} }