/* Subpages1：サイト共通MENU（TOP・全下層）を Menu Vertical（21st.dev @berlix/components/menu-vertical、配布元の実装は larsen66/menu-vertical）へ。
   原作の構成と動き：文字だけの縦のリスト（間 16px）、各項目は「矢印＋文字」。待機時は矢印が左に隠れて透明（x:-100%・opacity 0）、文字は
   矢印の幅だけ左へ寄る（x:-40px）。ポインターを重ねると矢印が出て（x:0・opacity 1）、文字が右へ戻り、どちらもオレンジになる（0.3s easeOut）。
   矢印は lucide arrow-right（線の太さ 3）を文字の約 1.1 倍、文字は semibold・36px（text-4xl）。ダークモードでは白い文字（zinc-50）。
   TOP に合わせて変えたところ：書体は TOP の明朝、オレンジは TOP の ArrowFillButton の #ff5f00（原作 #ff6900）。
   Fix2（2026-10-13）：MENU の地を原作の通常（ライト）表示どおり白にし、文字は濃色（TOP の文字色 #1b1813、原作 zinc-900 相当）。
   Subpages1 の「既存の墨色の地＋白文字（原作のダークモード相当）」を置き換えた。開くパネルだけの変更で、閉じたヘッダー本体（濃色の固定バー）・
   MENU ボタン・項目・順番・リンク先は変えていない。日本語の項目が欠けないよう文字は 22〜34px で折り返し可。触れる端末ではホバーの動きを使わず、
   1回のタップでそのまま移動する。キーボードのフォーカスではホバーと同じ表示。開閉ボタン・リンク先・対応エリアの開閉・電話は既存のまま。 */
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:8px 0 4px}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item,
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-unavailable{
  position:relative;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;width:auto;max-width:100%;min-height:44px;margin:0;padding:6px 0;border:0;background:transparent;box-shadow:none;
  font-family:var(--hal-serif,'Zen Old Mincho',serif);font-size:clamp(22px,5.8vw,34px);font-weight:600;line-height:1.35;letter-spacing:.02em;color:#1b1813;text-decoration:none;
  cursor:pointer;transition:none;-webkit-tap-highlight-color:transparent}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-unavailable{cursor:default;color:rgba(27,24,19,.45)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv :is(.hal-mv__item,.hal-menu-unavailable)::before,
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv :is(.hal-mv__item,.hal-menu-unavailable)::after{content:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__arrow{flex:0 0 auto;display:block;width:1.1em;height:1.1em;color:inherit;opacity:0;transform:translateX(-100%);
  transition:transform .3s cubic-bezier(0,0,.58,1),opacity .3s cubic-bezier(0,0,.58,1),color .3s cubic-bezier(0,0,.58,1)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__label{display:block;min-width:0;transform:translateX(calc(-1.1em - 8px));overflow-wrap:anywhere;line-break:strict;
  transition:transform .3s cubic-bezier(0,0,.58,1),color .3s cubic-bezier(0,0,.58,1)}
@media (hover:hover) and (pointer:fine){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:hover{color:#ff5f00}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:hover .hal-mv__arrow{opacity:1;transform:none}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:hover .hal-mv__label{transform:none}
}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus{outline:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus-visible{color:#ff5f00;outline:1px solid #1b1813;outline-offset:4px}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus-visible .hal-mv__arrow{opacity:1;transform:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus-visible .hal-mv__label{transform:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:is(:active,:visited){text-decoration:none}

/* Fix2：開いたパネルの地・区切り・電話の文字（既存の #14110d／rgba(20,17,13,.98) の地と白系の文字を置き換え） */
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel{background:#fff;border-bottom:1px solid #e5e5e5;color:#1b1813}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-tel{color:#1b1813}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-tel:is(:hover,:focus-visible){color:#ff5f00}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-tel:focus-visible{outline:2px solid #1b1813;outline-offset:2px}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-tel-note{color:#6b6356}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-actions{border-top:1px solid #e5e5e5;padding-top:12px}

/* 対応エリア（港区・中央区）：開閉は既存の details のまま。見出しの項目は同じ表示、右に開閉の印。子の2項目は小さく下げる。 */
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-area{width:100%;margin:0;padding:0;border:0}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-area>summary.hal-mv__item{list-style:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-area>summary.hal-mv__item::-webkit-details-marker{display:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__toggle{position:relative;flex:0 0 auto;width:.62em;height:.62em;margin-left:.2em;transform:translateX(calc(-1.1em - 8px));transition:transform .3s cubic-bezier(0,0,.58,1)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__toggle::before,
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__toggle::after{content:'';position:absolute;left:0;top:50%;width:100%;height:2px;margin-top:-1px;background:currentColor;transition:transform .2s}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__toggle::after{transform:rotate(90deg)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-area[open] .hal-mv__toggle::after{transform:rotate(0deg)}
@media (hover:hover) and (pointer:fine){:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:hover .hal-mv__toggle{transform:none}}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus-visible .hal-mv__toggle{transform:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:2px 0 6px;padding:0 0 0 1.4em}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children .hal-mv__item{font-size:clamp(17px,4.4vw,24px);font-weight:500;color:#3d3931}
@media (prefers-reduced-motion:reduce){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv :is(.hal-mv__arrow,.hal-mv__label,.hal-mv__toggle){transition:none}
}

/* ---------- Fix4 T02（2026-10-14、PC＝1024px 以上の既存のヘッダーの PC 判定）：MENU を内容の高さの縦長パネルへ ----------
   Fix3 までは開いたパネルが全幅・文字 22〜34px（semibold）で、ヘッダー＋パネルが画面のほぼ全体（1440×900 で 778px）を白く覆っていた。
   項目の文字は OfficeFix1 の MENU の値へ戻す（OfficeFix1 を隔離 WordPress で実測：16px・行間 28.8px・太さ 500・字間 0.12em・明朝）。
   パネルは MENU ボタンの下・右端揃え（右端 = ヘッダーの左右の余白 --hal-pad）の幅 400px、高さは項目と電話の高さ＋上下の余白。
   画面に収まらないときだけパネルの中でスクロール（max-height は hal-hub-rail.js が画面の下端までに設定）。
   背景のページを覆う操作用レイヤー（.hal-menu-backdrop、hal-hub-rail.js が作る）はパネル本体と別の要素で、押すと閉じる。
   項目・順番・リンク先・対応エリアの開閉・電話・閉じるボタン・Esc・フォーカスの戻り・スクロールの固定は既存のまま。モバイルは変えない。 */
.hal-menu-backdrop{display:none}
@media (min-width:1024px){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel{position:absolute;top:100%;right:var(--hal-pad,28px);left:auto;box-sizing:border-box;width:min(400px,calc(100vw - 2 * var(--hal-pad,28px)));
    margin:0;padding:18px 28px 20px;border:1px solid #e5e5e5;border-top:0;border-radius:0 0 12px 12px;background:#fff;box-shadow:0 24px 48px -16px rgba(10,10,12,.35);overflow-y:auto;overscroll-behavior:contain}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv{gap:0;padding:0}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv :is(.hal-mv__item,.hal-menu-unavailable){min-height:44px;padding:7px 0;
    font-size:16px;font-weight:500;line-height:28.8px;letter-spacing:.12em}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children .hal-mv__item{font-size:15px;line-height:27px}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__arrow{width:1.05em;height:1.05em}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel.hal-header__panel .hal-header__panel-actions{margin-top:12px}
  body.hal-menu-open .hal-menu-backdrop{display:block;position:fixed;inset:0;z-index:999;background:rgba(10,10,12,.32);cursor:pointer}
}

/* ---------- Fix7（2026-10-15、Owner 指示 v04 COMMON-01・MOBILE-02）：項目の頭の「・」、2 行の対応エリア、モバイルの文字の大きさ、入力方法で分けた表示 ----------
   各項目は「記号の欄（1.1em）＋文字」の 2 列。記号の欄には常に「・」、PC のマウスのホバーとキーボードのフォーカスでは同じ欄の中で矢印に入れ替わる
   （重ならない・文字は横へ動かさない）。2 行以上の文字は 2 行目の先頭が 1 行目の文字の先頭にそろう。電話の行は対象外。
   対応エリアは開閉をやめた見出し（リンクではない）：1 行目「対応エリア」、2 行目は注記「（港区・中央区・23区その他）」で、注記の先頭は見出しの
   文字の先頭にそろう。その下に港区・中央区の 2 リンクを常に表示（記号の欄の位置を見出しの文字の先頭にそろえる）。
   ホバーの動き（上の @media）は「ホバーできて精密なポインターがある」端末だけ。タッチでは「・」のまま、押している間だけ色が変わる。
   キーボードのフォーカスの表示（:focus-visible）はすべての端末でそのまま。 */
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv{--mv-fs:clamp(22px,5.8vw,34px);--mv-lh:1.35}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv :is(.hal-mv__item,.hal-menu-unavailable,.hal-mv__head){
  display:grid;grid-template-columns:1.1em minmax(0,1fr);column-gap:8px;align-items:start;font-size:var(--mv-fs);line-height:var(--mv-lh)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__label{transform:none}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__mark{position:relative;display:block;width:1.1em;overflow:hidden;line-height:inherit;text-align:center}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__dot{display:block;transition:opacity .3s cubic-bezier(0,0,.58,1)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__mark .hal-mv__arrow{position:absolute;left:0;top:50%;width:1.05em;height:1.05em;margin-top:-.525em}
@media (hover:hover) and (pointer:fine){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:hover .hal-mv__dot{opacity:0}
}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:focus-visible .hal-mv__dot{opacity:0}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__item:active{color:#ff5f00}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__head{min-height:44px;margin:0;padding:6px 0;border:0;background:transparent;font-family:var(--hal-serif,'Zen Old Mincho',serif);
  font-weight:600;letter-spacing:.02em;color:#1b1813;cursor:default}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__head-main{display:block}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__head-note{display:block;font-size:13px;font-weight:500;line-height:1.6;letter-spacing:.04em;color:#3d3931;white-space:nowrap}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-area{display:block}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children{padding-left:calc(1.1 * var(--mv-fs) + 8px)}
:is(#hal-wp-fv,.hal-lp) .hal-header__panel [data-hal-menu-panel]:focus,:is(#hal-wp-fv,.hal-lp) .hal-header__panel[data-hal-menu-panel]:focus{outline:none}   /* パネル自体（操作する部品ではない）のフォーカス */
@media (max-width:767.98px){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv{--mv-fs:20px;--mv-lh:1.6}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children .hal-mv__item{font-size:18px}
}
@media (min-width:1024px){
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv{--mv-fs:16px;--mv-lh:28.8px}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__head{padding:7px 0;font-weight:500;letter-spacing:.12em}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__head-note{letter-spacing:.04em}
  :is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-menu-children .hal-mv__item{font-size:15px;line-height:27px}
}
@media (prefers-reduced-motion:reduce){:is(#hal-wp-fv,.hal-lp) .hal-header__panel .hal-site-menu.hal-mv .hal-mv__dot{transition:none}}