@charset "UTF-8";
/* ========================================
   CLS（レイアウトシフト）対策
   トップページ専用 - functions.php で is_front_page() 時のみ読み込み
   ======================================== */
/* ========================================
   Variable
   ======================================== */
/* ========================================
   Mixin
   ======================================== */
/* -----------------------------------------------
   Instagram埋め込みコンテナの高さ固定
   embed.jsが展開しても高さが変わらないよう固定値を使用
   デスクトップのみ: モバイルはコンテンツ依存のまま
   ----------------------------------------------- */
.p-instagram__item {
  overflow: hidden;
}
@media (min-width: 769px) {
  .p-instagram__item {
    height: 540px !important;
  }
}

.p-instagram__item .instagram-media {
  min-height: 480px !important;
  max-height: 540px !important;
}

/* -----------------------------------------------
   ヒーローセクションの高さを明示的に固定
   contain: layout size の代わりに height で直接指定
   ----------------------------------------------- */
.l-hero {
  height: 100svh;
  overflow: hidden;
}

.l-hero-bg {
  position: absolute;
  inset: 0;
}

.l-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

/*# sourceMappingURL=cls-fix.css.map */
