@charset "UTF-8";
/* ==========================================================================
   婚活サポート Junction — main.css
   1. トークン / 2. リセット / 3. 基本タイポ / 4. レイアウト / 5. ボタン
   6. ヘッダー / 7. ドロワー / 8. ヒーロー / 9. 各セクション
   10. フッター / 11. 固定導線 / 12. 本文・フォーム / 13. 補助
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. トークン
   -------------------------------------------------------------------------- */
:root {
	--gold-900: #6f5a31;
	--gold-700: #957a49;
	--gold-500: #bfa579;
	--gold-400: #cdb894;
	--gold-300: #ddcbaa;
	--gold-100: #f3ebdd;

	--green-700: #5d8434;
	--green-600: #6f9b3f;
	--green-500: #8cbb4f;
	--green-100: #eef5e4;

	--line: #06c755;
	--line-dark: #05a948;

	--ink: #2c2721;
	--ink-80: #4b443a;
	--ink-60: #6f6659;
	--ink-40: #9a9082;

	--bg: #ffffff;
	--bg-1: #fbf8f3;
	--bg-2: #f5efe4;
	--bg-3: #efe6d6;
	--border: #e8dfd0;
	--border-soft: #f0e9dc;

	--danger: #c0483c;
	--danger-bg: #fdf3f2;

	--f-serif: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	--f-sans: "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", "Helvetica Neue", Arial, sans-serif;
	--f-en: "Cormorant Garamond", "Zen Old Mincho", serif;

	--wrap: 1160px;
	--wrap-narrow: 820px;
	--pad: clamp(20px, 5.2vw, 40px);
	--sec-y: clamp(64px, 9vw, 116px);

	--r-s: 6px;
	--r-m: 12px;
	--r-l: 20px;
	--r-full: 999px;

	--sh-1: 0 1px 2px rgba(60, 48, 28, .05), 0 6px 20px rgba(60, 48, 28, .06);
	--sh-2: 0 2px 6px rgba(60, 48, 28, .07), 0 16px 40px rgba(60, 48, 28, .09);
	--sh-bar: 0 -2px 18px rgba(60, 48, 28, .12);

	--fixbar-h: 62px;
	--ease: cubic-bezier(.22, .61, .36, 1);
}

/* --------------------------------------------------------------------------
   2. リセット
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 130px;
}

body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font-family: var(--f-sans);
	font-size: 16px;
	line-height: 1.9;
	font-feature-settings: "palt" 1;
	letter-spacing: .02em;
	overflow-wrap: anywhere;
	word-break: normal;
	line-break: strict;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

body.has-fixedbar { padding-bottom: var(--fixbar-h); }
@media (min-width: 900px) { body.has-fixedbar { padding-bottom: 0; } }

img, svg, video, picture { max-width: 100%; height: auto; display: block; }
img { border-style: none; }

h1, h2, h3, h4, h5, h6, p, figure, dl, dd, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

a { color: inherit; text-decoration: none; transition: color .2s var(--ease), opacity .2s var(--ease); }
a:hover { color: var(--gold-700); }

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
input, textarea, select { font: inherit; color: inherit; }

table { border-collapse: collapse; width: 100%; }

:focus-visible {
	outline: 2px solid var(--gold-700);
	outline-offset: 3px;
	border-radius: 3px;
}

::selection { background: var(--gold-100); color: var(--ink); }

.skiplink {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	background: var(--ink);
	color: #fff;
	padding: 12px 20px;
}
.skiplink:focus { left: 0; }

/* --------------------------------------------------------------------------
   3. 基本タイポ
   -------------------------------------------------------------------------- */
.pc { display: inline; }
.sp { display: none; }
@media (max-width: 767px) {
	.pc { display: none; }
	.sp { display: inline; }
}

.jc-icon { flex: none; }

/* --------------------------------------------------------------------------
   4. レイアウト
   -------------------------------------------------------------------------- */
.wrap {
	width: 100%;
	max-width: calc(var(--wrap) + var(--pad) * 2);
	margin-inline: auto;
	padding-inline: var(--pad);
}
.wrap--narrow { max-width: calc(var(--wrap-narrow) + var(--pad) * 2); }

.site-main { display: block; }

.sec { padding-block: var(--sec-y); }
.sec--worry { background: var(--bg-1); }
/* 30代のトップページでは「はじまりのきっかけ」として後半に置くので、
   直前の代表メッセージ（--bg-1）と地続きに見えないよう一段濃くする。 */
.sec--worry.is-late { background: var(--bg-2); }
.sec--future { background: var(--bg); }
.sec--reason { background: var(--bg); }
.sec--strength { background: var(--bg-1); }
.sec--voice { background: linear-gradient(180deg, var(--bg-1), var(--bg-2)); }
.sec--plan { background: var(--bg); }
.sec--message { background: var(--bg-1); }
.sec--flow { background: var(--bg); }
.sec--gift { background: linear-gradient(160deg, #f7f2e8, #efe4cf); }
.sec--insta { background: var(--bg); }
.sec--news { background: var(--bg-1); }
.sec--faq { background: var(--bg); }
.sec--related { background: var(--bg-1); }

.sec__more { margin-top: clamp(32px, 4vw, 52px); text-align: center; }

.empty {
	padding: 60px 0;
	text-align: center;
	color: var(--ink-60);
}

/* セクション見出し */
.sec-head { margin-bottom: clamp(34px, 4.4vw, 60px); }
.sec-head--center { text-align: center; }
.sec-head__en {
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: .38em;
	text-transform: uppercase;
	color: var(--gold-700);
	margin-bottom: 14px;
}
.sec-head--center .sec-head__en { padding-left: .38em; }
.sec-head__en::after {
	content: "";
	display: block;
	width: 26px;
	height: 1px;
	background: var(--gold-400);
	margin: 12px auto 0;
}
.sec-head--left .sec-head__en::after { margin-inline: 0; }
.sec-head__ja {
	font-family: var(--f-serif);
	font-weight: 600;
	font-size: clamp(23px, 3.4vw, 38px);
	line-height: 1.55;
	letter-spacing: .04em;
}
.sec-head__lead {
	margin-top: 20px;
	color: var(--ink-60);
	font-size: 15px;
	line-height: 2.1;
	max-width: 44em;
}
.sec-head--center .sec-head__lead { margin-inline: auto; }

/* --------------------------------------------------------------------------
   5. ボタン
   -------------------------------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 13px 28px;
	border-radius: var(--r-full);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .04em;
	line-height: 1.4;
	text-align: center;
	border: 1.5px solid transparent;
	transition: transform .18s var(--ease), box-shadow .22s var(--ease), background-color .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
	will-change: transform;
}
.btn:hover { transform: translateY(-2px); color: inherit; }
.btn:active { transform: translateY(0); }

.btn--primary {
	background: linear-gradient(135deg, var(--gold-500), var(--gold-700));
	color: #fff;
	box-shadow: 0 6px 18px rgba(149, 122, 73, .28);
}
.btn--primary:hover { box-shadow: 0 10px 26px rgba(149, 122, 73, .34); color: #fff; }

.btn--line {
	background: var(--line);
	color: #fff;
	box-shadow: 0 6px 18px rgba(6, 199, 85, .26);
}
.btn--line:hover { background: var(--line-dark); box-shadow: 0 10px 26px rgba(6, 199, 85, .32); color: #fff; }

.btn--outline {
	background: #fff;
	border-color: var(--gold-400);
	color: var(--gold-900);
}
.btn--outline:hover { background: var(--gold-100); border-color: var(--gold-500); color: var(--gold-900); }

.btn--ghost {
	background: transparent;
	border-color: var(--border);
	color: var(--ink-80);
}
.btn--ghost:hover { background: var(--bg-1); }

.btn--lg { min-height: 60px; font-size: 16px; padding-inline: 34px; }
.btn--block { display: flex; width: 100%; }
.btn--wide { min-width: 268px; }

@media (max-width: 767px) {
	.btn--wide { width: 100%; min-width: 0; }
	.btn--lg { min-height: 56px; }
}

/* --------------------------------------------------------------------------
   6. ヘッダー（上段：ロゴ＋電話＋CTA／下段：メニュー）
   -------------------------------------------------------------------------- */
.hd {
	position: sticky;
	top: 0;
	z-index: 60;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: saturate(150%) blur(10px);
	-webkit-backdrop-filter: saturate(150%) blur(10px);
	border-bottom: 1px solid var(--border-soft);
	transition: box-shadow .25s var(--ease);
}
.hd.is-stuck { box-shadow: 0 2px 20px rgba(60, 48, 28, .09); }

.hd__util {
	background: var(--gold-900);
	color: #f4ecdd;
	font-size: 12px;
	letter-spacing: .04em;
	overflow: hidden;
	max-height: 40px;
	transition: max-height .28s var(--ease), opacity .2s var(--ease);
}
.hd.is-stuck .hd__util { max-height: 0; opacity: 0; }
.hd__util-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 34px;
}
.hd__tagline { margin: 0; opacity: .92; }
.hd__util-right { display: flex; gap: 22px; }
.hd__util-item { display: inline-flex; align-items: center; gap: 6px; opacity: .88; }
@media (max-width: 1023px) { .hd__util { display: none; } }

.hd__main-inner {
	display: flex;
	align-items: center;
	gap: clamp(14px, 2vw, 28px);
	min-height: 74px;
	transition: min-height .25s var(--ease);
}
.hd.is-stuck .hd__main-inner { min-height: 62px; }

.hd__brand { flex: none; margin-right: auto; }
.hd__logo { display: flex; align-items: center; gap: 12px; }
.hd__logo-img { max-height: 54px; width: auto; }
.hd__logo-mark {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 1.5px solid var(--gold-400);
	font-family: var(--f-en);
	font-size: 22px;
	color: var(--gold-700);
	background: linear-gradient(150deg, #fff, var(--gold-100));
}
.hd__logo-text { display: flex; flex-direction: column; line-height: 1.25; }
.hd__logo-sub { font-size: 10.5px; letter-spacing: .3em; color: var(--gold-700); }
.hd__logo-name { font-family: var(--f-en); font-size: 26px; letter-spacing: .04em; color: var(--ink); }

.hd__contact { flex: none; text-align: right; line-height: 1.3; }
.hd__tel { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); }
.hd__tel .jc-icon { color: var(--gold-700); }
.hd__tel-num { font-family: var(--f-en); font-size: 22px; font-weight: 600; letter-spacing: .03em; }
.hd__tel-note { display: block; font-size: 10px; color: var(--ink-40); margin-top: 2px; }
@media (max-width: 1199px) { .hd__contact { display: none; } }

.hd__actions { flex: none; display: flex; gap: 10px; }
.hd__btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 9px 20px;
	border-radius: var(--r-full);
	color: #fff;
	transition: transform .18s var(--ease), box-shadow .22s var(--ease), filter .2s var(--ease);
}
.hd__btn:hover { transform: translateY(-1px); color: #fff; filter: brightness(1.04); }
.hd__btn--line { background: var(--line); box-shadow: 0 4px 12px rgba(6, 199, 85, .26); }
.hd__btn--primary { background: linear-gradient(135deg, var(--gold-500), var(--gold-700)); box-shadow: 0 4px 12px rgba(149, 122, 73, .26); }
.hd__btn-text { display: flex; flex-direction: column; line-height: 1.25; }
.hd__btn-main { font-size: 14px; font-weight: 700; }
.hd__btn-sub { font-size: 10.5px; opacity: .88; letter-spacing: .02em; }

.hd__navrow { border-top: 1px solid var(--border-soft); }
.hd.is-stuck .hd__navrow { display: none; }
.hd__nav { display: block; }
.hd__menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 clamp(14px, 2.2vw, 34px);
}
.hd__menu > li > a {
	position: relative;
	display: block;
	padding: 14px 2px 13px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .02em;
	white-space: nowrap;
	transition: color .2s var(--ease);
}
.hd__menu > li > a:hover { color: var(--gold-900); }
/* ヘッダー下端の罫線そのものが太くなる見せ方にして、線が二重にならないようにする */
.hd__menu > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 2px;
	background: var(--gold-500);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .26s var(--ease);
}
.hd__menu > li > a:hover::after,
.hd__menu > .current-menu-item > a::after,
.hd__menu > .current_page_item > a::after { transform: scaleX(1); }
.hd__menu .sub-menu { display: none; }

.hd__toggle {
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	padding: 6px 4px;
	color: var(--ink-80);
	flex: none;
}
.hd.is-stuck .hd__toggle { display: flex; }
.hd__toggle-icon { display: block; width: 24px; }
.hd__toggle-icon span {
	display: block;
	height: 1.6px;
	background: currentColor;
	border-radius: 2px;
	transition: transform .28s var(--ease), opacity .2s var(--ease);
}
.hd__toggle-icon span + span { margin-top: 5px; }
.hd__toggle-label { font-size: 9.5px; letter-spacing: .12em; }
.hd__toggle[aria-expanded="true"] .hd__toggle-icon span:nth-child(1) { transform: translateY(6.6px) rotate(45deg); }
.hd__toggle[aria-expanded="true"] .hd__toggle-icon span:nth-child(2) { opacity: 0; }
.hd__toggle[aria-expanded="true"] .hd__toggle-icon span:nth-child(3) { transform: translateY(-6.6px) rotate(-45deg); }

@media (max-width: 1023px) {
	.hd__main-inner { min-height: 64px; gap: 12px; }
	.hd.is-stuck .hd__main-inner { min-height: 58px; }
	.hd__navrow { display: none; }
	.hd__toggle { display: flex; }
	.hd__btn--primary { display: none; }
	.hd__btn-sub { display: none; }
	.hd__logo-name { font-size: 22px; }
	.hd__logo-mark { width: 36px; height: 36px; font-size: 19px; }
}
@media (max-width: 400px) {
	.hd__btn--line { padding: 8px 13px; }
	.hd__btn-main { font-size: 13px; }
	.hd__logo-name { font-size: 20px; }
}

/* --------------------------------------------------------------------------
   7. ドロワー
   -------------------------------------------------------------------------- */
.drawer {
	position: fixed;
	inset: 0;
	z-index: 90;
	display: grid;
}
.drawer[hidden] { display: none; }
.drawer__scrim {
	position: absolute;
	inset: 0;
	background: rgba(44, 39, 33, .5);
	opacity: 0;
	transition: opacity .3s var(--ease);
	z-index: 0;
}
.drawer.is-open .drawer__scrim { opacity: 1; }
.drawer__panel {
	position: relative;
	z-index: 1;
	justify-self: end;
	width: min(420px, 92vw);
	height: 100%;
	background: var(--bg-1);
	overflow-y: auto;
	overscroll-behavior: contain;
	transform: translateX(100%);
	transition: transform .34s var(--ease);
	padding-bottom: 40px;
	-webkit-overflow-scrolling: touch;
}
.drawer.is-open .drawer__panel { transform: none; }

.drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px var(--pad);
	border-bottom: 1px solid var(--border);
	position: sticky;
	top: 0;
	background: var(--bg-1);
	z-index: 2;
}
.drawer__title { font-family: var(--f-en); letter-spacing: .3em; font-size: 14px; color: var(--gold-700); }
.drawer__close { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #fff; border: 1px solid var(--border); }

.drawer__cta { padding: 22px var(--pad) 6px; display: grid; gap: 10px; }
.drawer__cta-note { font-size: 12px; color: var(--ink-60); text-align: center; margin-top: 2px; }

.drawer__nav { padding: 22px var(--pad) 0; }
.drawer__menu { border-top: 1px solid var(--border); }
.drawer__menu > li { border-bottom: 1px solid var(--border); }
.drawer__menu > li > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 2px;
	font-size: 15px;
	font-weight: 500;
}
.drawer__menu > li > a::after {
	content: "";
	width: 7px;
	height: 7px;
	border-right: 1.4px solid var(--gold-500);
	border-bottom: 1.4px solid var(--gold-500);
	transform: rotate(-45deg);
	flex: none;
}
.drawer__menu .sub-menu { padding: 0 0 12px 14px; }
.drawer__menu .sub-menu a { display: block; padding: 8px 0; font-size: 14px; color: var(--ink-60); }

.drawer__foot { padding: 26px var(--pad) 0; }
.drawer__tel {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	color: var(--ink);
}
.drawer__tel strong { display: block; font-size: 19px; font-family: var(--f-en); letter-spacing: .04em; }
.drawer__tel small { display: block; font-size: 11px; color: var(--ink-60); line-height: 1.6; }
.drawer__sns { display: flex; gap: 12px; justify-content: center; margin-top: 20px; }
.drawer__sns a {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--border);
	color: var(--gold-700);
}

body.is-locked { overflow: hidden; }

/* --------------------------------------------------------------------------
   8. ヒーロー
   -------------------------------------------------------------------------- */
.hero { position: relative; isolation: isolate; }
.hero__media { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.hero__img { width: 100%; height: 100%; object-fit: cover; object-position: 70% center; }
.hero__veil {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .86) 34%, rgba(255, 255, 255, .35) 58%, rgba(255, 255, 255, .1) 78%);
}

.hero__inner {
	display: flex;
	align-items: center;
	min-height: clamp(520px, 68vh, 720px);
	padding-block: clamp(56px, 8vw, 96px);
}
.hero__body { max-width: 620px; }

.hero__lead {
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: .34em;
	text-transform: uppercase;
	color: var(--gold-700);
	margin-bottom: 22px;
}
/* 日本語を入れると .34em では間延びするので、そのときだけ詰める。 */
.hero__lead--ja {
	font-family: var(--f-serif);
	letter-spacing: .2em;
	text-transform: none;
}
.hero__title {
	font-family: var(--f-serif);
	font-weight: 600;
	font-size: clamp(30px, 5.4vw, 56px);
	line-height: 1.5;
	letter-spacing: .04em;
	margin-bottom: 26px;
}
/* 管理画面で 1 行空けたところが段落の切れ目になる。段落が 1 つでも複数でも収まるよう、
   下の余白は囲みのほうで取る。 */
.hero__texts { margin-bottom: 34px; }
.hero__text {
	color: var(--ink-80);
	font-size: clamp(14px, 1.6vw, 16px);
	line-height: 2.15;
	max-width: 34em;
	margin: 0;
}
.hero__text + .hero__text { margin-top: 1.1em; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__note {
	margin-top: 16px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 12.5px;
	color: var(--ink-60);
}
.hero__note .jc-icon { color: var(--green-600); }

/* 代表カウンセラーの名札。
   ファーストビューのうちに「誰が対応するのか」を顔で伝えるための小さなカード。 */
.hero__counselor {
	margin-top: 26px;
	/* hero__note が inline-flex なので、こちらをブロックにしないと同じ行に並んでしまう。 */
	display: flex;
	width: fit-content;
	align-items: center;
	gap: 14px;
	max-width: 100%;
	padding: 10px 18px 10px 10px;
	background: rgba(255, 255, 255, .9);
	border: 1px solid var(--border);
	border-radius: var(--r-full);
	box-shadow: var(--sh-1);
	backdrop-filter: blur(6px);
	color: inherit;
	transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.hero__counselor:hover { color: inherit; transform: translateY(-2px); box-shadow: var(--sh-2); }

.hero__counselor-photo {
	flex: none;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--bg-2);
	box-shadow: 0 2px 8px rgba(60, 48, 28, .18);
}
/* 縦長のポートレートを丸で切り抜くと顔が小さくなるので、
   顔が円の中心に来る位置に寄せてから、少しだけ寄る。 */
.hero__counselor-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 8%;
	transform: scale(1.2);
}

.hero__counselor-body { display: grid; gap: 3px; min-width: 0; }
.hero__counselor-catch {
	font-family: var(--f-serif);
	font-size: 13px;
	line-height: 1.5;
	letter-spacing: .04em;
	color: var(--gold-700);
}
.hero__counselor-name { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.hero__counselor-role { font-size: 11.5px; color: var(--ink-60); }
.hero__counselor-name strong { font-size: 16px; font-weight: 700; letter-spacing: .06em; }
.hero__counselor-note { font-size: 11px; line-height: 1.6; color: var(--ink-60); }
.hero__counselor-more { flex: none; margin-left: 4px; color: var(--gold-700); display: inline-flex; }

.hero__proof { border-top: 1px solid rgba(232, 223, 208, .8); background: rgba(255, 255, 255, .82); backdrop-filter: blur(6px); }
.hero__proof-inner {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
}
.hero__proof-item {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 18px 12px;
	font-size: 13.5px;
	font-weight: 500;
	text-align: center;
}
.hero__proof-item + .hero__proof-item { border-left: 1px solid var(--border-soft); }
.hero__proof-icon { color: var(--gold-700); display: inline-flex; }

@media (max-width: 900px) {
	.hero__veil {
		background: linear-gradient(180deg, rgba(255, 255, 255, .93) 0%, rgba(255, 255, 255, .88) 44%, rgba(255, 255, 255, .46) 72%, rgba(255, 255, 255, .2) 100%);
	}
	.hero__img { object-position: 55% bottom; }
	.hero__inner { min-height: 0; padding-block: clamp(44px, 12vw, 72px); }
	.hero__body { max-width: none; }
	.hero__actions { flex-direction: column; }
	.hero__proof-inner { grid-template-columns: 1fr; }
	.hero__proof-item { justify-content: flex-start; padding: 13px 0; text-align: left; }
	.hero__proof-item + .hero__proof-item { border-left: 0; border-top: 1px solid var(--border-soft); }
}

/* タブレット幅（768〜900px）だけは、横長の写真に上下向きの白がかかる。
   そのままだと人物がほとんど見えないので、下半分の白を薄くして写真を通す。 */
@media (min-width: 768px) and (max-width: 900px) {
	.hero__veil {
		background: linear-gradient(180deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .88) 38%, rgba(255, 255, 255, .38) 64%, rgba(255, 255, 255, .08) 100%);
	}
	.hero__img { object-position: 62% center; }
}

/* スマホのファーストビュー
   相談ボタンは画面下の固定バーが常時受け持つので、ヒーローからは外す。
   空いた分を写真に使い、hero-sp.jpg の人物が文字の下に見えるようにする。
   さらに写真の下に代表カウンセラーの名札を置き、1 画面目のうちに顔が 2 つ出るようにしている。 */
@media (max-width: 767px) {
	/* 白のかぶせは「文字が乗るところだけ」。
	   写真の見せ場（中ほど）はほぼ素通しにして、白っぽく沈まないようにする。 */
	/* 文字が乗るところは白を強くし、文字が終わったら一気に抜く。
	   こうしないと、文章の下 2 行がちょうど新郎新婦の顔に重なる。 */
	.hero__veil {
		background: linear-gradient(180deg,
			rgba(255, 255, 255, .94) 0%,
			rgba(255, 255, 255, .90) 38%,
			rgba(255, 255, 255, .40) 54%,
			rgba(255, 255, 255, .06) 68%,
			rgba(255, 255, 255, 0) 78%);
	}
	.hero__inner {
		align-items: flex-start;
		padding-top: clamp(24px, 7vw, 40px);
		padding-bottom: clamp(16px, 4.5vw, 26px);
	}
	.hero__body { display: flex; flex-direction: column; }
	.hero__lead { margin-bottom: 14px; }
	.hero__title { margin-bottom: 14px; }
	/* 行間を詰めた分だけ、写真の見せ場が下に広がる。 */
	.hero__text { line-height: 1.9; }
	.hero__text + .hero__text { margin-top: .85em; }
	.hero__texts { margin-bottom: 0; }
	.hero__actions,
	.hero__note { display: none; }

	/* この margin が、そのまま写真の見せ場の高さになる。 */
	.hero__counselor {
		margin-top: clamp(150px, 46vw, 220px);
		align-self: stretch;
		border-radius: var(--r-l);
		padding: 9px 14px 9px 9px;
		gap: 11px;
		background: rgba(255, 255, 255, .95);
	}
	.hero__counselor-photo { width: 54px; height: 54px; }
	.hero__counselor-catch { font-size: 12px; }
	.hero__counselor-name strong { font-size: 15px; }
	.hero__counselor-note { font-size: 10.5px; }

	/* 実績の帯は半透明をやめる。写真の上に薄い膜が重なって、
	   写真も文字もぼやけて見える原因になっていた。 */
	.hero__proof {
		background: #fff;
		backdrop-filter: none;
		border-top: 1px solid var(--border);
	}
	.hero__proof-item { padding: 9px 0; font-size: 13px; font-weight: 600; line-height: 1.5; gap: 12px; }
	.hero__proof-icon .jc-icon { width: 18px; height: 18px; }
}

/* --------------------------------------------------------------------------
   8-2. 年代別ページへの入口（30代 ⇄ 40代・50代）
   リンク先のファーストビューをそのまま見せて渡す帯。
   -------------------------------------------------------------------------- */
.bridge {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-block: 1px solid var(--border);
}
.bridge__media { position: absolute; inset: 0; z-index: -1; }
.bridge__img { width: 100%; height: 100%; object-fit: cover; object-position: 72% center; }
.bridge__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .9) 36%, rgba(255, 255, 255, .48) 60%, rgba(255, 255, 255, .12) 84%);
}
.bridge__inner {
	padding-block: clamp(40px, 5.6vw, 72px);
	max-width: calc(var(--wrap) + var(--pad) * 2);
}
.bridge__eyebrow {
	display: inline-block;
	padding: 5px 15px;
	margin-bottom: 16px;
	border: 1px solid var(--gold-400);
	border-radius: var(--r-full);
	background: rgba(255, 255, 255, .78);
	color: var(--gold-900);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .1em;
}
.bridge__title {
	font-family: var(--f-serif);
	font-weight: 600;
	font-size: clamp(21px, 3vw, 33px);
	line-height: 1.55;
	letter-spacing: .04em;
	max-width: 18em;
}
.bridge__text {
	margin-top: 16px;
	max-width: 34em;
	color: var(--ink-80);
	font-size: 14.5px;
	line-height: 2.05;
}
.bridge__btn { margin-top: 24px; background: rgba(255, 255, 255, .9); }

@media (max-width: 767px) {
	/* 下に余白を足して、リンク先のファーストビューと同じ写真を顔まで見せる。 */
	.bridge__inner { padding-bottom: clamp(140px, 38vw, 200px); }
	.bridge__img { object-position: 55% center; }
	.bridge__veil {
		background: linear-gradient(180deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .88) 52%, rgba(255, 255, 255, .5) 78%, rgba(255, 255, 255, .28) 100%);
	}
	.bridge__title { max-width: none; }
	.bridge__text { max-width: none; }
	.bridge__btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   9-1. お悩み
   -------------------------------------------------------------------------- */
.worry__list {
	display: grid;
	gap: 12px;
	max-width: 760px;
	margin-inline: auto;
}
.worry__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 18px 22px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	font-size: 15px;
	line-height: 1.8;
	box-shadow: var(--sh-1);
}
.worry__check {
	flex: none;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	margin-top: 2px;
	border-radius: 50%;
	background: var(--green-100);
	color: var(--green-700);
}

.worry__answer {
	margin-top: clamp(36px, 4.6vw, 56px);
	padding: clamp(28px, 4vw, 44px);
	background: linear-gradient(150deg, #fff, var(--gold-100));
	border: 1px solid var(--gold-300);
	border-radius: var(--r-l);
	text-align: center;
	max-width: 860px;
	margin-inline: auto;
}
.worry__answer-title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.6vw, 26px);
	font-weight: 600;
	line-height: 1.7;
	margin-bottom: 14px;
}
.worry__answer-text { color: var(--ink-60); font-size: 15px; line-height: 2.1; }
.worry__answer-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
	font-weight: 700;
	color: var(--gold-900);
	border-bottom: 1px solid var(--gold-400);
	padding-bottom: 3px;
}

/* --------------------------------------------------------------------------
   9-1b. その結婚は、遠い話ではありません（30代のトップページのみ）
   ファーストビューの「こんな結婚が、あなたにもできる。」を数字で受け止める帯。
   -------------------------------------------------------------------------- */
.future__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(14px, 2vw, 24px);
}
.fcard {
	padding: clamp(24px, 3vw, 34px) clamp(18px, 2.2vw, 28px);
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	box-shadow: var(--sh-1);
	text-align: center;
}
.fcard__icon {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--green-100);
	color: var(--green-700);
}
.fcard__num {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 5px;
	margin: 14px 0 6px;
	color: var(--gold-900);
}
.fcard__figure {
	font-family: var(--f-serif);
	font-size: clamp(30px, 4.2vw, 44px);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: .01em;
}
.fcard__unit { font-size: 15px; font-weight: 600; }
.fcard__label {
	font-size: 12.5px;
	letter-spacing: .08em;
	color: var(--ink-60);
	padding-bottom: clamp(14px, 1.8vw, 20px);
	border-bottom: 1px solid var(--border-soft);
}
.fcard__text {
	margin-top: clamp(14px, 1.8vw, 20px);
	font-size: 12.5px;
	line-height: 1.95;
	color: var(--ink-80);
	text-align: left;
}

.future__close {
	margin-top: clamp(30px, 4vw, 48px);
	margin-inline: auto;
	max-width: 860px;
	padding: clamp(26px, 3.4vw, 42px);
	background: linear-gradient(150deg, #fff, var(--gold-100));
	border: 1px solid var(--gold-300);
	border-radius: var(--r-l);
	text-align: center;
}
.future__close-title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.6vw, 26px);
	font-weight: 600;
	line-height: 1.7;
	margin-bottom: 12px;
}
.future__close-text { color: var(--ink-60); font-size: 14.5px; line-height: 2.05; margin-bottom: 22px; }
.future__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.future__source {
	margin-top: 18px;
	text-align: center;
	font-size: 11.5px;
	line-height: 1.9;
	color: var(--ink-40);
}
.future__source a { color: var(--ink-60); }

@media (max-width: 860px) {
	.future__grid { grid-template-columns: 1fr; gap: 12px; }
	/* 1 列になると数字だけが大きく浮くので、アイコン・数字・文章を横並びにする。 */
	.fcard {
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		column-gap: 16px;
		text-align: left;
		padding: 18px 20px;
	}
	.fcard__icon { grid-row: span 2; width: 40px; height: 40px; }
	.fcard__num { justify-content: flex-start; margin: 0 0 2px; }
	.fcard__figure { font-size: 27px; }
	.fcard__label { padding-bottom: 0; border-bottom: 0; }
	.fcard__text { grid-column: 1 / -1; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-soft); }
	.future__actions { flex-direction: column; }
}

