@charset "UTF-8";
/* ==========================================================
   facility.html — ページ固有CSS（接頭辞 .fc- のみ）
   デザイン言語: deliverables/design-language_2026-09-03.md
   共通部品は css/components.css（.cx-）。ここは facility 固有の並べ方だけ。

   【2026-09-03 D-1 R2 修正ラウンド】
   ・.cx-lodge__photo の aspect-ratio が column flex の min-height:auto に
     上書きされ、写真が実寸で描画されていた（EBiSU 615×819 等）→ min-height:0 で是正
   ・青バーは「施設名（左）＋白ボタン（右）」の1行組みに戻す（カンプ hour_pc RENTAL LODGE）
     ＝ 種別ピルの段積みを廃止。上下パディングを入れて2行名でも窮屈にしない
   ・グリッドの空きセルに注記を差し込む穴埋めをやめ、セクション末尾の左揃え注記にする
   ・INFORMATION を全幅ベタ青ブロック（.cx-bluesec）に置き換えて章を切る

   【2026-09-03 D-1 R4 修正ラウンド（crit2 グループB）】
   ・淡青ウォッシュはページ側で配置せず、共通の .cx-wash（components.css）に統一
     ＝ <main class="subpage cx-wash">。ページ側の background-image 指定は撤去した
   ・INFORMATION の白カードは、現行 facility.html の受付業務を逐語で載せた1枚だけにする
     （3枚不等高＋中身の無いカード＋未確定の固有名詞 SAJ/JSBA の追記を解消）
   ・ロッジ最終行は3列に2枚＝右に穴が空くので、2列（写真3:2）で行を閉じる
   ・青バーの白ボタンが施設名の長い軒で縮む（165.3→157.6px）ので flex 縮小を止める
   ・TICKET の .cx-btn--auto が親幅（402.9px）まで伸びるのを fit-content で止める
   ・SP の白ボタン9個が 43.8px（カンプ実値）で 44px を 0.2px 割るので切り上げる

   【components.css へ昇格候補】
   ・.fc-lodgegrid / --2 / --sm … ロッジカードの可変グリッド
   ・.fc-cardlabel              … 青カード内の白い小見出し（17 / 0.11em / #fff）
   ========================================================== */

/* 0. ページ背景の淡青ウォッシュ … components.css の .cx-wash に集約（ページ側では持たない） */

/* ---- イントロ（ページリード。中央揃えはリードとCTAだけ） ---- */
.fc-intro__inner { text-align: center; }
.fc-intro__inner .cx-lead { margin-top: 18px; }

/* ---- セクション導入文（見出し→直下 44px の既定） ---- */
.fc-lead { margin-bottom: 44px; }

/* ==========================================================
   ロッジ・レストラン（8軒を「同じカードの反復」に見せない）
   3-a 大2軒 → 3-b フィーチャー1軒（青カード）→ 3-c 標準3軒 → 3-d 残2軒
   カンプ hour_pc RENTAL LODGE の実測: 青バー 91px・行ピッチ 407px（400幅・写真3:2）
   ========================================================== */
.fc-lodgegrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 36px;
  row-gap: 36px;
}
.fc-lodgegrid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 42px;
}
.fc-lodgegrid + .fc-lodgegrid { margin-top: 36px; }
.fc-lodgegrid--after { margin-top: 36px; }

/* 【R2 修正】.cx-lodge を column flex にすると、フレックスアイテムの既定
   min-height:auto が img の実寸高さを下限にして aspect-ratio を無効化する
   （実測 615×819 / 400×400）。min-height:0 と overflow:hidden で指定値に戻す。
   .fd-gallery__item（facility-detail.css）は元から同じ書き方で正しく出ている。 */
