.swiper-container{
  position: relative;
  width: 100%;
}
.swiper-slide {
  overflow: hidden;
}
.swiper-slide img {
  height: auto;
  width: 100%;
  display: block;
}
.swiper-text {
  color: #fff;
  left: 5%;
  position: absolute;
  text-shadow: 1px 1px 2px #333;
  top: 50%;
  width: 60%;
}
.swiper-title {
  font-size: clamp(16px, 3vw, 50px);
  font-weight: 700;
}
.swiper-desc {
  font-size: clamp(12px, 2vw, 30px);
  line-height: 1.5;
  margin-top: 3%;
}

.swiper-container .swiper-pagination{
  bottom: -15px!important;
}


.s-four-box {
  position: absolute;
  display: flex;
  width: 100%;
  left: 0;
  bottom: 0;
  height: 10%;
  padding: 0 1em;
  background: rgb(255, 255, 255);
  opacity: 0.4;
  align-items: center;
}

.s-four-box > samp {
  color:#00107b;
  font-size: clamp(15px, 2vw, 20px);
}

.swiper-slide-active .s-four-box {
  animation: slideFromRightBox 3s ease 0s 1 normal;
}

@keyframes slideFromRightBox {
  0%, 65% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0px);
  }
}