img {
  display: inline-block;
  padding: 0;
  border: none;
  -ms-interpolation-mode: bicubic;
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}


.bannerbg {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 5;
}


.banner {
  width: 100%;
  height: 95vh;
  overflow: hidden;
  position: relative;
}



.banner::after{
  position: absolute;
  left: 0;
  bottom: 0px;
  content: "";
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}


.banner .swiper-container {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

}

.banner .swiper-container .swiper-wrapper {
  display: flex;
}

.banner .swiper-slide {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  z-index: 5;

}



.banner .swiper-slide {
  background-position: center;
  background-repeat: no-repeat;
}

.banner .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 1s linear 2s;
  transform: scale(1, 1);
  object-fit: cover;
  margin: 0 auto;
}






.banner .swiper-slide-active img,
.banner .swiper-slide-duplicate-active img {
  transition: 6s linear;
  transform: scale(1.05, 1.05);
}


.banner .video-slide {
  width: 100%;
  height: 100%;
  position: relative;
}



.banner video{
  display: block;
  pointer-events: none; 
  width: 100%;
  height: 100%;
  object-fit: cover;
}



.banner .swiper-banner-next {
  position: absolute;
  width: 0.56rem;
  height: 0.56rem;
  background: url() no-repeat center;
  background-size: 100% 100%;
  right: -3%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  cursor: pointer;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;


}

.banner .swiper-banner-prev {
  position: absolute;
  width: 0.56rem;
  height: 0.56rem;
  background: url() no-repeat center;
  background-size: 100% 100%;
  left: -3%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  cursor: pointer;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}


.banner .swiper-pagination{
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 0.1rem;
  transition: opacity 1s ease;
}

.banner .swiper-pagination.show {
  opacity: 1 !important;
  visibility: visible !important;
}

.banner .swiper-pagination .swiper-pagination-bullet{
  position: relative;
  margin: 0px 0.3rem ;
  border-radius: 50%;
  opacity: 0.5;
  display: inline-block;
  width: 7px;
  height:  7px;
  background: #fff;
}

.banner .swiper-pagination .swiper-pagination-bullet::after{
  position: absolute;
  left: -6px;
  top:  -6px;
  content: "";
  width: 18px;
  height:  18px;
  border: 1px solid #fff;
  border-radius: 50%;
  opacity: 0;
}


.banner .swiper-pagination .swiper-pagination-bullet-active{
  opacity: 1;
}

.banner .swiper-pagination .swiper-pagination-bullet-active::after{
  opacity: 1;
}




       /* 所有元素初始隐藏 */
      .banner .swiper-slide .mountain,
      .banner .swiper-slide .star-ring,
      .banner .swiper-slide .banner-content,
      .banner .swiper-pagination,
      .banner .swiper-banner-next,
      .banner .swiper-banner-prev {
           opacity: 0;
           visibility: hidden;
       }
       
       /* 显示类 */
       .banner  .swiper-slide-active .mountain.show,
       .banner .swiper-slide-active .star-ring.show,
       .banner .swiper-slide-active .banner-content.show {
           opacity: 1;
           visibility: visible;
       }



  /* 星空效果 */
  .stars {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.star {
  position: absolute;
  background-color: #fff;
  border-radius: 50%;
  opacity: 0.2;
  animation: twinkle 3s infinite ease-in-out;
}

@keyframes twinkle {
  0%, 100% { opacity: 0.2; }
  50% { opacity: 1; }
}




/* 山脉 */
.mountain {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3.86rem;
  background: url(../images/bannerbg.png) center bottom no-repeat;
  background-size: 100%;
  z-index: 3;
  transform: translateY(100%);
  opacity: 1;
  transition: transform 1.5s ease, opacity 1.5s ease;
}

.mountain.show {
transform: translateY(0);

}

/* 星环 */
.star-ring {
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translate(-50%, -0%) scale(0) !important;
  width: 100%;
  height: 6.75rem;
  background: url(../images/bannerxt.png) center top no-repeat;
  background-size: cover ;
  z-index: 2;
  transition: transform 1.8s ease-out, opacity 1.8s ease-out;
}

.star-ring.show {

transform: translate(-50%, -0%) scale(1) !important;

}


/* Banner内容 */
.banner-content {
  position: absolute;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%) translateY(30px);
  text-align: center;
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform 1.8s ease, opacity 1.8s ease;
}

.banner-content.show {
  transform: translate(-50%, -50%) translateY(0);

}

.banner-title {
font-size: 3rem;
width: 4.6rem;
height: 1.57rem;
margin-right: 0.6rem;
position: relative;

}

.banner-title::after{
position: absolute;
content: "";
right: -0.6rem;
top: 0;
width: 1px;
height: 1.6rem;
border-right: 1px dashed rgba(255, 255, 255, 0.2);
}

.banner-subtitle {
font-size: 1.8rem;
color: #e0e0ff;
line-height: 1.6;
width: 4.81rem;
height: 1.66rem;
margin-left: 0.6rem;

}

