
@-webkit-keyframes scrolldown { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  55% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  70% { -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  85% { -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: 0 0; transform-origin: 0 0; }
  100% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 0 0; transform-origin: 0 0; } }
@keyframes scrolldown { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  55% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  70% { -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }
  85% { -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: 0 0; transform-origin: 0 0; }
  100% { -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: 0 0; transform-origin: 0 0; } }

/* banner */
.banner {overflow: hidden;position: relative;font-family: "Source Han Sans", "思源黑体";}
.banner .wrap {display: block;height: 0;overflow: hidden;padding-bottom: 100vh;position: relative;}
.banner .wrap em{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-position: center;background-repeat: no-repeat;background-size: cover;transform: scale(1.2);transition: 6s linear 2s;}
.banner .swiper-slide-active .wrap em,
.banner .swiper-slide-duplicate-active .wrap em {transform: scale(1);transition: 6s linear;}
.banner .wrap em.wap{display: none;}

.banner .slogan{position: absolute;left: 50%;top: 35%;transform: translateX(-50%);z-index: 3;text-align: center;color: #fff;}
.banner .slogan.left{text-align: left;}
.banner .slogan .ch{font-weight: bold;line-height: 1.4;}
.banner .slogan .en{font-weight: normal;font-family: "Poppins-Regular";font-weight: normal;}

.banner .text{position: absolute;left: 2%;bottom: 1.5rem;z-index: 3;color: #FFFFFF;line-height: 0.66rem;padding-left: 0.5rem;max-width: 35%;border-left: 2px solid rgba(255,255,255,0.4);transform: translateY(50px);opacity: 0;}
.banner .text::before{content: "";width: 2px;height: 100%;position: absolute;left: -2px;top: 0;background: #fff;-webkit-animation: scrolldown 5s infinite cubic-bezier(0.645, 0.045, 0.355, 1); animation: scrolldown 5s infinite cubic-bezier(0.645, 0.045, 0.355, 1);}
.banner .text .title{line-height: 0.93rem;}
.banner .swiper-slide-active  .text{transform: translateY(0);opacity: 1;transition:all 0.5s linear 1s;}


.banner .btn{width: 1.33rem;height: 1.33rem;position: absolute;top: 50%;transform: translateY(-50%);z-index: 2;cursor: pointer;background: rgba(0, 0, 0, 0.2);border-radius: 50%;}
.banner .prev{left: 2%;}
.banner .next{right: 2%;}
.banner .btn img{height: 40%;}
.banner .btn:hover{background: #1253A2;}
.banner .swiper-pagination{bottom:1rem;}
.banner .swiper-pagination .swiper-pagination-bullet{position: relative;width: 16px;height: 16px;margin: 0;background: none;opacity: 1;overflow: hidden;}
.banner .swiper-pagination .swiper-pagination-bullet::before{content: "";width: 4px;height: 4px;position: absolute;left: 6px;top: 6px;background: #FFFFFF;border-radius: 50%;}
.banner .swiper-pagination .swiper-pagination-bullet em{display: block;width: 100%;height: 100%;transform: scale(0.25);transition: 1s;background: #fff;border-radius: 50%;}
.banner .swiper-pagination .swiper-pagination-bullet svg{z-index: -1;position: absolute;left: 0;right: 0;top: 0;bottom: 0;fill: transparent;stroke-width: 1px;stroke: #fff;stroke-dasharray: 50;stroke-dashoffset: -50;}
.banner .swiper-pagination .swiper-pagination-bullet-active em{background-color: rgba(255,255,255,0);transform: scale(1);}
.banner .swiper-pagination .swiper-pagination-bullet-active svg{animation: svgAni 5s linear forwards;}
@keyframes svgAni{to{stroke-dashoffset: 0;}}


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

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

}

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


@media screen and (max-width: 1024px){
.banner .slogan .ch{font-size: 1rem;line-height: 1.2;margin-bottom: 0.2rem;}
.banner .slogan .en{font-size: 12px;}

.banner .wrap em.pc{display: none;}
.banner .wrap em.wap{display: block;}
}

@media screen and (max-width: 760px){
.banner .wrap em::before{content: "";width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: rgba(0, 0, 0, 0.2);}
.banner .swiper-slide-active .text{bottom: 2.4rem;max-width: 96%;width: 96%;}
.banner .swiper-pagination{bottom: 0.5rem;}
.select{display: none;}
}

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