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

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

}

@media screen and (max-width: 1400px) {
     header .logo a{
          padding: 10px 20px 30px;
     }
     header .w1400 .nav a{
          padding: 0 20px;
     }
     header .w1400 .nav{
          padding: 0 2%;
     }
   
}

/*=================================中小型笔记本或大平板 laptop /*=================================*/
@media screen and (max-width: 1200px) {

     /*手机导航开始menu*/
     .menu {
          display: block;
          cursor: pointer;
     }

     .menu_down {
          position: fixed;
          left: 0;
          top: 80px;
          z-index: 99;
          width: 100%;
          padding: 0 0 22px;
          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);

     }

     /*手机导航结束*/
     .w1200,
     .w1250,
     .w1400,
     .w1500 {
          width: 92%;
     }
     header{
          height: 80px;
     }
     header .w1400 .nav{
          display: none;
     }
     header .right{
          display: flex;
          flex-direction: row;
          align-items: center;
     }
     .header-right{
          margin: 0 30px;
     }
     header .logo{
          height: 100%;
          border-radius: 0;
     }
     header .logo a{
          padding: 10px 20px;
     }
     header .logo img{
          height: 100%;
     }
     header .header-right .language-btn{
          display: none;
     }
}

/*=================================手机或小平板 phone=============================== */
@media screen and (max-width: 767px) {
     .flex-x-phone{
          display: flex;
          flex-direction: column !important;
     }
     .phone-left{
          width: 100% !important;
     }
     .phone-right{
          width: 100% !important;
     }
     .menu_down {
          top: 60px;
     }
     header{
          height: 60px;
     }
     header .logo{
          background: none;
     }
     header .logo a{
          padding: 10px 0;
     }
     .header-right{
          margin: 0 ;
     }
     .header-right .btn+.btn{
          margin-left: 0px;
          margin-right: 10px;
     }
     .header-right .search-btn span{
          margin: 2px 10px 0; 
     }
     .search-box{
          width: 90%;
          left:5%;
     }

     .search-box input::placeholder{
          font-size: 14px;    
     }
     .search .search-close{
          right: 10%;
          top: 10%;
     }
     .common-top .title{
          font-size: 24px;
     }

     .index-banner{
          margin-top: 60px;
     }
     .index-page{
          padding: 30px 0;
     }
     .index-page1 .left h2{
          font-size: 36px;
          margin-bottom: 20px;
     }
     .index-page1 .left h3{
          width: 100%;
          font-size: 24px;
          margin: 20px 0 ;
     }
     .index-page1 .left .editor{
          margin: 20px 0;
     }

     .common-top{
          margin-bottom: 20px;
     }
     .common-top .title{
          flex: 1;
          margin-right: 50px;
     }

     .more{
          height: 40px;
          line-height: 40px;
          padding: 0 20px;
          margin-left: auto;
     }
     

     .index-page2{
          margin-top: 50px;
     }
     .index-page2 .imgs img{
          height: 200px;
     }
     .index-page2 .imgs{
          justify-content: space-between;
     }
     .index-page2 .imgs a:nth-child(6n+1),
     .index-page2 .imgs a:nth-child(6n+2),
     .index-page2 .imgs a:nth-child(6n+3),
     .index-page2 .imgs a:nth-child(6n+4),
     .index-page2 .imgs a:nth-child(6n+5),
     .index-page2 .imgs a:nth-child(6n+6){
          width: 48%;
          margin: 0;
     }
     .index-page3{
          margin-top: 50px;
     }
     .index-page4{
          margin-top: 50px;
     }
     .index-page5{
          margin-top: 50px;
          padding: 40px 30px;
     }
     .index-page5 h2{
          font-size: 36px;
          margin-bottom: 30px;
     }
     .index-page5 ul li .icon{
          font-size: 50px;
     }
     .index-page5 ul li .editor h4{
          margin-bottom: 10px;
     }
     .index-page5 ul{
          gap: 30px;
     }
     .index-page6{
          margin-top: 50px;
     }
     .index-page6 ul{
          grid-template-columns: repeat(2, 1fr);
          gap: 20px;
     }
     .product-page{
          margin-top: 60px;
     }
     .product-page .title{
          padding: 30px 0;
          font-size: 36px;
          width: 60%;
          margin: 0 auto;
     }
     .product-page .nav{
          width: 100%;
          overflow-x: auto;
          overflow-y: hidden;
          justify-content: flex-start;
     }
     .product-page .nav li a{
          /* flex-direction: column; */
     }
     .product-page .nav li a img{
          height: 50px;
     }
     .product-page .nav li a p{
          min-width:150px;
          white-space: nowrap;
          width: auto;
     }
     .product-page .list{
          grid-template-columns: repeat(2, 1fr);
          gap: 20px;
          padding: 40px 0;
     }
     .product-page .list li{
          border-radius: 0;
     }
     .product-page .list li .info{
          position: static;
          opacity: 1;
          background: none;
          color: var(--color);
          padding: 10px 10px 0;
          width: auto;
          height: auto;
     }
     .product-page .list li img{
          border-radius: 10px;
     }
     .product-page .list li .info p{
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden;
     }
     .product-detail-page{
          margin-top: 60px;
     }
     .product-detail-page1 .right .top{
          padding: 30px 0;
     }
     .product-detail-page1 .right .top h3{
          font-size: 30px;
          line-height: 1.2;
          flex: 1;
          margin-right: 30px;
     }
     .product-detail-page1 .right .editor{
          padding: 30px 0 0;
     }
     .common-title{
          height: 60px;
          line-height: 60px;
          padding: 0 15px;
          margin-bottom: 30px;
          font-size: 20px;
     }
     .product-detail-page2{
          padding-bottom: 30px;
     }
     .product-detail-page2 .editor{
          padding: 0;
     }
     .product-detail-page3 ul{
          grid-template-columns: repeat(2, 1fr);
          gap: 20px;
     }
     .product-detail-page3 ul li .info{
          position: static;
          opacity: 1;
          background: none;
          color: var(--color);
          padding: 10px 10px 0;
          width: auto;
          height: auto;
     }
     .product-detail-page3  li{
          border-radius: 0;
     }
       .product-detail-page3  li img{
          border-radius: 10px;
     }
       .product-detail-page3  li .info p{
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden;
     }
     .about-page{
          margin-top: 60px;
          padding: 30px 0;
     }
     .about-page1{
          padding: 30px 15px;
          background-size: cover;
          justify-content: space-between;
          align-items: center;
     }
     .about-page1 h3{
          font-size: 40px;
          text-align: center;
     }
     .about-page1 h5{
          margin: 10px 0 0;
          text-align: center;
     }
     .news-page2{
          padding: 10px 0;
     }
     .news-page2 li{
          padding: 15px 0;
     }
     .news-page2 li a{
          flex-direction: column;
     }
     .news-page2 li .right{
          padding: 20px 0 0 ;
     }
     .news-page2 li .right h3{
          font-size: 20px;
     }
     .news-page2 li .right .editor{
          margin: 20px 0;
     }
     .news-detail-page .info{
          padding: 30px 0;
     }
     .news-detail-page .info .title{
          font-size: 24px;
     }
     .news-detail-page .info .editor{
          padding: 30px 0;
     }

     .about-title{
          padding: 20px 0 20px;
          font-size: 24px;
     }
     .about-page2{
          padding: 10px 0;
     }
     
     .about-page2 .editor{
          padding: 0;
     }
     .about-page2 .editor ul li{
          grid-template-columns: repeat(1, 1fr);
          gap: 20px;
     }
     .about-page3{
          margin-top: 10px;
     }
     .about-page3 .swiper{
          padding: 0;
     }
     .contact-page2{
          padding: 30px 0 0;
     }
     .contact-page2 h4{
          margin-bottom: 30px;
     }
     .contact-page2 .info .left .form{
          row-gap: 20px;
     }

     .contact-page2 .info .left .form .item{
          width: 48%;
     }
     .contact-page2 .info .right{
          margin-top: 50px;
     }
     .contact-page2 .info .left .form button{
          margin:  0 auto;
        font-size: 18px;
        padding: 15px 30px;
     }
     .contact-page2 .info .right .t1{
          text-align: center;
     }
     .contact-page2 .info .right .t2{
          text-align: center;
          margin: 20px 0 30px;
     }
     .contact-page2 .info .right ul{
          gap: 15px;
     }












     footer .top{
          flex-direction: column;
          align-items: center;
          padding: 30px 0;
     }
     footer .top .right{
          justify-content: center;
          padding-top: 30px;
     }
    footer .top .header-right{
     display: none;
    }
    footer .bottom{
     padding: 30px 0;
    }
    footer .bottom .left{
      padding:0 20px 30px;
    }
    footer .bottom .right{
     padding: 30px 0 0;
     border-top: 1px solid rgba(255, 255, 255, 0.3);
     text-align: center;
     display: flex;
     justify-content: space-between;
    }


















     }


























}