@charset "utf-8";
/* ==========================================================================
   桂ハイヤー main.css
   design-rules.md v2 / design-spec.md §1 のトークンを :root に定義し、以降は変数参照のみ。
   モバイルファースト（SP 基準 → min-width: 768px で PC）。
   ========================================================================== */

:root {
	/* 色（design-spec §1.1） */
	--c-navy: #16294C;        /* 主色（v3 ネイビー。v2 はベージュ #E1A680） */
	--c-cyan: #00AAC4;
	/* 18px 以下の文字リンク用に濃くしたシアン（2026-10-28 audit-007 K-15）。
	   design-rules.md の「シアンは塗りボタンの地色・18px 超の文字・枠線に限る」に合わせ、
	   小さい文字はこの色を使う。白地 5.30:1 ／ 交互背景 #F2F5F9 の上 4.85:1
	   （2026-10-29 audit-008 N-03: #0A7E92 だと淡い地の上で 4.35 しかなかった） */
	--c-link: #0A7688;
	--c-ink: #0B1B33;         /* 見出し・採用帯・フッター（v2 は黒 #000000） */
	--c-text: #545454;
	--c-note: #737373;
	--c-muted: #BFBFBF;
	--c-tint: #F2F5F9;        /* 交互背景（v2 は生成り #FBF6F0） */
	--c-white: #FFFFFF;
	--c-line: #DCE3EC;
	--c-line-dark: #2A3F63;
	--c-map: #E6E6E6;
	/* 入力欄の枠線。#CCCCCC は白地で 1.61:1 しかなく枠が見えなかった
	   （2026-10-29 audit-008 N-05・WCAG 1.4.11 は 3:1）。いまは 3.45:1 */
	--c-input-border: #8A8A8A;
	--c-placeholder: #999999;
	--c-line-green: #06C555;
	--c-req: #BF382B;
	--c-overlay-dark: rgba(11, 27, 51, 0.6);
	--c-overlay-navy: rgba(22, 41, 76, 0.88);
	--c-overlay-hero: rgba(0, 0, 0, 0.3);
	--c-stripe: rgba(255, 255, 255, 0.14);  /* ネイビー帯の上の車線 */
	--shadow-illust: 0 12px 32px rgba(11, 27, 51, 0.18);

	/* 文字（12/18/24/36/48/60/72。SP は段を1つ下げる） */
	--font-base: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	--font-logo: "Yuji Syuku", "Hiragino Mincho ProN", serif;
	--fs-12: 12px;
	--fs-18: 18px;
	--fs-24: 18px;
	--fs-36: 24px;
	--fs-48: 36px;
	--fs-60: 36px;
	--fs-72: 48px;
	--ls-label: 1.44px;
	--ls-small: 0.72px;
	--ls-tiny: 0.48px;

	/* 余白（3・6・9。SP は 36/72/108） */
	--sp-s: 36px;
	--sp-m: 72px;
	--sp-l: 108px;
	--gutter: 24px;

	/* 角丸 */
	--r-pill: 100px;
	--r-card: 24px;
	--r-chip: 16px;
	--r-badge: 4px;

	/* ボタン高さ */
	--btn-h: 60px;
	--btn-h-lg: 72px;
	--btn-h-mv: 132px;

	/* 幅 */
	--w-std: 1200px;
	--w-wide: 1360px;
	--w-lead: 1000px;
	--w-article: 800px;
	--pad-x: 20px;

	/* ヘッダー */
	--header-h: 72px;
	--header-h-fixed: 60px;
	--sp-bar-h: 60px;
}

@media (min-width: 768px) {
	:root {
		--fs-24: 24px;
		--fs-36: 36px;
		--fs-48: 48px;
		--fs-60: 60px;
		--fs-72: 72px;
		--sp-s: 60px;
		--sp-m: 120px;
		--sp-l: 180px;
		--pad-x: 40px;
		--header-h: 108px;
		--header-h-fixed: 84px;
	}
}

/* --------------------------------------------------------------------------
   Reset / base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--header-h-fixed); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
html, body { overflow-x: hidden; }
body {
	margin: 0;
	font-family: var(--font-base);
	font-size: var(--fs-18);
	line-height: 1.8;
	color: var(--c-ink);
	background: var(--c-white);
	-webkit-font-smoothing: antialiased;
	word-break: normal;
	overflow-wrap: anywhere;
	line-break: strict;
}
body.has-sp-bar { padding-bottom: calc(var(--sp-bar-h) + 20px); }
@media (min-width: 1024px) { body.has-sp-bar { padding-bottom: 0; } }
img, picture, svg, video { max-width: 100%; height: auto; display: block; }
picture { display: contents; }
a { color: inherit; text-decoration: none; }
a:hover { opacity: 0.85; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--c-cyan); outline-offset: 2px; }
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
iframe { display: block; border: 0; max-width: 100%; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 10000; background: var(--c-cyan); color: var(--c-white); padding: 12px 24px; }
/* 2026-10-31 audit-022 P-02: .screen-reader-text の clip/width が !important なので、
   フォーカス時はここで戻さないと 1px のまま見えない（WCAG 2.4.7） */
.skip-link:focus { left: 0; width: auto !important; height: auto !important; clip: auto !important; clip-path: none !important; overflow: visible !important; }

/* コンテナ */
.container { width: 100%; max-width: calc(var(--w-std) + var(--pad-x) * 2); margin: 0 auto; padding: 0 var(--pad-x); }
.container--wide { max-width: calc(var(--w-wide) + var(--pad-x) * 2); }
.container--lead { max-width: calc(var(--w-lead) + var(--pad-x) * 2); }
.container--article { max-width: calc(var(--w-article) + var(--pad-x) * 2); }

/* セクションの型: 上 120 → 見出し → 60 → 内容 → 60 → ボタン → 下 120 */
.section { padding: var(--sp-m) 0; }
.section--cream { background: var(--c-tint); }
.section--white { background: var(--c-white); }
.section--black { background: var(--c-ink); color: var(--c-white); }
.section--beige { background: var(--c-navy); color: var(--c-white); }
.section__body { margin-top: var(--sp-s); }
.section__foot { margin-top: var(--sp-s); text-align: center; }
/* 見出し直下の注記（2026-10-12 追加。1日の流れの「一例です」・会社見学・車椅子のご案内） */
.section__note { margin-top: 24px; font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.section--black .section__note, .section--beige .section__note { color: var(--c-white); }
@media (min-width: 768px) { .section__note { text-align: center; max-width: 68ch; margin-left: auto; margin-right: auto; } }

/* --------------------------------------------------------------------------
   見出しブロック（二本線 ＋ 36 Bold ＋ 英字ラベル 24 ベージュ）
   -------------------------------------------------------------------------- */
.heading { text-align: center; }
.heading__title { display: flex; align-items: center; justify-content: center; gap: 16px; font-size: var(--fs-36); font-weight: 700; line-height: 1.2; }
@media (min-width: 768px) { .heading__title { gap: 24px; } }
.heading__bars { flex: 0 0 auto; width: 24px; height: 24px; background: linear-gradient(var(--c-ink), var(--c-ink)) 0 0 / 100% 8px no-repeat, linear-gradient(var(--c-ink), var(--c-ink)) 0 100% / 100% 8px no-repeat; }
@media (min-width: 768px) { .heading__bars { width: 36px; height: 36px; background-size: 100% 12px, 100% 12px; } }
.heading__label { display: block; margin-top: 8px; font-size: var(--fs-24); font-weight: 700; color: var(--c-navy); line-height: 1.2; }
.heading--inverse .heading__title, .heading--inverse .heading__label { color: var(--c-white); }
.heading--inverse .heading__bars { background-image: linear-gradient(var(--c-white), var(--c-white)), linear-gradient(var(--c-white), var(--c-white)); }

/* 大見出し型（18 ラベル → 48 Bold） */
.bigheading__label { display: block; font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-label); color: var(--c-navy); line-height: 1.2; }
/* 濃い写真の上に乗る英字ラベルは白にする（2026-10-27 せきさん指示）。
   TOP の採用帯と採用ページのヒーローは「写真 ＋ 黒 60%」なので、ネイビーのままだと沈んで読めない */