/* --------------------------------------------------------------------------
   9-2. 選ばれる理由
   -------------------------------------------------------------------------- */
.reason__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(20px, 2.4vw, 32px);
}
.rcard {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	overflow: hidden;
	box-shadow: var(--sh-1);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.rcard:hover { transform: translateY(-4px); box-shadow: var(--sh-2); }
.rcard__media { position: relative; aspect-ratio: 10 / 7; overflow: hidden; }
.rcard__media img { width: 100%; height: 100%; object-fit: cover; }
.rcard__no {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 8px 18px 6px;
	background: rgba(255, 255, 255, .93);
	font-family: var(--f-en);
	font-size: 22px;
	letter-spacing: .1em;
	color: var(--gold-700);
	border-top-right-radius: var(--r-m);
}
.rcard__body { padding: clamp(22px, 2.4vw, 30px); }
.rcard__icon {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--gold-100);
	color: var(--gold-700);
	margin-bottom: 14px;
}
.rcard__title {
	font-family: var(--f-serif);
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 600;
	line-height: 1.6;
	margin-bottom: 12px;
}
.rcard__text { font-size: 14px; line-height: 2; color: var(--ink-60); }

@media (max-width: 900px) {
	.reason__grid { grid-template-columns: 1fr; gap: 18px; }
	.rcard { display: grid; grid-template-columns: 130px 1fr; align-items: stretch; }
	.rcard__media { aspect-ratio: auto; height: 100%; }
	.rcard__no { font-size: 16px; padding: 5px 10px 4px; }
	.rcard__body { padding: 18px; }
	.rcard__icon { display: none; }
	.rcard__title { font-size: 17px; margin-bottom: 8px; }
	.rcard__text { font-size: 13px; line-height: 1.9; }
}
@media (max-width: 480px) {
	/* 横並びのままだと写真が幅 104px の細い帯になり、何の写真か分からない。
	   スマホでは写真を上に全幅で置く。 */
	.rcard { display: block; }
	.rcard__media { aspect-ratio: 16 / 9; height: auto; }
}

/* --------------------------------------------------------------------------
   9-2b. Junction だからできること
   写真を持たない小さなカード。ページの長さを増やしすぎずに強みを並べる。
   -------------------------------------------------------------------------- */
.strength__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(12px, 1.6vw, 20px);
}
.strength__item {
	display: flex;
	gap: 14px;
	padding: clamp(17px, 2vw, 24px);
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	box-shadow: var(--sh-1);
}
.strength__icon {
	flex: none;
	display: inline-grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--gold-100);
	color: var(--gold-700);
}
.strength__body { min-width: 0; }
.strength__title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: .01em;
	margin-bottom: 6px;
}
.strength__text { font-size: 12.5px; line-height: 1.9; color: var(--ink-60); }

@media (max-width: 900px) {
	.strength__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.strength__grid { grid-template-columns: 1fr; gap: 10px; }
	.strength__item { padding: 14px 16px; gap: 12px; }
	.strength__icon { width: 34px; height: 34px; }
	.strength__icon .jc-icon { width: 18px; height: 18px; }
	.strength__title { font-size: 14px; margin-bottom: 4px; }
	.strength__text { font-size: 12px; line-height: 1.85; }
}

/* --------------------------------------------------------------------------
   9-3. カルーセル / ご成婚インタビュー
   -------------------------------------------------------------------------- */
.carousel { position: relative; margin-top: 8px; }
.carousel__track {
	display: flex;
	gap: clamp(14px, 1.8vw, 24px);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding: 6px max(var(--pad), calc((100vw - var(--wrap)) / 2)) 22px;
	/* 左右の余白ぶんだけスナップ位置をずらす。
	   これが無いと、1 枚目に吸着した時点で余白の幅だけ横スクロールした状態になり、
	   進捗バーが左端から始まらない。 */
	scroll-padding-inline-start: max(var(--pad), calc((100vw - var(--wrap)) / 2));
	-webkit-overflow-scrolling: touch;
}
.carousel__track::-webkit-scrollbar { display: none; }
.carousel__slide {
	flex: 0 0 auto;
	width: clamp(240px, 27vw, 320px);
	scroll-snap-align: start;
}

.carousel__ui {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 6px;
}
.carousel__btn {
	flex: none;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--gold-300);
	color: var(--gold-700);
	transition: background-color .2s var(--ease), opacity .2s var(--ease), transform .2s var(--ease);
}
.carousel__btn:hover { background: var(--gold-100); transform: translateY(-1px); }
.carousel__btn:disabled { opacity: .3; cursor: default; transform: none; }
.carousel__btn--prev .jc-icon { transform: rotate(180deg); }
.carousel__bar { flex: 1 1 auto; height: 2px; background: var(--border); border-radius: 2px; overflow: hidden; }
.carousel__bar-in { display: block; height: 100%; width: 30%; background: var(--gold-500); border-radius: 2px; transition: width .2s var(--ease), transform .2s var(--ease); }

@media (max-width: 767px) {
	.carousel__slide { width: 74vw; max-width: 300px; }
	.carousel__btn { width: 42px; height: 42px; }
}

.vcard { height: 100%; }
.vcard__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	overflow: hidden;
	box-shadow: var(--sh-1);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.vcard__link:hover { transform: translateY(-4px); box-shadow: var(--sh-2); color: inherit; }
.vcard__media { aspect-ratio: 1 / 1; overflow: hidden; background: var(--bg-2); }
.vcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.vcard__link:hover .vcard__media img { transform: scale(1.04); }
.vcard__body { padding: 20px 20px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1 1 auto; }
.vcard__meta { display: flex; flex-wrap: wrap; gap: 8px; font-size: 11.5px; }
.vcard__age {
	background: var(--gold-900);
	color: #fff;
	padding: 3px 11px;
	border-radius: var(--r-full);
	letter-spacing: .06em;
	font-weight: 700;
}
.vcard__period {
	background: var(--gold-100);
	color: var(--gold-900);
	padding: 3px 11px;
	border-radius: var(--r-full);
}
.vcard__catch {
	font-family: var(--f-serif);
	font-size: 15.5px;
	line-height: 1.85;
	font-weight: 500;
	flex: 1 1 auto;
}
.vcard__more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--gold-700);
}

.vgrid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: clamp(16px, 2vw, 28px);
}
@media (max-width: 560px) {
	.vgrid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.vcard__body { padding: 14px 14px 16px; gap: 8px; }
	.vcard__catch { font-size: 13.5px; line-height: 1.75; }
	.vcard__meta { font-size: 10.5px; }
	.vcard__age, .vcard__period { padding: 2px 8px; }
	.vcard__more { font-size: 11.5px; }
}

/* --------------------------------------------------------------------------
   9-4. プラン
   -------------------------------------------------------------------------- */
.plan__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(18px, 2.2vw, 28px);
	align-items: stretch;
}
.plan__grid--all { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }

.plancard {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	padding: clamp(24px, 2.6vw, 34px) clamp(20px, 2.2vw, 30px) clamp(24px, 2.6vw, 32px);
	box-shadow: var(--sh-1);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.plancard:hover { transform: translateY(-4px); box-shadow: var(--sh-2); }
.plancard--rec { border-color: var(--gold-400); box-shadow: 0 4px 14px rgba(149, 122, 73, .16), 0 20px 46px rgba(149, 122, 73, .12); }
.plancard__badge {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	background: linear-gradient(135deg, var(--gold-500), var(--gold-700));
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .06em;
	padding: 5px 18px;
	border-radius: var(--r-full);
	box-shadow: 0 4px 12px rgba(149, 122, 73, .28);
}
.plancard__head { text-align: center; padding-bottom: 20px; border-bottom: 1px solid var(--border-soft); }
.plancard__en {
	font-family: var(--f-en);
	font-size: 12.5px;
	letter-spacing: .32em;
	color: var(--gold-700);
	margin-bottom: 8px;
}
.plancard__title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.2vw, 24px);
	font-weight: 600;
	line-height: 1.5;
}
.plancard__tagline { margin-top: 10px; font-size: 12.5px; color: var(--ink-60); line-height: 1.8; }

.plancard__targets { margin-top: 20px; display: grid; gap: 8px; }
.plancard__targets li { display: flex; gap: 9px; font-size: 13px; line-height: 1.75; color: var(--ink-80); }
.plancard__targets .jc-icon { color: var(--green-600); margin-top: 5px; }

.plancard__fees {
	margin-top: 22px;
	border: 1px solid var(--border-soft);
	border-radius: var(--r-m);
	background: var(--bg-1);
	overflow: hidden;
}
.plancard__fees > div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 16px;
	font-size: 13px;
}
.plancard__fees > div + div { border-top: 1px solid var(--border-soft); }
.plancard__fees dt { color: var(--ink-60); }
.plancard__fees dd { font-weight: 700; font-family: var(--f-en); font-size: 16px; letter-spacing: .02em; }
.plancard__fees dd.is-strong { color: var(--gold-900); font-size: 19px; }

/* 入会金と登録料を別々に出したので、実際に最初に払う合計もここで示す。 */
.plancard__initial {
	margin-top: 10px;
	display: grid;
	gap: 2px;
	padding: 10px 16px;
	border-radius: var(--r-m);
	background: var(--gold-100);
}
.plancard__initial-label { font-size: 11.5px; letter-spacing: .04em; color: var(--gold-900); }
.plancard__initial-value { font-size: 17px; font-weight: 700; line-height: 1.5; letter-spacing: .02em; color: var(--gold-900); }
.plancard__initial-note { font-size: 11px; line-height: 1.6; color: var(--gold-700); }

.plancard__features { margin-top: 20px; display: grid; gap: 7px; }
.plancard__features li { display: flex; gap: 9px; font-size: 12.5px; line-height: 1.7; color: var(--ink-80); }
.plancard__features .jc-icon { color: var(--gold-500); margin-top: 4px; }

.plancard__btn { margin-top: auto; width: 100%; margin-top: 24px; }

.plan__note {
	margin-top: 26px;
	text-align: center;
	font-size: 13.5px;
	color: var(--ink-60);
}

.plan__common, .plan__docs {
	margin-top: clamp(44px, 5vw, 70px);
	padding: clamp(26px, 3.4vw, 44px);
	background: var(--bg-1);
	border-radius: var(--r-l);
	border: 1px solid var(--border);
}
.plan__common-title, .plan__docs-title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.2vw, 24px);
	font-weight: 600;
	margin-bottom: 20px;
	text-align: center;
}
.plan__common-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 12px 24px;
}
.plan__common-list li { display: flex; gap: 10px; font-size: 14px; align-items: flex-start; }
.plan__common-list .jc-icon { color: var(--green-600); margin-top: 5px; }

.plan__docs-list { display: grid; gap: 0; }
.plan__docs-list > div {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 16px;
	padding: 14px 4px;
	border-bottom: 1px solid var(--border);
	font-size: 14px;
}
.plan__docs-list dt { font-weight: 700; }
.plan__docs-list dd { color: var(--ink-60); }
.plan__docs-note { margin-top: 18px; font-size: 13px; color: var(--ink-60); }

@media (max-width: 900px) {
	.plan__grid { grid-template-columns: 1fr; }
	.plan__docs-list > div { grid-template-columns: 1fr; gap: 2px; }
}

/* --------------------------------------------------------------------------
   9-5. メッセージ
   -------------------------------------------------------------------------- */
.message__inner {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	gap: clamp(30px, 5vw, 76px);
	align-items: center;
}
.message__media { position: relative; }
.message__img {
	width: 100%;
	border-radius: var(--r-l);
	box-shadow: var(--sh-2);
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center 20%;
}
.message__sign {
	position: absolute;
	right: -14px;
	bottom: -18px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	padding: 16px 20px;
	box-shadow: var(--sh-1);
	max-width: 74%;
}
.message__sign-role { display: block; font-size: 11px; letter-spacing: .18em; color: var(--gold-700); }
.message__sign-name { display: block; font-family: var(--f-serif); font-size: 20px; font-weight: 600; margin: 3px 0 6px; }
.message__sign-note { display: block; font-size: 10.5px; color: var(--ink-60); line-height: 1.7; }

.message__en {
	font-family: var(--f-en);
	font-size: 13px;
	letter-spacing: .36em;
	color: var(--gold-700);
	margin-bottom: 16px;
}
.message__title {
	font-family: var(--f-serif);
	font-size: clamp(22px, 3.1vw, 34px);
	font-weight: 600;
	line-height: 1.65;
	margin-bottom: 24px;
}
.message__text { display: grid; gap: 18px; color: var(--ink-80); font-size: 15px; line-height: 2.15; margin-bottom: 30px; }
.message__strong { font-family: var(--f-serif); font-size: 17px; color: var(--ink); font-weight: 600; }

@media (max-width: 900px) {
	.message__inner { grid-template-columns: 1fr; gap: 44px; }
	.message__media { max-width: 380px; margin-inline: auto; width: 100%; }
	.message__sign { right: 0; left: 0; bottom: -24px; max-width: none; text-align: center; }
	.message__text { font-size: 14.5px; }
}

/* --------------------------------------------------------------------------
   9-6. 流れ
   -------------------------------------------------------------------------- */
.flow__list { display: grid; gap: 0; max-width: 880px; margin-inline: auto; }
.flow__item { display: grid; grid-template-columns: 68px 1fr; gap: clamp(16px, 2.4vw, 30px); }
.flow__marker { position: relative; display: flex; justify-content: center; }
.flow__marker::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 1px;
	background: var(--gold-300);
	transform: translateX(-50%);
}
.flow__item:first-child .flow__marker::before { top: 26px; }
.flow__item:last-child .flow__marker::before { bottom: auto; height: 26px; }
.flow__dot {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--gold-400);
	color: var(--gold-700);
	font-family: var(--f-en);
	font-size: 20px;
	letter-spacing: .04em;
	margin-top: 0;
}
.flow__body { padding-bottom: clamp(28px, 3.4vw, 46px); padding-top: 6px; }
.flow__step { font-family: var(--f-en); font-size: 11.5px; letter-spacing: .28em; color: var(--gold-700); margin-bottom: 6px; }
.flow__title { font-family: var(--f-serif); font-size: clamp(18px, 2.2vw, 23px); font-weight: 600; margin-bottom: 10px; }
.flow__text { font-size: 14.5px; line-height: 2.05; color: var(--ink-60); }

@media (max-width: 600px) {
	.flow__item { grid-template-columns: 48px 1fr; }
	.flow__dot { width: 40px; height: 40px; font-size: 16px; }
	.flow__text { font-size: 13.5px; line-height: 1.95; }
}

/* --------------------------------------------------------------------------
   9-7. プレゼント
   -------------------------------------------------------------------------- */
