﻿@charset "utf-8";
/* CSS Document */
@media(max-width:1600px){
.kefu{ display: none;}
.nbanner .r_img {
        position: relative;
        bottom: -20px;
    }

}
@media(max-width:1440px){
    .nbanner .r_img {
        position: relative;
        bottom: -20px;
        width: 40%;
    }
    .nbanner .r_img>img{ max-width:100%;}

}
@media(max-width:1366px) {

}
@media(max-width:1200px){
    .nbanner{ margin-top:65px; min-height: 70px; background: #f5f5f7; }
    .nbanner .r_img{display: none;}
    .nbanner_con { height: 100%;}
    .l_txt {
        position: relative;
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .l_txt h4 {
        font-size: 20px;}
    .l_txt h3{padding-bottom: 0; font-size: 24px;}
    .breadcrumbNav{ right: 0; left: auto; bottom:20px;}
    .classnavbox {
        margin-top: 20px;
    }
    .detailsilder{ display: none;}
    .detailcon {
        margin: 0 0 0 0;
    }
    .productlist>ul>li{ display:inline-block;width: 32%; margin-right:1.3%;}
    .productlist>ul>li:nth-child(4n){margin-right:1.3%;}
    .productlist>ul>li:nth-child(3n){ margin-right: 0;}
}
@media(max-width:812px){
    .l_txt h4 {
        font-size: 14px; margin-top: .7rem;}
    .l_txt h3{padding-bottom: 0; font-size: 18px;}
    .breadcrumbNav{ right: 0; left: auto; bottom:10px; font-size: 14px; color: #fff; display: none;}
    .classnavbox {
        margin-top: 20px;
    }
    .productlist>ul>li{ display:inline-block;width: 48%; margin-right:2%;}
    .productlist > ul > li a{ font-size: 16px;line-height: 30px;}
    .productlist > ul > li p{ font-size: 14px; line-height: 24px;}
    .productlist>ul>li:nth-child(4n){margin-right:2%;}
    .productlist>ul>li:nth-child(3n){ margin-right: 2%;}
    .productlist>ul>li:nth-child(2n){ margin-right: 0%;}
}

@media(max-width:750px){
    .h4_tit2>i{ margin-right: 20px;}
    .h4_tit2>i>img{ display: block; width: 30px;  height: auto;}
    .h4_tit2{ font-size: 20px;  }
    /*product detail*/
    .conbox { margin-top: 20px;}
    .detailcon dl{ padding:20px 0; flex-wrap: wrap;}
    .detailcon dt{  width:100%;margin-right: 0; }
    .detailcon dd{ width: 100%; margin-top: 20px;}
    .detailcon dd>h3{font-size: 18px; }
    .detailcon dd>h4{font-size:16px;}
    .detailcon dd>p{ font-size: 14px; line-height:26px; margin-top:0px; }
    .detailcon dd>p.s1{margin-top:20px;}
    .detailcon dd>p.s2{ margin-top: 10px;}
    .detailcon dd>div>span{ font-size: 14px; margin-top:20px;}
    .prd_11 ul li{width:48%; margin-right: 4%}
    .prd_11 ul li:nth-child(2n){margin-right:0px;}
    /*about us*/
    .con1 {
       flex-wrap: wrap;
    }
    .acon_1{ padding: 20px 0; }
    h3.title1{ font-size:20px;}
    h3.title1>b{ width: 15px; height: 5px; background: #ff0000; display: block; margin-top: .2rem; border-radius: 2.5px;}
    .con_l{ width: 96%; margin:0 auto;}

    .con_l>ul{ font-size: 14px;  }
    .con_l>ul>li{ display: flex; flex-direction: column; border-left:none; padding: 14px; margin: 20px 7px 0; background: #fcfcfc; border-radius: 10px;}
    .con_l>ul>li:first-child{padding-left: 14px;}
    .con_l>ul>li:nth-child(4){padding-left: 14px;}
    .con_l>ul>li>strong{ color: #ce161c; font-size: 20px; font-family: Arial; padding-top: 5px;font-weight: normal;}
    .con_l>ul>li>strong>sup{ font-size:16px; font-weight: normal;}
    .con_l>p{font-size: 14px; color: #999; line-height:26px; margin-top: 20px; text-align: justify;}
    /*en*/
    .con>ul.en{ font-size:14px; color: #222; flex-wrap: wrap;justify-content: flex-start;}
    .con>ul.en>li{border-left:none;  padding-left: 0;  background: #fcfcfc;border-radius: 6px; margin: 20px 2% 0; padding: 10px 0;  width: 45%;box-sizing: border-box; align-items: center;}
    .con>ul.en>li:first-child{border-left:none;padding-left: 0; }
    .con>ul.en>li>strong{  font-size:20px; }
    .con>ul.en>li>strong>sup{ font-size: 16px; }
    .con>ul.en{font-size: 14px; line-height:26px;}


    .con_r{width: 100%;}
    .acon_2{  padding: 20px 0;}
    .acon_2 .con ul{ flex-wrap: wrap; margin-top: 20px;}
    .acon_2 .con ul li{ width: 100%;position: relative;
        overflow: hidden; margin-bottom: 20px;}
    .acon_2 .con ul li div.intro{padding: 20px; }
    .acon_2 .con ul li div.intro>span{ font-size: 30px;  height: 24px;}
    .acon_2 .con ul li div.intro>h4{font-size: 16px; padding:20px;}
    .acon_2 .con ul li div.intro>p{font-size: 14px; color: #999; line-height: 26px;}

    .line_swiper{margin-top:20px; flex-wrap: wrap;  }
    .line_swiper>div{ width:100%; position: relative;}
    .swiper_img .swiper-button-next,
    .swiper_img .swiper-button-prev {
        right:20px;
        left: auto;
        width:35px;
        height:35px;
    }
    .swiper_img .swiper-button-next {
        bottom: 20px;
        top:auto;
    }
    .swiper_img .swiper-button-prev{

        bottom: 70px;
        top:auto;
    }

    .p4r_c>ul>li{ font-size:16px; padding: 10px 20px;}
    .p4r_c>ul>li:before{width: 6px; height: 100%;position: absolute; left: 0; top:0; content: '';  background: #fff; }
    .p4r_c>ul>li>i{font-size:20px; font-family: Arial; padding-right: 20px; color: #ddd;}


    .acon_3{padding:20px;}
    .acon_3 p{font-size: 14px; line-height:26px; text-align: justify;}
    .dl_1{flex-wrap: wrap;}
    .dl_1>dt{ width: 100%;}
    .dl_1>dd{ width: 100%;  box-sizing: border-box; padding-left: 0;}
    .dl_1>dd>h3{ margin-top: 20px;}
    .dl_1>dd>p{font-size:14px; line-height:26px;  margin-top:20px; text-align: justify;}

    .dl_1:nth-child(2){ margin-top: 20px;}
    .dl_1:nth-child(2) dt{order: 0;}
    .dl_1:nth-child(2)>dd{padding-right:0; padding-left: 0; order: 1}

    .ahonor{padding: 20px;}
    .swiper3 h3{  font-size: 18px; padding-bottom:20px;}
    .ahonor .swiper-button-next,
    .ahonor .swiper-button-prev {
        top:45%;
      /*  position:absolute;
        top:0px;
        width:1.18rem;
        height:1.18rem;
        margin-top:-18px;
        z-index:10;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#fff;*/
    }
    .ahonor .swiper-button-next {
        right:0%;
        left: auto;
    }
    .ahonor .swiper-button-prev{
        left: 0%;
        right: auto;

    }
    .swiper3 dl.swiper-slide-active{  transform: scale(1);}

    .ul_1{flex-wrap: wrap;}
    .ul_1>li{ width:47.5%; display: flex;  justify-content: flex-start; margin-bottom: 20px;}
    .ul_1>li>div{ width: 60px; height:60px;padding: 20px; }
    .ul_1>li>div>img{max-width: 100%; display: block;}
    .ul_1>li>h3{margin-top:20px;}
    .ul_1>li>p{ font-size: 14px;line-height: 26px;  margin-top: 20px; text-align: center;}
    /*online*/
    /*contact us*/
    .ul_2{flex-wrap: wrap;}
    .ul_2>li{ display: flex; flex-direction: column; justify-content: center; align-items: center; width:98%; margin: 10px auto; border: solid #ddd 1px; padding:20px; border-radius: 10px; box-shadow: 0 5px 20px #eee;}
    .ul_2>li>div{ width: 50px; height: 50px; }
    .ul_2>li:hover>h3.title1{ color:#fa151f; }
    .ul_2>li>h3.title1{font-size: 16px;}

    .htitle{ width: 100%; padding: 0 0 .4rem; border-bottom: solid #eee 1px;}
    .htitle>.h4_tit2{ justify-content: flex-start;}
    .ul_3{ margin-top: .5rem;}
    .ul_3>li{ display: block; width:48%; padding:0;border: none;}
    .ul_3>li:nth-child(1){ background: none}
    .ul_3>li:nth-child(2){ background: none}
    .ul_3>li>div{width:100%; margin-left: 0%; background: #fff;padding: 20px;  height: auto;border: solid #ddd 1px;  border-radius: 10px; }

    .ul_3>li h3.title1{font-size: 18px;}
    .ul_3>li>div>p{ font-size: 14px; line-height: 28px; }

    .onlinebox{ width: 96%; padding-bottom: 20px;margin:0 auto}
    .onlinebox .con1{ margin-top: 20px;}
    .onlinebox .con_l {
        width: 96%;
        margin: 0 auto;
    }
    onlinebox .con_r {
        display: none;
    }
    .online_dl{ width: 100%;margin-bottom:20px}
    .online_dl>dt{width: 100%;font-size: 16px; margin-bottom: 20px; }
    .online_dl>dt>i{ display:inline-flex; align-self:center;color:#fa151f; line-height: .3rem; margin-right: 10px;position: relative; top:5px; }
    .online_dl>dd{width: 100%;}
    .online_dl>dd>span{ display:inline-block;width: 80px; height:30px; text-align: center; line-height: 30px; border-radius: 15px; margin-right: 20px; font-size: 14px; }
    .online_dl>dd>textarea{font-size: 14px;}
    .online_dl>dd>input{ font-size: 14px; }



    /*knowledge*/
    .knowledge{ width: 100%; margin-top: 20px}
    .knowledge ul>li{ padding: 20px; box-shadow: 0 0  10px #ddd; margin-top:20px;  width: 100%}
    .knowledge ul>li h3.title1,.honor1 ul>li h3.title1{font-size: 16px;}
    .knowledge ul>li h3.title1>b{ height: 3px; border-radius: 0;}
    .knowledge ul>li>p{ font-size: 14px; line-height: 26px;  padding: 20px 0;}
    .knowledge ul>li>div{ padding-top: 20px;}
    .knowledge ul>li>div>span{font-size: 14px; }

    .knowledge ul>li:hover{ border-color: #fa151f;box-shadow:0 5px 30px #fbc2c4; }


    /*honor1*/
    .honor1 ul{ flex-wrap: wrap;}
    .honor1 ul>li{ display: flex; justify-content: space-between; background: #f6f6f8; width: 100%;}
    .honor1 ul>li>div:first-child{ display: flex; justify-content: center; border-top: none; padding: 20px;}

    .honor1 ul>li>div>a>img{width: 80%;}

    .honor1 ul>li div.honor_intro>p{ font-size: 14px; line-height: 26px; }
    img.magnify{cursor: pointer;}

    .maimg{ width: 90%; padding: 20px;  }
    .maimg_close{ right: 10px; top:10px;}
    .maimg_close>img{ width: 80%;}

    .newslist ul>li{ width: 100%; padding: 0 0 20px; margin-top:20px;   margin-right:3%;}
    .newslist ul>li:nth-child(3n){ margin-right: 3%;}
    .newslist ul>li:nth-child(2n){ margin-right:0;}
    .newslist ul>li h3.title1{margin: 20px 20px 0;}
    .newslist ul>li>p{ margin: 0 20px; padding: 20px 0;}
    .newslist ul>li>div{ margin: 0 20px;}

    .newscon{ margin: 20px auto 0; width: 96%; display: flex;justify-content: space-between; padding-bottom: 1rem;}
    .news_detail{ width:96%; padding-right: 0; margin: 0 auto;}
    .news_detail h1{ font-size:18px;}
    .news_detail h6{  padding: 20px 0; color:#888;font-size:14px; align-items:center;}
    .news_detail h6>span{ padding: 0 10px;}
    .news_detail h6>span>img{width: 80%;}
    .news_detail>.content p{ line-height:28px; font-size: 14px;   color: #666; padding: 10px 0;}
    .news_slider{ display: none}

    .page_related{ width: 100%;  padding: 20px 0 0;font-size: 14px; line-height:28px;  margin-top: 20px;}
    .page_related>a{ color: #333; display: block; margin-top: 10px; }
    .page_related>span{ color: #888; display: block; margin-top:10px;}
    .mapall {
        width: 100%;
        height: 300px;
        overflow: hidden;
    }

    .nbgimg{overflow: hidden;}
    .nbgimg>img{display: block; width: 200%; margin-left: -50%;}
}

@media(max-width:640px){
    .classnav dl {
        padding: 0;
        font-size: 16px;
        flex-wrap: wrap;
        position: relative;
    }
    .classnav dl>dt{ width:100%; background: none; text-align: left; padding:15px 20px;  border-bottom: dashed #eee 1px; color: #222;font-weight: bold;}
    .classnav dl>dd{display: flex; align-items: center; white-space: nowrap; width: 100%; flex-wrap: wrap; padding: .2rem; }
    .classnav dl>dd a{ display: inline-flex; padding: .05rem .15rem; margin:.1rem; border: solid #eee 2px; border-radius: 4px; align-items: center;}
    .classnav dl>dd a:first-child{position: absolute; top:10px; right: 10px;}



    .classnav dl > dd a > img {
        max-width: 80px;
    }
    .classnav dl>dd a:first-child{ margin: 0 8px;}
    .productlist > ul > li > div{ display: none;}
    .productlist>ul>li{ margin-top: 15px;}
    .pagination {
        margin: 20px auto;
    }

}