.recruit-band .bigheading__label,
.recruit-hero .bigheading__label { color: var(--c-white); }
.bigheading__title { margin-top: 12px; font-size: var(--fs-48); font-weight: 700; line-height: 1.5; }
@media (min-width: 768px) { .bigheading__title { margin-top: 16px; line-height: 1.6; } }
.bigheading--center { text-align: center; }

/* --------------------------------------------------------------------------
   ボタン（ピル・高さ固定）
   -------------------------------------------------------------------------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 12px;
	min-height: var(--btn-h); padding: 0 36px; border-radius: var(--r-pill);
	font-size: var(--fs-24); font-weight: 700; line-height: 1.2; text-align: center; white-space: nowrap;
	transition: background-color .2s, color .2s, opacity .2s; border: 3px solid transparent;
}
.btn:hover { opacity: 1; }
.btn--primary { background: var(--c-cyan); color: var(--c-white); border-color: var(--c-cyan); }
.btn--primary:hover { background: #0099b0; border-color: #0099b0; }
.btn--ghost { background: var(--c-white); color: var(--c-cyan); border-color: var(--c-cyan); }
.btn--ghost:hover { background: var(--c-cyan); color: var(--c-white); }
.btn--ghost-transparent { background: transparent; }
/* 2026-10-29 A-1: ハローワーク募集なしの表示。押せないことが見て分かる灰色。文字は読める濃さを保つ（4.9:1） */
.btn--disabled { background: #EDEAE5; color: #6E6760; border-color: #EDEAE5; cursor: default; pointer-events: none; }
.btn--white { background: var(--c-white); color: var(--c-ink); border-color: var(--c-white); }
.btn--white:hover { background: #f0ebe4; border-color: #f0ebe4; }
.btn--white-beige { background: var(--c-white); color: var(--c-navy); border-color: var(--c-white); }
.btn--white-beige:hover { background: #fdf3ea; border-color: #fdf3ea; }
.btn--outline-white { background: transparent; color: var(--c-white); border-color: var(--c-white); }
.btn--outline-white:hover { background: rgba(255, 255, 255, 0.15); }
.btn--lg { min-height: var(--btn-h-lg); padding: 0 44px; }
.btn--submit { padding: 0 80px; }
.btn--block { width: 100%; }
@media (max-width: 767.98px) {
	.btn { width: 100%; min-height: var(--btn-h); padding: 0 20px; white-space: normal; }
	.btn--lg { min-height: var(--btn-h); }
}

/* ヘッダー CTA: 318×72、シアン塗り＋内側に白 1px 枠（inset 5px） */
.btn--header {
	/* 2026-10-07 せきさん指示: アイコンと文字が離れて見えたので中央揃えにして間を詰めた
	   （以前は width:318px 固定＋justify-content:space-between で、アイコンが左端・文字が右端に寄っていた） */
	position: relative; min-height: var(--btn-h-lg); padding: 0 30px; gap: 10px;
	background: var(--c-cyan); color: var(--c-white); border: 0; justify-content: center;
}
.btn--header::after { content: ""; position: absolute; inset: 5px; border: 1px solid var(--c-white); border-radius: var(--r-pill); pointer-events: none; }
.btn--header .btn__icon { width: 38px; height: 38px; flex: 0 0 auto; }
.btn--header .btn__arrow { width: 15px; height: 15px; flex: 0 0 auto; }
.btn--header:hover { background: #0099b0; }

/* MV 特大 CTA: 724×132、48 Bold、taxi 80、矢印 32 */
.btn--mv {
	position: relative; width: 100%; max-width: 724px; min-height: var(--btn-h-mv); padding: 0 40px 0 53px; gap: 0;
	background: var(--c-cyan); color: var(--c-white); border: 0; justify-content: space-between; font-size: var(--fs-48);
}
.btn--mv::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--c-white); border-radius: var(--r-pill); pointer-events: none; }
.btn--mv .btn__icon { width: 80px; height: 80px; flex: 0 0 auto; }
.btn--mv .btn__arrow { width: 32px; height: 32px; flex: 0 0 auto; }
.btn--mv:hover { background: #0099b0; }
@media (max-width: 767.98px) {
	.btn--mv { min-height: 84px; padding: 0 24px 0 28px; }
	.btn--mv::after { inset: 6px; }
	.btn--mv .btn__icon { width: 44px; height: 44px; }
	.btn--mv .btn__arrow { width: 20px; height: 20px; }
}
.btn-row { display: flex; flex-direction: column; gap: 16px; align-items: center; }
/* 2026-10-31 audit-022 P-01: 768幅で採用ヒーローのCTA2つ（291+24+499=814px）が
   コンテンツ幅688pxを超えて画面外に切れていた。入らないときは縦に折り返す */
@media (min-width: 768px) { .btn-row { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 24px; } }

/* --------------------------------------------------------------------------
   タグ・バッジ・ピル
   -------------------------------------------------------------------------- */
.tag { display: inline-flex; align-items: center; padding: 5px 14px; border-radius: var(--r-pill); background: var(--c-navy); color: var(--c-white); font-size: var(--fs-12); font-weight: 700; line-height: 1.2; white-space: nowrap; }
/* 2026-10-29 audit-008 N-04: 12px の白文字をシアン地に載せると 2.78:1 だったので、
   同系の濃い色（白文字 5.30:1）に変えた */
.tag--cyan { background: var(--c-link); }
.badge { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: var(--r-badge); font-size: var(--fs-12); font-weight: 700; line-height: 1.2; vertical-align: middle; }
.badge--req { background: var(--c-req); color: var(--c-white); }
.badge--opt { background: var(--c-line); color: var(--c-text); }
.timebadge { display: inline-flex; align-items: center; padding: 4px 12px; border: 1.5px solid var(--c-navy); border-radius: var(--r-pill); color: var(--c-navy); font-size: var(--fs-12); font-weight: 700; line-height: 1.2; white-space: nowrap; }
.pill { display: inline-flex; align-items: center; padding: 8px 20px; border-radius: var(--r-pill); background: var(--c-navy); color: var(--c-white); font-size: var(--fs-18); font-weight: 700; line-height: 1.2; }

/* --------------------------------------------------------------------------
   ヘッダー（通常 108 / 固定 84。SP は 72 ＋ ハンバーガー）
   -------------------------------------------------------------------------- */
.site-header { position: relative; z-index: 100; background: var(--c-white); }
.site-header__inner { display: flex; align-items: center; height: var(--header-h); padding: 0 20px; gap: 16px; }
@media (min-width: 768px) { .site-header__inner { padding: 0 20px 0 31px; gap: 24px; } }
.site-header__brand { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; color: var(--c-ink); }
.site-header__brand:hover { opacity: 1; }
.site-header__mark { width: 98px; height: 30px; }
.site-header__name { font-family: var(--font-logo); font-size: 24px; line-height: 1; font-weight: 400; white-space: nowrap; }
@media (min-width: 768px) {
	.site-header__brand { gap: 24px; }
	.site-header__mark { width: 141px; height: 43px; }
	.site-header__name { font-size: 36px; }
}
.site-header__nav { display: none; flex: 1 1 auto; }
.site-header__menu { display: flex; justify-content: center; align-items: center; gap: clamp(48px, 8.5vw, 147px); }
.site-header__menu a { font-size: var(--fs-24); font-weight: 700; color: var(--c-ink); line-height: 1.2; white-space: nowrap; }
.site-header__menu a:hover { color: var(--c-cyan); opacity: 1; }
.site-header .btn--header { display: none; }
@media (min-width: 1024px) {
	.site-header__nav { display: block; }
	.site-header .btn--header { display: inline-flex; margin-left: auto; }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
	.site-header__nav { display: block; }
	.site-header__menu { gap: 32px; }
}
/* 固定ヘッダー（2026-10-02 変更）: 最初から表示。TOP の MV の上では背景なし・白文字、
   少しスクロールしたら白背景に切り替える。下層ページは最初から白背景。 */
.site-header--fixed {
	position: fixed; top: 0; left: 0; right: 0; z-index: 200;
	background: transparent; box-shadow: none;
	transition: background .25s ease, box-shadow .25s ease;
}
.site-header--fixed .site-header__inner { height: var(--header-h-fixed); }
/* ロゴ・メニュー・CTA を 72% に縮小（2026-09-14 せきさん指示）。zoom で余白・アイコンごと比率を保つ */
.site-header--fixed .site-header__brand, .site-header--fixed .site-header__nav, .site-header--fixed .btn--header { zoom: 0.72; }
/* 白背景になる条件: スクロール後、または TOP 以外のページ */
.site-header--fixed.is-scrolled,
body:not(.home) .site-header--fixed {
	background: var(--c-white); box-shadow: 0 2px 12px rgba(11, 27, 51, 0.1);
}
/* 背景なしのとき（TOP の最上部）は白文字・白ロゴ */
.site-header__mark--light { display: none; }
body.home .site-header--fixed:not(.is-scrolled) .site-header__mark--dark { display: none; }
body.home .site-header--fixed:not(.is-scrolled) .site-header__mark--light { display: block; }
body.home .site-header--fixed:not(.is-scrolled) .site-header__brand,
body.home .site-header--fixed:not(.is-scrolled) .site-header__menu a { color: var(--c-white); text-shadow: 0 0 12px rgba(0, 0, 0, 0.45); }
body.home .site-header--fixed:not(.is-scrolled) .site-header__toggle-bar,
body.home .site-header--fixed:not(.is-scrolled) .site-header__toggle-bar::before,
body.home .site-header--fixed:not(.is-scrolled) .site-header__toggle-bar::after { background: var(--c-white); }
/* 下層ページは固定ヘッダーの分だけ本文を下げる（TOP は MV に重ねるので不要） */
body:not(.home) .site-main { padding-top: var(--header-h-fixed); }
/* ヘッダー CTA の電話番号（2026-10-02 クライアント要望 C-1「電話番号は早めに表示されるように」） */
.btn--header .btn__label { white-space: nowrap; }  /* 2026-10-07 せきさん指示: CTA は「タクシーを呼ぶ」に統一（電話番号は出さない） */
@media (prefers-reduced-motion: reduce) { .site-header--fixed { transition: none; } }

/* ハンバーガー（SP） */
.site-header__toggle { position: relative; width: 48px; height: 48px; margin-left: auto; flex: 0 0 auto; }
@media (min-width: 768px) { .site-header__toggle { display: none; } }
.site-header__toggle-bar, .site-header__toggle-bar::before, .site-header__toggle-bar::after { position: absolute; left: 10px; width: 28px; height: 3px; background: var(--c-ink); border-radius: 2px; transition: transform .2s, opacity .2s; content: ""; }
.site-header__toggle-bar { top: 22px; }
.site-header__toggle-bar::before { left: 0; top: -9px; }
.site-header__toggle-bar::after { left: 0; top: 9px; }
.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar { background: transparent; }
.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar::before { transform: translateY(9px) rotate(45deg); }
.site-header__toggle[aria-expanded="true"] .site-header__toggle-bar::after { transform: translateY(-9px) rotate(-45deg); }
.drawer { position: absolute; left: 0; right: 0; top: 100%; background: var(--c-white); border-top: 1px solid var(--c-line); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1); padding: 12px 20px 24px; }
.drawer[hidden] { display: none; }
/* 開いている間は背面を動かさない（2026-10-28 audit-007 K-13） */
/* audit-081 M-02: html, body の overflow-x:hidden で html がスクロールの持ち主になるので、html も止める */
html.is-drawer-open, body.is-drawer-open { overflow: hidden; }
.drawer__menu li { border-bottom: 1px solid var(--c-line); }
.drawer__menu a { display: block; padding: 16px 4px; font-size: var(--fs-18); font-weight: 700; }
.drawer .btn { margin-top: 20px; }
@media (min-width: 768px) { .drawer { display: none !important; } }

/* --------------------------------------------------------------------------
   フッター（黒 380）
   -------------------------------------------------------------------------- */
.site-footer { background: var(--c-ink); color: var(--c-white); }
.site-footer__inner { max-width: calc(var(--w-wide) + var(--pad-x) * 2); margin: 0 auto; padding: var(--sp-s) var(--pad-x) 36px; display: grid; gap: 32px; }
@media (min-width: 768px) {
	.site-footer__inner { grid-template-columns: 1fr auto; grid-template-areas: "left right" "copy copy"; padding-top: 88px; padding-bottom: 36px; column-gap: 60px; row-gap: 0; }
	.site-footer__left { grid-area: left; }
	.site-footer__right { grid-area: right; }
	.site-footer__copyright { grid-area: copy; }
}
/* audit-083 N-02: 768〜1099 は2列だと社名がメニューに重なるので縦に積む */
@media (min-width: 768px) and (max-width: 1099.98px) {
	.site-footer__inner { grid-template-columns: 1fr; grid-template-areas: "left" "right" "copy"; row-gap: 32px; }
}
.site-footer__brand { display: inline-flex; align-items: center; gap: 16px; color: var(--c-white); }
.site-footer__brand:hover { opacity: 1; }
.site-footer__mark { width: 141px; height: 43px; }
.site-footer__name { font-family: var(--font-logo); font-size: 36px; line-height: 1; white-space: nowrap; }
.site-footer__address { margin-top: 24px; font-size: var(--fs-18); color: var(--c-muted); line-height: 1.2; }
.site-footer__tel { margin-top: 12px; font-size: var(--fs-24); font-weight: 700; line-height: 1.2; }
.site-footer__note { margin-top: 14px; font-size: var(--fs-12); color: var(--c-muted); line-height: 1.5; }
.site-footer__menu { display: flex; flex-wrap: wrap; gap: 12px 24px; }
@media (min-width: 768px) { .site-footer__menu { gap: 40px; padding-top: 8px; } }
.site-footer__menu a { font-size: var(--fs-18); line-height: 1.2; white-space: nowrap; }
.site-footer__lang { margin-top: 18px; font-size: var(--fs-12); color: var(--c-muted); line-height: 1.5; }
@media (min-width: 1100px) { .site-footer__lang { text-align: right; } }
.site-footer__lang a:hover { color: var(--c-white); }
/* 2026-10-29 audit-008 N-10: 高さ17pxで押しにくかったので上下に余白を足す */
.site-footer__lang a { display: inline-block; padding: 6px 2px; }
.site-footer__copyright { padding-top: 24px; border-top: 1px solid var(--c-line-dark); font-size: var(--fs-12); color: var(--c-muted); line-height: 1.2; }
@media (min-width: 768px) { .site-footer__copyright { margin-top: 44px; } }

/* SP 固定バー（電話のみ） */
.sp-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 150; padding: 10px 20px; background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(6px); box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08); }
.sp-bar__btn { width: 100%; }
@media (min-width: 768px) and (max-width: 1023.98px) { .sp-bar { display: flex; justify-content: center; } .sp-bar__btn { max-width: 480px; } }
@media (min-width: 1024px) { .sp-bar { display: none; } }

