/* EN /first/ 再設計 v2（最終候補・未公開・実描画は未確認。v1＝現行の本番CSS）。body.en-first-proto にスコープ。共通部分は lower-common-v1.css + en-overrides-v1.css（既存の本番CSS）。
   用途：初めての来店前に「何が起きるか」を順に伝える。写真は流れの中の手がかり（一律の大写真にしない）。HTMLは変更しない（CSSだけ。DOCTYPEとlink差替えを除く）。
   構成：①冒頭＝左に見出し・導入、右に「来店前のこと」の面 ②予約方法＝石色の帯 ③来店〜退店＝番号つきの縦の流れ（写真の大きさは元の解像度に合わせる） ④メニュー紹介 ⑤店舗。
   実表示は未確認。 */
body.en-first-proto {
  --serif: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --sans: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", sans-serif;
  --band-x: max(var(--gutter), calc((100% - 1180px) / 2));      /* 帯は全幅、中身は最大1180px */
}
body.en-first-proto #single_page { padding-top: var(--h-h); }
body.en-first-proto .page_first > section.content_block { padding: 0 var(--band-x); margin: 0; background: transparent; }
body.en-first-proto .page_first .inner, body.en-first-proto .page_first .inner_70 { max-width: none; width: auto; margin: 0; padding: 0; overflow: visible; float: none; }
/* 見出し（h1・h2）：左寄せの大きな明朝＋小さなラベル。ページ内で3段階（h1大／h2中／カード見出し小） */
body.en-first-proto .page_first .block_title { margin: 0; padding: 0; text-align: left; font-family: var(--serif); font-weight: 400; color: var(--ink); line-height: 1.1; letter-spacing: .005em; }
body.en-first-proto .page_first .block_title:after { display: none; }
body.en-first-proto .page_first h1.block_title { font-size: clamp(38px, 5vw, 64px); }     /* v2：76px→64px。左列を狭めて右の面を広げたため、題名が2行に折れない大きさ */
body.en-first-proto .page_first h2.block_title { font-size: clamp(30px, 3.6vw, 46px); }
body.en-first-proto .page_first .block_title span { display: block; margin-top: 16px; font-family: var(--sans); font-size: 11px; font-weight: 400; letter-spacing: .3em; color: var(--ink-soft); }

/* ① 冒頭：左＝見出し・導入、右＝来店前のこと（面）。DOMの順序（h1→リード→本文→来店前）は変えず、グリッドで配置 */
body.en-first-proto .page_first > section:nth-of-type(1) {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); grid-template-rows: auto auto minmax(0, 1fr);   /* v2：右の面を広く（内容が折れにくく低くなる）、余剰の高さは最後の行だけが受ける（左の3つの間に配分しない） */
  column-gap: clamp(32px, 5vw, 80px); align-content: start; align-items: start;
  padding-top: clamp(40px, 4.5vw, 72px); padding-bottom: clamp(48px, 5vw, 72px);
}
body.en-first-proto .page_first > section:nth-of-type(1) > .list_wrap, body.en-first-proto .page_first > section:nth-of-type(1) .inner_70, body.en-first-proto .page_first .ttfc { display: contents; }
body.en-first-proto .page_first > section:nth-of-type(1) > h1 { grid-column: 1; grid-row: 1; }
body.en-first-proto .page_first .ttfc > .t2 { grid-column: 1; grid-row: 2; margin: clamp(24px, 3vw, 36px) 0 0; padding: 0; text-align: left; font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 2.8vw, 36px); line-height: 1.28; letter-spacing: .003em; color: var(--ink); }
body.en-first-proto .page_first .ttfc > .t2 br { display: inline; }
body.en-first-proto .page_first .first_welcome { grid-column: 1; grid-row: 3; margin: 18px 0 0; padding: 0; max-width: 30em; text-align: left; font-size: 15px; line-height: 2; letter-spacing: .02em; color: var(--ink-soft); }
body.en-first-proto .page_first .first_visit_notes { grid-column: 2; grid-row: 1 / span 3; align-self: start; margin: 0; padding: clamp(24px, 2.6vw, 32px); background: var(--paper-deep); border: 0; text-align: left; }
body.en-first-proto .page_first .first_visit_notes h2 { margin: 0 0 12px; padding: 0; font-family: var(--serif); font-size: clamp(22px, 2.2vw, 28px); font-weight: 400; letter-spacing: .01em; color: var(--ink); }
body.en-first-proto .page_first .first_visit_facts { margin: 0; }
body.en-first-proto .page_first .first_visit_facts > div { display: grid; grid-template-columns: 8em minmax(0, 1fr); gap: 4px 18px; padding: 12px 0; border: 0; border-top: 1px solid rgba(38,35,31,.14); }
body.en-first-proto .page_first .first_visit_facts > div:last-child { border-bottom: 0; }
body.en-first-proto .page_first .first_visit_facts dt { margin: 0; font-family: var(--sans); font-size: 12px; letter-spacing: .08em; color: var(--ink-soft); font-weight: 400; line-height: 1.9; }
body.en-first-proto .page_first .first_visit_facts dd { margin: 0; font-size: 15px; line-height: 1.8; color: var(--ink); }

