@charset "utf-8";

/* ==========================================================================
   カスケードレイヤーの優先順位

   旧テーマCSS・ベンダーCSSはすべて legacy レイヤーに入れ、
   リニューアル分（css/renewal.css）を FLOCSS の各層に置く。
   これにより、新しい CSS は詳細度を上げずに旧 CSS を上書きできる。
   ※ 順序は src/scss/foundation/_layer.scss と必ず揃えること。
   ========================================================================== */
@layer legacy, foundation, layout, object;

/* 読み込み順＝legacy レイヤー内での優先順位（後勝ち） */
@import url("normalize.css") layer(legacy);
@import url("style_pc.css?version=2") layer(legacy);
@import url("style_sp.css?version=2") layer(legacy) screen and (max-width: 767px);
@import url("slick-theme.css") layer(legacy);
@import url("slick.css") layer(legacy);
@import url("../add_css/add-style.css") layer(legacy);

/* ==========================================================================
   Webフォント（@font-face はレイヤーの影響を受けない）
   ========================================================================== */
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: normal;
  font-display: swap;
  src: url('fonts/NotoSansCJKjp-DemiLight.woff2') format('woff2'),
       url('fonts/NotoSansCJKjp-DemiLight.woff') format('woff'),
       url('fonts/NotoSansCJKjp-DemiLight.ttf') format('truetype');
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: bold;
  font-display: swap;
  src: url('fonts/NotoSansCJKjp-Bold.woff2') format('woff2'),
       url('fonts/NotoSansCJKjp-Bold.woff') format('woff'),
       url('fonts/NotoSansCJKjp-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('fonts/NotoSansCJKjp-Black.woff2') format('woff2'),
       url('fonts/NotoSansCJKjp-Black.woff') format('woff'),
       url('fonts/NotoSansCJKjp-Black.ttf') format('truetype');
}

@layer legacy {
  /* 旧実装は `* { font-family: … }` で全要素に指定していたが、
     ユニバーサルセレクタのリセットは下位レイヤーや Web Components から
     上書きできなくなるため、継承ベースに置き換えている。
     フォントを継承しないフォーム部品などだけ個別に inherit させる。 */
  html,
  body {
    font-family: 'Noto Sans Japanese';
  }

  :is(input, button, textarea, select, optgroup, pre, code, kbd, samp) {
    font-family: inherit;
  }
}