@charset "UTF-8";
/* ==========================================================
   奥飛騨冬物語 TOP — access セクション
   2026-08-05 新カンプ反映（y10238–11203 / 高さ965）
   淡青#ecf3f9背景・レイアウト左右反転（左=白カード2枚+注記+青ボタン／右=地図）
   座標は 2xマスター top_server.jpg 実測（1x換算）
   ========================================================== */

.access {
  position: relative;
  width: var(--canvas);
  height: 965px;
  /* 上898pxが淡青、以降67pxは白（次セクション logos へつながる余白） */
  background: linear-gradient(
    to bottom,
    var(--color-pale) 0,
    var(--color-pale) 898px,
    var(--color-white) 898px,
    var(--color-white) 100%
  );
  overflow: hidden;
}

/* ---- 筆記体 Access（白・カンプ実測 236×79 / left104 top75） ---- */
.access__script {
  position: absolute;
  left: 104px;
  top: 75px;
  margin: 0;
  width: 236px;
  height: 79px;
  background-image: url(../../img/script/access_white_pc.png);
}

/* ---- 見出し アクセス（青・42px） ---- */
.access__title {
  position: absolute;
  left: 122px;
  top: 123.5px;
  margin: 0;
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 42px;
  line-height: 1;
  letter-spacing: -0.016em;
  color: var(--color-blue);
  white-space: nowrap;
}

/* ---- リード2行（24px・インク色）
   カンプはFigmaの日本語カーニングで約物・かなが詰まっている。
   Zen Old Mincho に palt が無いため行単位の負トラッキングで総幅を合わせる ---- */
.access__lead {
  position: absolute;
  left: 126px;
  margin: 0;
  font-family: var(--font-jp);
  font-weight: 400;
  /* 2026-09-02 サイズ相殺の是正: カンプのリードは字面19.5px(1x)＝font-size約21.3px相当で
     漢字送り24px（＝+2.7pxのゆったりトラッキング）。実装は24pxの字面を負トラッキングで
     押し込み行幅だけ一致させていた（実測 h44 vs 39(2x)）。字面と送りの両方をカンプへ */
  font-size: 21.3px;
  line-height: 1;
  color: var(--color-ink);
  white-space: nowrap;
}
.access__lead--1 { top: 195.5px; letter-spacing: 2.7px; }
.access__lead--2 { top: 235.5px; letter-spacing: 2.7px; }

/* ---- 白角丸カード2枚（351×132・radius14） ---- */
.access__card {
  position: absolute;
  left: 126px;
  width: 351px;
  height: 132px;
  border-radius: 14px;
  background: var(--color-white);
}
.access__card--car   { top: 332px; }
.access__card--train { top: 485px; }

.access__col {
  position: absolute;
  margin: 0;
  font-family: var(--font-jp);
  font-weight: 400;
  line-height: 1;
  color: var(--color-ink);
  white-space: nowrap;
}
/* 見出し行【…】: カンプ字面実測(h34/2x)より18.4px（20pxは過大＝サイズ相殺の是正 2026-09-02）。
   括弧の左サイドベアリングぶん左へ寄せてインク左端をx157に合わせる */
.access__head1,
.access__head2 {
  left: 19px;
  font-size: 18.4px;
  letter-spacing: 0.77px;
}
/* 項目行: 20px。行ごとにかな比率が違うのでトラッキングを個別調整 */
.access__item1,
.access__item2,
.access__item3,
.access__item4 {
  left: 24px;
  /* 2026-09-02: カンプの項目行は字面実測16px(1x)＝font-size約17.8px相当（見出し・リードは20px級で一致、項目だけ小さい）。
     20pxのままだと送りを合わせても字面が12%大きく密度が別物になる。字送りは下の文字クラスで再構成 */
  font-size: 17.8px;
}
.access__head1 { top: 22.5px; }
/* 2026-09-02 文字組み再調整（市岡さん指摘「調整後も字間が違う」）:
   カンプは かな約24%詰め・英数はゆったり・漢字はほぼベタ、という文字クラス別の組み。
   一律の負トラッキングでは漢字まで詰まってリズムが別物になるため、
   かな(.access__kn)/英字(.access__lt)/数字(.access__dg) をspanで分けてクラス別に送りを持つ。
   目標=カンプのグリフ中心位置±1.5px(1x)（glyphrun.pyで実測） */
.access__item1 { top: 58.5px; letter-spacing: 1.2px; }
.access__item2 { top: 88.5px; letter-spacing: 1.2px; }
/* カード2の実測top=485.5px。面はピクセルスナップで485に置くため、
   行位置を+0.5して文字の絶対座標（y508.5/544.5/574.5）をカンプに揃える */
