.indexbanner{ height: auto; position: relative;}
.indexbanner img{ max-width: 100%;width: 100%;}



/*banner*/

.index-banner {

  width: 100%;
  position: relative;
  overflow: hidden;
}
.index-banner .bd li {
  
  background-size:auto 100%;
}
.index-banner .hd {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom:20px;
  
  
  left: 0px;
  
  z-index: 1
}
.index-banner .hd ul{ width: 100%; display:block; text-align: center;}
.index-banner .hd li {
  display: inline-block;
  width: 10px;
  height: 10px;
  cursor: pointer;
  margin-right: 10px;
  background:#3f4447;
  border-radius:50%;
  font-size: 0px;
}
.index-banner .hd li:last-child{margin-right:0;}
.index-banner .hd .on {
  background:#fff;
}

.index-banner .prev{position:absolute;left:3%;top:50%; width:47px;
 height:85px; margin-top:-42.5px; display:block;background: url(../images/ban_prev_btn.png) no-repeat;background-size: 100% 100%; }

.index-banner .next{background: url(../images/ban_next_btn.png) no-repeat; 
  left:auto; right:3%;width:47px; height:85px;display:block;margin-top:-42.5px;
  position:absolute; top:50%; background-size: 100% 100%;}




.mob-banner{ display: none;}


