/*手机端导航*/
.mobile-header{
  background-color:#fff;
  width: 100%;
  height: 60px;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 999999;
  box-shadow: 0 1px 4px rgba(0,0,0,.15);
}
.mobile-header-space{
	width: 100%;
	height: 60px;
}
.mobile-logo{float: left; margin:14px 15px; display: inline;}
.mobile-logo img{height:30px;width: auto;}
.mobile-header-icon{
  position: relative;
  width: 60px;
  height:60px;
  float: right;
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  -o-transition: background 0.5s;
  transition: background 0.5s;
  background-color: rgba(255,255,255,1);
  cursor: pointer;
}
.mobile-header-icon span{
  position: absolute;
  left: calc((100% - 25px) / 2);
  top: calc((100% - 1px) / 2);
  width: 25px;
  height: 3px;
  background-color:#000;
  border-radius: 3px;
}
.mobile-header-icon span:nth-child(1){
  transform: translateY(-8px) rotate(0deg);
}
.mobile-header-icon span:nth-child(2){
  transform: translateY(0) rotate(0deg);
}
.mobile-header-icon span:nth-child(3){
  transform: translateY(8px) rotate(0deg);
}


.mobile-header-icon-click span:nth-child(1){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: clickfirst;
}       
.mobile-header-icon-click span:nth-child(2){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: clicksecond;
}
.mobile-header-icon-click span:nth-child(3){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: clicksthird;
}
  


@keyframes clickfirst {
0% {
    transform: translateY(8px) rotate(0deg);
    
}

100% {
  transform: translateY(0) rotate(45deg);
}
}   

@keyframes clicksecond {
0% {
    transform: translateY(0) rotate(0deg);
    
}

100% {
  transform: translateX(-999em) rotate(0deg);
}
}  

@keyframes clicksthird{
0% {
    transform: translateY(-8px) rotate(0deg);
}

100% {
  transform: translateY(0) rotate(-45deg);
}
}   

.mobile-header-icon-out span:nth-child(1){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: outfirst;
  }       
.mobile-header-icon-out span:nth-child(2){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: outsecond;
  }
.mobile-header-icon-out span:nth-child(3){
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: outthird;
  }

@keyframes outfirst {
0% {
  transform: translateY(0) rotate(-45deg);
}

100% {
  transform: translateY(-8px) rotate(0deg);
}
}   


@keyframes outsecond {
0% {
  transform: translateY(0) rotate(45deg);
}

100% {
  transform: translateY(0) rotate(0deg);
}
}

@keyframes outthird {
0% {
  transform: translateY(0) rotate(45deg);
}

100% {
  transform: translateY(8px) rotate(0deg);
}
}

.mobile-nav{
  background-color: rgba(10,60,116,0.9);
  width: 100%;
  position: fixed;
  top: 60px;
  left: 0px;
  display: none;
  z-index: 99999;
  bottom: 0px;
  overflow-y: auto;
}

.mobile-nav .lang-box{
  padding: 30px 10% 10px;
  display: flex;
  align-items: center;
  color:#aaa;
  font-size: 14px;
}
.mobile-nav .lang-box img{
  width: auto;
  height: 22px;
  margin-right: 5px;
}

.mobile-nav .lang-box a{
  font-size: 16px;
  line-height: 50px;
  text-decoration: none;
  color: #FFFFFF;
  transition: all 0.5s;
  font-size: 16px;
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: ReturnToNormal;
  margin: 0 15px 0 5px;
  font-weight: bold;
}


.mobile-nav .lang-box a:hover,.mobile-nav .lang-box a.now{
  color: #e60012;
  border-bottom: solid 1px rgba(255,255,255,0.2);
}


.mobile-ul{
  padding-bottom: 80px;
}
.mobile-ul li.m{
  padding: 0 10%;
}
.mobile-ul li{
  padding: 0 0 0 10%;
}
.mobile-ul a{
  display: block;
  line-height: 50px;
  text-decoration: none;
  color: #FFFFFF;
  border-bottom: solid 1px rgba(255,255,255,0.3);
  transition: all 0.5s;
  font-size: 16px;
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-name: ReturnToNormal;
}
.mobile-ul a:hover,.mobile-ul a.curr{
  /*color: #e60012;*/
  border-bottom: solid 1px rgba(255,255,255,0.2);
}

