@charset "UTF-8";
/* ==========================================================
   飛騨ほおのき平スキー場 TOP — hero_top セクション
   header / hero / status / concept の4ブロック（y0-2887）
   デザイン基準: 2xマスターJPG 実測（1440px canvas）
   ========================================================== */

/* 【案B 2026-08-01】全幅の器。背景グラデは画面いっぱいに広げ、
   中身（ナビ・見出し・カード）は .herotop__canvas の1440pxに固定する。 */
/* ==========================================================
   【2026-09-02 A-1c/top】背景ウォッシュ（淡青）はCSSグラデーションではなく
   8/31カンプの実体＝空写真EPS（unsplash）を不透明度50%で白に重ねたもの。
   spec の Placed 行どおりの位置に画像タイルを敷く（BRIEF §1）。
   PC: 1440×2559.8 を y=604.1 / 3338.3 / 6212.3（x=0）
   SP: 785.4×1396.2 を x=-195.7・y=478.2 / 1276.1 / 3144.4 / 5495.7 / 7552.1
   main の擬似要素に置くことで、セクション境界をまたぐウォッシュを1枚で通す。
   z-index:-1 ＝ 通常フローのセクションより背面・body背景より前面。
   inset:0 なのでページ高は増えない（documentが伸びない）。
   ========================================================== */
main { position: relative; }
main::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-color: #fff;
  background-image:
    url("../../img/bg/wash_pc_a50.webp"),
    url("../../img/bg/wash_pc_a50.webp"),
    url("../../img/bg/wash_pc_a50.webp");
  background-repeat: no-repeat;
  background-size: 1440px 2559.8px;
  /* 背景位置の%は「配置領域幅 − 画像幅」に対する割合なので、
     画像幅=キャンバス幅1440のとき 50% がそのままキャンバス左端(=中央合わせ)になる。
     calc(50% - 720px) と書くと720px左へずれる（実測で判明・2026-09-02）。 */
  background-position:
    50% 604.1px,
    50% 3338.3px,
    50% 6212.3px;
}
@media (max-width: 768px) {
  main::before {
    background-image:
      url("../../img/bg/wash_sp_a50.webp"),
      url("../../img/bg/wash_sp_a50.webp"),
      url("../../img/bg/wash_sp_a50.webp"),
      url("../../img/bg/wash_sp_a50.webp"),
      url("../../img/bg/wash_sp_a50.webp");
    background-size: 785.4px 1396.2px;
    /* SP: 画像幅785.4・キャンバス394・spec の x=-195.7 は
       (W-394)/2 - 195.7 = W/2 - 392.7 = 50%×(W-785.4) と一致する。 */
    background-position:
      50% 478.2px,
      50% 1276.1px,
      50% 3144.4px,
      50% 5495.7px,
      50% 7552.1px;
  }
}

.herotop {
  position: relative;
  width: 100%;
  /* 【2026-09-03 A-1c/top R3】2915→2887に復帰。縦組みに vpal を足して列長がカンプに
     揃った（3本目の実測列長 378px／カンプ379px）ため、器を伸ばす逃げが不要になった。
     news.css の padding-top も 140→168 に戻す（NEWS の絶対位置 y3062 は不変）。 */
  /* 【2026-09-03 A-1c/top R4】2887→2918.7。CONCEPT 料理写真を spec 位置（y2558.7＋h360＝下端 2918.7）
     に戻すと 2887 の器からはみ出して overflow:hidden で切れるため、器を写真の下端に合わせた。
     NEWS の絶対 y は不変にするため news.css の .news__head padding-top を 168→136.3 に相殺する。 */
  height: 2918.7px;
  overflow: hidden;
  /* 【2026-09-02 A-1c/top】旧・縦linear-gradientのウォッシュ近似は撤去（BRIEF §1）。
     ウォッシュは main::before の画像タイルが一括で担当する。 */
  background: transparent;
}


/* 【案B】1440pxのデザインキャンバス。中の絶対配置座標は一切変えない。
   overflow は外側の .herotop 側で切るので、ここは visible のままにする
   （FVが --bleed 分だけ外へ出るため）。 */
.herotop__canvas {
  position: relative;
  width: 100%;
  max-width: 1440px;
  height: 2918.7px; /* 【2026-09-03 A-1c/top R4】.herotop と同値（2887→2918.7・料理写真の下端） */
  margin: 0 auto;
}

/* ============================ HEADER ============================ */
.header {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0 38px 0 35px;
  z-index: 20;
}
.header__logo { margin-top: 35px; }
/* 【2026-09-01 A-1/T-1】カンプ実測: ロゴink x35-216（幅182・高57）／
   旧実装 x36-273（幅238・高74）＝ width:240px。同じ比率で 240×182/238 ≈ 184px。 */
.header__logo img { width: 184px; height: auto; filter: brightness(0) invert(1); }

.header__nav {
  /* 修正内容1.pdf(2026-07-29): ナビ拡大＋ページ中央揃え（ink実測 x384-1057・中心=720） */
  display: flex;
  align-items: center;
  gap: 17px; /* 実効値は base.css の `.header .header__nav { gap: 18.4px }`（詳細度が上）が正 */
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 38px;
}
.header__nav a {
  font-family: var(--font-jp);
  font-size: 17px;
  /* 【2026-08-01】600だと「ゲレンデ」の濁点が潰れて重なる（横山さん指摘）。
     大きさは変えず太さだけ1段階落とす。 */
  font-weight: 500;
  line-height: 1;
  color: #fff;
  letter-spacing: 0.02em;
  white-space: nowrap;
  /* 【2026-09-01 A-1/C-3】FV上部の濃紺スクリムを撤去したため、スライダー2枚目
     （雪面が白く飛ぶカット）でも白ナビが読めるようにテキストシャドウで担保する。
     スクリム（面）と違いカンプの見た目をほぼ変えない。 */
  text-shadow: 0 1px 3px rgba(9, 47, 84, 0.45);
}

