html{font-size: 100px;}
body{font-size: 12px;font-family: PingFangSC, PingFang SC;}
@font-face {  
  font-family: "BellaGothic";  
  src: url("../../../Public/Hero/cookieM/css/fonts/BellaGothic.ttf");  
}
.banner4{
  height: 8.2rem;
  position: relative;
  background-color: #000;
  color: #fff;
}
.banner4 .title-box{
  position: absolute;
  left: 1.83rem;
  top: 1.26rem;
  width: 5.45rem;
  z-index: 2;
}
.banner4 .title-box .head-title{
  font-size: 0.16rem;
  margin-bottom: 0.2rem;
  opacity: 0.8;
}
.banner4 .title-box .head-title span{
  vertical-align: middle;
  display: inline-block;
}
.banner4 .title-box .head-title img{
  width: 1.24rem;
  height: 0.3rem;
  position: relative;
  top: 0.06rem;
  display: inline-block;
}
.banner4 .title-box .title{
  font-weight: 600;
  font-size: 0.37rem;
  color: #FFFFFF;
  line-height: 0.48rem;
  margin-bottom: 0.23rem;
}
.banner4 .title-box .desc{
  font-size: 0.14rem;
color: #FFFFFF;
line-height: 0.22rem;
padding-bottom: 0.37rem;
border-bottom: 1px solid #fff;
opacity: 0.6;
width: 3.6rem;
}
.banner4 .title-box .d-item{
  padding: 0.18rem 0.06rem;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-size: 0.14rem;
  line-height: 0.22rem;
  width: 3.6rem;
  position: relative;
  cursor: pointer;
}
.banner4 .title-box .d-item .b{
  opacity: 0.4;
  font-weight: 500;
  transition: 0.2s linear;
}
.banner4 .title-box .d-item .text{
  opacity: 0.2;
  transition: 0.2s linear;
}
.banner4 .title-box .active-item{
  border-bottom: 1px solid rgba(255, 255, 255, 1);
}
.banner4 .title-box .active-item .b{
  opacity: 1;
}
.banner4 .title-box .active-item .text{
  opacity: 1;
}
.banner4 .title-box .active-item::before{
  content:"";
  position: absolute;
  width: 0.08rem;
  height: 0.12rem;
  left: -0.22rem;
  top: 50%;
  transform: translateY(-50%);
  background-image: url('https://hsimage.fotile.com/202409201740128717034.png');
  background-position: center;
  background-size: cover;
}
.banner .video{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
  .dialog_search2017{
    box-sizing: content-box !important;
  }
  .dialog_search2017 div{
    box-sizing: content-box !important;
  }
  .dialog2 .video_box{
    background-color: #fff!important;
  }
  .dialog2{
    width: 10.6rem!important;
    height: 6.5rem!important;
    left: 50%!important;
    top: 45%!important;
    margin-top: -2.9rem;
    margin-left: -5.3rem;
    border-radius:0.1rem!important;
  }
  .dialog2 h2{
    font-weight: 600;
    text-align: center;
    font-size:0.37rem;
    color: #1A1A1A;
    line-height:0.48rem;
    text-align: left;
  }
  .dialog2 p{
    color: #666;
    line-height: 0.22rem;
    font-size: 0.14rem;
    margin-top: 0.2rem;
  }
  .dialog2 .video_box>div{
   padding: 0.53rem 0.2rem 0.97rem 0.2rem
  }
  .dialog2 .video_box img{
   margin-left: 0.7rem;
  }
  .dialog2 h3{
    font-size: 0.14rem;
    line-height: 0.22rem;
    color: #000;
    font-weight: 600;
    margin-top: 0.3rem;
  }
  .dialog2 .bigImg1{
    width: 3.08rem;
  }
  .dialog2 .bigImg{
    width: 2.15rem;
  }
  .dialog2 .right, .dialog2 .wrong{
    font-weight: 600;
    font-size: 14px;
    display: flex;
    border-radius:0.13rem;
    color:#fff;
    padding: 0 10px;
    line-height:0.2rem
  }
  .dialog2 .right{
    background: #91191E;
  }
  .dialog2 .wrong{
    background: #A9A9A9;
  }
  .dialog2 .right img,  .dialog2 .wrong img{
    width: 0.16rem;
  }
  .dialog2 .close{
    background: url('https://hsimage.fotile.com/202407212211391125562.png')!important;
    background-size: cover!important;
    width: 0.35rem!important;
    height: 0.35rem!important;
  }
  .dialog2 .center-flex{
    margin-top: 0.1rem;
    margin-bottom: 0.38rem;
  }
  .dialog2 .center-flex>div:first-child{
    margin-right: 0.1rem;
  }
  .dishWashing_top_left{
    flex-shrink: 0;
  }
  /* .video_box>div{margin-right: 0.6rem;margin-top: 0.8rem;} */
  .dishWashing_top_right div{
    position: relative;
    margin-left: 27px;
    flex-shrink: 0;
      cursor: pointer;
  }
  .dishWashing_top_right .active::after{
    content:"";
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #1A1A1A;
    width: 100%;
    height: 2px;
  }
  .banner14 {
    padding: 120px 0 0 0;
    color: #000;
  }
  .banner14 .t {
    font-size: 31px;
    line-height: 44px;
    text-align: center;
    margin-bottom: 60px;
  }
  .banner14 .swiper-slide {
    text-align: center;
    position: relative;
    color: #fff;
    height: calc(100vh - 120px);
  }
  .banner14 .swiper-slide .img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .banner14 .tt {
    position: absolute;
    right: 218px;
    top: 255px;
  }
  .banner14 .t1 {
    color: rgba(255, 255, 255, 0.5);
    line-height: 16px;
    font-size: 14px;
    margin-bottom: 15px;
  }
  .banner14 .t2 {
    font-size: 26px;
    margin-bottom: 25px;
    color: #fff;
  }
  .banner14 .btn {
    padding: 13px 20px;
    font-size: 12px;
    line-height: 14px;
    font-weight: 600;
    cursor: pointer;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.3);
  }
  .banner14 .btns {
    justify-content: center;
  }
  .banner14 .btn:nth-child(1) {
    margin-right: 15px;
  }
  .banner {
    position: relative;
    /* position: fixed; */
    /* top: 100px; */
    height: calc(100vh - 100px);
    /* overflow: hidden; */
  }
  .banner .img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .banner .tip-icon{
    position: absolute;
    bottom: 0.13rem;
    left: 50%;
    transform: translateX(-50%);
    width: 13px;
    height: 13px;
    z-index: 2;
  }
  .banner .tip{
    line-height: 17px;
    font-size:0.08rem;
    position: absolute;
    left: 44px;
    bottom: 24px;
    left: 120px;
    right: 120px;
    color: rgba(255, 255, 255, 0.5);
  }
  .section {
    width: 100vw;
    height: 722px;
    color: #fff;
    line-height: 100px;
    text-align: center;
    font-size: 28px;
    position: relative;
  }
  .ps-text{
    height:calc(200vh - 40px);
    padding-top: 100vh;
    box-sizing: border-box;
    transition: all 1s;
    /* background: rgba(0, 0, 0, .7); */
  }
  .section h5{
    height: 200vh;
    position: absolute;
    z-index: 9;
  }
  .ps-img {
    /* background-attachment: fixed; */
    background-size: cover;
    background-position: center center;
    height: calc(100vh - 100px);
  }
  .ps-img1 {
    background-image: url('https://hsimage.fotile.com/202409251704235312775.png')
   }
  .ps-img2 {
    background-image: url('https://hsimage.fotile.com/202503251521443033010.jpg')
  } 
