@media screen and (max-width: 1600px) {
     .w1520 {
          width: 96%;
     }
     .about-page2 .swiper1 .swiper-slide.up{
          transform: translateY(-23px);
     }
     .index-banner .swiper-slide img{
          height: 670px;
     }
     .index-banner .swiper-slide video{
          height: 670px;
     }

}

@media screen and (max-width: 1520px) {
     .index-page .w1400{
          width: 100%;
          max-width: 1520px;
     }
     .about-page .w1400{
          width: 100%;
          max-width: 1520px;
     }
    
     .index-banner .swiper-slide img{
          height: 630px;
     }
     .index-banner .swiper-slide video{
          height: 630px;
     }
     .about-page2 .swiper1{
          max-width: 78%;
     }
     .about-page2 .swiper1 .swiper-slide.up{
          transform: translateY(-20px);
     }
     .common-title{
              margin-left: 0px;
     }
     .index-page1 .l{
          padding-left: 0;
     }
      .w1400{
          width: 96%;
     }
     .product-page .container .dialog .box{
          width: 60%;
     }
}
@media screen and (max-width: 1400px){
     header .w1400{
          gap: 30px;
     }
     header .nav li a{
          padding: 0 25px;
     }
     .index-banner .swiper-slide img{
          height: 580px;
     }
     .index-banner .swiper-slide video{
          height: 580px;
     }
     footer .top .right ul{
          padding:  0 40px;
          gap: 60px;
     }
     .about-page1 .editor{
          height: 320px;
     }
     .about-page4 .l{
          padding: 75px 3%;
     }
     .about-page4 .r{
          padding: 150px 45px 100px;
     }
     .product-page .container .dialog .box{
          width: 70%;
     }
     .contact-page2 ul li{
          gap: 30px;
          padding: 30px;
     }
     .contact-page2 ul li p{
          font-size: 18px;
     }
     
}

