﻿.sidebanner{width:100%;height:400px;margin-top:140px;color:#fff;position:relative;text-align:center;background:url(/Images/side-banner.jpg) no-repeat center top;}
.sidebanner h4{font-size:50px;padding:200px 0 0px 0;font-family:'OPPOSans-Bold';}
.sidebanner h5{font-size:30px;padding-top:10px;}


.pathbar *{transition-duration: 0.3s;}
.pathbar{height: auto;border-bottom: 1px solid #ececec;display:flex;justify-content:space-between;width:100%;margin:0 auto;box-sizing:border-box;padding:0 10px;max-width:1200px;}
.pathbar .path{height:100%;text-align:right;display:flex;justify-content:flex-end;line-height: 80px;}
.pathbar .path i{display:block;width:21px;height:100%;float:left;margin:0 2px;text-align:center;line-height:80px;font-size:12px;color:#aaa;font-family: 'iconfont';}
.pathbar .path a{display: block;vertical-align: middle;color: #999;height: 80%;margin:0;font-size:14px;float:left;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.pathbar .subnav{height:100%;width:80%;}
.pathbar .subnav li{transition-duration: 0.3s;float: left;height: 100%;line-height: 80px;color: #333;font-size:17px;text-align:center;position:relative;margin-right:30px;}
.pathbar .subnav li a{color: #686868;position:relative;z-index:10;}
.pathbar .subnav li i{display:block;width:0px;height:3px;position:absolute;bottom:0;left:0px;background:#008c3f;z-index:9;opacity:0;width:0px;}
.pathbar .subnav li.on i{opacity:1;width:100%;}
.pathbar .subnav li.on a{color:#008c3f;font-weight:bold;}
.pathbar .subnav-p li{margin-right:35px;}

.about{padding-top:80px;padding-bottom:100px; }
.about .text{width:100%;}
.about .text h1{font-size:38px;color:#000;line-height:100px;padding-bottom:0px;font-family:'OPPOSans-Medium';}
.about .text p{font-size:18px;color:#666;line-height:32px;padding-bottom:10px;text-align:justify;}
.about .text h2{font-weight:bold;}

.aboutimg{height:500px;overflow:hidden;margin-bottom:150px;}
.aboutimg img{width:100%;}

.contact{padding-top:70px;padding-bottom:70px;}
.contact .text{width:100%;padding-bottom:80px;}
.contact .text li{width:250px;float:left;padding:0 30px;box-sizing:border-box;min-height:250px;text-align:center;}
.contact .text li:first-child{width:600px;padding:0;text-align:left;}
.contact .text h1{font-size:18px;color:#4c4f52;padding-bottom:20px;}
.contact .text h2{font-size:34px;color:#c38d30;font-family:MONTSERRAT-REGULAR;margin-bottom:20px;}
.contact .text h2 i{font-family:iconfont;font-size:35px;}
.contact .text h3{font-size:20px;color:#999;padding:15px 0 15px 0;text-align:center;}
.contact .text p{font-size:16px;color:#8f8f8f;font-family:Rubik;line-height:28px;}
.contact .text p a{color: #8f8f8f;}
.contact li img{width:100%;max-width:300px;} 
.map{width:100%;height:390px;border:none;float:right;border-radius:10px;overflow:hidden;}

.article{padding-top:50px;padding-bottom:80px;}
.article *{transition-duration: 0.3s;}
.article li{width:100%;padding:30px 0;float:left;position:relative;}
.article li .img{width:33%;height:270px;overflow:hidden;float:left;position:relative;}
.article li img{width:100%;height:100%;object-fit:cover;position:absolute;left:0;top:0;}
.article li .info{padding:0;box-sizing:border-box;border-radius:30px;border-bottom-left-radius:0;border-bottom-right-radius:0;background:#fff;width:62%;float:right;}
.article li h1{color:#222;font-size:24px;padding:10px 0 0 0;line-height:30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
.article li h5{font-size:16px;color:#999;padding:10px 0 25px 0;}
.article li p{font-size:16px;color:#555;margin-bottom:40px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height:28px;}
.article li span{display:block;width:104px;line-height:26px;background:#f9f3ea;font-size:12px;color:#c38d30;text-align:center;}
.article li hr{position:absolute;bottom:30px;right:0;height:8px;width:0;transition: all 600ms ease;background:#008c3f;border:none;}
.article li:hover hr{width:67%;height:4px}

.pagin{padding-top:20px;}
.pagin a, .pagin span { float: left; height: 20px; padding: 3px 10px; border: 1px solid #ccc; margin-left: 2px; font-family: arial; line-height: 20px; font-size: 14px; overflow: hidden; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.pagin-m a, .pagin-m span { height: 14px; line-height: 14px; font-size: 12px; }
.pagin a, .pagin span { height: 19px; }
.pagin .text, .pagin .current { border: 0; }
.pagin .current, .pagin .current:link, .pagin .current:visited { color: #f60; font-weight: 700; }
.pagin-m a, .pagin-m span.text { height: 14px; font-family: verdana; }
.pagin .text i { font-style: normal; font-weight: bold; color: #e3393c; }
.pagin .prev, .pagin .next, .pagin .prev-disabled, .pagin .next-disabled { position: relative; padding-top: 5px; height: 18px; line-height: 18px; }
.pagin .prev-disabled, .pagin .next-disabled { color: #ccc; cursor: default; }
.pagin .prev, .pagin .prev-disabled { padding-left: 12px; }
.pagin-m .prev, .pagin-m .next, .pagin-m .prev-disabled, .pagin-m .next-disabled { padding-top: 3px; height: 14px; line-height: 14px; }
.pagin .prev, .pagin .next, .pagin .prev-disabled, .pagin .next-disabled { padding: 4px 10px 5px; border-radius: 3px; background: #fff; }
.pagin b { display: block; position: absolute; top: 9px; width: 5px; height: 9px; background-image: url(../Images/bg_hotsale.gif); background-repeat: no-repeat; overflow: hidden; }
.pagin-m b { top: 7px; }
.pagin a, .pagin a:visited { color: #666; }
.pagin .next b { right: 3px; background-position: -62px -608px; }
.pagin .prev b { left: 3px; background-position: -68px -608px; }
.pagin .prev-disabled b { left: 3px; background-position: -80px -608px; }
.pagin .next-disabled b { right: 3px; background-position: -74px -608px; }
.pagin .page-skip { height: 26px; padding: 0 10px; border: none; font-size: 12px; }
.pagin .page-skip em { float: left; height: 26px; line-height: 26px; }
.pagin .jumpto { float: left; width: 36px; height: 21px; padding: 1px; border-width: 1px; border-style: solid; border-color: #aaa #ddd #ddd #aaa; margin: 0 5px; text-align: center; font-family: verdana; }
.pagin a.btn-skipsearch, .pagin .btn-skipsearch:hover { float: left; width: 53px; height: 25px; padding: 0; margin-left: 5px; border: none; background: url(../Images/20130415i.png) no-repeat -126px -52px; line-height: 25px; text-align: center; cursor: pointer; color: #333; }

.adetail{background-image:linear-gradient(rgba(250,250,250),#fff 80%);padding:180px 0;}
.adetail h1{font-size:30px;color:#393939;text-align:center;}
.adetail h2{color:#999;font-size:16px;border-bottom:1px solid #eaeaea;line-height:80px;margin-bottom:50px;text-align:center;}
.adetail .des *{font-family: "方正兰亭中黑简体","Source Han Sans CN","PingFang SC","Microsoft YaHei","simsun","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol" !important;}
.adetail .des img{padding:10px 0;}

.tech{padding-top:50px;padding-bottom:80px;}
.tech *{transition-duration: 0.3s;}
.tech li{width:100%;padding:30px 0;float:left;position:relative;}
.tech li .img{width:25%;height:220px;overflow:hidden;float:left;position:relative;border-radius:5px;}
.tech li img{width:100%;height:100%;object-fit:cover;position:absolute;left:0;top:0;}
.tech li .info{padding:0;box-sizing:border-box;border-radius:30px;border-bottom-left-radius:0;border-bottom-right-radius:0;background:#fff;width:72%;float:right;}
.tech li h1{color:#222;font-size:24px;padding:10px 0 0 0;line-height:30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
.tech li h5{font-size:16px;color:#999;padding:10px 0 25px 0;}
.tech li p{font-size:16px;color:#555;margin-bottom:40px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height:28px;}
.tech li span{display:block;width:104px;line-height:26px;background:#f9f3ea;font-size:12px;color:#c38d30;text-align:center;}
.tech li:hover h1{color:#008c3f;}

.category{display:flex;font-size:16px;color:#999;padding-top:30px;padding-bottom:20px;}
.category .left{width:150px;line-height:50px;}
.category ul{display:flex;flex-wrap:wrap;width:100%;}
.category li{line-height:50px;padding-right:30px;}
.category li a{color:#777;}
.category li.on a,.category li a:hover{color:#008c3f;font-weight:bold;}

.product{background:#e8f7ef;padding:80px 0;}
.product ul{display:flex;padding:0 0 40px 0;flex-wrap:wrap;}
.product li{width:22.74%;background:#fff;margin-bottom:3%;margin-right:3%;text-align:center;overflow:hidden;box-sizing:border-box;}
.product li:hover{border:1px solid #008c3f;}

.product li a{color:#555;}
.product li .icon{width:100%;height:0;padding-top:100%;position:relative;display: flex;align-items: center;text-align: center;justify-content: center;overflow:hidden;}
.product li .icon img{position: absolute;object-fit: cover;height: 100%;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.product li .text{padding:30px 20px 40px 20px;}
.product li .text h1{font-size:20px;color:#555;}
.product li .text h5{font-size:16px;color:#777;margin:7px 0 0 0;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.product li .text p{font-size:14px;color:#008c3f;line-height:16px;vertical-align:middle;display:flex;justify-content:center;}
.product li .text p i{font-family:iconfont;font-size:24px;}

.pdetail .flexslider .slides li{margin-top:0;}
.pdetail .flex-direction-nav{top:38%;line-height:500px;overflow:hidden;}
.pdetail .flex-control-nav{justify-content:flex-start;}
.pdetail{padding:80px 0;}
.pdetail .left{width:35%;float:left;}
.pdetail .btn{width:100%;padding-top:50px;}
.pdetail .btn a{display:block;width:230px;float:left;line-height:50px;height:50px;background: #008c3f;color:#fff;font-size:18px;text-align:center;border-radius:3px;vertical-align:middle;font-family:'OPPOSans-M';margin-right:15px;}
.pdetail .btn a i{font-family:iconfont;font-size:22px;}
.pdetail .btn a:hover{background:#333;}
.pdetail .btn .service{position:relative;}
.pdetail .btn .service div{display:none;position:absolute;width:100%;padding:10px 0px;text-align:center;border-radius:10px;background:#fff;box-shadow: 0 0 20px #aaa;bottom:60px;left:0;overflow:hidden;color:#666;}
.pdetail .btn .service div img{width:100%;}
.pdetail .btn .service div h3{color:#333;line-height:20px;font-size:18px;padding-top:15px;}
.wx-active{display:block !important;}

.pdetail .right{width:60%;float:right;}
.pdetail .right .des *{ font-family: "方正兰亭中黑简体","Source Han Sans CN" !important;color:#666 !important;line-height:30px !important;font-size:16px !important; }
.pdetail .right .title{font-size:34px;line-height:60px;color:#000;font-weight:bold;padding-bottom:20px;}
.pdetail .right .des img{max-width:600px;}
.pdetail .right .des table{width:100%;}
.pdetail .right .des td{border-width: 1px 1px 1px 1px;border-style: solid solid solid solid;border-color: rgb(0, 0, 0);padding: 0px 7px;background-color: transparent}

@media screen and (min-width:1024px) {
    .product li:nth-child(4n){margin-right:0;}    
}
@media screen and (max-width:1440px) {
}
@media screen and (max-width:1280px){
    .sidebanner{height:400px;}
    .sidebanner img{bottom:0;width:140%;}
    .sidebanner h4{padding-top:160px;font-size:50px;}
    .sidebanner h5{font-size:24px;}

    .research .content{padding-right:26%;}
    .research .bg2{top:-100px;right:-80px;height:102%;top:0;}
    .research .content h2{font-size:28px;line-height:40px;}
    .research ul{padding-right:150px;}

    .flexslider{min-height:450px;}
}
@media screen and (max-width:1024px) {   
    .pathbar .subnav{width:100%;}
    .productpath .path{display:none !important;}

    .article li .img{height:210px;}
    .article li h1{font-size:22px;}
    .article li span{display:none;}

    .tech li{padding:10px 0;}
    .tech li .img{height:150px;}
    .tech li h1{font-size:22px;}
    .tech li h5{padding:5px 0 10px 0;}
    .tech li span{display:none;}

    .pdetail{padding:60px 0;}
    .pdetail .left{width:40%;}
    .pdetail .right{width:55%;}
    .pdetail .right .des img{max-width:100%;height:auto !important;}
    .pdetail .flexslider .slides li{height:350px;line-height:350px;}
    .pdetail .flex-direction-nav{top:30%;}
}
@media screen and (max-width:820px) { 
    .sidebanner{height:300px;background-size:auto 100%;margin-top:100px;}  
    .pathbar .subnav li{font-size:16px;}
    .pathbar .subnav li span{display:none;}
    .pathbar .subnav-p li{margin-right:30px;}    
    
    .productpath .subnav{width:100%;}
    .tab-count li{font-size:17px;}

    .pdetail .right .title{font-size:26px;}

    .contact .text li{width:30%;padding:0;border:0;min-height:100px;}
    .contact .text li:first-child{width:100%;}
    .contact .text{padding-bottom:20px;}
    .contact .text h3{font-size:20px;padding:25px 0 0px 0;}
    .contact .text h2{font-size:30px;}
    .map{width:100%;margin:2rem 0;} 

    .article li{padding:0 0 30px 0;}
    .article li .img{height:150px;}
    .article li h1{font-size:18px;padding-top:0;}
    .article li h5{padding:0px 0 20px 0;}
    .article li p{margin-bottom:0;}

    .category{padding-top:30px;font-size:15px;}
    .category .left{width:120px;}
   
    .product li{width:31.3%;}
    .product li:nth-child(3n){margin-right:0;}
}
@media screen and (max-width:512px) {    
    .sidebanner{height:50vw;margin-top:90px;background-position:-50px top;}   
    .pathbar{flex-direction:initial;}
    .pathbar .aboutpath{}
    .pathbar .path{justify-content:flex-start;}
    .pathbar .path a{line-height:60px;}
    .pathbar .path i{line-height:60px;}   
    .pathbar .subnav ul{}
    .pathbar .subnav ul li{width:20%;margin-right:0;line-height:55px;}
    .pathbar .subnav li i{left:0;bottom:0;}

    .about{padding:60px 10px;flex-direction:column;box-sizing:border-box;}
    .about .text{width:100%;}
    .about .text h1{font-size:24px;line-height:60px;font-weight:bold;}
    .about .text p{text-align:left;}

    .research{padding-bottom:100px;}
    .research .content{padding-right:0;}
    .research .content h1{font-size:34px;line-height:60px;}
    .research .bg1{display:none;}
    .research .bg2{right:0px;width:130%;height:auto;bottom:-100px !important;top:initial;}
    .research .content h2{font-size:22px;line-height:32px;}
    .research .content p{line-height:24px;}

    .history{padding:60px 0;}
    .history .title h1{font-size:34px;}
    .history .title p{font-size:15px;text-align:justify;}
    .swiper-container{margin-top:50px;}

    .honor .title{padding-bottom:15px;}
    .honor .title h1{font-size:34px;line-height:50px;}
    .flexslider{min-height:550px;}
    .flex-direction-nav{padding-bottom:20px;}
    .flex-direction-nav li{width:20px;margin:0;}
    .flex-direction-nav a{font-size:20px;}
    .flex-control-nav{left:20px;width: calc(100% - 40px);}
    .flex-control-nav li{font-size:18px;}
    .flexslider .slides li{margin-top:80px;}
    .flexslider .slides .slides-item{flex-direction:column;justify-content:start;}
    .tab-title{display:flex;width:100%;border:none;height:50px;}
    .tab-title li{font-size:18px;}
    .flexslider .slides li .tab-title li{height:50px;}
    .tab-count{padding-left:0;}
    .tab-count li{font-size:15px;line-height:25px;}
    .tab-count li .lileft{min-width:40px;padding-bottom:0;padding-top:0;}
    .tab-count li .liright{padding-bottom:0;padding-top:0;}
    .tab-count li .point{top:6px;}

    .contact{padding:50px 10px 70px 10px;box-sizing:border-box;}
    .contact .text li{width:40%;}
    .contact .text h1{padding-bottom:10px;}
    .contact .text p{font-size:16px;line-height:24px;}
    .contact p img{width:100%;padding-top:20px;}
    .contact .text h1{font-size:20px;padding-bottom:15px;}
    .contact .text h2{font-size:20px;margin-bottom:10px;}
    .contact .text h2 i{font-size:26px;}
    .contact .text h3{padding-top:0;font-size:16px;}

    .article li{padding-bottom:20px;}
    .article li .img{height:80px;}
    .article li h1{-webkit-line-clamp: 2;font-size:16px;line-height:24px;}
    .article li h5{padding-bottom:0;font-size:14px;padding-top:10px;}
    .article li p{display:none;}
    .article li hr{display:none;}

    .adetail{padding:100px 0;}
    .adetail .wrap{width:92%;}
    .adetail .des img{max-width:100%;height:auto;}
    .adetail h1{font-size:24px;text-align:left;padding-top:20px;}
    .adetail h2{line-height:50px;font-size:14px;text-align:left;margin-bottom:30px;}

    .tech li{padding-bottom:20px;}
    .tech li .img{height:100px;width:30%;}
    .tech li .info{width:67%;}
    .tech li h1{font-size:18px;line-height:20px;padding-top:0;}
    .tech li h5{padding:5px 0 8px 0;font-size:14px;}
    .tech li p{margin-bottom:0;font-size:15px;line-height:22px;}

    .pathbar .subnav{width:100%;}
    .category{padding-top:15px;font-size:14px;padding-bottom:15px;}
    .category .left{line-height:32px;width:100px;}
    .category li{line-height:32px;padding-right:15px;}

     .product{padding:40px 0;}
    .product li{width:48.5%;margin-right:0;}
    .product li:nth-child(odd){margin-right:3%;}
    .product li .text{padding:10px 10px 20px 10px;}
    .product li .text h1{font-size:17px;}
    .product li .text h5{font-size:14px;margin-bottom:0;}
    .product li .text p{display:none;}

    .pd{display:none;}
    #container{padding:0;width:100%;}
    .pdetail{padding:90px 0;}
    .pdetail .left{width:100vw;}
    .pdetail .right{width:100%;box-sizing:border-box;padding:0 20px;}
    .pdetail .right hr{height:5px;}
    .pdetail .right .des *{font-size:17px !important;line-height:30px !important;}
    .pdetail .right .des img{max-width:100%;height:auto !important;}
    .pdetail .btn a{font-size:18px;line-height:50px;}
    .pdetail .right .title{font-size:30px;line-height:50px;}
    .flexslider{height:auto;min-height:120vw;padding-bottom:10px;}
    .pdetail .flexslider .slides li{width:100vw;height:100vw;}
    .pdetail .flex-direction-nav{display:none;}
}