/* Swiper のオーバーレイ調整 */
.custom-swiper-container-top {
  overflow: hidden;
}

.custom-swiper-slide-top img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767px) {
  .swiper-pagination-bullet {
    background-color: #C7C7C7 !important;
    /* ゴールド系の黄色 */
    width: 10px !important;
    /* 幅の調整 */
    height: 10px !important;
    /* 高さの調整 */
    margin: 0 10px !important;
    /* 左右の間隔を16px (合計32px) */
  }

  /* アクティブなページの色 */
  .swiper-pagination-bullet-active {
    background-color: #FC0 !important;
    /* 濃い目の黄色 */
  }
}

@media (min-width: 768px) {
  .swiper-pagination-bullet {
    width: 10px !important;
    /* 幅の調整 */
    height: 10px !important;
    /* 高さの調整 */
    margin: 0 15px !important;
    /* 左右の間隔を16px (合計32px) */
  }

  .swiper-pagination-bullet-active {
    background-color: #FC0 !important;
    /* 濃い目の黄色 */
  }
}


#swiper-pc .swiper-slide:first-child,
#swiper-sp .swiper-slide:first-child {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important;
  z-index: 3 !important;

  transition: none !important;
}

/* wrapper を相対配置 */
#swiper-pc .swiper-wrapper,
#swiper-sp .swiper-wrapper {
  position: relative;
  overflow: hidden;
  clip-path: none !important;
  /* 一旦全体を表示 */
}

/* すべてのスライドを絶対配置して重ねる */
#swiper-pc .swiper-slide,
#swiper-sp .swiper-slide {
  position: absolute;
  inset: 0;
  /* top:0; right:0; bottom:0; left:0 */
  transform: none !important;
  /* デフォルトの横スライド移動を無効化 */
  z-index: 1;

  /* 初期は見えない */
  clip-path: polygon(0 0, 0 0, 0 0, 0 0) !important;
  transition: clip-path 1000ms ease !important;
}

/* 自作の Prev クラスも背面に残しておく */
#swiper-pc .swiper-slide-prev,
#swiper-sp .swiper-slide-prev {
  z-index: 2;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important;
}

/* アクティブスライドだけ上書きワイプ */
#swiper-pc .swiper-slide-active,
#swiper-sp .swiper-slide-active {
  z-index: 3;
  /* いつも前面 */
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important;
}

/* Active でも Prev でもないものだけ隠す */
#swiper-pc .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev),
#swiper-sp .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev) {
  clip-path: polygon(0 0, 0 0, 0 0, 0 0) !important;
}