/* --------------------------------------------------------------------------
   タイトル帯（下層。写真 ＋ ベージュ 86%）
   -------------------------------------------------------------------------- */
.titleband { position: relative; min-height: 240px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--c-white); overflow: hidden; padding: 40px var(--pad-x); }
@media (min-width: 768px) { .titleband { min-height: 400px; } }
.titleband__bg { position: absolute; inset: 0; z-index: 0; }
.titleband__bg::after { content: ""; position: absolute; inset: 0; background: var(--c-overlay-navy); }
.titleband__img { width: 100%; height: 100%; object-fit: cover; }
.titleband__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.titleband__label { font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-label); line-height: 1.2; }
.titleband__title { font-size: var(--fs-48); font-weight: 700; line-height: 1.2; }
.breadcrumb__list { display: flex; flex-wrap: wrap; justify-content: center; font-size: var(--fs-12); line-height: 1.5; }
.breadcrumb__item + .breadcrumb__item::before { content: " ＞ "; white-space: pre; }
.breadcrumb a:hover { text-decoration: underline; opacity: 1; }

/* --------------------------------------------------------------------------
   共通 CTA（461。生成り ＋ 車庫写真 30%）
   -------------------------------------------------------------------------- */
.cta { position: relative; background: var(--c-tint); overflow: hidden; text-align: center; }
.cta__bg { position: absolute; inset: 0; z-index: 0; opacity: 0.3; }
.cta__img { width: 100%; height: 100%; object-fit: cover; object-position: center 62%; }
.cta__inner { position: relative; z-index: 1; padding: var(--sp-m) var(--pad-x); display: flex; flex-direction: column; align-items: center; }
.cta__title { font-size: var(--fs-36); font-weight: 700; line-height: 1.2; color: var(--c-ink); }
.cta__btn { margin-top: var(--sp-s); }
.cta__note { margin-top: 24px; font-size: var(--fs-18); color: var(--c-text); line-height: 1.6; }

