#banner{position:relative;height:100vh;background-size:cover;background-image:url(https://okki-shop.oss-cn-hangzhou.aliyuncs.com/category/85174/883/c50ed589f8fa80e25319f26c66eb3deb/banner.jpg);background-repeat:no-repeat;background-position:center;}
#banner .box{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;justify-content:center;flex-direction:column;padding-top:100px;text-align:center;}


#banner h3{display:inline-block;font-size:24px;color:#fff;font-weight:500;display:flex;align-items:center;justify-content:center;}
#banner h3::before, #banner h3::after{content:'';width:100px;height:1px;background:#fff;display:block;}
#banner h3::before{margin-right:30px;}
#banner h3::after{margin-left:30px;}

#banner .tit{margin-top:30px;display:flex;align-items:center;justify-content:center;}
#banner .tit h5{font-weight:700;font-size: 50px;color:#00A0E9;line-height:61px;margin-right:10px;text-transform:uppercase;}
#banner .tit .t{height:63px;}
#banner .tit .swiper{height:100%;}
#banner .tit .swiper-slide h5{font-weight:700;font-size:70px;color:#fff;text-transform:uppercase;}


#banner .txt{margin:30px auto 0;max-width:80%;line-height:2;color:#fff;font-size:18px;}
#banner .txt p{line-height:inherit;}


#banner ul{margin:45px 0 0;display:flex;justify-content:center;}
#banner ul li{display:inline-block;padding:0 20px;/*min-width:150px;*/}
#banner ul li p{margin:10px 0 0;font-size: 14px;color:#fff;text-transform:uppercase;}
#banner ul li img{
  height: 50px;
}
#banner .more{margin:45px 0 0;}
#banner .more a{position:relative;display:inline-block;font-size:15px;height:60px;line-height:60px;text-transform:uppercase;white-space:nowrap;color:#fff;font-weight:600;padding:0 30px;background:#00A0E9;transition:background .2s ease;}
#banner .more a::before{content:'';position:absolute;bottom:0;left:30px;right:30px;height:2px;background:#fff;transition:left .2s ease,right .2s ease;}

#banner .more a:hover{background:#037EB7;}
#banner .more a:hover::before{left:0;right:0;}



@media screen and (max-width:1680px){
#banner .tit h5{font-size:48px;}
#banner .tit .swiper-slide h5{font-size:66px;}

}

@media screen and (max-width:1550px){
#banner .tit h5{font-size:46px;}
#banner .tit .swiper-slide h5{font-size:62px;}
}

@media screen and (max-width:1441px) {
#banner .tit h5{font-size:42px;}
#banner .tit .t{height:60px;}
#banner .tit .swiper-slide h5{font-size:58px;}
#banner .txt{max-width:90%;font-size:17px;}

}

@media screen and (max-width:1367px) {
#banner .tit h5{font-size:40px;}
#banner .tit .swiper-slide h5{font-size:54px;}
}

@media screen and (max-width:1281px){
#banner h3{font-size:22px;}
#banner .tit h5{font-size:36px;}
#banner .tit .swiper-slide h5{font-size:50px;}
#banner .txt{font-size:16px;margin:20px auto 0;line-height:1.8;}

}

@media screen and (max-width:1171px){
#banner .tit h5{font-size:33px;}
#banner .tit .swiper-slide h5{font-size:46px;}

}

@media screen and (max-width:992px){
#banner{height:auto;padding:130px 0 40px;}
#banner .box{position:static;display:block;padding-top:0;}
#banner .tit h5{font-size:30px;}
#banner .tit .swiper-slide h5{font-size:42px;}
#banner .more a{height:50px;line-height:50px;}

}

@media screen and (max-width:768px){
#banner .tit{
  flex-direction: column;
}
    #banner .tit h5 {
        font-size: 20px;
    }
        #banner .tit .swiper-slide h5 {
        font-size: 28px;
    }
        #banner .txt {
        font-size: 12px;
        margin: 0 auto;
        line-height: 22px;
    }
    #banner .more a{
      font-size: 12px;
    }
    #banner ul{
      flex-wrap: wrap;
    }
    #banner ul li{
      padding: 10px;
      width: 50%;
    }
}

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

}

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

}

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

}	

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


}