.banner-content .txt{
position: relative;
bottom: 0rem;
width: 100%;
text-align: center;
font-size: 0.4rem;
color: #fff;
margin: 7.2rem auto 0 auto;

}


    /* 轮播指示器 */
    .pagination-container {
      position: absolute;
      bottom: 40px;
      left: 0;
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 10;
      opacity: 0;
      transition: opacity 1s ease;
  }
  
  .pagination-container.visible {
      opacity: 1;
  }
  
  .pagination {
      display: flex;
      align-items: center;
  }
  
  .pagination-item {
      position: relative;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background-color: rgba(255, 255, 255, 0.3);
      margin: 0 8px;
      cursor: pointer;
      transition: all 0.3s ease;
  }
  
  .pagination-item.active {
      background-color: transparent;
  }
  
  /* 红色外圆 */
  .outer-circle {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 2px solid #fff;
      opacity: 1;
      transition: opacity 0.3s ease, transform 0.5s ease;
  }
  
  .pagination-item.active .outer-circle {
      opacity: 1;
      animation: pulse 2s infinite;
  }
  
  @keyframes pulse {
      0% { 
          transform: translate(-50%, -50%) scale(1);
          opacity: 0.8;
      }
      70% { 
          transform: translate(-50%, -50%) scale(1.2);
          opacity: 0;
      }
      100% { 
          transform: translate(-50%, -50%) scale(1.2);
          opacity: 0;
      }
  }
  
  /* 红色内圆 */
  .inner-circle {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background-color: #fff;
      opacity: 1;
      transition: opacity 0.3s ease, transform 0.5s ease;
  }
  
  /* 粒子效果容器 */
  .particles-container {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 5;
      pointer-events: none;
      opacity: 0;
  }
  
  .particles-container.active {
      opacity: 1;
  }
  
  .particle {
      position: absolute;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background-color: #4cc9f0;
      pointer-events: none;
  }
  
  /* 底部圆弧模糊效果 */
  .banner-bottom {
      position: absolute;
      bottom: -1.3rem;
      left: 0;
      width: 100%;
      height: 2.5rem;
      z-index: 6;
      background: url(../images/banner_bottom.png) center no-repeat;
      background-size: 100%;
  }
  


  .mountain.visible {
    transform: translateY(0);
    opacity: 1;
}