/* 本文の各文（原文の<br>で区切られた塊）を inline-block にして、内側の折返しを均等にする（スマホの「a concern,」のような短い行を避ける）。<br>は変更しない */
body.en-first-proto .page_first .first_welcome .fx-seg { display: inline-block; max-width: 100%; vertical-align: top; text-wrap: balance; }

/* ② 予約方法：石色の帯。左＝大きな1文、右＝補足の2段落 */
body.en-first-proto .page_first > section:nth-of-type(2) { background: var(--stone); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); column-gap: clamp(32px, 6vw, 96px); padding-top: clamp(44px, 5vw, 72px); padding-bottom: clamp(44px, 5vw, 72px); }
body.en-first-proto .page_first > section:nth-of-type(2) > .list_wrap, body.en-first-proto .page_first > section:nth-of-type(2) .inner_70, body.en-first-proto .page_first .htb { display: contents; }
body.en-first-proto .page_first > section:nth-of-type(2) > h2 { grid-column: 1; grid-row: 1; }
body.en-first-proto .page_first .first_booking > .t1 { grid-column: 1; grid-row: 2; margin: 28px 0 0; padding: 0; width: auto; max-width: 20em; text-align: left; font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.4; letter-spacing: .005em; }
body.en-first-proto .page_first .first_booking > p:not(.t1) { grid-column: 2; margin: 0 0 18px; padding: 0; max-width: 32em; text-align: left; font-size: 15px; line-height: 2; letter-spacing: .02em; color: var(--ink); }
body.en-first-proto .page_first .first_booking > p:nth-of-type(2) { grid-row: 2; }
body.en-first-proto .page_first .first_booking > p:nth-of-type(3) { grid-row: 3; }
body.en-first-proto .page_first .first_booking > p:nth-of-type(2) { margin-top: 28px; }   /* 左の大きな1文の上端に揃える */

/* ③ 来店〜退店：番号つきの縦の流れ。番号は大きな明朝（CSS生成。本文に文字を足さない）、写真の幅は元の解像度に合わせる（小さい元画像は小さく） */
body.en-first-proto .page_first > section:nth-of-type(3) { padding-top: clamp(64px, 9vw, 128px); padding-bottom: clamp(48px, 7vw, 96px); }
body.en-first-proto .page_first > section:nth-of-type(3) > h2 { margin-bottom: clamp(36px, 5vw, 72px); }
body.en-first-proto .imgtxt_wrap { max-width: none; width: auto; margin: 0; padding: 0; counter-reset: fx; }
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block {
  counter-increment: fx; --ph: minmax(0, 420px); position: relative; display: grid; grid-template-columns: 88px var(--ph) minmax(0, 1fr); column-gap: clamp(24px, 4vw, 56px); align-items: center;
  margin: 0; padding: 0 0 clamp(40px, 5vw, 72px); border: 0; overflow: visible;
  background: linear-gradient(var(--line-strong), var(--line-strong)) 44px 0 / 1px 100% no-repeat;        /* 縦の線（番号をつなぐ） */
}
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:last-child { padding-bottom: 0; background-size: 1px 56px; }
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:before {
  content: counter(fx, decimal-leading-zero); grid-column: 1; grid-row: 1; align-self: start; justify-self: center; padding: 0 0 12px; background: var(--paper);
  font-family: var(--serif); font-size: clamp(30px, 3vw, 40px); line-height: 1; color: var(--green);
}
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:nth-child(1), body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:nth-child(4) { --ph: minmax(0, 300px); }   /* 元画像が620×400 */
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block .thumb_wrap { grid-column: 2; grid-row: 1; float: none; width: 100%; max-width: none; margin: 0; background: var(--stone); aspect-ratio: 4 / 3; position: relative; overflow: hidden; }
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block .thumb_wrap:before { content: none; display: none; }
body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block .thumb { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
body.en-first-proto .page_first .imgtxt_block .thumb img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 50%; }
body.en-first-proto .imgtxt_block:nth-child(4) .thumb img { object-position: 40% 50%; }      /* カウンセリング：女性スタッフを残す */
body.en-first-proto .page_first .imgtxt_desccription { grid-column: 3; grid-row: 1; float: none; width: auto; max-width: 30em; padding: 0; }
body.en-first-proto .page_first .imgtxt_title { margin: 0 0 12px; padding: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 2.3vw, 30px); line-height: 1.25; letter-spacing: .005em; color: var(--ink); }
body.en-first-proto .page_first .imgtxt_desccription .t3 { display: block; margin: 0; padding: 0; font-size: 15px; line-height: 2; letter-spacing: .02em; color: var(--ink-soft); }