.mobile-ul li.m h3 a{
  font-weight: bold;
}

.mobile-ul .sub-hide{
  display: none;
}
.sub-list{
  padding: 20px 0;
}
.sub-list li a{
  border-bottom: 0;
  font-size: 14px;
  line-height: 40px;
}

@-webkit-keyframes ReturnToNormal {
100% {
  transform: translateX(0%) rotate(0deg);
}


}

@keyframes ReturnToNormal {
100% {
  transform: translateX(0%) rotate(0deg);
}
}

/* 1580px ` */
@media (max-width: 1580px) {  
  .w80{
    width: 1280px;
    padding: 0;
    margin: 0 auto;
  }
  .wmain{
    width: 90%;
  }
}

/* 1440px ~ 1281px */
@media (max-width: 1440px) {  
  .w80{
    width: 1280px;
    padding: 0;
    margin: 0 auto;
  }
  .wmain{
    width: 95%;
  }
  .table-box{
      height: 400px;
  }
  .footer .widget{
    padding-right: 60px;
  }
  .footer .top .right{
    width: 300px;
  }
}

/* 1280px ~ 1025px */
@media (max-width: 1280px) {  
  .w80,.main{
    width: 1180px;
    padding: 0;
    margin: 0 auto;
  }
  .wmain{
    width: 96%;
  }
  .header .menu li a{
      font-size: 16px;
  }
  .footer .widget{
    padding-right: 50px;
  }
  .footer .top .right{
    width: 280px;
  }
}


/* 1024px ~ 992px */
@media (max-width: 1024px) {
  .w70,.w80,.main{
    width: 92%;
    padding: 0;
    margin: 0 auto;
  }
  .header,.header-space{
    padding: 0 4%;
    height: 84px;
  }
  .header.fixed,.header-space.add{
    height: 68px;
  }
  
  .header .logo img{
    height: 50px;
  }
  .header.fixed .logo img{
    height: 40px;
  }
  .header .menu li{
    margin: 0 10px
  }
  .header .menu li a{
    padding: 0 10px;
    font-size: 15px;
  }
  .product-cat,.about-section,.news-section{
    padding: 50px 0 60px;
  }
  .product-cat .left-box .title{
    font-size: 21px;
  }
  .product-cat .left-box .introduce{
    font-size: 15px;
  }
  .product-cat .right-img{
    width: 500px;
  }
  .home-news{
    padding-bottom: 0;
  }
  .home-news li .thumbnail{
    width: 160px;
  }
  .home-news li .info{
    margin-left: 180px;
  }
  .home-news li .more{
    display: none;
  }
  .footer .widget{
    padding-right: 50px;
  }
  .footer .top .left{
    display: none;
  }
  .footer .top .right{
    width: 100%;
  }
  .new-pro-section .main{
    padding: 100px 0;
  }
  .about-section .left-box .title{
    font-size: 32px;
  }
  .section .title,.contact-con h1.title{
    font-size: 32px;
  }
  #newslist li{
    margin-top: 25px;
    padding-bottom: 25px;
  }
  #newslist li a{
    padding: 0 0 0 20px;
  }
  #newslist a img{
    width: 200px;
  }
  #newslist a .infobox span{
    font-size: 20px;
  }
  .links{
    display: none;
  }
  .h5{height:3px;width:100%;clear:both;}
  .h10{height:5px;width:100%;clear:both;}
  .h15{height:8px;width:100%;clear:both;}
  .h20{height:10px;width:100%;clear:both;}
  .h25{height:13px;width:100%;clear:both;}
  .h30{height:15px;width:100%;clear:both;}
  .h40{height:20px;width:100%;clear:both;}
  .h50{height:25px;width:100%;clear:both;}
  .h60{height:30px;width:100%;clear:both;}
  .h70{height:35px;width:100%;clear:both;}
  .h80{height:40px;width:100%;clear:both;}
  .h90{height:45px;width:100%;clear:both;}
  .h100{height:50px;width:100%;clear:both;}

}

