/*
Theme Name: JIC Asakusa
Theme URI: https://japan-international-tokyo.com/
Author: 一般社団法人JIC
Description: Clean-room rebuilt block theme for Japan International Clinic ASAKUSA. Rebuilt from public HTTP observation; no code carried from the prior host.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jic-asakusa
*/

/* フッターのエリア／症状リンクの横並び表示。
   枠線や背景を持たせず、間隔だけで区切るテキストリンクとして並べる。 */
.jic-chips {
	list-style: none;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 1.15rem 1.9rem;
	font-size: 0.95rem;
}
.jic-chips li {
	margin: 0;
}
.jic-chips a {
	display: inline-block;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.72);
	text-decoration: none;
	transition: color 0.15s ease;
}
.jic-chips a:hover,
.jic-chips a:focus {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

/* チップ群を挟む区切り線。既定のセパレータはブランド色で主張が強すぎる。 */
.jic-rule {
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	background: none;
	opacity: 1;
}

/* チップ群の見出し。本文リンクと同程度の大きさで、大文字＋字間で区別する。 */
.jic-chips-title {
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

/* フッターは濃紺(#1e3a5f)背景。既定のリンク色(#2563eb)だとコントラスト比2.22で
 * WCAG AA(4.5)に満たない。チップ以外の構造リンク30本が該当する。 */
footer.wp-block-template-part a:where(:not(.wp-element-button)) {
	color: rgba(255, 255, 255, 0.82);
}
footer.wp-block-template-part a:where(:not(.wp-element-button)):hover,
footer.wp-block-template-part a:where(:not(.wp-element-button)):focus {
	color: #fff;
}

/* ===== 目次 =====
 * 見出しが多い記事で読者が節へ直接飛べるようにする。本文ではなくテーマが組む。
 * 面で塗ると本文の流れを断つので、上下の細い罫だけで区切る。
 * 8〜9項目を縦一列にすると縦に伸びるため、広い画面では2列に流す。 */
.jic-toc {
	margin: 2.2rem 0 2.6rem;
	padding: 1.1rem 1.6rem 1.2rem;
	border: 1px solid rgba(255, 255, 255, .85);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(23, 42, 100, .05), 0 8px 24px rgba(23, 42, 100, .07);
}
/* LPの面は固定背景の柄が敷いてあるので、透明にすると柄が透ける。
   本文のカードと同じ白い面に乗せる。 */
.jic-lp .jic-toc {
	margin: 2.6rem 0 3rem;
}
.jic-toc__h {
	margin: 0 0 .7rem;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #8a94a6;
}
.jic-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: toc;
	columns: 2;
	column-gap: 48px;
}
.jic-toc__list li {
	margin: 0;
	break-inside: avoid;
	counter-increment: toc;
}
.jic-toc__list a {
	display: flex;
	gap: 10px;
	padding: 4px 0;
	color: #3d4757;
	font-size: 13.5px;
	line-height: 1.7;
	text-decoration: none;
	transition: color .15s;
}
/* 番号は擬似要素で描く。本文に文字として持たせると読み上げに混ざる。 */
.jic-toc__list a::before {
	content: counter(toc, decimal-leading-zero);
	flex: none;
	color: #aeb8c8;
	font-size: 11px;
	font-variant-numeric: tabular-nums;
	letter-spacing: .04em;
	padding-top: .25em;
	transition: color .15s;
}
.jic-toc__list a:hover,
.jic-toc__list a:focus-visible {
	color: var(--wp--preset--color--primary, #2563eb);
}
.jic-toc__list a:hover::before,
.jic-toc__list a:focus-visible::before {
	color: var(--wp--preset--color--primary, #2563eb);
}
/* 目次から飛んだ見出しがヘッダーの下に隠れないようにする。 */
.entry-content h2[id] {
	scroll-margin-top: 90px;
}
@media (max-width: 782px) {
	.jic-toc {
		margin: 1.8rem 0 2rem;
	}
	.jic-toc__list {
		columns: 1;
	}
	.jic-toc__list a {
		font-size: 13px;
	}
}

/* ===== 監修者ボックス（記事末尾） =====
 * 本文ではなくテーマが差し込む。記事側は「誰か」だけを持つ（theme/reviewers.json）。 */
.jic-rev {
	margin: 3rem 0 0;
	padding: 1.5rem;
	border: 1px solid #e5e7eb;
	border-top: 3px solid #2563eb;
	border-radius: 0.5rem;
	background: #f9fafb;
}
.jic-rev__eyebrow {
	margin: 0 0 1rem;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: #2563eb;
}
.jic-rev__head {
	display: flex;
	gap: 1rem;
	align-items: center;
}
.jic-rev__photo {
	flex: none;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	object-fit: cover;
}
.jic-rev__name {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.35;
}
.jic-rev__name a {
	color: inherit;
	text-decoration: none;
}
.jic-rev__name a:hover,
.jic-rev__name a:focus {
	text-decoration: underline;
}
.jic-rev__ja {
	font-size: 0.95rem;
	font-weight: 400;
	color: #5f6775;
}
.jic-rev__role {
	margin: 0.25rem 0 0;
	font-size: 0.9rem;
	color: #374151;
}
/* 資格。実在が確認できたものだけを並べる。診療分野や経歴はここに混ぜない
 * （認定資格と誤読されるため、それらは bio 側の文章で書く）。 */
.jic-rev__creds {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
}
.jic-rev__creds li {
	padding: 0.4rem 0.7rem;
	border-radius: 0.3rem;
	background: #eef2ff;
	font-size: 0.82rem;
	font-weight: 600;
	color: #1e3a5f;
}
/* チップ地(#eef2ff)の上では本文グレーがAAに届かないため、ここだけ濃くする。 */
.jic-rev__creds li span {
	font-weight: 400;
	color: #4b5563;
}
.jic-rev__bio {
	margin: 1rem 0 0;
	font-size: 0.92rem;
	line-height: 1.75;
	color: #374151;
}
.jic-rev__more {
	margin: 1rem 0 0;
	font-size: 0.92rem;
	font-weight: 600;
}
.jic-rev__on {
	margin: 1rem 0 0;
	padding-top: 0.85rem;
	border-top: 1px solid #e5e7eb;
	font-size: 0.82rem;
	color: #5f6775;
}

@media (max-width: 480px) {
	.jic-rev {
		padding: 1.25rem;
	}
	.jic-rev__head {
		gap: 0.85rem;
	}
	.jic-rev__photo {
		width: 68px;
		height: 68px;
	}
	.jic-rev__name {
		font-size: 1.05rem;
	}
	/* 氏名が2行に折れると読みにくいため、日本語表記は下段へ落とす。 */
	.jic-rev__ja {
		display: block;
	}
	/* 発行元が資格名と同じ行に続くと団体名の途中で折り返す。 */
	.jic-rev__creds li span {
		display: block;
	}
}

/* 言語スイッチャー。<details> をプルダウンとして使う。行き先が無い言語は
   出力段階で除かれるため、ここは表示のみを扱う。 */
.jic-lang {
	position: relative;
	font-size: .85rem;
}
.jic-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .3rem .55rem;
	border: 1px solid var(--wp--preset--color--light-gray, #e5e7eb);
	border-radius: 6px;
	color: var(--wp--preset--color--secondary, #1b3a5c);
	white-space: nowrap;
	cursor: pointer;
	list-style: none; /* Firefox の三角マーカー */
}
.jic-lang__toggle::-webkit-details-marker {
	display: none; /* Safari の三角マーカー */
}
.jic-lang__toggle:hover,
.jic-lang__toggle:focus-visible {
	background: #f9fafb;
}
.jic-lang__toggle::after {
	content: "";
	border: 4px solid transparent;
	border-top-color: currentColor;
	margin-top: 4px;
}
.jic-lang[open] .jic-lang__toggle::after {
	margin-top: -4px;
	border-top-color: transparent;
	border-bottom-color: currentColor;
}
.jic-lang__globe {
	display: inline-flex;
}
.jic-lang__menu {
	position: absolute;
	top: calc(100% + 4px);
	right: 0;
	z-index: 30;
	min-width: 9rem;
	margin: 0;
	padding: .25rem;
	list-style: none;
	background: #fff;
	border: 1px solid var(--wp--preset--color--light-gray, #e5e7eb);
	border-radius: 8px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
}
.jic-lang__menu li {
	margin: 0;
}
.jic-lang__link {
	display: block;
	padding: .45rem .6rem;
	border-radius: 4px;
	color: var(--wp--preset--color--secondary, #1b3a5c);
	text-decoration: none;
	white-space: nowrap;
}
.jic-lang__link:hover,
.jic-lang__link:focus-visible {
	background: #f3f4f6;
	text-decoration: none;
}

/* 予約フォーム。/ja/travel/ で使う。送信先は未接続（UIのみ）。
   項目は必要最小限にとどめ、生年月日や接種歴など診察時に確認できるものは持たない。 */
/* WordPress の is-layout-constrained が max-width を当てるため .jic-lp で特異度を上げる。 */
.jic-lp .jic-form {
	max-width: 640px;
	margin-block-start: 8px;
}
/* 枠で囲わず、細い罫と小さな欧文ラベルで区切る。 */
.jic-form__set {
	margin: 0;
	padding: 34px 0 6px;
	border: 0;
	border-top: 1px solid #e2e7f0;
}
.jic-form__set:first-of-type {
	padding-top: 30px;
}
.jic-form__legend {
	padding: 0;
	color: var(--wp--preset--color--primary, #2563eb);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .14em;
}
.jic-form__row {
	margin-bottom: 22px;
}
.jic-form__row--split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.jic-form__label {
	display: block;
	margin-bottom: 8px;
	color: #16203a;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .02em;
}
/* 赤いベタのバッジは主張が強すぎる。文字だけにする。 */
.jic-form__req {
	margin-left: 8px;
	color: #c2454c;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
}
/* テーマもWPも input/textarea に border-box を当てていない。
   width:100% に padding と border が加算され、隣の列へ30pxはみ出していた。 */
.jic-form input,
.jic-form select,
.jic-form textarea {
	box-sizing: border-box;
}
.jic-form__input {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #dfe4ec;
	border-radius: 2px;
	background: #fff;
	font-size: 16px; /* 16px未満だとiOSがフォーカス時に拡大する */
	line-height: 1.5;
}
.jic-form__input::placeholder {
	color: #aab3c2;
}
.jic-form__input:focus {
	outline: 0;
	border-color: var(--wp--preset--color--primary, #2563eb);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}
.jic-form__checks {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 20px;
	font-size: 15px;
}
/* 「わからない・相談したい」は他の選択肢と性質が違う。行を分けて先頭に置く。 */
.jic-form__checks label:first-child {
	grid-column: 1 / -1;
	padding-bottom: 14px;
	border-bottom: 1px solid #eef1f6;
}
.jic-form__checks label {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}
.jic-form__checks input[type="checkbox"],
.jic-form__checks input[type="radio"] {
	flex: none;
	width: 16px;
	height: 16px;
	accent-color: var(--wp--preset--color--primary, #2563eb);
}
/* 「その他」は自由記入とセットで使う。末尾に1行取り、罫で区切る。 */
.jic-form__other {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 2px;
	padding-top: 16px;
	border-top: 1px solid #eef1f6;
}
.jic-form__other > label {
	flex: none;
}
.jic-form__other .jic-form__input {
	flex: 1 1 auto;
	width: auto;
	padding: 10px 12px;
	font-size: 15px;
}
.jic-form__consent {
	margin: 30px 0 0;
	padding-top: 26px;
	border-top: 1px solid #e2e7f0;
	font-size: 14px;
}
.jic-form__consent label {
	display: flex;
	align-items: center;
	gap: 8px;
}
.jic-form__consent input {
	flex: none;
	width: 16px;
	height: 16px;
	accent-color: var(--wp--preset--color--primary, #2563eb);
}
.jic-form__submit {
	margin: 24px 0 0;
}
.jic-form__submit button {
	display: block;
	width: 100%;
	height: 58px;
	padding: 0 24px;
	border: 0;
	border-radius: 3px;
	background: var(--wp--preset--color--primary, #2563eb);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .06em;
	cursor: pointer;
	transition: background-color .2s;
}
.jic-form__submit button:hover,
.jic-form__submit button:focus-visible {
	background: var(--wp--preset--color--primary-dark, #1d4ed8);
}
.jic-lp .jic-form__note {
	margin: 0 0 18px;
	color: #7a8494;
	font-size: 13px;
	line-height: 1.8;
}
.jic-lp .jic-form__submit + .jic-form__note {
	margin: 14px 0 0;
	text-align: center;
}
@media (max-width: 600px) {
	.jic-form__row--split {
		grid-template-columns: 1fr;
		gap: 22px;
	}
	.jic-form__checks {
		grid-template-columns: 1fr;
		gap: 12px;
	}
	.jic-form__other {
		align-items: stretch;
		flex-direction: column;
		gap: 10px;
	}
}

/* セクション見出し。中央寄せの和欧2段組み。和文の左肩にブランド赤のコーナー罫。
   罫は装飾なので読み上げ対象にしない（擬似要素で描く）。 */
.jic-sec__head {
	margin-bottom: 44px;
	text-align: center;
}
.jic-sec__ja {
	position: relative;
	display: inline-block;
	margin: 0;
	padding-right: 22px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.4;
}
/* ロゴの構成（マークの右上に赤い点）を見出しへ移した意匠。
   点はロゴと同じ #e60012。装飾なので擬似要素で描き、読み上げに載せない。 */
.jic-sec__ja::after {
	content: "";
	position: absolute;
	top: .08em;
	right: 0;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background: #e60012;
}
.jic-sec__en {
	margin: 6px 0 0;
	color: var(--wp--preset--color--primary, #2563eb);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .22em;
}
.jic-lp .jic-sec__lead {
	margin: 0 0 8px;
	color: #5b6472;
	font-size: 15px;
	line-height: 2;
	text-align: center;
}
@media (max-width: 782px) {
	.jic-sec__lead {
		text-align: left;
	}
	.jic-sec__lead br {
		display: none;
	}
}
.jic-sec .jic-sec__note {
	margin: 40px 0 0;
	color: #5b6472;
	font-size: 14px;
	line-height: 2;
}

/* 来院前の確認事項。カード装飾は付けず、余白と罫だけで区切る。 */
.jic-prep {
	/* 中央で均等に2分割する。auto-fit だと片方が伸びるので固定の2列にする。
	   align-items:start で高さを引き伸ばさず、中身の量が違っても箱が空いて見えない。 */
	display: grid;
	grid-template-columns: 1fr 1px 1fr;
	align-items: start;
	gap: 0 44px;
}
/* 列を分ける細い縦罫。装飾なので要素は増やさずグリッドの1トラックで描く。 */
.jic-prep__rule {
	align-self: stretch;
	background: linear-gradient(180deg, transparent, #dfe4ec 12%, #dfe4ec 88%, transparent);
}
@media (max-width: 860px) {
	.jic-prep {
		grid-template-columns: 1fr;
		gap: 44px;
	}
	.jic-prep__rule {
		display: none;
	}
}
.jic-prep__label {
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid #e6e9ef;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1.5;
}
.jic-prep__lead {
	margin: 0 0 18px;
	color: #5b6472;
	font-size: 14px;
	line-height: 1.9;
}
.jic-prep__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.jic-prep__list li {
	position: relative;
	margin: 0 0 16px;
	padding-left: 20px;
	font-size: 15px;
	line-height: 1.9;
}
.jic-prep__list li:last-child {
	margin-bottom: 0;
}
.jic-prep__list li::before {
	content: "";
	position: absolute;
	top: .82em;
	left: 0;
	width: 9px;
	height: 1px;
	background: var(--wp--preset--color--primary, #2563eb);
}
.jic-prep__list li span {
	display: block;
	margin-top: 2px;
	color: #8a919d;
	font-size: 13px;
	line-height: 1.8;
}

/* MVのオーバーレイ。cover 既定の has-background-dim-60 は面全体を一律に暗くするため、
   写真が沈む。/lp/visitors/ と同じく文字のある左だけ濃くして右へ抜く。
   透過はグラデーション側で持たせるので opacity は 1 に戻す。 */
.jic-fv .wp-block-cover__background {
	opacity: 1;
	background: linear-gradient(90deg,
		rgba(11, 22, 44, .80) 0%,
		rgba(13, 26, 50, .66) 28%,
		rgba(15, 30, 55, .34) 58%,
		rgba(16, 32, 58, .06) 84%,
		rgba(16, 32, 58, 0) 100%);
}
/* 狭い画面では文字が全幅に回り込むので、横方向のグラデーションでは足りない。
   上下方向に切り替え、全体を薄く敷く。 */
@media (max-width: 782px) {
	.jic-fv .wp-block-cover__background {
		background: linear-gradient(180deg,
			rgba(11, 22, 44, .74) 0%,
			rgba(13, 26, 50, .62) 60%,
			rgba(15, 30, 55, .50) 100%);
	}
}

/* ヒーロー下の信頼バッジ。cover の上に置くため白抜き。 */
.jic-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.jic-badges li {
	margin: 0;
	padding: 5px 12px;
	border: 1px solid rgba(255, 255, 255, .55);
	border-radius: 9999px;
	color: #fff;
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
}

/* サイトロゴ。SVGは 510x80（6.4:1）。高さ基準で拡縮する。 */
.jic-logo {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
.jic-logo img {
	width: auto;
	height: 30px;
	max-width: 100%;
}

/* 固定背景レイヤー。ブランドマークを中央に大きく1つ据える。
   background-attachment:fixed は iOS Safari が無視するため使わない。 */
.jic-bg {
	position: fixed;
	inset: 0;
	z-index: -1;
	background-color: #f8fafc;
	pointer-events: none;
}
/* マークは擬似要素に分ける。地色ごと薄くなるのを避け、濃さをCSSだけで調整できる。
   素材は支給の ICJ_logo.png（孤立した点を除き、正方形に整えて WebP 化）。 */
.jic-bg::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: .13;
	background-image: url(assets/jic-bg-mark.webp);
	background-repeat: no-repeat;
	background-position: center;
	background-size: min(120vw, 130vh) auto;
}

/* LPテンプレートではヘッダー直下にMVを置く。ブロックテーマの blockGap が
   main に margin-top を付けて隙間を作るため、この面だけ打ち消す。 */
.jic-lp .wp-site-blocks > main {
	margin-top: 0;
}

/* 固定背景を使う面では、本文を白いカードとして浮かせる。 */
.jic-lp .wp-site-blocks {
	background: transparent;
}
.jic-lp .entry-content > .wp-block-group:not(.alignfull) {
	background: #fff;
	border: 1px solid rgba(255, 255, 255, .85);
	border-radius: 14px;
	box-shadow: 0 1px 2px rgba(23, 42, 100, .05), 0 12px 34px rgba(23, 42, 100, .09);
	margin-top: 84px;
	margin-bottom: 84px;
	/* 左右は上下と釣り合う量を確保する。実測で上下65px・左右33pxと差が開き、
	   横に窮屈な印象になっていた。 */
	padding-left: 64px;
	padding-right: 64px;
}

/* 青の階調。シルバーと同じ角度で振り、面としての性格を揃える。
   長文セクションなので濃紺のベタ塗りにはしない（白抜きの長文は読み疲れる）。 */
.jic-lp .entry-content > .wp-block-group.jic-card--blue:not(.alignfull) {
	background:
		linear-gradient(152deg,
			#f7fafe 0%,
			#e9f1fd 22%,
			#d8e6fa 52%,
			#e6effc 74%,
			#f4f8fe 100%);
	border-color: rgba(255, 255, 255, .7);
}

/* シルバーの階調。斜めに光が当たった金属面のように明部と暗部を作る。
   全カードに掛けると重くなるため、見せ場のセクションにだけ付ける。 */
.jic-lp .entry-content > .wp-block-group.jic-card--silver:not(.alignfull) {
	background:
		linear-gradient(152deg,
			#ffffff 0%,
			#eef1f5 16%,
			#dce1e9 42%,
			#e9edf3 58%,
			#d5dbe4 80%,
			#f1f3f7 100%);
}
@media (max-width: 782px) {
	.jic-lp .entry-content > .wp-block-group:not(.alignfull) {
		border-radius: 10px;
		margin-top: 54px;
		margin-bottom: 54px;
		padding-left: 24px;
		padding-right: 24px;
	}
}

/* ヒーローのCTA。写真の上に置くため、副ボタンは白ベタではなく枠のみにする。
   白ベタを2つ並べると面が重く、写真が死ぬ。 */
.jic-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}
.jic-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	height: 52px;
	padding: 0 26px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .2s, border-color .2s, transform .12s;
}
.jic-cta__btn:hover,
.jic-cta__btn:focus-visible {
	text-decoration: none;
	transform: translateY(-1px);
}
.jic-cta__btn svg {
	flex: none;
}
.jic-cta__btn--primary {
	background: var(--wp--preset--color--primary, #2563eb);
	color: #fff;
	box-shadow: 0 6px 18px rgba(37, 99, 235, .35);
}
.jic-cta__btn--primary:hover,
.jic-cta__btn--primary:focus-visible {
	background: var(--wp--preset--color--primary-dark, #1d4ed8);
	color: #fff;
}
/* 白地のセクション用。写真の上ではない場所では枠を青にする。 */
.jic-cta__btn--outline {
	background: #fff;
	border: 1px solid #93c5fd;
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
}
.jic-cta__btn--outline:hover,
.jic-cta__btn--outline:focus-visible {
	background: #eff6ff;
	border-color: var(--wp--preset--color--primary, #2563eb);
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
}

.jic-cta__btn--ghost {
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .55);
	color: #fff;
	/* 写真の明部でも枠が消えないよう、背面をわずかにぼかす。
	   非対応ブラウザでは上の半透明の地だけが効く。 */
	backdrop-filter: blur(2px);
}
.jic-cta__btn--ghost:hover,
.jic-cta__btn--ghost:focus-visible {
	background: rgba(255, 255, 255, .16);
	border-color: #fff;
	color: #fff;
}
@media (max-width: 782px) {
	.jic-cta__btn {
		height: 48px;
		padding: 0 20px;
		font-size: 14px;
	}
}

/* ワクチン一覧表。列が6つあり狭い画面では収まらないので、外側で横スクロールさせる。
   tabindex を持たせずスクロールさせるとキーボードで到達できないため、
   HTML側でラップだけ用意し、はみ出す時だけスクロールバーが出る形にする。 */
.jic-lp .jic-table {
	margin-block-start: 28px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.jic-vac {
	width: 100%;
	min-width: 860px;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.7;
	color: var(--wp--preset--color--secondary, #1e3a5f);
}
.jic-vac thead th {
	padding: 13px 14px;
	background: #4a6fa8;
	border: 1px solid #4a6fa8;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .02em;
	text-align: center;
	white-space: nowrap;
}
/* 行見出し（ワクチン名）は淡い青の帯にして、表の軸だと分かるようにする。 */
.jic-vac tbody th {
	padding: 14px;
	background: #eef3f9;
	border: 1px solid #dbe3ee;
	font-weight: 600;
	text-align: center;
	white-space: nowrap;
}
/* 行見出しは個別ページへのリンク。全行がリンクなので色だけで示さず、
   薄い下線を常時引いてリンクだと分かるようにする。 */
.jic-vac tbody th a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: #a9bdd8;
	text-underline-offset: 4px;
	transition: color .2s, text-decoration-color .2s;
}
.jic-vac tbody th a:hover,
.jic-vac tbody th a:focus-visible {
	color: var(--wp--preset--color--primary, #2563eb);
	text-decoration-color: currentColor;
}
.jic-vac tbody th span {
	display: block;
	margin-top: 2px;
	color: #556780;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0;
}
.jic-vac td {
	padding: 14px;
	background: #fff;
	border: 1px solid #dbe3ee;
	vertical-align: middle;
}
.jic-vac td.num {
	text-align: center;
	white-space: nowrap;
}

.jic-lp .jic-table__notes {
	margin-block-start: 20px;
	margin-block-end: 0;
	margin-inline: 0;
	padding: 0;
	list-style: none;
}
.jic-table__notes li {
	position: relative;
	margin: 0 0 8px;
	padding-left: 18px;
	color: #5b6472;
	font-size: 13px;
	line-height: 1.9;
}
.jic-table__notes li:last-child {
	margin-bottom: 0;
}
.jic-table__notes li::before {
	content: "※";
	position: absolute;
	left: 0;
	top: 0;
}
.jic-table__notes strong {
	color: var(--wp--preset--color--secondary, #1e3a5f);
}
@media (max-width: 782px) {
	.jic-vac {
		font-size: 13px;
	}
	.jic-vac thead th,
	.jic-vac tbody th,
	.jic-vac td {
		padding: 11px 10px;
	}
}

/* 読み物寄りのセクション。見出しは他セクションと同じ中央寄せの和欧2段組みを使い、
   本文だけ長文向けに行間を広げる。段落は中央寄せにしない（長文で読みにくくなる）。 */
.jic-lp .jic-intro__p {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 2.1;
	letter-spacing: .01em;
}
.jic-intro__p:last-child {
	margin-bottom: 0;
}
@media (max-width: 782px) {
	.jic-intro__p {
		line-height: 1.95;
	}
}

/* セクション内の小見出し。中央寄せの大見出しと本文の間の階層を作る。 */
/* WordPress の :where(.is-layout-constrained) > * が margin-block-start/end を当てるため、
   物理プロパティの margin では上書きされる。論理プロパティで指定する。 */
.jic-lp .jic-sub {
	margin-block-start: 76px;
	margin-block-end: 26px;
	margin-inline: 0;
	padding-bottom: 12px;
	border-bottom: 1px solid #dbe3ee;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: .03em;
	text-align: center;
}
.jic-lp .jic-matrix__lead {
	margin-block-start: 0;
	margin-block-end: 28px;
	margin-inline: 0;
	color: #5b6472;
	font-size: 14px;
	line-height: 1.95;
}
.jic-matrix__lead strong {
	color: var(--wp--preset--color--secondary, #1e3a5f);
}
.jic-lp .jic-matrix__cap {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-block-start: 0;
	margin-block-end: 12px;
	margin-inline: 0;
	color: var(--wp--preset--color--secondary, #1e3a5f);
	font-size: 14px;
	font-weight: 600;
}

.jic-lp .jic-matrix__cap--2nd {
	margin-block-start: 44px;
}

/* 地域別マトリクス。列が多いので外側で横スクロールさせる。 */
.jic-matrix {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	color: var(--wp--preset--color--secondary, #1e3a5f);
}
.jic-matrix thead th {
	padding: 10px 6px;
	background: #4a6fa8;
	border: 1px solid #4a6fa8;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	/* 縦組みにはせず、狭い列でも2行までで折り返させる */
	word-break: keep-all;
}
.jic-matrix thead th:first-child {
	width: 30%;
	min-width: 190px;
}
.jic-matrix tbody th {
	padding: 11px 12px;
	background: #eef3f9;
	border: 1px solid #dbe3ee;
	font-weight: 600;
	text-align: left;
	line-height: 1.5;
}
.jic-matrix tbody th span {
	display: block;
	margin-top: 1px;
	color: #556780;
	font-size: 11px;
	font-weight: 400;
}
.jic-matrix td {
	padding: 11px 6px;
	background: #fff;
	border: 1px solid #dbe3ee;
	text-align: center;
	vertical-align: middle;
}

/* 記号。文字ではなく図形で描く。●を文字で置くと読み上げが「黒丸」になり意味が伝わらないため、
   role="img" と aria-label を持つ span にして、見た目はCSSで作る。 */
.jic-mk {
	display: inline-block;
	width: 11px;
	height: 11px;
	vertical-align: -1px;
}
.jic-mk--dot {
	border-radius: 999px;
	background: var(--wp--preset--color--primary, #2563eb);
}
.jic-mk--open {
	border-radius: 999px;
	border: 2px solid var(--wp--preset--color--primary, #2563eb);
}
.jic-mk--star,
.jic-mk--tri {
	background: var(--wp--preset--color--primary, #2563eb);
}
.jic-mk--star {
	clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.jic-mk--tri {
	clip-path: polygon(50% 4%, 96% 92%, 4% 92%);
}
.jic-table__notes .jic-mk {
	margin: 0 4px 0 10px;
}
.jic-table__notes li:first-child .jic-mk:first-child {
	margin-left: 0;
}
@media (max-width: 782px) {
	.jic-sub {
		margin-top: 40px;
		font-size: 16px;
	}
	.jic-matrix thead th:first-child {
		min-width: 150px;
	}
}

/* 一覧リンク。箱で囲わず罫と余白だけで行を切る（.jic-prep と同じ考え方）。
   2列の間に縦罫を渡さないのは、項目数が奇数のとき最終行で罫が宙に浮くため。
   独立した2本のリストとして読ませる。 */
.jic-lp .jic-linkgrid {
	display: grid;
	/* auto-fit だと幅次第で3列になり、参考にした2列の見え方から外れる。列数を固定する。 */
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 64px;
	margin-block-start: 44px;
}
.jic-linkgrid__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 21px 2px;
	border-bottom: 1px solid #e2e7f0;
	color: #16203a;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.6;
	text-decoration: none;
	transition: color .2s, border-color .2s;
}
.jic-linkgrid__item:nth-child(1),
.jic-linkgrid__item:nth-child(2) {
	border-top: 1px solid #e2e7f0;
}
/* 矢印は装飾なのでCSSで描き、読み上げに載せない。 */
.jic-linkgrid__item::after {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	border-top: 1.5px solid #aeb8c8;
	border-right: 1.5px solid #aeb8c8;
	transform: rotate(45deg);
	transition: border-color .2s, transform .2s;
}
.jic-linkgrid__item:hover,
.jic-linkgrid__item:focus-visible {
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
	border-bottom-color: var(--wp--preset--color--primary, #2563eb);
	text-decoration: none;
}
.jic-linkgrid__item:hover::after,
.jic-linkgrid__item:focus-visible::after {
	border-color: var(--wp--preset--color--primary, #2563eb);
	transform: rotate(45deg) translate(2px, -2px);
}
@media (max-width: 700px) {
	.jic-lp .jic-linkgrid {
		grid-template-columns: 1fr;
		column-gap: 0;
		margin-block-start: 28px;
	}
	.jic-linkgrid__item {
		padding: 16px 2px;
		font-size: 15px;
	}
	.jic-linkgrid__item:nth-child(2) {
		border-top: 0;
	}
}

/* 「探す」系のセクションは白い面を画面幅いっぱいに敷く。
   カードが並ぶリズムに切れ目を作り、索引としてまとめて読ませる。
   中身は has-global-padding と is-layout-constrained により本文幅のまま。 */
.jic-lp .entry-content > .wp-block-group.jic-band {
	margin-top: 84px;
	margin-bottom: 84px;
	background: #fff;
	border-top: 1px solid rgba(23, 42, 100, .07);
	border-bottom: 1px solid rgba(23, 42, 100, .07);
}
@media (max-width: 782px) {
	.jic-lp .entry-content > .wp-block-group.jic-band {
		margin-top: 54px;
		margin-bottom: 54px;
	}
}

/* ===== 出発までの週数 =====
   「4〜8週間前」がこのセクションの主張なので、数字を組みの主役に立てる。 */
.jic-when {
	display: grid;
	grid-template-columns: 230px 1fr;
	align-items: center;
	gap: 0 52px;
	padding: 36px 0;
	border-top: 1px solid #e2e7f0;
	border-bottom: 1px solid #e2e7f0;
}
.jic-when__fig {
	margin: 0;
	text-align: center;
}
.jic-when__num {
	display: block;
	color: var(--wp--preset--color--secondary, #1e3a5f);
	font-size: 62px;
	font-weight: 300;
	line-height: 1;
}
.jic-when__unit {
	display: block;
	margin-top: 12px;
	color: var(--wp--preset--color--primary, #2563eb);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .18em;
}
.jic-lp .jic-when__p {
	margin: 0;
	font-size: 15px;
	line-height: 2.05;
}
@media (max-width: 782px) {
	.jic-when {
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 28px 0;
	}
	.jic-when__num {
		font-size: 50px;
	}
}

/* 出発が迫っている方への案内。本文と同じ面に置きつつ、左の罫で別扱いだと示す。 */
.jic-lp .jic-urgent {
	margin-block-start: 40px;
	margin-block-end: 0;
	margin-inline: 0;
	padding: 24px 28px;
	border-left: 2px solid var(--wp--preset--color--primary, #2563eb);
	background: #f5f8ff;
}
.jic-lp .jic-urgent__t {
	margin-block: 0 10px;
	margin-inline: 0;
	padding: 0;
	border: 0;
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .03em;
	text-align: left;
}
.jic-lp .jic-urgent__p {
	margin: 0;
	color: #43505f;
	font-size: 14px;
	line-height: 1.95;
}

/* ===== 受診の流れ =====
   4段を横に並べ、間を縦罫で切る。番号は主張させず、順序の目印として淡く置く。 */
.jic-flow {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-block-start: 44px;
}
.jic-flow__step {
	padding: 0 26px;
}
.jic-flow__step + .jic-flow__step {
	border-left: 1px solid #e2e7f0;
}
.jic-flow__step:first-child {
	padding-left: 0;
}
.jic-flow__step:last-child {
	padding-right: 0;
}
.jic-flow__n {
	display: block;
	color: #c2ccdc;
	font-size: 30px;
	font-weight: 300;
	letter-spacing: .04em;
	line-height: 1;
}
.jic-lp .jic-flow__t {
	margin-block: 16px 10px;
	margin-inline: 0;
	padding: 0;
	border: 0;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .02em;
	text-align: left;
}
.jic-lp .jic-flow__p {
	margin: 0;
	color: #5b6472;
	font-size: 14px;
	line-height: 1.95;
}
@media (max-width: 860px) {
	.jic-flow {
		grid-template-columns: 1fr;
	}
	.jic-flow__step {
		padding: 26px 0;
	}
	.jic-flow__step + .jic-flow__step {
		border-left: 0;
		border-top: 1px solid #e2e7f0;
	}
	.jic-flow__step:first-child {
		padding-top: 0;
	}
	.jic-flow__step:last-child {
		padding-bottom: 0;
	}
}

/* 持ち物。2列の罫リスト。行頭の短い横線は .jic-prep__list と同じ記号。 */
.jic-bring {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 64px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.jic-bring li {
	position: relative;
	margin: 0;
	padding: 17px 0 17px 20px;
	border-bottom: 1px solid #e2e7f0;
	font-size: 15px;
	line-height: 1.7;
}
.jic-bring li::before {
	content: "";
	position: absolute;
	top: calc(17px + .82em);
	left: 0;
	width: 9px;
	height: 1px;
	background: var(--wp--preset--color--primary, #2563eb);
}
@media (max-width: 700px) {
	.jic-bring {
		grid-template-columns: 1fr;
	}
}

/* ===== 目的別のご案内 =====
   .jic-linkgrid と同じ罫の組みで、説明文を1行添えた版。 */
.jic-purpose {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 64px;
	margin-block-start: 44px;
}
.jic-purpose__item {
	display: block;
	padding: 28px 2px;
	border-bottom: 1px solid #e2e7f0;
	color: inherit;
	text-decoration: none;
}
.jic-purpose__item:nth-child(1),
.jic-purpose__item:nth-child(2) {
	border-top: 1px solid #e2e7f0;
}
.jic-purpose .jic-purpose__t {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-block: 0 12px;
	margin-inline: 0;
	padding: 0;
	border: 0;
	color: var(--wp--preset--color--secondary, #1e3a5f);
	font-size: 17px;
	font-weight: 600;
	letter-spacing: .02em;
	text-align: left;
	transition: color .2s;
}
.jic-purpose__t::after {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	border-top: 1.5px solid #aeb8c8;
	border-right: 1.5px solid #aeb8c8;
	transform: rotate(45deg);
	transition: border-color .2s, transform .2s;
}
.jic-purpose .jic-purpose__p {
	margin: 0;
	color: #5b6472;
	font-size: 14px;
	line-height: 1.95;
}
.jic-purpose__item:hover .jic-purpose__t,
.jic-purpose__item:focus-visible .jic-purpose__t {
	color: var(--wp--preset--color--primary, #2563eb);
}
.jic-purpose__item:hover .jic-purpose__t::after,
.jic-purpose__item:focus-visible .jic-purpose__t::after {
	border-color: var(--wp--preset--color--primary, #2563eb);
	transform: rotate(45deg) translate(2px, -2px);
}
@media (max-width: 700px) {
	.jic-purpose {
		grid-template-columns: 1fr;
	}
	.jic-purpose__item:nth-child(2) {
		border-top: 0;
	}
}

/* ===== よくあるご質問 =====
   details/summary の開閉。JSON-LD は jic_faq_from_details が details を優先して拾う。
   Q・A の記号は擬似要素で描く。本文に文字として入れると設問・回答のテキストに混ざる。 */
.jic-faq {
	margin-block-start: 44px;
}
.jic-faq details {
	border-bottom: 1px solid #e2e7f0;
}
.jic-faq details:first-of-type {
	border-top: 1px solid #e2e7f0;
}
.jic-faq summary {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 25px 44px 25px 0;
	list-style: none;
	color: #16203a;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: .02em;
	line-height: 1.65;
	cursor: pointer;
}
.jic-faq summary::-webkit-details-marker {
	display: none;
}
.jic-faq summary::before {
	content: "Q";
	flex: none;
	color: var(--wp--preset--color--primary, #2563eb);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.75;
}
.jic-faq summary::after {
	content: "";
	position: absolute;
	top: 32px;
	right: 8px;
	width: 9px;
	height: 9px;
	border-right: 1.5px solid #aeb8c8;
	border-bottom: 1.5px solid #aeb8c8;
	transform: rotate(45deg);
	transition: transform .2s, border-color .2s;
}
.jic-faq details[open] summary::after {
	transform: rotate(-135deg);
	border-color: var(--wp--preset--color--primary, #2563eb);
}
.jic-faq summary:hover {
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
}
.jic-lp .jic-faq__a {
	display: flex;
	gap: 16px;
	margin: 0;
	padding: 0 44px 27px 0;
	color: #43505f;
	font-size: 15px;
	line-height: 2;
}
.jic-faq__a::before {
	content: "A";
	flex: none;
	color: #aeb8c8;
	font-size: 15px;
	font-weight: 600;
	line-height: 2;
}

/* ===== アクセス =====
   紺の面を画面幅いっぱいに敷く。白い面が続く下部にひとつ濃い段を作り、
   締めのブロックだと分かるようにする。傾きは他のカードと同じ152度。 */
.jic-lp .entry-content > .wp-block-group.jic-band--navy {
	background:
		linear-gradient(152deg,
			#1b3a63 0%,
			#234b7d 38%,
			#2a5f9c 70%,
			#1f4372 100%);
	border-top: 0;
	border-bottom: 0;
	color: #fff;
}

.jic-access {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
	column-gap: 88px;
}

/* 列見出し。組みは .jic-sec__ja / .jic-sec__en に合わせ、左寄せにするだけ。
   この面だけ中央寄せの和欧2段を使わないのは、2列それぞれに見出しが立つため。 */
.jic-lp .jic-access__h {
	margin-block: 0 34px;
	margin-inline: 0;
	padding: 0;
	border: 0;
	color: #fff;
	font-size: 30px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.4;
	text-align: left;
}
.jic-access__h span {
	display: block;
	margin-top: 8px;
	color: #a8cdfb;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .22em;
}
@media (max-width: 700px) {
	.jic-lp .jic-access__h {
		font-size: 24px;
	}
}

.jic-lp .jic-access__name {
	margin: 0 0 10px;
	color: rgba(255, 255, 255, .58);
	font-size: 12px;
	letter-spacing: .1em;
}
.jic-lp .jic-access__addr {
	margin: 0 0 32px;
	font-size: 16px;
	line-height: 1.9;
}

.jic-access__map iframe {
	display: block;
	width: 100%;
	height: 330px;
	border: 0;
}

/* 交通。1行に収める。説明を足すと段が増えて重くなる。 */
.jic-access__routes {
	margin: 34px 0 0;
	padding: 0;
	list-style: none;
}
.jic-access__routes li {
	display: flex;
	align-items: center;
	gap: 18px;
	margin: 0;
	padding: 15px 0;
	font-size: 15px;
	line-height: 1.6;
}
/* 記号は装飾。細い輪郭だけにして、白ベタの丸より軽く見せる。 */
.jic-access__ic {
	flex: none;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(255, 255, 255, .38);
	border-radius: 999px;
}
.jic-access__ic svg {
	display: block;
}

/* 診療時間。1日1区分・年中無休なので全曜日に印が付く。行は広く取る。 */
.jic-hours {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
}
.jic-hours th,
.jic-hours td {
	padding: 22px 4px;
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .22);
	text-align: center;
}
.jic-hours thead th {
	padding: 0 4px 14px;
	color: rgba(255, 255, 255, .66);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .06em;
}
.jic-hours thead td {
	padding: 0;
	border-bottom-color: rgba(255, 255, 255, .22);
}
.jic-hours tbody th {
	color: #fff;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: .02em;
	text-align: left;
	white-space: nowrap;
}
.jic-band--navy .jic-mk--dot {
	width: 9px;
	height: 9px;
	background: #fff;
}
.jic-lp .jic-access__note {
	margin: 26px 0 0;
	color: rgba(255, 255, 255, .66);
	font-size: 13px;
	line-height: 1.9;
}
/* 既定のリンク色は紺地でほぼ沈む。白の下線にする。 */
.jic-band--navy a:not(.jic-cta__btn) {
	color: #fff;
	text-decoration-color: rgba(255, 255, 255, .5);
}

@media (max-width: 900px) {
	.jic-access {
		grid-template-columns: 1fr;
		row-gap: 60px;
	}
}
@media (max-width: 700px) {
	.jic-lp .jic-access__h {
		margin-block-end: 26px;
	}
	.jic-access__map iframe {
		height: 240px;
	}
	.jic-hours th,
	.jic-hours td {
		padding: 17px 2px;
	}
	.jic-hours tbody th {
		font-size: 15px;
	}
	.jic-access__ic {
		width: 34px;
		height: 34px;
	}
	.jic-access__routes li {
		gap: 14px;
		font-size: 14px;
	}
}

/* シルバーの面では罫だけの一覧が地に沈む。1件ずつ白い面に載せて起こす。 */
.jic-card--silver .jic-linkgrid {
	column-gap: 24px;
}
.jic-card--silver .jic-linkgrid__item {
	padding: 27px 28px;
	border: 0;
	border-radius: 3px;
	background: #fff;
	box-shadow:
		0 1px 2px rgba(23, 42, 100, .06),
		0 10px 26px rgba(23, 42, 100, .09);
	color: var(--wp--preset--color--primary-dark, #1d4ed8);
	font-weight: 600;
	transition: background-color .2s, color .2s;
}
.jic-card--silver .jic-linkgrid__item::after {
	border-color: var(--wp--preset--color--primary, #2563eb);
}
.jic-card--silver .jic-linkgrid__item:hover,
.jic-card--silver .jic-linkgrid__item:focus-visible {
	background: #f2f7ff;
}
@media (max-width: 700px) {
	.jic-card--silver .jic-linkgrid {
		row-gap: 14px;
	}
}

/* ===== ページ内メニュー =====
   FV直下に置き、スクロール中も上端に貼り付ける。ページが長いため、
   料金・流れ・FAQ・アクセスへいつでも戻れるようにする。 */
.jic-lp .jic-navbar {
	position: sticky;
	top: 0;
	z-index: 20;
	padding-top: 0;
	padding-bottom: 0;
	border-bottom: 1px solid #e6eaf1;
	background: rgba(255, 255, 255, .93);
	backdrop-filter: blur(10px);
}
.jic-navbar__inner {
	display: flex;
	align-items: center;
	justify-content: center;
}
.jic-navbar__inner a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	padding: 15px 34px;
	color: #16203a;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1.4;
	text-decoration: none;
	transition: color .2s;
}
.jic-navbar__inner a span {
	color: var(--wp--preset--color--primary, #2563eb);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .18em;
}
.jic-navbar__inner a + a {
	border-left: 1px solid #eceff4;
}
.jic-navbar__inner a:hover,
.jic-navbar__inner a:focus-visible {
	color: var(--wp--preset--color--primary, #2563eb);
	text-decoration: none;
}
.jic-navbar__cta {
	flex-direction: row !important;
	gap: 8px !important;
	margin-left: 28px;
	padding: 12px 26px !important;
	border-left: 0 !important;
	border-radius: 999px;
	background: var(--wp--preset--color--primary, #2563eb);
	color: #fff !important;
	transition: background-color .2s;
}
.jic-navbar__cta:hover,
.jic-navbar__cta:focus-visible {
	background: var(--wp--preset--color--primary-dark, #1d4ed8);
}
/* 貼り付いたバーの下に見出しが潜らないようにする。 */
.jic-lp .entry-content > [id] {
	scroll-margin-top: 88px;
}
@media (max-width: 900px) {
	/* 横に収まらないので中身を横スクロールさせる。CTAは常に見える位置に残す。 */
	.jic-navbar__inner {
		justify-content: flex-start;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.jic-navbar__inner::-webkit-scrollbar {
		display: none;
	}
	.jic-navbar__inner a {
		flex: none;
		padding: 12px 20px;
		font-size: 13px;
	}
	/* 横スクロールしてもCTAは右端に残す。ここが最も押される導線のため。 */
	.jic-navbar__cta {
		position: sticky;
		right: 0;
		margin-left: 16px;
		padding: 10px 20px !important;
		box-shadow: -14px 0 14px rgba(255, 255, 255, .95);
	}
}

/* ===== 記事のヒーロー =====
   写真は持たず紺の面に文字だけを置く。ワクチンごとに画像を用意する運用にすると
   揃わないまま公開されるため、記事側は文字で立てる。 */
.jic-lp .jic-ah__eyebrow {
	margin: 0 0 18px;
	color: #a8cdfb;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .18em;
}
.jic-lp .jic-ah__h {
	margin: 0;
	color: #fff;
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.35;
}
.jic-lp .jic-ah__lead {
	/* max-width を持たせない。WordPress の is-layout-constrained が子に
	   margin-inline:auto !important を当てるため、幅を絞ると見出しより内側へ寄ってしまう。
	   行が長くなりすぎないよう、文面側を2行程度に収める。 */
	margin: 18px 0 0;
	color: rgba(255, 255, 255, .86);
	font-size: 16px;
	line-height: 1.95;
}
.jic-ah .jic-cta {
	margin-top: 32px;
}
.jic-ah .jic-badges {
	margin-top: 20px;
}

/* 監修者ボックスの日本語版。英語版と同じ骨格。経歴の日本語文が無い分だけ短い。 */
.jic-lp .jic-rev--ja {
	margin-block-start: 64px;
}

/* LPの面では本文のセクションを白いカードとして浮かせているが、その指定は
   .wp-block-group にしか掛かっていない。監修者ボックスは aside なので対象外で、
   幅もカードの体裁も持たないまま画面幅いっぱいに出ていた。同じ扱いに揃える。 */
.jic-lp .entry-content > .jic-rev {
	max-width: var(--wp--style--global--content-size, 1080px);
	margin-inline: auto;
	margin-block: 64px 84px;
	padding: 32px 64px;
	border: 1px solid rgba(255, 255, 255, .85);
	border-top: 3px solid var(--wp--preset--color--primary, #2563eb);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(23, 42, 100, .05), 0 12px 34px rgba(23, 42, 100, .09);
}
@media (max-width: 782px) {
	.jic-lp .entry-content > .jic-rev {
		margin-block: 44px 54px;
		padding: 24px;
		border-radius: 10px;
	}
}
.jic-rev--ja .jic-rev__name {
	font-size: 17px;
	letter-spacing: .04em;
}

/* ヘッダー直下の要素は上の余白を持たない。セクション間の84pxがそのまま
   ヘッダーとの隙間になり、固定背景の柄が帯状に見えていた。
   LPのFVは cover で余白を持たないため、これまで表面化していなかった。 */
.jic-lp .entry-content > .wp-block-group:first-child {
	margin-top: 0;
}

/* リストの直後に補足の段落が続く面がある。段落は上マージンを持たないため詰まる。 */
.jic-lp .jic-prep__list + .jic-intro__p {
	margin-top: 26px;
}

/* ===== 行き止まり（404・検索結果ゼロ件）=====
   404の本文がTOPへの1本しか持たず、離脱するしかない面になっていた。
   検索フォームと主要ページを同じ組みで置き、404と検索結果ゼロ件で共用する。 */
.jic-404__head {
	font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem);
	color: var(--wp--preset--color--secondary);
	margin-bottom: 12px;
}
.jic-404__lead {
	color: var(--wp--preset--color--dark-gray);
	max-width: 42em;
	margin-bottom: 28px;
}
.jic-search {
	display: flex;
	gap: 8px;
	max-width: 560px;
	margin-bottom: 40px;
}
.jic-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;              /* flex 子は既定で縮まず、狭い画面でボタンを押し出す */
	padding: 12px 14px;
	font-size: 16px;           /* iOS はこれ未満だと入力時にズームする */
	border: 1px solid var(--wp--preset--color--light-gray);
	border-radius: 8px;
	background: #fff;
}
.jic-search input[type="search"]:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}
.jic-search__btn {
	flex: 0 0 auto;
	padding: 12px 22px;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: var(--wp--preset--color--primary);
	border: 0;
	border-radius: 8px;
	cursor: pointer;
}
.jic-search__btn:hover { background: var(--wp--preset--color--primary-dark); }

.jic-way__head {
	font-size: 1.05rem;
	color: var(--wp--preset--color--secondary);
	margin-bottom: 14px;
}
.jic-way__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.jic-way__list li { margin: 0; }
.jic-way__list a {
	display: block;
	padding: 14px 16px;
	background: var(--wp--preset--color--light-gray);
	border-radius: 8px;
	color: var(--wp--preset--color--secondary);
	font-weight: 600;
	text-decoration: none;
}
.jic-way__list a:hover {
	background: var(--wp--preset--color--primary);
	color: #fff;
}
.jic-404__home { margin-top: 32px; }

.jic-searchhead { margin-bottom: 8px; }

/* ラベルは読み上げにだけ出す。コアの common.css に定義はあるが、
   ブロックテーマでは読み込まれない面があるため自前で持つ。 */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; border: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