/* --------------------------------------------------------------------------
   カード・チップ・表・FAQ・お知らせ行
   -------------------------------------------------------------------------- */
.card { background: var(--c-white); border-radius: var(--r-card); padding: 32px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 16px; }
@media (min-width: 768px) { .card { padding: 40px; } }
.card--cream { background: var(--c-tint); }
.card__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.5; color: var(--c-ink); }
.card__text { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.grid-3 { display: grid; gap: var(--gutter); }
.grid-4 { display: grid; gap: var(--gutter); }
.grid-5 { display: grid; gap: var(--gutter); }
@media (min-width: 768px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(2, 1fr); } .grid-5 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .grid-4 { grid-template-columns: repeat(4, 1fr); } .grid-5 { grid-template-columns: repeat(5, 1fr); } }

/* チップ（4つの安心）: 白、角丸16、1px 罫線、p20、マーカー 48 */
.chip { display: flex; align-items: center; gap: 16px; padding: 20px; background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-chip); min-height: 104px; }
.chip__marker { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; background: var(--c-white); border: 5px solid var(--c-navy); }
.chip__title { font-size: var(--fs-18); font-weight: 700; line-height: 1.4; color: var(--c-ink); }
.chip__text { margin-top: 4px; font-size: var(--fs-12); line-height: 1.5; color: var(--c-text); }

/* 小カード（1日の流れ・STEP）: 白、角丸16、1px 罫線、p24 */
.stepcard { display: flex; flex-direction: column; gap: 12px; padding: 24px; background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-chip); }
.stepcard__meta { font-size: var(--fs-12); font-weight: 700; letter-spacing: var(--ls-tiny); color: var(--c-link); line-height: 1.2; }
.stepcard__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.5; }
.stepcard__text { font-size: var(--fs-18); line-height: 1.7; color: var(--c-text); }

/* 表（ラベル Bold ＋ 値グレー、1px 罫線） */
.spec { width: 100%; border-collapse: collapse; }
.spec tr { border-top: 1px solid var(--c-line); }
.spec tr:last-child { border-bottom: 1px solid var(--c-line); }
.spec th, .spec td { padding: 16px; text-align: left; vertical-align: top; font-size: var(--fs-18); line-height: 1.7; }
.spec th { font-weight: 700; color: var(--c-ink); white-space: nowrap; }
.spec td { color: var(--c-text); font-weight: 400; }
@media (max-width: 767.98px) {
	.spec tr, .spec th, .spec td { display: block; }
	.spec th { padding: 16px 12px 0; }
	.spec td { padding: 4px 12px 16px; }
}
@media (min-width: 768px) {
	.spec th, .spec td { padding: 24px 16px; }
	.spec th { width: 360px; padding-right: 24px; }
	.spec--label260 th { width: 260px; }
	.spec--label240 th { width: 240px; }
	.spec--label160 th { width: 160px; }
}

/* FAQ */
.faq { display: grid; gap: 24px; }
.faq__item { background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-chip); padding: 24px 20px; display: grid; gap: 12px; }
@media (min-width: 768px) { .faq__item { padding: 24px 32px; } }
.faq__q, .faq__a { display: flex; gap: 16px; align-items: flex-start; }
.faq__mark { flex: 0 0 auto; font-size: var(--fs-24); font-weight: 700; line-height: 1.2; }
.faq__mark--q { color: var(--c-cyan); }
.faq__mark--a { color: var(--c-navy); }
.faq__question { font-size: var(--fs-18); font-weight: 700; line-height: 1.6; color: var(--c-ink); padding-top: 2px; }
.faq__answer { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); padding-top: 2px; }

/* お知らせ行 */
.newslist__item { border-bottom: 1px solid var(--c-line); }
.newslist__item:first-child { border-top: 1px solid var(--c-line); }
.newslist__link { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding: 20px 0; }
@media (min-width: 768px) { .newslist__link { flex-wrap: nowrap; padding: 26px 0; } }
.newslist__link:hover { opacity: 1; }
.newslist__link:hover .newslist__title { color: var(--c-cyan); }
.newslist__date { flex: 0 0 auto; font-size: var(--fs-18); color: var(--c-text); line-height: 1.2; }
.newslist__title { flex: 1 1 100%; font-size: var(--fs-24); font-weight: 400; color: var(--c-ink); line-height: 1.5; transition: color .2s; }
@media (min-width: 768px) { .newslist__title { flex: 1 1 auto; max-width: 800px; } }
.newslist__arrow { margin-left: auto; font-size: var(--fs-24); font-weight: 700; color: var(--c-cyan); line-height: 1; }

/* 決済ロゴカード（白、角丸24、p40、行 gap 24、ラベル幅 200） */
.paylogos { background: var(--c-white); border-radius: var(--r-card); padding: 24px 20px; display: grid; gap: 24px; }
@media (min-width: 768px) { .paylogos { padding: 40px; } }
.paylogos__row { display: flex; flex-direction: column; gap: 12px; }
@media (min-width: 768px) { .paylogos__row { flex-direction: row; align-items: center; gap: 24px; } }
/* 200px のラベル列は横並び（768px〜）のときだけ。SP の縦積みで flex-basis が高さ 200px になり、ラベル下に空白が出ていた（2026-09-14 修正） */
.paylogos__label { flex: none; font-size: var(--fs-18); font-weight: 700; color: var(--c-ink); line-height: 1.2; }
@media (min-width: 768px) { .paylogos__label { flex: 0 0 200px; } }
.paylogos__list { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; }
.paylogos__item { height: 48px; width: var(--logo-w); flex: 0 0 auto; }
.paylogos__list--h56 .paylogos__item { height: 56px; }
.paylogos__img { width: 100%; height: 100%; object-fit: contain; }
.paylogos__text { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.paylogos__text strong { color: var(--c-ink); }

/* 写真 ＋ 受けブロック */
.photo-accent { position: relative; }
.photo-accent__img { position: relative; z-index: 1; border-radius: var(--r-card); overflow: hidden; }
.photo-accent__img img { width: 100%; height: 100%; object-fit: cover; }
.photo-accent::after { content: ""; position: absolute; z-index: 0; inset: 0; background: var(--c-navy); border-radius: var(--r-card); transform: translate(var(--accent-x, 32px), var(--accent-y, 32px)); }

/* 地図 */
.map { position: relative; border-radius: var(--r-card); overflow: hidden; background: var(--c-map); }
.map iframe { width: 100%; height: 100%; }

/* スクロールフェードイン */
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity: 1; transform: none; transition: none; } }

/* ==========================================================================
   TOP 01 #mv
   写真エリア 1728×937（aspect 固定）＋ ベージュ帯 669。車両は写真エリア基準で bottom:-13.2%（境界をまたぐ）
   ========================================================================== */
