@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1200px){
    .wrap, .headertopIn{ width: 100%;}
    .navbar{ margin-left: 1%;}
    .headecen{ padding-right: 1%;}
    .smartmenu ul li a{ padding: 0 21px;}
    .about,.appindex{ padding: 2% 1%; overflow: hidden; box-sizing: border-box;}
    .about .aboutright{ width: 50%;}
    .aboutright ul{ margin-right: -2%; text-align: center;}
    .aboutright ul li{ width: 48%; margin-right: 2%; box-sizing: border-box;}
    .product ul{ text-align: center; margin-right: -2%; padding: 0 1%;}
    .product ul li{ width: 23%; margin-right: 2%;}
    .element-right{ width: 50%;}
    .element-left{ padding-left: 1%; box-sizing: border-box;}
    .indexBo{ width: 100%; padding: 1%; box-sizing: border-box; margin-top: 2%;}
    .indexBo .newsindex{ width: 46%;}
    .newlist dl dd{ width: 66%;}
    .footbottom{ overflow: hidden; padding: 6% 1% 2%; box-sizing: border-box;}
    .footbottom dl.newslet{ width: 26%;}
    .footbottom dl.contactus{ margin-right: 1%;}
    .content{ width: 100%; overflow: hidden;}
    .choose{ margin-bottom: 3%;}
    
    .sideleft{ width: 25%;}
    .sub_goods ul{ margin-right: -2%; text-align: center;}
    .sub_goods ul li{ width: 31%; margin-right: 2%;}
    .sub_goods ul li .desc{ width: 100%;}
    .sub_goodsTwo .detail{ width: 66%;}
    .pro_img{ width: 50%;}
    .pro_view_inner{ width: 48%;}
    .conright{ float: none; width: 50%; margin-top: 3%; clear: both;}
    .newsLeft ul li .intro{ width: 65%;}
    .sub_goods ul li img{ width: 100%;}
}