.fc-lodgegrid .cx-lodge { display: flex; flex-direction: column; }
.fc-lodgegrid .cx-lodge__photo { flex: none; min-height: 0; overflow: hidden; }
.fc-lodgegrid .cx-lodge__bar {
  flex: 1 1 auto;
  /* min-height だけで高さを作ると、施設名が2行になる軒（レストハウス飛岳銀嶺荘）で
     上下余白が2pxまで潰れる。パディングで高さを作り min-height は下限として残す。 */
  padding: 16px 16px 16px 26px;
}
.fc-lodgegrid .cx-lodge__name { min-width: 0; }
/* 施設名が2行になる軒（レストハウス飛岳銀嶺荘）でボタンが縮んで
   同じ行の他カード（165.3px）と幅が揃わなくなるのを止める */
.fc-lodgegrid .cx-lodge__bar .cx-btn { flex: 0 0 auto; }

/* 大きく見せる版: 写真 3:2（615×410） */
.fc-lodge--lg .cx-lodge__photo { aspect-ratio: 3 / 2; }

/* フィーチャー（写真ブリードの青カード） */
.fc-feature { margin-top: 36px; }

/* セクション末尾の注記（カンプはグリッドの外・左揃え） */
.fc-sectionnote { margin-top: 28px; }
.fc-sectionnote .cx-note + .cx-note { margin-top: 10px; }

/* TICKET の白ボタン: .cx-btn--auto は width:auto なので、ブロック幅（402.9px）まで
   伸びてしまう。文言が8文字で 165.3px 固定にはできないため内容幅に収める。 */
.fc-ticket .cx-photocard__actions { display: flex; }
.fc-ticket .cx-btn--auto { width: fit-content; flex: 0 0 auto; }

/* 青カード内の白い小見出し */
.fc-cardlabel {
  margin-top: 22px;
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0.11em;
  font-weight: 400;
  color: #fff;
}

/* ==========================================================
   INFORMATION（全幅ベタ青ブロック）
   カンプ hour_pc LIFT TICKET と同じ「全幅の青ベタ＋白カード」で章を切る。
   ========================================================== */