.anchor-top { display: block; height: 0; }
.mv { position: relative; overflow: hidden; }
.mv__photo { position: relative; aspect-ratio: 1728 / 937; min-height: 420px; overflow: visible; }
.mv__bg { position: absolute; inset: 0; z-index: 0; }
.mv__bg::after { content: ""; position: absolute; inset: 0; background: var(--c-overlay-hero); }
.mv__bgimg { width: 100%; height: 100%; object-fit: cover; object-position: center; }
/* MV カルーセル: 5 枚をクロスフェード（4.5 秒ごと・1 秒）。reduced-motion は 1 枚目で静止 */
.mv__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1s ease; }
.mv__slide.is-active { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .mv__slide { transition: none; } }
.mv__copy { position: absolute; left: 0; right: 0; top: 39.7%; z-index: 1; text-align: center; color: var(--c-white); padding: 0 var(--pad-x); }
/* キャッチコピーの薄いぼかしグロー（2026-09-14 せきさん指示）。明るいスライドでも白字が沈まないよう、暗めの光を広くぼかす */
.mv__copy { text-shadow: 0 0 18px rgba(0, 0, 0, 0.45), 0 0 42px rgba(0, 0, 0, 0.3); } /* 2026-09-14 せきさん指示で濃く（当初 28%／18%） */
.mv__lead { font-size: var(--fs-60); font-weight: 400; line-height: 1.2; }
.mv__title { margin-top: 16px; font-size: var(--fs-72); font-weight: 900; line-height: 1.2; letter-spacing: 0; white-space: nowrap; }
@media (min-width: 768px) { .mv__title { margin-top: 20px; } }
/* audit-083 N-01: 768〜899 は 60px／72px だと見出しが切れ、上の行が折れて車に重なる。3・6・9 の段で1つずつ下げる */
@media (min-width: 768px) and (max-width: 899.98px) { .mv__lead { font-size: var(--fs-48); } .mv__title { font-size: var(--fs-60); } }
.mv__title-brand { color: var(--c-white); } /* 2026-10-02: 写真の上なので白。ネイビーだと沈む */
.mv__taxi { position: absolute; z-index: 3; left: 29.17%; width: 45.72%; bottom: -13.23%; }
.mv__taximg { width: 100%; height: auto; }
/* 接地影: 車はベージュ帯（道路面）に立つ。影が無いと浮いて見え、背景が海・川・岩場のスライドで水上にいるように読めるため */
.mv__taxi::before { content: ""; position: absolute; z-index: -1; left: 6%; right: 5%; bottom: -5%; height: 11%; background: radial-gradient(closest-side, rgba(0, 0, 0, 0.32), rgba(0, 0, 0, 0)); pointer-events: none; }
.mv__band { position: relative; z-index: 2; background: var(--c-navy); padding: 96px var(--pad-x) 60px; text-align: center; color: var(--c-white); } /* 2026-10-02: ネイビーの上は白文字 */
@media (min-width: 768px) { .mv__band { padding: 208px var(--pad-x) 120px; } }
/* 車線ストライプ 84×669 at x=744, 900（黒 12%） */
.mv__band::before, .mv__band::after { content: ""; position: absolute; top: 0; bottom: 0; width: 4.86%; background: var(--c-stripe); z-index: 0; pointer-events: none; }
.mv__band::before { left: 43.06%; }
.mv__band::after { left: 52.08%; }
.mv__band > * { position: relative; z-index: 1; }
.mv__sub { font-size: var(--fs-36); font-weight: 500; line-height: 1.45; }
.mv__band .btn--mv { margin: 40px auto 0; }
@media (min-width: 768px) { .mv__band .btn--mv { margin-top: 67px; } }
.mv__apps { margin-top: 24px; font-size: var(--fs-18); font-weight: 400; line-height: 1.6; }
@media (min-width: 768px) { .mv__apps { margin-top: 36px; } }
@media (max-width: 767.98px) {
	.mv__photo { aspect-ratio: auto; height: 78vw; min-height: 360px; }
	.mv__copy { top: 30%; }
	.mv__taxi { left: 8%; width: 84%; bottom: -12%; }
	.mv__band { padding-top: 22vw; }
}


/* ==========================================================================
   TOP 02 #message（白 1000。左テキスト 780 ＋ 右写真 500×680、受け +48/+80）
   ========================================================================== */
.message__inner { display: grid; gap: var(--sp-s); }
/* audit-081 H-01・H-02: 写真の列が固定幅なので、768〜1199 で2列にすると文章の列が0近くまで潰れる。2列は1200から */
@media (min-width: 1200px) { .message__inner { grid-template-columns: minmax(0, 800px) 500px; justify-content: space-between; align-items: start; column-gap: 60px; } }
.message__title { max-width: 800px; }
.message__body { margin-top: 36px; display: grid; gap: 2em; font-size: var(--fs-18); line-height: 2; color: var(--c-text); }
@media (min-width: 768px) { .message__body { margin-top: 52px; max-width: 780px; } }
.message__photo { --accent-x: 48px; --accent-y: 80px; margin: 0 48px 80px 0; }
@media (min-width: 768px) { .message__photo { margin: 80px 48px 80px 0; } }
.message__photo .photo-accent__img { aspect-ratio: 500 / 680; }
/* 切り抜き画像版（2026-10-06）: 受けブロックと角丸枠なし。車をそのまま置く */
.message__photo--cutout { --accent-x: 0; --accent-y: 0; margin: 0; align-self: center; }
@media (min-width: 768px) { .message__photo--cutout { margin: 40px 0 0; } }
.message__photo--cutout .message__photo-inner img { width: 100%; height: auto; display: block; }

/* ==========================================================================
   TOP 04 #service（白 619。リード黒 1.9 ＋ 4 チップ 282×104）
   ========================================================================== */
.service__lead { margin-top: var(--sp-s); text-align: center; font-size: var(--fs-18); line-height: 1.9; color: var(--c-ink); }
.service__chips { margin-top: var(--sp-s); }
@media (min-width: 768px) { .service__lead { margin-top: 55px; } .service__chips { margin-top: 60px; } }

/* ==========================================================================
   TOP 05 #price（生成り 1136。左テキスト 560 ＋ 右カード 560 → 決済ロゴ 1200）
   ========================================================================== */
.price__cols { display: grid; gap: var(--sp-s); }
@media (min-width: 768px) { .price__cols { grid-template-columns: 1fr 1fr; column-gap: 80px; align-items: start; } }
.price__catch { font-size: var(--fs-36); font-weight: 700; line-height: 1.5; }
.price__body { margin-top: 24px; display: grid; gap: 1em; font-size: var(--fs-18); line-height: 1.9; color: var(--c-text); }
@media (min-width: 768px) { .price__body { margin-top: 60px; } }
.price__btn { margin-top: 36px; }
@media (min-width: 768px) { .price__btn { margin-top: 60px; } }
.price__card { padding: 32px 24px; gap: 12px; }
@media (min-width: 768px) { .price__card { padding: 48px; } }
.price__cardlabel { font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-small); color: var(--c-navy); line-height: 1.2; }
.price__fare { display: flex; align-items: baseline; justify-content: center; gap: 12px; flex-wrap: wrap; }
.price__fare-num { font-size: var(--fs-72); font-weight: 700; color: var(--c-ink); line-height: 1.1; }
.price__fare-unit { font-size: var(--fs-24); font-weight: 400; color: var(--c-text); line-height: 1.2; }
.price__cardnote { font-size: var(--fs-12); line-height: 1.6; color: var(--c-note); }
.price__pay { margin-top: var(--sp-s); }
.price__paylabel { font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-small); color: var(--c-navy); line-height: 1.2; margin-bottom: 24px; }

/* ==========================================================================
   TOP 06 #recruit（黒帯 760。写真 ＋ 黒 60%。中央縦積み gap 20）
   ========================================================================== */
.recruit-band { position: relative; background: var(--c-ink); color: var(--c-white); overflow: hidden; }
.recruit-band__bg { position: absolute; inset: 0; z-index: 0; }
.recruit-band__bg::after { content: ""; position: absolute; inset: 0; background: var(--c-overlay-dark); }
.recruit-band__img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.recruit-band__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; padding-top: var(--sp-m); padding-bottom: var(--sp-m); }
@media (min-width: 768px) { .recruit-band__inner { min-height: 760px; justify-content: center; padding-top: 80px; padding-bottom: 80px; } }
.recruit-band__title { font-size: var(--fs-48); font-weight: 700; line-height: 1.5; color: var(--c-white); }
.recruit-band__text { font-size: var(--fs-18); line-height: 1.6; color: var(--c-white); }
.recruit-band__btns { padding-top: 16px; width: 100%; }
@media (max-width: 767.98px) { .recruit-band__btns { gap: 16px; } }

/* ==========================================================================
   TOP 07 #news（白 744）
   ========================================================================== */
.newslist__empty { text-align: center; color: var(--c-text); padding: 24px 0; }

/* ==========================================================================
   TOP 08 #company（生成り 1232。左 640 ＋ 右写真 600×400（受け +32/+32）→ 地図 1360×360）
   ========================================================================== */
