/**
 * base — タイポベース・レイアウトプリミティブ・ユーティリティ
 * ルール: docs/23_CSS設計ガイド.md。値は tokens.css のカスタムプロパティのみ使用
 */

body {
	font-family: var(--font-body);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	color: var(--color-text);
	background: var(--color-base);
	letter-spacing: 0.02em;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	line-height: var(--lh-heading);
	color: var(--color-text);
	font-weight: 700;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--color-text-secondary);
	outline-offset: 2px;
}

/* --- レイアウトプリミティブ --- */

.l-inner {
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--space-section-x);
	box-sizing: content-box; /* max-width はコンテンツ幅。padding は外側に足す */
}

/* --- ページ内アンカーの着地位置 --------------------------- */

/* スティッキーヘッダーに潜り込ませない。scroll-margin は
   スクロール先として使われたときだけ効くため全 id に当ててよい
   （#reserve / #access / #specialist などをまとめて扱う） */
[id] {
	scroll-margin-top: 4.5rem; /* SPヘッダー 3.75rem ＋ 余白 */
}

@media (min-width: 1280px) {
	[id] {
		scroll-margin-top: 6rem; /* PCヘッダー 5.125rem ＋ 余白 */
	}
}

/* --- ユーティリティ --- */

.u-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.u-sp-only { display: block; }
.u-pc-only { display: none; }

/* SPでのみ効く改行（PCでは詰めて1行に流す） */
.u-br-sp { display: inline; }

/* PCでのみ効く改行・インライン要素（SPでは詰める／出さない） */
.u-br-pc,
.u-pc-only-inline { display: none; }

/* SPでのみ出すインライン要素（PCでは出さない） */
.u-sp-only-inline { display: inline; }

/* 途中改行させない語（駅名＋分数など） */
.u-nowrap { white-space: nowrap; }

@media (min-width: 1000px) {
	.u-sp-only { display: none; }
	.u-pc-only { display: block; }
	.u-br-sp { display: none; }
	.u-br-pc,
	.u-pc-only-inline { display: inline; }
	.u-sp-only-inline { display: none; }
}