/* EN Guide（コース案内）見本v1（ローカル／非公開）。body.en-guide-proto にスコープ。共通部分は lower-common-v1.css + en-overrides-v1.css。
   スキップリンク・ページ内アンカー・見出し階層・料金表・写真・リンク（予約tag付き）は不変。見た目のみ（写真は切り抜かず、元の比率で幅いっぱい）。 */
body.en-guide-proto main.en-extra { max-width: calc(760px + 2 * var(--gutter)); margin: 0 auto; padding: calc(var(--h-h) + 36px) var(--gutter) 72px; }
body.en-guide-proto main.en-extra h1 { font-size: clamp(26px, 3.2vw, 34px); line-height: 1.6; letter-spacing: .06em; margin: 8px 0 20px; font-weight: 400; text-wrap: balance; }
body.en-guide-proto main.en-extra h2 { margin: 12px 0 16px; font-size: clamp(21px, 2.4vw, 26px); line-height: 1.6; letter-spacing: .06em; font-weight: 400; text-wrap: balance; scroll-margin-top: calc(var(--h-h) + 16px); }
/* 各h2の直前の小見出し(p)に区切り罫線と上余白を持たせ、小見出しが前節に見えないようにする */
body.en-guide-proto main.en-extra > p:has(+ h2) { margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--line-strong); }
body.en-guide-proto main.en-extra h3 { margin: 36px 0 10px; font-size: 19px; line-height: 1.6; letter-spacing: .05em; font-weight: 400; scroll-margin-top: calc(var(--h-h) + 16px); }
body.en-guide-proto main.en-extra h4 { margin: 24px 0 8px; font-size: 16px; line-height: 1.7; letter-spacing: .04em; font-weight: 500; }
body.en-guide-proto main.en-extra p, body.en-guide-proto main.en-extra li { margin: 0 0 12px; font-size: 15px; line-height: 2; color: var(--ink); }
body.en-guide-proto main.en-extra ul { margin: 8px 0 8px 0; padding: 0; }
body.en-guide-proto main.en-extra li { margin-bottom: 6px; }
body.en-guide-proto main.en-extra a { display: inline-flex; align-items: center; min-height: 44px; margin: 2px 0; color: var(--green); text-decoration: underline; text-underline-offset: 4px; }
body.en-guide-proto main.en-extra #top, body.en-guide-proto main.en-extra #contents, body.en-guide-proto main.en-extra [id] { scroll-margin-top: calc(var(--h-h) + 16px); }
/* スキップリンク等 */
body.en-guide-proto .guide-aux { display: flex; flex-wrap: wrap; gap: 0 24px; margin: 0 0 20px; }
body.en-guide-proto .guide-aux a { margin: 0 !important; font-size: 13px; letter-spacing: .06em; }
/* 目次（ページ内リンク5本）：罫線の行 */
body.en-guide-proto main.en-extra > a[href^="#"]:not([href="#ryokuwa"]) { display: flex; width: 100%; padding: 12px 2px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; line-height: 1.7; font-size: 15px; }
body.en-guide-proto main.en-extra > a[href^="#"]:not([href="#ryokuwa"]):hover { background: var(--paper-deep); }
body.en-guide-proto main.en-extra figure { margin: 28px 0; }
body.en-guide-proto main.en-extra figure img { display: block; width: 100%; height: auto; }
/* 料金表：時間(左)・金額(右)、細罫線 */
body.en-guide-proto main.en-extra table { width: 100%; max-width: 520px; margin: 12px 0 20px; border-collapse: collapse; }
body.en-guide-proto main.en-extra th, body.en-guide-proto main.en-extra td { padding: 10px 2px; border: 0; border-bottom: 1px solid var(--line); text-align: left; font-size: 15px; }
body.en-guide-proto main.en-extra th { font-size: 13px; font-weight: 400; letter-spacing: .08em; color: var(--ink-soft); }
body.en-guide-proto main.en-extra th:last-child, body.en-guide-proto main.en-extra td:last-child { text-align: right; }
body.en-guide-proto main.en-extra td:last-child { font-family: var(--mincho); font-size: 19px; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
/* 予約リンク（tag付き、元のまま）を罫線ボタンに */
body.en-guide-proto main.en-extra > a[href*="peakmanager"] {
  display: flex; width: max-content; max-width: 100%; margin-top: 8px; padding: 14px 28px; border: 1px solid var(--ink); background: var(--ink); color: #fff; text-decoration: none; font-size: 14px; letter-spacing: .08em;
}
body.en-guide-proto main.en-extra > a[href*="peakmanager"]:hover { background: var(--green); border-color: var(--green); }
@media (max-width: 767px) { body.en-guide-proto main.en-extra { padding-top: calc(var(--h-h) + 24px); padding-bottom: 56px; } body.en-guide-proto main.en-extra h2 { margin-top: 48px; } }

/* ===== 用途別の仕上げ（コース案内＝選ぶ→読む→料金→予約）。本文・表・料金・ID・予約リンクは不変。写真は切り抜かず元の比率のまま ===== */
body.en-guide-proto main.en-extra h1 { font-family: var(--mincho); margin-top: 4px; }
/* 目次(ページ内リンク5本)：上端に太めの罫線を引き、1行ずつ押しやすく。hoverで地色 */
body.en-guide-proto main.en-extra > a[href="#body"] { border-top: 1px solid var(--line-strong); }
body.en-guide-proto main.en-extra > a[href^="#"]:not([href="#ryokuwa"]) { min-height: 52px; align-items: center; padding: 10px 6px; font-size: 16px; }
/* 各コース節：節の見出し直前の小見出しは小さく静かに、h2はセリフ体で一段大きく */
body.en-guide-proto main.en-extra > p:has(+ h2) { font-size: 13px; letter-spacing: .14em; color: var(--ink-soft); }
body.en-guide-proto main.en-extra h2 { font-family: var(--mincho); font-size: clamp(24px, 3vw, 32px); margin-top: 8px; }
/* 「Recommended if…」の項目：短い罫を頭に付けて箇条書きだと分かるように */
body.en-guide-proto main.en-extra ul { list-style: none; }
body.en-guide-proto main.en-extra li { position: relative; padding-left: 1.3em; }
body.en-guide-proto main.en-extra li::before { content: ""; position: absolute; left: 0; top: 1.05em; width: 8px; height: 1px; background: var(--green); }
/* 料金表：地色の面にまとめ、時間と金額を左右に離す。金額は読みやすく */
body.en-guide-proto main.en-extra table { max-width: 480px; background: var(--paper-deep); }
body.en-guide-proto main.en-extra th, body.en-guide-proto main.en-extra td { padding: 11px 16px; }
body.en-guide-proto main.en-extra td:last-child { font-size: 21px; }
body.en-guide-proto main.en-extra h4 { color: var(--ink-soft); }
@media (max-width: 767px) {
  body.en-guide-proto main.en-extra h1 { font-size: 25px; line-height: 1.55; }
  body.en-guide-proto main.en-extra > p:has(+ h2) { margin-top: 48px; padding-top: 22px; }
  body.en-guide-proto main.en-extra table { max-width: none; }
}

/* EN guide 目次4行目の揃え案（未適用・guide-redesign-v1.css の末尾に追記）。HTML・本文・リンク不変。
   原因：目次の行スタイルは `:not([href="#ryokuwa"])` で除外してあり、目次04（href="#ryokuwa"）だけ罫線・余白・色の行スタイルが付かない。
   本文中の別リンク「About the ryokuwa Course ↑」も同じ href のため、見出し#contents直後の4番目のリンクだけに限定して選ぶ。 */
body.en-guide-proto main.en-extra > h2#contents + a + a + a + a {
  display: flex; align-items: center; width: 100%; min-height: 52px; padding: 10px 6px; border-bottom: 1px solid var(--line);
  color: var(--ink); text-decoration: none; line-height: 1.7; font-size: 16px;
}
body.en-guide-proto main.en-extra > h2#contents + a + a + a + a:hover { background: var(--paper-deep); }