.gift__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
	gap: clamp(30px, 4.4vw, 64px);
	align-items: center;
}
.gift__en { font-family: var(--f-en); font-size: 13px; letter-spacing: .36em; color: var(--gold-700); margin-bottom: 14px; }
.gift__title { font-family: var(--f-serif); font-size: clamp(24px, 3.4vw, 38px); font-weight: 600; line-height: 1.5; margin-bottom: 18px; }
.gift__text { color: var(--ink-80); font-size: 15px; line-height: 2.1; margin-bottom: 22px; }
.gift__points { display: grid; gap: 9px; margin-bottom: 28px; }
.gift__points li { display: flex; gap: 10px; font-size: 14px; line-height: 1.8; }
.gift__points .jc-icon { color: var(--green-600); margin-top: 5px; }
.gift__points-more { padding-left: 25px; color: var(--ink-60); font-size: 13px; }
.gift__note { margin-top: 14px; font-size: 12.5px; color: var(--ink-60); line-height: 1.9; }
.gift__media img { border-radius: var(--r-l); box-shadow: var(--sh-2); }

@media (max-width: 900px) {
	.gift__inner { grid-template-columns: 1fr; gap: 32px; }
	.gift__media { order: -1; max-width: 320px; margin-inline: auto; }
}

/* --------------------------------------------------------------------------
   9-8. Instagram
   -------------------------------------------------------------------------- */
.insta__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(8px, 1.2vw, 16px);
}
.insta__item a {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: var(--r-m);
	background: var(--bg-2);
}
.insta__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.insta__item a:hover img { transform: scale(1.06); }
.insta__overlay {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: rgba(44, 39, 33, .38);
	color: #fff;
	opacity: 0;
	transition: opacity .28s var(--ease);
}
.insta__item a:hover .insta__overlay { opacity: 1; }

@media (max-width: 767px) { .insta__grid { grid-template-columns: repeat(2, 1fr); } }

/* --------------------------------------------------------------------------
   9-9. お知らせ・ブログ
   -------------------------------------------------------------------------- */
.news__inner {
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
	gap: clamp(34px, 4.6vw, 70px);
	align-items: start;
}
.news__head {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--border);
	margin-bottom: 6px;
}
.news__en { font-family: var(--f-en); font-size: 12px; letter-spacing: .3em; color: var(--gold-700); }
.news__title { font-family: var(--f-serif); font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; }
.news__all { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--gold-700); font-weight: 700; }

.news__list { display: grid; }
.news__item {
	display: grid;
	grid-template-columns: 92px 1fr;
	gap: 10px;
	padding: 15px 2px;
	border-bottom: 1px solid var(--border-soft);
	align-items: baseline;
}
.news__date { font-family: var(--f-en); font-size: 14px; color: var(--gold-700); letter-spacing: .04em; }
.news__text { font-size: 14.5px; line-height: 1.8; }
a.news__text { text-decoration: underline; text-decoration-color: var(--gold-300); text-underline-offset: 4px; }
a.news__text:hover { color: var(--gold-700); }

.news__cards { display: grid; gap: 14px; }
.news__col--blog .pcard__link { grid-template-columns: 128px 1fr; }

@media (max-width: 900px) {
	.news__inner { grid-template-columns: 1fr; gap: 44px; }
	.news__item { grid-template-columns: 1fr; gap: 2px; }
}

.pgrid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: clamp(18px, 2.2vw, 30px);
}
.pcard__link {
	display: grid;
	grid-template-columns: 1fr;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	overflow: hidden;
	height: 100%;
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.pcard__link:hover { transform: translateY(-3px); box-shadow: var(--sh-2); color: inherit; }
.pcard__media { aspect-ratio: 10 / 7; overflow: hidden; background: var(--bg-2); }
.pcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.pcard__link:hover .pcard__media img { transform: scale(1.05); }
.pcard__body { padding: 16px 18px 20px; }
.pcard__date { font-family: var(--f-en); font-size: 12.5px; color: var(--gold-700); margin-bottom: 6px; letter-spacing: .04em; }
.pcard__title { font-family: var(--f-serif); font-size: 16.5px; font-weight: 600; line-height: 1.7; margin-bottom: 8px; }
.pcard__excerpt { font-size: 13px; line-height: 1.85; color: var(--ink-60); }

.news__col--blog .pcard__media { aspect-ratio: 1 / 1; }
.news__col--blog .pcard__body { padding: 12px 16px; }
.news__col--blog .pcard__excerpt { display: none; }

@media (max-width: 560px) {
	.pgrid { grid-template-columns: 1fr; }
	.pcard__link { grid-template-columns: 118px 1fr; }
	.pcard__media { aspect-ratio: 1 / 1; }
	.pcard__body { padding: 12px 14px; }
	.pcard__title { font-size: 15px; }
	.pcard__excerpt { display: none; }
}

/* --------------------------------------------------------------------------
   9-10. FAQ
   -------------------------------------------------------------------------- */
.faq__list { display: grid; gap: 12px; }
.faq__item {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	overflow: hidden;
	transition: box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.faq__item[open] { border-color: var(--gold-300); box-shadow: var(--sh-1); }
.faq__q {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 18px 20px;
	cursor: pointer;
	list-style: none;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.7;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q-text { flex: 1 1 auto; }
.faq__mark {
	flex: none;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--gold-900);
	color: #fff;
	font-family: var(--f-en);
	font-size: 15px;
}
.faq__mark--a { background: var(--green-600); }
.faq__toggle { flex: none; color: var(--gold-700); transition: transform .3s var(--ease); margin-top: 4px; }
.faq__item[open] .faq__toggle { transform: rotate(45deg); }
.faq__a {
	display: flex;
	gap: 14px;
	padding: 0 20px 22px;
	border-top: 1px dashed var(--border);
	padding-top: 20px;
	margin-top: -2px;
}
.faq__a-body { font-size: 14.5px; line-height: 2.05; color: var(--ink-80); }
.faq__a-body p + p { margin-top: 14px; }
.faq__a-lead { font-weight: 700; color: var(--ink); margin-bottom: 10px !important; }

/* --------------------------------------------------------------------------
   10. CTA 帯 / フッター
   -------------------------------------------------------------------------- */
.ctaband { background: linear-gradient(135deg, var(--gold-900), #856c3d); color: #fff; }
.ctaband__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 22px;
	padding-block: clamp(28px, 3.6vw, 44px);
}
.ctaband__title { font-family: var(--f-serif); font-size: clamp(18px, 2.4vw, 25px); font-weight: 600; line-height: 1.6; }
.ctaband__note { font-size: 12.5px; opacity: .82; margin-top: 6px; }
.ctaband__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ctaband .btn--primary { background: #fff; color: var(--gold-900); box-shadow: none; }
.ctaband .btn--primary:hover { background: var(--gold-100); color: var(--gold-900); }
@media (max-width: 767px) {
	.ctaband__inner { flex-direction: column; align-items: stretch; text-align: center; }
	.ctaband__actions { flex-direction: column; }
}

.fcta {
	background:
		linear-gradient(180deg, rgba(251, 248, 243, .95), rgba(245, 239, 228, .98));
	padding-block: clamp(58px, 7.6vw, 100px);
	border-top: 1px solid var(--border);
}
.fcta__inner { text-align: center; }
.fcta__en { font-family: var(--f-en); font-size: 13px; letter-spacing: .36em; color: var(--gold-700); margin-bottom: 14px; }
.fcta__title { font-family: var(--f-serif); font-size: clamp(24px, 3.6vw, 40px); font-weight: 600; line-height: 1.55; margin-bottom: 20px; }
.fcta__lead { color: var(--ink-60); font-size: 15px; line-height: 2.1; margin-bottom: clamp(30px, 4vw, 46px); }

.fcta__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	max-width: 1000px;
	margin-inline: auto;
	text-align: left;
}
.fcta__card {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 20px 22px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	box-shadow: var(--sh-1);
	transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.fcta__card:hover { transform: translateY(-3px); box-shadow: var(--sh-2); color: inherit; }
.fcta__card-icon { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; }
.fcta__card-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fcta__card-body strong { font-size: 15.5px; font-weight: 700; }
.fcta__card-body small { font-size: 11.5px; color: var(--ink-60); line-height: 1.6; }
.fcta__card-arrow { flex: none; color: var(--gold-500); }
.fcta__card--line { border-color: rgba(6, 199, 85, .34); }
.fcta__card--line .fcta__card-icon { background: var(--line); color: #fff; }
.fcta__card--form .fcta__card-icon { background: var(--gold-100); color: var(--gold-700); }
.fcta__card--tel .fcta__card-icon { background: var(--bg-2); color: var(--ink-80); }
.fcta__card--tel .fcta__card-body strong { font-family: var(--f-en); font-size: 21px; letter-spacing: .02em; }

@media (max-width: 900px) { .fcta__cards { grid-template-columns: 1fr; max-width: 520px; } }

.ft { background: var(--ink); color: #ddd5c8; font-size: 14px; }
.ft__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(34px, 4vw, 70px);
	padding-block: clamp(46px, 5.4vw, 72px);
}
.ft__logo { display: flex; flex-direction: column; line-height: 1.3; margin-bottom: 18px; }
.ft__logo-sub { font-size: 10.5px; letter-spacing: .3em; color: var(--gold-400); }
.ft__logo-name { font-family: var(--f-en); font-size: 30px; color: #fff; }
.ft__desc { font-size: 13.5px; line-height: 1.95; opacity: .8; margin-bottom: 22px; }
.ft__info { display: grid; gap: 10px; font-size: 12.5px; }
.ft__info > div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; }
.ft__info dt { color: var(--gold-400); }
.ft__info dd { opacity: .82; }
.ft__sns { display: flex; gap: 12px; margin-top: 22px; }
.ft__sns a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 15px;
	border: 1px solid rgba(221, 213, 200, .28);
	border-radius: var(--r-full);
	font-size: 12px;
}
.ft__sns a:hover { background: rgba(255, 255, 255, .08); color: #fff; }

.ft__menu {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2px 24px;
	align-content: start;
}
.ft__menu a {
	display: block;
	padding: 9px 0;
	font-size: 13.5px;
	opacity: .82;
	border-bottom: 1px solid rgba(221, 213, 200, .12);
}
.ft__menu a:hover { opacity: 1; color: var(--gold-400); }

.ft__bottom { border-top: 1px solid rgba(221, 213, 200, .16); }
.ft__bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-block: 18px;
	font-size: 11.5px;
	opacity: .7;
}

@media (max-width: 767px) {
	.ft__inner { grid-template-columns: 1fr; gap: 34px; }
	.ft__menu { grid-template-columns: 1fr; }
	.ft__bottom-inner { justify-content: center; text-align: center; }
}

/* --------------------------------------------------------------------------
   11. 固定導線
   -------------------------------------------------------------------------- */
.fixbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 70;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	background: #fff;
	box-shadow: var(--sh-bar);
	padding-bottom: env(safe-area-inset-bottom);
	transform: translateY(110%);
	transition: transform .34s var(--ease);
}
.fixbar.is-shown { transform: none; }
.fixbar__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1px;
	min-height: var(--fixbar-h);
	padding: 5px 4px;
	color: var(--ink-80);
	position: relative;
}
.fixbar__item + .fixbar__item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 14%;
	bottom: 14%;
	width: 1px;
	background: var(--border);
}
.fixbar__item .jc-icon { width: 19px; height: 19px; }
.fixbar__label { font-size: 12px; font-weight: 700; letter-spacing: .02em; line-height: 1.35; }
.fixbar__sub { font-size: 9.5px; color: var(--ink-40); line-height: 1.3; }
.fixbar__item--line { background: var(--line); color: #fff; grid-column: span 2; }
.fixbar__item--line .fixbar__sub { color: rgba(255, 255, 255, .82); }
.fixbar__item--line + .fixbar__item::before { display: none; }
.fixbar__item--line:active { background: var(--line-dark); }
.fixbar__item--form { color: var(--gold-900); }
.fixbar__item--form .jc-icon { color: var(--gold-700); }

@media (min-width: 900px) { .fixbar { display: none; } }
body:not(.has-line) .fixbar { grid-auto-columns: 1fr; }

.nudge {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 65;
	width: 296px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	box-shadow: var(--sh-2);
	padding: 22px 22px 20px;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .34s var(--ease), transform .34s var(--ease);
}
.nudge[hidden] { display: none; }
.nudge.is-shown { opacity: 1; transform: none; }
.nudge__close {
	position: absolute;
	top: 8px;
	right: 8px;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	color: var(--ink-40);
}
.nudge__close:hover { background: var(--bg-1); color: var(--ink); }
.nudge__title { font-family: var(--f-serif); font-size: 18px; font-weight: 600; line-height: 1.6; margin-bottom: 8px; }
.nudge__text { font-size: 12.5px; line-height: 1.85; color: var(--ink-60); margin-bottom: 16px; }
.nudge__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--line);
	color: #fff;
	border-radius: var(--r-full);
	padding: 12px;
	font-weight: 700;
	font-size: 14px;
}
.nudge__btn:hover { background: var(--line-dark); color: #fff; }
@media (max-width: 899px) { .nudge { display: none; } }

.totop {
	position: fixed;
	right: 20px;
	bottom: calc(var(--fixbar-h) + 16px);
	z-index: 64;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .95);
	border: 1px solid var(--border);
	color: var(--gold-700);
	box-shadow: var(--sh-1);
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.totop[hidden] { display: none; }
.totop.is-shown { opacity: 1; transform: none; }
.totop .jc-icon { transform: rotate(180deg); }
@media (min-width: 900px) {
	.totop { bottom: 22px; right: 22px; }
	/* LINE 案内が出ている間だけ、その上に重ねる（横にずらすと本文に被るため）。 */
	body.nudge-open .totop { bottom: calc(var(--nudge-h, 210px) + 34px); }
}

/* --------------------------------------------------------------------------
   12. 下層ページ共通
   -------------------------------------------------------------------------- */
.crumbs { background: var(--bg-1); border-bottom: 1px solid var(--border-soft); }
.crumbs__list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 10px;
	padding-block: 11px;
	font-size: 12px;
	color: var(--ink-60);
}
.crumbs__item + .crumbs__item::before { content: "／"; margin-right: 10px; color: var(--gold-400); }
.crumbs__item a:hover { color: var(--gold-700); }

.phead {
	background: linear-gradient(160deg, var(--bg-1), var(--bg-2));
	border-bottom: 1px solid var(--border);
}
.phead__inner { padding-block: clamp(44px, 5.6vw, 82px); text-align: center; }
.phead__en { font-family: var(--f-en); font-size: 12.5px; letter-spacing: .36em; color: var(--gold-700); margin-bottom: 12px; }
.phead__title { font-family: var(--f-serif); font-size: clamp(25px, 3.8vw, 42px); font-weight: 600; line-height: 1.5; letter-spacing: .04em; }
.phead__lead { margin-top: 18px; color: var(--ink-60); font-size: 15px; line-height: 2.05; max-width: 42em; margin-inline: auto; }
.phead__badge {
	display: inline-block;
	margin-bottom: 14px;
	padding: 5px 18px;
	border-radius: var(--r-full);
	background: linear-gradient(135deg, var(--gold-500), var(--gold-700));
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
}