.access__head2 { top: 23.5px; letter-spacing: 0.33px; }  /* 2026-09-02 18.4px化に伴い再実測（comp w256/1x） */
.access__item3 { top: 59.5px; letter-spacing: 1.2px; }
.access__item4 { top: 89.5px; letter-spacing: 1.2px; }
/* 文字クラス別の送り（PC限定。SPは従来の一律値のまま＝監査でSPは合格済みのため） */
@media (min-width: 768px) {
  /* 送りの根拠は全てカンプのグリフ中心実測（charpos.js/cmp_items.pyで±2px以内を確認）。
     カンプはひらがな強詰め（よ12.5/り16.5相当）・カタカナほぼベタ・英字+0.06em・数字-0.043em */
  .access__lt { letter-spacing: 2.7px; }
  .access__dg { letter-spacing: 0.4px; }
  .access__tA { letter-spacing: -2.55px; }  /* か（→ら 15.25px） */
  .access__tB { letter-spacing: -1.05px; }  /* ら（→約 16.75px） */
  .access__tC { letter-spacing: -5.3px; }   /* よ（→り 12.5px） */
  .access__tD { letter-spacing: -1.3px; }   /* り（→バ 16.5px） */
  /* ・→次字: カンプは対漢字15.5px／対英字10.5px（PCの__yakuはSP専用で未定義＝素のままだった） */
  .access__item1 .access__yaku, .access__item2 .access__yaku,
  .access__item4 .access__yaku { letter-spacing: -2.3px; }
  .access__item3 .access__yaku { letter-spacing: -5.1px; }
  /* リード（21.3px化に伴う文字クラス別送り。カンプ実測: 漢字24/かな≒20.3/読点・句点≒16/中黒≒12.5/数字≒11.6） */
  .access__kna { letter-spacing: 0.4px; }
  .access__knt { letter-spacing: -2.4px; }  /* らなる（カンプ18〜20.5px送り） */
  .access__knb { letter-spacing: -1.7px; }  /* 市のあとの「に」 */
  .access__knw { letter-spacing: 2.5px; }   /* 「で」（カンプ で→す 23.75px送り） */
  .access__dg5 { letter-spacing: 1.7px; }
  .access__mru { letter-spacing: -7.4px; }
  .access__lead--1 .access__yaku { letter-spacing: -9.6px; }
  .access__lead-a .access__yaku { letter-spacing: -8.8px; }
}

/* ---- 注記（14px） ---- */
.access__note {
  position: absolute;
  left: 125px;
  top: 635px;
  margin: 0;
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 12.9px;  /* 2026-09-02 カンプ字面実測(h23/2x)より。14pxは過大 */
  line-height: 1;
  letter-spacing: -0.036em;
  color: var(--color-ink);
  white-space: nowrap;
}

/* ---- 詳細を見る ボタン（290×60 = .u-btn 基準寸法。ラベルのみ20px） ---- */
.access__btn {
  position: absolute;
  left: 126px;
  top: 698.5px;  /* 2026-08-19 市岡さん指示: ボタン上余白をPC50px/SP45pxに統一（カンプのばらつき補正） */
  font-size: 20px;
  letter-spacing: 0.10em;
  /* 負のindentは中央寄せの補正（カンプのインク左端x215に合わせる） */
  text-indent: -0.20em;
  padding-bottom: 3px; /* CJKの視覚重心をカンプ（インク中心y726.75）に合わせる */
}
/* 矢印: 2026-09-09に正本SVG（base.cssの --arrow）へ統一。
   旧はここだけ ::after=軸 / ::before=矢頭 と base.css と役割が逆で、
   さらに矢頭が45度だったためカンプ（約34度・頂点は軸の右端）と形が違っていた。
   頂点は従来どおり right:25px（＝旧・軸の右端）に置く */
.access__btn::before { content: none; }
.access__btn::after {
  content: "";
  position: absolute;
  right: 24.5px;
  top: 50%;
  width: 14px;
  height: 11px;
  border: 0;
  border-radius: 0;
  background: currentColor;
  transform: translateY(-50%);
  -webkit-mask: var(--arrow) no-repeat center / 100% 100%;
  mask: var(--arrow) no-repeat center / 100% 100%;
}

/* ---- 地図（700×493・右カラム） ---- */
.access__map {
  position: absolute;
  left: 540px;
  top: 331px;
  width: 700px;
  height: 493px;
}