@media screen and ( max-width:980px){
    .smartmenu ul li a{ padding: 0 20px;}
    .quick{ display: none;}
    .product ul li,.appindex ul li{ width: 250px; float: none; display: inline-block; margin-bottom: 3%;}
    .appindex ul,.appindex h3{ text-align: center;}
    .element-left, .element-right{ width: 500px; margin: 0 auto 3%; display: block;}
    .choose{ background: #604d3e;}
    .indexBo .client, .indexBo .newsindex{ width: 100%;}
    .indexBo .newsindex{ margin: 3% 0 0 0;}
    .newlist dl dd{ width: 78%;}
    .footbottom dl,.footbottom dl.contactus,.footbottom dl.newslet{ width: 48%; float: none; display: inline-block; vertical-align: top;}
    .footbottom dl{ margin-bottom: 2%;}
    .sideleft{ width: 30%;}
    .sideright{ width: 66%;}
    .sub_goods ul li{ width: 48%;}
    .sub_goodsTwo ul li>a{ width: 35%;}
    .sub_goodsTwo .detail{ width: 60%;}
    .newsLeft ul li{ height: auto;}
    .newsLeft ul li .intro{ width: 54%;}
    .pro_img,.pro_view_inner{ width: 100%;}
    .smartmenu{ float: none; margin: 0 auto;}
}

@media screen and (max-width:800px){
   .smartmenu ul li a{ padding: 0 17px;}
   .about h3{ font-size: 24px;}
   .about .aboutleft,.about .aboutright,.sideleft,.sideright{ width: 100%; float: none;}
   .aboutright ul li{ width: 23%;}
   .sub_goods ul li{ width: 31%;}

}


@media screen and (max-width:740px){
    .smartmenu{ display: none;}
    .headecen{ padding-left: 1%;}
    .logo{ margin-left: 0;}
    .header{ padding-bottom: 3%;}
    .banner ol{ bottom: 10px;}
    .aboutright ul{ text-align: center;}
    .aboutright ul li{ width: 250px; float: none; display: inline-block;}
    .aboutright ul li .fig{ height: auto;}
    .aboutright ul li .fig img{ width: 100%;}
    .newlist dl dd{ width: 73%;}
    .topNav{ display: block;}
    .proclass ul li{ width: 48%; margin-bottom: 3%;}
    .sub_faq ul li{ padding-right: 1%;}
    .sideleft{ margin-top: 3%;}
    .proclass ul{ text-align: center;}
    .proclass ul li{ width: 47%; float: none; display: inline-block; vertical-align: top;}
}

@media screen and (max-width: 639px) {
    .header-right,.topright{ display: none;}
    .navbar{ float: none;}
    .navbar ul{ text-align: center; width: 100%;}
    .navbar ul li{ float: none; display: inline-block;}
    .logo{ float: none; width: 100%;}
    .logo img{ display: block; margin: 0 auto;}
    .aboutright ul li,.product ul li, .appindex ul li{ width: 46%; box-sizing: border-box;}
    .element-left, .element-right{ width: 100%; padding: 0 1%; box-sizing: border-box;}
    .element-right{ margin-top: 5%;}
    .element-right strong,.element-left strong{ margin-bottom: 3%;}
    .newlist dl dd{ width: 68%;}
    .customer .px-content-inner:after,.customer .px-content-inner:before{ display: none;}
    .customer ul li{ width: 31%; padding: 0;}
    .customer ul li img{ width: 100%; height: auto;}
    .conus h6{ font-size: 16px;}
    .footbottom:after{ border-width: 25px; margin-left: -25px;}
    .sub_goods ul li{ width: 48%;}
    .newsLeft ul li .intro{ width: 51%;}
    .projectca ul li{ width: 47%;}
    .mess ul li dl dd{ width: 76%;}
    .conright{ width: 60%;} 
    .langshou dl{ width: 21%;}
    .related ul li{ width: 48%;}
    .rw-footer-box{ display: block;}
    .footbottom{ padding-bottom: 70px;}
    #toTop{ bottom: 60px; right: 25px;}
    .element-right ul li{ margin: 0 1.8% 10px 0;}
}

@media screen and (max-width: 500px) {
   .about h3{ font-size: 18px;}
   .product ul li img{ width: 100%; height: auto;}
   .product ul li .des h5{ font-size: 14px;}
   .product ul li .des p{ display: none;}
   .product ul li .des{ width: 100%; height: 100%;}
   .appindex .wrap div h5{ font-size: 15px;}
   .element-right ul,.element-right strong, .element-left strong{ text-align: center;}
   .element-right ul li{ float: none; display: inline-block;}
   .indexBo .newsindex{ margin-top: 5%;}
   .newlist dl dt{ box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);}
   .newlist dl dt,.newlist dl dd{ width: 100%; float: none; margin-top: 3%;}
   .newlist dl dt img{ display: block; margin: 0 auto;}
   .footbottom dl, .footbottom dl.contactus, .footbottom dl.newslet{ width: 100%; float: none; margin: 0 0 3% 0; padding: 0 1%;}
   .sub_goods ul li .desc{ display: none;}
   .sub_goods ul li,.sub_goods ul li img{ height: auto;}
   .langshou dl{ width: 27%;}
   .spic{ width: 100%; margin: 0 0 3% 0;}
   .spic ul li{ margin: 0 2% 0 0;}
   .pro_view_inner{ margin: 3% 0;}
   .conright{ width: 100%;}
   .demain{ margin-top: 5%;}
   .conus h6{ font-size: 14px;}
   .conus{ line-height: 60px;}
   .newsLeft ul li .intro{ width: 100%;}
   .newsLeft ul li{ height: auto;}
}

@media screen and (max-width: 414px) {
    .langshou dl{ width: 30%;}
    .spic ul{ text-align: center;}
    .spic ul li{ float: none; display: inline-block; width: 47%;}
    .spic ul li img{ width: 100%;}
    .bpic{ width: 100%;}

}

@media screen and (max-width: 375px) {
     
}
@media screen and (max-width: 320px) {
    .langshou dl{ width: 30%;}
    .conus{ line-height: 30px;}
    .langshou dl dt{ margin-right: 1%; width: 28%;}
}