/* 【2026-09-03 A-1c/shared R2】.nakaguro（中黒の負トラッキング）は撤去した。
   BRIEF §6-7 のとおり中点「・」は fonts/ShipporiAntiqueB1-palt.woff2 側で 0.5em に
   焼き込み済み（tools/bake_yakumono.py）＝ CSS で詰めると二重に詰まる。
   ナビ塊の幅は base.css の .header .header__nav の gap で作る（TOP／下層 共通）。 */

.header__en {
  /* 【2026-09-03 A-1c/shared R2】spec 図形: 36×36 @x1365.6,y29.5・線 0.6px #ffffff
     （旧 38×38 ＋ border 1px）。書体・サイズは base.css の .header a.header__en が正。 */
  margin-top: 29.5px;
  width: 36px; height: 36px;
  border: 0.6px solid #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-en);
  font-size: 13.5px;
  letter-spacing: 0.04em;
  color: #fff;
}

/* ============================ HERO ============================ */
/* 【案B】FVの写真だけキャンバスの外へはみ出させて画面いっぱいにする。
   --bleed = max(0, (画面幅 - 1440) / 2) を js/main.js が実測で入れる。
   1440px以下では --bleed:0 ＝ 従来と完全に同じ。 */
.hero {
  position: absolute;
  top: 0;
  left: calc(var(--bleed, 0px) * -1);
  z-index: 2; /* 直後のコラージュ写真より前面（スケール演出時の重なり対策） */
  width: calc(100% + var(--bleed, 0px) * 2);
  height: 905px;
  z-index: 1;
}
/* スライダー構造（archie準拠）: 各ペイン=overflow窓、トラックを横移動 */
.hero__pane {
  position: absolute;
  top: 0;
  width: 50%;          /* 【案B】1440pxなら720px＝従来と同値 */
  height: 905px;
  overflow: hidden;
}
/* 【2026-08-12】写真が届くまでのプレースホルダ。
   従来は背景が無く、ロゴ・見出し・英字コピーが全て白文字のため、
   写真の到着までFVが文字通り「真っ白」（青いCTAだけ見える状態）だった。
   色は各写真の平均色を、白文字が4.5:1を満たすところまで暗くした値。
   左 #4c7fad→#4879a6 (4.60:1) / 右 #637b97→#617893 (4.55:1) */