.filter { display: flex; flex-wrap: wrap; gap: 8px; padding-top: clamp(28px, 3.4vw, 44px); justify-content: center; }
.filter__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	border: 1px solid var(--border);
	border-radius: var(--r-full);
	background: #fff;
	font-size: 13.5px;
	font-weight: 500;
}
.filter__item small { font-size: 11px; color: var(--ink-40); }
.filter__item:hover { border-color: var(--gold-400); background: var(--gold-100); color: var(--ink); }
.filter__item.is-current { background: var(--gold-900); border-color: var(--gold-900); color: #fff; }
.filter__item.is-current small { color: rgba(255, 255, 255, .7); }

.pager { margin-top: clamp(36px, 4.4vw, 56px); }
.pager__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.pager__list a, .pager__list span {
	display: grid;
	place-items: center;
	min-width: 42px;
	height: 42px;
	padding-inline: 12px;
	border: 1px solid var(--border);
	border-radius: var(--r-s);
	background: #fff;
	font-size: 14px;
	font-family: var(--f-en);
}
.pager__list .current { background: var(--gold-900); border-color: var(--gold-900); color: #fff; }
.pager__list a:hover { border-color: var(--gold-400); background: var(--gold-100); }

/* --------------------------------------------------------------------------
   12-2. 本文（エディタ出力）
   -------------------------------------------------------------------------- */
.entry__head { margin-bottom: clamp(24px, 3vw, 36px); }
.entry__meta { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--ink-60); margin-bottom: 12px; }
.entry__meta time { font-family: var(--f-en); font-size: 14px; color: var(--gold-700); letter-spacing: .04em; }
.entry__cat { padding: 3px 12px; border-radius: var(--r-full); background: var(--gold-100); color: var(--gold-900); font-size: 11.5px; font-weight: 700; }
.entry__title { font-family: var(--f-serif); font-size: clamp(23px, 3.4vw, 36px); font-weight: 600; line-height: 1.6; letter-spacing: .03em; }
.entry__hero { margin-bottom: clamp(28px, 3.4vw, 44px); border-radius: var(--r-l); overflow: hidden; }
.entry__hero img { width: 100%; }

.entry { font-size: 16px; line-height: 2.15; color: var(--ink-80); }
.entry > * + * { margin-top: 1.6em; }
.entry h2 {
	font-family: var(--f-serif);
	font-size: clamp(21px, 2.8vw, 28px);
	font-weight: 600;
	line-height: 1.6;
	color: var(--ink);
	margin-top: 2.4em;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--border);
	position: relative;
}
.entry h2::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 62px; height: 2px; background: var(--gold-500); }
.entry h3 {
	font-family: var(--f-serif);
	font-size: clamp(18px, 2.2vw, 22px);
	font-weight: 600;
	line-height: 1.7;
	color: var(--ink);
	margin-top: 2em;
	padding-left: 16px;
	border-left: 3px solid var(--gold-400);
}
.entry h4 { font-size: 17px; font-weight: 700; color: var(--ink); margin-top: 1.8em; }
.entry p { margin: 0; }
.entry a { color: var(--gold-900); text-decoration: underline; text-decoration-color: var(--gold-300); text-underline-offset: 4px; }
.entry a:hover { color: var(--gold-700); }
.entry strong { font-weight: 700; color: var(--ink); }
.entry em { font-style: normal; background: linear-gradient(transparent 62%, var(--gold-100) 62%); }
.entry ul, .entry ol { padding-left: 1.4em; }
.entry ul { list-style: none; padding-left: 0; }
.entry ul li { position: relative; padding-left: 1.5em; }
.entry ul li::before {
	content: "";
	position: absolute;
	left: .35em;
	top: .82em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--gold-500);
}
.entry ol { list-style: decimal; }
.entry ol li::marker { color: var(--gold-700); font-family: var(--f-en); }
.entry li + li { margin-top: .6em; }
.entry img { border-radius: var(--r-m); }
/* 縦長・正方形の写真が本文幅いっぱいに伸びて主張しすぎないよう、高さで頭打ちにする */
.entry figure img,
.entry > img,
.entry p > img {
	width: auto;
	max-width: 100%;
	max-height: 520px;
	margin-inline: auto;
}
.entry figure { margin: 0; text-align: center; }
.entry figure > img { display: block; }
.entry figcaption { margin-top: 10px; font-size: 12.5px; color: var(--ink-60); text-align: center; }
.entry blockquote {
	padding: 22px 26px;
	background: var(--bg-1);
	border-left: 3px solid var(--gold-400);
	border-radius: 0 var(--r-m) var(--r-m) 0;
	font-size: 15px;
}
.entry blockquote > * + * { margin-top: 1em; }
.entry table { font-size: 14px; border: 1px solid var(--border); }
.entry th, .entry td { padding: 12px 16px; border: 1px solid var(--border); text-align: left; }
.entry th { background: var(--bg-1); font-weight: 700; color: var(--ink); white-space: nowrap; }
.entry hr { border: 0; border-top: 1px solid var(--border); margin-block: 2.4em; }
.entry .wp-block-image { margin-block: 2em; }
.entry .alignwide { width: 100%; }
.entry .aligncenter { margin-inline: auto; }

.entry__author {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	margin-top: clamp(40px, 5vw, 64px);
	padding: 24px;
	background: var(--bg-1);
	border: 1px solid var(--border);
	border-radius: var(--r-l);
}
.entry__author-media img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.entry__author-role { font-size: 11px; letter-spacing: .16em; color: var(--gold-700); }
.entry__author-name { font-family: var(--f-serif); font-size: 16.5px; font-weight: 600; margin: 4px 0 8px; }
.entry__author-text { font-size: 13px; line-height: 1.9; color: var(--ink-60); }

.entry__back { margin-top: 36px; text-align: center; }
.entry__back a { color: var(--gold-700); font-weight: 700; border-bottom: 1px solid var(--gold-300); padding-bottom: 3px; }

.postcta {
	background: linear-gradient(150deg, var(--gold-900), #7d6537);
	color: #fff;
	padding-block: clamp(46px, 6vw, 78px);
}
.postcta__inner { max-width: 760px; margin-inline: auto; padding-inline: var(--pad); text-align: center; }
.postcta__en { font-family: var(--f-en); font-size: 12.5px; letter-spacing: .34em; opacity: .78; margin-bottom: 12px; }
.postcta__title { font-family: var(--f-serif); font-size: clamp(21px, 2.9vw, 31px); font-weight: 600; line-height: 1.6; margin-bottom: 18px; }
.postcta__text { font-size: 14.5px; line-height: 2.05; opacity: .88; margin-bottom: 28px; }
.postcta__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.postcta .btn--primary { background: #fff; color: var(--gold-900); box-shadow: none; }
.postcta .btn--primary:hover { background: var(--gold-100); color: var(--gold-900); }
.postcta__note { margin-top: 18px; font-size: 12px; opacity: .74; }
@media (max-width: 600px) { .postcta__actions { flex-direction: column; } }

/* インタビュー詳細 */
.vhead { text-align: center; margin-bottom: clamp(26px, 3.4vw, 40px); }
.vhead__en { font-family: var(--f-en); font-size: 12.5px; letter-spacing: .34em; color: var(--gold-700); margin-bottom: 14px; }
.vhead__meta { display: flex; justify-content: center; gap: 8px; margin-bottom: 16px; font-size: 12px; }
.vhead__age { background: var(--gold-900); color: #fff; padding: 4px 14px; border-radius: var(--r-full); font-weight: 700; }
.vhead__period { background: var(--gold-100); color: var(--gold-900); padding: 4px 14px; border-radius: var(--r-full); }
.vhead__title { font-family: var(--f-serif); font-size: clamp(23px, 3.4vw, 36px); font-weight: 600; line-height: 1.6; }
.vhead__catch { margin-top: 16px; font-family: var(--f-serif); font-size: clamp(16px, 2vw, 20px); line-height: 1.9; color: var(--gold-900); }
.vhead__media { margin-bottom: clamp(28px, 3.4vw, 44px); border-radius: var(--r-l); overflow: hidden; }
.vhead__media figcaption { padding: 12px; background: var(--bg-1); font-size: 12.5px; color: var(--ink-60); text-align: center; }
.entry--interview { font-size: 16px; }
.vfoot {
	margin-top: clamp(36px, 4.4vw, 56px);
	padding: 26px;
	background: var(--green-100);
	border-radius: var(--r-l);
	text-align: center;
}
.vfoot__title { font-family: var(--f-serif); font-size: 17px; font-weight: 600; color: var(--green-700); margin-bottom: 10px; }
.vfoot__text { font-size: 14px; line-height: 2; color: var(--ink-80); }

/* プラン詳細 */
.ptarget, .pfee, .pfeature { margin-bottom: clamp(36px, 4.4vw, 56px); }
.ptarget__title, .pfee__title, .pfeature__title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.4vw, 25px);
	font-weight: 600;
	margin-bottom: 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--border);
	position: relative;
}
.ptarget__title::after, .pfee__title::after, .pfeature__title::after {
	content: ""; position: absolute; left: 0; bottom: -1px; width: 56px; height: 2px; background: var(--gold-500);
}
.ptarget__list, .pfeature__list { display: grid; gap: 10px; }
.pfeature__list { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.ptarget__list li, .pfeature__list li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.85; }
.ptarget__list .jc-icon, .pfeature__list .jc-icon { color: var(--green-600); margin-top: 5px; }

.pfee__table { border: 1px solid var(--border); border-radius: var(--r-m); overflow: hidden; }
.pfee__row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 22px; background: #fff; }
.pfee__row + .pfee__row { border-top: 1px solid var(--border-soft); }
.pfee__row dt { font-size: 14.5px; }
.pfee__row dd { font-family: var(--f-en); font-size: 21px; font-weight: 600; letter-spacing: .02em; }
.pfee__row.is-free dd { color: var(--green-700); }
.pfee__initial {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 16px;
	padding: 18px 22px;
	background: var(--gold-100);
	border-radius: var(--r-m);
}
.pfee__initial-label { font-size: 14px; font-weight: 700; }
.pfee__initial-value { font-family: var(--f-en); font-size: 25px; font-weight: 600; color: var(--gold-900); }
.pfee__note { margin-top: 12px; font-size: 12.5px; color: var(--ink-60); }

/* お知らせ一覧 */
.newslist { border-top: 1px solid var(--border); }
.newslist__item {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 12px;
	padding: 18px 4px;
	border-bottom: 1px solid var(--border);
	align-items: baseline;
}
.newslist__date { font-family: var(--f-en); font-size: 15px; color: var(--gold-700); letter-spacing: .04em; }
.newslist__title { font-size: 15px; line-height: 1.8; display: inline-flex; align-items: baseline; gap: 8px; }
a.newslist__title:hover { color: var(--gold-700); }
@media (max-width: 600px) { .newslist__item { grid-template-columns: 1fr; gap: 2px; } }

/* 404・検索 */
.sec--404 { text-align: center; }
.e404__num { font-family: var(--f-en); font-size: clamp(60px, 12vw, 110px); color: var(--gold-300); line-height: 1; }
.e404__title { font-family: var(--f-serif); font-size: clamp(21px, 3vw, 30px); font-weight: 600; line-height: 1.6; margin: 14px 0 18px; }
.e404__text { color: var(--ink-60); font-size: 15px; line-height: 2.05; margin-bottom: 30px; }
.e404__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 36px; }
.e404__links a {
	display: inline-block;
	padding: 9px 20px;
	border: 1px solid var(--border);
	border-radius: var(--r-full);
	background: #fff;
	font-size: 13.5px;
}
.e404__links a:hover { border-color: var(--gold-400); background: var(--gold-100); }

.searchbox { max-width: 480px; margin: 0 auto clamp(30px, 4vw, 46px); }
.sform__label { display: block; font-size: 12.5px; color: var(--ink-60); margin-bottom: 8px; }
.sform__row { display: flex; gap: 8px; }
.sform__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 50px;
	padding: 0 16px;
	border: 1px solid var(--border);
	border-radius: var(--r-s);
	background: #fff;
}
.sform__btn {
	flex: none;
	display: grid;
	place-items: center;
	width: 50px;
	height: 50px;
	border-radius: var(--r-s);
	background: var(--gold-900);
	color: #fff;
}
.searchlist { display: grid; gap: 12px; }
.searchlist__item a {
	display: block;
	padding: 20px 22px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
}
.searchlist__item a:hover { border-color: var(--gold-400); box-shadow: var(--sh-1); color: inherit; }
.searchlist__type { display: inline-block; font-size: 11px; padding: 2px 10px; border-radius: var(--r-full); background: var(--gold-100); color: var(--gold-900); margin-bottom: 8px; }
.searchlist__title { display: block; font-family: var(--f-serif); font-size: 17px; font-weight: 600; margin-bottom: 6px; }
.searchlist__excerpt { display: block; font-size: 13px; color: var(--ink-60); line-height: 1.85; }

/* --------------------------------------------------------------------------
   13. 無料相談フォーム
   -------------------------------------------------------------------------- */
.sec--contact { padding-block: clamp(44px, 5.4vw, 78px); }

.assure {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: clamp(28px, 3.4vw, 42px);
}
.assure__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	background: var(--bg-1);
	border: 1px solid var(--border);
	border-radius: var(--r-m);
}
.assure__icon {
	flex: none;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	color: var(--gold-700);
	border: 1px solid var(--border);
}
.assure__text { font-size: 12px; line-height: 1.65; color: var(--ink-60); }
.assure__text strong { display: block; font-size: 14px; color: var(--ink); font-weight: 700; }
@media (max-width: 767px) { .assure { grid-template-columns: 1fr; gap: 8px; } }

.altline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 18px;
	padding: clamp(22px, 2.8vw, 30px);
	background: linear-gradient(140deg, #f2fbf5, #e6f7ec);
	border: 1px solid rgba(6, 199, 85, .3);
	border-radius: var(--r-l);
	margin-bottom: clamp(30px, 3.6vw, 46px);
}
.altline__title { font-family: var(--f-serif); font-size: clamp(17px, 2.1vw, 21px); font-weight: 600; margin-bottom: 8px; }
.altline__text { font-size: 13.5px; line-height: 1.95; color: var(--ink-60); }
.altline .btn { flex: none; }
@media (max-width: 767px) { .altline .btn { width: 100%; } }

.formwrap { scroll-margin-top: 90px; }

.formerr {
	padding: 14px 18px;
	background: var(--danger-bg);
	border: 1px solid rgba(192, 72, 60, .3);
	border-radius: var(--r-m);
	color: var(--danger);
	font-size: 14px;
	font-weight: 700;
	margin-bottom: 24px;
}

.form { display: grid; gap: clamp(20px, 2.6vw, 28px); }
.form__pot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form__field { display: block; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 600px) { .form__row { grid-template-columns: 1fr; } }

.form__label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14.5px;
	font-weight: 700;
	margin-bottom: 10px;
}
.form__req {
	font-size: 10.5px;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 3px;
	background: var(--danger);
	color: #fff;
	letter-spacing: .04em;
}
.form__opt {
	font-size: 10.5px;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 3px;
	background: var(--bg-2);
	color: var(--ink-60);
}
.form__hint { margin-top: 8px; font-size: 12px; color: var(--ink-60); line-height: 1.7; }
.form__hint--top { margin-top: -4px; margin-bottom: 10px; }
.form__error { margin-top: 8px; font-size: 12.5px; color: var(--danger); font-weight: 700; }