/* ==========================================================
   SP（設計幅393px / 新SPカンプ 2026-08-05 実測 y7815–8743・高さ928）
   縦1列: 筆記体→見出し→リード3行→白カード2枚→注記→全幅地図→ボタン
   PCの「下67pxだけ白」のグラデは無く、下端まで淡青1色。
   座標は2xマスター top_sp_server.jpg 実測（1x換算）。
   ========================================================== */
@media (max-width: 767px) {

  .access {
    width: var(--canvas);
    height: 963px;  /* 2026-08-20 市岡さん指示: ボタン下の余白が窮屈（30px）→+35で65pxに */
    background: var(--color-pale);
  }

  /* 筆記体 Access（白・カンプ ink x26.5–128.5 / y44.0–78.5＝102×34.5） */
  .access__script {
    left: 26.5px;
    top: 44px;
    width: 102px;
    height: 34.5px;
    background-image: url(../../img/script/access_white_sp.png);
  }

  /* 見出し アクセス（カンプ ink x28.0–121.0 / y71.0–90.0・字送り25.17px） */
  .access__title {
    left: 24px;
    top: 66px;
    font-size: 26px;
    letter-spacing: -0.019em;
  }

  /* リード3行（カンプ実測: 字送り16.0 / 行送り28 / 字面はPCより小さく 14.3px＝広めトラッキング）
     2行目は u-sp-br で2行に分割し、字詰めの違う行を別spanにしている
     （PCでは u-sp-br が display:none＝改行されず、spanは無指定なので表示不変） */
  .access__lead {
    left: 26px;
    font-size: 14.3px;
    line-height: 28px;
  }
  .access__lead--1 { top: 106px; letter-spacing: 0.1189em; }
  .access__lead--2 { top: 134px; letter-spacing: normal; }
  /* 2026-09-02 文字組み補正: カンプは中黒「・」が半角。実測（2xマスター）で
     漢字字送り16.25px / 中黒字送り8.25px（・→・の実測 81.5px と 114px の差分から算出）。
     実装は一律14.24px送り＋中黒も全角だったため、行の総幅は合っていても
     14字目「新」で最大+5.0pxの字位置ズレが出ていた。
     漢字側を16.25px送りに戻し（ls +1.95px）、中黒だけ span で半角送りにする */
  .access__lead-a { letter-spacing: 1.95px; }
  .access__lead-b { letter-spacing: 0.0539em; }

  /* 白角丸カード2枚（カンプ実測 x19.6–368.6＝349幅 / 高さ117 / radius14） */
  .access__card {
    left: 19.6px;
    width: 349px;
    height: 117px;
    border-radius: 14px;
  }
  .access__card--car   { top: 218px; }
  .access__card--train { top: 345px; }

  /* カード内テキスト（カード上端からの相対: 見出し22 / 項目54・81） */
  /* 2026-09-01 横山さん指示「SPの文字が大きい」: SP本文の基準は14〜14.5pxなのに
     ここだけ 16 / 15.9px で一段大きく、行の詰まり感の主因になっていた。
     見出し16→15px・項目15.9→14.5px。項目の送り（top 54→81＝27px）は据え置きなので、
     文字が小さくなったぶん行間が実質的に広がる。カード高117pxは不変 */
  .access__head1,
  .access__head2 {
    left: 16.9px;
    font-size: 15px;
  }
  .access__item1,
  .access__item2,
  .access__item3,
  .access__item4 {
    left: 26.4px;
    font-size: 14.5px;
  }
  .access__head1 { top: 21px; letter-spacing: 0.0675em; }
  .access__item1 { top: 54px; letter-spacing: 0.0252em; }
  .access__item2 { top: 81px; letter-spacing: 0.0252em; }
  .access__head2 { top: 21px; letter-spacing: 0.0568em; }
  .access__item3 { top: 54px; letter-spacing: 0.0211em; }
  .access__item4 { top: 81px; letter-spacing: 0.0011em; }

  /* Figmaの約物半角（・、）の再現。CSSでは全角のままなので、
     約物だけ span で字送りを詰め（letter-spacing）、その分は margin で相殺して
     後続の文字位置をカンプに一致させる（margin-left+margin-right=0 なので後続は不動）。
     カンプ実測の送り: リード 、=7.0（全角16.0）／カード項目 ・=9.5（全角17.0）。
     ※リード2行目の ・ は span 化しない: PCでは .access__lead--2 の負トラッキングと
       シェイピング分割が干渉して4か所で字位置がズレ、PC回帰0.15%になるため
       （行全体の均一トラッキングで総幅だけ合わせる。SP差分は+0.10ptで済む） */
  .access__lead--1 .access__yaku {
    letter-spacing: -7.3px;
    margin-left: -4.5px;
    margin-right: 4.5px;
  }
  /* カンプは「に」の後で1字ぶん詰まる（Figmaのかな詰め）。末尾3字をspanで引き戻す。
     2026-09-02 追記: 末尾「位置する」の中の字送りもカンプは15.67px（実測 位→る 47.0px/3送り）
     で、実装の16.67pxより1.0px広かった。行インク幅が +4.0px（カンプ282.5 / 実装286.5）に
     なっていた主因なので ls -1.0px を足す（margin-left は据え置き＝先頭「位」の位置は不変）。
     ※ span の letter-spacing は親の値を「加算」ではなく「置換」する。親 .access__lead--1 は
       0.1189em×14.3px = 1.70px なので、-1.0px したい時に書く値は 1.70-1.00 = 0.70px */
  .access__lead--1 .access__kern { margin-left: -3.5px; letter-spacing: 0.7px; }
  .access__col .access__yaku {
    letter-spacing: -6.4px;
    margin-left: -3.4px;
    margin-right: 3.4px;
  }
  /* 2026-09-02: 上のコメントで「lead2行目の・はspan化しない」としていた判断を撤回。
     カンプ実測で中黒は明確に半角（送り8.25px vs 実装14.24px＝Δ5.99px）で、
     span なしでは14字目「新」が+5.0pxずれる。PC側は @media 外なので
     .access__lead-a .access__yaku は当たらない。span 追加によるPCのシェイピング分割は
     実測で pixel-diff 0.11%（差分は .access__lead--2 の1行のみ・y477–522）、
     字位置は6か所が+0.5px動くだけで行インク両端 x254/x1743 は完全不変（2x実測）。
     ※ span の letter-spacing は親の値の加算ではなく置換なので、font-size 14.3px に対して
       8.25px 送りにしたい時に書く値は 8.25-14.3 = -6.05px（親の 1.95px は効かない）。
     margin は中黒インクだけを左に3.3px寄せる（左右で相殺するので後続の字位置は動かさない） */
  .access__lead-a .access__yaku {
    letter-spacing: -6.05px;
    margin-left: -3.3px;
    margin-right: 3.3px;
  }

  /* 注記（カンプ ink x21.0–329.5 / y478.0–489.5） */
  .access__note {
    left: 19.6px;
    top: 478px;
    font-size: 12.55px;
    letter-spacing: -0.0066em;
  }

  /* 地図（SPは全幅・カンプ y531.5–808.5＝393×277。PCとは構図が違うのでSP専用切り出し） */
  .access__map {
    left: 0;
    top: 531.5px;
    width: var(--canvas);
    height: 277px;
  }

  /* 詳細を見る（カンプ ピル実測 x89.4–303.6 / y837.45–881.95＝214.2×44.5。sp.cssの214×45を微調整） */
  .access .access__btn {
    left: 89.4px;
    top: 825.45px;  /* 2026-08-19 市岡さん指示: ボタン上余白をPC50px/SP45pxに統一（カンプのばらつき補正） */
    width: 214.2px;
    height: 44.5px;
    font-size: 15px;
    letter-spacing: 0.073em;
    text-indent: -0.19em;
    padding-bottom: 5px;
  }
  /* SPの矢印も正本SVGへ。.access 付きで詳細度を上げないと
     後読みの sp.css .u-btn::after に負ける（従来からの罠） */
  .access .access__btn::before { content: none; }
  .access .access__btn::after {
    right: 17.6px;
    top: 50%;
    width: 10.8px;
    height: 8.5px;
    border: 0;
    border-radius: 0;
    background: currentColor;
    transform: translateY(-50%);
    -webkit-mask: var(--arrow) no-repeat center / 100% 100%;
    mask: var(--arrow) no-repeat center / 100% 100%;
  }
}