.company__cols { display: grid; gap: var(--sp-s); }
/* audit-081 H-01・H-02: 写真の列が固定幅なので、768〜1199 で2列にすると文章の列が0近くまで潰れる。2列は1200から */
@media (min-width: 1200px) { .company__cols { grid-template-columns: minmax(0, 640px) 600px; justify-content: space-between; column-gap: 80px; align-items: start; } }
.company__catch { font-size: var(--fs-36); font-weight: 700; line-height: 1.5; }
.company__body { margin-top: 24px; font-size: var(--fs-18); line-height: 1.9; color: var(--c-text); }
@media (min-width: 768px) { .company__body { margin-top: 28px; } }
.company__btn { margin-top: 36px; }
@media (min-width: 768px) { .company__btn { margin-top: 60px; } }
.company__photo { --accent-x: 32px; --accent-y: 32px; margin: 0 32px 32px 0; }
.company__photo .photo-accent__img { aspect-ratio: 600 / 400; }
.company__map { margin-top: var(--sp-s); height: 240px; }
@media (min-width: 768px) { .company__map { height: 360px; } }

/* ==========================================================================
   TOP 09 #contact（ベージュ帯 716。3 カード 384×208）
   ========================================================================== */
.contact-band__lead { margin-top: var(--sp-s); text-align: center; font-size: var(--fs-18); line-height: 1.9; color: var(--c-white); max-width: var(--w-lead); margin-left: auto; margin-right: auto; }
.contact-cards { margin-top: 36px; display: grid; gap: var(--gutter); }
@media (min-width: 768px) { .contact-band__lead { margin-top: 60px; } .contact-cards { margin-top: 48px; grid-template-columns: repeat(3, 1fr); } .contact-cards--2 { grid-template-columns: repeat(2, minmax(0, 384px)); justify-content: center; } }
.contact-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 208px; padding: 40px 28px; background: var(--c-white); border-radius: var(--r-card); text-align: center; color: var(--c-ink); transition: transform .2s; }
.contact-card:hover { opacity: 1; transform: translateY(-2px); }
.contact-card__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.3; }
.contact-card__big { font-weight: 700; line-height: 1.1; white-space: nowrap; }
.contact-card__big--tel { font-size: var(--fs-48); color: var(--c-cyan); }
.contact-card__big--cyan { font-size: var(--fs-36); color: var(--c-cyan); }
.contact-card__big--line { font-size: var(--fs-36); color: var(--c-line-green); }
.contact-card__note { font-size: var(--fs-12); line-height: 1.6; color: var(--c-text); }
.contact-band__apps { margin-top: 24px; text-align: center; font-size: var(--fs-18); line-height: 1.6; color: var(--c-white); }

/* ==========================================================================
   下層共通: 記事本文（ブロックエディタ出力）・プレーンページ
   ========================================================================== */
.entry-content { display: grid; gap: 24px; font-size: var(--fs-18); line-height: 2; color: var(--c-text); }
.entry-content p { margin: 0; }
.entry-content h2 { display: flex; align-items: center; gap: 16px; margin-top: 24px; font-size: var(--fs-24); font-weight: 700; line-height: 1.5; color: var(--c-ink); }
.entry-content h2::before { content: ""; flex: 0 0 8px; width: 8px; height: 32px; border-radius: var(--r-badge); background: var(--c-navy); }
.entry-content h3 { margin-top: 12px; font-size: var(--fs-18); font-weight: 700; color: var(--c-ink); line-height: 1.6; }
.entry-content ul, .entry-content ol { display: grid; gap: 12px; padding-left: 8px; line-height: 1.8; }
.entry-content ul li { position: relative; padding-left: 20px; }
.entry-content ul li::before { content: ""; position: absolute; left: 0; top: 0.75em; width: 8px; height: 8px; border-radius: 50%; background: var(--c-navy); }
.entry-content ol { list-style: decimal; padding-left: 28px; }
.entry-content figure { margin: 0; border-radius: var(--r-card); overflow: hidden; }
.entry-content figure img { width: 100%; height: auto; }
.entry-content figcaption { font-size: var(--fs-12); color: var(--c-note); margin-top: 8px; }
.entry-content a { color: var(--c-link); text-decoration: underline; }
.entry-content blockquote { margin: 0; padding: 16px 24px; border-left: 4px solid var(--c-navy); background: var(--c-tint); border-radius: var(--r-badge); }
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content table th, .entry-content table td { border: 1px solid var(--c-line); padding: 12px 16px; text-align: left; }
.entry-content strong { color: var(--c-ink); }
.plain__body { font-size: var(--fs-18); line-height: 2; color: var(--c-text); text-align: center; }
.plain__body a { color: var(--c-link); text-decoration: underline; }
.plain__actions { margin-top: var(--sp-s); display: flex; justify-content: center; }
.search__query { margin-bottom: 24px; font-weight: 700; }

/* ==========================================================================
   料金案内
   ========================================================================== */
.fare__note { font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-small); color: var(--c-navy); line-height: 1.6; }
.fare__table { margin-top: 24px; }
.photoband { height: 180px; overflow: hidden; }
@media (min-width: 768px) { .photoband { height: 300px; } }
.photoband__img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.discount__card { gap: 16px; }
.discount__card .card__text { max-width: 304px; }
.sightseeing { text-align: center; }
.sightseeing .container { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.sightseeing__label { font-size: var(--fs-18); font-weight: 700; letter-spacing: var(--ls-label); line-height: 1.2; }
.sightseeing__title { font-size: var(--fs-36); font-weight: 700; line-height: 1.4; }
.sightseeing__text { font-size: var(--fs-18); line-height: 1.8; }
/* 観光地名の英語併記（2026-10-27 追加。英語での検索に拾われるように） */
.sightseeing__en { margin-top: 17px; font-size: var(--fs-12); line-height: 1.8; color: rgba(255, 255, 255, 0.72); letter-spacing: .01em; }
@media (max-width: 767.98px) { .sightseeing__text br { display: none; } }
.sightseeing__btns { padding-top: 12px; width: 100%; }

/* ==========================================================================
   会社概要
   ========================================================================== */
.greeting__inner { display: grid; gap: var(--sp-s); }
/* audit-081 H-01・H-02: 写真の列が固定幅なので、768〜1199 で2列にすると文章の列が0近くまで潰れる。2列は1200から */
@media (min-width: 1200px) { .greeting__inner { grid-template-columns: 620px minmax(0, 640px); justify-content: space-between; column-gap: 80px; align-items: start; } }
.greeting__photo { --accent-x: 32px; --accent-y: 32px; margin: 0 32px 32px 0; }
.greeting__photo .photo-accent__img { aspect-ratio: 620 / 440; }
.greeting__title { line-height: 1.5; }
.greeting__body { margin-top: 36px; display: grid; gap: 1.5em; font-size: var(--fs-18); line-height: 2; color: var(--c-text); }
@media (min-width: 768px) { .greeting__body { margin-top: 52px; } }
.greeting__sign { text-align: right; color: var(--c-ink); font-weight: 700; }
.safety__card { gap: 16px; }
.safety__icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--c-white); border: 5px solid var(--c-navy); color: var(--c-navy); }
.safety__icon svg { width: 40px; height: 40px; display: block; }
.safety__card .card__text { max-width: 304px; }
.vehicle { background: var(--c-white); border-radius: var(--r-card); overflow: hidden; display: flex; flex-direction: column; }
.vehicle__photo { aspect-ratio: 384 / 260; overflow: hidden; }
.vehicle__img { width: 100%; height: 100%; object-fit: cover; }
.vehicle__body { padding: 24px 32px 32px; display: grid; gap: 12px; }
.vehicle__name { font-size: var(--fs-24); font-weight: 700; line-height: 1.4; }
.vehicle__text { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.access__map { height: 240px; }
@media (min-width: 768px) { .access__map { height: 420px; } }
.access__cols { margin-top: var(--sp-s); display: grid; gap: 32px; }
@media (min-width: 768px) { .access__cols { grid-template-columns: 1fr 1fr; column-gap: 80px; } }
.access__label { font-size: var(--fs-24); font-weight: 700; line-height: 1.2; }
.access__text { margin-top: 12px; font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }

/* ==========================================================================
   採用情報
   ========================================================================== */
.recruit-hero { position: relative; background: var(--c-ink); color: var(--c-white); overflow: hidden; }
.recruit-hero__bg { position: absolute; inset: 0; z-index: 0; }
.recruit-hero__bg::after { content: ""; position: absolute; inset: 0; background: var(--c-overlay-dark); }
.recruit-hero__img { width: 100%; height: 100%; object-fit: cover; }
.recruit-hero__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; padding-top: var(--sp-m); padding-bottom: var(--sp-m); }
@media (min-width: 768px) { .recruit-hero__inner { min-height: 820px; justify-content: center; padding-top: 100px; padding-bottom: 100px; } }
.recruit-hero__title { font-size: var(--fs-60); font-weight: 700; line-height: 1.3; }
.recruit-hero__text { font-size: var(--fs-18); line-height: 1.6; }
.recruit-hero__btns { padding-top: 12px; width: 100%; }
.reason { background: var(--c-tint); border-radius: var(--r-card); padding: 32px 28px; display: flex; flex-direction: column; gap: 16px; }
.reason__no { font-size: var(--fs-48); font-weight: 700; color: var(--c-navy); line-height: 1; }
.reason__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.5; }
.reason__text { font-size: var(--fs-18); line-height: 1.7; color: var(--c-text); }
.day { position: relative; overflow: hidden; }
.day__bg { position: absolute; inset: 0; z-index: 0; opacity: 0.45; } /* 2026-10-15 せきさん指示で 30% → 45%（写真を濃く） */
.day__img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.day__inner { position: relative; z-index: 1; }
.day__list, .flow__list { margin-top: 34px; }
/* 背景写真を濃くした分、面に載らない注記だけ文字を濃くする（2026-10-15） */
.day .section__note { color: var(--c-ink); }
/* ドライバーの1日（2026-10-14 せきさん指示で横並びのカードをやめ、縦の時系列に）
   丸 24px ＋ 縦線 2px。時刻の列は 96px（24×4）で固定し、時刻が未定の行でも見出しの頭が揃う */
