/* ==========================================================================
   DH VALISE — design tokens & base
   Design canvas : PC 1366px / SP 390px
   Sizing model  : 1rem = 10 design px.
                   ルートの font-size をビューポートに連動させ、
                   キャンバス全体を等比でスケールさせる。
   ========================================================================== */

:root {
  /* --- color ------------------------------------------------------------ */
  --ink:       #49382F;   /* 本文・見出しの濃茶 */
  --gold:      #AE823C;   /* アクセントのゴールド */
  --gold-deep: #856024;
  --gold-sp:   #A37732;
  --tan:       #B39463;   /* ヘッダーバー・点線 */
  --tan-line:  #DCCBAA;   /* カード罫 */
  --tan-line2: #E3D5BB;   /* カード罫（SP 個別相談） */
  --cream:     #FBF7EF;
  --cream-2:   #FCF9F2;
  --white:     #FFFFFF;

  --cta-from:  #CE5C79;
  --cta-to:    #E78491;

  --day-1:     #DCCBAA;
  --day-2:     #D99A9F;
  --day-3:     #AEB7A2;
  --day-4:     #A98F80;

  /* --- type ------------------------------------------------------------- */
  --mincho: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN",
            "HiraMinProN-W3", "MS PMincho", serif;
  --gothic: "Noto Sans JP", "Yu Gothic", "YuGothic", "Hiragino Sans",
            "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;

  /* --- layout ----------------------------------------------------------- */
  /* デザインキャンバス（PC 1366 / SP 390）を画面中央に置いたときの左端 */
  --gut: calc(50% - 68.3rem);

  /* CTA の矢印（26×10 の線画） */
  --arrow: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 10"><g fill="none" stroke="black" stroke-width="2"><path d="M0 5h24"/><path d="M20.5 2 24 5l-3.5 3"/></g></svg>');
}

/* --- responsive root ---------------------------------------------------- */
/* PC は「デザイン幅 1366px ＋ 左右の余白 40px ずつ ＝ 1446px」を基準にする。
   余白を増減したいときは、下の 1446 と 1445.98 を
   （1366 + 余白×2）と（その値 - 0.02）に書き換えるだけで調整できる。
   例）左右 60px ずつにしたい → 1486 / 1485.98                              */
html { font-size: 10px; }                                   /* 1446px 以上：原寸 */

@media (min-width: 768px) and (max-width: 1445.98px) {      /* それ未満：等比縮小 */
  html { font-size: calc(1000vw / 1446); }
}

@media (max-width: 767.98px) {                              /* SP 390px 基準 */
  html { font-size: calc(1000vw / 390); }
  :root { --gut: calc(50% - 19.5rem); }
}

body {
  font-family: var(--gothic);
  font-size: 1.6rem;
  color: var(--ink);
  background: var(--white);
  overflow-x: hidden;
}

/* --- PC / SP 出し分け ---------------------------------------------------- */
.is-sp { display: none !important; }

@media (max-width: 767.98px) {
  .is-pc { display: none !important; }
  .is-sp { display: revert !important; }
  br.is-sp   { display: inline !important; }
  span.is-sp { display: inline !important; }
}

/* --- 読み上げ専用 -------------------------------------------------------- */
.u-sr {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}