/* =========================================================
   サイトリニューアル(2026-10) 共通部分: ヘッダー / ドロワー / フッター
   すべてのページで読み込まれる。クラス名は rn- で始まる(他のCSSと衝突しない)。
   ページ本文(.da-rn)のCSSは pages.css(build.py が生成)に分けてある。
   ========================================================= */
:root {
  --rn-night: #0f1e3a;
  --rn-night-deep: #0b1830;
  --rn-navy: #1b3a57;
  --rn-blue: #2a6bb3;
  --rn-gold: #b8955a;
  --rn-gold-l: #dcc69c;
  --rn-ink: #1d2433;
  --rn-muted: #5b6474;
  --rn-line: #dfe3ea;
  --rn-serif: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --rn-sans: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --rn-en: "Montserrat", "Zen Kaku Gothic New", sans-serif;
  --rn-gutter: clamp(20px, 5vw, 72px);
  --rn-hdr: 76px;
}
@media (max-width: 560px) { :root { --rn-hdr: 64px; } }

.rn-hdr, .rn-drawer, .rn-ftr, .rn-cta { font-family: var(--rn-sans); font-size: 16px; line-height: 1.9; -webkit-font-smoothing: antialiased; box-sizing: border-box; }
.rn-hdr *, .rn-drawer *, .rn-ftr *, .rn-cta * { box-sizing: border-box; }
.rn-hdr :is(a, button):focus-visible, .rn-drawer :is(a, button):focus-visible, .rn-ftr a:focus-visible, .rn-cta a:focus-visible { outline: 3px solid var(--rn-gold); outline-offset: 3px; }
.rn-wrap { width: 100%; max-width: calc(1240px + var(--rn-gutter) * 2); margin-inline: auto; padding-inline: var(--rn-gutter); }