/* 背景写真の上に直接置くと読みにくいので、白い面に載せる（丸の中心 60px に縦線を合わせる） */
.timeline { list-style: none; position: relative; padding: 48px 48px 48px 96px; background: rgba(255, 255, 255, 0.82); border: 1px solid rgba(255, 255, 255, 0.6); border-radius: var(--r-card); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.timeline::before { content: ''; position: absolute; left: 59px; top: 62px; bottom: 62px; width: 2px; background: var(--c-navy); opacity: .25; }
.tl { position: relative; display: grid; grid-template-columns: 96px 1fr; column-gap: 24px; padding-bottom: 34px; }
.tl:last-child { padding-bottom: 0; }
.tl__dot { position: absolute; left: -48px; top: 2px; width: 24px; height: 24px; border-radius: 50%; background: var(--c-white); border: 5px solid var(--c-navy); }
.tl__time { font-size: var(--fs-18); font-weight: 700; line-height: 1.6; color: var(--c-navy); font-variant-numeric: tabular-nums; }
.tl__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.5; }
.tl__text { margin-top: 6px; font-size: var(--fs-18); line-height: 1.7; color: var(--c-text); }
@media (max-width: 767.98px) {
	.timeline { padding: 24px 20px 24px 58px; }
	.timeline::before { left: 32px; top: 33px; bottom: 33px; }
	.tl { grid-template-columns: 1fr; column-gap: 0; padding-bottom: 24px; }
	.tl__dot { left: -34px; top: 1px; width: 18px; height: 18px; border-width: 4px; }
	.tl__time { font-size: var(--fs-12); }
	.tl__time:empty { display: none; }
}
.benefits { display: grid; gap: 24px; }
.benefits__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.benefit { display: inline-flex; align-items: center; gap: 16px; min-height: 94px; padding: 27px 20px 27px 24px; border-radius: 36px; background: var(--c-navy); color: var(--c-white); }
.benefit__label { font-size: var(--fs-18); font-weight: 700; line-height: 1.2; }
.benefit__icon { width: 40px; height: 40px; flex: 0 0 auto; }
@media (max-width: 767.98px) { .benefits { gap: 12px; } .benefits__row { gap: 12px; justify-content: flex-start; } .benefit { min-height: 64px; padding: 12px 16px 12px 20px; border-radius: 32px; } .benefit__icon { width: 32px; height: 32px; } }
.voice { gap: 12px; }
.voice__avatar { width: 96px; height: 96px; border-radius: 50%; }
.voice__meta { font-size: var(--fs-12); color: var(--c-text); line-height: 1.5; }
.voice .card__text { max-width: 304px; }
.requirements__empty { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); text-align: center; }
.requirements__empty a { color: var(--c-link); text-decoration: underline; }
.entry__lead { margin-top: var(--sp-s); text-align: center; font-size: var(--fs-18); line-height: 1.9; color: var(--c-muted); }
.entry__cards { margin-top: 36px; display: grid; gap: var(--gutter); }
@media (min-width: 768px) { .entry__lead { margin-top: 60px; } .entry__cards { margin-top: 48px; grid-template-columns: repeat(3, 1fr); } .entry__cards--2 { grid-template-columns: repeat(2, minmax(0, 384px)); justify-content: center; } }
.entry-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 229px; padding: 40px 20px; border-radius: var(--r-card); text-align: center; border: 3px solid transparent; transition: transform .2s; }
.entry-card:hover { opacity: 1; transform: translateY(-2px); }
.entry-card--white { background: var(--c-white); color: var(--c-ink); border-color: var(--c-white); }
.entry-card--cyan { background: var(--c-cyan); color: var(--c-white); border-color: var(--c-cyan); }
.entry-card--outline { background: var(--c-ink); color: var(--c-white); border-color: var(--c-white); }
.entry-card__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.3; }
.entry-card__big { font-size: var(--fs-48); font-weight: 700; line-height: 1.1; white-space: nowrap; }
.entry-card__big--36 { font-size: var(--fs-36); }
.entry-card__note { font-size: var(--fs-12); line-height: 1.6; }
.entry-card--white .entry-card__note { color: var(--c-text); }
.entry-card--outline .entry-card__note { color: var(--c-muted); }

/* ==========================================================================
   お問合せ
   ========================================================================== */
.methods__lead { text-align: center; font-size: var(--fs-18); line-height: 1.9; color: var(--c-text); max-width: var(--w-lead); margin: 0 auto; }
.methods__cards { margin-top: 36px; display: grid; gap: var(--gutter); }
@media (min-width: 768px) { .methods__cards { margin-top: 60px; grid-template-columns: repeat(3, 1fr); } .methods__cards--2 { grid-template-columns: repeat(2, minmax(0, 384px)); justify-content: center; } }
.method-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 214px; padding: 40px 20px; border-radius: var(--r-card); text-align: center; border: 3px solid transparent; transition: transform .2s; }
.method-card:hover { opacity: 1; transform: translateY(-2px); }
.method-card--cyan { background: var(--c-cyan); color: var(--c-white); border-color: var(--c-cyan); }
.method-card--outline-cyan { background: var(--c-white); color: var(--c-cyan); border-color: var(--c-cyan); }
.method-card--outline-green { background: var(--c-white); color: var(--c-line-green); border-color: var(--c-line-green); }
.method-card__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.3; }
.method-card__big { font-size: var(--fs-48); font-weight: 700; line-height: 1.1; white-space: nowrap; }
.method-card__big--36 { font-size: var(--fs-36); }
.method-card__note { font-size: var(--fs-12); line-height: 1.6; }
.method-card--outline-cyan .method-card__note, .method-card--outline-green .method-card__note { color: var(--c-text); }
.methods__apps { margin-top: 24px; text-align: center; font-size: var(--fs-18); line-height: 1.6; color: var(--c-text); }

