@charset "UTF-8";
/* ==========================================================================
   2. Swiper共通：変数制御（色・サイズ・位置）
   ========================================================================== */
:root {
  /* --- ページネーション（ドット） --- */
  --swiper-pagination-color: #333;
  --swiper-pagination-bullet-inactive-color: #999;
  --swiper-pagination-bullet-inactive-opacity: 0.5;
  --swiper-pagination-bullet-size: 0.75rem;
  --swiper-pagination-bullet-horizontal-gap: 0.5rem;
  --swiper-pagination-bottom: 1rem;
  /* --- ナビゲーション（矢印） --- */
  --swiper-navigation-color: #333;
  --swiper-navigation-size: 1.5rem;
  --swiper-navigation-sides-offset: 1.5rem;
}

/* ==========================================================================
   3. スライダー別レイアウト設定
   ========================================================================== */
/* ① メインビジュアル */
.main-slider {
  width: 100%;
  height: 100%;
}

/* ② 回転寿司風（等速ループ） */
.flow-slider .swiper-wrapper {
  transition-timing-function: linear;
}

.flow-slider .swiper-slide {
  width: auto;
}

/* ③ 標準タイプ（ドットを外に出す余白を確保） */
.standard-slider {
  width: 100%;
  padding-bottom: 4rem;
  overflow: visible; /* 余白にはみ出した要素を見せる */
}

/* ==========================================================================
   4. UIパーツの具体的装飾（ドットとボタンを確実に実体化させる）
   ========================================================================== */
/* --- ページネーション（ドット）の強制表示 --- */
.swiper-pagination {
  /* position: absolute; */
  /* bottom: var(--swiper-pagination-bottom); */
  /* left: 0; */
  /* width: 100%; */
  /* gap: var(--swiper-pagination-bullet-horizontal-gap); */
  /* z-index: 10; */
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 min(1.042vw, 26.667px);
}

/* ドット本体：サイズを固定しないと消えて見える場合があります */
.swiper-pagination-bullet {
  width: min(0.833vw, 21.333px);
  height: min(0.833vw, 21.333px);
  background: var(--swiper-pagination-bullet-inactive-color);
  opacity: var(--swiper-pagination-bullet-inactive-opacity);
  border-radius: 50%;
  cursor: pointer;
  display: inline-block;
}

.swiper-pagination-bullet-active {
  width: min(1.042vw, 26.667px);
  height: min(1.042vw, 26.667px);
  opacity: 1;
  background: var(--swiper-pagination-color);
}

/* --- ナビゲーションボタン（矢印）の装飾 --- */
.swiper-button-prev,
.swiper-button-next {
  width: min(3.75vw, 96px);
  height: min(3.75vw, 96px);
  border: solid min(0.104vw, 2.667px) #333333;
  border-radius: 50%;
  color: var(--swiper-navigation-color);
  position: relative;
  z-index: 10;
  cursor: pointer;
}

.swiper-navigation-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
}

.swiper-button-next .swiper-navigation-icon {
  transform: translate(-35%, -50%);
  width: min(0.625vw, 16px);
}

.swiper-button-prev .swiper-navigation-icon {
  transform: translate(-75%, -50%) rotate(180deg);
  width: min(0.625vw, 16px);
}

/* 矢印アイコンのサイズ */
/* .swiper-button-prev:after,
.swiper-button-next:after {
  font-size: var(--swiper-navigation-size);
  font-weight: bold;
} */
/* ==========================================================================
   5. Swiperコア構造（ライブラリCSSが未読込でも崩れないための保険）
   ========================================================================== */
.swiper {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
}

.m_insta_list_slide_button {
  grid-column: 2/3;
  grid-row: 4/5;
  margin: min(3.333vw, 85.333px) 0 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 min(1.458vw, 37.333px);
}

@media screen and (max-width: 1000px) {
  .m_insta_list_slide_button {
    margin: clamp(32px, 8.533vw, 38.4px) 0 0 0;
    gap: 0 clamp(16px, 4.267vw, 19.2px);
  }
  .swiper-button-prev,
  .swiper-button-next {
    width: clamp(48px, 12.8vw, 57.6px);
    height: clamp(48px, 12.8vw, 57.6px);
    border: solid clamp(1px, 0.267vw, 1.2px) var(--fc_base);
  }
  .swiper-button-prev .swiper-navigation-icon {
    width: clamp(10px, 2.667vw, 12px);
  }
  .swiper-button-next .swiper-navigation-icon {
    width: clamp(10px, 2.667vw, 12px);
  }
  .swiper-pagination {
    gap: 0 clamp(10px, 2.667vw, 12px);
  }
  .swiper-pagination-bullet {
    width: clamp(10px, 2.667vw, 12px);
    height: clamp(10px, 2.667vw, 12px);
  }
  .swiper-pagination-bullet-active {
    width: clamp(14px, 3.733vw, 16.8px);
    height: clamp(14px, 3.733vw, 16.8px);
  }
}/*# sourceMappingURL=swiper-bundle.css.map */