.form__input, .form__textarea, .form__select {
	width: 100%;
	background: #fff;
	border: 1.5px solid var(--border);
	border-radius: var(--r-m);
	padding: 14px 16px;
	font-size: 16px;
	line-height: 1.6;
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
	-webkit-appearance: none;
	appearance: none;
}
.form__input:focus, .form__textarea:focus, .form__select:focus {
	outline: none;
	border-color: var(--gold-500);
	box-shadow: 0 0 0 3px rgba(191, 165, 121, .18);
}
.form__input::placeholder, .form__textarea::placeholder { color: #bdb4a6; }
.form__textarea { resize: vertical; min-height: 130px; }
.form__select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23957a49' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	padding-right: 42px;
}
.has-error .form__input, .has-error .form__textarea, .has-error .form__select { border-color: var(--danger); background: var(--danger-bg); }

/* タップで選ぶチップ */
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip { position: relative; display: inline-flex; }
.chip input {
	position: absolute;
	inset: 0;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
}
.chip span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 11px 20px;
	background: #fff;
	border: 1.5px solid var(--border);
	border-radius: var(--r-full);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	transition: background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);
}
.chip span::before {
	content: "";
	width: 0;
	height: 12px;
	margin-right: 0;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m4.5 12.5 5 5 10-11' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	transition: width .18s var(--ease), margin .18s var(--ease);
}
.chip input:checked + span {
	background: var(--gold-900);
	border-color: var(--gold-900);
	color: #fff;
	box-shadow: 0 4px 12px rgba(111, 90, 49, .24);
}
.chip input:checked + span::before { width: 14px; margin-right: 8px; }
.chip input:focus-visible + span { outline: 2px solid var(--gold-700); outline-offset: 3px; }
.chip:hover span { border-color: var(--gold-400); }
.has-error .chip span { border-color: rgba(192, 72, 60, .4); }

.form__more {
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	background: var(--bg-1);
	overflow: hidden;
}
.form__more-summary {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 20px;
	cursor: pointer;
	list-style: none;
	font-size: 14.5px;
	font-weight: 700;
}
.form__more-summary::-webkit-details-marker { display: none; }
.form__more-summary::after {
	content: "";
	margin-left: auto;
	width: 9px;
	height: 9px;
	border-right: 1.6px solid var(--gold-700);
	border-bottom: 1.6px solid var(--gold-700);
	transform: rotate(45deg) translateY(-2px);
	transition: transform .28s var(--ease);
}
.form__more[open] .form__more-summary::after { transform: rotate(-135deg) translateY(-2px); }
.form__more-body { padding: 4px 20px 24px; display: grid; gap: 22px; }

.form__field--agree { padding: 18px 20px; background: var(--bg-1); border: 1px solid var(--border); border-radius: var(--r-m); }
.agree { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font-size: 14px; line-height: 1.7; }
.agree input {
	flex: none;
	width: 22px;
	height: 22px;
	margin-top: 2px;
	accent-color: var(--gold-700);
}
.agree a { color: var(--gold-900); text-decoration: underline; text-underline-offset: 3px; }

.form__submit { text-align: center; }
.form__submit-note {
	margin-top: 16px;
	display: inline-flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 12.5px;
	line-height: 1.8;
	color: var(--ink-60);
	text-align: left;
}
.form__submit-note .jc-icon { color: var(--green-600); margin-top: 4px; }

.thanks { text-align: center; padding: clamp(30px, 4vw, 50px) clamp(20px, 3vw, 40px); background: var(--bg-1); border: 1px solid var(--border); border-radius: var(--r-l); }
.thanks__icon {
	display: inline-grid;
	place-items: center;
	width: 74px;
	height: 74px;
	border-radius: 50%;
	background: var(--green-100);
	color: var(--green-700);
	margin-bottom: 20px;
}
.thanks__title { font-family: var(--f-serif); font-size: clamp(21px, 2.8vw, 28px); font-weight: 600; margin-bottom: 16px; }
.thanks__text { font-size: 15px; line-height: 2.05; color: var(--ink-80); margin-bottom: 26px; }
.thanks__note { padding: 20px; background: #fff; border: 1px dashed var(--gold-300); border-radius: var(--r-m); font-size: 13.5px; line-height: 1.95; color: var(--ink-60); text-align: left; margin-bottom: 26px; }
.thanks__note-title { font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.thanks__back { margin-top: 22px; font-size: 13.5px; }
.thanks__back a { color: var(--gold-700); border-bottom: 1px solid var(--gold-300); padding-bottom: 2px; }

.afterflow {
	margin-top: clamp(38px, 4.6vw, 60px);
	padding: clamp(24px, 3vw, 36px);
	background: var(--bg-1);
	border: 1px solid var(--border);
	border-radius: var(--r-l);
}
.afterflow__title { font-family: var(--f-serif); font-size: 19px; font-weight: 600; margin-bottom: 20px; text-align: center; }
.afterflow__list { display: grid; gap: 16px; }
.afterflow__list li { display: flex; gap: 14px; align-items: flex-start; }
.afterflow__num {
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--gold-900);
	color: #fff;
	font-family: var(--f-en);
	font-size: 15px;
}
.afterflow__list div { font-size: 13.5px; line-height: 1.9; color: var(--ink-60); }
.afterflow__list strong { display: block; font-size: 14.5px; color: var(--ink); }

.contact-tel { margin-top: clamp(28px, 3.4vw, 40px); text-align: center; }
.contact-tel__label { font-size: 13px; color: var(--ink-60); margin-bottom: 8px; }
.contact-tel__num {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--f-en);
	font-size: clamp(26px, 4vw, 34px);
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--gold-900);
}
.contact-tel__note { margin-top: 8px; font-size: 12px; color: var(--ink-60); }

/* --------------------------------------------------------------------------
   14. モーション・印刷
   -------------------------------------------------------------------------- */
[data-reveal] {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity .7s var(--ease), transform .7s var(--ease);
}
[data-reveal].is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	[data-reveal] { opacity: 1; transform: none; }
}

