@import url('./common.css');
/*banner样式*/
.banner{width:100%; position: relative;overflow: hidden;}
@media only screen and (max-width: 1279px){
.banner{margin-top: 0;}
}
.banner .swiper-container{width:100%;}
.banner .swiper-slide{position: relative; height: auto; overflow: hidden;}
.banner .swiper-slide img{
  width: 100%;
  display: block;
  transition:transform 12s cubic-bezier(.23,1,.32,1);transform:scale(1)}
.banner .swiper-slide.swiper-slide-active img{transform:scale(1.1)}
.banner .swiper-slide.swiper-slide-active.ban_video img{transform:scale(1)}
.banner .swiper-slide.ban_video video{ position: absolute; left:0; top:0; width:100%; height:100%; object-fit: fill;}
.banner .txt{color:var(--font-color-normal); top:55%;}
.banner .txt .h2{
  margin-bottom:var(--title-to-text-margin); 
  line-height: var(--title-line-height);
}
.bg-cover {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.banner .txt .h3{ 
  line-height: var(--text-line-height);
  width: 61%;
  text-align: justify;
}
.banner .swiper-button-prev{ left:5%; width: 36px; height:62px; background-size: 36px 62px; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l4.2%2C4.2L8.4%2C22l17.8%2C17.8L22%2C44L0%2C22z'%20fill%3D'%23B11524'%2F%3E%3C%2Fsvg%3E");}
.banner .swiper-button-next{ right:5%;width: 36px; height:62px; background-size: 36px 62px; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L5%2C44l-4.2-4.2L18.6%2C22L0.8%2C4.2L5%2C0z'%20fill%3D'%23B11524'%2F%3E%3C%2Fsvg%3E");}
.banner .swiper-pagination{bottom:10%;}
.banner .swiper-pagination-bullet{border-radius: 0; opacity: 0.6; width:160px; height: 24px; line-height: 24px; text-align: center; color:var(--font-color-light); background: none; border-bottom:2px solid var(--font-color-light);}
.banner .swiper-pagination-bullet-active{ opacity: 1;}
@media only screen and (min-width: 1025px){
}
@media only screen and (min-width: 1025px) {

}
    
@media only screen and (max-width: 1279px) {
    .banner,.banner .swiper-container,.banner .swiper-slide img{height: auto;}
    .banner .txt{
      top:50%;
      margin: 0;
      width: 100%;
      box-sizing: border-box;
      padding: var(--body-demo-padding);
    } 
    .banner .swiper-pagination{bottom:20px;}
    .banner .swiper-pagination-bullet{width:60px;}
    .banner .txt .demo-banner-text {
    width: 80%;
  }
}
@media only screen and (max-width: 1023px) {
  .banner .txt .demo-banner-text {
    width: 100%;
  }
}
@media only screen and (max-width:900px) {
  .banner,.banner .swiper-slide img{ height: 320px;}
}
@media only screen and (max-width:767px) {    
    .banner .swiper-pagination{bottom:10px;}
    .banner,.banner .swiper-slide{ height: 340px;}
    .banner .swiper-slide img{ display: none;}
    .banner .txt .h3{
      width: 100%;
      line-height: var(--text-line-height);
    }
}
@media only screen and (max-width:500px) {
  .banner,.banner .swiper-slide{ height: 360px;}
}
@media only screen and (max-width:400px) {
  .banner,.banner .swiper-slide{ height: 450px;}
}