/*
.qianhe-banner {
  position: relative;
  width: 100%;
  z-index: 2;
  box-sizing: border-box;
      margin-top: 130px;
}

.qianhe-banner .swiper-slide > img {
  height: calc(100vh - 153px);
  width: 100%;
  object-fit: cover;
}

.qianhe-banner-text {
  position: absolute;
  width: 38%;
  left: 13%;
  top: 10%;
  bottom: calc(10% + 90px);
  overflow: hidden;
  text-align: left;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.qianhe-banner-text h3 {
  flex-shrink: 0;
  font-size: 46px;
  color: #212121;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.qianhe-banner-text p {
  margin-top: 30px;
  font-size: 18px;
  color: #212121;
  line-height: 1.8;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 8;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.mouse {
  margin-right: 18px
}

.qianhe-banner-bottomleft {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 29.7%;
  height: 90px;
  padding-left: 13.5%;
  padding-top: 26px;
}

.qianhe-banner-bottomleft::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  height: 2px;
  width: 56px;
  background: var(--color-primary);
}

.qianhe-banner-bottomright {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 70.3%;
  height: 90px;
  padding: 0 20px 0 7%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--color-primary);
}

.qianhe-banner-bottomright::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  height: 2px;
  width: 56px;
  background: white;
}

.qianhe-banner-bottomright h3 {
  width: 100%;
  font-size: 18px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap;
}

.qianhe-banner-bottomright p {
  font-size: 13px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 10px 0 0;
}

.v-txt {
  padding: 10px 0;
  overflow: hidden
}

.mouse {
  float: left;
  -webkit-animation: bounce-down 1s linear infinite;
  animation: bounce-down 1s linear infinite
}

.v-txt p {
  float: left;
  font-size: 16px;
}


.bannerhd {
  position: absolute;
  right: 13.5%;
  bottom: 18px;
  font-size: 0
}

.bannerhd a {
  display: inline-block;
  width: 46px;
  height: 46px
}

.bannerhd a.prev {
  background: rgba(255, 255, 255, 0.5) url('../images/left.png') no-repeat center
}

.bannerhd a.next {
  margin-left: 1px;
  background: rgba(255, 255, 255, 0.5) url('../images/right.png') no-repeat center
}


@media screen and (max-width: 1580px) {
  .qianhe-banner-text {
    width: 48%;
  }

  .qianhe-banner-text h3 {
    font-size: 38px;
    -webkit-line-clamp: 2;
  }

  .qianhe-banner-text p {
    -webkit-line-clamp: 6;
  }

  .qianhe-banner {
    position: relative
  }

  .qianhe-banner-text {
    top: 11%;
  }
}

@media screen and (max-width: 1500px) {
  .qianhe-banner-text p {
    -webkit-line-clamp: 5;
  }
}

@media screen and (max-width: 1400px) {
  .qianhe-banner-text {
    bottom: calc(10% + 76px);
  }

  .qianhe-banner-text p {
    font-size: 16px;
    line-height: 1.6;
  }

  .qianhe-banner-bottomleft {
    width: 38%;
    height: 76px;
    padding-top: 13px;
  }

  .qianhe-banner-bottomright {
    width: 62%;
    height: 76px;
  }

  .qianhe-banner-bottomright h3 {
    font-size: 17px;
  }

  .qianhe-banner-bottomright p {
    margin: 5px 0 0;
  }

  .bannerhd {
    bottom: 14px;
  }
}

@media screen and (max-width: 1300px) {
  .qianhe-banner-text {
    left: 10%;
    width: 52%;
  }

  .qianhe-banner-text h3 {
    font-size: 36px;
  }

  .qianhe-banner-text p {
    margin-top: 20px;
  }
}

@media screen and (max-width: 1200px) {
  .qianhe-banner-text p {
    -webkit-line-clamp: 4;
  }

  .qianhe-banner-text {
    width: 74%
  }

  .qianhe-banner-text p {
    -webkit-line-clamp: 3;
  }

  .qianhe-banner .swiper-slide > img {
    height: auto
  }
}

@media screen and (max-width: 1024px) {
  .qianhe-banner-text p {
    -webkit-line-clamp: 2;
  }
}

@media screen and (max-width: 960px) {
  .qianhe-banner {
    z-index: 0;
    padding-bottom: 60px;
  }

  .qianhe-banner-text {
    width: 88%;
    left: 6%;
    top: 14%;
  }

  .qianhe-banner-text h3 {
    font-size: 24px;
  }

  .qianhe-banner-bottomleft,
  .qianhe-banner-bottomright::after {
    display: none
  }

  .qianhe-banner-bottomright {
    width: 100%;
    background: var(--color-primary);
    padding: 0 6%;
    display: flex;
    display: -webkit-flex;
    align-items: center
  }

  .qianhe-banner-bottomright h3 {
    font-size: 16px;
  }

  .qianhe-banner-bottomright p {
    font-size: 0;
    display: none;
  }
}

@media screen and (max-width: 800px) {
  .qianhe-banner-text p {
    display: none
  }
}

@media screen and (max-width: 480px) {
  .qianhe-banner-text h3 {
    font-size: 18px;
  }

  .qianhe-banner-bottomright {
    height: 40px;
  }

  .qianhe-banner-bottomright h3 {
    font-size: 12px;
  }
}

*/