@charset "UTF-8";
/* ==========================================================
   飛騨ほおのき平スキー場 — fix-1001.css
   【2026-10-01 午後 横山さんご要望（Chatwork 14:43〜15:08・HP修正③）】全ページの最後に読み込む修正
   各ルールの頭に依頼番号（deliverables/修正_2026-10-01b/README.md のチェックリスト）を付ける
   ========================================================== */

/* ---- A16 改行: 日本語は語の途中で改行しない（js/linebreak.js が文節の切れ目に <wbr> を入れてから有効にする）
   入りきらない長い語だけは overflow-wrap:anywhere で折り返す（横はみ出し防止） ---- */
html[lang="ja"].lb-ready body { word-break: keep-all; overflow-wrap: anywhere; }
/* 両端そろえで行を組んだ本文は従来の組み（linebreak.js が data-lb-off を付ける） */
html[lang="ja"].lb-ready body [data-lb-off] { word-break: normal; overflow-wrap: normal; }

/* ---- A1 PC フッター: いちばん下までスクロールした時、フッター上端がヘッダー（76px）のすぐ下で止まる高さにする
   --vhz は js/main.js が出す「ズームを戻した画面の高さ」。最大は元の高さ 901px、最小は中身が入る 560px ---- */
@media (min-width: 769px) {
  .footer { height: min(901px, max(560px, calc(var(--vhz, 100vh) - 76px))); }
}