/* ==========================================================
   【2026-10-06 字間そろえ（字種別の詰めを廃止）】TOPアクセス（日本語）:
   リード2行・カード項目4行の文字クラス別 span（かな／英数／約物／個別の字）の送りをやめ、ブロック内は全字同じ送りに。
   値は現状の平均送りを保つ: リード PC 0.03em（2行の加重平均・実寸 1.032em）／SP 0.02em。カード項目は PC 0（実寸の平均 1.00em。旧は漢字 1.2px・かな -1〜-5px）／SP は各行の値のまま span だけ無効化。
   ※ 値の導出（2026-10-06 レビューで補正）: PC はキャンバス 1365px を幅 1440px へ等比拡大して表示しているため、
      ビューポート px で測った送りは 1.0549 倍に見える。平均送りは実寸（÷1.0549）で取り直した
   HTML の span はそのまま。戻す時はこのブロックを消すだけ
   ========================================================== */
html[lang="ja"] .access__lead--1,
html[lang="ja"] .access__lead--2 { letter-spacing: 0.03em; }
html[lang="ja"] .access__col.access__item1,
html[lang="ja"] .access__col.access__item2,
html[lang="ja"] .access__col.access__item3,
html[lang="ja"] .access__col.access__item4 { letter-spacing: 0; }
html[lang="ja"] .access__lead .access__kna,
html[lang="ja"] .access__lead .access__knb,
html[lang="ja"] .access__lead .access__knt,
html[lang="ja"] .access__lead .access__knw,
html[lang="ja"] .access__lead .access__kern,
html[lang="ja"] .access__lead .access__mru,
html[lang="ja"] .access__lead .access__dg5,
html[lang="ja"] .access__lead .access__lead-a,
html[lang="ja"] .access__lead .access__lead-b,
html[lang="ja"] .access__col .access__lt,
html[lang="ja"] .access__col .access__dg,
html[lang="ja"] .access__col .access__tA,
html[lang="ja"] .access__col .access__tB,
html[lang="ja"] .access__col .access__tC,
html[lang="ja"] .access__col .access__tD { letter-spacing: inherit; margin: 0; }
/* 【約物（市岡さん選択 B・2026-10-06）】読点「、」句点「。」は半角送り（margin-right -0.5em）、中黒「・」は左右均等に半角（margin 0 -0.25em）。
   かな・漢字は一律のまま。JIS X 4051 の約物半角で、字間の広い行で「、」の後が穴に見えるのを防ぐ（トップの文章 concept は 10/1 の全角のまま）
   項目行の先頭の中黒も左右均等（SPの旧設計＝ls -6.4px・margin ∓3.4px と同じ形）*/
