/* =============================================================================
   公開サイト CSS（homepage_old/style.css を元に多ページ・多言語向けに拡張）
   アクセントカラー：青・紺系 #1F3A6B（基本設計 NF-AC-03）
   Webフォントは使用せず、:lang() で端末標準フォントを指定する（基本設計 T08）
   ============================================================================= */
:root {
  --bg: #f7f9fc;
  --surface: #ffffff;
  --text: #1f2430;
  --muted: #5b6678;
  --line: #dde5f0;
  --brand: #1f3a6b;
  --brand-2: #2d5aa0;
  --accent: #4a7fc7;
  --accent-soft: #e8f0fb;
  --shadow: 0 14px 30px rgba(31, 58, 107, 0.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: var(--bg); line-height: 1.8; }
img { max-width: 100%; height: auto; }
a { color: var(--brand); }

/* ---- 言語別フォント（端末標準） ---- */
:lang(ja) { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif; }
:lang(en), :lang(id), :lang(vi) { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
:lang(zh-CN) { font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif; }
:lang(ko) { font-family: "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", sans-serif; }
:lang(hi) { font-family: "Kohinoor Devanagari", "Nirmala UI", "Noto Sans Devanagari", "Mangal", sans-serif; }
:lang(my) { font-family: "Myanmar Sangam MN", "Myanmar Text", "Noto Sans Myanmar", "Padauk", sans-serif; line-height: 1.9; }
:lang(my) h1, :lang(my) h2, :lang(my) h3, :lang(hi) h1, :lang(hi) h2, :lang(hi) h3 { line-height: 1.7; }

.container { width: min(1100px, 92%); margin: 0 auto; }
.container.narrow { width: min(820px, 92%); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.preview-bar { position: sticky; top: 0; z-index: 100; background: #c0392b; color: #fff; text-align: center; font-weight: 700; padding: 4px; }

/* ---- 上部バー・ヘッダー ---- */
.topbar { background: #14284d; color: #e8f0fb; font-size: .88rem; }
.topbar-inner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .4rem 0; }
.topbar p { margin: 0; }
.topbar .tel a { color: #fff; font-weight: 700; text-decoration: none; }
.header { position: sticky; top: 0; z-index: 50; background: rgba(251, 248, 249, .96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.nav-wrap { display: flex; align-items: center; gap: 1rem; min-height: 72px; }
.logo { text-decoration: none; display: inline-flex; align-items: center; margin-right: auto; }
.logo img { display: block; height: 40px; width: auto; }
.logo-text { font-weight: 700; font-size: 1.2rem; letter-spacing: .04em; color: var(--brand); white-space: nowrap; }
@media (max-width: 640px) { .logo-text { font-size: 1rem; } }
.nav { display: flex; gap: 1.1rem; align-items: center; flex-wrap: wrap; }
.nav a { font-size: .95rem; color: var(--muted); text-decoration: none; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--brand); }
.nav-cta { color: #fff !important; background: var(--brand); padding: .45rem .95rem; border-radius: 999px; }
.menu-btn { display: none; border: 0; background: transparent; padding: 0; width: 34px; height: 28px; cursor: pointer; }
.menu-btn span { display: block; height: 2px; margin: 6px 0; background: var(--text); transition: .25s; }

/* 言語プルダウン */
.lang-switch { position: relative; font-size: .9rem; }
.lang-switch summary { list-style: none; cursor: pointer; padding: .3rem .7rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; white-space: nowrap; }
.lang-switch summary::-webkit-details-marker { display: none; }
.lang-switch summary::after { content: " ▾"; color: var(--muted); }
.lang-switch ul { position: absolute; right: 0; top: calc(100% + 6px); min-width: 180px; margin: 0; padding: .4rem 0; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); z-index: 60; }
.lang-switch li a { display: block; padding: .35rem 1rem; color: var(--text); text-decoration: none; }
.lang-switch li a:hover { background: var(--accent-soft); }
.lang-switch li a[aria-current="true"] { font-weight: 700; color: var(--brand); }

/* ---- パンくず・注記 ---- */
.breadcrumb { font-size: .85rem; color: var(--muted); padding-top: .8rem; }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
.breadcrumb li + li::before { content: "›"; margin-right: .3rem; color: #b9a9b2; }
.breadcrumb a { color: var(--muted); }
.notice { margin: 1rem 0 0; padding: .7rem 1rem; border-radius: 8px; font-size: .92rem; }
.notice-untranslated { background: #f3f1f6; border: 1px solid #ddd6e5; }
.notice-ja { background: #fff8e8; border: 1px solid #f0dca8; }

/* ---- メインビジュアル ---- */
.hero { position: relative; min-height: 68vh; display: grid; align-items: center; color: #fff;
  background: var(--hero-image, linear-gradient(135deg, #14284d 0%, #1f3a6b 55%, #2d5aa0 100%)) center / cover; }
/* 写真の上に、左（文字側）は濃く・右へ行くほど薄くなるグラデーションを重ねる */
.hero-overlay { position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(20, 40, 77, .92) 0%, rgba(31, 58, 107, .78) 10%, rgba(45, 90, 160, .35) 30%, rgba(45, 90, 160, 0) 100%); }
/* スマートフォンは文字が横幅いっぱいに並ぶため、右側も読める濃さを残す */
@media (max-width: 640px) {
  .hero-overlay { background: linear-gradient(90deg, rgba(20, 40, 77, .9) 0%, rgba(31, 58, 107, .75) 60%, rgba(45, 90, 160, .5) 100%); }
}
.hero-content { position: relative; padding: 4.5rem 0; }
.hero-lead { display: inline-block; border: 1px solid rgba(255, 255, 255, .55); padding: .2rem .8rem; border-radius: 999px; font-size: .9rem; margin: 0; }
.hero h1 { font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.35; margin: 1rem 0; }
.hero p { max-width: 640px; }
.hero-actions { display: flex; gap: .8rem; margin-top: 1.5rem; flex-wrap: wrap; }
/* スマートフォン幅では画面の高さに合わせず、文字の量に合わせた高さにする */
@media (max-width: 767px) {
  .hero { min-height: 0; }
  .hero-content { padding: 2.5rem 0; }
}

/* ---- ボタン ---- */
.btn { display: inline-flex; align-items: center; justify-content: center; padding: .72rem 1.2rem; border-radius: 8px; font-weight: 700; border: 1px solid transparent; transition: .2s; text-decoration: none; cursor: pointer; font: inherit; font-weight: 700; }
.btn.primary { background: var(--accent); color: #2a1520; }
.btn.primary:hover { transform: translateY(-1px); filter: brightness(1.04); }
.btn.ghost { border-color: rgba(255, 255, 255, .75); color: #fff; }
.btn.outline { border-color: var(--brand); color: var(--brand); background: #fff; }
.btn.line { background: #06c755; color: #fff; }
.btn[disabled] { opacity: .6; cursor: wait; }

/* ---- セクション・ページ見出し ---- */
.section { padding: clamp(2.5rem, 5vw, 4rem) 0; }
.page-header { padding: clamp(2rem, 4vw, 3rem) 0 1rem; }
.page-header h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin: 0; line-height: 1.4; }
.page-header h1::after { content: ""; display: block; width: 56px; height: 4px; margin-top: .6rem; border-radius: 4px; background: var(--accent); }
.page-body { padding-bottom: 3rem; }
.eyebrow { color: var(--brand-2); letter-spacing: .08em; text-transform: uppercase; font-size: .78rem; font-weight: 700; margin: 0 0 .3rem; }
h2 { font-size: clamp(1.45rem, 2.8vw, 2rem); margin: 0 0 1rem; line-height: 1.45; }
h3 { line-height: 1.5; }

/* ---- ブロック ---- */
.blk { margin: 1.4rem 0; }
.blk-heading { margin-top: clamp(2.2rem, 5vw, 3.6rem); margin-bottom: .2rem; }
.blk-heading.blk-h3 { margin-top: 1.8rem; }
.blk-h3 h3 { font-size: 1.2rem; border-left: 4px solid var(--accent); padding-left: .6rem; margin: 0; }
.page-home .blk-heading { text-align: center; }
.rich-text { overflow-wrap: anywhere; }
/* 本文部品の背景色（BlockRegistry::TEXT_BG_LABELS） */
.blk-text.has-bg .rich-text { border-radius: 12px; padding: 1.4rem 1.6rem; }
.blk-text.has-bg .rich-text > :first-child { margin-top: 0; }
.blk-text.has-bg .rich-text > :last-child { margin-bottom: 0; }
.blk-text.bg-white .rich-text { background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.blk-text.bg-pink .rich-text { background: var(--accent-soft); }
.blk-text.bg-gray .rich-text { background: #eef2f8; }
/* 本文は背景色の有無にかかわらず、項目と値の表（.blk-kv .fee-table）と同じく見出しより一段下げる（トップページは見出しを中央寄せにしているため下げない）。
   .container の内側の .rich-text を下げる（.container 自体は中央寄せのため margin を変えない） */
.blk-text .rich-text { margin-left: 1.5rem; }
.page-home .blk-text .rich-text { margin-left: 0; }
@media (max-width: 767px) { .blk-text.has-bg .rich-text { padding: 1rem 1.1rem; } }
@media (max-width: 640px) { .blk-text .rich-text { margin-left: .75rem; } .page-home .blk-text .rich-text { margin-left: 0; } }
.form-noscript { margin: 0 0 1rem; padding: .8rem 1rem; border: 1px solid #e3a3a3; border-radius: 8px; background: #fff3f3; color: #8a1f1f; font-weight: 700; }
/* 本文エディタの見出し（h2・h3。お知らせは記事タイトル h1 の直下の階層になる。BUG-W007） */
.rich-text h2 { font-size: 1.35rem; line-height: 1.5; margin: 2rem 0 .8rem; padding-left: .6rem; border-left: 4px solid var(--accent); }
.rich-text h3 { font-size: 1.15rem; margin: 1.6rem 0 .6rem; }
.rich-text table { width: 100%; border-collapse: collapse; margin: 1rem 0; background: #fff; }
.rich-text th, .rich-text td { border: 1px solid var(--line); padding: .5rem .7rem; text-align: left; }
.rich-text th { background: var(--accent-soft); }
.rich-text blockquote { margin: 1rem 0; padding: .6rem 1rem; border-left: 4px solid var(--accent); background: #fff; color: var(--muted); }
.rich-text img { border-radius: 8px; }
.blk-image figure { margin: 0; text-align: center; }
.blk-image img { border-radius: 12px; }
/* 画像と直前の部品の横並び（画像部品の「配置」：右・左） */
.blk-pair-grid { display: grid; grid-template-columns: minmax(0, 1fr) fit-content(50%); gap: 2rem; align-items: start; }
.blk-pair-left .blk-pair-grid { grid-template-columns: fit-content(50%) minmax(0, 1fr); }
.blk-pair-grid .blk { margin: 0; }
.blk-pair-grid .container { width: auto; }
@media (max-width: 760px) {
  .blk-pair-grid, .blk-pair-left .blk-pair-grid { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
}
.blk-image figcaption { font-size: .88rem; color: var(--muted); margin-top: .4rem; }

.grid { display: grid; gap: 1.1rem; }
.grid.two { grid-template-columns: 1.15fr 1fr; }
.grid.two-even { grid-template-columns: repeat(2, 1fr); }
.grid.three { grid-template-columns: repeat(3, 1fr); }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 1.2rem; box-shadow: var(--shadow); position: relative; }
.card h3 { margin-top: 0; font-size: 1.1rem; }
.card h3 a { color: var(--text); text-decoration: none; }
.card-link h3 a::after { content: ""; position: absolute; inset: 0; }
.card-link:hover { border-color: var(--accent); }
.card .more { color: var(--brand); font-size: .9rem; margin: .6rem 0 0; font-weight: 700; }
.card-note { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: .8rem 0 0; padding-top: .7rem; border-top: 1px dashed var(--line); }
.card-note-text { font-weight: 700; color: var(--brand); }
.card-badge { display: inline-block; font-size: .8rem; color: var(--brand); border: 1px solid var(--brand); border-radius: 999px; padding: 0 .6rem; line-height: 1.7; white-space: nowrap; }
.card-img { margin: -1.2rem -1.2rem 1rem; }
.card-img img { width: 100%; height: 180px; object-fit: cover; border-radius: 12px 12px 0 0; display: block; }

.fee-table { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.2rem; box-shadow: var(--shadow); }
.fee-table h3 { margin-top: 0; }
.fee-table dl { margin: 0; }
.fee-row { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px dashed var(--line); }
.fee-row dt { margin: 0; }
.fee-row dd { margin: 0; text-align: right; }
.fee-row strong { white-space: nowrap; }
.fee-note { margin: .8rem 0 0; color: var(--muted); font-size: .92rem; }

.flow-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.flow-list li { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 1rem; display: grid; grid-template-columns: 44px 1fr; gap: 1rem; }
.flow-list span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--brand); color: #fff; font-weight: 700; }
.flow-list h3 { margin: .1rem 0 .2rem; font-size: 1.05rem; }
.flow-list p { margin: 0; }
/* 手順・流れも本文・表と同じく見出しより一段下げる（トップページは見出しを中央寄せにしているため下げない。よくある質問は中央寄せのため対象外） */
.blk-steps .flow-list { margin-left: 1.5rem; }
.page-home .blk-steps .flow-list { margin-left: 0; }
@media (max-width: 640px) { .blk-steps .flow-list { margin-left: .75rem; } .page-home .blk-steps .flow-list { margin-left: 0; } }

.faq-wrap { max-width: 860px; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-question { width: 100%; text-align: left; border: 0; background: transparent; padding: 1.05rem 2rem 1.05rem 0; font: inherit; font-weight: 700; cursor: pointer; position: relative; color: var(--text); }
.faq-question::before { content: "Q."; color: var(--brand); margin-right: .4rem; }
.faq-question::after { content: "+"; position: absolute; right: .3rem; top: 50%; transform: translateY(-50%); color: var(--brand); font-size: 1.2rem; }
.faq-question[aria-expanded="true"]::after { content: "−"; }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
.faq-answer p { margin: 0 0 1rem; }
.no-js .faq-answer { max-height: none; }

.cta-box { background: var(--accent-soft); border: 1px solid #cfdcf0; border-radius: 12px; padding: 1.6rem; text-align: center; }
.cta-box h2 { font-size: 1.35rem; }
.map-embed iframe { width: 100%; height: 340px; border: 1px solid var(--line); border-radius: 12px; display: block; }

/* ---- お知らせ ---- */
.news-cats { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.news-cats a { display: inline-block; padding: .25rem .9rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; color: var(--muted); background: #fff; font-size: .9rem; }
.news-cats a[aria-current="page"] { background: var(--brand); color: #fff; border-color: var(--brand); }
.news-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.news-item { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "thumb meta" "thumb title"; column-gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); align-items: start; }
.news-item:not(:has(.news-thumb)) { grid-template-columns: 1fr; grid-template-areas: "meta" "title"; }
.news-thumb { grid-area: thumb; }
.news-thumb img { width: 120px; height: 80px; object-fit: cover; border-radius: 8px; display: block; }
.news-meta { grid-area: meta; display: flex; gap: .8rem; align-items: center; font-size: .88rem; color: var(--muted); }
.news-cat { display: inline-block; padding: 0 .6rem; border-radius: 999px; background: var(--accent-soft); color: var(--brand); text-decoration: none; font-size: .8rem; }
.news-title { grid-area: title; color: var(--text); text-decoration: none; font-weight: 700; }
.news-title:hover { color: var(--brand); }
.more-link { text-align: right; }
.pager { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: center; margin-top: 2rem; }
.pager a, .pager span { padding: .3rem .8rem; border: 1px solid var(--line); border-radius: 6px; background: #fff; text-decoration: none; }
.pager span[aria-current] { background: var(--brand); color: #fff; border-color: var(--brand); }
.article-header h1 { font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.45; margin: .6rem 0 1.2rem; }
.eyecatch { margin: 0 0 1.5rem; }
.eyecatch img { border-radius: 12px; display: block; width: 100%; }
.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 3rem; }
.post-nav a { display: block; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: 10px; background: #fff; text-decoration: none; color: var(--text); }
.post-nav .post-next { text-align: right; grid-column: 2; }
.post-nav small { display: block; color: var(--muted); }
.back-link { text-align: center; margin-top: 2rem; }

/* ---- 問い合わせフォーム ---- */
.contact-tel a { font-weight: 700; font-size: 1.1rem; }
.contact-form { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: clamp(1rem, 3vw, 2rem); margin-top: 1.5rem; }
.form-row { margin: 0 0 1.1rem; border: 0; padding: 0; }
.form-row > label, .form-row > legend { display: block; font-weight: 700; margin-bottom: .35rem; }
.form-row input[type=text], .form-row input[type=email], .form-row input[type=tel], .form-row select, .form-row textarea {
  width: 100%; font: inherit; border: 1px solid #d3c3cc; border-radius: 8px; padding: .65rem .75rem; background: #fff; }
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { outline: 2px solid rgba(224, 140, 178, .4); border-color: var(--brand); }
.form-row [aria-invalid="true"] { border-color: #c0392b; background: #fff8f7; }
.form-row .radio { display: inline-flex; align-items: center; gap: .3rem; margin-right: 1.2rem; font-weight: 400; }
.form-row .check { display: flex; align-items: flex-start; gap: .5rem; font-weight: 400; }
.form-row .check input { margin-top: .45rem; }
.req, .opt { display: inline-block; font-size: .72rem; padding: 0 .45rem; border-radius: 4px; vertical-align: middle; font-weight: 700; margin-left: .3rem; }
.req { background: var(--brand); color: #fff; }
.opt { background: #eee6eb; color: var(--muted); }
.char-count { margin: .25rem 0 0; text-align: right; font-size: .85rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.char-count.is-over { color: #b0281a; font-weight: 700; }
.field-error { display: block; color: #b0281a; font-size: .88rem; margin-top: .3rem; }
.form-message { min-height: 1.2em; color: #b0281a; font-size: .95rem; margin: .5rem 0 1rem; }
.form-row.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.confirm-list { display: grid; grid-template-columns: 12rem 1fr; margin: 0 0 1.5rem; border-top: 1px solid var(--line); }
.confirm-list dt, .confirm-list dd { margin: 0; padding: .6rem .4rem; border-bottom: 1px solid var(--line); }
.confirm-list dt { font-weight: 700; color: var(--muted); }
.confirm-list dd { white-space: pre-wrap; overflow-wrap: anywhere; }
.form-actions { display: flex; gap: .8rem; flex-wrap: wrap; }
.error-page { text-align: center; min-height: 40vh; }

/* ---- 問い合わせ導線（ページ下部） ---- */
.cta-band { background: linear-gradient(160deg, #f7f9fc 0%, #e8f0fb 100%); border-top: 1px solid var(--line); }
.cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.cta-inner h2 { margin-bottom: .4rem; font-size: 1.4rem; }
.cta-inner p { margin: 0; }
.cta-actions { display: flex; gap: .6rem; flex-wrap: wrap; }

/* ---- フッター ---- */
.footer { border-top: 1px solid var(--line); background: #eef2f8; font-size: .92rem; }
.footer-grid { display: flex; justify-content: space-between; gap: 2rem; padding: 2rem 0 1rem; flex-wrap: wrap; }
.footer p { margin: .15rem 0; }
.footer-name { font-weight: 700; font-size: 1.05rem; }
.footer-head { font-weight: 700; }
.footer-links ul { list-style: none; margin: .3rem 0 0; padding: 0; columns: 2; column-gap: 2rem; }
.footer-links a { color: var(--text); text-decoration: none; }
.footer-links a:hover { color: var(--brand); }
.footer-bottom { border-top: 1px solid var(--line); padding: .8rem 0 1.2rem; color: var(--muted); font-size: .85rem; }
.page-top { position: fixed; right: 16px; bottom: 16px; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--brand); color: #fff; text-decoration: none; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 40; }
.page-top.show { opacity: .9; pointer-events: auto; }
.fixed-cta { display: none; }

@media (max-width: 900px) {
  .grid.two, .grid.three, .grid.two-even { grid-template-columns: 1fr; }
  .menu-btn { display: block; }
  .nav { position: absolute; top: 72px; left: 0; right: 0; background: #f7f9fc; border-bottom: 1px solid var(--line); display: grid; padding: .8rem 4%; gap: .2rem; transform: scaleY(0); transform-origin: top; opacity: 0; pointer-events: none; transition: .2s; }
  .nav.open { transform: scaleY(1); opacity: 1; pointer-events: auto; }
  .nav a { padding: .5rem 0; }
  .nav-cta { text-align: center; }
  .topbar-inner { flex-direction: column; align-items: flex-start; gap: .1rem; }
  .confirm-list { grid-template-columns: 1fr; }
  .confirm-list dt { border-bottom: 0; padding-bottom: 0; }
  .post-nav { grid-template-columns: 1fr; }
  .post-nav .post-next { grid-column: 1; }
}

/* スマートフォンは画面下部に固定の問い合わせボタン（基本設計 T03） */
@media (max-width: 640px) {
  body:not(.kind-error) { padding-bottom: 56px; }
  .fixed-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; box-shadow: 0 -4px 14px rgba(0,0,0,.08); }
  .fixed-cta a { flex: 1; text-align: center; padding: .85rem .5rem; font-weight: 700; text-decoration: none; }
  .fixed-tel { background: #fff; color: var(--brand); border-top: 1px solid var(--line); }
  .fixed-form { background: var(--brand); color: #fff; }
  .page-top { bottom: 70px; }
  .footer-links ul { columns: 1; }
  .news-thumb img { width: 88px; height: 64px; }
}

/* =============================================================================
   言語別の文字サイズ調整
   ビルマ語・ヒンディー語は字形が大きく文が長くなりやすいため、基準の文字サイズ（rem の基準）を下げる。
   rem で指定している見出し・ボタン・余白がまとめて縮む。
   ============================================================================= */
html:lang(my) { font-size: 87.5%; }   /* 14px */
html:lang(hi) { font-size: 93.75%; }  /* 15px */

/* ビルマ語：見出しは画面幅（vw）でも大きくなりすぎないようにする */
html:lang(my) .hero h1 { font-size: clamp(1.45rem, 3.2vw, 2.4rem); line-height: 1.6; }
html:lang(my) h2 { font-size: clamp(1.25rem, 2.4vw, 1.7rem); }
html:lang(my) .page-header h1 { font-size: clamp(1.4rem, 2.8vw, 2rem); }

/* ヘッダーのナビは折り返さない（入りきらない言語は下でハンバーガーメニューに切り替える） */
.nav { flex-wrap: nowrap; }
.nav a { white-space: nowrap; }

/* ヘッダーのナビが1行に入りきらないとき（main.js が .nav-collapsed を付ける）は、幅に関係なくハンバーガーメニューにする */
.header.nav-collapsed .menu-btn { display: block; }
.header.nav-collapsed .nav { position: absolute; top: 100%; left: 0; right: 0; background: #f7f9fc; border-bottom: 1px solid var(--line); display: grid; padding: .8rem 4%; gap: .2rem; transform: scaleY(0); transform-origin: top; opacity: 0; pointer-events: none; transition: .2s; }
.header.nav-collapsed .nav.open { transform: scaleY(1); opacity: 1; pointer-events: auto; }
.header.nav-collapsed .nav a { padding: .5rem 0; white-space: normal; }
.header.nav-collapsed .nav-cta { text-align: center; }
.logo, .lang-switch, .menu-btn { flex-shrink: 0; }

/* スマートフォン幅：ロゴ・言語プルダウン・メニューボタンを1行に収める（横スクロール防止。NF-EN-02）
   言語名は画面上は地球アイコンのみとし、読み上げ用に残す。ロゴは残りの幅に合わせて縮める */
@media (max-width: 480px) {
  .nav-wrap { gap: .6rem; }
  .logo { flex-shrink: 1; min-width: 0; }
  .logo img { width: auto; height: auto; max-height: 34px; max-width: 100%; }
  .lang-switch summary { padding: .3rem .55rem; }
  .lang-switch .lang-current { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* ---- 項目と値の表（kv 部品：事務所概要・料金表など）
   表の幅は中身に合わせて縮め（右側が余らない）、項目名の列は一番長い項目名に合わせる ---- */
.fee-table { width: fit-content; min-width: min(100%, 420px); max-width: 100%; }
.fee-table dl { display: grid; grid-template-columns: fit-content(50%) auto; column-gap: 0; }
.fee-table .fee-row dt { padding-right: 2.5rem; }   /* 列の間は余白で空け、点線がつながるようにする */
/* 見出し（h2）の下に入る表は一段下げる */
.blk-kv .fee-table { margin-left: 1.5rem; }
@media (max-width: 640px) { .blk-kv .fee-table { margin-left: .75rem; } }
.fee-row { display: contents; }
.fee-row dt, .fee-row dd { padding: .6rem 0; border-bottom: 1px dashed var(--line); }
.fee-row dt { color: var(--muted); }
.fee-row dd { text-align: left; word-break: keep-all; overflow-wrap: anywhere; }
.fee-row strong { white-space: normal; }
.fee-note { max-width: 40em; }
@media (max-width: 480px) {
  .fee-table { width: auto; min-width: 0; }
  .fee-table dl { grid-template-columns: 1fr; }
  .fee-row dt { border-bottom: 0; padding-bottom: 0; }
  .fee-row dd { padding-top: .1rem; }
}

/* =============================================================================
   公開HPレイアウト拡張（改修設計書 5〜7章）：両テーマ共通の構造
   見た目（ダーク配色・発光・演出）は theme-gateway.css で上書きする
   ============================================================================= */
/* 本文へ移動（フォーカス時のみ表示） */
.skip-link { position: absolute; left: 8px; top: -100px; z-index: 200; padding: .6rem 1rem; border-radius: 8px; background: var(--brand); color: #fff; font-weight: 700; text-decoration: none; }
.skip-link:focus { top: 8px; }
main:focus { outline: none; }
:focus-visible { outline: 2px solid var(--brand-2); outline-offset: 2px; }

/* ボタンの優先度（p1・p2・p3）。classic は既存の primary・ghost の見た目を基本にする */
.btn-p2 { background: var(--brand); color: #fff; }
.btn-lg { padding: .9rem 1.6rem; font-size: 1.05rem; }
.ext-mark { font-size: .8em; font-weight: 400; margin-left: .2em; }
.blk-cta .btn.ghost, .blk-cta-split .btn.ghost, .page-body .btn.ghost { border-color: var(--brand); color: var(--brand); }
.nav-cta-sub { background: transparent !important; color: var(--brand) !important; border: 1px solid var(--brand); }
.nav-cta-recruit { margin-left: .2rem; }

/* セクション */
.sec { position: relative; padding: clamp(3rem, 6vw, 5rem) 0; }
.sec.sp-compact { padding: clamp(2rem, 4vw, 3rem) 0; }
.sec.sp-wide { padding: clamp(4rem, 9vw, 7.5rem) 0; }
.sec.w-narrow .container { width: min(820px, 92%); }
.sec.w-wide .container { width: min(1280px, 92%); }
.sec-head { margin-bottom: 1.2rem; }
.sec-head h2 { margin-bottom: .6rem; }
.sec-lead { max-width: 40em; color: var(--muted); margin: 0; }
.sec-body > .blk:first-child { margin-top: 0; }
.sec-body > .blk:last-child { margin-bottom: 0; }
.sec-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.sec-bg svg { display: none; }
.sec.theme-surface, .sec.theme-deep { background: #eef2f8; }
.sec.theme-purple, .sec.theme-gradient { background: linear-gradient(160deg, #f7f9fc 0%, #e8edfb 100%); }
.sec > .container, .sec > .sec-body { position: relative; }
.page-home .sec .blk-heading { text-align: left; }

/* 下層ページヒーロー */
.page-hero { position: relative; padding: 0 0 clamp(1.5rem, 4vw, 2.5rem); background: linear-gradient(160deg, #f7f9fc 0%, #e8f0fb 100%); border-bottom: 1px solid var(--line); margin-bottom: 1.5rem; }
.page-hero-inner { position: relative; padding-top: clamp(1.5rem, 4vw, 2.5rem); }
.page-hero h1 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); margin: 0; line-height: 1.4; }
.page-hero-lead { max-width: 40em; margin: .8rem 0 0; color: var(--muted); }
.page-hero .breadcrumb { position: relative; }
.page-hero-bg { position: absolute; inset: 0; pointer-events: none; }

/* 3DゲートHERO（classic でも成立する最小限。演出は theme-gateway.css） */
.hero-gate { position: relative; min-height: 70vh; min-height: 70svh; display: grid; align-items: center; overflow: hidden; color: #fff; background: linear-gradient(135deg, #14284d 0%, #1f3a6b 55%, #2d5aa0 100%); }
.hero-gate-bg { position: absolute; inset: 0; }
.hero-gate-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-gate-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.hero-gate-content { position: relative; padding: 4rem 0; }
.hero-catch-en { margin: 0; font-weight: 700; letter-spacing: .12em; font-size: clamp(.9rem, 1.6vw, 1.1rem); }
.hero-gate h1 { font-size: clamp(2rem, 1.2rem + 4vw, 4rem); line-height: 1.25; margin: .6rem 0 1rem; text-wrap: balance; word-break: auto-phrase; }
.hero-sub { max-width: 34em; margin: 0; }
.hero-scroll { position: absolute; left: 50%; bottom: 1.2rem; transform: translateX(-50%); margin: 0; font-size: .75rem; letter-spacing: .3em; opacity: .8; }

/* カード：4列・価値観・将来構想 */
.grid.four { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .grid.four { grid-template-columns: repeat(2, 1fr); } }
.card-no { margin: 0; font-size: 2.4rem; font-weight: 700; line-height: 1; color: var(--accent); font-variant-numeric: tabular-nums; }
.card-en { margin: .2rem 0 .1rem; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-2); }
.card-status { margin: 0 0 .6rem; }
.label-future { display: inline-block; font-size: .8rem; font-weight: 700; padding: .1rem .7rem; border-radius: 999px; border: 1px dashed currentColor; color: var(--muted); }
.card-future { border-style: dashed; box-shadow: none; background: transparent; }

/* 技術スタック */
.tech-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 0; }
.tech-group { border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.2rem; background: var(--surface); }
.tech-group dt { font-weight: 700; margin-bottom: .5rem; }
.tech-group dd { margin: 0; }
.tech-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.tech-list li { font-size: .88rem; padding: .15rem .7rem; border: 1px solid var(--line); border-radius: 999px; }

/* 目的別の導線 */
.cta-split { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); }
.cta-split.cols-1 { --cols: 1; }
.cta-split.cols-2 { --cols: 2; }
.cta-split-item { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; padding: 1.4rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.cta-split-item .btn { margin-top: auto; }
.cta-audience { margin: 0; font-size: .85rem; color: var(--muted); font-weight: 700; }
.cta-split-title { margin: 0; font-size: 1.2rem; }
.cta-split-text { margin: 0 0 .6rem; }
.cta-p1 { border-color: var(--brand); border-width: 2px; }
@media (max-width: 900px) { .cta-split { grid-template-columns: 1fr; } }

/* フッターの導線 */
.footer-ctas ul { list-style: none; margin: 0; padding: 1.4rem 0 .2rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.footer-cta { display: inline-flex; align-items: center; min-height: 44px; padding: .4rem 1.1rem; border: 1px solid var(--brand); border-radius: 999px; color: var(--brand); text-decoration: none; font-weight: 700; }
.footer-cta-recruit { background: var(--brand); color: #fff; }
.footer-message { margin: .3rem 0 .6rem !important; color: var(--muted); }
.fixed-cta-recruit .fixed-form { flex: 1; }