/* スライドのアニメーションを設定 */
.swiper-slide {
  opacity: 0 !important;
  transform: none !important;
}

.swiper-slide-active {
  opacity: 1 !important;
}

/* スライドの移動を完全に無効化 */
.swiper-wrapper {
  transform: none !important;
  translate: none !important;
  transition-property: none !important;
}

/* 各スライドの位置を固定 */
.swiper-slide {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

/* ページネーションエリアのスタイル */
.swiper-pagination {
  position: absolute !important;
  bottom: 40px !important;
  right: 155px !important;
  left: auto !important;
  width: auto !important;
  text-align: right !important;
  z-index: 10 !important;
}

/* 左右の矢印も同じエリアに配置 */
.swiper-button-prev,
.swiper-button-next {
  top: auto !important;
  bottom: 29px !important;
  color: #fff;
}

.swiper-button-prev:after,
.swiper-button-next:after {
  font-size: 14px;
}

.swiper-button-prev {
  left: auto !important;
  right: 254px;
}

.swiper-button-next {
  right: 116px;
}

/* ページネーションドットのスタイル */
.swiper-pagination-bullet {
  width: 8px !important;
  height: 8px !important;
  margin: 0 4px !important;
  background: #fff !important;
  opacity: 0.5 !important;
}

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

@media screen and (max-width:1200px) {
  .swiper-pagination {
    bottom: 14px !important;
    position: absolute;
    left: 50% !important;
    transform: translateX(-50%) !important;
    right: auto !important;
  }

  .swiper-button-next {
    right: 39%;
    bottom: 0.5% !important;
  }

  .swiper-button-prev {
    bottom: 0.5% !important;
    right: 58.3% !important;
  }

  .swiper-pagination-bullet {
    width: 12px !important;
    height: 12px !important;
  }
}

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

  .swiper-button-next {
    right: 25%;
    bottom: 0.5% !important;
  }

  .swiper-button-prev {
    bottom: 0.5% !important;
    right: 67% !important;
  }

}