html[lang="ja"] .access__lead--1 .access__yaku { letter-spacing: inherit; margin: 0 -0.5em 0 0; }
html[lang="ja"] .access__lead-a .access__yaku,
html[lang="ja"] .access__col .access__yaku { letter-spacing: inherit; margin: 0 -0.25em; }
@media (max-width: 767px) {
  html[lang="ja"] .access__lead--1,
  html[lang="ja"] .access__lead--2 { letter-spacing: 0.02em; }
  html[lang="ja"] .access__col.access__item1 { letter-spacing: 0.0252em; }
  html[lang="ja"] .access__col.access__item2 { letter-spacing: 0.0252em; }
  html[lang="ja"] .access__col.access__item3 { letter-spacing: 0.0211em; }
  html[lang="ja"] .access__col.access__item4 { letter-spacing: 0.0011em; }
}

/* ==========================================================
   【2026-10-14 河野さん修正リスト・TOP「アクセスはPCでも一画面に収まっておきたい」（PC・日本語ページ）】［案］
   変更前: 淡青の面 898px（1440 幅で 947px・1920 幅で 1263px）＝ノートPCのブラウザの表示域（1440 幅で高さ約 790px 等）に収まらない。
   → 面を 690px に詰める（1440 幅で 728px・1920 幅で 971px）:
     上の余白を詰め（見出しまで −39px）、リード→カードの間 96.5→47.5px、カード2枚の間 21→12px。
     注記の上 18px・ボタンの上 50px（8/19 の統一値）は維持。地図は 700×493 → 593×417.5 に縮めて カードの上端〜ボタンの下端に合わせる。
   左の列の x 位置・文字の大きさは不変。SP・英語ページは対象外。戻す時はこのブロックを消す
   ========================================================== */
@media (min-width: 768px) {
  html[lang="ja"] .access {
    height: 757px;
    background: linear-gradient(to bottom, var(--color-pale) 0, var(--color-pale) 690px, var(--color-white) 690px, var(--color-white) 100%);
  }
  html[lang="ja"] .access__script { top: 36px; }
  html[lang="ja"] .access__title { top: 84.5px; }
  html[lang="ja"] .access__lead--1 { top: 148.5px; }
  html[lang="ja"] .access__lead--2 { top: 188.5px; }
  html[lang="ja"] .access__card--car { top: 236px; }
  html[lang="ja"] .access__card--train { top: 380px; }
  html[lang="ja"] .access__note { top: 530px; }
  html[lang="ja"] .access__btn { top: 593.5px; }
  html[lang="ja"] .access__map { top: 236px; width: 593px; height: 417.5px; }
}