/* 991px ~ 321px */
@media (max-width: 991px) {  
  .hide-body{
    width: 100%;
    height: 100vh;
    overflow: hidden;
  }
  .banner{
      overflow-x: hidden;
  }

  .banner .swiper-pagination{
    bottom: 10px !important;
  }
  
  .banner .swiper-pagination-bullet{
    width: 8px;
    height: 8px;
    margin: 0 4px !important;
  }

  .hot-product{
    padding: 30px 0 0;
  }

  h2.title{
    font-size: 24px !important;
    line-height: 48px;
  }
  .section .title{
    font-size: 24px;
    line-height: 48px;
    font-weight: 500;
  }

  .my-tab{
    margin-top: 0;
  }
  .my-tab .layui-tab-title{
      height: 36px;
  }
  .my-tab .layui-tab-title li{
    margin: 0 10px 10px;
    font-size: 15px;
    line-height: 36px;
  }
  .my-tab .layui-tab-title li.layui-this::after{
      top: 36px;
  }
  .hot-swiper-box{
    margin-top: 20px;
    padding:0;
  }
  .hotSwiper .swiper-slide a{
    margin: 0;
  }
  .hotSwiper .swiper-slide .desc{
    height: 26px;
    font-size: 14px;
    margin: 10px 10px 0;
    white-space: nowrap; /* 防止文本换行 */
    overflow: hidden; /* 隐藏超出容器的文本 */
    text-overflow: ellipsis; /* 显示省略号 */
  }
  .hotSwiper .swiper-slide .p-title{
    font-size: 14px;
    margin: 6px 8px 0;
    white-space: nowrap; /* 防止文本换行 */
    overflow: hidden; /* 隐藏超出容器的文本 */
    text-overflow: ellipsis; /* 显示省略号 */
  }
  .hotSwiper .swiper-slide .pic{
      padding:0;
  }
  .hotSwiper{
    padding-bottom: 40px;
    min-height: 200px;
  }
  .hot-swiper-box .swiper-button-prev, .hot-swiper-box .swiper-button-next{
    margin-top: -60px;
  }

  .solution{
    padding-top: 20px;
  }

  .solu-box{
    margin-top: 10px;
  }
  .solu-box ul li{
    width: 50%;
  }
  .solu-box ul li .pic{
      position: relative;
  }
  .solu-box ul li .pic::before {
    content: '';
    position: absolute;
    display: block;
    left:0;
    top:0;
    bottom: 0;
    right: 0;
    background: rgba(0,0,0,0.2);
  }
  .solu-box ul li a.item-text{
      z-index:1;
  }
  .solu-box ul li a.item-text,.solu-box ul li:hover .item-text{
    padding: 20px;
  }

  .solu-box .item-text .title{
    font-size: 16px !important;
    margin: 5px 0;
    white-space: nowrap;
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 使用省略号表示溢出的内容 */
  }
  .solu-box .item-text .icon img{
    width: 45px;
  }
  .solu-box .item-text span.more{
    margin-top: 5px;
  }
  
  .i-about{padding: 30px 0;}
  .i-about .about-box{
    margin-top: 0;
    flex-direction: column;
  }
  .i-about .about-img,.i-about .company-box{
    width: 100%;
    float: none;
  }

  .number-list{
    margin-top: 30px;
  }
  .number-list .item-one{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 20px;
  }
  .number-list .item-one .num-box .icon img{
    width: 34px;
  }
  .number-list .item-one .num-box .number{
    font-size: 32px;
    line-height: 50px;
  }
  .number-list .item-one .num-box .unit{
    font-size: 20px;
    margin-top: 8px;
  }
  .number-list .item-one .desc{
    margin-top: 0;
    font-size: 14px;
  }

  .about-box .about-img{
    margin-top: 10px;
  }

  .i-about .company-box{
    padding: 10px 20px 20px;
  }
  .i-about .company-box .company-name{
    font-size: 28px;
    display: none;
  }
  .i-about .company-box .introduce{
    margin-top: 10px;
    font-size: 14px;
    color:#555;
  }
  .i-about .company-box .introduce p{
    line-height: 1.6;
    font-size: 15px;
  }

  .i-about .company-box .read-more a.more{
    width: 130px;
    height: 32px;
    font-size: 12px;
    font-weight: 400;
  }
  .i-about .company-box .read-more a.more img{
    margin-left: 10px;
  }
  .i-about .company-box .read-more{
    margin-top: 20px;
  }

  /* 内页 */
  .localtion{
    line-height: 40px;
  }
  .sub_banner{
    width: 100%;
  }
  .sub_bar{
    height: auto;
  }

  .sub_bar .w80{
    width: 96%;
  }

  .product .sub-left{
    display: none;
  }

  .product .sub-right{
    margin: 0;
  }


  #newslist a{
    padding: 30px 0;
    position: relative;
  }
  #newslist a img{
    width: 120px;
  }
  #newslist a .infobox{
    width: auto;
    position: absolute;
    right: 140px;
    top:30px;
    left:0;
  }
  #newslist a .infobox span{
    font-size: 16px;
  }
  #newslist a .infobox em{
    font-size: 12px;
  }
  #newslist a .infobox p{
    display: none;
  }

  .ctt_con{
    padding: 30px 0;
    font-size: 14px;
  }
  .ctt_con img{
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 15px auto;
  }
  .ctt_tit{
    font-size: 24px;
  }
  .product-head{
    padding: 10px;
  }
  .product .pro-title{
    font-size: 16px;
    line-height: 1.2;
  }
  .section.product{
    padding: 30px 0 20px;
  }
  .product-box .down-button{
    height: 40px;
    font-size: 14px;
    padding: 0;
  }
  .product-head .down-button .button-one.expand-btn{
    display: none;
  }
  .product-box .down-button img{
    width: 16px;
  }

  .filter-box .filter-item .f-title{
    padding: 0 10px;
    height: 40px;
  }
  .filter-item .f-con{
    padding: 10px;
  }
  .filter-box .filter-item .f-title span{
    font-size: 12px;
  }
  .filter-item .li-item span{
    font-size: 12px;
  }
  .filter-box .total{
    font-size: 12px;
  }
  .filter-item .f-con .clear-box, .filter-item .f-con .reset-box{
    font-size: 12px;
  }
  .filter-item .f-con .clear-box img, .filter-item .f-con .reset-box img{
    width: 13px;
  }
  .filter-item .slide-box .layui-slider-vertical{
    margin-left: 10px;
  }
  .filter-item .slide-box .max-input, .filter-item .slide-box .min-input{
    left: 35px;
  }
  .table-box{
    height: auto !important;
  }
  .filter-box-head,.table-box-body{
    width:1720px;
  }
  .filter-box .filter-item{
    width: 180px;
  }
  
  .table-box .item-td{
    width: 180px;
    padding: 0 10px;
    height: auto;
    min-height: 40px;
  }
  .product-box .l8,.product-box .l8{
    width: 280px;
  }
  
  .table-box .item-td .item-pad{
    font-size: 13px;
  }
  .section-list .bg{
    width: 100%;
    overflow: hidden;
    text-align: center;
  }
  .section-list .bg img{
    min-height: 210px;
    min-width: 100%;
  }
  .section-list .item-text .w70{
    padding: 20px;
  }
  .section-list .item-text .icon img{
    height: 45px;
  }
  .section-list .item-text .icon h3{
    font-size: 24px;
    margin-left: 10px;
  }
  .section-list .item-text .tip{
    display: none;
  }
  .section-list .item-text .more{
    margin-top: 20px;
    width: 160px;
    height: 36px;
  }
  .section-list .item-text .more span{
    margin-right: 12px;
    font-size: 14px;
  }

  .app-menu{
    padding-top: 30px;
    align-items: stretch; 
  }
  .app-menu .item-icon{
    padding: 10px;
    font-size: 14px;
    margin-right: 10px;
  }
  .app-menu .item-icon img{
    height: 18px;
    margin-bottom: 5px;
  }

  .app-detail p{
    margin-top: 10px;
    text-indent:0 !important
  }
  .app-detail img{
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
  }

  .brc-con{
    font-size: 15px;
    line-height: 1.8;
    padding: 30px 0;
    min-height: 300px;
  }
  
  .menu-sevice{
    transform: translateY(0);
  }
  .menu-box{
    margin-top: 20px;
    padding: 30px 0 15px;
    flex-wrap: wrap;
  }
  

  .menu-box li{
    flex: auto;
    width: 33.33%;
    margin-top: 10px;
  }
  .menu-box li .name{
    font-size: 14px;
    padding: 5px 0;
  }

  .down-list{
    padding: 0 20px;
  }
  .apply-box{
    padding-bottom: 30px;
  }
  .apply-box .w70{
    padding: 20px 0;
  }
  .apply-form{
    padding: 0 10px;
  }
  .apply-form .item-one{
    width: 100%;
    padding: 0;
  }
  .apply-form .item-button{
    margin-top: 20px;
  }
  .apply-title{
    font-size: 32px;
  }

  .sub_bar.danye .app-fixed{
    top:60px;
  }
  

  .subMenu{
    width: 100%;
    padding: 0 0 0;
  }

  .subMenu ul{
    flex-wrap: wrap;
    padding: 10px 0 15px;
  }
  .subMenu li a.cur::after,.sub_bar.danye .app-fixed li a.cur::after{
    bottom: 0;
  }

  .subMenu li{
    line-height: 30px;
    margin-top: 10px;
    font-size: 14px;
    padding: 0 15px;
  }
  .subMenu li a{
    padding-bottom: 5px;
  }
  .subMenu li:last-child{
    padding-right: 0;
  }

  .sub_content .section{
    padding: 30px 0;
  }
  .development-box .swiper-container{
    height: 400px;
    padding-bottom: 30px;
  }
  .statistics-box,.sub_content .section.development,.advantages-box,.honor{
    padding: 45px 0 40px !important;
  }
  .development-box{
    margin-top: 20px;
  }
  .date-box .date-con{
    height: 260px;
  }
  .date-box{
    padding: 0 40px;
    box-sizing: border-box;
  }
  .date-box .date-title{
    font-size: 24px;
  }
  .development-box .swiper-slide-active .date-box .date-title{
    font-size: 48px;
  }
  .advantages-box .adv-list{
    padding-top: 20px;
  }
  .advantages-box .adv-list .item-one{
    width: 50%;
  }
  .advantages-box .adv-list .item-one .icon img{
    width: 90px;
    height: 90px;
  }
  .advantages-box .adv-list .item-one .b-title{
    margin-top: 10px;
    font-size: 14px;
    white-space: nowrap; /* 防止文本换行 */
    overflow: hidden; /* 隐藏超出容器的文本 */
    text-overflow: ellipsis; /* 显示省略号 */
  }
  .honor-box{
    padding: 20px 0 70px;
  }
  .danye .localtion{
    display: none;
  }
  .section .sub-desc{
    font-size: 14px;
  }
  .contact-us{
    padding: 0;
    margin: 0 auto;
  }
  .contact-us .contact-text,.contact-form{
    float: none;
    width: 100%;
    height: auto;
    padding:20px 30px;
  }
  .contact-pad{
    padding: 0;
  }

  .item-button{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 10px;
  }


  .backTop{
      width: 48px;
      height: 48px;
  }
  .backTop img{
      width: 20px;
      height: 20px;
  }

  .footer .top{
    padding:30px 0 20px
  }
  .foot-logo img{
    height: 25px;
  }
  .footer .contact-info{
      padding-top:10px;
  }
  .footer .code-list{
    margin-top: 20px;
  }
}

/* 320px ~ 0px */
@media (max-width: 320px) {  
  
}