.hero__pane--left  { left: 0;   background-color: #4879a6; }
.hero__pane--right { left: 50%; background-color: #617893; }
.hero__track {
  display: flex;
  width: 100%;
  height: 100%;
  will-change: transform;
}
.hero__photo {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 【2026-09-01 A-1/C-3】FV上部の濃紺スクリム（.hero__scrim）を撤去。
   8/31カンプには無い（実測 x900,y20 で カンプ (76,108,147) / 旧実装 (25,62,99)）。
   2026-08-01に「スライダー2枚目で白ナビが読めない」対策として入れたものだが、
   面での暗転はカンプの見た目を大きく変えるため、.header__nav a の
   text-shadow に置き換えている。index.html の div.hero__scrim も削除済み。 */

/* 【2026-09-01 A-1/T-5・系統④】雪演出（.hero__snow / canvas）は藤橋さん指示で撤去。
   js/main.js の生成処理・index.html の canvas も同時に削除している。 */

/* 【2026-09-01 A-1/T-2・T-3・系統①】
   カンプは 英文コピーが上（ink y297-333）・和文見出しが下（ink y370-519）。
   旧実装は逆（見出し y368-504 → 英文 y550-）だったので上下を入れ替えた。
   見出しサイズ: カンプ ink 幅728px／旧実装 655px（153px）→ 153×728/655 ≈ 170px。 */
.hero__copy {
  position: absolute;
  margin-left: var(--bleed, 0px); /* 【案B】文字はキャンバス基準に戻す */
  left: 90px;
  top: 350px;
  margin: 0;
  /* 【2026-09-02 A-1c/top】spec実値 168px / -0.01em。
     spec の ink幅 w=808.1 は「、。が半角」の組でのみ成立する（全角だと約890px）ため
     yakuhan サブセット（句読点のみ半角）で組む。旧 170px/-0.19em は
     全角のまま字送りで詰めて幅だけ合わせていた近似。 */
  font-family: var(--font-jp-yakuhan);
  font-weight: 400;
  font-size: 168px;
  line-height: 1;
  letter-spacing: -0.01em;
  color: #fff;
  z-index: 5;
  white-space: nowrap;
}
.hero__en-copy {
  position: absolute;
  margin-left: var(--bleed, 0px); /* 【案B】文字はキャンバス基準に戻す */
  left: 106px; /* カンプ ink 左端 x108 */
  top: 285px;  /* カンプ ink 上端 y297 に合わせる */
  margin: 0;
  font-size: 53px;          /* 【2026-09-02 A-1c】spec実値 53px（旧52px） */
  line-height: 1;
  letter-spacing: 0.045em;
  /* カンプの英文はもっと濃い。旧 rgba(255,255,255,.6) → .85 */
  color: rgba(255, 255, 255, 0.85);
  z-index: 5;
  white-space: nowrap;
}

/* 【2026-09-01 A-1/T-4・系統①】ヒーローCTA。
   カンプ実測（#165CE2の面）: x106-406（幅301）・y574-643（高70）＝見出し直下の左。
   旧実装は右下（x1113-1390 / y793-860）・角丸10px・#0092e5。 */
.hero__cta {
  position: absolute;
  margin-left: var(--bleed, 0px); /* 【案B】ボタンはキャンバス基準に戻す */
  left: 106px;
  top: 574px;
  width: 301px;
  height: 70px;
  background: var(--color-primary);
  border-radius: 6px;
  display: flex;
  align-items: center;
  padding: 0 10px 0 22px; /* 【2026-09-02 A-1c】spec テキストink x128.6 = ボタン左+22.1 */
  z-index: 5;
}
.hero__cta span {
  font-family: var(--font-jp);
  font-size: 17px;        /* 【2026-09-02 A-1c】spec実値（旧13.5px） */
  color: #fff;
  letter-spacing: 0.07em; /* spec実値（旧0.01em） */
  white-space: nowrap;
}
.hero__cta-arrow {
  margin-left: auto;
  width: 26px; height: 26px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hero__cta-arrow svg { width: 13px; height: 13px; stroke: var(--color-primary); }

/* ============================ STATUS ============================ */
.status__photo {
  position: absolute;
  object-fit: cover;
  z-index: 3;
  border-radius: 2px;
}
/* 【2026-09-03 A-1c/top R3】FV左の小写真。spec のクリップパス（top_pc_spec.json #51: x283 y900 348×92）へ。
   カンプ実測でも縦エッジ x283/x631・横エッジ y900/y992 を検出（旧 left290・h85）。 */
.status__photo--chairlift { left: 283px; top: 900px; width: 348px; height: 92px; z-index: 0; }
.status__photo--family    { left: 902px; top: 900px; width: 470px; height: 218px; z-index: 0; }
/* 【2026-09-02 A-1c/top R2】CONCEPT左カラムの縦長写真。カンプ実測（comp/top_pc.png）:
   列走査 x=20 / x=100 で可視上端 y1156・下端 y1591（高さ436）、行走査 y=1500 で右端 x155（幅156）。
   旧実装は top1180 / height395 ＝ 上端が24px低く高さが41px足りなかった。
   写真自体はダミーだが枠はレイアウト値なので枠を合わせる（object-fit:cover で再クロップされる）。 */
.status__photo--skier     { left: 0;     top: 1156px; width: 155px; height: 436px; border-radius: 0; }

.status__panel {
  /* 【2026-09-01 A-1/T-6・系統③】8/31カンプでは「白の半透明」に戻っている。
     2026-07-29「修正内容1.pdf」で入れた不透明ニュートラル灰（#efefef＋1px #c9c9c9）は
     カンプと不一致のため差し戻し。
     実測（top_pc.png）: パネル内 (242,247,251) / 同yのパネル外 (207,227,245)
     → 白のかぶせ率 R:0.73 G:0.71 B:0.60（平均 約0.68）。枠線はほぼ視認できない。
     ※SPは既に rgba(241,242,243,0.81) でカンプと一致しているため据え置き。 */
  position: absolute;
  left: 181px; top: 1088px;
  width: 1078px; height: 320px;
  /* 【2026-09-02 A-1c】spec図形の実値へ: #fff op60 ＋ 線 op67 */
  background: rgba(255, 255, 255, 0.60);
  border: 1px solid rgba(255, 255, 255, 0.67);
  border-radius: 40px;
  box-shadow: none;
  z-index: 2;
}
.status__date {
  position: absolute;
  /* 【2026-09-01 A-1/T-9・系統①】カンプ ink 左端 x311（旧実装 x269）。
     パネル左181 + left + 字の左サイドベアリング2px = 311 → left:128px */
  /* 【2026-09-02 A-1c/top R2】top 35→40。カンプのインク y1134-1174 に対し実装は y1129（-5）。 */
  left: 127px; top: 40px;
  font-family: var(--font-en);
  font-feature-settings: normal;
  font-size: 53.57px;      /* 【2026-09-02 A-1c】spec実値（旧48.6px） */
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--color-text);
}
.status__heading {
  position: absolute;
  /* 【2026-09-02 A-1c/top R2】カンプ ink x524-916／旧実装 ink x495-886（29px左）。
     spec のフレーム x=522.1（左サイドベアリング約2px）に合わせて left を +29。
     実装撮影で ink 左端を実測しながら合わせた最終値: left:342（パネル境界1px込みで x=524）。
     top も 22→30（カンプのインク y1128-1178 に対し実装 y1120＝-8）。
     ※突合表はDOMコンテナxを見るため Δx-0.3 と出る＝この行は表だけでは検出できない。 */
  left: 342px; top: 30px;
  font-family: var(--font-en);
  font-feature-settings: normal;
  font-size: 72px;          /* 【2026-09-02 A-1c】spec実値（旧70.2px） */
  line-height: 1;
  letter-spacing: -0.015em; /* spec実値（旧 指定なし=0） */
  color: var(--color-primary);
}

.status__cell {
  position: absolute;
  background: #fff;
  border-radius: 12px;
}
/* 修正内容1.pdf(2026-07-29): セル・ボタンの影は廃止（フラット） */
.status__cell--weather,
.status__cell--snow,
.status__btn {
  box-shadow: none;
}
/* 【2026-09-01 A-1/T-8】天気セル幅。カンプ実測 x220-319（幅100）／旧実装 x214-327（幅114）。
   パネル左181基準で left:39px・width:100px。 */
.status__cell--weather { left: 39px;  top: 120px; width: 100px; height: 168px;
  display: flex; flex-direction: column; align-items: center; }
.status__cell--temp    { left: 159px; top: 120px; width: 202px; height: 80px; }
.status__cell--snow    { left: 159px; top: 208px; width: 202px; height: 80px; }
.status__cell--ops     { left: 377px; top: 120px; width: 322px; height: 110px; }

/* 【2026-09-01 A-1/T-7・系統②】カンプは「中心が塗りつぶし」の太陽で ink 約57px。
   旧実装は Lucide sun のアウトライン（ink 約49px＝svg 54px）。
   svgのink比は 22.7/24 なので 57 × 24/22.7 ≈ 60px。色はカンプ実測 #ffa300。 */
.status__weather-icon { margin-top: 16px; }
.status__weather-icon svg { width: 60px; height: 60px; stroke: #ffa300; color: #ffa300; fill: none; }
.status__weather-main {
  margin-top: 8px;
  font-family: var(--font-jp);
  font-size: 20.86px;      /* 【2026-09-02 A-1c】spec実値 */
  letter-spacing: 0.11em;  /* spec実値（旧0） */
  color: var(--color-text);
}
.status__weather-sub {
  margin-top: 12px;
  font-family: var(--font-jp);
  font-size: 17px;         /* 【2026-09-02 A-1c】spec実値（旧13.5px） */
  letter-spacing: 0.11em;  /* spec実値（旧0） */
  color: var(--color-label); /* spec #939494 */
}

.status__metric { position: relative; width: 100%; height: 100%; }
.status__metric-label {
  position: absolute; left: 9px; top: 22px;
  font-family: var(--font-jp);
  font-size: 17px;           /* 【2026-09-02 A-1c】spec実値（旧16.2px） */
  letter-spacing: 0.11em;    /* spec実値（旧0） */
  color: var(--color-label); /* spec #939494 */
}
/* 【2026-09-01 A-1/T-10・系統①】単位（℃ / cm）が「数値から離れて見える」のは
   単位の位置ではなく数値のサイズが小さいことが原因だった（実測で切り分け）。
   カンプ "12.5" ink x402-472(幅71)・y1228-1266(高39)
   旧実装      ink x404-461(幅58)・y1231-1259(高29)  → font-size 41.4 × 39/29 ≈ 55.5px
   字送りも カンプは詰め気味（連立で letter-spacing ≈ -0.01em）。
   単位側はカンプ ℃ x488-509 / cm x487-523 に合わせて微調整のみ。 */
.status__metric-value {
  position: absolute; left: 60px; top: 11px;
  font-family: var(--font-en);
  font-size: 54.47px;       /* 【2026-09-02 A-1c】spec実値（旧55.5px） */
  line-height: 1;
  letter-spacing: 0.005em;  /* spec実値（旧-0.01em） */
  color: var(--color-text);
}
/* 【2026-09-02 A-1c】単位（℃ / cm）の書体は spec が Meiryo-Bold。
   Meiryo はWeb配信できないため BRIEF §1 の指定どおり
   Meiryo → Hiragino Sans → Noto Sans JP の順で近似する（突合ツールの FONT は残る）。 */
.status__metric-unit {
  position: absolute; top: 33px;
  font-family: Meiryo, "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-size: 26.33px;       /* spec実値（旧25.5px） */
  font-weight: 700;
  line-height: 1;
  color: var(--color-text);
}
.status__cell--temp .status__metric-unit { left: 145.4px; letter-spacing: 0.11em; }
.status__cell--snow .status__metric-unit { left: 145.4px; letter-spacing: -0.03em; }
.status__cell--snow .status__metric-value { left: 72px; }
.status__cell--snow .status__metric-label { left: 12.3px; top: 26px; }

/* 運行状況セル */
.status__ops-label {
  position: absolute; left: 0; right: 0; top: 13px;
  text-align: center;
  font-family: var(--font-jp);
  font-size: 17px;           /* 【2026-09-02 A-1c】spec実値（旧14.4px） */
  letter-spacing: 0.11em;    /* spec実値（旧0） */
  color: var(--color-label); /* spec #939494 */
}
.status__ops-row {
  position: absolute; left: 12px; right: auto; top: 42px;
  display: flex; align-items: center; gap: 15px;
}
.status__ops-item { display: flex; align-items: center; gap: 10px; }
/* 【2026-09-02 A-1c】spec図形: 円 43.9×43.9・PC塗り #b3b4b4（SPは #a9a9aa）。
   文字は spec実値 13.68px、字送りは「コース」0.03em /「リフト」0.07em。 */
.status__pill {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 43.9px;
  height: 43.9px;
  background: #b3b4b4;
  color: #fff;
  border-radius: 50%;
  font-family: var(--font-jp-palt);
  font-size: 13.68px;
  letter-spacing: 0.03em;
  line-height: 1;
}
.status__ops-item:nth-child(2) .status__pill { letter-spacing: 0.07em; }
/* 【2026-09-01 A-1/T-11・系統①】カンプは「12/13」「4/4」が詰まっていて数字も大きい。
   実測 "4/4": カンプ ink x797-860(幅64)・高44 ／ 旧実装 x790-838(幅49)・高28。
   （旧実装の 0.12em がスラッシュ前後のアキの正体）。
   letter-spacing:0 にしたうえで、幅・高さ両方の残差が最小になる 53px を採用
   （53pxでの実測 "4/4" 幅66/高42 に対しカンプ 幅64/高44）。 */
.status__ops-num {
  position: relative;
  top: 3px;
  font-family: var(--font-en);
  font-size: 54.47px;       /* 【2026-09-02 A-1c】spec実値（旧53px） */
  line-height: 1;
  letter-spacing: 0.005em;  /* spec実値（旧0） */
  color: var(--color-text);
}

/* リフト運行状況ボタン */
.status__btn {
  position: absolute;
  left: 377px; top: 238px;
  width: 322px; height: 49px;
  background: var(--color-primary);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 22px;
}
.status__btn span {
  font-family: var(--font-jp-palt); /* カンプは文字詰めあり */
  font-size: 17px;        /* 【2026-09-02 A-1c】spec実値（旧15.3px） */
  letter-spacing: 0.11em; /* spec実値（旧0） */
  color: #fff;
}
.status__btn-arrow {
  position: absolute; right: 16px;
  width: 26px; height: 26px;
  background: #fff; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.status__btn-arrow svg { width: 13px; height: 13px; stroke: var(--color-primary); }

.status__panel-photo {
  position: absolute;
  left: 716px; top: 119px;
  width: 323px; height: 169px;
  object-fit: cover;
  border-radius: 12px;
}

/* ============================ CONCEPT ============================ */
.concept__photo {
  position: absolute;
  object-fit: cover;
  border-radius: 2px;
}
/* 【2026-09-03 A-1c/top R3】spec クリップパス #86: x249 y1350 720×460。
   カンプ実測: 縦エッジ x249（y1376..）/ x969（y1374-1809）・横エッジ y1810。
   上端59pxはステータスパネル（白60%）の下に潜る＝カンプの (300,1385)=(192,219,243) は
   写真(100,169,228)を白60%で覆った計算値(193,221,244)と一致（旧 top1421・730×401）。 */
.concept__photo--panorama { left: 249px;  top: 1350px; width: 720px; height: 460px; z-index: 1; }
/* spec クリップパス #93: x74 y1743 370×266（カンプ実測 x74/x444・y1743/y2009） */
.concept__photo--gondola  { left: 74px;   top: 1743px; width: 370px; height: 266px; z-index: 2; }
/* spec クリップパス #98: x516 y1906 360×540（カンプ実測 x516/x876・下端 y2446） */
.concept__photo--selfie   { left: 516px;  top: 1906px; width: 360px; height: 540px; z-index: 1; }
/* spec クリップパス #97: x1020 y1853 420×320（カンプ実測 x1020・上端 y1853/下端 y2173） */
.concept__photo--sled     { left: 1020px; top: 1853px; width: 420px; height: 320px; z-index: 1; }
/* spec クリップパス #105: x813 y2368 214×320（カンプ実測 x813/x1027・下端 y2688） */
.concept__photo--beer     { left: 813px;  top: 2368px; width: 214px; height: 320px; z-index: 1; }
/* spec クリップパス #857: x0 y2558.7 456×360（カンプ画素実測: 上端 y2558・下端 y2918）。
   旧 top:2527 は .herotop 2887 の内側に収めるための逃げだった＝器を 2918.7 に伸ばして spec 位置へ。 */
.concept__photo--food     { left: 0;      top: 2558.7px; width: 456px; height: 360px; z-index: 2; border-radius: 0; }

.concept__vtext {
  position: absolute;
  margin: 0;
  writing-mode: vertical-rl;
  font-family: var(--font-jp);
  /* 【2026-09-02 A-1c】spec実値 18px / 行送り33px / 0.21em（旧 17.1px・1.78・0.075em） */
  font-size: 18px;
  line-height: 33px;
  letter-spacing: 0.21em;
  /* 【2026-09-03 A-1c/top R3】縦組みでは body 既定の "palt"（横組み hmtx）が効かず
     「、」「。」が全角送りのままだった。BRIEF §6-8 のとおり vert 置換後のグリフに
     vpal（YAdvance -500）を焼き込み済みなので、縦組み要素だけ "vpal" を足す。 */
  font-feature-settings: "palt", "vpal";
  color: var(--color-text);
  z-index: 4;
}
/* top は spec の y（--2 は +21.8px、--3 は +69.6px ずれていた） */
.concept__vtext--1 { top: 1477px; right: 237px; }
.concept__vtext--2 { top: 2078px; right: 1080px; }
/* 【2026-09-03 A-1c/top R3】right 224→217.6。spec frame x=1097.9/w=117 に半行送り
   (33-18)/2=7.5 を足した 1222.4 が要素右端＝1440-1222.4。カンプのインク右端 x1213 に対し
   旧実装は x1207 で6px左寄りだった（--1/--2 は同式で既に一致）。 */
.concept__vtext--3 { top: 2496px; right: 217.6px; }

/* ============================ SP (<=768) ============================ */
@media (max-width: 768px) {
  /* 【2026-09-01 A-1 実装不具合】.herotop は SP で height:auto になっていたが、
     子の .herotop__canvas は PC用の height:2887px が効いたままだった。
     SPの中身（hero + status + concept）は 3155px あるため、
     .herotop の overflow:hidden で **concept下部が268px切り落とされていた**
     （縦書き「本物の山なのに、家族でも来られる」の後半と料理写真の下半分が消えていた。
     T-23でヒーロー高を745pxに直す前は 430px 切れていた）。
     カンプ（top_sp.jpg y2700-2960）には全文と写真全体が写っているので、
     canvas高もSPでは auto にして切り落としを止める。 */
  .herotop__canvas { height: auto; }

  .herotop {
    width: 100%;
    height: auto;
    /* 【2026-09-02 A-1c/top】背景は main::before の画像タイル（spec の Placed 位置）に一本化 */
    background: transparent;
    padding-bottom: 0;
  }

  /* header: SPカンプ(top_sp.jpg 393px)実測。透過・ロゴ＋ハンバーガーのみ */
  .header {
    padding: 17px 19px 0 14px;
    align-items: flex-start;
    background: none;
  }
  .header__logo { margin-top: 0; }
  .header__logo img { width: 116px; }
  .header__nav { display: none; }

  /* hero: SPカンプ実測（393幅・1枚構成=右ペインのみスライド）
     【2026-09-01 A-1/T-23】8/31カンプの写真下端は y745（x100/200/300/388 の4点で
     いずれも y745→746 で背景へ切り替わることを実測）。旧実装は 100svh ＝
     撮影環境で約907px あり、見出しが約66px下・CTAが約128px下にずれていた。
     100svh を上限として残し（小さい端末でCTAが画面外へ出ないため）、
     設計端末サイズではカンプどおり745pxになるようにする。 */
  .hero {
    position: relative;
    width: 100%;
    height: 745px;                 /* svh非対応ブラウザ用フォールバック */
    height: min(100svh, 745px);
    overflow: hidden;
  }
  .hero__pane--left { display: none; }
  .hero__pane--right {
    position: absolute;
    inset: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .hero__photo { object-position: 50% 35%; }
  .hero__copy {
    left: 50%; right: auto; top: 43.6%;
    /* 【2026-09-02 A-1c/top】16.5→8。spec字送りで組むと advance 388.2px になり、
       旧オフセットでは「。」が画面右端(394)で欠ける。 */
    /* 【2026-09-02 A-1c/top R2】8→2.9。palt入りサブセットで advance が 388.2→360.5 に
       変わったのに +8px のままだった。spec のフレーム x=19.6／カンプ実測の「山」インク左端 x21
       （comp/top_sp.png y290-420 拡大）に対し、旧実装は DOM range x=24.7＝右へ5.1px寄っていた。
       left:50% + translateX(-50% + 2.9px) → range x=19.6・インク右端≈373（カンプ372.5）。 */
    --intro-tx: calc(-50% + 2.9px); /* アニメ終点でも保持される（animation.css参照） */
    transform: translateX(var(--intro-tx));
    font-size: 78.58px;      /* 【2026-09-02 A-1c】spec実値（旧79px） */
    letter-spacing: -0.01em; /* spec実値（旧-0.18em）。句読点半角はPC側の yakuhan 指定で担保 */
  }
  .hero__en-copy {
    left: 50%; top: 57.3%;
    --intro-tx: -50%;
    transform: translateX(var(--intro-tx));
    font-size: 26px;
    letter-spacing: 0.045em;
  }
  .hero__cta {
    /* 【2026-09-01 A-1/T-23】カンプ実測: CTA ink y631-703／ヒーロー下端745
       → 下マージン 42px（旧 27px） */
    left: 39px; right: 38px; top: auto; bottom: 42px;
    z-index: 5;
    width: auto; height: 73px; padding: 0;
    justify-content: center;
    border-radius: 5px;
    background: var(--color-primary); /* SPカンプ実測#017ddf≈primary（PCの#0092e5と異なる） */
  }
  .hero__cta span:not(.hero__cta-arrow) {
    font-family: var(--font-jp-palt);
    font-size: 16px;         /* 【2026-09-02 A-1c】spec実値（旧15.5px） */
    letter-spacing: 0.05em;  /* spec実値（PCは0.07em） */
  }
  .hero__cta-arrow {
    position: absolute;
    right: 15px; top: 50%;
    transform: translateY(-50%);
    margin-left: 0;
    width: 25px; height: 25px;
  }

  /* ============================================================
     status: SPカンプ v2 実測（spec_sp_status_weather.json・393px基準）
     カンプ絶対y750-1640 → .statusローカルy0-890 の絶対配置コラージュ
     ============================================================ */
  .status {
    position: relative;
    height: 890px;
    padding: 0;
    /* 【2026-09-02 A-1c/top】旧・グラデ近似は撤去。ウォッシュは main::before の画像タイル。 */
    background: transparent;
  }
  /* コラージュ写真（SPでも表示・パネル背後） */
  .status__photo--chairlift { left: 30.5px; top: 0; width: 205px; height: 55px; z-index: 0; }
  .status__photo--family    { left: 117px; top: 94.5px; width: calc(100% - 117px); height: 128.5px; z-index: 0; }
  .status__photo--skier     { left: 0; top: 300px; width: 106px; height: 270px; z-index: 1; }

  /* 半透明パネル（SPカンプ準拠: rgba+角丸25・影なし） */
  .status__panel {
    left: 23px; right: 23px; top: 199.5px;
    width: auto; height: 690.5px;
    /* 【2026-09-02 A-1c/top R2】spec図形の実値へ（PCと同じ構成）。
       spec: 塗り #fff op60 ＋ 線 白グラデ op67・0.6px（BRIEF §1）。
       旧 border:1px #bcbfc2（不透明グレー）はカンプに無いヘアラインで、
       境界走査 y=1200 でカンプ(230,230,232) に対し実装(188,191,194)＝d42 だった。
       面もカンプ(236,245,252) に対し旧 rgba(241,242,243,.81) が(235,239,243)=d9。 */
    background: rgba(255, 255, 255, 0.60);
    border: 1px solid rgba(255, 255, 255, 0.67);
    border-radius: 25px;
    z-index: 2;
  }
  /* SP文字色はカンプ実測 #2d2d2d（SPのみ上書き・デザイナー確認事項） */
  .status__date,
  .status__weather-main,
  .status__metric-value,
  .status__metric-unit,
  .status__ops-num { color: #2d2d2d; }
  .status__date {
    left: 0; right: 0; top: 20px;
    text-align: center;
    font-size: 41.04px;      /* 【2026-09-02 A-1c】spec実値（旧46px） */
    letter-spacing: -0.015em; /* spec実値（旧-0.06em） */
  }
  .status__heading {
    left: 0; right: 0; top: 67px;
    text-align: center;
    font-size: 53.05px;      /* 【2026-09-02 A-1c】spec実値（旧51px） */
  }
  .status__cell { border-radius: 8px; }
  .status__cell--weather { left: 14.5px; top: 131px; width: 100px; height: 168px; }
  .status__weather-icon svg { width: 61px; height: 61px; }
  .status__weather-main { margin-top: 2px; }
  .status__weather-sub { margin-top: 11px; }
  .status__cell--temp { left: 128.5px; right: 12.5px; top: 131px; width: auto; height: 80px; }
  .status__cell--snow { left: 128.5px; right: 12.5px; top: 219px; width: auto; height: 80px; }
  .status__cell--temp .status__metric-label { left: 13px; top: 23px; }
  .status__cell--snow .status__metric-label { left: 17.5px; top: 28px; }
  .status__cell--temp .status__metric-value { left: 66px; }
  .status__cell--snow .status__metric-value { left: 78px; }
  .status__cell--temp .status__metric-unit { left: 152px; }
  .status__cell--snow .status__metric-unit { left: 151px; }
  .status__cell--ops  { left: 14.5px; right: 12.5px; top: 313px; width: auto; height: 110.5px; }
  .status__ops-label { top: 12px; }
  .status__ops-row { left: 12.5px; top: 46px; gap: 17px; }
  .status__ops-item { gap: 9px; }
  /* 【2026-09-02 A-1c】spec の SP 実値は PC と同じ 54.47px（旧34px）。
     ピル43.9＋gap9＋"12/13"約100 → 2組で約283px、セル幅321pxに収まることを実測。 */
  .status__ops-num { top: -2px; }
  .status__pill { background: #a9a9aa; } /* spec図形: SPの円は #a9a9aa */
  .status__btn {
    left: 14.5px; right: 12.5px; top: 431.5px;
    width: auto; height: 49.5px;
    border-radius: 8px;
  }
  .status__btn span { font-size: 16px; } /* 【2026-09-02 A-1c】spec実値（PCは17px） */
  .status__btn-arrow { width: 25px; height: 25px; right: 13.5px; }
  .status__panel-photo {
    left: 14.5px; top: 495px;
    width: calc(100% - 27px); height: 168.5px;
    border-radius: 8px;
  }

  /* ============================================================
     concept: SPカンプ v2 実測（spec_sp_concept.json・393px基準）
     カンプ絶対y1640-3160.5 → .conceptローカルy0-1520.5
     PC同様の絶対配置コラージュ＋縦書き（旧仮実装の縦積みを全面置換）
     ============================================================ */
  .concept {
    position: relative;
    /* 【2026-09-02 A-1c/top】1520.5→1452.5。concept下端の余白が68px多く、
       NEWS見出し以降の全セクションが同量下へずれていた
       （カンプ NEWS ink y3137／旧実装 y3205・実測）。
       concept内の最終要素は 料理写真 下端1300.5・縦書き3本目 下端1443.5 で収まる。 */
    height: 1452.5px;
    padding: 0;
    /* 【2026-09-02 A-1c/top】旧・グラデ近似は撤去。ウォッシュは main::before の画像タイル。 */
    background: transparent;
  }
  .concept__photo--panorama { left: 0; top: 0.5px; width: 323px; height: 193.5px; z-index: 1; }
  /* 【2026-09-02 A-1c/top】旧「statusパネル下に空色が13pxもぐる」パッチは、
     グラデ近似の継ぎ目を隠すためのもの。実写ウォッシュに置き換えたので撤去。 */
  .concept__photo--gondola  { left: 0; top: 289px; width: 118px; height: 121px; object-position: 62% 50%; z-index: 2; }
  .concept__photo--sled     { left: auto; right: 0; top: 424px; width: 167px; height: 128.5px; z-index: 1; }
  /* SPカンプは selfie が beer の上（PCとz順が逆） */
  .concept__photo--selfie   { left: 24.5px; top: 597px; width: 179px; height: 267.5px; z-index: 2; }
  .concept__photo--beer     { left: 120px; top: 850.5px; width: 134px; height: 201px; z-index: 1; }
  .concept__photo--food     { left: auto; right: 0; top: 1150.5px; width: 189px; height: 150px; z-index: 2; }
  .concept__vtext {
    font-size: 15px;
    line-height: 27.5px;    /* spec実値 27.5 */
    letter-spacing: 0.21em; /* 【2026-09-02 A-1c】spec実値（旧0.19em） */
    color: #2d2d2d; /* SPカンプ実測 */
  }
  .concept__vtext--1 { top: 253px; right: 154px; }
  .concept__vtext--2 { top: 652.5px; right: 36px; }
  .concept__vtext--3 { top: 1108.5px; right: 236px; }
}



/* ============================ SPハンバーガー ============================ */
.nav-toggle { display: none; }
.sp-menu { display: none; }

@media (max-width: 768px) {
  /* ヘッダー（ロゴ＋トグル）はドロワー(z50)より前面＝開いた状態でも閉じられる */
  .header { z-index: 60; }
  /* ハンバーガー: SPカンプ実測（バー24px・太さ2px・ピッチ7px・右19px/上22pxにインク） */
  .nav-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 10px;
    position: relative;
    margin: -9px -10px 0 0; /* headerのpadding(17/19)を保ちつつインク位置を合わせる */
  }
  .nav-toggle__bar {
    display: block;
    width: 24px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
  }
  .nav-toggle.is-open .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle.is-open .nav-toggle__bar:nth-child(2) { opacity: 0; }
  .nav-toggle.is-open .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* ドロワー: top_sp_2.pdf 実測（右寄せパネル 幅277・高578・#primary・右からスライドイン） */
  .sp-menu {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 50;
    pointer-events: none;
    visibility: hidden;
    transition: visibility 0s 0.45s;
  }
  .sp-menu.is-open {
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }
  .sp-menu__panel {
    position: absolute;
    top: 0; right: 0;
    width: 277px;
    max-width: 88vw;
    background: var(--color-primary);
    padding: 112px 26px 25px 44px;
    transform: translateX(100%);
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .sp-menu.is-open .sp-menu__panel { transform: none; }
  .sp-menu__logo { display: block; width: 116px; height: auto; filter: brightness(0) invert(1); }
  .sp-menu__list { margin-top: 39px; }
  .sp-menu__list li + li { margin-top: 20px; }
  .sp-menu__list a {
    display: block;
    color: #fff;
    font-size: 15.3px;
    line-height: 1;
    letter-spacing: 0.04em;
  }
  .sp-menu__en {
    margin-top: 47px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px; height: 36px;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 50%;
    color: #fff;
    font-size: 13px;
    letter-spacing: 0.04em;
  }
  .sp-menu__follow {
    margin-top: 33px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
  }
  .sp-menu__follow-label {
    color: #fff;
    font-size: 20px;
    line-height: 1;
    letter-spacing: 0.02em;
  }
  .sp-menu__sns { display: flex; }
  .sp-menu__sns svg { width: 23px; height: 23px; }
  body.is-menu-open { overflow: hidden; }

  /* 【2026-09-24】水島さん仕様「日本語／English の切替ボタンは常時表示」→ SPもヘッダーに出す（旧: ドロワー内だけ）。
     TOPのハンバーガーは 44px・margin-top -9px（.header は align-items:flex-start）＝中心 y13 → 32px の丸は margin-top -3px。
     スクロール後はハンバーガーが margin-top -2px（animation.css）＝中心 y20 → 丸は 4px。
     見た目32px・押せる範囲44px（::after）。ドロワーを開いている間はドロワー内の切替と重複するので隠す。 */
  .header a.header__en {
    display: flex;
    position: relative;
    width: 32px; height: 32px;
    margin: -3px 4px 0 auto;
    border-width: 1px;
    font-size: 12px;
  }
  .header a.header__en::after { content: ""; position: absolute; inset: -6px; }
  .js .header.is-fixed.is-scrolled a.header__en { margin-top: 4px; }
  body.is-menu-open .header a.header__en { visibility: hidden; }
}

/* ---- STATUS: 天気アイコンの種類別色（js/status.js が差し替え） ---- */
.status__weather-icon.is-cloud svg { stroke: #8a97a3; color: #8a97a3; }
.status__weather-icon.is-rain svg, .status__weather-icon.is-snow svg { stroke: #1673e2; color: #1673e2; }

/* ---- STATUS: ライブカメラ（js/status.js が写真枠を中継画像に差し替え、LIVE タグを重ねる） ---- */
.status__panel-photo.is-live { background: #d8dde2; }
.status__panel-live {
  position: absolute;
  z-index: 3;
  padding: 2px 7px 1px;
  border-radius: 3px;
  background: rgba(22, 92, 226, 0.9);
  color: #fff;
  font-size: 11px;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-decoration: none;
}

/* ==========================================================
   【2026-09-29 先方ご要望】予定営業期間（トップ）
   WEB購入ボタンと同じ左端・同じ角丸6px。面は status__panel と同じ「白60%＋白線67%」（影なし）。
   PC: ボタン（top574・高70）の下 16px ／ SP: ボタンがヒーロー下端に固定のため、ボタンの上 12px
   ========================================================== */
.hero__season {
  position: absolute;
  margin-left: var(--bleed, 0px);
  left: 106px;
  top: 660px;
  z-index: 5;
  min-width: 301px;
  padding: 12px 20px 13px 22px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.67);
  border-radius: 6px;
  font-family: var(--font-jp);
  color: var(--color-text);
}
.hero__season-label { font-size: 13px; line-height: 1.4; letter-spacing: 0.08em; color: var(--color-primary); }
.hero__season-date { margin-top: 3px; font-size: 21px; line-height: 1.4; letter-spacing: 0.04em; white-space: nowrap; }
.hero__season-wd { font-size: 0.78em; letter-spacing: 0; }
.hero__season-sep { margin: 0 0.25em; }
.hero__season-note { margin-top: 5px; font-size: 12px; line-height: 1.55; letter-spacing: 0.02em; color: #4a4a4a; }
.js .hero__season { animation: hero-copy-in 1.0s var(--ease-out-quint) 1.3s both; }
@media (prefers-reduced-motion: reduce) { .js .hero__season { animation: none; } }
@media (max-width: 768px) {
  .hero__season {
    left: 39px; right: 38px; top: auto;
    bottom: 127px; /* ボタン bottom42 + 高さ73 + 間12 */
    min-width: 0;
    padding: 9px 12px 10px;
    text-align: center;
  }
  .hero__season-label { font-size: 12px; }
  .hero__season-date { margin-top: 1px; font-size: 18px; }
  .hero__season-note { margin-top: 3px; font-size: 12px; word-break: keep-all; overflow-wrap: anywhere; }
}

/* 【2026-09-29 横山さん追加指示】FV 2枚目右をスマホだけ従来の写真に出し分ける <picture>。スライダーの並び（flex）に影響させない */
.hero__pic { display: contents; }

/* 【2026-10-01 先方ご要望】天気セルは上から「天気」→ 天気アイコン → 「晴れ」の順（気温・積雪と同じく見出しが先）。
   HTML の並びは変えず order で入れ替える（js/status.js はアイコンと文言の中身だけ差し替える） */
.status__cell--weather { justify-content: center; }
.status__weather-sub { order: -1; margin-top: 0; }
.status__weather-icon { margin-top: 8px; }
.status__weather-main { margin-top: 6px; }
@media (max-width: 768px) {
  .status__weather-sub { margin-top: 0; }
  .status__weather-icon { margin-top: 8px; }
  .status__weather-main { margin-top: 4px; }
}