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

    .w1200,
    .w1250,
    .w1400,
    .w1500,
    .w1600,
    .w1000,
    .w850 {
        width: 96%;
    }

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


/*=================================中小型笔记本或大平板 laptop /*=================================*/
     
     @media screen and (max-width: 1200px) {
        .w850,
        .w1000,
        .w1200,
        .w1250,
        .w1400,
        .w1500,
        .w1600 {
            width: 92%;
        }
      
        /*手机导航开始menu*/
        .menu {
             display: block;
             cursor: pointer;
        }

        .menu_down {
             position: fixed;
             left: 0;
             top: 60px;
             z-index: 9;
             width: 100%;
             padding: 22px 0;
             background: #fff;
             border-top: 1px solid #fff;
        }

        .menu_down ul {
             flex-direction: column;
             width: 92%;
             margin: 0 auto;
        }

        .menu_down li>a {
             width: 100%;
             line-height: 3;
             position: relative;
             border-bottom: 1px solid #ccc;
        }

        .menu_down li span {
             color: var(--color);
             position: absolute;
             top: 50%;
             right: 0%;
             transform: translateY(-50%);
        }

        .menu_down li a {
             padding: 0 10px;
             display: block;
             font-size: 16px;
             color: #000;
        }

        .menu_down li .erji {
             display: none;
             /* background: #fab54d; */
             width: 90%;
             margin-left: auto;
             -webkit-transition: all 300ms ease-out;
             -moz-transition: all 300ms ease-out;
             transition: all 300ms ease-out;
        }

        .menu_down li .erji a {
             border-bottom: 1px dashed #ccc;
             line-height: 3;
             font-size: 14px;
        }

        .menu span.icon-bar {
             background: #ccc;
             width: 25px;
             height: 2px;
             display: block;
             -webkit-transition: all 300ms ease-out;
             -moz-transition: all 300ms ease-out;
             transition: all 300ms ease-out;
        }

        .menu .sr-only {
             display: none;
        }

        .menu .icon-bar:nth-child(2) {
             -webkit-transform: rotate(0deg) translate(0, 0);
             -moz-transform: rotate(0deg) translate(0, 0);
             -ms-transform: rotate(0deg) translate(0, 0);
             transform: rotate(0deg) translate(0, 0);
             transform-origin: top left;
        }

        .menu .icon-bar:nth-child(3) {
             margin-top: 6px;
             -webkit-transform: scale(1, 1);
             -moz-transform: scale(1, 1);
             -ms-transform: scale(1, 1);
             transform: scale(1, 1);
             -webkit-transform-origin: center center;
             -moz-transform-origin: center center;
             -ms-transform-origin: center center;
             transform-origin: center center;
        }

        .menu .icon-bar:nth-child(4) {
             margin-top: 6px;
             -webkit-transform: rotate(0deg) translate(0, 0);
             -moz-transform: rotate(0deg) translate(0, 0);
             -ms-transform: rotate(0deg) translate(0, 0);
             transform: rotate(0deg) translate(0, 0);
             transform-origin: top left;
        }

        .xz .icon-bar:nth-child(2) {
             -webkit-transform: rotate(45deg) translate(2px, -3px);
             -moz-transform: rotate(45deg) translate(2px, -3px);
             -ms-transform: rotate(45deg) translate(2px, -3px);
             transform: rotate(45deg) translate(2px, -3px);
             transform-origin: 0 0;
        }

        .xz .icon-bar:nth-child(3) {
             opacity: 0;
        }

        .xz .icon-bar:nth-child(4) {
             -webkit-transform: rotate(-45deg) translate(1px, 2px);
             -moz-transform: rotate(-45deg) translate(1px, 2px);
             -ms-transform: rotate(-45deg) translate(1px, 2px);
             transform: rotate(-45deg) translate(1px, 2px);

        }

        /*手机导航结束*/

        header{
            height: 60px;
            box-shadow: 0 0 3px 3px rgba(60, 60, 60, .1);
            position: fixed;
            top: 0;
            left: 0;
        }
        header .logo{
            height: 60px;
            padding: 0;
            box-shadow: none;
        }
        header .logo:hover{
            box-shadow: none;
        }
        header .logo img {
            height: 60px;
            padding: 5px 0;
            width: auto;
            object-fit: contain;
        }
        header .nav{
            display: none;
        }
        header .w1400{
            align-items: center;
        }
        .banner{
            margin-top: 60px;
        }
        .banner2{
            margin-top: 60px;
            height: 360px;
        }
        .banner2 img{
            height: 360px;
        }
    }

   /*=================================手机或小平板 phone=============================== */
   @media screen and (max-width: 767px) {
       
    .banner{
        min-height: auto;
    }
    .index-page1{
        padding: 30px 0 50px;
    }
    .index-page1 .flex-x{
        flex-direction: column;
        align-items: center;
    }
    .index-page1 .left{
        width: 100%;
    }
    .index-page1 .right{
        width: 100%;
        margin-top: 30px;
    }
    .index-page1 .left h2{
        width: 100%;
        margin: 0;
        text-align: center;
    }
    .index-page1 .left h5{
        width: 100%;
        margin: 0;
        text-align: center;
    }
    .index-page1 .right h3{
        margin-top: 0;
    }
    .index-page1 .right .editor{
        margin: 20px 0;
    }
    .index-page1 .right .more{
        margin: 0 auto;
    
    }
    .index-page2 .w1400 .bg{
        display: none;
    }
    .index-page2 .w1200 h2{
        font-size: 40px;
    }

    .index-page2 .w1200 ul li{
        width: 100%;
    }
    .index-page2 .w1200 ul li:nth-child(1){
        background: #fff;
        background-size: cover;
    }
    .index-page2 .w1200 ul li:nth-child(1) a{
        flex-direction: column;
        padding: 20px 5%;
    }
    .index-page2 .w1200 ul li:nth-child(1) a .left{
        width: 100%;
    }
    .index-page2 .w1200 ul li:nth-child(1) a .left img{
        height: 200px;
    }
    
    .index-page2 .w1200 ul li:nth-child(1) a .right{
        width: 100%;
        margin-top: 20px;
        text-align: center;
    }
    .index-page2 .w1200 ul li:nth-child(1) .right h4{
        font-size: 24px;
    }
    .index-page2 .w1200 ul li:nth-child(1) .info{
        width: 80%;
        margin: 0 auto 0;
    }
    .index-page2 .w1200 ul li:nth-child(1) .info img{
        width: 16px;
    }
    .index-page2 .w1200 ul li:nth-child(1) .info p{
        font-size: 14px;
    }

    .index-page2 .w1200 ul li a .img img{
        height: 240px;
    }
    .index-page2 .w1200 ul li a .img .img-bg{
        width: 180px;
        height: 180px;
    }
    .index-page2 .w1200 ul li .name{
        height: 60px;
    }
    .index-page3{
        padding-bottom: 80px;
    }
    .index-page3 .w1200 h2{
        font-size: 40px;
    }
    .common-ul{
        gap: 60px;
    }
    .common-ul li{
        width: 100%;
    }
    .common-ul li:nth-child(3n+2){
        transform: none;
    }
    .common-ul li a>img{
        height: 360px;
    }
    
    .common-bottom{
        display: none;
    }
    .common-bottom2{
        display: none;
    }

    .banner2{
        height: 300px;
    }
    .banner2 img{
        height: 300px;
    }
    .about-page1{
        margin-top: -300px;
        padding: 360px 0 200px;
    }
    .about-page1 .w1200{
        padding: 0;
    }
    .about-page1 .top{
        margin-bottom: 30px;
    }
    .product-page{
        padding: 650px 0 60px;
    }
    .product-page h2{
        font-size: 40px;
    }
    .product-page .nav li a{
        font-size: 18px;
        padding: 12px 20px;
        flex-direction: row;
        align-items: center;
    }
    .product-page .nav li img{
        height: 20px;
        margin-right: 10px;
        margin-bottom: 0;
    }
    .product-page .nav li a span{
        margin-top: 3px;
    }
    .product-detail-page{
        padding: 650px 0 60px;
    }
    .product-detail-page .flex-x{
        flex-direction: column;
        gap: 30px;
    }
    .product-detail-page .flex-x .left{
        width: 100%;
        flex-direction: column-reverse;
    }
    .product-detail-page .product-swiper2{
        width: 100%;
        margin-top: 20px;
        margin-right: 0;
        padding: 0;
    }
    .product-detail-page .product-swiper{
        padding: 0;
        max-height: 400px;
    }
    .product-detail-page .product-swiper .swiper-slide{
        width: 100%;
        padding: 20px ;
        text-align: center;
    }
    .product-detail-page .swiper-slide img{
        width: auto;
    }
    .product-detail-page .flex-x .right{
        width: 100%;
       
    }
    .product-detail-page>.editor{
        margin-top: 30px;
    }

    .page-page{
        padding: 650px 0 100px;
    }
    .page-page h2{
        font-size: 40px;
        margin: 20px 0 30px;
    }
    .page-page .common-ul{
        grid-template-columns: repeat(1, 1fr);
        gap: 60px 2%;
    }
    .download-page{
        padding: 650px 0 60px;
    }
    .download-page h2{
        font-size: 40px;
        margin: 20px 0 30px;
    }
    .download-page ul{
        grid-template-columns: repeat(1, 1fr);
    }
    .download-page ul li a{
        padding: 20px 40px;
    }
    .download-page ul li h4{
        height: auto;
        min-height: 60px;
        -webkit-line-clamp: 3;
        margin-bottom: 10px;
    }
    .news-page{
        padding: 650px 0 60px;
    }
    .news-page h2{
        font-size: 40px;
        margin: 20px 0 30px;
    }
    .news-page ul li{
        flex-direction: column;
    }
    .news-page ul li .left{
        width: 100%;
        margin: 0;
        border: 0;
    }
    .news-page ul li .left img{
        transform: none;
    }
    .news-page ul li .right{
        width: 100%;
        margin-top: 20px;
        padding: 0;
    }
    .news-detail-page{
        padding: 650px 0 60px;
    }
    .news-detail-page h4{
        width: 100%;
        font-size: 24px;
        margin: 15px 0 20px;
    
    }
    .contact-page{
        padding: 650px 0 60px;
    }
    .contact-page .info{
        flex-direction: column;
        gap: 30px;
    }
    .contact-page .info .left{
        width: 100%;
    }
    .contact-page .info .right{
        width: 100%;
    }
    .contact-page .info h4{
        font-size: 30px;
    }
    .contact-page .info h5{
        font-size: 20px;
    }

    .contact-page .info p{
        font-size: 16px;
    }
    .contact-page .message input{
        width: 100%;
    }   
    .contact-page .message .yz{
        width: 100%;
    }
    .contact-page .message .btn{
        width: 80%;
        height: 50px;
        margin:  20px auto 0;
    }
    .contact-page .message{
        margin: 30px 0 ;
        padding: 30px 5% 50px;
    }






    footer .top .logo{
        margin: 10px 0;
    }
    footer .top .nav{
        display: none;
    }
    footer .top .info{
        margin: 30px 0;
    }
    footer .top .info .flex-x{
        flex-direction: column;
        gap: 30px;
    }
    footer .top .info .flex-x li{
        width: 100%;
    }
    footer .top .info li:nth-child(2){
        margin: 0;
        text-align: center;
    }
    
   }