/* ④ メニュー紹介（4コース。4枚目は公開と同じ条件で、600px超は非表示・600px以下は表示。PCは3列） */
body.en-first-proto .page_first > section:nth-of-type(4) { background: var(--stone); padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
body.en-first-proto .page_first > section:nth-of-type(4) > h2 { margin-bottom: clamp(28px, 4vw, 48px); }
body.en-first-proto .menu_wrap { max-width: none; width: auto; margin: 0; padding: 0; }
body.en-first-proto .page_first .ryokuwa-menu-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px clamp(20px, 3vw, 40px); margin: 0; }
body.en-first-proto .page_first .ryokuwa-menu-summary .flexitem { width: auto; padding: 0; margin: 0; }
body.en-first-proto .menu_wrap article { display: block; padding: 0; }
body.en-first-proto .menu_wrap article:last-child { display: none; padding: 0; }                      /* 公開と同じ：600px超は非表示 */
body.en-first-proto .menu_wrap figure { padding: 0 0 14px; margin: 0; }
body.en-first-proto .ryokuwa-menu-summary figure img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 50%; border-radius: 0; }
body.en-first-proto .ryokuwa-menu-summary article:nth-child(3) figure img { object-position: 85% 50%; }   /* ヘッド：顔と両手を残す */
body.en-first-proto .ryokuwa-menu-summary article:nth-child(4) figure img { object-position: 25% 50%; }   /* オイルフット：両手を残す */
body.en-first-proto .page_first .menu_description { float: none; width: auto; padding: 0; }
body.en-first-proto .page_first .menu_description .t1 { margin: 0; padding: 0 0 6px; font-family: var(--serif); font-weight: 400; font-size: 19px; line-height: 1.35; letter-spacing: .005em; }
body.en-first-proto .page_first .ryokuwa-menu-summary .menu_description .t3 { display: block; margin: 0; padding: 0; font-size: 14px; line-height: 1.8; color: var(--ink-soft); }
body.en-first-proto .menu_wrap a.btn.btn_b {
  display: flex; align-items: center; justify-content: center; width: max-content; min-width: 260px; max-width: 100%; margin: 44px 0 0;
  padding: 14px 32px; border: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink);
  font-family: var(--sans); font-size: 14px; font-weight: 500; letter-spacing: .12em; line-height: 1.5;
}
body.en-first-proto .menu_wrap a.btn.btn_b:hover { background: var(--ink); color: #fff; }
/* ⑤ 店舗（共通の店舗ブロックのまま。上の余白だけ） */
body.en-first-proto .page_first > section:nth-of-type(5) { padding-top: clamp(64px, 9vw, 128px); padding-bottom: 8px; }
body.en-first-proto .page_first > section:nth-of-type(5) > h2 { margin-bottom: clamp(28px, 4vw, 48px); }

@media (max-width: 900px) {
  body.en-first-proto .page_first > section:nth-of-type(1), body.en-first-proto .page_first > section:nth-of-type(2) { display: block; }
  body.en-first-proto .page_first > section:nth-of-type(1) > .list_wrap, body.en-first-proto .page_first > section:nth-of-type(1) .inner_70, body.en-first-proto .page_first .ttfc,
  body.en-first-proto .page_first > section:nth-of-type(2) > .list_wrap, body.en-first-proto .page_first > section:nth-of-type(2) .inner_70, body.en-first-proto .page_first .htb { display: block; }
  body.en-first-proto .page_first .first_visit_notes { margin-top: 36px; }
  body.en-first-proto .page_first .first_booking > p:not(.t1) { margin-top: 18px; max-width: none; }
  body.en-first-proto .page_first .first_booking > p:nth-of-type(2) { margin-top: 18px; }
  body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block { grid-template-columns: 52px minmax(0, 1fr); row-gap: 16px; column-gap: 20px; background-position: 26px 0; }
  body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:before { grid-row: 1; }
  body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block .thumb_wrap { grid-column: 2; grid-row: 1; max-width: 420px; }
  body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:nth-child(1) .thumb_wrap, body.en-first-proto .page_first .imgtxt_wrap .imgtxt_block:nth-child(4) .thumb_wrap { max-width: 300px; }
  body.en-first-proto .page_first .imgtxt_desccription { grid-column: 2; grid-row: 2; }
}
@media (max-width: 767px) {
  body.en-first-proto .page_first .first_visit_facts > div { grid-template-columns: minmax(0, 1fr); gap: 5px; padding: 14px 0; }      /* v2：項目名を上、内容を下に（長い内容も面の全幅で読む） */
  body.en-first-proto .page_first .first_visit_facts dt { line-height: 1.5; }
  body.en-first-proto .page_first .first_visit_facts dd { line-height: 1.8; }
  body.en-first-proto .menu_wrap a.btn.btn_b { width: 100%; }
}
@media (max-width: 600px) {
  body.en-first-proto .page_first .ryokuwa-menu-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  body.en-first-proto .menu_wrap article:last-child { display: block; }                                  /* 公開と同じ：600px以下は表示 */
  body.en-first-proto .page_first .menu_description .t1 { font-size: 16px; }
}