/* ---- A12 スマホ等でページ端を引っ張った時に白地が見えないよう、ページの外側をフッター下端の色に・引っ張り自体も止める ---- */
html { background-color: #5a87bb; overscroll-behavior-y: none; }
/* html に地色を付けると body の白がページの外側へ出なくなり、body の白地が main::before（z-index:-1 の淡青ウォッシュ）を覆ってしまう。
   body を重なりの基準（isolation）にして、ウォッシュを body の白地より手前に戻す（見た目は従来どおり・位置指定は変えない） */
body { isolation: isolate; }

/* ---- A2 PC トップ: 楽しみ方の紹介（howto）→ MOVIE の間隔を、上の継ぎ目（体験→楽しみ方 159px）にそろえる（208→159） ---- */
@media (min-width: 769px) {
  section.movie { padding-top: 47px; }
}

/* ---- A11 SP トップ ACCESS: 上下の余白を他の継ぎ目にそろえる（上 97→65・下 81→59）、地図を 1.3 倍にして岐阜県を中央へ ---- */
@media (max-width: 768px) {
  section.movie { padding-bottom: 32px; }
  .access .access__inner { padding-bottom: 30px; }
  .access .access__mapwrap { overflow: hidden; }
  .access .access__mapwrap .access__map { transform-origin: 40.2% 54.7%; transform: translate(9.8%, -4.7%) scale(1.3); }
  .access .access__pin--dot, .access .access__pinlabel--logo { left: 60.1%; top: 40.6%; }
}

/* ---- A5 アクセスページの地図: 1.3 倍にして岐阜県を中央へ（PC・SP）。ピンとロゴは大きさそのまま位置だけ移す
   岐阜県の中心＝素材上 (40.2%, 54.7%)／高山（ピン）＝ (48%, 47.5%) → 拡大・移動後 (60.1%, 40.6%) ---- */
.ac-illust .ac-illust__wrap { overflow: hidden; }
.ac-illust .ac-illust__img { transform-origin: 40.2% 54.7%; transform: translate(9.8%, -4.7%) scale(1.3); }
.ac-illust .ac-illust__pin, .ac-illust .ac-illust__label { left: 60.1%; top: 40.6%; }

/* ---- A8 SP トップ: スクロール後のヘッダーでロゴが上寄せのまま（中心が ENボタン・メニューより約5px上）→ 中心をそろえる ---- */
@media (max-width: 768px) {
  .js body:has(.herotop) .header.is-fixed.is-scrolled .header__logo { margin-top: 4.5px; }
}

/* ---- A10 SP トップ 体験ピックアップ: 詳しく見るボタンを説明の右へ上げ、カード下の余白をなくす（4枚とも・PCと同じ並び） ---- */
@media (max-width: 768px) {
  .experience .experience__body { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name name" "meta more"; padding-bottom: 14px; }
  .experience .experience__meta { margin-right: 0; }
  .experience .experience__meta-desc { word-break: keep-all; overflow-wrap: normal; }
  /* ボタンは文字に合わせた幅にして、左の「40分〜2時間」「16歳以上」が途中で折り返さない幅を残す */
  .experience .experience__more { justify-self: end; align-self: center; width: auto; gap: 10px; padding: 0 11px 0 16px; margin: 0 14px 0 10px; }
  /* 英語版は「Learn more」と「About 70 min」が長いので、字送りを少し詰めて同じ並びに収める */
  html[lang="en"] .experience .experience__meta { letter-spacing: 0.02em; }
  html[lang="en"] .experience .experience__more { gap: 8px; padding: 0 9px 0 13px; letter-spacing: 0.01em; }
}

/* ---- A14 SP 料金 ACTIVITY: 「詳細」ボタンを青帯の中に余白を持って収める（帯 48→58・ボタン 44→36、押せる範囲は ::after で 44px 以上） ---- */
@media (max-width: 768px) {
  .price-activity .price-activity__bar { min-height: 58px; }
  .price-activity .price-activity__btn { position: relative; height: 36px; }
  .price-activity .price-activity__btn::after { content: ""; position: absolute; inset: -5px -4px; }
}

/* ---- A15 SP スクール: SAJ・JSBA のカードはスクール名・英字ラベル・ボタンを本文の左にそろえる（中央そろえをやめる） ---- */
@media (max-width: 768px) {
  #schools .sj-photocard__label,
  #schools .cx-photocard__title { text-align: left; }
  #schools .cx-photocard__actions { justify-content: flex-start; }
}

/* ---- A3 ゲレンデ概要 リフト数: 「クワッド1基・ペア3基／4基」の数字を他の項目と同じ大きさに（数字は .c-num、文字は .g-unit） ---- */
.g-ovcard__value--lifts { display: flex; align-items: baseline; flex-wrap: nowrap; white-space: nowrap; }
.g-ovcard__value--lifts .g-unit { margin: 0 2px; }
.g-ovcard__value--lifts .g-unit:first-child { margin-left: 0; }
/* PC：単位の文字（26.33px・字送り0.11em）のままだと値の欄 323px に入らず、左列のカードが 615→667px に広がって右列が画面外へ出た
   → 単位だけ 22px・字送り0.05em に詰めて欄内に収める（数字 54.47px は他の項目と同じ） */
@media (min-width: 769px) {
  html[lang="ja"] .g-ovcard__value--lifts .g-unit { font-size: 22px; letter-spacing: 0.05em; margin: 0 1px; }
  html[lang="ja"] .g-ovcard__value--lifts .g-unit:first-child { margin-left: 0; }
}
/* SP：リフト数は単位の文字だけ少し詰め、数字は他の項目と同じ大きさのまま枠内に収める（入りきらない端末では「／」の後で折り返す） */
@media (max-width: 768px) {
  .g-ovcard__value--lifts { flex-wrap: wrap; white-space: normal; }
  .g-ovcard__value--lifts .g-unit { font-size: 13px; letter-spacing: 0.02em; margin: 0 1px; }
}

/* ---- B5 大会情報: 3件を外したあとの1行（青帯の上・白文字） ---- */
.ev-band .ev-empty { margin: 8px 0 0; color: #fff; font-size: 18px; line-height: 1.8; letter-spacing: 0.08em; }
@media (max-width: 768px) { .ev-band .ev-empty { font-size: 15px; } }

/* ---- A10 の追従: トップSPの淡青ウォッシュ（main::before の画像5枚・縦位置は px 固定）を、体験カードを詰めた分だけ上へ送る
   体験セクションの高さ 実測 JA 1969→1760（−209）／EN 1969→1778（−191）。4枚目（体験の下端〜HOW TO ENJOY）と5枚目（MOVIE〜ACCESS）だけ動かす */
@media (max-width: 768px) {
  main:has(> .herotop)::before { background-position: 50% 478.2px, 50% 1276.1px, 50% 3144.4px, 50% 5286.7px, 50% 7343.1px; }
  html[lang="en"] main:has(> .herotop)::before { background-position: 50% 478.2px, 50% 1276.1px, 50% 3144.4px, 50% 5304.7px, 50% 7361.1px; }
}

/* ---- A17 SP 見出しは本文より大きく（機械チェック tools/headcheck.js で違反を出した箇所だけ直す） ----
   料金・レンタルの各セット名（青帯）12.53px が下の［内容］13px より小さかった → 15px */
@media (max-width: 768px) {
  .price-set .price-set__title { font-size: 15px; letter-spacing: 0.08em; }
  /* スクール・海外向けスクールの白カード見出し（青帯）12.53〜13px が本文 15px・中文 14.88px より小さかった → 16px */
  .cx-wcard .cx-wcard__title { font-size: 16px; }
  /* アクセスの方面別カード見出し（青ピル）13px が経路の本文 14px より小さかった → 16px */
  .ac-route .cx-wcard__title { font-size: 16px; }
  /* 施設案内（総合案内所「受付業務」・リフト券売り場「場所」）の見出し 15px が本文 15px と同じだった → 17px */
  .cx-sec .fc-info2__title { font-size: 17px; }
  /* ゲレンデ「滑走用具ごとのご利用可否」16px が表の中身 16px と同じだった → 18px（PC と同じ） */
  .g-gl .g-gl__title { font-size: 18px; }
}