.indexTitle{ height: auto; overflow: hidden; text-align: center;position: relative; }
.indexTitle .titlehtp{ font-size: 36px; color: #3d3d3d; font-weight: bold;    margin-bottom: 5px;}


.indexTitle .abre{ height: auto; position: relative;    height:22px;}
.indexTitle p{ height: auto;  position: absolute; width: 100%; bottom:0px;z-index: 2; }
.indexTitle p span{     font-size: 14px;color: #808080;display: inline-block;background: #fff;padding: 0 13px;font-family: "Arial";}
.indexTitle em{font-style: normal; display: block; height: 1px; position: absolute;    bottom: 9px; width: 100%; z-index: 1; background: #dbdbdb;}

.fh_product{ height: auto; margin:3% 0px;}
.product_content{ height: auto;margin-top: 2%;}

.product_content .proleft{ height: auto; float: left; width: 20%; margin-right: 10px;}
.product_content .proleft ul{height: auto;}
.product_content .proleft ul li{  width: 100%; height: 55px;  background: #fff; padding: 4px;    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; margin-bottom: 5px;  text-align: center;}
.product_content .proleft ul li a{border:1px solid #e6e6e6; line-height: 45px; display: block; color: #333333; font-size: 16px;}
.product_content .proleft ul li.cur { background:#2e2726;}
.product_content .proleft ul li.cur a{ border-color: #7e7a7a; color: #fff;}
.product_content .proleft .casemore{ height: auto; overflow: hidden; margin-top: 11px;  height: 83px; background: #3f4447; padding:0px;}
.product_content .proleft .casemore a{ display: block; line-height: 83px; color: #fff; font-size: 18px; text-align: center; border:none;}
.product_content .proleft .casemore:hover a{ background: #ee2222;}
.product_content .proleft .procall{ height: auto; overflow: hidden; font-size: 14px; color: #4f4a68; background: url(../images/call1.png) no-repeat 10px center; padding-left: 64px; margin:10px 0px 8px;}
.product_content .proleft .procall i{ display: block; font-style: normal; font-size: 24px; font-weight: bold;}

.product_content .prori{float: right; width: calc(100% - 10px - 20%); height: auto; overflow: hidden; }
.product_content .prori .proin{display: none;height: auto; overflow: hidden;}
.product_content .prori .proin .row{ height: auto; overflow: hidden; margin:0 -6px; }
.product_content .prori .proin [class*=col-]{ padding:0 6px;}

.product_content .prori .proin .proimg{ border:1px solid #dcdcdc; height: auto; overflow: hidden; position: relative;display: block;  margin-bottom: 12px;}
.product_content .prori .proin .proimg img{ display: block; max-width: 100%; max-height: 188px; margin:0 auto;}

.product_content .prori .proin .proimg .gray{ height: 100%; width: 100%; background: rgba(63,68,71,0.8); left:0px; top:0px; position: absolute; overflow: hidden;
    transition: all 5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;    filter: alpha(Opacity=0);
    -moz-opacity: 0;
    opacity: 0;}

.product_content .prori .gray .proabsot{ position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    text-align: center;}

.product_content .prori .gray .proabsot p{ color: #ffffff; font-size: 18px; line-height: 30px;}

.product_content .prori .proin .proimg:hover .gray{filter: alpha(Opacity=100);
    -moz-opacity: 1;
    opacity: 1; }




.fh_advance{ height: auto; overflow: hidden; background: url(../images/advantbg.jpg) no-repeat top center;  padding:3% 0px; position: relative; }
.fh_advance .indexTitle p span{background: #e0e0e2;}
.aside-advanin{ height: auto; overflow: hidden; margin-top: 3%;}
.aside-advanin li{ float: left; width: 22%; margin-right: 3%;}
.aside-advanin li:last-child{ margin-right: 0px;}
.aside-advanin li a{ display: block; height: auto; overflow: hidden;}
.aside-advanin li a img{ display: block; margin:0 auto;max-width: 100%;
    transition: all 5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;}
.aside-advanin li a .advantitle{ text-align: center; font-size: 18px; color: #3a3a3a; margin-top: 12%;}
.aside-advanin li a p{ font-size: 14px; color: #848484; text-align: center; padding:0 5%; margin:3% 0px 12%; line-height: 28px; min-height:84px; overflow: hidden; }
.aside-advanin li a span{ width: 100%; height: 40px; display: block; background: #3f4447; color: #fff; font-size: 14px; text-align: center; line-height: 40px;}
.aside-advanin li:hover img{     -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    transform: rotateY(-180deg);}

.aside-advanin li:hover span{ background: #e83838;}



.mse-about{ height: auto; overflow: hidden; background: url(../images/about_bg.jpg) no-repeat center; padding:8% 0px;     background-size: 100%;}
.mse-about .aboutin{ min-height: 400px;  background:#fff;  padding:3%;}
.mse-about .aboutin .aboutle{ height: auto; position: relative;}
.mse-about .aboutin .aboutle img{ max-width: 100%; height: auto; position: absolute; top:-110px; background: #fff; padding:3px;}

.mse-about .aboutin .aboutri .about_title{ font-size: 36px;  font-weight: bold; border-bottom: 1px dashed #808385; padding-bottom: 15px;}
.mse-about .aboutin .aboutri .about_title a{ color: #3f4447;}
.mse-about .aboutin .aboutri p{ font-size: 14px; color: #666666; line-height: 28px; margin-top: 4%; text-indent: 2em;}



.hn-company{ height: auto; overflow: hidden; margin-top: -87px;}
.hn-company .containerr{ padding: 2% 0px; background:#fff url(../images/showed.png) no-repeat bottom left; background-size: 100%;}

.companowl{ height: auto; overflow: hidden; margin: 2% 0px 1%; padding:0px 4px;}
.companowl .item a>div{ height: auto; overflow: hidden;}
.companowl .item a>div img{ display: block; overflow: hidden; max-width: 100%;margin:0 auto;    transition: all .8s;
    -webkit-transition: all .8s;
    -moz-transition: all .8s;
    -o-transition: all .8s; }

.companowl .item a>div:hover img{ transform: scale(1.1);-webkit-transform: scale(1.1);overflow: hidden;}    
.companowl p{ text-align: center; font-size: 14px; color: #494949; margin-top: 10px;}



.news{ height: auto; overflow: hidden; margin:2% 0px 3%;}
.dongtai{ height: auto; overflow: hidden;}
.dt-left{ float: left;width: 64%; border:1px solid #d6d6d6;}
.dt-left .new{height: 57px; line-height: 57px; width: 100%; background: #ededed;}
.dt-left .new a{ line-height:57px; font-size: 18px; color: #333333; width: 50%; float: left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding-left: 32px; }
.dt-left .new a.active{ display:block; background: #3f4447; color:#fff;}
.brandContent1{ display: none; height: auto;}
.brand-top{ overflow: hidden; padding:14px;}
.bt-left{ float: left; width: 32%;height: auto;}
.bt-left img{ display: block; max-width: 100%;}
.bt-right{ float: right; width:66%;height: auto;}
.bt-right .nestitle{ font-size: 18px; color: #333333;margin-bottom: 10px;}

.bt-right a{ width: 117px; height: 32px; display: inline-block; line-height: 32px; text-align: center; color:#fff; font-size: 14px; margin-top: 20px; background: #ee2222; border-radius: 20px;}

.bt-p{ font-size: 14px; color: #666666; overflow: hidden; line-height: 25px;}
.brand-bottom{ height: auto; padding:20px; padding-top: 0; overflow: hidden;}
.brand-ul li{line-height: 32px; float: left; width: 50%; background: url(../images/fang.png) no-repeat left center; padding-left:10px;}
.brand-ul li a{ color: #333333; font-size: 14px;}
.brand-ul li:hover a{ color: #ee2222;}

.dt-right1{ float: right; width: 35%; border:1px solid #d6d6d6;}
.dt-right1 .scro-left{ float: left; width: 99px; background: #3f4447; color: #fff; font-size: 20px; text-align: center; padding:4% 0px;}
.dt-right1 .scro-left i{ display: block; font-style: normal;}
.dt-right1 .scro-right{ float: right; width: calc(100% - 99px);}

.newsbox{ height: auto; overflow: hidden;  padding:0 20px;}

.faqol{ height: auto; overflow: hidden; }
.faqol li{ height: auto; }
.faqol li a{ height: auto; overflow: hidden; padding: 5% 0px; border-bottom: 1px dashed #bababa; display: block; }
.faqol li h3{display:block;color:#333333;font-size:14px;width:100%;height:auto;overflow:hidden;line-height:21px;margin-bottom:8px;padding-left:25px;position:relative; overflow: hidden;}
.faqol li h3::before{content:"Q";display:inline-block;width:20px;height:20px;background:#ee2222;color:#fff;text-align:center;line-height:18px;position:absolute;left:0;top:0; font-size: 12px;color:#fff; border-radius: 50%;}
.faqol li p{display:block;font-size:14px;width:100%;height:auto;overflow:hidden;line-height:22px;padding-left:25px;position:relative; overflow: hidden; color: #666666;}
.faqol li p:before{content:"A";display:inline-block;width:20px;height:20px;background:#4f4a68;color:#fff;text-align:center;line-height:18px;position:absolute;left:0;top:0;font-size: 12px;color:#fff;border-radius: 50%;}
.faqol li:last-child{ border-bottom: none;}

.prolistt{ display: none;}
.promune{ display: none;}



@media screen and (min-width: 769px) and (max-width: 1199px){
img{ max-width: 100%;}

}

@media screen and (min-width: 992px) and (max-width: 1199px){


}
@media screen and (min-width: 769px) and (max-width: 992px){



}


@media screen and (max-width: 768px) {
  
.mob-banner{ display: block;}
.pcbanner{ display: none;}
.mob-banner .owl-controls {position: absolute;left: 0;right: 0;bottom: 1%;z-index: 99; }
.mob-banner .owl-controls .owl-dots .owl-dot.active span{ background:#fff !important;}

.mob-banner .owl-controls .owl-dots .owl-dot span{ background:#3f4447 !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; opacity: 1 !important; border:0 !important;}

.indexTitle .titlehtp{ font-size: 18px; margin-bottom: 0px;}

.product_content .proleft{ float: none; width: 100%; margin-right: 0px;}
.promobCent .prolistt,.promobCent .promune{ display: block;}
.product_content .prori .proin .proimg img{ max-height:auto;}
.promobCent {
    height: 60px;
    width: 100%;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0px 1px 3px #d7d7d7;
        margin-bottom: 8%;
        z-index: 999;
}
.promobCent .prolistt {
    float: left;
    line-height: 60px;
    color: #333;
    font-size: 16px;
    text-indent: 10px;
}
.promobCent .promune {
    height: 60px;
    line-height: 60px;
    width: 100%;
    text-align: right;
    position: absolute;
    padding-right: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.promobCent .promune img {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition: -webkit-transform .35s ease;
    transition: -webkit-transform .35s ease;
    transition: transform .35s ease;
    transition: transform .35s ease,-webkit-transform .35s ease;
}

.promobCent .promune.isactive img {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}

.pro_ul{ position: absolute;
    top: 62px;
    left: 0;
    z-index: 9;
    width: 100%;
    background: #fff;
    display: none;
    }
.product_content .proleft ul li{ padding:0px; height: auto; border-bottom: 1px dashed #cec9c9; text-align: left; padding-left: 10px;}
.product_content .proleft ul li:last-child{ border-bottom: none;}
.product_content .proleft ul li a{ border:none;font-size: 14px; }

.product_content .proleft ul li.cur{ background: #fff;}
.product_content .proleft ul li.cur a{ color: #e83838;}

.product_content .prori{ float: none; width: 100%; margin-bottom: 0px; }

.product_content .proleft .procall,.product_content .proleft .casemore{ display: none;}
.promobCent .prolistt a{ color: #333;}

.fh_advance{  z-index: -1;}


.mse-about {background-size: cover; padding:4% 0px;}
.mse-about .aboutin .aboutle img {position: inherit;top: 0px;}
.mse-about .aboutin .aboutri .about_title{ font-size: 24px;}

.mse-about .aboutin .aboutri .about_title{ padding-bottom: 7px;}
.mse-about .aboutin{ height: auto; min-height: auto; padding:1%;}
.hn-company{ margin-top: 3%;}
.dt-left,.dt-right1{float: none; width: 100%;}
.dt-right1{ margin-top: 3% !important; height: auto; overflow: hidden;}
.dt-left .new a{ padding-left: 13px; font-size: 16px;}


}


@media screen and (max-width: 414px) {

.aside-advanin li{ width: 48%; margin-right: 2%; margin-bottom: 2%;}
.aside-advanin li:nth-child(2n){ margin-right: 0px;}
.aside-advanin li a img{ max-width: 32%;}
.aside-advanin li a .advantitle{ font-size: 14px;}
.aside-advanin li a p{ font-size: 12px; line-height: 20px; max-height: 80px; min-height: 80px;}
.dt-left .new a{ font-size: 12px; padding-left: 10px;}
.brand-top{ padding:5px;}
.bt-right .nestitle{ font-size: 14px; margin-bottom: 0px;}
.bt-p{ font-size: 12px; line-height: 20px;}
.bt-right a{ font-size: 12px; margin-top: 8px;}
.brand-bottom{ padding:0 5px;}
.brand-ul li{ float: none; width: 100%;}
.dt-right1 .scro-left{ width: 60px; font-size: 12px; padding:2% 0px;}
.dt-right1 .scro-right{ width: calc(100% - 60px);}
.faqol li h3,.faqol li p{ font-size: 12px;}



}