.star-ring.visible {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

.banner-content.visible {
    transform: translate(-50%, -50%) translateY(0);
    opacity: 1;
}




.mountain,
.star-ring,
.banner-content {
    transition: transform 0.8s ease-out;
    will-change: transform;
}

/* IE下的兼容样式 */
.ie-browser .mountain,
.ie-browser .star-ring,
.ie-browser .banner-content {
    transition: margin 0.8s ease-out;
    will-change: margin;
}





  
  /* title */
  
  .titlecon{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
  }
  
  .title{
    margin: 0;
    background: url(../images/title.png) no-repeat left center;
    background-size: 1.03rem 1.11rem;
    height: 1.11rem;
    padding-left: 0.4rem;
    text-align: right;
  }
  

  .title span{
    display: block;
    font-size: 0.12rem;
    color: #333333;
    text-transform: uppercase;
    opacity: 0.32;
    padding-top: 0.25rem;
  }


  .title h3{
    font-size: 0.4rem;
    line-height: 0.42rem;
    color: #333333;
    font-family: "SourceHanSans-Normal";
    margin-top: 0.04rem;
  }

  .title h3 i{
    color: #671D7D;
    font-size: 0.44rem;
    position: relative;
    top: -0.1rem;

  }

  .title h3 em{
    color: #671D7D;
    font-size: 0.4rem;
    margin-right: 0.03rem;
  }



.fl_menu{
  margin-top: 0.55rem;

}

.fl_menu ul {
  display: flex;
  justify-content: left;
  flex-wrap: wrap;
}

.fl_menu ul li{
  font-size: 0.16rem;
  color: #671D7D;

}

.fl_menu ul li a{
  font-size: 0.16rem;
  color: #671D7D;
  padding: 0 0.18rem;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}


/* team */

.teambg{
  margin: 0 auto;
  padding: 1.45rem 0 1.05rem 0;
  background: url(../images/teambg.png) no-repeat  center;
  background-size: 100% 100%;
}

.teambg .team{
  margin: 0rem auto 0 auto;

}

.teambg .team .teambox{
  position: relative;
  margin: 0.7rem auto 0 auto;
}


.teambg .team .teambox .swiper-container{
  width: 15.6rem;
  padding: 0 0 0.2rem 0;
}

.teambg .team .teambox .swiper-container .swiper-slide{
  position: relative;

}

.teambg .team .teambox .swiper-container .swiper-slide .nr{
  position: relative;
  z-index: 5;
  width: 100%;
  padding-bottom: 0.17rem;
  overflow: hidden;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr::after{
  position: absolute;
  left: 0rem;
  bottom: -0rem;
  content: "";
  z-index: -1;
  width: 100%;
  height: 3.42rem;
  border-radius: 170px;
  background: url(../images/teamlist.png) center no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}



.teambg .team .teambox .swiper-container .swiper-slide .nr a{
  display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .pic{
  position: relative;
  z-index: 5;
  width: 3.07rem;
  height: 3.52rem;
  margin-left: 0.17rem;
  opacity: 1;
  transform: translate(0) ;


}

.teambg .team .teambox .swiper-container .swiper-slide .nr .pic::after{
  position: absolute;
  left: -0.17rem;
  bottom: -0.17rem;
  content: "";
  z-index: -2;
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 100%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 35%, rgba(255, 255, 255, 0.5) 100%);
  border: 1px solid #FFFFFF;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .pic img{
  width: 100%;
  height: 100%;
  display: block;

}




.teambg .team .teambox .swiper-container .swiper-slide .nr .txt{
  width: calc(100% - 3.85rem);
  padding-right: 0.6rem;
  padding-top: 0.78rem;
  opacity: 1;
  transform: translate(0);
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt h5{
  font-size: 0.48rem;
  font-family: "SourceHanSans-Bold";
  background: linear-gradient(145deg, #000000 38%, #B45EFF 91%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  background: none\0;
  color: #000;
  display: inline-block;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .xt{
  display: block;
  width: 0.61rem;
  height: 0.03rem;
  background: url(../images/teamxt1.png) center no-repeat;
  background-size: 100% ;
  margin: 0.15rem 0;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt p{
  color: #671D7D;
  font-size: 0.26rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  overflow: hidden;
  display: block;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}



.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more{
  width: 1.2rem;
  height: 0.44rem;
  line-height: 0.42rem;
  border-radius: 45px;
  background: linear-gradient(110deg, #8320FC 1%, #A63DBB 100%);
  box-shadow: 0px 10px 24px 0px rgba(148, 51, 232, 0.4);
  border: 0.5px solid rgba(255, 255, 255, 0.5);
  position: relative;
  z-index: 5;
  text-align: center;
  margin-top: 0.75rem;
  overflow: hidden;
} 

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/sureico.png) no-repeat  center;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: -100%;
}






.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more i{
  display: inline-block;
  color: #FFFFFF;
  font-size: 0.2rem;
  margin-right: 0.05rem;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more em svg{
  position: relative;
  top: 0.02rem;
  width: 0.2rem;
  height: 0.2rem;

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2n)  .nr .txt h5{
  background: linear-gradient(134deg, #000000 47%, #0B72E2 94%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  background: none\0;
  color: #000;
}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2n) .nr .txt .xt {

  background: url(../images/teamxt2.png) center no-repeat;

}


.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2n) .nr .txt p {
  color: #0055B2;

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2n) .nr .txt .ab_more .more{

  background: linear-gradient(110deg, #3B5BFF 1%, #1696DB 100%);
  box-shadow: 0px 10px 24px 0px rgba(46, 112, 242, 0.32);
} 

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(1) .nr .pic{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(1) .nr .txt{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2) .nr .pic{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2) .nr .txt{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2).swiper-slide-active .nr .pic {
  opacity: 1 !important;
  transform: translate3d(0px, 0, 0) !important;
  transition-duration: 0s !important;
}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2).swiper-slide-active .nr .txt{
  opacity: 1 !important;
  transform: translate3d(0px, 0, 0) !important;
  transition-duration: 0s !important;
}

.teambg .team .teambox .team-next{
  position: absolute;
  right: 0;
  top: 0;
  background: url(../images/teamrightbg.png) no-repeat  center;
  background-size: 100% 100%;
  width: 1.39rem;
  height: 4.04rem;
}

.teambg .team .teambox .team-next i{
  display: block;
  background: url(../images/teamright.png) no-repeat  center;
  background-size: 100% 100%;
  width: 0.28rem;
  height: 0.28rem;
  position: absolute;
  left: 0.25rem;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}

.teambg .team .teambox .team-prev{
  position: absolute;
  left: 0;
  top: 0;
  background: url(../images/teamleftbg.png) no-repeat  center;
  background-size: 100% 100%;
  width: 1.39rem;
  height: 4.04rem;
  
}

.teambg .team .teambox .team-prev i{
  display: block;
  background: url(../images/teamleft.png) no-repeat  center;
  background-size: 100% 100%;
  width: 0.28rem;
  height: 0.28rem;
  position: absolute;
  right: 0.25rem;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}



/* video */

.videobg{
  margin: 0 auto;
  padding: 0.7rem 0 0.98rem 0;
  background: url(../images/videobg.jpg) no-repeat  center;
  background-size: 100% 100%;
}

.videobg .video{
  margin: 0 auto;
}

.videobg .video  .title{
  background: url(../images/title1.png) no-repeat left center;
  background-size: 1.03rem 1.11rem;
}

.videobg .video  .title span{
  opacity: 0.7;
  color: #FFFFFF;
}

.videobg .video  .title h3 {
  color: rgba(255, 255, 255, 0.7);
}


.videobg .video  .title h3 i {
  color: #fff;
}


.videobg .video  .title h3 em {
  color: #fff;
}

.videobg .video .fl_menu ul li{
  color: rgba(255, 255, 255, 0.4);
}

.videobg .video .fl_menu ul li a{
  color: #fff;
}


.videobg .video .videobox{
  margin: 0.5rem auto 0 auto;
  position: relative;
  z-index: 5;
  background: url(../images/videobox.png) no-repeat  center;
  background-size: 100% 100%;
  height: 6.2rem;
  border-radius: 0.2rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0.6rem 0.7rem 0.6rem 0.65rem;
}

.videobg .video .videobox::after{
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  background: rgba(17, 28, 41, 0.98);
  border-radius: 0.2rem;
}

.videobg .video .videobox .gallery-thumbs{
  width: 1.85rem;
  height: 2.7rem;

}


.videobg .video .videobox .gallery-thumbs .swiper-slide{
  position: relative;
  margin-bottom: 0.05rem;
}


.videobg .video .videobox .gallery-thumbs .swiper-slide .pic{
  width: 1.53rem;
  height: 1.12rem;
  border-radius: 0.1rem;
  border: 1px solid rgba(255, 255, 255, 0);
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  padding: 0.06rem;
}

.videobg .video .videobox .gallery-thumbs .swiper-slide .pic img{
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.5;

}


.videobg .video .videobox .gallery-thumbs .swiper-slide-thumb-active .pic{
  border: 1px solid rgba(255, 255, 255, 0.8);
}

.videobg .video .videobox .gallery-thumbs .swiper-slide-thumb-active .pic img{
  opacity: 1;
}


.videobg .video .videobox .gallery-top{
  width: calc(100% - 1.85rem);
  padding-bottom: 0.2rem;
}

.videobg .video .videobox .gallery-top .swiper-slide{
  position: relative;
}


.videobg .video .videobox .gallery-top .swiper-slide a{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.videobg .video .videobox .gallery-top .swiper-slide .pic{
  width: 7.07rem;
  height: 5rem;
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
}


.videobg .video .videobox .gallery-top .swiper-slide .pic img{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.2rem;
  object-fit: cover;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}


.videobg .video .videobox .gallery-top .swiper-slide .pic .videoBtn {
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(../images/videoico.png) center no-repeat;
  background-size: 0.66rem 0.66rem;
  left: 0;
  top: 0;
  z-index: 99;
  border-radius: 0%;
}




.videobg .video .videobox .gallery-top .swiper-slide .nr{
  width: calc(100% - 7.65rem);
  position: relative;
  opacity: 1;
  transform: translate(0);
}

.videobg .video .videobox .gallery-top .swiper-slide:nth-child(1) .nr{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
}

.videobg .video .videobox .gallery-top .swiper-slide .nr h5{
  line-height: 0.6rem;
  padding-bottom: 0.2rem;
  border-bottom: 0.5px dashed rgba(255, 255, 255, 0.2);
  font-size: 0.4rem;
  color: #FFFFFF;
  font-family: "SourceHanSans-Bold";
  transition: all 0.5s ease-out;
}


.videobg .video .videobox .gallery-top .swiper-slide .nr .txt{
  margin-top: 0.2rem;
  height: 3.2rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 10;
  -webkit-box-orient: vertical;
  -webkit-transition: all 0.8s ease-out;
  -o-transition: all 0.8s ease-out;
  transition: all 0.8s ease-out;
  background: url(../images/abico2.png) no-repeat left 0.12rem;
  background-size: 0.09rem 0.09rem;
  padding-left: 0.18rem;
}

.videobg .video .videobox .gallery-top .swiper-slide .nr .txt p{
  font-size: 0.2rem;
  color: #FFFFFF;
  line-height: 0.32rem;
  transition: all 1.1s ease-out;
}

.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more {
  position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    transition: all 1.4s ease-out;
    margin-top: 0.35rem;
}


.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more_l {

  background: url(../images/morext.png) no-repeat right center;
  background-size: 1.74rem 0.03rem;
  padding-right: 1.85rem;
  font-size: 0.12rem;
  color: rgba(255, 255, 255, 0.5);
}


.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more {
  width: 1.2rem;
  height: 0.44rem;
  line-height: 0.42rem;
  border-radius: 45px;
  background: rgba(255, 255, 255, 0.1);

  border: 0.5px solid #FFFFFF;
  position: relative;
  z-index: 5;
  overflow: hidden;
  text-align: center;
}



.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/sureico.png) no-repeat  center;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: -100%;
}




.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more  i{
  display: inline-block;
  color: #FFFFFF;
  font-size: 0.2rem;
  margin-right: 0.05rem;
}

.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more  em svg{
  position: relative;
  top: 0.02rem;
  width: 0.2rem;
  height: 0.2rem;

}

.videobg .video .videobox .xt{
  position: absolute;
  left: 0.75rem;
  bottom: 0.55rem;
  z-index: 5;
  opacity: 0.5;
  font-size: 0.12rem;
  color: #FFFFFF;
  text-transform: uppercase;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  margin: 0 0rem 0 0.05rem;
  -ms-writing-mode: tb-rl;
  writing-mode: tb-rl;
  transform: rotate(0deg);
  transform-origin: bottom left;
  white-space: nowrap;
}


.videobg .video .videobox .mapico{
  position: absolute;
  left: 1.8rem;
  bottom: 0;
  z-index: 5;
  width: 1.54rem;
  height: 1.54rem;
  animation: pulse-basic 3s infinite;
}

.videobg .video .videobox .mapico img{
  width: 100%;
  height: 100%;
}


.videobg .video .videobox .gallery-top .swiper-slide.pic2 .pic{
  width: 100%;
  height: 5rem;
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
}

.videobg .video .videobox .gallery-top .swiper-slide.pic2 .nr{
  display: none;

}


@keyframes pulse-basic {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}


/* about */

.aboutbg{
  margin: 0 auto;
  width: 100%;
  padding-top: 0.15rem;
}

.aboutbg .about{
  position: relative;
  z-index: 5;
  width: 100%;
  padding-bottom: 3.75rem;


}

.aboutbg .about::after{
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  background: url(../images/aboutbg1.jpg) no-repeat top center;
  background-size: 100% ;
}



.aboutbg .about::before{
  position: absolute;
  content: "";
  right: 0;
  top: 0.15rem;
  z-index: -1;
  width: 7.1rem;
  height: 6.13rem;
  background: url(../images/ab_tbg.png) no-repeat top center;
  background-size: 100%;
}

.aboutbg .about .xt{
  position: absolute;
  content: "";
  left: 0;
  top: -18%;
  z-index: -2;
  width: 100%;
  height: 100%;
  background: url(../images/aboutbg2.png) no-repeat top center;
  background-size: 100% ;
}



.aboutbg .about .abbox{
  margin: -2.1rem auto 0 auto;
  padding-top: 0.75rem;

}

.aboutbg .about .abcont{
  position: relative;
  z-index: 5;
  margin: 0.55rem auto 0 auto;
  min-height: 6.2rem;
  border-radius: 0.2rem;
  background: url(../images/ablist.png) no-repeat center;
  background-size: 100% 100%;
  
  box-shadow: 0px 32px 80px 0px rgba(103, 0, 134, 0.12);
  overflow: hidden;

  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0.6rem 0.7rem 0 0rem;
}



.aboutbg .about .abcont .ab_l{
  padding-left: 0.7rem;
  width: calc(100% - 7.7rem);
  background: url(../images/abico1.png) no-repeat bottom left;
  background-size: 4.8rem 1.93rem;
  position: relative;
}

.aboutbg .about .abcont .ab_l h5{
  line-height: 0.6rem;
  padding-bottom: 0.2rem;
  border-bottom: 0.5px dashed rgba(111, 41, 132, 0.24);
  font-size: 0.4rem;
  color: #671D7D;
  font-family: "SourceHanSans-Bold";
  transition: all 0.5s ease-out;
}

.aboutbg .about .abcont .ab_l .txt{
  margin-top: 0.2rem;
  max-height: 3.2rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 10;
  -webkit-box-orient: vertical;
  -webkit-transition: all 0.8s ease-out;
  -o-transition: all 0.8s ease-out;
  transition: all 0.8s ease-out;
  background: url(../images/abico.png) no-repeat left 0.12rem;
  background-size: 0.09rem 0.09rem;
  padding-left: 0.18rem;
}

.aboutbg .about .abcont .ab_l .txt p{
  font-size: 0.2rem;
  color: #666666;
  line-height: 0.32rem;
  transition: all 1.1s ease-out;
}

.aboutbg .about .abcont .ab_l .ab_more{
  position: absolute;
  left: 0.75rem;
  bottom: 0.6rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  transition: all 1.4s ease-out;
}

.aboutbg .about .abcont .ab_l .ab_more .more_l{
  font-size: 0.2rem;
  color: #666666;
  background: url(../images/ab_xt.png) no-repeat right center;
  background-size: 3.23rem 0.03rem;
  padding-right: 3.4rem;
  font-size: 0.12rem;
  color: rgba(111, 41, 132, 0.5);
}

.aboutbg .about .abcont .ab_l .ab_more .more{
  width: 1.2rem;
  height: 0.44rem;
  line-height: 0.42rem;
  border-radius: 45px;
  background: linear-gradient(110deg, #8320FC 1%, #A63DBB 100%);
  box-shadow: 0px 10px 24px 0px rgba(148, 51, 232, 0.4);
  border: 0.5px solid rgba(255, 255, 255, 0.5);
  position: relative;
  z-index: 5;
  overflow: hidden;

} 

.aboutbg .about .abcont .ab_l .ab_more .more:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/sureico.png) no-repeat  center;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: -100%;
}

.aboutbg .about .abcont .ab_l .ab_more .more::after{
  position: absolute;
  bottom: -35px;
  left: 0;
  content: "";
  z-index: -1;
  width: 1.28rem;
  height: 0.85rem;
  background: url(../images/moreico.png) no-repeat bottom center;
  background-size: 100%;
}

.aboutbg .about .abcont .ab_l .ab_more .more a{
  display: block;
  text-align: center;

}


.aboutbg .about .abcont .ab_l .ab_more .more a i{
  display: inline-block;
  color: #FFFFFF;
  font-size: 0.2rem;
  margin-right: 0.05rem;
}

.aboutbg .about .abcont .ab_l .ab_more .more a em svg{
  position: relative;
  top: 0.02rem;
  width: 0.2rem;
  height: 0.2rem;

}



.aboutbg .about .abcont .abimg{
  width: 7.07rem;
  height: 5rem;
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
}

.aboutbg .about .abcont .abimg img{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.2rem;
  object-fit: cover;
  -webkit-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  
}


.aboutbg .about.about2 .abcont .abimg{
  margin-left: 0.7rem;
}

.aboutbg .about.about2 .abcont .ab_l{
  width: calc(100% - 7.8rem);
}

.aboutbg .about.about1 .abbox{
  margin: 0 auto;
}

.aboutbg .about.about1 .xt{
  top: 0;
}

.aboutbg .about.about3 {

  padding-bottom: 2.5rem;
}




.more em svg path,
.more em svg rect,
.more em svg circle,
.more em svg line,
.more em svg polygon {
  fill: rgba(255, 255, 255, 1);
  stroke: transparent;
  stroke-width: 0;
  transition: all 0.5s ease;
  transition: all 0.5s ease;
}

/* 鼠标移入时：线条动画开始 */
.more:hover em svg path,
.more:hover em svg rect,
.more:hover em svg circle,
.more:hover em svg line,
.more:hover em svg polygon {
  fill: none;
  stroke: #fff;
  stroke-width: 1;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: drawLine 2s ease-in-out forwards;
}


/* 线条绘制动画 */
@keyframes drawLine {
  to {
    stroke-dashoffset: 0;
    fill: #ffffff;
  }
}


@keyframes share { 0% { left: -100%; } 100% { left: 120%; } }



@-webkit-keyframes shine {
  100% {
    left: 125%;
  }
}

@keyframes shine {
  100% {
    left: 125%;
  }
}


#videoAlert {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1009;
}

#videoAlert .cont {
  position: relative;
  height: 100%;
}

#videoAlert .video_box {
  position: absolute;
  margin-top: 10%;
  width: 70%;
  height: 60%;
  margin-left: 15%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: right;
}

#videoAlert .video_box video {
  width: 85%;
  margin: 0 auto;
}

