@charset "UTF-8";

/*--------------------------------------------------------
　Snow Monkey Blocks スライダーカスタマイズ
--------------------------------------------------------*/

/* =======================================
　SMBスライダー 高さとトリミング設定
======================================= */

/* スライダー全体の高さを100vh-120pxに設定 */
.wp-block-snow-monkey-blocks-spider-slider {
  height: calc(100vh - 120px) !important;
  min-height: 300px !important;
  overflow: hidden;
}

/* スライダーキャンバスの高さ調整 */
.wp-block-snow-monkey-blocks-spider-slider .spider {
  height: 100% !important;
}

.wp-block-snow-monkey-blocks-spider-slider .spider__canvas {
  height: 100% !important;
}

/* 各スライドの高さ調整 */
.wp-block-snow-monkey-blocks-spider-slider .spider__slide {
  height: 100% !important;
}

/* 画像ラッパーの調整 */
.wp-block-snow-monkey-blocks-spider-slider .smb-spider-slider__figure-wrapper {
  height: 100% !important;
  width: 100% !important;
  position: relative;
  overflow: hidden;
}

/* 画像のトリミング設定 */
.wp-block-snow-monkey-blocks-spider-slider .spider__figure {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  /* 中心をフォーカルポイントに */
  display: block !important;
}

/* =======================================
　レスポンシブ対応
======================================= */

/* タブレット */
@media screen and (max-width: 1023px) {
  .wp-block-snow-monkey-blocks-spider-slider {
    min-height: 250px !important;
  }
}

/* スマートフォン */
@media screen and (max-width: 767px) {
  .wp-block-snow-monkey-blocks-spider-slider {
    min-height: 200px !important;
  }
}

/* =======================================
　メインビジュアル用の調整
======================================= */

/* メインビジュアルエリアでの使用時 */
.hero-section .wp-block-snow-monkey-blocks-spider-slider,
.main-visual .wp-block-snow-monkey-blocks-spider-slider {
  height: calc(100vh - 120px) !important;
  min-height: 300px !important;
}

/* =======================================
　パフォーマンス最適化
======================================= */

/* 動きを抑える設定を持つユーザー向け */
@media (prefers-reduced-motion: reduce) {
  .wp-block-snow-monkey-blocks-spider-slider .spider__slide {
    transition-duration: 0.3s !important;
  }
}

/* =======================================
　その他の調整
======================================= */

/* スライダー内のテキストオーバーレイがある場合の調整 */
.wp-block-snow-monkey-blocks-spider-slider .smb-spider-slider__item {
  height: 100% !important;
}

/* アスペクト比を無視して高さ優先 */
.wp-block-snow-monkey-blocks-spider-slider[style*="aspect-ratio"] {
  aspect-ratio: unset !important;
}

/* 既存のインラインスタイルを上書き */
.wp-block-snow-monkey-blocks-spider-slider[style*="height"] {
  height: calc(100vh - 120px) !important;
}