/* フォーム（CF7 / 静的フォールバック共通） */
.form { background: var(--c-white); border-radius: var(--r-card); padding: 32px 20px; }
@media (min-width: 768px) { .form { padding: 60px; } }
.form form { display: grid; gap: 24px; }
.form__row { display: grid; gap: 12px; }
.form__row--2col { grid-template-columns: 1fr; }
@media (min-width: 768px) { .form__row--2col { grid-template-columns: 1fr 1fr; column-gap: 24px; } .form__row--2col > div { display: grid; gap: 12px; } }
.form__row--2col > div { display: grid; gap: 12px; }
.form__label { display: inline-flex; align-items: center; gap: 12px; font-size: var(--fs-18); font-weight: 700; color: var(--c-ink); line-height: 1.4; }
.form input[type="text"], .form input[type="tel"], .form input[type="email"], .form select, .form textarea {
	width: 100%; min-height: 60px; padding: 16px 20px; border: 1px solid var(--c-input-border); border-radius: var(--r-chip); background: var(--c-white); font-size: var(--fs-18); line-height: 1.5; color: var(--c-ink);
}
.form textarea { min-height: 180px; resize: vertical; }
.form ::placeholder { color: var(--c-placeholder); }
.form__select { position: relative; }
.form__select::after { content: "▼"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: var(--fs-12); color: var(--c-text); pointer-events: none; }
.form select { appearance: none; -webkit-appearance: none; padding-right: 48px; }
.form .wpcf7-form-control-wrap { display: block; }
.form__radio { display: flex; flex-wrap: wrap; gap: 16px 36px; font-size: var(--fs-18); }
.form__radio label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.form__radio .wpcf7-list-item { margin: 0; }
.form__radio input[type="radio"] { width: 20px; height: 20px; accent-color: var(--c-cyan); }
.form__row--agree { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: var(--fs-18); }
.form__row--agree .wpcf7-list-item { margin: 0; }
.form__row--agree label, .form__agree { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; }
.form__row--agree input[type="checkbox"] { width: 24px; height: 24px; accent-color: var(--c-cyan); }
.form__policy-link { color: var(--c-link); text-decoration: underline; }
.form__submit { display: flex; flex-direction: column; align-items: center; gap: 12px; padding-top: 12px; }
.form__submit .wpcf7-form-control-wrap { display: contents; }
.form .btn--submit { -webkit-appearance: none; appearance: none; cursor: pointer; }
.form__note { font-size: var(--fs-12); color: var(--c-text); line-height: 1.6; text-align: center; }
.form .wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: var(--fs-12); color: var(--c-req); }
.form .hidden-fields-container { display: none; }
.form .screen-reader-response { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }
.form .wpcf7-response-output { display: none; margin: 0; padding: 16px 20px; border: 1px solid var(--c-req); border-radius: var(--r-chip); font-size: var(--fs-18); color: var(--c-req); }
.form .wpcf7-form.invalid .wpcf7-response-output, .form .wpcf7-form.failed .wpcf7-response-output, .form .wpcf7-form.aborted .wpcf7-response-output, .form .wpcf7-form.spam .wpcf7-response-output, .form .wpcf7-form.unaccepted .wpcf7-response-output, .form .wpcf7-form.sent .wpcf7-response-output { display: block; }
.form .wpcf7-form.sent .wpcf7-response-output { border-color: var(--c-cyan); color: var(--c-link); }
.form .wpcf7-spinner { display: none; }
.info__cols { display: grid; gap: var(--sp-s); }
@media (min-width: 1024px) { .info__cols { grid-template-columns: minmax(0, 640px) minmax(0, 640px); justify-content: space-between; column-gap: 80px; align-items: start; } }
.info__map { height: 240px; }
@media (min-width: 768px) { .info__map { height: 347px; } }

/* ==========================================================================
   お知らせ一覧・記事
   ========================================================================== */
.catfilter__list { display: flex; flex-wrap: wrap; gap: 12px; }
@media (min-width: 768px) { .catfilter__list { gap: 24px; } }
.catfilter__item { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; border-radius: var(--r-pill); border: 1px solid var(--c-line); background: var(--c-white); color: var(--c-ink); font-size: var(--fs-18); font-weight: 700; line-height: 1.2; }
@media (min-width: 768px) { .catfilter__item { min-height: 60px; padding: 0 36px; } }
.catfilter__item.is-current { background: var(--c-ink); color: var(--c-white); border-color: var(--c-ink); }
.newsarchive__list { margin-top: 36px; }
@media (min-width: 768px) { .newsarchive__list { margin-top: 60px; } }
.pagination { margin-top: var(--sp-s); }
.pagination__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.pagination__item .page-numbers { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--c-line); background: var(--c-white); color: var(--c-ink); font-size: var(--fs-18); font-weight: 700; line-height: 1; }
@media (min-width: 768px) { .pagination__item .page-numbers { width: 60px; height: 60px; } }
.pagination__item .page-numbers.current { background: var(--c-cyan); color: var(--c-white); border-color: var(--c-cyan); }
.pagination__item .page-numbers.dots { border: 0; }
.article__header { display: grid; gap: 24px; }
.article__meta { display: flex; align-items: center; gap: 16px; }
.article__date { font-size: var(--fs-18); color: var(--c-text); line-height: 1.2; }
.article__title { font-size: var(--fs-36); font-weight: 700; line-height: 1.5; color: var(--c-ink); }
.article__thumb { margin-top: 24px; border-radius: var(--r-card); overflow: hidden; aspect-ratio: 16 / 9; }
.article__thumb img { width: 100%; height: 100%; object-fit: cover; }
.article .entry-content { margin-top: 36px; }
.article__nav { margin-top: var(--sp-s); display: flex; flex-direction: column; align-items: center; gap: 24px; }
.article__adjacent { width: 100%; display: flex; flex-direction: column; gap: 12px; padding: 24px 16px 8px; border: 1px solid var(--c-line); border-radius: var(--r-chip); font-size: var(--fs-18); color: var(--c-text); line-height: 1.6; }
@media (min-width: 768px) { .article__adjacent { flex-direction: row; justify-content: space-between; } }
.article__adjacent-link { padding-bottom: 16px; }
.article__adjacent-link:hover { color: var(--c-cyan); opacity: 1; }
.article__adjacent-link--next { text-align: right; margin-left: auto; }

/* SP の MV: 375px 幅に収める（72→48 ではロゴ英字が収まらないため vw で縮小。Figma は 1 行） */
@media (max-width: 767.98px) {
	.mv__lead { font-size: var(--fs-24); }
	.mv__title { font-size: min(var(--fs-72), 7.2vw); margin-top: 12px; }
	.mv__sub { font-size: var(--fs-18); line-height: 1.6; }
	.btn--mv { font-size: var(--fs-24); }
	.mv__apps { font-size: 14px; }
}

/* ==========================================================================
   ヘッダー幅帯の調整（768〜1279 で横はみ出しを防ぐ）
   ========================================================================== */
@media (min-width: 768px) and (max-width: 1279.98px) {
	.site-header__brand { gap: 12px; }
	.site-header__mark { width: 98px; height: 30px; }
	.site-header__name { font-size: 24px; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
	.site-header__menu { gap: 40px; }
	.site-header .btn--header { width: 248px; padding: 0 18px; font-size: var(--fs-18); }
	.site-header .btn--header .btn__icon { width: 30px; height: 30px; }
}
@media (min-width: 1280px) {
	.site-header__menu { gap: clamp(40px, calc((100vw - 1100px) / 2), 147px); }
}

/* ==========================================================================
   TOP 03 #journey → 行き先カード（2026-10-02 作り替え）
   アニメーションと距離・時間を削除し、地名を見せる4枚のカードに圧縮した。
   旧 .journey* のスタイル（約80行）は 2026-10-31 audit-022 P-07 で削除した。
   セクションの id は後方互換のため #journey のまま（チェックリストのアンカーが参照している）。
   ========================================================================== */
.dest__lead { text-align: center; font-size: var(--fs-18); line-height: 1.9; color: var(--c-text); }
.dest__grid { margin-top: var(--sp-s); }
@media (min-width: 480px) and (max-width: 767.98px) { .dest__grid { grid-template-columns: repeat(2, 1fr); } }
.destcard { display: flex; flex-direction: column; background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-card); overflow: hidden; }
.destcard__photo { aspect-ratio: 3 / 2; background: var(--c-tint); }
.destcard__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.destcard__body { display: grid; gap: 12px; padding: 24px 20px; }
.destcard__title { font-size: var(--fs-24); font-weight: 700; line-height: 1.4; color: var(--c-ink); }
.destcard__places { font-size: var(--fs-12); font-weight: 700; line-height: 1.8; color: var(--c-navy); }
/* 英語の地名（2026-10-09）。日本語の読み手の邪魔にならないよう、小さく控えめに置く */
.destcard__places-en { margin-top: 4px; font-size: var(--fs-12); font-weight: 400; line-height: 1.6; color: var(--c-note); letter-spacing: .01em; }
.site-footer__en { margin-top: 12px; font-size: var(--fs-12); line-height: 1.7; color: var(--c-muted); }
.destcard__text { font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.dest__note { margin-top: var(--sp-s); text-align: center; font-size: var(--fs-18); line-height: 1.8; color: var(--c-text); }
.dest__note a { color: var(--c-link); font-weight: 700; text-decoration: underline; }