/* ---------- 丸ボタン ---------- */
.rn-pill { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 46px; padding: 0 24px; border: 1.5px solid var(--rn-blue); border-radius: 999px; background: var(--rn-blue); color: #fff; font: inherit; font-weight: 700; font-size: 14px; letter-spacing: .08em; text-decoration: none; cursor: pointer; transition: background .25s, border-color .25s; }
.rn-pill:hover { background: #1f568f; border-color: #1f568f; color: #fff; }

/* ---------- ヘッダー ---------- */
.rn-hdr { position: fixed; inset: 0 0 auto 0; z-index: 1000; height: var(--rn-hdr); display: flex; align-items: center; color: #fff; transition: background .35s, color .35s, box-shadow .35s; }
body.admin-bar .rn-hdr { top: 32px; }
@media (max-width: 782px) { body.admin-bar .rn-hdr { top: 46px; } }
.rn-hdr.is-solid, body:not(.rn-hero) .rn-hdr { background: #fff; color: var(--rn-ink); box-shadow: 0 1px 0 var(--rn-line); }
/* 写真のないページは、固定ヘッダーの高さぶん本文を下げる */
body:not(.rn-hero) #wrapper { padding-top: var(--rn-hdr); }

.rn-hdr__plate { align-self: stretch; display: flex; align-items: center; padding: 0 56px 0 var(--rn-gutter); background: #fff; clip-path: polygon(0 0, 100% 0, calc(100% - 34px) 100%, 0 100%); }
.rn-hdr__plate img { display: block; height: 50px; width: auto; }
.rn-gnav { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 36px); margin-left: auto; }
.rn-gnav__item { position: relative; display: flex; align-items: center; height: var(--rn-hdr); }
.rn-gnav__a { position: relative; padding: 6px 0; font-size: 14.5px; font-weight: 700; letter-spacing: .06em; white-space: nowrap; color: inherit; text-decoration: none; }
.rn-gnav__a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--rn-gold); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.rn-gnav__item:hover > .rn-gnav__a::after, .rn-gnav__item:focus-within > .rn-gnav__a::after, .rn-gnav__a[aria-current="page"]::after, .rn-gnav__item.is-ancestor > .rn-gnav__a::after { transform: scaleX(1); }
/* ドロップダウン(サブメニュー)。マウスを乗せる/キーボードでフォーカスすると開く */
.rn-gnav__item.has-sub > .rn-gnav__a { padding-right: 16px; }
.rn-gnav__item.has-sub > .rn-gnav__a::before { content: ""; position: absolute; right: 2px; top: 50%; width: 6px; height: 6px; margin-top: -5px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); opacity: .75; }
.rn-sub { position: absolute; top: 100%; left: 50%; min-width: 260px; padding-top: 0; opacity: 0; visibility: hidden; transform: translate(-50%, 8px); transition: opacity .25s, transform .25s, visibility .25s; }
.rn-sub ul { margin: 0; padding: 10px 0; list-style: none; background: #fff; color: var(--rn-ink); border-radius: 12px; box-shadow: 0 18px 40px rgba(15,30,58,.22); }
.rn-gnav__item.has-sub:hover > .rn-sub, .rn-gnav__item.has-sub:focus-within > .rn-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.rn-sub li { margin: 0; }
.rn-sub__a { display: block; padding: 10px 24px; font-size: 14px; font-weight: 500; letter-spacing: .04em; white-space: nowrap; color: var(--rn-ink); text-decoration: none; }
.rn-sub__a:hover, .rn-sub__a:focus-visible { background: #f3f5f8; color: var(--rn-navy); }
.rn-sub__a[aria-current="page"] { color: var(--rn-gold); font-weight: 700; }
.rn-hdr__tel { margin-left: clamp(16px, 2vw, 32px); font-family: var(--rn-en); font-weight: 600; font-size: 18px; letter-spacing: .02em; line-height: 1.2; text-align: right; color: inherit; text-decoration: none; }
.rn-hdr__tel small { display: block; font-family: var(--rn-sans); font-size: 11px; font-weight: 400; letter-spacing: 0; opacity: .75; }
.rn-hdr__cta { margin: 0 var(--rn-gutter) 0 20px; }
.rn-burger { display: none; width: 46px; height: 46px; margin: 0 var(--rn-gutter) 0 12px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.rn-burger__bars { position: relative; display: block; width: 22px; height: 16px; margin: auto; }
.rn-burger__bars i { position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor; }
.rn-burger__bars i:nth-child(1) { top: 0; } .rn-burger__bars i:nth-child(2) { top: 7px; } .rn-burger__bars i:nth-child(3) { bottom: 0; }

@media (max-width: 1340px) { .rn-hdr__tel { display: none; } }
@media (max-width: 1240px) {
  .rn-gnav { display: none; }
  .rn-hdr__cta { margin: 0 0 0 auto; }
  .rn-burger { display: block; }
}
@media (max-width: 560px) { .rn-hdr__plate { padding-right: 40px; } .rn-hdr__plate img { height: 40px; } .rn-hdr__cta { padding: 0 16px; } }

/* ---------- ドロワー(狭い画面のメニュー。開閉はArkheの data-drawer を利用) ---------- */
.rn-drawer { position: fixed; inset: 0; z-index: 1100; overflow-y: auto; background: var(--rn-night); color: #fff; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .3s, visibility .3s; }
html[data-drawer="opened"] .rn-drawer { opacity: 1; visibility: visible; pointer-events: auto; }
.rn-drawer__in { position: relative; min-height: 100%; padding: calc(var(--rn-hdr) + 16px) var(--rn-gutter) 48px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; }
.rn-drawer__close { position: absolute; top: 14px; right: var(--rn-gutter); width: 46px; height: 46px; border: 0; border-radius: 50%; background: transparent; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; }
.rn-drawer__nav { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.2); }
.rn-drawer__nav li { margin: 0; border-bottom: 1px solid rgba(255,255,255,.2); }
.rn-drawer__nav a { display: block; padding: 18px 4px; font-family: var(--rn-sans); font-size: clamp(18px, 4.8vw, 22px); font-weight: 700; letter-spacing: .06em; color: #fff; text-decoration: none; } /* PCのメニューと同じゴシック体(Zen Kaku Gothic New・太字) */
.rn-drawer__nav a[aria-current="page"] { color: var(--rn-gold-l); }
.rn-drawer__nav > li > a { padding-bottom: 10px; }
.rn-drawer__sub { margin: 0 0 14px; padding: 0 0 0 4px; list-style: none; border: 0; }
.rn-drawer__sub li { border: 0; }
.rn-drawer__sub a { padding: 8px 4px 8px 18px; font-family: var(--rn-sans); font-size: 15px; font-weight: 500; letter-spacing: .04em; color: #cfd8e8; }
.rn-drawer__sub a::before { content: "—"; margin-right: 10px; color: var(--rn-gold); }
.rn-drawer__tel { display: block; font-family: var(--rn-en); font-weight: 600; font-size: clamp(32px, 9vw, 44px); line-height: 1.2; color: #fff; text-decoration: none; }
.rn-drawer__hours { margin: 4px 0 20px; font-size: 14px; color: #b9c4d8; }

/* ---------- お問い合わせの帯(.da-rn 以外のページだけ) ---------- */
.rn-cta { background: var(--rn-navy); color: #fff; padding: clamp(40px, 6vw, 72px) 0; }
.rn-cta__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; }
.rn-cta__h { margin: 0; font-family: var(--rn-serif); font-weight: 700; font-size: clamp(22px, 3vw, 34px); line-height: 1.5; }
.rn-cta__body { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.rn-cta__tel { font-family: var(--rn-en); font-weight: 600; font-size: clamp(30px, 4vw, 44px); line-height: 1.2; color: #fff; text-decoration: none; }
.rn-cta__hours { font-size: 14px; color: #b9c4d8; }

/* ---------- フッター ---------- */
.rn-ftr { background: var(--rn-night-deep); color: #c3cde0; padding: 72px 0 28px; font-size: 14px; }
.rn-ftr__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 40px 64px; }
.rn-ftr__logo { display: block; height: 56px; width: auto; }
.rn-ftr__name { margin: 12px 0 0; font-size: 18px; font-weight: 700; color: #fff; }
.rn-ftr__tel { margin: 8px 0 0; }
.rn-ftr__offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; line-height: 1.8; }
.rn-ftr__offices dt { margin-bottom: 4px; font-weight: 700; color: #fff; }
.rn-ftr__offices dd { margin: 0; }
.rn-ftr__nav { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 44px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.16); }
.rn-ftr__nav a { color: inherit; text-decoration: none; }
.rn-ftr__nav a:hover { color: #fff; text-decoration: underline; }
.rn-ftr__copy { margin: 28px 0 0; font-size: 12px; color: #7d8ba5; }
@media (max-width: 860px) { .rn-ftr__grid { grid-template-columns: 1fr; } .rn-ftr__offices { grid-template-columns: 1fr; gap: 16px; } }

/* ---------- リニューアル本文(.da-rn)のページ: Arkheのタイトル帯などを隠す ---------- */
body.rn-da :is(.p-topArea, .c-pageTitle, .p-page__title, .p-breadcrumb, .c-breadcrumb, #breadcrumb, .l-sidebar, #sidebar) { display: none !important; }
body.rn-da { overflow-x: clip; }
body.rn-da :is(#content, .l-content, .l-content__body, #main_content, .l-main, .l-main__body, .c-postContent) { margin: 0 !important; padding: 0 !important; max-width: none !important; }
html { scroll-padding-top: calc(var(--rn-hdr) + 8px); }
@media (prefers-reduced-motion: reduce) { .rn-hdr, .rn-drawer, .rn-gnav a::after { transition: none; } }

/* ---------- スマホ: フッター下の白い余白をなくす ----------
   追加CSS(da-column.css)の「@media(max-width:767px){body{padding-bottom:64px}}」は、
   画面下に固定する追従バー(.da-sticky)が本文に重ならないための余白。
   新フッターには追従バー(フローティングメニュー)を出さないので、余白は0にする。 */
@media (max-width: 767px) {
  body { padding-bottom: 0 !important; }
}