/*=================================中小型笔记本或大平板 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 .logo a{
          height: 80px;
     }
     header .w1400 .nav{
          display: none;
     }
     header .right{
          display: flex;
          flex-direction: row;
          align-items: center;
     }
     .header-right{
          margin: 0 30px;
     }
     header .logo img{
          height: 50px;
     }
     header .header-right .language-btn{
          display: none;
     }
     
     .index-page3 .swiper{
          padding: 80px 60px;
     }
     .index-page1 .l ul{
          margin-bottom: 60px;
     }
     .about-page2 .swiper1 .swiper-slide.up {
          transform: translateY(-17px);
      }
     footer .top .right ul {
          padding: 0 30px;
          gap: 60px;
      }
      .news-detail-page .r ul li p{
          font-size: 16px;
      }
      .contact-page1 .r .ewm{
          padding: 0 30px;
      }
      .contact-page2 ul li{
          gap: 20px;
     }
     .index-page1 .l h2{
          font-size: 40px;
     }
}

/*=================================手机或小平板 phone=============================== */
@media screen and (max-width: 767px) {
     .w1520{
          width: 92%;
     }
     .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{
          height: 60px;
     }
     header .header-right{
         margin: 0 15px;
          gap: 10px;
     }
     header .header-right>a:last-child{
          display: none;
     }
     
     .index-banner .swiper-slide img{
          height: 200px;
     }
     .index-banner .swiper-slide video{
          height: 200px;
     }

     .index-banner .swiper-slide .common-btn{
          display: none;
     }


     .common-title span{
          font-size: 24px;
     }
     .common-title img{
          width: 20px;
     }
     .index-page1{
          padding: 30px 0;
     }
     .index-page1 .w1520{
          flex-direction: column;
          gap: 30px;
     }
     .index-page1 .l{
          width: 100%;
     }
     .index-page1 .l h2{
          font-size: 30px;
          margin-top: 15px;
     }
     .index-page1 .l h4{
          font-size: 24px;
     }
     .index-page1 .l .editor{
          margin: 20px 0;
          font-size: 16px;
          line-height: 1.6;
     }
     .index-page1 .l .editor p{
          font-size: 16px;
          line-height: 1.6;
     }
     .index-page1 .l ul{
          flex-wrap: wrap;
          gap: 10px 2%;
          margin-bottom: 20px;
          display: none;
     }
     .index-page1 .l ul li{
          width: 60%;
          margin: 0 auto;
          padding-bottom: 0;
     }
     .index-page1 .l ul li:last-child{
          width: 60%;
     }
     .index-page1 .l ul li .info{
         left: 50%;
         top: 60%;
         right: auto;
         bottom: auto;
         transform: translate(-50%,-50%);
         padding: 0;
         text-align: center;
     }
     .index-page1 .l ul li .info p{
          width: 100%;
          justify-content: center;
          font-size: 20px;
     }
     .index-page1 .l ul li .info b{
          font-size: 30px;
     }
   
     .index-page1 .l ul li .iconfont{
          font-size:30px;
     }
     .index-page1 .l ul li img{
          width: 100%;
     }
     .index-page1 .r{
          width: 80%;
     }
     .common-btn{
          margin:  0 auto;
          height: 40px;
          line-height: 40px;
     }
     .common-btn span.icon {
          width: 24px;
          height: 24px;
     }

     .index-page2{
          padding: 30px 0;
     }
     .index-page2 .nav{
          width: 100%;
          position: static;
          display: grid;
          grid-template-columns: repeat(3,1fr);
          gap: 15px;
          margin-bottom: 30px;
          margin-top: 30px;
     }
     .index-page2 .nav li{
          width: auto;
          padding: 0 10px;
          height: 36px;
          line-height: 36px;
          font-size: 16px;
          text-align: center;
     }
     .index-page2 .swiper-item .info{
          position: static;
          width: 100%;
     }
     .index-page2 .swiper-item .info h3{
          padding: 15px 0;
          font-size: 24px;
     }
     .index-page2 .swiper-item .info .editor{
          font-size: 16px;
          min-height: 0;
     }
     .index-page2 .swiper-item .info .editor p{
          font-size: 16px;
     }
     .index-page2 .swiper-item .swiper{
          width: 100%;
          margin: 20px 0 0;
          padding: 30px 0 100px;
     }
     .index-page2 .swiper-item .swiper .bg{
          bottom: -50px;
     }












     .index-page3{
          padding: 30px 0;
     }
     
     .index-page3 .w1400{
          width: 92%;
     }
     .index-page3 h3{
          font-size: 24px;
     }
     .index-page3 h4{
          font-size: 18px;
     }
     .index-page3 .swiper{
          padding:  0;
         margin: 40px 0;
     }
     .index-page3 .swiper-slide{
          transform: scale(1);
          text-align: center
     }
     .index-page3 .swiper-slide img{
          width: 50%;
     }
     .index-page4{
          padding: 40px 0 0;
     }
     .index-page4 ul{
          grid-template-columns: repeat(1, 1fr);
          padding: 10px 0 0;
          gap: 0;
     }
     .index-page4 ul li{
          padding: 30px 0;
          border-bottom: 1px solid #ccc;
     }
     .index-page4 ul li:last-child{
          border: none;
     }
     .index-page4 ul li h3{
          font-size: 18px;
     }

     .banner2 img{
          height: 200px;
          object-fit: cover;
     }
     .banner2 .info h2{
          font-size: 24px;
          margin-bottom: 10px;
     }
     .banner2 .info .nav{
          height: 45px;
          line-height: 45px;
          overflow-x: auto;
     }
     .banner2 .info .nav li{
          flex: none;
          padding: 0 20px;
     }
     .banner2 .info .nav li a{
          font-size: 14px;
     }
     .about-page2{
          padding: 30px 0 70px;
     }
     .about-page2 h5{
          font-size: 16px;
          margin-top: 10px;
     }
     .about-page2 .swiper1-w{
          height: 160px;
          background: none;
     }
     .about-page2 .swiper1-w::after{
          content: '';
          display: inline-block;
          width: 100%;
          height: 1px;
          background: var(--color);
          position: absolute;
          bottom: 9px;
          left: 0;
     }
     .about-page2 .swiper1{
          max-width: 92%;
          padding: 0;
         
     }
     .about-page2 .swiper1 .swiper-slide{
          width: 33.4%;
          padding:  0 10px;
     }
     .about-page2 .swiper1 .swiper-slide.up{
          transform: none;
     }
     .about-page2 .swiper1 .swiper-slide p{
          font-size: 14px;
     }
     .about-page2 .swiper1 .swiper-slide-thumb-active p{
          font-size: 16px;
     }
     .about-page2 .swiper2{
          width: 92%;
          margin: 30px auto 0;
          padding-top: 0;
     }
     .about-page2 .swiper2 .item{
          line-height: 30px;
     }
     .about-page2 .swiper2 .item .l{
          font-size: 14px;
     }
     .about-page2 .swiper2 .item .r p{
          font-size: 14px;
     }
     .about-page3{
          padding: 30px  0;
     }
     .about-page3 ul{
          grid-template-columns: repeat(1, 1fr);
          margin-top: 20px;
     }
     .about-page3 ul li{
          padding: 20px;
          gap: 10px;
     }
     .about-page3 ul li .iconfont{
          font-size: 36px;
          margin-bottom: 10px;
     }
     .about-page3 ul li .editor{
          min-height: 0;
     }
     .about-page3 ul li h3{
          font-size: 20px;
     }

     .about-page4 .l{
          padding: 30px 3%;
     }
     .about-page4 .nav{
          margin-top: 20px;
          flex-direction: row;
          gap: 10px;
          justify-content: center;
     }
     .about-page4 .nav li{
          width: auto;
          font-size: 16px;
          padding: 0 20px;
          height: 40px;
          line-height: 40px;
     }

     .about-page4 .r{
          padding: 30px 3%;
     }

     .about-page4 .r .swiper img{
          width: 60%;
          height: 200px;
          object-fit: contain;
     }
     .about-page4 .r .swiper .swiper-button-next, .about-page4 .r .swiper .swiper-button-prev{
          top: 100px;
     }
     .about-page4 .r .swiper .editor{
          margin-top: 20px;
     }


     .about-page5{
          padding: 30px 0;
     }
     .about-page5 h5{
          line-height: 1.5;
          margin-top: 20px;
     }    
     .about-page5 ul{
          grid-template-columns: repeat(3, 1fr);
          margin: 30px 0 10px;
     }
     .about-page5 ul li{
          padding: 15px;
     }

     .banner2.banner-flex  .info .nav li{
          flex: 1;
     }
     .product-page .nav{
          /* width: 100%; */
          overflow-x: auto;
          padding: 20px 0;
          gap: 10px;
     }
     .product-page .nav li a{
          height: 40px;
          line-height: 40px;
          padding: 0 20px;
     }
     .product-page .container ul{
          grid-template-columns: repeat(2, 1fr);
          gap: 10px;
     }
     .product-page .container ul li{
          padding: 20px  20px 20px ;
     }
     .product-page .container ul li .info{
          display: none;
     }
     .product-page .container .dialog .box{
          width: 100%;
          padding: 30px 50px;
          height: 50%;
     }
     .product-page .container .swiper-slide{
        
     }
     .product-page .container .dialog .box .close .iconfont{
          font-size: 30px;
     }
     .product-page .container .swiper-button-next:after, 
     .product-page .container .swiper-button-prev:after{
          font-size: 30px;
     }
     .product-page .container .dialog .box .close{
          right: 35px;
     }
 
     .news-page .list li a{
          flex-direction: column;
          gap: 10px;
     }
     .news-detail-page .l{
          padding: 30px 0 0 ;
     }
     .news-detail-page .l .info{
          padding-right: 0;
          padding-bottom: 30px;
     }
     .news-detail-page .l .info h5{
          font-size: 14px;
     }
     .news-detail-page .l .info h3{
          font-size: 20px;
          font-weight: bold;
          line-height: 1.6;
          margin-top: 10px;
     }
     .news-detail-page .l .info .editor{
          margin-top: 10px;
          line-height: 2;
     }
     .news-detail-page .l .info .editor p{
          line-height: 2;
     }
     .news-detail-page .l .bottom .links {
          gap: 10px;
     }
     .news-detail-page .l .bottom .back{
         margin: 0 0 0  20px;
         height: 40px;
         line-height: 40px;
         padding: 0 30px;
     }
     .news-detail-page .l .bottom .links p{
          font-size: 14px;
     }
     .news-detail-page .r{
          width: 100%;
          padding: 20px 0 ;
          border-left: 0px;
          border-top: 1px solid #eee;
     }
     .news-detail-page .r ul li a{
          padding: 10px 0;
     }
     .contact-page1{
          padding: 30px 0;
     }
     .contact-page1 .l h3{
          font-size: 24px;
          font-weight: bold;
          margin-bottom: 20px;
     }
     .contact-page1 .l .editor p{
          align-items: flex-start;
          font-size: 18px;
          padding: 10px 0;
     }
     .contact-page1 .l .editor p .iconfont{
          font-size: 20px;
     }
     .contact-page1 .r{
          justify-content: center;
          margin-top: 20px;
     }
     .contact-page1 .r .ewm img{
          width: 100px;
          height: 100px;
     }


     .contact-page2{
          padding: 30px 0;
     }
     .contact-page2 ul{
          grid-template-columns: repeat(1, 1fr);
     }
     .contact-page2 ul li{
          padding: 20px;
     }













     footer{
          padding: 0;
     }
     footer .top{
          padding: 30px 0 10px;
     }
     footer .top .flogo img{
          height: 40px;
          width: auto;
     }
     footer .top .left{
          gap: 50px;
     }
     footer .top .left .editor p .iconfont{
          padding-left: 0;
     }
     footer .top .right{
          display: none;
     }
     footer .bottom{
          padding:  20px 0;
     }
     footer .bottom p{
          font-size: 12px;
          margin-right: 20px;
     }
     }


























}