@media print {
	.hd__util, .hd__actions, .hd__toggle, .fixbar, .nudge, .totop, .ctaband, .fcta, .drawer { display: none !important; }
	body { padding-bottom: 0; }
	.sec { padding-block: 20px; }
	a { text-decoration: none; color: #000; }
}

/* --------------------------------------------------------------------------
   15. Q&A ページ・プレゼントページ
   -------------------------------------------------------------------------- */
.faqnav {
	padding: clamp(22px, 2.8vw, 30px);
	background: var(--bg-1);
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	margin-bottom: clamp(28px, 3.4vw, 42px);
}
.faqnav__title { font-size: 13px; font-weight: 700; color: var(--gold-900); margin-bottom: 14px; }
.faqnav__list { display: grid; gap: 8px; }
.faqnav__list a {
	display: flex;
	gap: 10px;
	font-size: 14px;
	line-height: 1.7;
	color: var(--ink-80);
}
.faqnav__list a::before { content: "―"; color: var(--gold-400); flex: none; }
.faqnav__list a:hover { color: var(--gold-700); }

.faq__list--page .faq__item[open] { border-color: var(--gold-300); }

.faqmore {
	margin-top: clamp(40px, 5vw, 64px);
	padding: clamp(28px, 3.6vw, 44px);
	background: linear-gradient(150deg, #fff, var(--gold-100));
	border: 1px solid var(--gold-300);
	border-radius: var(--r-l);
	text-align: center;
}
.faqmore__title { font-family: var(--f-serif); font-size: clamp(19px, 2.4vw, 24px); font-weight: 600; margin-bottom: 14px; }
.faqmore__text { font-size: 14.5px; line-height: 2.05; color: var(--ink-60); margin-bottom: 24px; }
.faqmore__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
@media (max-width: 600px) { .faqmore__actions { flex-direction: column; } }

.giftlead {
	padding: clamp(22px, 2.8vw, 30px);
	background: var(--bg-1);
	border-radius: var(--r-l);
	font-size: 15px;
	line-height: 2.05;
	color: var(--ink-80);
	margin-bottom: clamp(30px, 3.6vw, 46px);
}
.giftlist { display: grid; gap: 16px; }
.giftlist__item {
	display: flex;
	gap: 18px;
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-m);
}
.giftlist__no {
	flex: none;
	font-family: var(--f-en);
	font-size: 26px;
	color: var(--gold-400);
	line-height: 1.2;
	min-width: 44px;
}
.giftlist__title { font-family: var(--f-serif); font-size: clamp(16px, 2vw, 19px); font-weight: 600; line-height: 1.65; margin-bottom: 8px; }
.giftlist__text { font-size: 13.5px; line-height: 1.95; color: var(--ink-60); }

.giftcta {
	margin-top: clamp(38px, 4.6vw, 60px);
	padding: clamp(30px, 4vw, 50px);
	background: linear-gradient(150deg, #f2fbf5, #e4f6ea);
	border: 1px solid rgba(6, 199, 85, .28);
	border-radius: var(--r-l);
	text-align: center;
}
.giftcta__label { font-family: var(--f-en); font-size: 12px; letter-spacing: .3em; color: var(--green-700); margin-bottom: 12px; }
.giftcta__title { font-family: var(--f-serif); font-size: clamp(20px, 2.8vw, 28px); font-weight: 600; line-height: 1.6; margin-bottom: 16px; }
.giftcta__text { font-size: 14px; line-height: 2; color: var(--ink-60); margin-bottom: 26px; }

/* 見出し風の定義行（表から変換した箇所） */
.entry .jc-kv {
	display: flex;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--border-soft);
	margin: 0 !important;
}
.entry .jc-kv strong { flex: none; min-width: 8em; color: var(--ink); }

/* ==========================================================================
   16. スマートフォンの縦幅を詰める調整
   （現行サイトはスマホで約20画面ありました。ここを短くするための指定です）
   ========================================================================== */
@media (max-width: 767px) {
	:root { --sec-y: 52px; }

	.sec-head { margin-bottom: 26px; }
	.sec-head__ja { line-height: 1.5; }
	.sec-head__lead { margin-top: 14px; font-size: 13.5px; line-height: 1.9; }
	.sec__more { margin-top: 26px; }

	/* お悩み */
	.worry__list { gap: 8px; }
	.worry__item { padding: 13px 16px; font-size: 13.5px; line-height: 1.7; gap: 10px; }
	.worry__check { width: 22px; height: 22px; }
	.worry__answer { margin-top: 26px; padding: 22px 20px; }
	.worry__answer-title { font-size: 17px; margin-bottom: 10px; }
	.worry__answer-text { font-size: 13.5px; line-height: 1.9; }
	.worry__answer-link { margin-top: 14px; font-size: 13.5px; }

	/* 選ばれる理由 */
	.reason__grid { gap: 12px; }
	.rcard__body { padding: 14px 15px; }
	.rcard__text { font-size: 12.5px; line-height: 1.8; }

	/* プランは横スワイプに切り替える。
	   overflow-x を指定すると overflow-y も auto になるため、カードの上に
	   13px はみ出している .plancard__badge が切れる。上の余白でその分を確保する。 */
	.plan__grid {
		display: flex;
		gap: 12px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		margin-inline: calc(var(--pad) * -1);
		padding: 24px var(--pad) 16px;
	}
	.plan__grid::-webkit-scrollbar { display: none; }
	.plan__grid > .plancard {
		flex: 0 0 auto;
		width: 82vw;
		max-width: 330px;
		scroll-snap-align: center;
		padding: 22px 18px 20px;
	}
	.plan__grid::after {
		content: "";
		flex: 0 0 1px;
	}
	.plan__swipehint {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 7px;
		margin-top: -6px;
		margin-bottom: 0; /* 余白は .plan__grid の padding-top が受け持つ */
		font-size: 11.5px;
		color: var(--ink-40);
	}
	.plancard__targets { margin-top: 14px; gap: 6px; }
	.plancard__targets li { font-size: 12.5px; }
	.plancard__fees { margin-top: 16px; }
	.plancard__fees > div { padding: 8px 14px; font-size: 12.5px; }
	.plancard__fees dd { font-size: 15px; }
	.plancard__fees dd.is-strong { font-size: 17px; }
	.plancard__btn { margin-top: 18px; min-height: 46px; font-size: 13.5px; }
	.plan__note { margin-top: 18px; font-size: 12.5px; }

	/* メッセージ */
	.message__inner { gap: 34px; }
	.message__media { max-width: 260px; }
	.message__img { border-radius: var(--r-m); }
	/* 写真の幅（260px）のままだと資格名が 1 文字だけ 2 行目に落ちるので、
	   名札だけ左右に少し広げる。 */
	.message__sign { position: static; margin: 12px -16px 0; padding: 12px 14px; box-shadow: none; }
	.message__sign-name { font-size: 17px; margin: 2px 0 4px; }
	.message__title { font-size: 20px; margin-bottom: 16px; }
	.message__text { gap: 12px; font-size: 13.5px; line-height: 1.95; margin-bottom: 20px; }
	.message__strong { font-size: 15px; }

	/* 流れ */
	.flow__body { padding-bottom: 22px; padding-top: 2px; }
	.flow__title { font-size: 16px; margin-bottom: 6px; }
	.flow__step { font-size: 10.5px; margin-bottom: 3px; }
	.flow__text { font-size: 12.5px; line-height: 1.85; }

	/* プレゼント */
	.gift__inner { gap: 22px; }
	.gift__media { max-width: 210px; }
	.gift__title { font-size: 22px; margin-bottom: 12px; }
	.gift__text { font-size: 13.5px; line-height: 1.9; margin-bottom: 16px; }
	.gift__points { gap: 6px; margin-bottom: 20px; }
	.gift__points li { font-size: 13px; line-height: 1.6; }
	.gift__note { font-size: 11.5px; line-height: 1.75; }

	/* Instagram：スマホでは 4 枚まで */
	.insta__grid { gap: 8px; }
	.insta__item:nth-child(n + 5) { display: none; }

	.entry figure img,
	.entry > img,
	.entry p > img { max-height: 380px; }

	/* お知らせ・ブログ */
	.news__inner { gap: 30px; }
	.news__head { padding-bottom: 10px; }
	.news__item { padding: 11px 2px; }
	.news__date { font-size: 12.5px; }
	.news__text { font-size: 13.5px; line-height: 1.7; }
	.news__item:nth-child(n + 5) { display: none; }
	.news__cards { gap: 10px; }
	.news__col--blog .pcard:nth-child(n + 3) { display: none; }

	/* FAQ */
	.faq__list { gap: 8px; }
	.faq__q { padding: 14px 15px; font-size: 13.5px; gap: 10px; }
	.faq__mark { width: 24px; height: 24px; font-size: 13px; }
	.faq__a { padding: 15px 15px 18px; gap: 10px; }
	.faq__a-body { font-size: 13.5px; line-height: 1.9; }
	.sec--faq .faq__item:nth-child(n + 5) { display: none; }

	/* 下部 CTA */
	.fcta { padding-block: 46px; }
	.fcta__title { font-size: 22px; margin-bottom: 14px; }
	.fcta__lead { font-size: 13.5px; line-height: 1.9; margin-bottom: 24px; }
	.fcta__card { padding: 15px 16px; gap: 12px; }
	.fcta__card-icon { width: 44px; height: 44px; }
	.fcta__card-body strong { font-size: 14.5px; }
	.fcta__card-body small { font-size: 11px; }

	/* フッター */
	.ft__inner { padding-block: 34px; gap: 26px; }
	.ft__desc { font-size: 12.5px; line-height: 1.8; margin-bottom: 16px; }
	.ft__info { gap: 6px; font-size: 11.5px; }
	.ft__info > div { grid-template-columns: 84px 1fr; }
	.ft__sns { margin-top: 16px; }
	.ft__menu { grid-template-columns: repeat(2, 1fr); gap: 0 16px; }
	.ft__menu a { padding: 8px 0; font-size: 12.5px; }
	.ft__logo-name { font-size: 25px; }

	/* ヒーロー（余白・表示の切り替えは上の「スマホのファーストビュー」に集約。
	   ここは文字サイズだけ） */
	.hero__text { font-size: 13.5px; line-height: 1.95; }
	.hero__lead { font-size: 11.5px; }
}

@media (max-width: 767px) {
	:root { --sec-y: 46px; }
	.sec-head { margin-bottom: 22px; }
	.hero__proof-inner { padding-block: 2px; }
	.flow__body { padding-bottom: 18px; }
	.worry__answer { padding: 20px 18px; }
	.message__media { max-width: 236px; }
	.gift__media { max-width: 190px; }
	.rcard__title { font-size: 16px; }
	.plancard__head { padding-bottom: 16px; }
	.plancard__tagline { margin-top: 8px; font-size: 12px; }
	.ft__inner { padding-block: 30px; }
}

/* 欧文フォントの数字を通常の高さに揃える（Cormorant は既定がオールドスタイル数字） */
.hd__tel-num,
.plancard__fees dd,
.pfee__row dd,
.pfee__initial-value,
.news__date,
.newslist__date,
.pcard__date,
.entry__meta time,
.drawer__tel strong,
.fcta__card--tel .fcta__card-body strong,
.contact-tel__num,
.e404__num,
.flow__dot,
.afterflow__num,
.faq__mark,
.giftlist__no,
.rcard__no,
.plancard__en,
.pager__list a,
.pager__list span,
.sec-head__en,
.hero__lead,
.vhead__en,
.message__en,
.gift__en,
.fcta__en,
.postcta__en,
.phead__en,
.giftcta__label,
.flow__step,
.drawer__title,
.ft__logo-name,
.hd__logo-name {
	font-variant-numeric: lining-nums;
	font-feature-settings: "lnum" 1;
}

/* --------------------------------------------------------------------------
   17. カウンセラー紹介のプロフィール欄
   -------------------------------------------------------------------------- */
.entry .profile {
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: clamp(24px, 3.4vw, 48px);
	align-items: start;
	margin-bottom: clamp(36px, 4.4vw, 60px);
	padding-bottom: clamp(32px, 4vw, 52px);
	border-bottom: 1px solid var(--border);
}

.entry .profile__media { position: sticky; top: 130px; }
.entry .profile__media figure { margin: 0; }
.entry .profile__media figure img {
	width: 100%;
	max-width: none;
	max-height: none;
	border-radius: var(--r-l);
	box-shadow: var(--sh-1);
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center 18%;
}
.entry .profile__badge { margin-top: 14px; }
.entry .profile__badge figure { margin: 0; width: 116px; }
.entry .profile__badge figure img {
	width: 116px;
	height: 116px;
	max-height: none;
	border-radius: var(--r-m);
	border: 1px solid var(--border);
	object-fit: cover;
	aspect-ratio: 1 / 1;
	box-shadow: none;
}

.entry .profile__label {
	font-family: var(--f-en);
	font-size: 12px;
	letter-spacing: .3em;
	color: var(--gold-700);
	margin: 0 0 8px;
}
.entry .profile__name {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 14px;
	font-family: var(--f-serif);
	font-size: clamp(26px, 3.4vw, 34px);
	font-weight: 600;
	line-height: 1.4;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}
.entry .profile__name::after { display: none; }
.entry .profile__name span {
	font-family: var(--f-sans);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .1em;
	color: var(--ink-40);
}
.entry .profile__lead {
	margin: 0 0 10px;
	font-size: 15px;
	line-height: 1.95;
}
.entry .profile__note {
	margin: 0;
	font-size: 12.5px;
	color: var(--ink-40);
}

.entry .profile__spec { margin-top: 26px; display: grid; gap: 22px; }
.entry .profile__group { margin: 0; }
.entry .profile__group h3 {
	margin: 0 0 10px;
	padding: 0 0 0 12px;
	font-family: var(--f-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	color: var(--gold-900);
	border-left: 2px solid var(--gold-400);
	line-height: 1.4;
}
.entry .profile__group ul { margin: 0; display: grid; gap: 5px; }
.entry .profile__group li {
	margin: 0;
	padding-left: 1.3em;
	font-size: 13.5px;
	line-height: 1.85;
	color: var(--ink-80);
}
.entry .profile__group li::before { top: .78em; width: 5px; height: 5px; }

@media (max-width: 767px) {
	.entry .profile { grid-template-columns: 1fr; gap: 22px; }
	.entry .profile__media { position: static; max-width: 240px; margin-inline: auto; }
	.entry .profile__badge { display: flex; justify-content: center; }
	.entry .profile__name { font-size: 24px; }
	.entry .profile__spec { margin-top: 20px; gap: 18px; }
}

/* ==========================================================================
   14. 2026/09 の修正でふえた部分
   石井様からいただいたご指摘（9/10 の①〜⑪ ほか）に対応した分をまとめている。
   既存の指定を書き換えず、ここで足しているのは、
   もとに戻したくなったときにこのかたまりだけを見ればよいようにするため。
   ========================================================================== */

/* --------------------------------------------------------------------------
   14-1. ファーストビューの写真の入れ替え（⑦）
   横に流すのではなく、その場で溶けるように切り替える。
   上に乗っている文字は動かないので、読んでいる途中で流れていかない。
   -------------------------------------------------------------------------- */
.hero__slide {
	position: absolute;
	inset: 0;
}
.hero__slide picture,
.hero__slide img { width: 100%; height: 100%; }

.hero--slider .hero__slide {
	opacity: 0;
	transition: opacity 1.6s var(--ease);
}
.hero--slider .hero__slide.is-active { opacity: 1; }

/* 写真が切り替わる動きを好まない設定の方には、1 枚目だけを出す。 */
@media (prefers-reduced-motion: reduce) {
	.hero--slider .hero__slide { transition: none; }
}

/* --------------------------------------------------------------------------
   14-2. ファーストビューのボタン（①）
   写真の上に置くので、線だけのボタンは背景を白く敷いて読めるようにする。
   -------------------------------------------------------------------------- */
.hero__actions .btn--ghost {
	background: rgba(255, 255, 255, .9);
	border-color: var(--gold-400);
	color: var(--gold-900);
	backdrop-filter: blur(6px);
}
.hero__actions .btn--ghost:hover { background: #fff; border-color: var(--gold-500); }

/* --------------------------------------------------------------------------
   14-3. スマホのファーストビュー（石井様のご指摘・9/05）
   文字を写真に重ねるのをやめる。重ねると、どう調整しても
   文章の下の行が新郎新婦のお顔に掛かってしまうため。
   写真は写真として上に置き、文章はその下の白い面に置く。
   あわせて、写真に取られていた高さが空くので、文字を大きくしている。
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.hero {
		display: flex;
		flex-direction: column;
		background: var(--bg-1);
	}

	/* 背景として敷いていたものを、ふつうの写真に戻す。 */
	.hero__media {
		position: relative;
		inset: auto;
		z-index: 0;
		width: 100%;
		aspect-ratio: 1 / 1;
		max-height: 58vh;
	}
	/* スマホ用の写真は、もともと上に文字を重ねる前提で上半分を明るくしてある。
	   重ねるのをやめたので、その明るい帯は見せず、お二人が真ん中に来る位置で切る。 */
	.hero__img { object-position: center 88%; }

	/* 写真の下だけ、白へゆるやかにつないで文章の面と地続きに見せる。 */
	.hero__veil {
		background: linear-gradient(180deg,
			rgba(255, 255, 255, 0) 62%,
			rgba(255, 255, 255, .55) 84%,
			var(--bg-1) 100%);
	}

	.hero__inner {
		align-items: stretch;
		padding-top: clamp(20px, 6vw, 30px);
		padding-bottom: clamp(24px, 7vw, 34px);
	}

	/* 重ねなくなったぶん、読みやすい大きさに戻す。 */
	.hero__lead { font-size: 12px; margin-bottom: 12px; }
	.hero__title { font-size: clamp(27px, 7.6vw, 34px); line-height: 1.45; margin-bottom: 16px; }
	.hero__text { font-size: 15px; line-height: 1.95; }
	.hero__texts { margin-bottom: 22px; }

	/* 「料金プランを見る」を 1 画面目で押せるようにする（①）。
	   相談・LINE・電話は画面下の固定バーが常時受け持っている。 */
	.hero__actions { display: flex; gap: 10px; }
	.hero__note { display: inline-flex; margin-top: 12px; }

	/* 写真をよけるための余白は、もう要らない。 */
	.hero__counselor {
		margin-top: 20px;
		align-self: stretch;
		border-radius: var(--r-m);
		padding: 9px 14px 9px 9px;
		gap: 11px;
		background: #fff;
	}
}

/* --------------------------------------------------------------------------
   14-4. IBJ AWARD 受賞歴の帯（②）
   ファーストビューのすぐ下。エンブレム画像が無い枠は、期の名前だけの札にする。
   帯の地はエンブレムと同じこげ茶にして、金の縁取りが沈まず映えるようにしている
   （2026/09/22 のご要望）。
   -------------------------------------------------------------------------- */
.award {
	--award-bg: #34180d;
	--award-bg-hi: #4d2b17;
	--award-gold: #e2c68f;
	--award-cream: #f6ead3;
	position: relative;
	background:
		radial-gradient(ellipse 70% 90% at 50% 40%, var(--award-bg-hi) 0%, var(--award-bg) 72%),
		var(--award-bg);
	color: var(--award-cream);
	padding-block: clamp(44px, 5.6vw, 76px);
	border-block: 1px solid #8a6a3a;
}
/* 内側に細い金の罫。エンブレムの額縁と揃える。 */
.award::before {
	content: "";
	position: absolute;
	inset: 8px 0;
	border-block: 1px solid rgba(226, 198, 143, .28);
	pointer-events: none;
}
.award__inner { position: relative; display: grid; gap: clamp(26px, 3.2vw, 40px); }
.award__head { text-align: center; }
.award__en {
	font-family: var(--f-en);
	font-size: clamp(17px, 1.8vw, 22px);
	font-weight: 600;
	letter-spacing: .22em;
	color: var(--award-gold);
	margin-bottom: 6px;
}
.award__title {
	font-family: var(--f-serif);
	font-weight: 600;
	font-size: clamp(32px, 4.6vw, 52px);
	line-height: 1.4;
	letter-spacing: .08em;
	color: #fff;
	text-shadow: 0 2px 14px rgba(0, 0, 0, .35);
}
.award__lead {
	margin: 14px auto 0;
	max-width: 44em;
	font-size: 15px;
	line-height: 1.95;
	color: rgba(246, 234, 211, .86);
}

.award__list {
	display: grid;
	grid-template-columns: repeat(var(--award-count, 6), minmax(0, 1fr));
	gap: clamp(12px, 1.6vw, 22px);
	align-items: end;
}
.award__item { display: grid; justify-items: center; gap: 10px; }

.award__emblem {
	display: grid;
	place-items: center;
	width: 100%;
}
/* いただいたエンブレムは正方形のバナーなので、枠いっぱいの正方形で揃える。
   縦横比の違う画像が入っても、切らずに枠の中へ収める。 */
.award__emblem img {
	width: 100%;
	max-width: 210px;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	border-radius: 4px;
	filter: drop-shadow(0 6px 16px rgba(0, 0, 0, .5));
}
.award__term {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--award-gold);
	text-align: center;
}

/* エンブレム画像を入れていない枠。画像が届くまでのあいだも形になるようにしている。 */
.award__badge {
	display: grid;
	justify-items: center;
	gap: 6px;
	width: 100%;
	padding: 18px 8px 16px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(226, 198, 143, .55);
	border-radius: var(--r-m);
}
.award__badge-icon { color: var(--award-gold); display: inline-flex; }
.award__badge-term {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--award-cream);
	text-align: center;
	line-height: 1.4;
}

.award__note {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 20px;
	font-size: 12.5px;
	color: rgba(246, 234, 211, .6);
}
.award__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	border: 1px solid rgba(226, 198, 143, .6);
	border-radius: var(--r-full);
	color: var(--award-gold);
	font-size: 14px;
	font-weight: 700;
}
.award__link:hover { color: var(--award-bg); background: var(--award-gold); }

@media (max-width: 900px) {
	.award__list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 22px; }
}
@media (max-width: 480px) {
	.award { padding-block: 38px 40px; }
	.award__title { font-size: 32px; }
	.award__lead { font-size: 14px; line-height: 1.85; }
	.award__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
	.award__term { font-size: 13.5px; }
}

/* --------------------------------------------------------------------------
   14-5. 強みのアイコンに色を足す（⑥）
   -------------------------------------------------------------------------- */
.strength__item--accent .strength__icon {
	background: var(--green-100);
	color: var(--green-700);
}

/* --------------------------------------------------------------------------
   14-6. スマホで最初に見せるプラン（⑯）
   パソコンの並びは変えず、横スワイプのときだけ順番を入れ替える。
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.plan__grid > .plancard--spfirst { order: -1; }
}

/* --------------------------------------------------------------------------
   14-7. 記事上部の写真（⑨）
   どの写真を入れても、同じ形・同じ角丸で収まるようにする。
   端に白い帯が入っている写真でも、角が四角く見えないように背景を敷いている。
   -------------------------------------------------------------------------- */
.entry__hero {
	background: var(--bg-2);
	line-height: 0;
}
.entry__hero img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
/* フライヤーは全体が見えることが大事なので、切り抜かずに収める。 */
.entry__hero--flyer { background: var(--bg-1); padding: clamp(10px, 1.6vw, 18px); }
.entry__hero--flyer img {
	aspect-ratio: auto;
	object-fit: contain;
	max-height: 78vh;
	margin-inline: auto;
	width: auto;
	max-width: 100%;
	border-radius: var(--r-m);
}

/* --------------------------------------------------------------------------
   14-8. 婚活パーティー・イベント
   -------------------------------------------------------------------------- */
.eventlist {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(16px, 2vw, 26px);
}
.eventlist--single { grid-template-columns: minmax(0, 720px); justify-content: center; }
@media (max-width: 900px) { .eventlist { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .eventlist { grid-template-columns: 1fr; gap: 14px; } }

.eventcard {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-l);
	overflow: hidden;
	box-shadow: var(--sh-1);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.eventcard:hover { transform: translateY(-4px); box-shadow: var(--sh-2); }
.eventcard__link { display: flex; flex-direction: column; height: 100%; color: inherit; }
.eventcard__link:hover { color: inherit; }

.eventcard__flyer { background: var(--bg-2); }
.eventcard__flyer img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.eventcard__body { display: flex; flex-direction: column; gap: 10px; padding: clamp(16px, 1.8vw, 22px); flex: 1; }
.eventcard__date {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--gold-700);
}
.eventcard__closed {
	align-self: flex-start;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	padding: 3px 12px;
	border-radius: var(--r-full);
	background: var(--bg-3);
	color: var(--ink-60);
}
.eventcard__title {
	font-family: var(--f-serif);
	font-size: clamp(16px, 1.9vw, 19px);
	font-weight: 600;
	line-height: 1.6;
}
.eventcard__meta { display: grid; gap: 4px; font-size: 12.5px; color: var(--ink-60); }
.eventcard__meta > div { display: flex; gap: 10px; }
.eventcard__meta dt { flex: none; width: 3.6em; color: var(--ink-40); }
.eventcard__meta dd { margin: 0; }
.eventcard__more {
	margin-top: auto;
	padding-top: 6px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--gold-700);
}
.eventcard.is-closed { opacity: .72; }
.eventcard--noflyer .eventcard__body { padding-top: clamp(20px, 2.2vw, 26px); }

