/* ====================================
   スライダー用スタイルオーバーライド
   このファイルをslider.cssの後に読み込んでください
   ==================================== */

/* ヘッダーとスライダーが重複しないようにz-indexを調整 */
.site-header {
  z-index: 1000 !important;
  position: sticky !important;
  top: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* スライダーをヘッダーの下に配置 */
.main-slider,
.slider-section {
  position: relative !important;
  z-index: 1 !important; /* ヘッダーよりも低いz-indexを設定 */
  margin: 0 !important;
  padding: 0 !important;
}

/* スライダーの内部paddingを削除してヘッダーとの隙間をなくす */
.main-slider {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
}

/* main-contentの上部余白を調整 */
.main-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ヘッダー直後のmain-contentの余白をゼロに */
.site-header + .main-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* スライダーが最初の子要素の場合も余白なし */
.main-content > .slider-section:first-child,
.main-content > .main-slider:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* スライダーの後のコンテンツには適切な余白を設定 */
.slider-section + *,
.main-slider + * {
  margin-top: 40px !important;
}

/* スライダーのナビゲーションボタンやドットのz-index調整 */
.slider-nav,
.dots {
  z-index: 10 !important; /* スライダー内で最前面に */
}

.slide {
  z-index: 1 !important; /* デフォルトのスライド */
}

.slide.active {
  z-index: 3 !important; /* アクティブなスライド */
}

.slide.prev,
.slide.next {
  z-index: 2 !important; /* 前後のスライド */
}