@media(max-width:1400px){
    .auto-container.inside-header{
        width:95%
    }
     .page-container.categorybox .categoryitem a{
        font-size:16px
    }
}
 @media(max-width:1200px){
    .page-container.categorybox .categoryitem a{
        padding:0 15px
    }
     .infobox .rightbox .swiper-business .b-item .business-info{
        width:45%
    }
     .infobox .rightbox .swiper-business .b-item .whatsappbox{
        width:35%
    }
     .infobox .rightbox .swiper-business .b-item .whatsappbox>a{
        padding:10px 15px
    }
}
 @media(max-width:1152px){
    .infobox .rightbox .swiper-business .b-item .business-info{
        width:48%
    }
     .infobox .rightbox .swiper-business .b-item .whatsappbox{
        width:34%
    }
     .page-container.categorybox .categoryitem a{
        padding:0 10px
    }
}
 @media(max-width:1024px){
    .header-logo p{
        display:none
    }
     .search-procuct{
        width:250px
    }
     .footer .foot_add{
        max-width:320px
    }
     .footerbar .copyright a{
        margin-right:20px
    }
     .infobox .leftbox,.infobox .rightbox{
        width:49%
    }
}
 @media(max-width:768px){
    .page-container{
        max-width:96%
    }
     .page-banner{
        margin-top:50px;
        overflow:hidden
    }
     .page-container.categorybox .categoryitem{
        width:100%;
        text-align:center;
        padding:0
    }
     .page-container.categorybox .categoryitem .mobile-navbtn{
        top:10px
    }
     .page-content{
        padding:10px 0
    }
     .inside-pagination{
        margin:2rem auto;
        padding:1rem 0
    }
     .inside-pagination ul{
        margin:0
    }
     .footer{
        width:100%
    }
     .auto-container.inside-header,.footer{
        width:100%;
        margin:0;
        padding:0!important;
        max-width:100%!important
    }
     .about-header-box .page-container>div,.company-culture .contentbox .row,.company-culture .contentbox .row div{
        padding:0;
        margin:0
    }
     .about-header-box .row{
        margin:auto
    }
     .productdetails-box .product-content-box>div img{
        width:100%!important;
        height:auto!important
    }
     .page-content .quotatio .row #quotatio-product-list .quotatio-item .imgbox{
        width:40%
    }
     .page-content .quotatio .row #quotatio-product-list .quotatio-item .text{
        margin:0;
        margin-left:10px;
        width:60%
    }
     .page-content .quotatio .row #quotatio-product-list .quotatio-item .text h3{
        font-size:14px
    }
     .infofooterbox .relation .swiper-relation .iteminfo>p a{
        font-size:16px
    }
}
 @media(max-width:640px){
    .modal{
        top:20%
    }
     .page-banner img{
        width:200%;
        margin-left:-50%
    }
     .inside-header .inside-nav{
        padding:15px 10px;
        width:100%!important
    }
     .inside-header .inside-nav:last-child{
        text-align:left!important;
        border-top:1px solid #eee
    }
     .inside-header .inside-nav:last-child a{
        padding:10px 0!important;
        font-size:16px!important
    }
     .inside-header .inside-nav:first-child{
        padding:15px 3%!important
    }
     .listnewbox .morebox{
        padding:10px 0;
        font-size:16px
    }
     .content iframe{
        max-width:100%;
        height:60vw
    }
     .newitembox .news-item-box{
        width:100%
    }
     .newitembox .news-item-box .textbox{
        padding:10px;
        font-size:14px
    }
     .newitembox .news-item-box .textbox h3{
        font-size:18px
    }
     .post-info .header{
        text-align:left
    }
     .post-info{
        padding:15px
    }
     .postdetailsbox .relation .swiper-relation .swiper-slide .imgbox,.postdetailsbox .relation .swiper-relation .swiper-slide .textbox{
        width:100%
    }
     .postdetailsbox .relation .swiper-relation .swiper-slide .textbox{
        padding:20px
    }
     .postdetailsbox .relation{
        margin:0;
        padding:10px
    }
     .page-container.categorybox .categoryitem .child{
        border-bottom:1px solid #eee;
        display:none!important
    }
     .page-container.categorybox .categoryitem a{
        border:0;
        border-bottom:1px solid #eee;
        padding:10px 0
    }
     .postdetailsbox .relation .swiper-relation{
        margin-top:0
    }
     .page-container.categorybox{
        padding:0;
        max-width:100%;
        margin-bottom:20px
    }
     .page-content .content-box .list-box .product-item{
        width:100%;
        display:flex;
        flex-wrap:wrap;
        justify-content:space-between
    }
     .page-content .content-box .list-box .product-item .imgbox{
        width:45%
    }
     .page-content .content-box .list-box .product-item .text{
        width:55%;
        padding:5px 10px;
        text-align:left
    }
     .page-content .content-box .list-box .product-item .text .remark{
        min-height:auto;
        line-height:20px
    }
     .page-content .content-box .list-box .product-item .imgbox .quote-button{
        top:0;
        font-size:14px;
        padding:5px
    }
     .page-content .content-box .list-box .product-item .text h3{
        font-size:16px;
        -webkit-line-clamp:2;
        min-height:auto
    }
     .page-content .content-box .list-box .product-item .text .row div{
        padding:0;
        margin:0;
        width:auto;
        font-size:14px
    }
     .page-content .content-box .list-box .product-item .text .row div:first-child{
        text-align:left!important;
        margin-right:10px
    }
     .page-content .content-box .list-box .product-item .text .row{
        width:100%;
        background:unset;
        margin:unset;
        padding:0;
        align-items:center;
        justify-content:space-between
    }
     .page-content .content-box .list-box .product-item .imgbox img{
        border-bottom:unset
    }
     .infofooterbox .relation .swiper-relation .iteminfo{
        padding:10px
    }
     .infofooterbox .relation .swiper-relation .iteminfo .row{
        width:100%;
        padding:10px;
        border-radius:10px
    }
     .infofooterbox .relation .swiper-relation .iteminfo .row div{
        width:100%;
        margin-bottom:10px
    }
     .page-content .content-box .list-box .product-item .text .row span img{
        width:15px
    }
     .infobox .leftbox,.infobox .rightbox{
        width:100%
    }
     .infobox .leftbox{
        padding:10px
    }
     .infobox .leftbox h2{
        padding:20px 0
    }
     .infobox .leftbox .contactinfo>div{
        margin:10px auto
    }
     .infobox .leftbox .contactinfo>div .imgbox img{
        width:50px
    }
     .infobox .rightbox{
        margin-top:20px;
        margin-bottom:20px
    }
     .infobox .rightbox .swiper-business .b-item{
        text-align:center;
        padding-bottom:40px;
        padding-top:20px
    }
     .infobox .rightbox .swiper-business .b-item .business-info,.infobox .rightbox .swiper-business .b-item .imgbox,.infobox .rightbox .swiper-business .b-item .whatsappbox{
        width:100%
    }
     .infobox .rightbox .swiper-business .b-item .imgbox img{
        max-width:100px;
        width:100px;
        height:100px;
        object-fit:cover
    }
     .infobox .rightbox .swiper-business .b-item .business-info{
        padding:0
    }
     .infobox .rightbox .swiper-business .b-item .whatsappbox{
        padding-top:10px
    }
     .messagebox{
        padding:10px
    }
     .messagebox>h2{
        font-size:20px
    }
     .message-box .input,.messagebox .frombox .input{
        display:unset
    }
     .message-box .input>div,.messagebox .frombox .input>div{
        width:100%;
        margin:10px auto
    }
     .page-content .quotatio,.page-content .quotatio .quotation-box>div .message-box{
        padding:10px
    }
     .our-box{
        padding:20px
    }
     .our-box .our-list .swiper-wrapper{
        padding-bottom:20px
    }
     .our-box>div>h1{
        margin:10px auto;
        font-size:20px
    }
     .our-box>div>p{
        margin:10px auto
    }
     .productinfobox{
        padding:10px
    }
     .productinfobox .page-container .row .imgbox{
        padding:0;
        width:100%
    }
     .productinfobox .page-container .row .imgbox .imagesbox .product-button img{
        margin-top:60%
    }
     .productinfobox .page-container .row .textbox{
        padding:10px 0
    }
     .productinfobox .page-container .row .textbox>h1{
        font-size:20px
    }
     .productinfobox .page-container .row .textbox .other{
        margin-top:10px
    }
     .productinfobox .page-container .row .textbox .attribute,.productinfobox .page-container .row .textbox .remark,.productinfobox .page-container .row .textbox>a>button{
        margin:10px 0;
        padding:5px 15px
    }
     .productdetails-box{
        padding:10px
    }
     .productdetails-box .header span{
        font-size:18px;
        margin-right:10px
    }
     .infofooterbox{
        padding:10px
    }
     .infofooterbox .product-footer{
        padding:0
    }
     .infofooterbox .product-footer>h2{
        margin:10px auto
    }
     .videolistbox{
        padding:20px 0
    }
     .videolistbox .videoitembox .video-item{
        flex:0 0 100%
    }
     .videolistbox .videoitembox .video-item .imgbox img.video_play{
        opacity:1
    }
     .listcasebox .list-box .case-box,.listcasebox .list-box .index-item,.listcasebox .list-box .right-item{
        width:100%;
        min-height:auto
    }
     .listcasebox .list-box .right-item,.listcasebox .list-box .right-item .item:nth-child(2){
        margin-top:10px
    }
     .listcasebox .list-box .right-item .item{
        position:relative;
        height:auto
    }
     .listcasebox .list-box .index-item a .text,.listcasebox .list-box .right-item .item a h4{
        padding:0 10px
    }
     .listcasebox .list-box .case-box .textbox{
        padding:10px
    }
     .listcasebox .list-box .case-box .imgbox{
        min-height:auto
    }
     .list-faq-box{
        padding:10px
    }
     .list-faq-box .headerbox{
        width:100%;
        padding:10px;
        margin:10px auto
    }
     .newitembox .news-item-box .textbox .row div,.videolistbox .videoitembox .video-item .textbox .row div{
        display:inline-block;
        width:auto
    }
     .post-info .header>h1{
        font-size:22px
    }
     .list-faq-box .headerbox h2{
        font-size:28px!important
    }
     .list-faq-box .faq-item .wen .icon{
        width:12%;
        font-size:24px
    }
     .list-faq-box .faq-item .wen .title{
        padding:10px;
        font-size:18px;
        line-height:24px
    }
     .list-faq-box .faq-item .da{
        padding:10px
    }
     .list-faq-box .contactimg{
        margin:10px auto
    }
     .factory-page{
        padding:10px
    }
     .factory-page .header{
        width:100%;
        padding:10px;
        margin:10px auto
    }
     .certifcate-box .header h2 span,.factory-page .header h2 span{
        font-size:28px!important
    }
     .factory-page .factory-box .swiper{
        width:100%
    }
     .factory-page .factory-box .swiper .factory-swiper{
        padding:10px
    }
     .factory-page .factory-box .factory-button{
        display:none
    }
     .certifcate-box{
        padding:10px
    }
     .certifcate-box .certifcate-list .header{
        width:100%;
        padding:10px;
        margin:10px auto
    }
     .certifcate-box .certifcate-list .header h2{
        font-size:28px!important
    }
     .certifcate-box .certifcate-list .row .certifcate-item{
        margin-bottom:10px;
        width:50%
    }
     .about-header-box{
        padding:10px 0
    }
     .about-header-box .title{
        font-size:30px
    }
     .development-box{
        padding:10px
    }
     .development-box .headerbox{
        margin-bottom:20px
    }
     .development-box .headerbox h2{
        font-size:24px
    }
     .development-box .headerbox p{
        margin:10px auto
    }
     .development-box .swiper-development .time-box .title-box>h4{
        padding:0 20px;
        line-height:45px
    }
     .development-box .development-button{
        top:152px
    }
     .development-box .development-button.development-button-prev{
        left:5px
    }
     .development-box .development-button.development-button-next{
        right:5px
    }
     .development-box .swiper-development .time-box .image-box{
        padding:20px 0 10px 20px
    }
     .development-box .swiper-development .time-box>p{
        padding:10px 0 10px 20px
    }
     .company-culture .headerbox h2{
        font-size:24px
    }
     .company-culture .headerbox p{
        margin:10px auto
    }
     .company-culture .contentbox{
        margin:20px auto
    }
     .company-culture .contentbox div.paddingbox{
        padding:20px
    }
     .newitembox .news-item-box .textbox .remark{
        min-height:42px
    }
}
 