.eventpage__title,
.eventpast__title {
	font-family: var(--f-serif);
	font-size: clamp(19px, 2.4vw, 24px);
	font-weight: 600;
	margin-bottom: clamp(16px, 2vw, 22px);
}
.eventpage__body { margin-top: clamp(40px, 5vw, 64px); }
.eventpast { margin-top: clamp(44px, 5.4vw, 70px); }
.eventlist--past { opacity: .95; }

.eventsingle__table {
	display: grid;
	gap: 1px;
	background: var(--border-soft);
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	overflow: hidden;
	margin-bottom: clamp(24px, 3vw, 36px);
}
.eventsingle__table > div { display: grid; grid-template-columns: 8em 1fr; background: #fff; }
.eventsingle__table dt { padding: 12px 16px; background: var(--bg-1); font-size: 13px; font-weight: 700; }
.eventsingle__table dd { margin: 0; padding: 12px 16px; font-size: 14px; }
@media (max-width: 480px) {
	.eventsingle__table > div { grid-template-columns: 6.4em 1fr; }
	.eventsingle__table dt, .eventsingle__table dd { padding: 10px 12px; font-size: 13px; }
}

.eventsingle__apply { margin: clamp(28px, 3.4vw, 40px) 0; text-align: center; }
.eventsingle__closed {
	padding: 18px;
	border: 1px dashed var(--border);
	border-radius: var(--r-m);
	background: var(--bg-1);
	color: var(--ink-60);
	font-size: 14px;
}

/* --------------------------------------------------------------------------
   14-9. 動画（YouTube）
   押されるまで YouTube を読み込まない形にしているので、
   見た目だけは本物の埋め込みと同じに揃えておく。
   -------------------------------------------------------------------------- */
.movie__list { display: grid; gap: clamp(18px, 2.4vw, 30px); justify-items: center; }
.movie__list--multi { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.movie__item { width: 100%; max-width: 860px; }

.movie__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: var(--r-l);
	overflow: hidden;
	background: #000;
	box-shadow: var(--sh-2);
}
.movie__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.movie__play { display: block; width: 100%; height: 100%; }
.movie__thumb { width: 100%; height: 100%; object-fit: cover; }
.movie__playicon {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	transition: transform .25s var(--ease);
}
.movie__playicon svg { filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .35)); }
.movie__play:hover .movie__playicon { transform: scale(1.06); }
.movie__play:hover .movie__playicon path:first-child { fill-opacity: .95; }

.movie__title { margin-top: 12px; text-align: center; font-size: 14px; font-weight: 700; }
.movie__note { margin-top: 18px; text-align: center; font-size: 12px; color: var(--ink-40); }

/* --------------------------------------------------------------------------
   14-10. 無料相談フォームの組み直し（2026/09/15）
   伺う項目が増えたぶん、かたまりごとに見出しを付けて迷わないようにする。
   -------------------------------------------------------------------------- */
.form__group {
	border: 1px solid var(--border);
	border-radius: var(--r-m);
	padding: clamp(18px, 2.4vw, 26px);
	margin: 0;
	display: grid;
	gap: clamp(16px, 2vw, 22px);
	background: #fff;
}
.form__legend {
	font-family: var(--f-serif);
	font-size: 15.5px;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--gold-900);
	padding-inline: 10px;
	margin-inline: -4px;
}

.form__unitwrap { display: flex; align-items: center; gap: 8px; }
.form__input--num { max-width: 8em; }
.form__unit { font-size: 14px; color: var(--ink-60); }

.form__input--date { max-width: 100%; }

.form__note-inline {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 12px;
	color: var(--ink-60);
}
.form__note-inline .jc-icon { flex: none; color: var(--green-600); }

/* ご希望日時は 3 つ続くので、枠で囲って「1 つのまとまり」に見せる。 */
.form__schedule {
	border: 1px solid var(--border-soft);
	border-radius: var(--r-s);
	padding: 14px 16px 16px;
	background: var(--bg-1);
}
.form__schedule + .form__schedule { margin-top: 12px; }
.form__schedule--opt { background: #fff; }
.form__schedule-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13.5px;
	font-weight: 700;
	margin-bottom: 10px;
}
.form__row--schedule { grid-template-columns: 1fr 1fr; gap: 12px; }
.form__row--schedule .form__label { font-size: 12.5px; font-weight: 500; color: var(--ink-60); margin-bottom: 6px; }
@media (max-width: 480px) {
	.form__row--schedule { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   14-11. ロゴ（⑪の「左上にロゴ」）
   透過の画像を入れても、帯の高さが崩れないように上限だけ決めておく。
   -------------------------------------------------------------------------- */
.hd__logo-img { max-height: 54px; width: auto; object-fit: contain; }
@media (max-width: 1023px) { .hd__logo-img { max-height: 44px; } }
@media (max-width: 400px) { .hd__logo-img { max-height: 38px; } }

/* --------------------------------------------------------------------------
   14-12. 本文に貼り付けた動画（YouTube など）
   クラシックエディターで URL を 1 行だけ書くと、自動で埋め込みに変わる。
   そのとき出てくる枠は幅が固定なので、スマホではみ出さないようにしておく。
   -------------------------------------------------------------------------- */
.entry iframe,
.entry embed,
.entry object,
.entry video {
	display: block;
	max-width: 100%;
	margin-inline: auto;
	border-radius: var(--r-m);
}
.entry iframe[src*="youtube"],
.entry iframe[src*="youtu.be"],
.entry iframe[src*="vimeo"] {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
/* WordPress が自動で付ける囲み。 */
.entry .wp-video,
.entry .wp-block-embed__wrapper { max-width: 100%; }

/* --------------------------------------------------------------------------
   14-9. 文字を大きく（2026/09/22 のご要望）
   「年齢が上がると小さい字が見えづらくなる」とのことで、見出しの英字ラベルと
   ファーストビューの一行目を大きくし、本文の小さすぎる箇所の下限を上げている。
   各セクションの指定はそのままにして、ここで上書きする（戻すときはこの節を消すだけ）。
   -------------------------------------------------------------------------- */

/* ファーストビューの一行目「30代からの大人の婚活｜埼玉県川口市の結婚相談所」 */
.hero__lead,
.hero__lead--ja {
	font-size: clamp(17px, 1.7vw, 21px);
	font-weight: 600;
	color: var(--gold-900);
}
.hero__lead--ja { letter-spacing: .14em; }
.hero__lead-seg { display: inline-block; }
@media (max-width: 767px) {
	.hero__lead,
	.hero__lead--ja { font-size: 15.5px; letter-spacing: .1em; line-height: 1.7; }
}

/* 見出しの英字ラベル（MESSAGE・VOICE・YOUR FUTURE・REASON・STRENGTH・PLAN・FLOW ほか） */
.sec-head__en,
.message__en,
.gift__en,
.news__en,
.fcta__en,
.phead__en,
.vhead__en,
.postcta__en {
	font-size: clamp(18px, 1.9vw, 23px);
	font-weight: 600;
	letter-spacing: .26em;
}
.sec-head--center .sec-head__en { padding-left: .26em; }
.sec-head__en::after { width: 34px; margin-top: 14px; }
.sec-head__ja { font-size: clamp(26px, 3.6vw, 42px); }
.message__title { font-size: clamp(25px, 3.3vw, 38px); }
@media (max-width: 767px) {
	.sec-head__en,
	.message__en,
	.gift__en,
	.news__en,
	.fcta__en,
	.phead__en,
	.vhead__en,
	.postcta__en { font-size: 17px; letter-spacing: .2em; }
	.sec-head--center .sec-head__en { padding-left: .2em; }
	.sec-head__ja { font-size: 24px; }
	.message__title { font-size: 22px; }
}

/* 本文の下限。パソコンは 15px、スマホは 14px を下回らないようにする。 */
.sec-head__lead,
.rcard__text,
.worry__answer-text,
.future__close-text,
.flow__text,
.faq__a-body,
.news__text,
.fcta__lead,
.gift__text { font-size: 16px; }
.strength__text,
.plancard__tagline,
.plancard__targets li,
.plancard__features li,
.vcard__catch { font-size: 14.5px; }
.strength__title { font-size: 16.5px; }
.hero__note,
.plan__note,
.gift__note { font-size: 13.5px; }

@media (max-width: 767px) {
	.hero__text { font-size: 15.5px; }
	.sec-head__lead,
	.rcard__text,
	.worry__item,
	.worry__answer-text,
	.flow__text,
	.faq__q,
	.faq__a-body,
	.news__text,
	.fcta__lead,
	.gift__text,
	.message__text { font-size: 14.5px; }
	.strength__text,
	.plancard__tagline,
	.plancard__targets li,
	.plancard__features li,
	.vcard__catch { font-size: 13.5px; }
	.strength__title { font-size: 15px; }
	.hero__counselor-note,
	.plan__note,
	.gift__note { font-size: 12.5px; }
}
/* スマホでは「｜」で改行し、区切りの縦線は消す（行末に縦線だけ残るのを避ける）。 */
@media (max-width: 767px) {
	.hero__lead-sep { display: none; }
	.hero__lead-seg { display: block; }
}
.hero__text, .sec-head__lead { text-wrap: pretty; }
@media (min-width: 768px) {
	.hero__text { font-size: clamp(15px, 1.5vw, 17px); }
	.message__text { font-size: 16px; }
}

/* --------------------------------------------------------------------------
   14-10. プランカードのグリーン版（2026/09/25 ②）
   「メリハリをつけるため、クラシックプランのみグリーン系に」というご要望。
   プランの編集画面「カードをグリーン系の色にする」で付く。
   -------------------------------------------------------------------------- */
.plancard--green {
	background: linear-gradient(180deg, var(--green-100) 0%, #fff 42%);
	border-color: var(--green-500);
	box-shadow: 0 4px 14px rgba(93, 132, 52, .14), 0 20px 46px rgba(93, 132, 52, .10);
}
.plancard--green .plancard__badge {
	background: linear-gradient(135deg, var(--green-500), var(--green-700));
	box-shadow: 0 4px 12px rgba(93, 132, 52, .28);
}
.plancard--green .plancard__en { color: var(--green-700); }
.plancard--green .plancard__head { border-bottom-color: #d6e6c2; }
.plancard--green .plancard__fees { background: #f6faf0; border-color: #d6e6c2; }
.plancard--green .plancard__fees > div + div { border-top-color: #d6e6c2; }
.plancard--green .plancard__fees dd.is-strong { color: var(--green-700); }
.plancard--green .plancard__initial { background: var(--green-100); }
.plancard--green .plancard__initial-label,
.plancard--green .plancard__initial-value { color: var(--green-700); }
.plancard--green .plancard__initial-note { color: var(--green-600); }
.plancard--green .plancard__features .jc-icon { color: var(--green-600); }
.plancard--green .plancard__btn { border-color: var(--green-500); color: var(--green-700); }
.plancard--green .plancard__btn:hover { background: var(--green-100); border-color: var(--green-600); color: var(--green-700); }

/* --------------------------------------------------------------------------
   14-11. ロゴのふりがな（2026/09/25 ⑤）
   ロゴ画像の「Junction」の文字の真下に来るよう、左のマーク分（約 34%）をあけて中央に置く。
   -------------------------------------------------------------------------- */
.hd__logo:has(.hd__logo-ruby) { flex-direction: column; align-items: stretch; gap: 1px; }
.hd__logo-ruby {
	display: block;
	padding-left: 34%;
	text-align: center;
	font-size: 10.5px;
	line-height: 1;
	letter-spacing: .28em;
	color: var(--gold-700);
	white-space: nowrap;
}
.hd__logo:has(.hd__logo-ruby) .hd__logo-img { max-height: 46px; }
@media (max-width: 1023px) {
	.hd__logo:has(.hd__logo-ruby) .hd__logo-img { max-height: 38px; }
	.hd__logo-ruby { font-size: 9.5px; letter-spacing: .2em; }
}
@media (max-width: 400px) {
	.hd__logo:has(.hd__logo-ruby) .hd__logo-img { max-height: 34px; }
	.hd__logo-ruby { font-size: 9px; letter-spacing: .12em; }
}

/* --------------------------------------------------------------------------
   14-12. バナー（2026/09/25 ①）
   キャンペーン … 受賞歴の帯の下。画像と説明文を横に並べる（スマホは縦）。
   特集・掲載 … トップのいちばん下。画像を 2 列で並べる（スマホは 1 列）。
   -------------------------------------------------------------------------- */
.sec--campaign { background: var(--bg); padding-block: clamp(48px, 6vw, 80px); }
.campaign__list { display: grid; gap: clamp(20px, 3vw, 32px); max-width: 1000px; margin-inline: auto; }
.campaign__item {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(20px, 3vw, 40px);
	padding: clamp(16px, 2vw, 24px);
	background: var(--bg-1);
	border: 1px solid var(--border-soft);
	border-radius: var(--r-l);
}
.campaign__item.is-imgonly { grid-template-columns: 1fr; justify-items: center; background: none; border: 0; padding: 0; }
.campaign__media img { display: block; width: 100%; height: auto; border-radius: var(--r-m); }
.campaign__item.is-imgonly .campaign__media { max-width: 760px; width: 100%; }
.campaign__media a { display: block; transition: opacity .2s; }
.campaign__media a:hover { opacity: .85; }
.campaign__title { font-family: var(--f-serif); font-size: clamp(18px, 2vw, 21px); font-weight: 600; line-height: 1.6; }
.campaign__text { margin-top: 10px; font-size: 15px; line-height: 1.9; color: var(--ink-80); }
.campaign__btn { margin-top: 18px; }
@media (max-width: 767px) {
	.campaign__item { grid-template-columns: 1fr; }
	.campaign__text { font-size: 14.5px; }
	.campaign__btn { width: 100%; }
}

.sec--banners { background: var(--bg-1); padding-block: clamp(48px, 6vw, 80px); }
.banners__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(16px, 2.4vw, 32px);
	max-width: 1000px;
	margin-inline: auto;
}
.banners__item img { display: block; width: 100%; height: auto; border-radius: var(--r-m); box-shadow: var(--sh-1); }
.banners__link { display: block; transition: opacity .2s; }
.banners__link:hover { opacity: .85; }
.banners__text { margin-top: 8px; font-size: 13.5px; line-height: 1.8; color: var(--ink-60); text-align: center; }
@media (max-width: 767px) {
	.banners__list { grid-template-columns: 1fr; }
}