.takeover{
  display: none;
  height: 10px;
}
  .img {
    display: block;
    width: 100%;
  }
  .white {
    color: #fff !important;
  }
  .shop-info {
    position: absolute;
    /* right: 15.486%; */
    right: 1.58rem;
    width: 6rem;
    bottom: 3.2rem;
    text-align: center;
    color: #fff;
  }
  /* shop */
  .banner2-s {
    padding: 30px 0 60px 0;
    position: relative;
    background-color: #fff;
    /* margin-top: 100vh; */
  }
  .banner2-s .tip{
    font-size: 8px;
    color: #000000;
    line-height: 14px;
    text-align: left;
    opacity: 0.7;
    margin-top: -20px;
  }
  .banner2-s .l-swiper{
    width: 682px;
    height: 524px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .banner2-s .swiper-container {
    width: 100%;
    height: 380px;
  }
  .banner2-s .swiper-container img {
    width: 380px;
    height: 380px;
  }
  .banner2-s .left-icon{
     font-size: 14px;
     position: absolute;
     left: 30px;
     top: 50%;
      transform: translateY(-50%);
  }
  .banner2-s .swiper-slide{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .banner2-s .right-icon{
    font-size: 14px;
     position: absolute;
     right: 30px;
     top: 50%;
    transform: translateY(-50%);
  }
  .banner2-s .currents{
    width: 572px;
    height: 3px;
    background-color: #DFDFDF;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 30px;
    display: flex;
    align-items: center;
  }
  .banner2-s .current{
    width: 20%;
    height: 3px;
  }
  .banner2-s .active-current{
    background-color: #9C1D22;
  }
  .banner2-s .s-info {
    padding: 30px 40px 0 40px;
    color: #000;
    width: 477px;
  }
  .banner2-s .s-info .t {
    color: #1a1a1a;
    font-size: 12px;
    line-height: 17px;
    margin-bottom: 8px;
  }
  .banner2-s .s-info .t1 {
    font-size: 26px;
    line-height: 36px;
    margin-bottom: 8px;
  }
  .ml-25{margin-left: 25px;}
  .banner2-s .s-info .tags {
    margin-bottom: 30px;
    flex-wrap: wrap;
  }
  .banner2-s .s-info .tag {
    padding: 2px 5px;
    border-radius: 2px;
    border: 1px solid #c1c1c1;
    text-align: center;
    line-height: 17px;
    margin-right: 6px;
    font-size: 12px;
    flex-shrink: 0;
    margin-bottom: 6px;
  }
  .banner2-s .s-info .msg-item {
    padding-bottom: 7px;
    margin-bottom: 12px;
    border-bottom: 1px solid #c1c1c1;
    font-size: 12px;
    line-height: 17px;
    justify-content: space-between;
    cursor: pointer;
  }
  .banner2-s .s-info .msg-item .icon {
    width: 5px;
    height: 8px;
  }
  .banner2-s .s-info .msg-item .icon1 {
    width: 8px;
    height: 2px;
  }
  .banner2-s .s-info .msg-item:nth-last-child(1) {
    /* margin-bottom: 13px; */
    border: none;
  }
  .banner2-s .s-info .store {
    /* justify-content: space-between; */
    margin-bottom: 160px;
    cursor: pointer;
  }
  .banner2-s .s-info .store .icon {
    margin-bottom: 5px;
    color: #BCBCBC;
    width: 24px;
    height: 24px;
  }
  .banner2-s .s-info .store .s {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 122px;
    height: 60px;
    background: #f5f5f5;
    font-size: 12px;
    line-height: 17px;
    margin-right: 3px;
  }
  .banner2-s .s-info .submit-btn {
    height: 40px;
    background: #9c1d22;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
  }
  @keyframes slide-up-in {
    0% {
      opacity: 0;
      transform: translate(0, -35px);
    }
  
    100%  {
      opacity: 1;
      transform: translate(0, 0);
    }
  }
  /* shop end */
  .shop-info .title {
    font-size: 18px;
    margin-bottom: 17px;
    opacity: 0;
    animation: slide-up-in 1.5s ease-in-out forwards;
  }
  .shop-info .name {
    font-size: 0.42rem;
    opacity: 0;
    line-height: 0.48rem;
    font-weight: bold;
    margin-bottom: 0.11rem;
    animation: slide-up-in 1.5s ease-in-out 0.5s forwards;
  }
  .shop-info .desc {
    font-size: 0.18rem;
    opacity: 0;
    line-height: 0.2rem;
    margin-bottom: 15px;
    animation: slide-up-in 1.5s ease-in-out 1s forwards;
  }
  .shop-info .action-btn {
    opacity: 0;
    animation: slide-up-in 1.5s ease-in-out 1.5s forwards;
  }
  .shop-info .btn {
    width: 100px;
    height: 40px;
    background: rgba(216, 216, 216, 0);
    border: 1px solid rgba(255, 255, 255, 0.5);
    line-height: 40px;
    font-size: 12px;
    cursor: pointer;
  }
  .shop-info .left {
    margin-right: 20px;
  }
  .banner1 {
    background: #000;
    color: #fff;
    position: relative;
  }
  .banner1 .desc {
    font-size: 0.14rem;
    line-height: 0.22rem;
    color: #fff;
    opacity: 0.7;
    width: 6.4rem;
    text-align: center;
    margin-left: 4rem;
  }
  .banner1 .big{
    font-weight: 600;
    font-size: 0.31rem;
    line-height: 0.44rem;
    text-align: center;
    padding-top: 1rem;
    color: #F5F5F5;
    margin-bottom: 0.2rem;
  }
  .banner1 .intro {
    height: 460px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    padding-top: 115px;
    text-align: center;
    width: 100%;
    height: 100%;
  }
  .banner1 video {
    width: 100%;
    height: 100%;
    display: block;
    object-position: center;
    object-fit: cover;
  }
  .banner1 .text {
    font-size:0.08rem;
    color: #A9A9A9;
    text-align: left;
    position: absolute;
    left: 1.63rem;
    bottom: 0.3rem
  }
  .banner1 .text7{
    position: absolute;
    width: 70%;
    left: 15%;
    bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.12rem;
    color: #FFFFFF;
    line-height: 0.18rem;
  }
  .lineTip{
    position: absolute;
    left: 2rem;
    top:4.5rem;
    font-size: 0.14rem;
    color: #C1C1C1;
    line-height: 0.32rem;
  }
  .lineTip li{
    margin-bottom: 0.5rem;
  }
  .lineTip h3{
    font-size: 0.36rem;
    font-family: BellaGothicBold;
  }
  .lineTip span{
    font-size: 0.14rem;
  }
  .lineTip-text{
    width: 241px;
    height: 56px;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 9px;
    color: #666666;
    line-height: 13px;
    text-align: left;
    font-style: normal;
  }
  .banner2 {
    background-color: #FFF!important;
    color: #fff;
    left: 54%;
    margin-top: -3px;
  }
  .banner2 .warning{
    color: #1A1A1A;
    width: 50%;
    bottom: 0.15rem;
    left: 2.1rem;
    margin-left: 0;
  }
  .banner2 video{
    object-fit: contain;
    width: 100%;
    height: 100%;
    margin-top: -1px;
  }
  .banner2 .top {
    position: relative;
  }
  .banner2 .top .text {
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
  }
  .banner2 .top .txt{
    position: absolute;
    text-align: center;
    width: 4rem;
    left: 50%;
    margin-left: -2rem;
    bottom: 1.5rem;
    color: #000000;
  }
  .banner2 .top .txt p{ font-size: 0.16rem }
  .banner2 .top .txt h3{ font-size: 0.28rem;font-weight: 600;line-height:0.6rem;}
  .banner2 .top .txt h5{ font-size: 0.16rem }
  .banner2 .imgBox{
    position: absolute;
    bottom: 130px;
    width: 70%;
    left: 15%;
    display: flex;
    justify-content: space-around;
  }
  .banner2 .imgBox li:first-child{margin-right: 30px;background: url(https://hsimage.fotile.com/202403111341325388521.png) no-repeat; background-size: cover;}
  .banner2 .imgBox li:last-child{margin-right: 30px;background: url(https://hsimage.fotile.com/202403111341325169408.png) no-repeat; background-size: cover;}
  .banner2 .imgBox li{width: 50%;background-color: pink;height:5.2rem;font-weight: 600;font-size: 0.21rem;}
  .banner2 .imgBox li{position: relative;border-radius: 0.06rem;}
  .banner2 .imgBox li h4,  .banner2 .imgBox li h5{
    position: absolute;
    left: 0.5rem;
    bottom:0.8rem;
  }
  .banner2 .imgBox li h4{bottom: 0.5rem;}
  .banner2 .top .title {
    font-size: 31px;
    line-height: 50px;
    position: absolute;
    top: 3.75%;
    left: 50%;
    width: 100%;
    text-align: center;
    width:4.88rem;
    margin-left:-2.44rem
  }
  .banner2 .top .title1 {
    font-size: 26px;
    line-height: 38px;
    position: absolute;
    bottom: 7%;
    left: 0;
    width: 100%;
    text-align: center;
  }
  .banner2 .top .desc {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
    width: 100%;
    text-align: center;
  }
  .banner2 .list {
    position:absolute;
    top: 2.8rem;
    left: 50%;
    margin-left:-3.09rem;
  }
  .banner2 .btns{
    cursor: pointer;
    z-index: 9;
    position: absolute;
    bottom: 1.72rem;
    left: 50%;
    margin-left: -0.7rem;
    width: 1.48rem;
    height: 0.6rem;
    line-height: 0.6rem;
    background: rgba(255,255,255,0.6);
    border-radius: 0.3rem;
    backdrop-filter: blur(10px);
    font-size: 0.12rem;
    color: #1A1A1A;
    text-align: center;
    font-weight: 600;
  }
  .banner2 .btns img{
    width: 0.33rem;
    margin-left: 0.2rem;
  }
  .banner2 .item {
    width: 1.66rem;
    height: 1.18rem;
    background: rgba(255,255,255,0.5);
    border-radius: 0.1rem;
    backdrop-filter: blur(10px);
    color: #000;
    padding-top: 0.20rem;
    margin-right: 0.6rem;
  }
  .banner2 .t {
    padding-left: 0.26rem;
    font-size: 0.14rem;
    font-weight: bold;
  }
  .banner2 .it-img {
    height: 162px;
    width: 262px;
  }
  .banner2 .swiper-container2{
    height: 162px;
    width: 262px;
  }
  .banner2 .swiper-slide{
    background-position: center;
    background-size: cover;
    text-align: center;
    padding-top: 139px;
    color: #d8d8d8;
    font-size: 15px;
    line-height: 18px;
  }
  .banner2 .swiper-slide .bottom{
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 35px;
    line-height: 35px;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 100%);
  }
  .banner2 .item .desc {
    padding: 0 0.26rem;
    color: #666;
    line-height: 0.17rem;
    font-size: 0.12rem;
    font-weight: 400;
    text-align: left;
    margin-top: 0.10rem;
  }
  .banner2 .item:nth-last-child(1) {
    margin-right: 0;
  }
  /* banner3 */
  .banner3 {
    background: #1A1A1A;
    color: #fff;
    padding-bottom: 120px;
    padding-top: 105px;
  }
  .banner3 .title {
    height: 228px;
    line-height: 228px;
    text-align: center;
    font-size: 37px;
    font-weight: bold;
  }
  .banner3 .bottom {
    width: 1320px;
    height: 720px;
    margin: 120px auto 0;
    position: relative;
  }
  .banner3 .b-img {
    width: 100%;
    height: 100%;
    transition: 0.2s linear;
  }
  .banner3 .text {
    position: absolute;
    top: 111px;
    left: 89px;
    z-index: 2;
  }
  .banner3 .t {
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.4);
  }
  .banner3 .t1 {
    font-size: 26px;
    font-weight: bold;
    color: #fff;
    line-height: 38px;
    margin-bottom: 40px;
  }
  .banner3 .action-item{
    margin-bottom: 40px;
  }
  .banner3 .desc{
    font-size: 14px;
    line-height: 24px;
    color: rgba(255, 255, 255, 0.4);
    width: 248px;
  }
  .banner3 .icon{
    width: 48px;
    height: 48px;
    margin-right: 22px;
    opacity: 0.8;
    transition: 0.2s linear;
    cursor: pointer;
  }
  .banner3 .active-icon{
    width: 48px;
    height: 48px;
    margin-right: 22px;
    opacity: 1;
  }
  .banner3 .btns{
    visibility: hidden;
    opacity: 0;
    transition: 0.2s linear;
  }
  .banner3 .show-btns{
    visibility: visible;
    opacity: 1;
  }
  .banner3 .btn{
    width: 80px;
    height: 80px;
    margin-right: 20px;
    opacity: 0.8;
    transition: 0.2s linear;
    cursor: pointer;
  }
  .banner3 .active-btn{
    opacity: 1;
  }
  .banner3 .swiper-box{
    height: 720px;
    margin: 120px auto 0;
    position: relative;
  }
  .banner3 .swiper-container{
     width: 100%;
     height: 100%;
  }
  .banner3 .swiper-slide{
    background-position: center;
    background-size: cover;
  }
  .banner5 {
    background-color: #1a1a1a;
    color: #fff;
    position: relative;
  }
  /* .banner5-1{
    height: 6rem;
  } */
  .banner5 .b1 {
    position: relative;
  }
  .heading{
    position: absolute;
    color: #fff;
    margin: 0 auto;
    z-index: 9;
    width: 3.32rem;
    height: 0.96rem;
    left:3.01rem;
    margin-left: -1.64rem;
    top: 2.6rem;
    h3{
      font-size: 0.2rem;
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;  
      line-height: 0.28rem;
    }
    h5{
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;
      font-size: 0.14rem;
      color: #FFFFFF;
      line-height: 0.21rem;
      text-align: center;
      margin-top: 0.17rem;
      text-align: left;
      opacity: 0.7;
    }
  }
  .banner5 .b1 .text {
    position: absolute;
    width: 6.18rem;
    left: 0.9rem;
    top: 1.30rem;
    left:50%;
    margin-left: -3.09rem;
    z-index: 2;
  }
  .banner5 .t {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 10px;
  }
  .banner5 .title {
    font-size: 26px;
    line-height: 38px;
    margin-bottom: 60px;
    width: 201px;
  }
  .banner5 .item {
    margin-bottom: 60px;
  }
  .banner5 .item .icon {
    width: 48px;
    height: 48px;
    margin-bottom: 20px;
  }
  .banner5 .item .desc {
    width: 258px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
    line-height: 24px;
  }
  .banner5 .b2 {
    width: 79.16%;
    margin: 0 auto 180px;
    position: relative;
    justify-content: space-between;
  }
  .banner5 .b2 .text {
    margin-top: 90px;
  }
  .banner5 .b2 .title {
    width: 100%;
    margin-bottom: 8px;
  }
  .banner5 .b2 .size {
    font-size: 14px;
    line-height: 16px;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 62px;
  }
  .banner5 .b2 .img {
    width: 749px;
    height: 820px;
  }
  .banner5 .b3 {
    position: relative;
    width: 1090px;
    height: 820px;
    justify-content: space-between;
    margin: 0 auto 180px;
  }
  .banner5 .b3 .l {
    background-image: url("https://hsimage.fotile.com/202310081121595581535.png");
    width: 780px;
    height: 100%;
    padding: 634px 0 0 36px;
    background-position: center;
    background-size: cover;
  }
  .banner5 .b3 .l .icon {
    width: 68px;
    height: 131px;
    margin-bottom: 8px;
  }
  .banner5 .b3 .l .desc {
    width: 101px;
    font-size: 12px;
    line-height: 16px;
    color: rgba(255, 255, 255, 0.6);
  }
  .banner5 .b3 .r .title {
    width: 100%;
  }
  .banner5 .b3 .r .desc {
    width: 186px;
  }
  .banner5 .tips {
    text-align: center;
    color: #f5f5f5;
    font-size: 18px;
    line-height: 29px;
  }
  .banner5 .pic{
    position: absolute;
    top: 6rem;
    width: 80%;
    margin-left: 10%;
  }
  .banner5 .pic>div{
    position: relative;
  }
  .banner5 .pic>div p{
    position: absolute;
    font-weight: 600;
    font-size: 0.14rem; 
    width: 1.58rem;  
    left: 50%;
    margin-left: -0.79rem;
    bottom: 0.3rem;
  }
  .banner5 .pic img{
    width: 2.60rem;
    margin-right: 0.6rem;
  }
  .banner5 .pic div:first-child{margin-top: 130px;}
  .banner5 .pic div:last-child{margin-top: 60px;}
  .banner5 .subTitle{
    position: absolute;
    top: 10.7rem;
    width: 4.4rem;
    left: 50%;
    margin-left: -2.20rem;
  }
  .banner5 .warning{
    color: #1A1A1A;
    width: 50%;
  }
  .banner5_1{
    display: flex;
    margin: 0 auto;
    /* height: 1232px; */
    margin: 0 auto;
    width: 10.9rem;
    padding-top: 1.3rem;
    padding-bottom: 0.67rem;
    bottom: 0.67rem;
    justify-content: space-between;
    .redfont{
      color: #91191E;
    }
    h6{font-size: 0.12rem;margin-top: 0.84rem;}
    h1{
      font-family: BellaGothic, BellaGothic;
      font-weight: bold;
      font-size:0.8rem;
    }
    span{
      font-size: 0.21rem;
    }
  }
  .banner5_1 .txt{
    padding-top: 130px;
    overflow: visible;
    position: relative;
  }
  .banner5_1 .stickybox{ height: 3.63rem;position: sticky;top: 2.08rem;}
  .banner5_1 .txt h2,.banner5_2 .txt h2{
    color: #fff;
    text-align: left;
    font-size: 0.34rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    line-height: 0.34rem;
  }
  .banner5_1 .txt p{
    font-weight: 400;
    font-size: 0.12rem;
    color: #000000;
    line-height:0.17rem;
    text-align: left;
    margin-top: 0.17rem;
  }
  .banner5 .bigTitle{
    position: absolute;
    font-weight: 600;
    width: 90%;
    left: 5%;
    font-size: 0.48rem;
    color: #FFFFFF;
    line-height: 0.67rem;
    text-align: center;
    z-index: 8;
    padding-top: 2.3rem;
  }
  .banner5 ul{
    position: absolute;
    z-index: 8;
    display: flex;
    width:5.86rem;
    left: 50%;
    margin-left: -2.9rem;
    justify-content: space-between;
    top: 4rem;
  }
  .banner5 ul li img:nth-child(1){
    width: 1.47rem;
    display: block;
    cursor: pointer;
  }
  .banner5 ul li img:nth-child(2){
    width: 1.47rem;
    display: none;
    cursor: pointer;
  }
  .banner5 ul .on img:nth-child(2){
    display: block;
  }
  .banner5 ul .on img:nth-child(1){
    display: none;
  }
  .banner5_1 #myVideo{
    width: 6.75rem;
  }
  .banner5_1 .txt{
    width: 2.2rem;
  }
  .banner5_2,.banner5_3{
    position: relative;
    background-color: #000;
  }
  .banner5_2 .txt{
    position: absolute;
    left: 3.1rem!important;
    top: 0.1rem;
    color: #fff;
  }
  .banner5_2 .txt p{
    font-size: 0.26rem;
    margin-top: 0.07rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 0.48rem;
  }
  .mt-10 {
    margin-top: 0.1rem;
}
.mt-11 {
  margin-top:0.1rem;
}
  .banner5_2 .txt2{
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: 1rem;
  }
  .banner5_3 .txt2{
    position: absolute;
    left:8.97rem;
    bottom: 2.18rem;
    color: #fff;
  }
  .banner5_3 .txt3 h2{
    font-size:0.34rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    line-height: 0.34rem;
  }
  .banner5_3 .txt3 p{
    font-size: 0.26rem;
    margin-top: 0.07rem;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 0.48rem
  }
  .banner5_3 .txt{
    position: absolute;
    top: 230px;
    font-family: BellaGothic, BellaGothic;
    font-weight: bold;
    font-size: 0.56rem;
    color: #1A1A1A;
    line-height: 0.69rem;
    text-align: left;
    right: 3.38rem;
    top: 3rem;
    z-index: 9;
  }
  .banner5_3 .txt  h3{
    color: #91191E;
  }
  .banner5_3 .txt p{
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size:0.14rem;
    color: #666666;
    line-height: 0.21rem;
    text-align: left;
    margin-top: 0.12rem;
  }
  .banner5_3 .player{
    width: 0.31rem;
    height: 0.31rem;
    display: inline-block;
    cursor: pointer;
  }
  .banner5_3 .tip{
    font-size: 0.08rem;
    color: #000000;
    line-height: 14px;
    position: absolute;
    bottom: 0.5rem;
    left: 1.8rem;
    opacity: 0.7;
  }
  .section_34 {
    position: absolute;
    padding: 176px 282px 88px 320px;
   bottom: 0;
}
  .banner6 {
    position: relative;
    background-color: #fff;
    background-color: #0D0D0D;
    padding: 0 0.8rem 0.8rem 0.8rem;
    text-align: center;
    margin-top: -1px;
    .up{
      width: 2.39rem;
      margin-left: -1.2rem;
      left: 50%;
      top: 0.5rem;
      h6{
        font-weight: 400;
        font-size: 0.12rem;
        color: #A9A9A9;
        line-height: 0.17rem;
        text-align: center;
        margin-top: 0.1rem;
        
      }
    }
    .down{
      width: 3rem;
      height: 0.8rem;
      bottom: 0.5rem;
      display: flex;
      left: 50%;
      margin-left: -1.5rem;
      justify-content: space-between;
      img{width: 0.48rem;height: 0.49rem;object-fit: contain;margin: 0 auto;margin-bottom:0.09rem ;}
      em{
        font-family: PingFangSC, PingFang SC;
        font-weight: 600;
        font-size: 0.14rem;
        color: #F5F5F5;
        line-height: 0.21rem;
      }
     span{display: inline-block;}
    }
    .down2{width: 5rem;margin-left: -2.5rem;}
  }
  .banner6 .title {
    text-align: center;
    font-size: 37px;
    font-weight: bold;
    line-height: 59px;
    color: #fff;
    margin-bottom: 90px;
    padding-top: 1.8rem;
  }
  .banner6 .txt{
    font-weight: 400;
    font-size: 0.18rem;
    color: #FFFFFF;
    line-height: 0.32rem;
    text-align: left;
    width: 3.30rem;
    height: 0.4rem;
    top: 1.29rem;
    left: 1.21rem;
    font-family: PingFangSC, PingFang SC;
  }
  .banner6 .button{
    font-size: 0.12rem;
    line-height: 0.2rem;
    font-weight: 600;
    text-align: left;
    color: #1A1A1A;
    width:1.13rem;
    background: #F5F5F5;
    border-radius: 4px;
    background: #F5F5F5;
    border-radius: 4px;
    height: 0.4rem;
    display: flex;
    align-items: center;
    padding: 0 0.2rem;
    box-sizing: border-box;
    margin-top: 0.36rem;
    cursor: pointer;
  }
  .banner6 .wifi{
    position: absolute;
    right: 0.37rem;
    top: 0.4rem;
    img{
      width: 0.44rem;
      height: 0.31rem;
      margin: 0 auto;
    }
    div{
      font-size: 12px;
      color: #FFFFFF;
      line-height: 17px;
      text-align: center;
      margin-top: 0.11rem;
    }
  }
  .banner6 .button img{
    width: 0.16rem;
    height: 0.16rem;
    margin-left: 0.09rem;
  }
  .banner6 p {
    font-weight: 400;
    font-size: 0.21rem;
  }
  .banner6 h2 {
    font-weight: 600;
    font-size: 0.37rem;
    font-weight: bold;
    font-family: 'BellaGothic';
    margin-top: 20px;
    margin-bottom: 80px;
  }
  .banner5_4 .heading{
    width: 5.86rem;left:50%;margin-left: -2.93rem;
    text-align: center!important;
    top: 1.8rem!important;
  }
  .banner5_4 .bottomTxt{
    position: absolute;
    bottom: 0.9rem;
    display: flex;
    width: 8.52rem;
    left: 50%;
    margin-left: -4.26rem;
    justify-content: space-between;
    img{
      width: 100px;
      margin-top: 34px;
    }
  }
  
  .banner5_4{
    
    position: relative;
    .heading{
      h3{
        font-size: 0.37rem;
        margin-top: 0.07rem;
      }
      h4{font-size: 0.26rem;line-height:0.48rem}
      h5{color: #fff; opacity: 0.7;margin-top: 0.14rem;text-align: center!important;}
    }
    ul{
      /* position: absolute;
      right: 1.05rem;
      top: 3.07rem; */
      width: 4.34rem;
      color: #fff;
      li{
        margin-bottom: 0.3rem;
      }
      .remark{
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 0.09rem;
        color: #666666;
        line-height: 0.13rem;
        margin-top: 0.6rem;
      }
      img{
        width: 0.48rem;
        height: 0.48rem;
        margin-bottom: 10px!important;
        margin: 0 auto;
      }
      p{
        font-size:0.14rem;
        color: #F5F5F5;
        line-height: 0.21rem;
        text-align: center;
      }
    }
    .tip{
      position: absolute;
      font-size: 0.08rem;
      color: #FFFFFF;
      opacity: 0.8;
      line-height: 0.14rem;
      bottom: 0;
      height: 0.28rem;
      left: 0.6rem;
    }
  }

  .banner6 .bigTitle{
    position: absolute;
    color: #fff;
  }
  .banner6 .txt{
    position: absolute;
  }
  .banner5_4, .banner6 ul {
    /* width: 12.55rem; */
    margin: 0 auto;
  }
  .banner6 .bigTitle{
    position: absolute;
  }
  .banner6-1{
    position: relative;
    margin-top: -1px;
  }
  .banner6-1 .bigTitle{
    font-weight: 600;
    font-size: 0.37rem;
    color: #FFFFFF;
    line-height: 0.48rem;
    text-align: center;
    position: absolute;
    width: 100%;
    padding-top: 2.11rem;
  }
  .banner6 ul li{position: relative;}
  .banner6 ul li>div{
    position: absolute;
    font-weight: 600;
    font-size: 0.18rem;  
    color: #FFFFFF;
  }
  .banner6 ul li p{
    position: absolute;
    font-size: 0.08rem;
    color: #FFFFFF;
    line-height:0.14rem;
    text-align: left;
    left: 0.58rem;
    bottom: 0;
    width: 4.98rem;
    opacity: 0.7;
    height: 0.6rem;
  }
  .banner6 ul li:first-child{margin-right:0.3rem;}
  .banner6 ul li h5{
    color: #A9A9A9 ;
    margin-top: 0.14rem;
    font-size:0.12rem;
  }
  .banner6 .b1,
  .banner6 .b2,
  .banner6 .b3,
  .banner6 .b4,
  .banner6 .b5 {
    width: 89%;
    margin: 0 0 120px auto;
    position: relative;
  }
  .banner6 .icon {
    position: absolute;
    top: 36px;
    left: 58px;
    width: 48px;
    height: 48px;
  }
  .banner6 .b1 .text,
  .banner6 .b3 .text,
  .banner6 .b5 .text {
    position: absolute;
    left: 58px;
    top: 153px;
  }
  .banner6 .b2 .text,
  .banner6 .b4 .text {
    position: absolute;
    right: 25px;
    top: 153px;
  }
  .banner6 .tips {
    font-size: 8px;
    line-height: 1;
    position: absolute;
    left: 160px;
    bottom: 23px;
    color: rgba(255, 255, 255, 0.2);
  }
  .banner6 .text .l {
    font-size: 72px;
    line-height: 68px;
    font-weight: 100;
  
  font-family: NotoSansHans-Thin, NotoSansHans;
  }
  .banner6 .text .r {
    margin-left: 30px;
    font-size: 26px;
    line-height: 1;
    width: 453px;
  }
  .banner6 .text .r .s {
    font-size: 14px;
    line-height: 22px;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 19px;
    font-weight: 400;
  }
  .banner6 .b2,
  .banner6 .b4 {
    margin: 0 auto 120px 0;
  }
  .banner6 .b5 {
    margin-bottom: 0;
  }
  .banner7 {
    margin: 0 auto;
    background: #000;
    color: #fff;
    padding: 0 0.8rem;
    padding-bottom: 0.9rem;
  }
  .banner7 .title {
    color: #3b3d40;
    padding: 120px 0 40px 0;
    text-align: center;
    font-size: 0.3rem;
    font-weight: bold;
    line-height: 44px;
    margin-bottom: 40px;
  }.banner7 .swipeBox{
    width: 7.8rem;
  }
  .banner7 .greyBox{
    background-color: #1A1A1A;
    padding: 2.18rem 0.92rem;
  }
  .banner7 p{
    font-size:0.09rem;
    color: #A9A9A9;
    line-height: 0.13rem;
    margin-top: 0.12rem;
  }
  .banner7 .greyBox h3{
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 0.18rem;
    color: #FFFFFF;
    line-height: 0.32rem;
    width: 3rem;
    margin-bottom: 0.6rem;
  }
  .banner7 .flex {
    width: 100%;
    justify-content: space-between;
    display: flex;
    margin-bottom: 0.3rem;
  }
  .banner7 .remark{
    width: 8.55rem;
    height: 2.16rem;
    margin-top: 0.8rem;
    margin-left: 0.6rem;
  }
  .banner7 .remark h6{
    font-size: 0.12rem;
    color: #A9A9A9;
    line-height: 0.18rem;
    margin-top: 0.44rem;
  }
  .banner7 .img1 {
    width: 100%;
    margin-bottom: 40px;
  }
  .banner7 .img2 {
    flex: 1;
    flex-shrink: 0;
    margin-bottom: 40px;
  }
  .banner7 .img4 {
    flex: 1;
    flex-shrink: 0;
    margin-bottom: 40px;
  }
  .banner7 .l{
    margin-right: 42px;
  }
  .banner7 .img5 {
    flex: 1;
    flex-shrink: 0;
  }
  .banner8 {
    padding: 120px 0 70px 0;
  }
  .banner8 .title {
    color: #3B3D40;
    font-size: 0.31rem;
    line-height: 44px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 32px;
  }
  .banner8 .l {
    margin-bottom: 60px;
  }
  .banner8 .i {
    margin-right: 30px;
    text-align: center;
  }
  .banner8 .i:nth-last-child(1) {
    margin-right: 0;
  }
  .banner8 .img {
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 33px;
  }
  .banner8 .t {
    font-size: 0.18rem;
    line-height: 0.21rm;
    font-weight: bold;
    margin-bottom: 8px;
    color: #000000;
  }
  .banner8 .t1 {
    font-size:0.24rem;
    color: #000;
    font-weight: 600;
    line-height: 0.28rem;
  }
  .banner8 .info {
    max-width: 11.40rem;
    margin: 0 auto;
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    padding: 61px 0 43px 0;
    color: #666;
    font-size: 14px;
    line-height: 20px;
  }
  .banner8 .info h3{
    font-weight: 600;
    font-size:0.18rem;
    color: #000000;
    line-height: 0.25rem;
  }
  .banner8 .info h5{
    font-weight: 600;
    font-size: 0.24rem;
    color: #000000;
    margin-bottom: 0.3rem;
    line-height: 0.33rem;
  }
  .banner8 .p1 {
    margin-bottom: 0.1rem;
    width: 240px;
    font-weight: 600;
    font-size: 0.14rem;
    color: #474747;
  }
  .banner8 .p2 {
    margin-bottom: 18px;
    /* width: 240px; */
    margin-bottom: 0.4rem;
    font-weight: 600;
    font-size: 0.18rem;
    color: #000000;
  }
  .banner8 .p3 {
    margin-bottom:0.1rem;
    width: 240px;
    font-weight: 600;
    font-size:0.14rem;
    color: #474747;
  }
  .banner8 .p4 {
    margin-bottom:0.3rem;
    font-weight: 600;
    font-size: 0.18rem;
    color: #000000;
  }
  .banner8 .note{
    font-weight: 400;
    font-size: 0.12rem;
    color: #A9A9A9;
    line-height:0.2rem;
  }
  .banner9 {
    padding: 1.24rem 0 0.94rem 0;
    background: #fafafa;
  }
  .w1005{
    width: 10.05rem;
    margin: 0 auto;
  }
  .banner9 .title {
    font-size: 0.3rem;
    line-height: 44px;
    font-weight: bold;
    color: #3b3d40;
    margin-bottom: 63px;
    text-align: center;
  }
  .banner9 .img {
    margin:0 auto 31px;
  }
  .banner9 .tips {
    width: 69.79%;
    background: #ffffff;
    padding: 30px;
    color: #A9A9A9;
    font-size: 12px;
    line-height: 20px;
    margin: 0 auto;
  }
  .swiper-button-black{
    width: 9px !important;
    height: 14px !important;
    background-position: center !important;
    background-size: cover  !important;
  }
  .patentTip{
    font-size: 14px;
    left: 44px;
    bottom: 15px;
    color: rgba(255, 255, 255);
    background-color: #1a1a1a;
    padding-top: 50px;
    padding-left: 100px;
  }
  .boxwrap{
    position: relative;
    background-color: #1A1A1A;
    height: 7.5rem;
  }
.boxwrap .conbox{
    position: absolute;
    top: 0.97rem;
    height: 3.3rem;
    width: 11.4rem;
    z-index: 11;
    left: 50%;
    margin-left: -5.7rem;
    display: flex;
    flex-wrap: wrap;
}  

.boxwrap  .tip{
  position: absolute;
  bottom: 0.9rem;
  font-family: PingFangSC, PingFang SC;
  font-weight: 600;
  font-weight: 400;
  font-size: 0.09rem;
  color: #666666;
  line-height:0.13rem;
  text-align: center;
  width: 5.5rem;
  left: 1.65rem;
  text-align: left;
}
.boxwrap .pop{
  z-index: 9;
  position: absolute;
  background: rgba(255,255,255,0.3);
  border-radius: 0.1rem;
  backdrop-filter: blur(5px);
  bottom: 1.47rem;
  padding: 0.24rem;
  box-sizing: border-box;
}
.boxwrap .pop h2{
  font-weight: 600;
  font-size: 0.21rem;
  color: #000000;
  line-height: 0.21rem;
  text-align: left;
}
.boxwrap .pop h3{
  font-family: PingFangSC, PingFang SC;
  font-weight: 600;
  font-size: 0.14rem;
  color: #000000;
  line-height: 0.21rem;
  text-align: left;
}
.boxwrap .pop p{
  margin-top: 0.15rem;
  font-weight: 400;
  font-size: 0.1rem;
  color: #666666;
  line-height: 14px;
}
.popball1{
  bottom:2.47rem!important;
  width: 2.65rem;
  height: 1.5rem;
  left: 2.46rem;
}
.popball2{
  top:6.1rem!important;
  width: 3.1rem;
  height: 1.5rem;
  right:1.7rem
}
.popball3{
  width: 2.65rem;
  height: 1.5rem;
  right: 2.57rem
}
.germ{
  width: 59px;
  height: 59px;
  position: absolute;
  bottom: -40px;
  left: 110px;
}
.boxwrap .conbox li{
  background: rgba(9,30,48,0.25);
  border-radius: 6px;
  backdrop-filter: blur(8px);
  width:calc(33% - 30px);
  margin-bottom: 10px;
  color: #fff;
  display: flex;
  justify-content: space-between;
  padding: 0.19rem 0.16rem 0.28rem 0.2rem;
  position: relative;
  height: 4.95rem;
  margin-right: 30px;
}
.boxwrap .conbox li>div{margin-top: 3rem;}
.boxwrap .conbox li h5{
  font-size: 0.21rem;
  font-family: PingFangSC, PingFang SC;
  font-weight: 600;
  color: #E4E4E4;
  line-height: 0.22rem;
}
.boxwrap .conbox li p{font-size: 0.14rem; color: #F5F5F5;;font-weight: 400;margin-top: 0.08rem;}

.boxwrap .conbox li img{
    width:0.48rem;
    height: 0.48rem
}
.boxwrap .conbox li:nth-child(1){
 background: url('https://hsimage.fotile.com/202409251436416654839.png') no-repeat;
 background-size: cover;
}
.boxwrap .conbox li:nth-child(2){
  background: url('https://hsimage.fotile.com/202409032046076229797.png') no-repeat;
  background-size: cover;
 }
 .boxwrap .conbox li:nth-child(3){
  background: url('https://hsimage.fotile.com/202409201619244972376.png') no-repeat;
  background-size: cover;
  margin-right: 0;
 }
 .conbox .tags{
   margin-top: 20px;
   font-size: 0.13rem;
   width: 2.84rem;
 }
 .conbox .tags span{
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  font-size: 0.14rem;
  display: inline-block;
  opacity: 0.5;
  padding: 0.02rem 0.1rem;
  border: 1px solid rgba(193,193,193,0.39);
  border-radius: 2px;
  margin-bottom: 0.1rem;
  line-height: 0.2rem;
 }

.warning{position: absolute;bottom: 0.15rem;width:11.33rem;font-size: 0.08rem;line-height: 0.14rem;opacity:0.7;color: #FFFFFF; left: 50%; margin-left: -5.66rem;}
.zoom {
  text-align: center;
  font-size: 0.14rem;
  margin: 0.6rem;
  color: #000;
}
.banner9 .myul {
  display: flex;
  font-weight: 600;
  font-size:0.14rem;
}
.banner9 .myul li:not(:last-child) {
  margin-right: 0.3rem;
}
.banner9 .myul li {
  width: 3.18rem;
  height: 47px;
  line-height: 47px;
  color: #000;
  border-bottom: 1px solid #000;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.banner9 .myul img {
  width: 0.24rem;
  vertical-align: middle;
  height:  0.24rem;
}
.w980{
  width: 11.4rem;
}
.titles {
  font-size: 0.24rem;
  color: #363636;
  font-weight: 600;
  line-height: 0.33rem;
  text-align: center;
  margin-top: 1.2rem;
  margin-bottom:0.4rem
}
.banner9 .installUl li {
  background: #fff;
  width: 25%;
  height: 1.89rem;
  text-align: center;
  margin-right: 0.1rem;
}
.banner9 .installUl li p{
  line-height: 0.3rem;
}
.banner9 .installUl li>div {
  padding-top: 0.4rem;
  color: #000;
  font-size:0.18rem;
}
.banner9 .installUl li img{
  width: 0.48rem;
  margin: 0 auto;
}
.switchBanner{
  height: 11.77rem;
  background: url('https://hsimage.fotile.com/202403271910293594213.jpg') center center;
  background-size: cover!important;
  color: #fff;
  position: relative;
}
.switchBanner .toptitle{
  text-align: center;
  padding-top: 0.98rem;
}
.switchBanner .toptitle h3{
  font-weight: 600;
  font-size:0.31rem;
}
.switchBanner .toptitle p{
  font-weight: 600;
  font-size: 0.14rem;
  margin-top: 0.1rem;
}
.switchBanner .toptitle .switchTab{
  width: 2.11rem;
  margin: 0 auto;
  margin-top: 0.57rem;
  cursor: pointer;
}
.switchBanner .midTitle{
  text-align: right;
  width: 1.7rem;
  position: absolute;
  left: 50%;
  top:7rem;
  margin-left: -3.5rem;
}
.switchBanner .midTitle p{
  font-weight: 400;
  font-size: 0.12rem;
}
.switchBanner .midTitle h4{
  font-weight: 600;
  font-size: 0.18rem;
  line-height: 0.22rem;
  margin: 0.03rem 0;
}
.switchBanner .pics{
  width: 11.4rem;
  margin: 0 auto;
  position: absolute;
  bottom: 0.3rem;
  display: flex;
  left: 50%;
  margin-left: -5.7rem;
  justify-content: space-between;
  align-items: flex-end
}
.switchBanner .pics li{
  width: 3.6rem;
  height: 2.43rem;
  background-size: cover!important;
  border-radius: 0.06rem;
  text-align: center;
  font-weight: 600;
  font-size: 0.14rem;
  padding-top: 1.95rem;
}
.switchBanner .pics li:first-child{
  background: url('https://hsimage.fotile.com/202403132012230824141.png');
}
.switchBanner .pics li:nth-child(2){
  background: url('https://hsimage.fotile.com/202403132012230608199.png');
}
.switchBanner .pics li:last-child{
  background: url('https://hsimage.fotile.com/202403132012230601784.png');
}
.box8{margin-top:0.39rem;}
.box8>div:first-child {
  margin-right:0.3rem;
  background: url('https://hsimage.fotile.com/202311231821321999568.jpg') center center;
}
.box8>div:last-child {
  background: url('https://hsimage.fotile.com/202311231821322241681.jpg') center center;
}
.box8>div {
  width: 5.55rem;
  height: 2.04rem;
  text-align: center;
  background-size: cover!important;
  color:#fff
}
.box8 h3 {
  font-size: 0.21rem;
  margin-top: 0.66rem;
}
.box8 p {
  font-size: 0.14rem;
  margin-top: 0.12rem;
  margin-bottom: 0.07rem;
}
video{margin-top: -1px;}
video::-webkit-media-controls-fullscreen-button {
  display: none;
}
video::-webkit-media-controls-timeline {
 width: 80%;
 ;
}
video::-webkit-media-controls-mute-button {
    display: none;            
}
/* 剩余时间 */
video::-webkit-media-controls-time-remaining-display {
    display: none;            
}
.scroll-bar{
  position: absolute;
    left: 5.52rem;
    bottom: 0.94rem;
    width: 3.07rem;
    height: 0.46rem;
    background: rgba(0,0,0,0.1);
    border-radius: 0.3rem;
    backdrop-filter: blur(10px);
    padding-left: 0.37rem;
}
.scroll-bar .box{
  position: relative;
}
.scroll-bar .line{
  width: 2.18rem;
  height: 2px;
  background: rgba(102,102,102,0.25);
  border-radius: 0.3rem;
  margin-top:0.22rem;
  position: relative;
}
.scroll-bar .scroll-r{
  width: 0.2rem;
  position: absolute;
  left:0;
  bottom: -0.11rem;
  cursor: grabbing;
}
.scroll-bar .scroll-r .ball{
  width: 0.08rem;
  height: 0.22rem;
  background: #FFFFFF;
  border-radius: 0.24rem;
}
.scroll-bar .player{
  position: absolute;
  right: 0.14rem;
  bottom: 0.1rem;
  width: 0.24rem;
  height: 0.24rem;
  background-size: cover!important;
  cursor: pointer;
}
.scroll-bar .play{
  background: url('https://hsimage.fotile.com/202403191620044988573.png') center center;
}
.scroll-bar .pause{
  background: url('https://hsimage.fotile.com/202403191704437181348.png') center center;
}

.copyWrite{
  width: 100%;
  height: calc(100vh - 100px);
  background-color: #000;
  color: #fff;
  font-size: 20px;
  text-align: center;
  padding: 100px;
  line-height: 58px;

}
.common_sideBar_bottom_box img{
  margin-top: 12px;
  margin: 12px auto;
}
.picBox{
    max-width: 11.40rem;
    margin: 0 auto;
    padding: 61px 0 83px 0;
    color: #666;
    font-size: 14px;
    line-height: 20px;   
}
.swiperBtns{
  position: absolute;
  bottom: 0.9rem;
  width: 0.5rem;
  height: 0.5rem;
  z-index: 9;
  opacity: 0.4;
  cursor: pointer;
}
.prevBtn{
  left: 1.96rem;
}
.nextBtn{
  right: 2rem;
}
.group_23 {
  margin-top: 28px;
}

.self-stretch {
  align-self: stretch;
}
.items-center {
  align-items: center;
}
.group_32 {
  line-height:0.25rem;
  font-weight: unset;
  text-align: left;
  width:2rem;
}
.group_31 {
  line-height: 25px;
  font-weight: unset;
  text-align: left;
}
.group_30 {
  margin-right: 14px;
}
.mt-42 {
  margin-top: 42px;
}
.section_29 {
  padding: 1.16rem 2.18rem 0.9rem;
  background-image: linear-gradient(180deg, #00000000 0%, #00000000 3.01%, #1c1c1c 39.19%, #1c1c1c 100%);
}.mt-357 {
  margin-top: 3.57rem;
}
.pos_5 {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.pos_6 {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.heading .on{
  width: 46px!important;
  height:46px!important;
  border: 4px solid rgba(255,255,255,0.3);
}
.section_22 {
  background-color: #faf3f3;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  cursor: pointer;
  background-clip: padding-box;
}
.section_23 {
  background-color: #000000;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  cursor: pointer;
  background-clip: padding-box;
}
.section_24 {
  background-color: #565656;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  cursor: pointer;
  background-clip: padding-box;
}
.ml-31 {
  margin-left: 0.4rem
}
.group_24 {
  margin-top: 0.1rem;
  padding: 0 2px;
}
.ml-29 {
  margin-left: 0.38rem!important;
}
.font_11{
  opacity: 0.7;
}
.font_21{
  opacity: 0.7;
}
.opacity1{
  opacity: 1;
}
.section_27 {
  padding-top: 186px;
  background-image: url('https://hsimage.fotile.com/202407212058355646095.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.font_22 {
  font-size: 0.37rem;
  font-family: 'PingFang SC';
  line-height: 0.48rem;
  font-weight: 600;
  color: #ffffff;
}
.group_37 {
  margin-right: 39px;
  margin-top: 9px;
}
.font_16 {
  font-size: 0.14rem;
  font-family: 'PingFang SC';
  line-height: 0.22rem;
  font-weight: 600;
  color: #ffffffb3;
  text-align: center;
}
.font_20 {
  font-size: 0.21rem;
  font-family: 'PingFang SC';
  line-height:0.34rem;
  font-weight: 600;
  color: #ffffff;
}
.font_24 {
  font-size: 0.18rem;
  font-family: 'PingFang SC';
  line-height: 0.24rem;
  font-weight: 600;
  color: #f5f5f5;
}
.font_25 {
  font-size:0.18rem;
  font-family: PingFangSC, PingFang SC;
  line-height: 0.25rem;
  font-weight: 600;
  color: #a9a9a9;
}
.self-stretch {
  align-self: stretch;
}
.justify-center {
  justify-content: center;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.mt-42 {
  margin-top: 42px;
}
.relative {
  position: relative;
}
.self-center {
  align-self: center;
}
.banner5-1{
  position: relative;
}
.group_28 {
  width:4.7rem;
  position: absolute;
  top: 1.8rem;
  left: 50%;
  margin-left: -2.35rem;
}
.justify-evenly {
  justify-content: space-evenly;
}
.banner5-1 .bottomTxt{
  position: absolute;
  width: 100%;
  bottom: 0;
}
.flex-col {
  display: flex;
  flex-direction: column;
}
.font_9 {
  font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 0.26rem;
color: #FFFFFF;
line-height: 0.48rem;
  margin-bottom: 0.07rem;
  margin-top: 0.07rem;
}
.text_24 {
  margin-top: 0.14rem;
}
.section_28 {
  padding: 10px 0 14px;
  background-color: #000000;
  border-radius: 24px;
  width: 200px;
  cursor: pointer;
}
.image_16 {
  width: 40px;
  height: 24px;
}
.font_11 {
  font-size: 14px;
  font-family: 'PingFang SC';
  line-height: 20px;
  font-weight: 600;
  color: #ffffff;
}
.ml-10 {
  margin-left: 10px;
}
.group_36 {
  margin-top: 0.35rem;
  width: 3.36rem
}
.font_27 {
  font-size: 0.14rem;
  font-family: 'PingFang SC';
  line-height: 20px;
  font-weight: 300;
  color: #a9a9a9;
}
.text_31 {
  line-height:0.22rem;
  text-align: left;
}
.mt-32 {
  margin-top: 32px;
}
.section_30 {
  padding: 0 2rem 0;
  background-position: 0% 0%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  width: 80%;
  margin-left: 10%;
  top:1.4rem
}
.image_18 {
  width:0.8rem;
  height: 0.8rem;
}
.group_33 {
  margin-top: 0.51rem;
  width: 3.8rem;
}
.section_31{
  width: 0.6rem;
  height: 0.34rem;
  border-bottom: 1px dashed #fff
}
.font_26 {
  font-size: 0.14rem;
  font-family: 'PingFang SC';
  line-height: 0.22rem;
  font-weight: 600;
  opacity: 0.7;
  color: #fff;
}
.group_34 {
  padding: 0 0.3rem;
}
.mt-7 {
  margin-top: 7px;
}
.justify-between {
  justify-content: space-between;
}

.banner7 .swiper-container-horizontal > .swiper-pagination-bullets {
  width:0.77rem !important;
  height: 0.3rem !important;
  line-height:  0.3rem ;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 30px;
  backdrop-filter: blur(10px);
  left: 50% !important;
  margin-left: -30px;
  bottom: 0.3rem;
}
.banner7 .swiper-pagination-bullet {
  width: 6px !important;
  height: 6px !important;
  border-radius: 100%!important;
  background: #000!important;
}
.banner7 .swiper-pagination-bullet-active {
  background: #fff !important;
}
.banner7 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 5px;
      border-radius: 100%;
}
.swiperBox{
  position: relative;
}
.swiperBox-title{
  position: absolute;
  position: absolute;
  color: #fff;
  margin: 0 auto;
  z-index: 9;
  width: 3.32rem;
  height: 0.96rem;
  left: 1.37rem;
  top: 2.6rem;
}
.swiperBox-title h3{
  font-size: 0.2rem;
  font-family: PingFangSC, PingFang SC;
  font-weight: 600;
  line-height: 0.28rem;
}
.swiperBox-title h5{
  font-family: PingFangSC, PingFang SC;
  font-weight: 600;
  font-size: 0.14rem;
  color: #FFFFFF;
  line-height: 0.21rem;
  text-align: center;
  margin-top: 0.17rem;
  text-align: left;
  opacity: 0.7;
}
.swiper-container6 img{
  width: 100%;
  height: auto;
  display: block;
}


.swiper-container6 > .swiper-pagination-bullets {
  width:0.77rem !important;
  height: 0.3rem !important;
  line-height:  0.3rem ;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 30px;
  backdrop-filter: blur(10px);
  left: 50% !important;
  margin-left: -30px;
  bottom: 0.3rem;
  position: absolute;
  z-index: 99999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper-container6 .swiper-pagination-bullet {
  width: 6px !important;
  height: 6px !important;
  border-radius: 100%!important;
  background: #000!important;
}
.swiper-container6 .swiper-pagination-bullet-active {
  background: #fff !important;
}
.swiper-container6 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 5px;
      border-radius: 100%;
}