#videoAlert .video_box .close img {
  width: 30px;
  position: absolute;
  top: 1rem;
  right: -10%;
  max-height: initial;
}

#videoAlert .video_box .close {
  margin-bottom: 0px;
  height: 30px;
  position: relative;
  z-index: 10000;
  cursor: pointer;
}




@media (min-width: 1024px) {
  .fl_menu ul li:hover a{
    font-weight: bold;

  }

  .aboutbg .about .abcont .abimg:hover img{
    transform: scale(1.1);
  }

  .ab_more:hover .more:before {
    animation: share 2s infinite;
  }

  .teambg .team .teambox .swiper-container .swiper-slide:hover .nr::after{
    background: #fff;
  }

  .teambg .team .teambox .swiper-container .swiper-slide:hover .nr .pic:before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
  }

  .videobg .video .videobox .gallery-top .swiper-slide:hover .pic img{
    transform: scale(1.1);
  }
}



@media (max-width: 1024px) {



  
  .title{
    margin: 0 auto;
    background: url(../images/title.png) no-repeat left center;
    background-size: 1.23rem 1.33rem;
    height: 1.33rem;
    padding-left: 0.4rem;
    text-align: left;
  }
  

  .title span{

    font-size: 0.24rem;

    padding-top: 0.3rem;
  }


  .title h3{
    font-size: 0.36rem;
    line-height: 0.42rem;
    color: #333333;
    font-family: "SourceHanSans-Normal";
    margin-top: 0.06rem;
  }

  .title h3 i{
    font-size: 0.4rem;
    top: -0.1rem;

  }

  .title h3 em{
    font-size: 0.36rem;

  }



.fl_menu{
  margin: 0.5rem auto 0 auto;

}

.fl_menu ul {

  justify-content: center;

}

.fl_menu ul li{
  font-size: 0.28rem;

}

.fl_menu ul li a{
  font-size: 0.28rem;
  padding: 0 0.18rem;

}



  .aboutbg{

    padding-top: 0.15rem;
  }
  
  .aboutbg .about{

    padding-bottom: 1rem;
  
  
  }
  
  
  
  
  .aboutbg .about::before{
    width: 4.9rem;
    height: 4.2rem;

  }
  
  .aboutbg .about .xt{

    top: -5%;

  }
  
  
  
  .aboutbg .about .abbox{
    margin: 0rem auto 0 auto;
    padding-top: 0;
  
  }
  
  .aboutbg .about .abcont{

    margin: 0.55rem auto 0 auto;
    min-height: 6.2rem;

    padding: 0.5rem 0.4rem 0.5rem 0.4rem;
  }
  
  
  
  .aboutbg .about .abcont .ab_l{
    padding-left: 0rem;
    width: calc(100% - 0rem);
    background: url(../images/abico1.png) no-repeat bottom left;
    background-size: 4.8rem 1.93rem;
    margin: 0 auto 0.45rem auto;
  }
  
  .aboutbg .about .abcont .ab_l h5{
    line-height: 0.6rem;
    padding-bottom: 0.2rem;
    font-size: 0.4rem;

  }
  
  .aboutbg .about .abcont .ab_l .txt{
    margin-top: 0.2rem;
    max-height: 4.5rem;
    -webkit-line-clamp: 10;
    -webkit-transition: all 0s ease-out;
    -o-transition: all 0s ease-out;
    transition: all 0s ease-out;
    background: url(../images/abico.png) no-repeat left 0.12rem;
    background-size: 0.18rem 0.18rem;
    padding-left: 0.3rem;
  }
  
  .aboutbg .about .abcont .ab_l .txt p{
    font-size: 0.3rem;
    line-height: 0.45rem;
    transition: all 0s ease-out;
  }
  
  .aboutbg .about .abcont .ab_l .ab_more{
    position: relative;
    left: 0rem;
    bottom: 0rem;
    transition: all 0s ease-out;
    margin-top: 0.2rem;
  }
  
  .aboutbg .about .abcont .ab_l .ab_more .more_l{
    font-size: 0.24rem;
    background: url(../images/ab_xt.png) no-repeat right center;
    background-size: 2rem 0.03rem;
    padding-right: 2.4rem;
  }
  
  .aboutbg .about .abcont .ab_l .ab_more .more{
    width: 2rem;
    height: 0.6rem;
    line-height: 0.6rem;
    margin-top: 0.2rem;

  } 
  

  
  .aboutbg .about .abcont .ab_l .ab_more .more::after{
    position: absolute;
    bottom: -35px;
    left: 0;
    content: "";
    z-index: -1;
    width: 1.28rem;
    height: 0.85rem;
    background: url(../images/moreico.png) no-repeat bottom center;
    background-size: 100%;
  }
  
  .aboutbg .about .abcont .ab_l .ab_more .more a{
    display: block;
    text-align: center;
  
  }
  
  
  .aboutbg .about .abcont .ab_l .ab_more .more a i{

    font-size: 0.26rem;
  }
  
  .aboutbg .about .abcont .ab_l .ab_more .more a em svg{
    position: relative;
    top: 0.02rem;
    width: 0.3rem;
    height: 0.3rem;
  
  }
  
  
  
  .aboutbg .about .abcont .abimg{
    width: 100%;
    height: auto;
    padding-top: 65%;
    margin: 0rem auto 0.3rem auto;
  }
  
  
  
  .aboutbg .about.about2 .abcont .abimg{
    margin-left: 0rem;
  }
  
  .aboutbg .about.about2 .abcont .ab_l{
    width: calc(100% - 0rem);
  }
  
  .aboutbg .about.about1 .abbox{
    margin: 0 auto;
  }
  
  
  .aboutbg .about.about3 {
  
    padding-bottom: 2rem;
  }





.videobg{

  padding: 0.7rem 0 0.98rem 0;
  background: url(../images/videobg.jpg) no-repeat  center;
  background-size: cover;
}



.videobg .video  .title{
  background: url(../images/title1.png) no-repeat left center;
  background-size: 1.23rem 1.33rem;
  height: 1.33rem;
}



.videobg .video .fl_menu ul li{
  color: rgba(255, 255, 255, 0.4);
}

.videobg .video .fl_menu ul li a{
  color: #fff;
}


.videobg .video .videobox{
  margin: 0.5rem auto 0 auto;

  height: auto;

  padding: 0.6rem 0.5rem 1rem 0.5rem;
}



.videobg .video .videobox .gallery-thumbs{
  width: 100%;
  height: auto;

}


.videobg .video .videobox .gallery-thumbs .swiper-slide{
  margin-bottom: 0rem;
}


.videobg .video .videobox .gallery-thumbs .swiper-slide .pic{
  width: 1.53rem;
  height: 1.12rem;
  padding: 0.06rem;
}





.videobg .video .videobox .gallery-top{
  width: calc(100% - 0rem);
  margin: 0.4rem auto 0 auto;
}



.videobg .video .videobox .gallery-top .swiper-slide .pic{
  width: 100%;
  height: auto;
  padding-top: 65%;
  margin-bottom: 0.5rem;

}





.videobg .video .videobox .gallery-top .swiper-slide .nr{
  width: calc(100% - 0rem);
  position: relative;
}

.videobg .video .videobox .gallery-top .swiper-slide:nth-child(1) .nr{
  opacity: 1;
  transform: translate3d(0px, 0, 0);
}

.videobg .video .videobox .gallery-top .swiper-slide .nr h5{

  font-size: 0.32rem;

}


.videobg .video .videobox .gallery-top .swiper-slide .nr .txt{
  margin-top: 0.2rem;
  height: 4.5rem;
  background: url(../images/abico2.png) no-repeat left 0.12rem;
  background-size: 0.18rem 0.18rem;
  padding-left: 0.3rem;
}

.videobg .video .videobox .gallery-top .swiper-slide .nr .txt p{
  font-size: 0.3rem;
  line-height: 0.45rem;

}

.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more {

    transition: all 0s ease-out;
    margin-top: 0.35rem;
}


.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more_l {


  font-size: 0.24rem;

}


.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more {
  width: 2rem;
  height: 0.6rem;
  line-height: 0.6rem;
  margin-top: 0.3rem;
}


.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more::after{
  position: absolute;
  bottom: -35px;
  left: 0;
  content: "";
  z-index: -1;
  width: 1.28rem;
  height: 0.85rem;
  background: url(../images/moreico.png) no-repeat bottom center;
  background-size: 100%;
}




.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more i{

  font-size: 0.26rem;
}

.videobg .video .videobox .gallery-top .swiper-slide .nr .ab_more .more em svg{
  position: relative;
  top: 0.02rem;
  width: 0.3rem;
  height: 0.3rem;

}


.videobg .video .videobox .xt{
  display: none;
}


.videobg .video .videobox .mapico{

  bottom: -0.6rem;
  z-index: 5;
  width: 1.24rem;
  height: 1.24rem;
  left: auto;
  right: 1rem;
}



.teambg{

  padding: 1.45rem 0 1.05rem 0;

}



.teambg .team .teambox{

  margin: 0.7rem auto 0 auto;
}


.teambg .team .teambox .swiper-container{
  width: 90%;
  padding: 0 0 0.2rem 0;
}



.teambg .team .teambox .swiper-container .swiper-slide .nr{

  padding-bottom: 0.17rem;

}







.teambg .team .teambox .swiper-container .swiper-slide .nr .txt{
  width: calc(100% - 3.85rem);
  padding-right: 0.2rem;
  padding-top: 0.7rem;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt h5{
  font-size: 0.4rem;
}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .xt{
  display: block;
  width: 1.2rem;
  height: 0.06rem;

}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt p{

  font-size: 0.26rem;
  line-height: 0.4rem;
  height: 0.8rem;
  white-space: inherit;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}



.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more{
  width: 1.6rem;
  height: 0.54rem;
  line-height: 0.52rem;
  text-align: center;
  margin-top: 0.5rem;

} 







.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more i{

  font-size: 0.26rem;

}

.teambg .team .teambox .swiper-container .swiper-slide .nr .txt .ab_more .more em svg{
  position: relative;
  top: 0.02rem;
  width: 0.24rem;
  height: 0.24rem;

}


.teambg .team .teambox .swiper-container .swiper-slide:nth-child(1) .nr .pic{
  opacity: 1;
  transform: translate(0);

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(1) .nr .txt{
  opacity: 1;
  transform: translate(0);
}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2) .nr .pic{
  opacity: 1;
  transform: translate(0);

}

.teambg .team .teambox .swiper-container .swiper-slide:nth-child(2) .nr .txt{
  opacity: 1;
  transform: translate(0);
}


.teambg .team .teambox .team-next{
  display: none;
}



.teambg .team .teambox .team-prev{
  display: none;
  
}



.banner {
  width: 100%;
  height: 100%;

}

.banner .swiper-slide img{
  height: 5rem;
}


.banner-content .banner-title{
  width: 50%;
}

.banner-content .banner-title img{
  width: 100%;
  height: auto;
}

.banner-content .banner-subtitle{
  width: 50%;
}

.banner-content .banner-subtitle img{
  width: 100%;
  height: auto;
}


.banner-content.show {
  transform: translate(-40%, -30%) translateY(0);
}
.banner-content {
  left: 40%;

}

.banner-title::after {

  height: 0.5rem;

}

.banner-content .txt {

  font-size: 0.32rem;

  margin: 1rem auto 0 auto;
}


}



/* 粒子发光动画 */
@keyframes particle-glow {
  0%, 100% {
      box-shadow: 
          0 0 10px rgba(76, 201, 240, 0.8),
          0 0 20px rgba(76, 201, 240, 0.5),
          0 0 30px rgba(100, 200, 255, 0.3);
      transform: scale(1);
  }
  50% {
      box-shadow: 
          0 0 20px rgba(76, 201, 240, 1),
          0 0 40px rgba(76, 201, 240, 0.8),
          0 0 60px rgba(100, 200, 255, 0.6);
      transform: scale(1.1);
  }
}

/* 光晕脉动动画 */
@keyframes glow-pulse {
  0%, 100% {
      opacity: 0.2;
      transform: translate(-50%, -50%) scale(1);
  }
  50% {
      opacity: 0.5;
      transform: translate(-50%, -50%) scale(1.3);
  }
}

/* 增强的粒子样式 */
.particle {
  position: absolute;
  pointer-events: none;
  z-index: 5;
  /* 基础发光效果 */
  box-shadow: 
      0 0 15px rgba(76, 201, 240, 0.8),
      0 0 30px rgba(76, 201, 240, 0.5);
  /* 渐变背景增强科技感 */
  background: radial-gradient(circle at 30% 30%, 
      rgba(255, 255, 255, 0.9), 
      rgba(76, 201, 240, 0.7),
      rgba(58, 139, 200, 0.5));
  /* 3D效果 */
  transform-style: preserve-3d;
}

/* 超大粒子的特殊效果 */
.particle.large {
  background: radial-gradient(circle at 30% 30%, 
      rgba(255, 255, 255, 1), 
      rgba(0, 247, 255, 0.9),
      rgba(0, 150, 255, 0.7));
  box-shadow: 
      0 0 30px rgba(0, 247, 255, 0.9),
      0 0 60px rgba(0, 247, 255, 0.6),
      0 0 90px rgba(0, 150, 255, 0.3);
}

/* 科技感线条粒子 */
.particle.line {
  width: 2px;
  height: 30px;
  border-radius: 1px;
  background: linear-gradient(to bottom, 
      transparent, 
      rgba(103, 29, 103, 0.9),
      transparent);
  box-shadow: 0 0 10px rgba(103, 29, 103, 0.8);
  transform-origin: center;
}

/* 响应式调整 */
@media (max-width: 768px) {
  .particle {
      /* 移动端粒子稍小但保持明显 */
      min-width: 6px;
      min-height: 6px;
  }
}

/* IE兼容样式 */
.ie-browser .particle {
  background: #671D7D !important;
  border: 1px solid #671D7D;
  filter: alpha(opacity=70);
  opacity: 0.7;
}

.ie-8 .particle,
.ie-9 .particle {
  background: #671D7D !important;
  border: none !important;
}