.fc-info { margin-top: 96px; }
.fc-info .cx-text { color: #fff; }
.fc-info__lead { max-width: 840px; margin-bottom: 40px; }
/* 白カードは「受付業務」1枚だけ。リードと同じ 840px の列に左揃えで置く */
.fc-info__card { max-width: 840px; }
.fc-info__note { margin-top: 28px; color: #fff; }
/* 白カード内の一覧は本文墨のまま（.fc-info .cx-text の白指定を継がせない） */
.fc-info .cx-wcard .cx-list li { color: var(--cx-ink); }
.fc-info .cx-wcard .cx-list li.cx-tbd { color: var(--cx-gray-aa); }

/* ==========================================================
   SP（〜768px）
   ========================================================== */
@media (max-width: 768px) {
  /* 和文の語中改行を止め、<wbr> を入れた位置だけで折り返す（enjoy.css / apply.css と同じ方針） */
  .fc-intro__inner .cx-lead,
  .fc-lead,
  .fc-sectionnote .cx-note,
  .fc-info__lead,
  .fc-info .cx-wcard .cx-list li,
  .fc-info__note,
  .fc-ticket .cx-photocard__text {
    word-break: keep-all;
    line-break: strict;
    overflow-wrap: break-word;
  }

  .fc-intro__inner .cx-lead { margin-top: 12px; }
  .fc-lead { margin-bottom: 24px; }

  .fc-lodgegrid,
  .fc-lodgegrid--2 { grid-template-columns: minmax(0, 1fr); column-gap: 0; row-gap: 15px; }
  .fc-lodgegrid + .fc-lodgegrid { margin-top: 15px; }
  .fc-lodgegrid--after { margin-top: 20px; }
  .fc-lodgegrid .cx-lodge__bar { padding: 12px 12px 12px 18px; }

  /* タッチターゲット44px。components.css の SP 白ボタンはカンプ実値 144.6×43.8 で
     0.2px だけ 44px を割る（実測 43.8×9個）。facility-detail.css の小ボタン
     （43.5→44）と同じ扱いに揃えて切り上げる。幅・字送りはカンプのまま。 */
  .fc-lodgegrid .cx-btn--white,
  .fc-feature .cx-btn--white,
  .fc-ticket .cx-btn--auto { min-height: 44px; }

  /* 標準サイズの軒は写真を低くして、大2軒（3:2＝233px）との階層を残す */
  .fc-lodgegrid--sm .cx-lodge__photo { aspect-ratio: 16 / 9; }

  .fc-feature { margin-top: 20px; }
  .fc-sectionnote { margin-top: 20px; }
  .fc-cardlabel { margin-top: 16px; font-size: 14px; }

  .fc-info { margin-top: 60px; }
  .fc-info__lead { margin-bottom: 22px; }
  .fc-info__card { max-width: none; }
  .fc-info__note { margin-top: 18px; }
}

/* ==========================================================
   【2026-09-04 D-1 担当3】写真ブリード青カード（.cx-photocard）のグラデーション
   カンプ実測に合わせて components.css の ::after を各ページで上書き（components.css は編集不可）。
   ・PC: spec 図形 y3676.4 x120 740.7x340 GRAD LINEAR ang=180 0%:#1673e2@0 -> 36.4%:#1673e2@100
     ＝不透明終端 x591.1／完全透明 x860.7。写真要素の左端は x588 なので、そこからの相対で
     α=1 が 3.1px・α=0 が 272.7px（フェード区間 269.6px）。
     旧値の 45% は要素幅依存で、写真幅 732px のカード＝329px、612px のカード＝275px とページ間でバラついていた。
   ・カーブは直線。spec のストップは 2 点（mid=50）＝線形で、カンプ画像の画素実測（列ごとの
     y方向 std を α=0 帯で正規化した 1-α プロファイル）も x600/620/…/840 で 0.033/0.102/…/0.925 と
     線形式 0.033/0.107/…/0.923 に一致した。よって多段の sin イージングは使わない
     （sin イージングは中間で最大 Δα=0.076 ずれ、雪面では R で約 13 階調の差になる）。
   ・SP: components.css は display:none でハードエッジ。カンプ spec SP は y3813.5 x7 380x91.9 の GRAD 36.4%
     ＝33.4px の縦フェード（画素実測でも純青が y3868 で終わり y3906 で写真100%）。写真上端から 0→33.4px の直線で再現する。
   ※ components.css へ昇格候補。apply.css（apply-*.html 6ページ）と school-saj.css は編集対象外のため未反映。
   ========================================================== */
.cx-photocard__photo::after {
  background: linear-gradient(90deg, rgba(22, 115, 226, 1.000) 3.1px, rgba(22, 115, 226, 0.985) 26.9px, rgba(22, 115, 226, 0.941) 50.6px, rgba(22, 115, 226, 0.861) 77.3px, rgba(22, 115, 226, 0.760) 104.0px, rgba(22, 115, 226, 0.640) 130.8px, rgba(22, 115, 226, 0.530) 151.5px, rgba(22, 115, 226, 0.404) 175.3px, rgba(22, 115, 226, 0.278) 202.0px, rgba(22, 115, 226, 0.166) 228.7px, rgba(22, 115, 226, 0.078) 255.5px, rgba(22, 115, 226, 0.022) 279.2px, rgba(22, 115, 226, 0.000) 300.0px);
}
.cx-photocard--rev .cx-photocard__photo::after {
  background: linear-gradient(270deg, rgba(22, 115, 226, 1.000) 3.1px, rgba(22, 115, 226, 0.985) 26.9px, rgba(22, 115, 226, 0.941) 50.6px, rgba(22, 115, 226, 0.861) 77.3px, rgba(22, 115, 226, 0.760) 104.0px, rgba(22, 115, 226, 0.640) 130.8px, rgba(22, 115, 226, 0.530) 151.5px, rgba(22, 115, 226, 0.404) 175.3px, rgba(22, 115, 226, 0.278) 202.0px, rgba(22, 115, 226, 0.166) 228.7px, rgba(22, 115, 226, 0.078) 255.5px, rgba(22, 115, 226, 0.022) 279.2px, rgba(22, 115, 226, 0.000) 300.0px);
}
@media (max-width: 768px) {
  .cx-photocard__photo::after,
  .cx-photocard--rev .cx-photocard__photo::after {
    display: block;
    background: linear-gradient(180deg, rgba(22, 115, 226, 1.000) 0.0px, rgba(22, 115, 226, 0.985) 3.5px, rgba(22, 115, 226, 0.941) 7.0px, rgba(22, 115, 226, 0.861) 11.0px, rgba(22, 115, 226, 0.760) 15.0px, rgba(22, 115, 226, 0.640) 18.9px, rgba(22, 115, 226, 0.530) 22.0px, rgba(22, 115, 226, 0.404) 25.5px, rgba(22, 115, 226, 0.278) 29.5px, rgba(22, 115, 226, 0.166) 33.4px, rgba(22, 115, 226, 0.078) 37.4px, rgba(22, 115, 226, 0.022) 40.9px, rgba(22, 115, 226, 0.000) 44.0px);
  }
}

/* ==========================================================
   【2026-09-16 打ち合わせ反映】ロッジ8軒を同じカードに統一
   ・詳細ページ廃止 → 青バーの白ボタンは各施設の公式サイト（外部）
   ・カードの下に白い本文（設備タグ／名物＝料理写真＋料理名＋説明／TEL）
   ・写真 3:2・2列×4段（SP 1列）。フィーチャー1軒＋大小の混在をやめ、8軒を等価に扱う
   ========================================================== */
.fc-lodge { display: flex; flex-direction: column; background: #fff; }
.fc-lodge .cx-lodge__photo { aspect-ratio: 3 / 2; }
.fc-lodgegrid .fc-lodge .cx-lodge__bar { flex: 0 0 auto; }
.fc-lodge__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 22px 26px 26px;
}
.fc-lodge__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.fc-lodge__dish {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  column-gap: 18px;
  align-items: start;
}
.fc-lodge__dishphoto {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 6px;
}
.fc-lodge__dishphoto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fc-lodge__dishlabel {
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.11em;
  color: var(--cx-blue);
}
.fc-lodge__dishname {
  margin-top: 8px;
  font-size: 17px;
  line-height: 25px;
  letter-spacing: 0.05em;
  color: var(--cx-ink);
}
.fc-lodge__dishtext {
  margin-top: 6px;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.04em;
  color: var(--cx-ink);
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
}
.fc-lodge__dishnote { display: block; margin-top: 2px; font-size: 12px; line-height: 20px; color: var(--cx-gray-aa); }
.fc-lodge__tel {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(45, 45, 45, 0.12);
  font-size: 15px;
  line-height: 1;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
.fc-lodge__tellabel { display: inline-block; margin-right: 10px; letter-spacing: 0.11em; color: var(--cx-blue); }
.fc-lodge__tel a { color: var(--cx-ink); text-decoration: none; }

@media (max-width: 768px) {
  .fc-lodge__body { gap: 14px; padding: 16px 18px 18px; }
  .fc-lodge__dish { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; }
  .fc-lodge__dishname { font-size: 15px; line-height: 23px; }
  .fc-lodge__dishtext { font-size: 14px; line-height: 23px; }
  .fc-lodge__tel { font-size: 14px; padding-top: 12px; }
}
/* INFORMATION 白カード内の TEL（受付業務リストの上） */
.fc-info__tel { margin: 0 0 14px; font-size: 16px; line-height: 1; letter-spacing: 0.07em; color: var(--cx-ink); }
.fc-info__tel a { color: var(--cx-ink); text-decoration: none; }

/* 【2026-09-16 SP修正】名物ブロック: SPは「写真＋名物ラベル・料理名」を横並び、説明文は全幅に。
   （112px の写真横 約200px の段に keep-all＋<wbr> の文を流すと 6〜9 行の細切れになり、
    語中や句点の前で割れていたため。説明文が全幅（318px）なら <wbr> 単位で収まる） */
@media (max-width: 768px) {
  .fc-lodge__dish {
    grid-template-columns: 120px minmax(0, 1fr);
    grid-template-areas: "photo label" "photo name" "text text";
    column-gap: 14px;
    row-gap: 0;
    align-items: start;
  }
  .fc-lodge__dishbody { display: contents; }
  .fc-lodge__dishphoto { grid-area: photo; }
  .fc-lodge__dishlabel { grid-area: label; margin-top: 2px; }
  .fc-lodge__dishname { grid-area: name; margin-top: 8px; word-break: keep-all; line-break: strict; overflow-wrap: anywhere; }
  .fc-lodge__dishtext { grid-area: text; margin-top: 12px; }
}

/* 【2026-09-17 修正】施設案内 → 料金ページのレンタル料金へのテキストリンク（回遊） */
.fc-rentallink { color: var(--cx-blue); text-decoration: underline; text-underline-offset: 3px; }

/* 【2026-09-17 深夜3】総合案内所（スキーセンター）に写真。順序（案内所→リフト券→ロッジ）は HTML 側 */
.fc-info__card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: stretch; max-width: none; }
.fc-info__photo { border-radius: 12px; overflow: hidden; }
.fc-info__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 768px) {
  .fc-info__card { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .fc-info__photo { aspect-ratio: 5 / 3; }
}

/* 【2026-09-17 夜】総合案内所（スキーセンター）をリフト券売り場と同じ写真カードに */
.fc-info2 .cx-photocard { min-height: 380px; }
.fc-info2 .cx-photocard__body { width: 44%; }
.fc-info2 .cx-photocard__text { margin-top: 0; }
.fc-info2__box { margin-top: 18px; padding: 16px 18px; border-radius: 8px; background: rgba(255, 255, 255, 0.14); color: #fff; }
.fc-info2__title { margin: 0 0 6px; font-size: 15px; letter-spacing: 0.1em; color: #fff; }
.fc-info2 .fc-info__tel, .fc-info2 .fc-info__tel a, .fc-info2 .fc-lodge__tellabel, .fc-info2 .cx-list li, .fc-info2 .cx-dot { color: #fff; }
@media (max-width: 768px) {
  .fc-info2 .cx-photocard { min-height: 0; }
  .fc-info2 .cx-photocard__body { width: auto; }
}

/* ==========================================================
   【2026-09-18 打ち合わせ反映】シュプールは自社サイトを持たないため
   「詳しく見る」ボタンを撤去。帯の右側が空くので電話案内の一言を置く
   ========================================================== */
.cx-lodge__note {
  margin: 0 0 0 auto;
  flex: 0 0 auto;
  color: var(--color-white);
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.06em;
}
@media (max-width: 768px) {
  .cx-lodge__note { font-size: 13px; }
}

/* 【2026-09-29 先方ご要望】リフト券売り場の場所（総合案内所と同じ半透明の白枠 .fc-info2__box を流用） */
.fc-ticket .fc-ticket__place { margin-top: 18px; }
.fc-ticket__placetext { font-size: 16px; line-height: 1.6; letter-spacing: 0.05em; color: #fff; }
@media (max-width: 768px) {
  .fc-ticket__placetext { font-size: 15px; }
}

/* 【2026-09-30 横山さん】施設の FAX 番号（分かった施設だけ）。TEL の右に並べ、幅が足りなければ次の行へ */
.fc-lodge__tel--fax { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 26px; }
.fc-lodge__telitem { white-space: nowrap; }
/* 【2026-09-30 先方ご要望】電話・FAX兼用の番号（シュプール・EBiSU）: 番号の後ろに小さく「（電話・FAX兼用）」 */
.fc-lodge__telnote { margin-left: 6px; font-size: 0.8em; letter-spacing: 0.04em; white-space: nowrap; }