@charset "UTF-8";
/* ==========================================================================
   老犬老猫ケアノート｜ページテンプレート用スタイル
   【ケアノート】テンプレートを使ったページでのみ読み込まれます。
   色を変えたいときは :root の変数だけ触ればOK。
   ========================================================================== */

:root {
	--rcn-main: #c4a882;       /* サイトのメインカラー（アクセント・装飾） */
	--rcn-main-dark: #8b6b45;  /* メインカラーの濃い版（白文字ボタン・小見出し） */
	--rcn-ink: #4a3a2a;        /* 見出し */
	--rcn-teal: #8b6b45;       /* ボタン */
	--rcn-teal-hover: #74583a;
	--rcn-text: #4d4339;
	--rcn-muted: #85786a;
	--rcn-line: #ece4d8;
	--rcn-bg: #fcfaf6;
	--rcn-white: #fff;

	--rcn-mint: #f3ebdf;
	--rcn-mint-deep: #e6d7c1;
	--rcn-peach: #fdebe3;
	--rcn-peach-deep: #f8d9cb;
	--rcn-sky: #e6f0fa;
	--rcn-sky-deep: #d3e4f5;
	--rcn-sand: #f5eee4;
	--rcn-sand-deep: #ebdfcf;
	--rcn-accent: #e08a67;     /* PR・アクセント */

	--rcn-radius: 22px;
	--rcn-radius-s: 14px;
	--rcn-shadow: 0 6px 24px rgba(90, 66, 40, .07), 0 1px 3px rgba(90, 66, 40, .05);
	--rcn-shadow-hover: 0 12px 32px rgba(90, 66, 40, .12), 0 2px 6px rgba(90, 66, 40, .06);
	--rcn-font-round: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Hiragino Sans", "Yu Gothic", sans-serif;
	--rcn-gap: clamp(40px, 7vw, 72px);
}

/* ---------- ベース ---------- */
/* SWELLはbodyではなく #body_wrap にページのクラスを付けるため、.rcn-page で指定 */
.rcn-page {
	background: var(--rcn-bg);
}
/* ヘッダー下のパンくず（ホーム ＞ …）を非表示
   ※このCSSはケアノート用テンプレートのページでしか読み込まれません */
#breadcrumb,
.p-breadcrumb,
.rcn-page #breadcrumb,
.rcn-page .p-breadcrumb {
	display: none !important;
}
.rcn-page #content {
	padding-top: clamp(12px, 3vw, 32px);
}
.rcn-main {
	color: var(--rcn-text);
	line-height: 1.8;
}
.rcn-main *,
.rcn-main *::before,
.rcn-main *::after { box-sizing: border-box; }
/* SWELLの「記事コンテンツ幅」（1カラム時 900px）を解除して、ヘッダーと同じ幅に */
.rcn-main.l-article,
.-sidebar-off .rcn-main.l-article {
	max-width: none;
	width: 100%;
}
.rcn-wrap {
	max-width: 1192px;
	margin: 0 auto;
	padding-bottom: var(--rcn-gap);
}
.rcn-main a { text-decoration: none; color: inherit; }
.rcn-main h1, .rcn-main h2, .rcn-main h3 {
	font-family: var(--rcn-font-round);
	color: var(--rcn-ink);
	letter-spacing: .02em;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}
.rcn-main h1::before, .rcn-main h1::after,
.rcn-main h2::before, .rcn-main h2::after,
.rcn-main h3::before, .rcn-main h3::after { content: none; }
.rcn-main p { margin: 0; }
.rcn-main ul, .rcn-main ol { list-style: none; margin: 0; padding: 0; }
.rcn-main figure { margin: 0; }
.rcn-ico { width: 1em; height: 1em; flex: none; }
.rcn-small { font-size: 13px; color: var(--rcn-muted); margin-top: 14px !important; }
.rcn-empty { color: var(--rcn-muted); font-size: 14px; padding: 24px; text-align: center; background: var(--rcn-white); border-radius: var(--rcn-radius-s); }
.rcn-main :focus-visible { outline: 3px solid #c4a882; outline-offset: 3px; border-radius: 8px; }
.sp-only { display: inline; }
@media (min-width: 600px) { .sp-only { display: none; } }

.rcn-section { margin-top: var(--rcn-gap); }

/* ---------- ボタン ---------- */
.rcn-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6em;
	min-height: 52px;
	padding: 12px 28px;
	border-radius: 999px;
	font-family: var(--rcn-font-round);
	font-weight: 700;
	font-size: 16px;
	letter-spacing: .04em;
	line-height: 1.4;
	transition: background-color .2s, color .2s, transform .2s, box-shadow .2s;
	border: 2px solid transparent;
}
.rcn-btn .rcn-ico { width: 20px; height: 20px; transition: transform .2s; }
.rcn-btn:hover .rcn-ico { transform: translateX(3px); }
.rcn-btn--primary {
	background: var(--rcn-teal);
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(139, 107, 69, .25);
}
.rcn-btn--primary:hover { background: var(--rcn-teal-hover); transform: translateY(-1px); }
.rcn-btn--outline {
	background: var(--rcn-white);
	border-color: var(--rcn-ink);
	color: var(--rcn-ink) !important;
}
.rcn-btn--outline:hover { background: var(--rcn-ink); color: #fff !important; }
.rcn-btn--block { display: flex; width: 100%; }
.rcn-btn--lg { min-height: 60px; font-size: 17px; padding: 14px 36px; }

.rcn-pr {
	display: inline-flex;
	align-items: center;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	color: var(--rcn-accent);
	border: 1px solid currentColor;
	border-radius: 4px;
	padding: 0 5px;
	line-height: 1.6;
	margin-right: .6em;
	font-family: sans-serif;
}
.rcn-textlink {
	display: inline-flex; align-items: center; gap: .3em;
	font-weight: 700; color: var(--rcn-ink) !important;
	margin-top: 10px;
}
.rcn-textlink .rcn-ico { width: 16px; height: 16px; }

/* ---------- チップ ---------- */
.rcn-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.rcn-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 14px;
	font-size: 13px; font-weight: 700;
	color: var(--rcn-ink) !important;
	background: var(--rcn-white);
	border: 1px solid var(--rcn-line);
	border-radius: 999px;
	transition: background-color .2s, border-color .2s;
}
.rcn-chip small { font-size: 11px; color: var(--rcn-muted); font-weight: 500; }
.rcn-chip:hover { background: var(--rcn-mint); border-color: var(--rcn-mint-deep); }

/* ---------- セクション見出し ---------- */
.rcn-shead {
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px; margin-bottom: 18px;
}
.rcn-shead__title {
	display: flex; align-items: center; gap: 12px;
	font-size: clamp(20px, 4.6vw, 26px) !important;
	line-height: 1.4;
}
.rcn-shead__icon {
	display: inline-grid; place-items: center;
	width: 48px; height: 36px;
	background: var(--rcn-mint);
	border-radius: 999px;
	color: var(--rcn-ink);
	flex: none;
}
.rcn-shead__icon .rcn-ico { width: 24px; height: 24px; }
.rcn-shead__more {
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 14px; color: var(--rcn-muted) !important; white-space: nowrap;
}
.rcn-shead__more .rcn-ico { width: 16px; height: 16px; }
.rcn-shead__more:hover { color: var(--rcn-ink) !important; }

.rcn-center-title {
	text-align: center;
	font-size: clamp(20px, 4.8vw, 26px) !important;
	margin-bottom: 16px !important;
}

/* ==========================================================================
   トップ：ファーストビュー
   ========================================================================== */
.rcn-hero {
	position: relative;
	border-radius: 28px;
	overflow: hidden;
	background: var(--rcn-mint);
	isolation: isolate;
}
.rcn-hero__eyebrow {
	font-size: clamp(13px, 3.4vw, 16px);
	font-weight: 700;
	color: var(--rcn-ink);
	letter-spacing: .05em;
}
.rcn-hero__title {
	font-size: clamp(28px, 8.2vw, 44px) !important;
	letter-spacing: .01em !important;
	word-break: keep-all;
	line-height: 1.3 !important;
	font-weight: 700;
	margin: 8px 0 12px !important;
}
.rcn-hero__lead {
	font-size: clamp(14px, 3.8vw, 17px);
	color: var(--rcn-text);
	line-height: 1.9;
}

/* ---------- 写真あり：写真の上に文字を重ねる ---------- */
.rcn-hero--photo {
	--rcn-hero-veil: 252, 250, 246;
	--rcn-hero-min: clamp(360px, 92vw, 520px);
	display: flex;
	min-height: var(--rcn-hero-min);
	padding: 22px;
}
.rcn-hero--photo.rcn-hero--light { --rcn-hero-veil: 44, 32, 20; }
.rcn-hero--photo .rcn-hero__media { position: absolute; inset: 0; z-index: -1; }
.rcn-hero--photo .rcn-hero__media picture { display: contents; }
.rcn-hero--photo .rcn-hero__img {
	width: 100%; height: 100%;
	object-fit: cover;
	object-position: var(--rcn-hero-fx, 60%) var(--rcn-hero-fy, 60%);
}
.rcn-hero--photo .rcn-hero__media::after {
	content: ""; position: absolute; inset: 0;
	opacity: var(--rcn-hero-ov, .8);
	background: linear-gradient(var(--rcn-hero-dir, 180deg), rgba(var(--rcn-hero-veil), .95) 0%, rgba(var(--rcn-hero-veil), .65) 35%, rgba(var(--rcn-hero-veil), 0) 65%);
}
.rcn-hero--photo .rcn-hero__text { position: relative; width: 100%; max-width: 620px; }

/* 文字の色：白 */
.rcn-hero--photo.rcn-hero--light .rcn-hero__eyebrow,
.rcn-hero--photo.rcn-hero--light .rcn-hero__title,
.rcn-hero--photo.rcn-hero--light .rcn-hero__lead { color: #fff !important; text-shadow: 0 1px 12px rgba(0,0,0,.25); }

/* 文字揃え */
.rcn-hero--align-center .rcn-hero__text { text-align: center; }
.rcn-hero--align-right .rcn-hero__text { text-align: right; }
.rcn-hero__btn { margin-top: 18px; }

/* 高さ */
.rcn-hero--h-s  { --rcn-hero-min: 300px; }
.rcn-hero--h-l  { --rcn-hero-min: clamp(440px, 115vw, 640px); }
.rcn-hero--h-xl { --rcn-hero-min: calc(100svh - 110px); }

/* キャッチコピーの大きさ */
.rcn-hero--t-s .rcn-hero__title { font-size: clamp(24px, 7vw, 40px) !important; }
.rcn-hero--t-l .rcn-hero__title { font-size: clamp(32px, 9.4vw, 60px) !important; }

/* スマホの文字位置（上／中央／下） */
@media (max-width: 799px) {
	.rcn-hero--photo.rcn-hero--sppos-ct { align-items: flex-start; --rcn-hero-dir: 180deg; }
	.rcn-hero--photo.rcn-hero--sppos-cc { align-items: center; }
	.rcn-hero--photo.rcn-hero--sppos-cb { align-items: flex-end; --rcn-hero-dir: 0deg; }
	.rcn-hero--photo.rcn-hero--sppos-cc .rcn-hero__media::after {
		background: radial-gradient(ellipse at center, rgba(var(--rcn-hero-veil), .85) 0%, rgba(var(--rcn-hero-veil), .5) 45%, rgba(var(--rcn-hero-veil), 0) 80%);
	}
	.rcn-hero--photo .rcn-hero__text { max-width: none; }
}

/* PCの文字位置（9か所） */
@media (min-width: 800px) {
	.rcn-hero--photo { --rcn-hero-min: 480px; padding: 48px 56px; }
	.rcn-hero--photo.rcn-hero--h-s  { --rcn-hero-min: 360px; }
	.rcn-hero--photo.rcn-hero--h-l  { --rcn-hero-min: 580px; }
	.rcn-hero--photo.rcn-hero--h-xl { --rcn-hero-min: calc(100vh - 140px); }

	.rcn-hero--pos-lt, .rcn-hero--pos-ct, .rcn-hero--pos-rt { align-items: flex-start; }
	.rcn-hero--pos-lc, .rcn-hero--pos-cc, .rcn-hero--pos-rc { align-items: center; }
	.rcn-hero--pos-lb, .rcn-hero--pos-cb, .rcn-hero--pos-rb { align-items: flex-end; }
	.rcn-hero--pos-lt, .rcn-hero--pos-lc, .rcn-hero--pos-lb { justify-content: flex-start; --rcn-hero-dir: 90deg; }
	.rcn-hero--pos-ct, .rcn-hero--pos-cc, .rcn-hero--pos-cb { justify-content: center; }
	.rcn-hero--pos-rt, .rcn-hero--pos-rc, .rcn-hero--pos-rb { justify-content: flex-end; --rcn-hero-dir: 270deg; }
	.rcn-hero--pos-ct { --rcn-hero-dir: 180deg; }
	.rcn-hero--pos-cb { --rcn-hero-dir: 0deg; }
	.rcn-hero--photo.rcn-hero--pos-cc .rcn-hero__media::after {
		background: radial-gradient(ellipse at center, rgba(var(--rcn-hero-veil), .85) 0%, rgba(var(--rcn-hero-veil), .5) 40%, rgba(var(--rcn-hero-veil), 0) 75%);
	}
}

/* ---------- 写真なし：イラスト ---------- */
.rcn-hero--illust {
	display: grid;
	background:
		radial-gradient(circle at 90% 10%, rgba(253,226,214,.8) 0 70px, transparent 71px),
		linear-gradient(160deg, #f6efe4 0%, #fcfaf6 100%);
}
.rcn-hero--illust .rcn-hero__text { padding: 26px 22px 0; order: 1; }
.rcn-hero--illust .rcn-hero__media { order: 2; padding: 0 12px; }
.rcn-hero--illust .rcn-illust--hero { width: 100%; height: auto; display: block; max-height: 340px; margin: 0 auto; }
.rcn-hero--illust.rcn-hero--sppos-cb .rcn-hero__text { order: 3; padding: 0 22px 26px; }

@media (min-width: 800px) {
	.rcn-hero--illust { grid-template-columns: 1.1fr 1fr; align-items: center; }
	.rcn-hero--illust .rcn-hero__text { padding: 48px 0 48px 56px; }
	.rcn-hero--illust .rcn-hero__media { padding: 24px 24px 0 0; align-self: end; }
	.rcn-hero--illust .rcn-illust--hero { max-height: 400px; }
	.rcn-hero--illust.rcn-hero--pos-lt .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-rt .rcn-hero__text { align-self: start; }
	.rcn-hero--illust.rcn-hero--pos-lb .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-rb .rcn-hero__text { align-self: end; }
	/* 右寄せ：イラストを左に */
	.rcn-hero--illust.rcn-hero--pos-rt, .rcn-hero--illust.rcn-hero--pos-rc, .rcn-hero--illust.rcn-hero--pos-rb { grid-template-columns: 1fr 1.1fr; }
	.rcn-hero--illust.rcn-hero--pos-rt .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-rc .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-rb .rcn-hero__text { order: 2; padding: 48px 56px 48px 0; }
	.rcn-hero--illust.rcn-hero--pos-rt .rcn-hero__media, .rcn-hero--illust.rcn-hero--pos-rc .rcn-hero__media, .rcn-hero--illust.rcn-hero--pos-rb .rcn-hero__media { order: 1; padding: 24px 0 0 24px; }
	/* 中央：文字の下にイラスト（中央下なら上にイラスト） */
	.rcn-hero--illust.rcn-hero--pos-ct, .rcn-hero--illust.rcn-hero--pos-cc, .rcn-hero--illust.rcn-hero--pos-cb { grid-template-columns: 1fr; text-align: center; }
	.rcn-hero--illust.rcn-hero--pos-ct .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-cc .rcn-hero__text, .rcn-hero--illust.rcn-hero--pos-cb .rcn-hero__text { padding: 48px 56px 0; }
	.rcn-hero--illust.rcn-hero--pos-ct .rcn-hero__media, .rcn-hero--illust.rcn-hero--pos-cc .rcn-hero__media, .rcn-hero--illust.rcn-hero--pos-cb .rcn-hero__media { padding: 12px 24px 0; }
	.rcn-hero--illust.rcn-hero--pos-cb .rcn-hero__text { order: 3; padding: 0 56px 48px; }
	.rcn-hero--illust.rcn-hero--pos-cb .rcn-hero__media { padding-top: 32px; }
}

/* ==========================================================================
   トップ：いぬ／ねこ タブ ＋ お悩みカード
   ========================================================================== */
.rcn-worries { margin-top: clamp(28px, 6vw, 56px); }
.rcn-tabs {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	max-width: 500px;
	margin: 0 auto 20px;
	padding: 4px;
	background: var(--rcn-sky);
	border-radius: 999px;
}
.rcn-tabs__pill {
	position: absolute;
	top: 4px; bottom: 4px; left: 4px;
	width: calc(50% - 4px);
	background: var(--rcn-mint-deep);
	border-radius: 999px;
	transition: transform .35s cubic-bezier(.3,.7,.2,1);
	z-index: 0;
}
.rcn-tabs[data-active="cat"] .rcn-tabs__pill { transform: translateX(100%); background: var(--rcn-sand-deep); }
.rcn-tabs__btn {
	position: relative; z-index: 1;
	display: flex; align-items: center; justify-content: center; gap: 10px;
	height: 52px;
	font-family: var(--rcn-font-round);
	font-size: 18px; font-weight: 700;
	color: var(--rcn-ink);
	background: none; border: 0; cursor: pointer;
	border-radius: 999px;
}
.rcn-tabs__btn .rcn-ico { width: 30px; height: 30px; }
.rcn-tabs__btn[aria-selected="false"] { color: var(--rcn-muted); }

.rcn-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
.rcn-cards[hidden] { display: none; }
.rcn-cards.is-entering .rcn-card { animation: rcn-pop .45s both; }
.rcn-cards.is-entering .rcn-card:nth-child(2) { animation-delay: .05s; }
.rcn-cards.is-entering .rcn-card:nth-child(3) { animation-delay: .1s; }
.rcn-cards.is-entering .rcn-card:nth-child(4) { animation-delay: .15s; }
@keyframes rcn-pop { from { opacity: 0; transform: translateY(8px) scale(.98); } }

.rcn-card {
	position: relative;
	display: flex; align-items: center; gap: 8px;
	min-height: 96px;
	padding: 10px 12px 10px 8px;
	border-radius: var(--rcn-radius);
	transition: transform .2s, box-shadow .2s;
}
.rcn-card:hover { transform: translateY(-2px); box-shadow: var(--rcn-shadow-hover); }
.rcn-card--peach { background: var(--rcn-peach); }
.rcn-card--sky   { background: var(--rcn-sky); }
.rcn-card--mint  { background: var(--rcn-mint); }
.rcn-card--sand  { background: var(--rcn-sand); }
.rcn-card__art { width: 42%; max-width: 96px; flex: none; }
.rcn-card__art svg, .rcn-card__art img { width: 100%; height: auto; display: block; }
.rcn-card__art img { aspect-ratio: 1; object-fit: contain; }
.rcn-card__text { flex: 1; min-width: 0; }
.rcn-card__label {
	display: block;
	font-family: var(--rcn-font-round);
	font-weight: 700;
	font-size: clamp(14px, 3.9vw, 19px);
	color: var(--rcn-ink);
	line-height: 1.35;
}
.rcn-card__sub { display: none; font-size: 12px; color: var(--rcn-muted); line-height: 1.5; margin-top: 2px; }
.rcn-card__arrow { color: var(--rcn-ink); }
.rcn-card__arrow .rcn-ico { width: 18px; height: 18px; }
@media (min-width: 600px) {
	.rcn-cards { gap: 16px; }
	.rcn-card { min-height: 116px; padding: 14px 18px 14px 12px; }
	.rcn-card__sub { display: block; }
}
@media (min-width: 960px) {
	.rcn-cards { grid-template-columns: repeat(4, 1fr); }
	.rcn-card { flex-direction: column; align-items: flex-start; padding: 18px 20px 20px; min-height: 0; }
	.rcn-card__art { width: 100%; max-width: 132px; margin: 0 auto 6px; }
	.rcn-card__arrow { position: absolute; right: 18px; bottom: 20px; }
}

/* ==========================================================================
   特集バナー（酸素室・ごはん）
   ========================================================================== */
.rcn-feature {
	position: relative;
	margin-top: clamp(20px, 4vw, 32px);
	border-radius: var(--rcn-radius);
	padding: 26px 22px 24px;
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	grid-template-areas: "text media" "cta cta";
	gap: 16px 8px;
	overflow: hidden;
}
.rcn-section + .rcn-feature, .rcn-worries + .rcn-feature { margin-top: var(--rcn-gap); }
.rcn-feature__text { grid-area: text; position: relative; z-index: 1; }
.rcn-feature__media { grid-area: media; align-self: center; position: relative; }
.rcn-feature__cta { grid-area: cta; }
.rcn-feature__eyebrow {
	display: flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 700; color: var(--rcn-ink);
	letter-spacing: .04em;
}
.rcn-feature__eyebrow .rcn-ico { width: 18px; height: 18px; }
.rcn-feature__title {
	font-size: clamp(22px, 5.8vw, 34px) !important;
	line-height: 1.4 !important;
	margin: 8px 0 10px !important;
}
.rcn-feature__lead { font-size: clamp(13px, 3.6vw, 16px); line-height: 1.8; }
.rcn-feature__points { display: none; }

.rcn-feature--oxygen {
	background:
		radial-gradient(circle at 100% 0%, rgba(255,255,255,.7) 0 120px, transparent 121px),
		var(--rcn-mint);
}
.rcn-feature--food {
	background: var(--rcn-peach);
	grid-template-areas: "text media";
	align-items: center;
}
.rcn-feature--food .rcn-feature__title { margin-top: 0 !important; }
.rcn-feature__actions { display: grid; gap: 10px; margin-top: 16px; justify-items: start; }
.rcn-feature__actions .rcn-btn { min-height: 46px; padding: 8px 20px; font-size: 14px; }
.rcn-prlink {
	display: inline-flex; align-items: center;
	font-size: 13px; font-weight: 700; color: var(--rcn-ink) !important;
}
.rcn-prlink .rcn-ico { width: 14px; height: 14px; margin-left: 4px; }
.rcn-prlink:hover { text-decoration: underline !important; }
.rcn-feature__sub {
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: 12px; font-size: 13px; color: var(--rcn-muted) !important;
}
.rcn-feature__sub .rcn-ico { width: 18px; height: 18px; }

@media (max-width: 599px) {
	.rcn-feature--food { grid-template-columns: 1fr; grid-template-areas: "media" "text"; }
	.rcn-feature__actions .rcn-btn { width: 100%; }
	.rcn-feature__actions { justify-items: stretch; }
}
@media (min-width: 800px) {
	.rcn-feature { padding: 44px 48px; gap: 24px 40px; }
	.rcn-feature--oxygen { grid-template-columns: 1fr 1fr; grid-template-areas: "text media" "cta media"; }
	.rcn-feature--oxygen .rcn-feature__cta { max-width: 420px; }
	.rcn-feature__points { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
	.rcn-feature__points li {
		display: inline-flex; align-items: center; gap: 6px;
		padding: 6px 14px; background: rgba(255,255,255,.75);
		border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--rcn-ink);
	}
	.rcn-feature__points .rcn-ico { width: 16px; height: 16px; }
	.rcn-feature__actions { grid-auto-flow: column; align-items: center; gap: 20px; }
}

/* ==========================================================================
   記事リスト
   ========================================================================== */
.rcn-posts { display: grid; gap: 14px; }
.rcn-post__link {
	position: relative;
	display: flex; align-items: stretch;
	background: var(--rcn-white);
	border-radius: var(--rcn-radius-s);
	box-shadow: var(--rcn-shadow);
	overflow: hidden;
	transition: transform .2s, box-shadow .2s;
	height: 100%;
}
.rcn-post__link:hover { transform: translateY(-2px); box-shadow: var(--rcn-shadow-hover); }
.rcn-post__thumb {
	flex: none; width: 36%; max-width: 220px;
	background: var(--rcn-sand);
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}
.rcn-post__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.rcn-post__link:hover .rcn-post__thumb img { transform: scale(1.04); }
.rcn-thumb-ph { position: absolute; inset: 0; display: grid; place-items: center; color: var(--rcn-sand-deep); }
.rcn-thumb-ph .rcn-ico { width: 40%; height: 40%; }
.rcn-post__body { flex: 1; min-width: 0; padding: 12px 36px 12px 14px; display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.rcn-post__cat {
	align-self: flex-start;
	font-size: 11px; font-weight: 700; color: var(--rcn-ink);
	background: var(--rcn-mint); border-radius: 999px; padding: 1px 10px;
}
.rcn-post__title {
	font-family: var(--rcn-font-round);
	font-weight: 700; color: var(--rcn-ink);
	font-size: clamp(14px, 3.8vw, 17px);
	line-height: 1.5;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.rcn-post__excerpt {
	font-size: 12px; color: var(--rcn-muted); line-height: 1.6;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.rcn-post__arrow { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--rcn-ink); }
.rcn-post__arrow .rcn-ico { width: 18px; height: 18px; }

@media (max-width: 480px) {
	.rcn-posts--row .rcn-post__excerpt { display: none; }
}
@media (min-width: 700px) {
	.rcn-posts--row { grid-template-columns: 1fr 1fr; gap: 18px; }
	.rcn-posts--grid { grid-template-columns: 1fr 1fr; gap: 18px; }
}
@media (min-width: 960px) {
	.rcn-posts--grid { grid-template-columns: repeat(3, 1fr); gap: 22px; }
	.rcn-posts--grid .rcn-post__link { flex-direction: column; }
	.rcn-posts--grid .rcn-post__thumb { width: 100%; max-width: none; }
	.rcn-posts--grid .rcn-post__body { padding: 14px 18px 18px; justify-content: flex-start; }
	.rcn-posts--grid .rcn-post__arrow { top: auto; bottom: 16px; transform: none; }
}

/* ==========================================================================
   テーマから探す
   ========================================================================== */
.rcn-themes { display: grid; gap: 12px; }
@media (min-width: 700px) { .rcn-themes { grid-template-columns: 1fr 1fr; gap: 16px; } }
@media (min-width: 960px) { .rcn-themes { grid-template-columns: repeat(3, 1fr); } }
.rcn-theme {
	border-radius: var(--rcn-radius-s);
	padding: 14px 16px 16px;
	background: var(--rcn-white);
	box-shadow: var(--rcn-shadow);
}
.rcn-theme__main { display: flex; align-items: center; gap: 12px; }
.rcn-theme__icon {
	display: grid; place-items: center;
	width: 46px; height: 46px; border-radius: 50%;
	color: var(--rcn-ink); flex: none;
}
.rcn-theme__icon .rcn-ico { width: 26px; height: 26px; }
.rcn-theme--mint  .rcn-theme__icon { background: var(--rcn-mint); }
.rcn-theme--peach .rcn-theme__icon { background: var(--rcn-peach); }
.rcn-theme--sky   .rcn-theme__icon { background: var(--rcn-sky); }
.rcn-theme--sand  .rcn-theme__icon { background: var(--rcn-sand); }
.rcn-theme__name { flex: 1; font-family: var(--rcn-font-round); font-weight: 700; font-size: 17px; color: var(--rcn-ink); }
.rcn-theme__arrow { color: var(--rcn-ink); }
.rcn-theme__arrow .rcn-ico { width: 18px; height: 18px; transition: transform .2s; }
.rcn-theme__main:hover .rcn-theme__arrow .rcn-ico { transform: translateX(3px); }
.rcn-theme__children { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; padding-left: 58px; }
.rcn-theme__children .rcn-chip { background: var(--rcn-bg); font-size: 12px; padding: 4px 12px; }

/* ==========================================================================
   本文エディタ領域
   ========================================================================== */
.rcn-editor__body {
	background: var(--rcn-white);
	border-radius: var(--rcn-radius);
	padding: clamp(20px, 5vw, 44px);
	box-shadow: var(--rcn-shadow);
}
.rcn-editor__body > *:first-child { margin-top: 0 !important; }
.rcn-editor__body > *:last-child { margin-bottom: 0 !important; }

/* ==========================================================================
   サイト紹介・注意書き
   ========================================================================== */
.rcn-about {
	margin-top: var(--rcn-gap);
	display: flex; gap: 18px; align-items: flex-start;
	padding: 24px 22px;
	background: linear-gradient(135deg, var(--rcn-mint) 0%, var(--rcn-sand) 100%);
	border-radius: var(--rcn-radius);
}
.rcn-about__mark { flex: none; width: 72px; color: var(--rcn-ink); }
.rcn-about__mark svg { width: 100%; height: auto; display: block; }
.rcn-about__title { font-size: 18px !important; margin-bottom: 6px !important; }
.rcn-about p { font-size: 14px; }
@media (max-width: 480px) { .rcn-about { flex-direction: column; gap: 8px; } .rcn-about__mark { width: 60px; } }

.rcn-notice {
	margin-top: var(--rcn-gap);
	display: flex; gap: 12px; align-items: flex-start;
	padding: 16px 18px;
	background: var(--rcn-white);
	border: 1px dashed var(--rcn-mint-deep);
	border-radius: var(--rcn-radius-s);
	font-size: 13px; color: var(--rcn-muted);
}
.rcn-notice__icon { color: var(--rcn-ink); flex: none; }
.rcn-notice__icon .rcn-ico { width: 22px; height: 22px; }

/* ==========================================================================
   LP（酸素室・ごはん）/ カテゴリハブ
   ========================================================================== */
.rcn-lphero {
	display: grid;
	gap: 18px;
	padding: 28px 22px 22px;
	border-radius: 28px;
	overflow: hidden;
}
.rcn-lphero--mint  { background: linear-gradient(160deg, var(--rcn-mint) 0%, #faf5ee 100%); }
.rcn-lphero--peach { background: linear-gradient(160deg, var(--rcn-peach) 0%, #fff8f4 100%); }
.rcn-lphero--sky   { background: linear-gradient(160deg, var(--rcn-sky) 0%, #f2fafb 100%); }
.rcn-lphero--sand  { background: linear-gradient(160deg, var(--rcn-sand) 0%, #fdfaf5 100%); }
.rcn-lphero__eyebrow {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 700; color: var(--rcn-ink);
	background: rgba(255,255,255,.8); padding: 4px 14px; border-radius: 999px;
}
.rcn-lphero__eyebrow .rcn-ico { width: 18px; height: 18px; }
.rcn-lphero__title {
	font-size: clamp(26px, 7vw, 42px) !important;
	line-height: 1.4 !important;
	margin: 12px 0 10px !important;
}
.rcn-lphero__lead { font-size: clamp(14px, 3.8vw, 16px); line-height: 1.9; }
.rcn-lphero__media svg { width: 100%; max-width: 380px; height: auto; display: block; margin: 0 auto; }
.rcn-lphero__media img { width: 100%; border-radius: var(--rcn-radius-s); display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.rcn-lphero__media figcaption { font-size: 10px; color: var(--rcn-muted); text-align: right; margin-top: 4px; }
.rcn-lphero--compact .rcn-lphero__media img { aspect-ratio: 16 / 9; }
.rcn-chips--hero { margin-top: 16px; }
@media (min-width: 800px) {
	.rcn-lphero { grid-template-columns: 1.1fr .9fr; align-items: center; padding: 48px 52px; gap: 40px; }
	.rcn-lphero--compact:not(:has(.rcn-lphero__media)) { grid-template-columns: 1fr; }
}

.rcn-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.rcn-toc a {
	font-size: 13px; font-weight: 700; color: var(--rcn-ink) !important;
	padding: 6px 14px; border-radius: 999px;
	background: var(--rcn-white); border: 1px solid var(--rcn-line);
}
.rcn-toc a::after { content: "↓"; margin-left: 4px; color: var(--rcn-muted); }
.rcn-toc a:hover { background: var(--rcn-ink); color: #fff !important; }

.rcn-checklist { display: grid; gap: 10px; }
@media (min-width: 700px) { .rcn-checklist { grid-template-columns: 1fr 1fr; gap: 14px; } }
.rcn-checklist li {
	display: flex; gap: 12px; align-items: flex-start;
	padding: 16px 18px;
	background: var(--rcn-white);
	border-radius: var(--rcn-radius-s);
	box-shadow: var(--rcn-shadow);
	font-weight: 700; color: var(--rcn-ink); line-height: 1.6;
}
.rcn-checklist .rcn-ico {
	width: 26px; height: 26px; padding: 4px;
	background: var(--rcn-mint); border-radius: 50%; color: var(--rcn-ink);
	stroke-width: 2.6;
}

.rcn-steps { display: grid; gap: 14px; counter-reset: none; }
@media (min-width: 800px) { .rcn-steps { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.rcn-step {
	position: relative;
	padding: 22px 20px 20px;
	background: var(--rcn-white);
	border-radius: var(--rcn-radius);
	box-shadow: var(--rcn-shadow);
}
.rcn-step__num {
	position: absolute; top: 16px; right: 18px;
	font-family: var(--rcn-font-round); font-weight: 700;
	font-size: 40px; line-height: 1; color: var(--rcn-mint-deep);
}
.rcn-step__icon {
	display: grid; place-items: center;
	width: 48px; height: 48px; border-radius: 50%;
	background: var(--rcn-mint); color: var(--rcn-ink);
	margin-bottom: 12px;
}
.rcn-lp--food .rcn-step__icon { background: var(--rcn-peach); }
.rcn-lp--food .rcn-step__num { color: var(--rcn-peach-deep); }
.rcn-lp--oxygen .rcn-step__icon { background: var(--rcn-sky); }
.rcn-lp--oxygen .rcn-step__num { color: var(--rcn-sky-deep); }
.rcn-step__icon .rcn-ico { width: 26px; height: 26px; }
.rcn-step h3 { font-size: 18px !important; margin-bottom: 6px !important; }
.rcn-step p { font-size: 14px; line-height: 1.8; }

.rcn-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (min-width: 960px) { .rcn-tiles { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
.rcn-tile {
	display: flex; flex-direction: column; gap: 6px;
	padding: 18px 16px;
	background: var(--rcn-white);
	border-radius: var(--rcn-radius-s);
	box-shadow: var(--rcn-shadow);
	transition: transform .2s, box-shadow .2s;
}
.rcn-tile:hover { transform: translateY(-2px); box-shadow: var(--rcn-shadow-hover); }
.rcn-tile__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--rcn-peach); color: var(--rcn-ink); }
.rcn-tile__icon .rcn-ico { width: 24px; height: 24px; }
.rcn-tile__title { font-family: var(--rcn-font-round); font-weight: 700; color: var(--rcn-ink); font-size: 16px; line-height: 1.4; }
.rcn-tile__text { font-size: 12px; color: var(--rcn-muted); line-height: 1.6; }

.rcn-cta {
	margin-top: var(--rcn-gap);
	text-align: center;
	padding: clamp(28px, 6vw, 48px) 22px;
	border-radius: var(--rcn-radius);
}
.rcn-cta--sky { background: var(--rcn-sky); }
.rcn-cta--peach { background: var(--rcn-peach); }
.rcn-cta__label { font-size: 14px; font-weight: 700; color: var(--rcn-ink); display: inline-flex; align-items: center; }
.rcn-cta__title {
	font-family: var(--rcn-font-round); font-weight: 700; color: var(--rcn-ink);
	font-size: clamp(22px, 5.6vw, 30px); line-height: 1.45;
	margin: 8px 0 18px !important;
}
.rcn-cta__text { font-size: 14px; margin: -8px 0 18px !important; }
.rcn-cta__btns { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.rcn-cta .rcn-btn { max-width: 100%; }
.rcn-cta__note { font-size: 12px; color: var(--rcn-muted); margin-top: 12px !important; }
.rcn-cta img[width="1"] { position: absolute; width: 1px; height: 1px; opacity: 0; }

.rcn-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 28px; }
.rcn-pager .page-numbers {
	min-width: 42px; height: 42px; padding: 0 12px;
	display: grid; place-items: center;
	border-radius: 999px; background: var(--rcn-white); box-shadow: var(--rcn-shadow);
	font-weight: 700; color: var(--rcn-ink);
}
.rcn-pager .page-numbers.current { background: var(--rcn-ink); color: #fff; }

/* ==========================================================================
   ふわっと表示（JS有効時のみ）
   ========================================================================== */
.rcn-js .rcn-reveal { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.rcn-js .rcn-reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.rcn-js .rcn-reveal { opacity: 1; transform: none; transition: none; }
	.rcn-main * { animation: none !important; transition: none !important; }
}

/* ==========================================================================
   スマホ微調整（〜599px）
   ========================================================================== */
@media (max-width: 599px) {
	/* お悩みカード：イラスト上・文字下 */
	.rcn-card {
		flex-direction: column;
		justify-content: center;
		gap: 2px;
		min-height: 128px;
		padding: 12px 10px 14px;
		text-align: center;
	}
	.rcn-card__art { width: 62%; max-width: 104px; }
	.rcn-card__text { flex: none; }
	.rcn-card__label { font-size: 15px; }
	.rcn-card__arrow { position: absolute; right: 10px; bottom: 12px; }
	.rcn-card__arrow .rcn-ico { width: 14px; height: 14px; }

	/* 酸素室バナー：縦積み */
	.rcn-feature--oxygen {
		grid-template-columns: 1fr;
		grid-template-areas: "text" "media" "cta";
	}
	.rcn-feature { gap: 12px; }
}
@media (max-width: 599px) {
	.rcn-shead__title { font-size: 18px !important; gap: 10px; }
	.rcn-shead__icon { width: 40px; height: 32px; }
	.rcn-shead__icon .rcn-ico { width: 20px; height: 20px; }
}


/* ==========================================================================
   カスタマイザーで選ぶバリエーション
   ========================================================================== */
/* セクション間隔 */
.rcn-gap-s { --rcn-gap: clamp(28px, 5vw, 48px); }
.rcn-gap-l { --rcn-gap: clamp(56px, 9vw, 104px); }

/* 背景色 */
.rcn-feature.rcn-tone--mint  { background: var(--rcn-mint); }
.rcn-feature.rcn-tone--peach { background: var(--rcn-peach); }
.rcn-feature.rcn-tone--sky   { background: var(--rcn-sky); }
.rcn-feature.rcn-tone--sand  { background: var(--rcn-sand); }
.rcn-feature.rcn-tone--white { background: var(--rcn-white); box-shadow: var(--rcn-shadow); }
.rcn-feature--oxygen.rcn-tone--mint {
	background: radial-gradient(circle at 100% 0%, rgba(255,255,255,.7) 0 120px, transparent 121px), var(--rcn-mint);
}
.rcn-card--white { background: var(--rcn-white); box-shadow: var(--rcn-shadow); }

/* 写真を左に */
@media (min-width: 800px) {
	.rcn-feature--oxygen.rcn-feature--rev { grid-template-areas: "media text" "media cta"; }
	.rcn-feature--food.rcn-feature--rev { grid-template-areas: "media text"; grid-template-columns: .95fr 1.05fr; }
}
@media (min-width: 600px) and (max-width: 799px) {
	.rcn-feature--rev { grid-template-columns: .95fr 1.05fr; }
	.rcn-feature--oxygen.rcn-feature--rev { grid-template-areas: "media text" "cta cta"; }
	.rcn-feature--food.rcn-feature--rev { grid-template-areas: "media text"; }
}

/* お悩みカード：PC2列 */
@media (min-width: 960px) {
	.rcn-cards--pc2 { grid-template-columns: repeat(2, 1fr); }
	.rcn-cards--pc2 .rcn-card { flex-direction: row; align-items: center; padding: 16px 24px 16px 16px; min-height: 130px; }
	.rcn-cards--pc2 .rcn-card__art { width: 120px; max-width: none; margin: 0; }
	.rcn-cards--pc2 .rcn-card__label { font-size: 21px; }
	.rcn-cards--pc2 .rcn-card__sub { font-size: 13px; }
	.rcn-cards--pc2 .rcn-card__arrow { position: static; }
}

/* サイト紹介：画像 */
.rcn-about__mark--img img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 50%; display: block; border: 3px solid #fff; }


/* ==========================================================================
   誘導ボックス（酸素室・ごはん）の画像枠：16:9
   写真は枠いっぱいにトリミング、未設定時のイラストは枠の中央に配置
   ========================================================================== */
.rcn-feature__media {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--rcn-radius-s);
	overflow: hidden;
	background: rgba(255, 255, 255, .6);
	display: grid;
	place-items: center;
}
.rcn-feature__media img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.rcn-feature__media > svg { width: auto; height: 90%; max-width: 100%; display: block; }
.rcn-feature__media figcaption {
	position: absolute; right: 8px; bottom: 6px;
	font-size: 10px; line-height: 1.4;
	color: var(--rcn-muted);
	background: rgba(255, 255, 255, .8);
	padding: 1px 6px; border-radius: 4px;
}

/* スマホ：画像（16:9）→ 文字 → ボタン */
@media (max-width: 599px) {
	.rcn-feature,
	.rcn-feature--oxygen,
	.rcn-feature--food,
	.rcn-feature--rev {
		grid-template-columns: 1fr;
		grid-template-areas: "media" "text" "cta";
		gap: 16px;
		padding-top: 16px;
	}
	.rcn-feature--food { grid-template-areas: "media" "text"; }
}

/* タブレット以上：文字 ＋ 16:9画像 の横並び */
@media (min-width: 600px) {
	.rcn-feature { grid-template-columns: 1fr 1fr; align-items: center; }
	.rcn-feature--oxygen { grid-template-areas: "text media" "cta media"; }
	.rcn-feature--food { grid-template-areas: "text media"; }
	.rcn-feature--oxygen.rcn-feature--rev { grid-template-areas: "media text" "media cta"; }
	.rcn-feature--food.rcn-feature--rev { grid-template-areas: "media text"; }
	.rcn-feature--oxygen .rcn-feature__cta { align-self: start; }
}
@media (min-width: 800px) {
	.rcn-feature { grid-template-columns: 1fr 1.1fr; }
	.rcn-feature--rev { grid-template-columns: 1.1fr 1fr; }
}


/* ごはんバナー：いぬ・ねこ 2つのボタン */
.rcn-feature__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.rcn-feature__btns .rcn-btn { min-height: 48px; padding: 8px 20px 8px 16px; font-size: 14px; gap: .5em; }
.rcn-btn .rcn-btn__pet { width: 22px; height: 22px; }
.rcn-btn:hover .rcn-btn__pet { transform: none; }
@media (max-width: 599px) {
	.rcn-feature__btns { flex-direction: column; }
	.rcn-feature__btns .rcn-btn { width: 100%; }
}
@media (min-width: 600px) {
	.rcn-feature--food .rcn-feature__actions { grid-auto-flow: row; justify-items: start; gap: 14px; }
}


/* ==========================================================================
   ファーストビュー：スマホは「文字 → 写真」の縦並び（文字と写真を重ねない）
   ========================================================================== */
@media (max-width: 799px) {
	.rcn-hero--photo.rcn-hero--sp-stack {
		flex-direction: column;
		align-items: stretch;
		min-height: 0;
		padding: 0;
		background: linear-gradient(180deg, #f6efe4 0%, #fcfaf6 100%);
	}
	.rcn-hero--sp-stack .rcn-hero__text {
		order: 1;
		padding: 24px 22px 18px;
	}
	.rcn-hero--photo.rcn-hero--sp-stack .rcn-hero__media {
		position: relative;
		inset: auto;
		z-index: 0;
		order: 2;
		width: 100%;
		aspect-ratio: 4 / 3;
		overflow: hidden;
	}
	.rcn-hero--sp-stack.rcn-hero--h-s  .rcn-hero__media { aspect-ratio: 16 / 10; }
	.rcn-hero--sp-stack.rcn-hero--h-l  .rcn-hero__media { aspect-ratio: 1 / 1; }
	.rcn-hero--sp-stack.rcn-hero--h-xl .rcn-hero__media { aspect-ratio: 4 / 5; }
	/* 写真の上端を背景になじませる（文字には重ならない） */
	.rcn-hero--photo.rcn-hero--sp-stack .rcn-hero__media::after {
		opacity: 1;
		background: linear-gradient(180deg, #f6efe4 0%, rgba(246, 239, 228, 0) 18%);
	}
	/* 背景が明るいので文字は常に濃い色 */
	.rcn-hero--sp-stack.rcn-hero--light .rcn-hero__eyebrow,
	.rcn-hero--sp-stack.rcn-hero--light .rcn-hero__title { color: var(--rcn-ink) !important; text-shadow: none; }
	.rcn-hero--sp-stack.rcn-hero--light .rcn-hero__lead { color: var(--rcn-text) !important; text-shadow: none; }
	.rcn-hero--sp-stack .rcn-hero__btn { margin-top: 14px; }
}


/* ==========================================================================
   ファーストビュー：PCは「文字 ＋ 写真」の分割（顔と文字を重ねない）
   写真は文字の後ろ（24%地点）から始まり、文字側はふんわり背景色に溶かす。
   → 被写体が文字に近づき、文字は写真の薄い部分にしか乗らない
   ========================================================================== */
@media (min-width: 800px) {
	.rcn-hero--photo.rcn-hero--pc-split {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		padding: 48px 56px;
		background: linear-gradient(160deg, #f6efe4 0%, #fcfaf6 100%);
	}
	.rcn-hero--pc-split .rcn-hero__text {
		position: relative;
		z-index: 1;
		width: auto;
		max-width: 44%;
		padding: 0;
	}
	.rcn-hero--photo.rcn-hero--pc-split .rcn-hero__media {
		position: absolute;
		top: 0; bottom: 0; left: 24%; right: 0;
		z-index: 0;
		overflow: hidden;
	}
	.rcn-hero--photo.rcn-hero--pc-split .rcn-hero__media::after {
		opacity: 1;
		background: linear-gradient(90deg, #f6efe4 0%, rgba(246, 239, 228, .9) 12%, rgba(246, 239, 228, .45) 24%, rgba(246, 239, 228, 0) 38%);
	}
	/* 中央系を選んでも文字は左（中央だと被写体に重なるため） */
	.rcn-hero--pc-split.rcn-hero--pos-ct,
	.rcn-hero--pc-split.rcn-hero--pos-cc,
	.rcn-hero--pc-split.rcn-hero--pos-cb { justify-content: flex-start; }
	/* 右系：文字が右・写真が左 */
	.rcn-hero--pc-split.rcn-hero--pos-rt,
	.rcn-hero--pc-split.rcn-hero--pos-rc,
	.rcn-hero--pc-split.rcn-hero--pos-rb { justify-content: flex-end; }
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rt .rcn-hero__media,
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rc .rcn-hero__media,
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rb .rcn-hero__media { left: 0; right: 24%; }
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rt .rcn-hero__media::after,
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rc .rcn-hero__media::after,
	.rcn-hero--photo.rcn-hero--pc-split.rcn-hero--pos-rb .rcn-hero__media::after {
		background: linear-gradient(270deg, #f6efe4 0%, rgba(246, 239, 228, .9) 12%, rgba(246, 239, 228, .45) 24%, rgba(246, 239, 228, 0) 38%);
	}
	.rcn-hero--pc-split .rcn-hero__title { font-size: clamp(28px, 3.5vw, 44px) !important; }
	.rcn-hero--pc-split.rcn-hero--t-s .rcn-hero__title { font-size: clamp(24px, 2.9vw, 36px) !important; }
	.rcn-hero--pc-split.rcn-hero--t-l .rcn-hero__title { font-size: clamp(30px, 4vw, 52px) !important; }
	/* 背景が明るいので文字は常に濃い色 */
	.rcn-hero--pc-split.rcn-hero--light .rcn-hero__eyebrow,
	.rcn-hero--pc-split.rcn-hero--light .rcn-hero__title { color: var(--rcn-ink) !important; text-shadow: none; }
	.rcn-hero--pc-split.rcn-hero--light .rcn-hero__lead { color: var(--rcn-text) !important; text-shadow: none; }
}

/* ==========================================================================
   ごはんバナー（PC）：文字の枠は中身の幅ぴったり、残りはすべて写真に
   ========================================================================== */
@media (min-width: 800px) {
	.rcn-feature.rcn-feature--food {
		grid-template-columns: fit-content(440px) minmax(0, 1fr);
		grid-template-areas: "text media";
		gap: 24px 48px;
	}
	.rcn-feature.rcn-feature--food.rcn-feature--rev {
		grid-template-columns: minmax(0, 1fr) fit-content(440px);
		grid-template-areas: "media text";
	}
	.rcn-feature--food .rcn-feature__title { font-size: clamp(26px, 2.8vw, 38px) !important; }
	.rcn-feature--food .rcn-feature__btns { flex-direction: column; align-items: stretch; }
	.rcn-feature--food .rcn-feature__btns .rcn-btn { justify-content: flex-start; }
	.rcn-feature--food .rcn-feature__btns .rcn-btn .rcn-ico:last-child { margin-left: auto; }
}

/* フッターまでの余白：SWELLの #content 下マージン（約6em）を外し、テンプレート側の余白だけにする */
.rcn-page #content { margin-bottom: 0 !important; }
.rcn-wrap { padding-bottom: clamp(68px, 7vw, 90px); }


/* ==========================================================================
   メインカラー（#c4a882）のアクセント
   ========================================================================== */
.rcn-hero__eyebrow,
.rcn-feature__eyebrow,
.rcn-lphero__eyebrow { color: var(--rcn-main-dark) !important; }
.rcn-hero__eyebrow::before {
	content: ""; display: inline-block; width: 22px; height: 2px; margin: 0 8px 4px 0;
	vertical-align: middle; background: var(--rcn-main); border-radius: 2px;
}
.rcn-shead__icon { color: var(--rcn-main-dark); }
.rcn-center-title::after {
	content: ""; display: block; width: 40px; height: 3px; margin: 10px auto 0;
	background: var(--rcn-main); border-radius: 3px;
}
.rcn-chip:hover { border-color: var(--rcn-main); }
.rcn-step__num { color: var(--rcn-main) !important; opacity: .45; }
.rcn-checklist .rcn-ico { color: var(--rcn-main-dark); }

/* いぬ／ねこ切り替え：色数を減らす（白地＋細い線、選択中だけメインカラーの淡色） */
.rcn-tabs {
	background: var(--rcn-white);
	border: 1px solid var(--rcn-line);
	box-shadow: 0 2px 10px rgba(90, 66, 40, .04);
}
.rcn-tabs__pill,
.rcn-tabs[data-active="cat"] .rcn-tabs__pill {
	background: var(--rcn-mint);
	box-shadow: inset 0 0 0 1px var(--rcn-mint-deep);
}
.rcn-tabs__btn[aria-selected="true"] { color: var(--rcn-ink); }
.rcn-tabs__btn[aria-selected="false"] { color: var(--rcn-muted); }

/* ==========================================================================
   酸素室ガイド（rcn-ox）
   ========================================================================== */
.rcn-ox-hero {
	display: grid; gap: 20px;
	padding: 28px 22px 22px;
	border-radius: 28px;
	background: linear-gradient(160deg, #f6efe4 0%, #fcfaf6 100%);
}
.rcn-ox-hero__title { font-size: clamp(26px, 6.6vw, 40px) !important; line-height: 1.4 !important; margin: 12px 0 10px !important; }
.rcn-ox-hero__lead { font-size: clamp(14px, 3.8vw, 16px); line-height: 1.95; }
.rcn-ox-hero__badge {
	display: inline-flex; align-items: center; gap: 8px;
	margin-top: 16px !important; padding: 8px 14px;
	font-size: 13px; color: var(--rcn-ink);
	background: #fff; border: 1px solid var(--rcn-line); border-radius: 12px;
}
.rcn-ox-hero__badge .rcn-ico { width: 18px; height: 18px; color: var(--rcn-main-dark); }
.rcn-ox-hero__media { position: relative; aspect-ratio: 16 / 9; border-radius: var(--rcn-radius-s); overflow: hidden; background: rgba(255,255,255,.6); display: grid; place-items: center; }
.rcn-ox-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rcn-ox-hero__media > svg { height: 90%; width: auto; }
.rcn-ox-hero__media figcaption { position: absolute; right: 8px; bottom: 6px; font-size: 10px; color: var(--rcn-muted); background: rgba(255,255,255,.85); padding: 1px 6px; border-radius: 4px; }
@media (min-width: 800px) {
	.rcn-ox-hero { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 40px; padding: 48px 52px; }
}

.rcn-ox-intro { margin: -4px 0 18px !important; font-size: 15px; }

/* 実測カード */
.rcn-ox-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 800px) { .rcn-ox-stats { grid-template-columns: repeat(3, 1fr); gap: 16px; } }
.rcn-ox-stat {
	display: flex; flex-direction: column; gap: 2px;
	padding: 16px 16px 14px;
	background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow);
}
.rcn-ox-stat__icon { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 6px; border-radius: 50%; background: var(--rcn-mint); color: var(--rcn-main-dark); }
.rcn-ox-stat__icon .rcn-ico { width: 18px; height: 18px; }
.rcn-ox-stat__label { font-size: 12px; font-weight: 700; color: var(--rcn-muted); line-height: 1.4; }
.rcn-ox-stat__value { font-family: var(--rcn-font-round); font-weight: 700; color: var(--rcn-ink); font-size: clamp(24px, 6.4vw, 34px); line-height: 1.25; letter-spacing: .01em; }
.rcn-ox-stat__value small { font-size: 13px; margin-left: 3px; color: var(--rcn-text); }
.rcn-ox-stat__sub { font-size: 11.5px; color: var(--rcn-muted); line-height: 1.5; }

.rcn-ox-cond { margin-top: 14px; padding: 12px 16px; background: #fff; border: 1px dashed var(--rcn-mint-deep); border-radius: var(--rcn-radius-s); font-size: 13px; }
.rcn-ox-cond summary { cursor: pointer; font-weight: 700; color: var(--rcn-main-dark); }
.rcn-ox-cond ul { margin-top: 8px !important; display: grid; gap: 4px; }
.rcn-ox-cond li { padding-left: 1em; text-indent: -1em; color: var(--rcn-text); }
.rcn-ox-cond li::before { content: "・"; }

/* 電気代シミュレーター */
.rcn-ox-sim { padding: 22px 20px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
.rcn-ox-sim__inputs { display: grid; gap: 18px; }
@media (min-width: 800px) { .rcn-ox-sim__inputs { grid-template-columns: 1fr 1fr; gap: 32px; } }
.rcn-ox-sim__field { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; }
.rcn-ox-sim__field > span, .rcn-ox-sim__field legend { font-size: 13px; font-weight: 700; color: var(--rcn-muted); padding: 0; }
.rcn-ox-sim__hours { font-family: var(--rcn-font-round); font-size: 26px; font-weight: 700; color: var(--rcn-ink); }
.rcn-ox-sim input[type="range"] { width: 100%; accent-color: var(--rcn-main-dark); height: 28px; }
.rcn-ox-sim__prices { display: flex; flex-wrap: wrap; gap: 8px; }
.rcn-ox-sim__prices label { cursor: pointer; }
.rcn-ox-sim__prices input { position: absolute; opacity: 0; pointer-events: none; }
.rcn-ox-sim__prices span {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
	font-size: 14px; font-weight: 700; color: var(--rcn-text);
	background: var(--rcn-bg); border: 1px solid var(--rcn-line); border-radius: 999px;
}
.rcn-ox-sim__prices input:checked + span { color: #fff; background: var(--rcn-main-dark); border-color: var(--rcn-main-dark); }
.rcn-ox-sim__prices input:focus-visible + span { outline: 3px solid var(--rcn-main); outline-offset: 2px; }
.rcn-ox-sim__result { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 18px; }
.rcn-ox-sim__result > div { padding: 12px 10px; text-align: center; background: var(--rcn-bg); border-radius: var(--rcn-radius-s); }
.rcn-ox-sim__result > div.is-main { background: var(--rcn-mint); }
.rcn-ox-sim__result span { display: block; font-size: 11px; font-weight: 700; color: var(--rcn-muted); }
.rcn-ox-sim__result strong { display: block; font-family: var(--rcn-font-round); font-size: clamp(17px, 4.6vw, 26px); color: var(--rcn-ink); }
.rcn-ox-sim__note { margin-top: 12px !important; font-size: 12.5px; color: var(--rcn-muted); }

/* 置き場所 */
.rcn-ox-space { display: grid; gap: 18px; padding: 20px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
@media (min-width: 800px) { .rcn-ox-space { grid-template-columns: 1.1fr 1fr; align-items: center; gap: 32px; padding: 28px 32px; } }
.rcn-ox-space__fig svg { width: 100%; height: auto; display: block; font-family: var(--rcn-font-round); }
.rcn-ox-space__fig figcaption { font-size: 12px; color: var(--rcn-muted); margin-top: 6px; }
.rcn-ox-points { display: grid; gap: 10px; }
.rcn-ox-points li { position: relative; padding-left: 18px; font-size: 14px; line-height: 1.8; }
.rcn-ox-points li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--rcn-main); }
.rcn-ox-points strong { color: var(--rcn-ink); }

/* 音 */
.rcn-ox-sound { padding: 20px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
.rcn-ox-sound__row { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "label val" "track track"; gap: 6px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--rcn-line); }
@media (min-width: 800px) { .rcn-ox-sound__row { grid-template-columns: 220px 1fr 120px; grid-template-areas: "label track val"; } }
.rcn-ox-sound__label { grid-area: label; font-size: 14px; font-weight: 700; color: var(--rcn-ink); line-height: 1.4; }
.rcn-ox-sound__label small { display: block; font-size: 11px; font-weight: 500; color: var(--rcn-muted); }
.rcn-ox-sound__track { grid-area: track; position: relative; height: 12px; background: var(--rcn-bg); border-radius: 999px; overflow: hidden; }
.rcn-ox-sound__bar { position: absolute; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, #d9c4a3, var(--rcn-main-dark)); }
.rcn-ox-sound__val { grid-area: val; font-size: 14px; font-weight: 700; color: var(--rcn-ink); text-align: right; white-space: nowrap; }
.rcn-ox-sound__scale { display: none; }
@media (min-width: 800px) {
	.rcn-ox-sound__scale { display: flex; justify-content: space-between; margin: 6px 130px 0 230px; font-size: 11px; color: var(--rcn-muted); }
}
.rcn-ox-sound__note { margin-top: 14px !important; font-size: 13.5px; line-height: 1.85; }

/* 費用 */
.rcn-ox-cost { display: grid; gap: 18px; padding: 20px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
@media (min-width: 800px) { .rcn-ox-cost { grid-template-columns: 280px 1fr; align-items: center; gap: 32px; padding: 28px 32px; } }
.rcn-ox-cost__main { padding: 20px; text-align: center; background: var(--rcn-mint); border-radius: var(--rcn-radius-s); }
.rcn-ox-cost__main span { display: block; font-size: 12px; font-weight: 700; color: var(--rcn-muted); }
.rcn-ox-cost__main strong { display: block; font-family: var(--rcn-font-round); font-size: 36px; color: var(--rcn-ink); line-height: 1.3; }
.rcn-ox-cost__main small { display: block; font-size: 11.5px; color: var(--rcn-text); }

/* 流れ */
.rcn-ox-flow { position: relative; display: grid; gap: 12px; }
.rcn-ox-flow__item { position: relative; display: flex; gap: 14px; padding: 16px 18px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-ox-flow__num { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-family: var(--rcn-font-round); font-weight: 700; color: #fff; background: var(--rcn-main); }
.rcn-ox-flow__item h3 { font-size: 16px !important; margin-bottom: 2px !important; }
.rcn-ox-flow__item p { font-size: 13.5px; line-height: 1.75; }
@media (min-width: 800px) { .rcn-ox-flow { grid-template-columns: repeat(3, 1fr); gap: 16px; } .rcn-ox-flow__item { flex-direction: column; } }

/* チェックリスト */
.rcn-ox-check { display: grid; gap: 8px; padding: 18px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
.rcn-ox-check__item { display: flex; align-items: flex-start; gap: 12px; padding: 10px 6px; cursor: pointer; font-size: 14.5px; line-height: 1.6; border-bottom: 1px solid var(--rcn-line); }
.rcn-ox-check__item input { position: absolute; opacity: 0; pointer-events: none; }
.rcn-ox-check__box { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border: 2px solid var(--rcn-mint-deep); border-radius: 7px; color: transparent; background: #fff; transition: background-color .15s, border-color .15s; }
.rcn-ox-check__box .rcn-ico { width: 16px; height: 16px; stroke-width: 3; }
.rcn-ox-check__item input:checked + .rcn-ox-check__box { background: var(--rcn-main-dark); border-color: var(--rcn-main-dark); color: #fff; }
.rcn-ox-check__item input:checked ~ span:last-child { color: var(--rcn-muted); text-decoration: line-through; text-decoration-color: var(--rcn-main); }
.rcn-ox-check__item input:focus-visible + .rcn-ox-check__box { outline: 3px solid var(--rcn-main); outline-offset: 2px; }
.rcn-ox-check__progress { margin-top: 6px !important; text-align: right; font-size: 13px; font-weight: 700; color: var(--rcn-main-dark); }

/* メーカー回答 */
.rcn-ox-maker { padding: 20px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
.rcn-ox-maker ul { display: grid; gap: 8px; }
@media (min-width: 800px) { .rcn-ox-maker ul { grid-template-columns: 1fr 1fr; } }
.rcn-ox-maker li { display: flex; gap: 8px; font-size: 14px; line-height: 1.7; }
.rcn-ox-maker li .rcn-ico { flex: none; width: 18px; height: 18px; margin-top: 3px; color: var(--rcn-main-dark); }
.rcn-ox-maker__note { display: flex; gap: 8px; margin-top: 14px !important; padding: 12px 14px; font-size: 13px; line-height: 1.75; background: var(--rcn-bg); border-radius: var(--rcn-radius-s); }
.rcn-ox-maker__note .rcn-ico { flex: none; width: 20px; height: 20px; color: var(--rcn-main-dark); }

/* FAQ */
.rcn-ox-faq { display: grid; gap: 10px; }
.rcn-ox-faq__item { background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-ox-faq__item summary {
	display: flex; align-items: center; gap: 12px;
	padding: 16px 44px 16px 16px; position: relative;
	font-weight: 700; color: var(--rcn-ink); cursor: pointer; list-style: none; line-height: 1.5;
}
.rcn-ox-faq__item summary::-webkit-details-marker { display: none; }
.rcn-ox-faq__item summary::after { content: ""; position: absolute; right: 18px; top: 50%; width: 8px; height: 8px; margin-top: -6px; border-right: 2px solid var(--rcn-main-dark); border-bottom: 2px solid var(--rcn-main-dark); transform: rotate(45deg); transition: transform .2s; }
.rcn-ox-faq__item[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.rcn-ox-faq__q { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: 13px; color: #fff; background: var(--rcn-main); }
.rcn-ox-faq__item p { padding: 0 18px 18px 56px; font-size: 14px; line-height: 1.85; }

/* 酸素室ガイドのCTA：空色ではなくメインカラーの淡色で */
.rcn-lp--oxygen .rcn-cta--sky { background: var(--rcn-mint); }
.rcn-lp--oxygen .rcn-cta__btns { flex-direction: column; align-items: center; }
@media (min-width: 600px) { .rcn-lp--oxygen .rcn-cta__btns { flex-direction: row; justify-content: center; } }

/* ==========================================================================
   運営者情報（rcn-op）
   ========================================================================== */
.rcn-op-hero {
	position: relative;
	padding: 36px 22px 32px;
	text-align: center;
	border-radius: 28px;
	background: linear-gradient(135deg, var(--rcn-mint) 0%, var(--rcn-sand) 100%);
	overflow: hidden;
}
.rcn-op-hero::after {
	content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px;
	border-radius: 50%; background: rgba(255, 255, 255, .45);
}
.rcn-op-hero > * { position: relative; z-index: 1; }
.rcn-op-hero__mark { display: block; width: 92px; margin: 0 auto 14px; color: var(--rcn-ink); }
.rcn-op-hero__mark svg { width: 100%; height: auto; display: block; }
.rcn-op-hero__title { font-size: clamp(26px, 6.4vw, 38px) !important; margin: 12px 0 10px !important; }
.rcn-op-hero__lead { font-size: clamp(14px, 3.8vw, 17px); line-height: 1.95; }
@media (min-width: 800px) { .rcn-op-hero { padding: 56px 48px 52px; } .rcn-op-hero__mark { width: 110px; } }

.rcn-op-story {
	position: relative;
	padding: 26px 22px 22px;
	background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow);
}
.rcn-op-story__quote {
	position: absolute; left: 16px; top: -6px;
	font-family: Georgia, serif; font-size: 72px; line-height: 1; color: var(--rcn-main); opacity: .55;
}
.rcn-op-story__body { position: relative; font-size: 15.5px; line-height: 2.05; }
.rcn-op-story__body p + p { margin-top: 1em !important; }
@media (min-width: 800px) { .rcn-op-story { padding: 40px 56px 36px; } .rcn-op-story__quote { left: 24px; font-size: 96px; } }

.rcn-op-policy { display: grid; gap: 12px; }
@media (min-width: 700px) { .rcn-op-policy { grid-template-columns: 1fr 1fr; gap: 16px; } }
.rcn-op-policy__item { padding: 20px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-op-policy__icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 10px; border-radius: 50%; background: var(--rcn-mint); color: var(--rcn-main-dark); }
.rcn-op-policy__icon .rcn-ico { width: 22px; height: 22px; }
.rcn-op-policy__item h3 { font-size: 17px !important; margin-bottom: 6px !important; }
.rcn-op-policy__item p { font-size: 14px; line-height: 1.85; }

.rcn-op-data { display: grid; gap: 10px; justify-items: start; padding: 22px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); font-size: 14.5px; line-height: 1.9; }
.rcn-op-data .rcn-btn { margin-top: 6px; }

.rcn-op-table { margin: 0; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); overflow: hidden; }
.rcn-op-table > div { display: grid; grid-template-columns: 1fr; gap: 2px; padding: 14px 20px; border-bottom: 1px solid var(--rcn-line); }
.rcn-op-table > div:last-child { border-bottom: 0; }
.rcn-op-table dt { font-size: 12px; font-weight: 700; color: var(--rcn-main-dark); }
.rcn-op-table dd { margin: 0; font-size: 15px; color: var(--rcn-ink); line-height: 1.7; }
.rcn-op-table dd a { color: var(--rcn-main-dark) !important; text-decoration: underline !important; text-underline-offset: 3px; }
@media (min-width: 700px) {
	.rcn-op-table > div { grid-template-columns: 180px 1fr; align-items: baseline; padding: 16px 28px; }
	.rcn-op-table dt { font-size: 13.5px; }
}
.rcn-op-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 14px; }
.rcn-op-links a { display: inline-flex; align-items: center; gap: 2px; font-size: 13.5px; font-weight: 700; color: var(--rcn-muted) !important; }
.rcn-op-links a .rcn-ico { width: 14px; height: 14px; }
.rcn-op-links a:hover { color: var(--rcn-ink) !important; }

.rcn-op-contact {
	display: grid; gap: 14px; justify-items: start;
	margin-top: var(--rcn-gap);
	padding: 24px 22px;
	background: linear-gradient(135deg, var(--rcn-mint) 0%, var(--rcn-sand) 100%);
	border-radius: var(--rcn-radius);
}
.rcn-op-contact__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #fff; color: var(--rcn-main-dark); }
.rcn-op-contact__icon .rcn-ico { width: 24px; height: 24px; }
.rcn-op-contact__title { font-family: var(--rcn-font-round); font-weight: 700; font-size: 18px; color: var(--rcn-ink); }
.rcn-op-contact__text { font-size: 13.5px; margin-top: 4px !important; }
@media (min-width: 800px) {
	.rcn-op-contact { grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; padding: 28px 36px; }
}

/* ==========================================================================
   規約・ポリシー（rcn-legal）
   ========================================================================== */
.rcn-legal__wrap { max-width: 920px; }
.rcn-legal-hero {
	position: relative; overflow: hidden;
	padding: 32px 22px 26px; text-align: center;
	border-radius: 28px;
	background: linear-gradient(135deg, var(--rcn-mint) 0%, var(--rcn-sand) 100%);
}
.rcn-legal-hero::after { content: ""; position: absolute; right: -50px; top: -50px; width: 170px; height: 170px; border-radius: 50%; background: rgba(255,255,255,.45); }
.rcn-legal-hero > * { position: relative; z-index: 1; }
.rcn-legal-hero__icon { display: inline-grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: #fff; color: var(--rcn-main-dark); box-shadow: var(--rcn-shadow); }
.rcn-legal-hero__icon .rcn-ico { width: 30px; height: 30px; }
.rcn-legal-hero__title { font-size: clamp(24px, 6vw, 34px) !important; margin: 14px 0 8px !important; }
.rcn-legal-hero__lead { max-width: 560px; margin: 0 auto !important; font-size: 14.5px; line-height: 1.9; }
.rcn-legal-hero__date { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px !important; padding: 4px 12px; font-size: 12px; color: var(--rcn-muted); background: rgba(255,255,255,.75); border-radius: 999px; }
.rcn-legal-hero__date .rcn-ico { width: 14px; height: 14px; }
@media (min-width: 800px) { .rcn-legal-hero { padding: 44px 40px 36px; } }

/* ページ切り替えタブ（スマホは横スクロール） */
.rcn-legal-tabs {
	display: flex; gap: 8px; margin: 18px 0 0; padding: 2px 2px 6px;
	overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.rcn-legal-tabs::-webkit-scrollbar { display: none; }
.rcn-legal-tabs a {
	flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px;
	font-size: 13px; font-weight: 700; white-space: nowrap; color: var(--rcn-text) !important;
	background: #fff; border: 1px solid var(--rcn-line); border-radius: 999px;
}
.rcn-legal-tabs a:hover { border-color: var(--rcn-main); }
.rcn-legal-tabs a.is-current { color: #fff !important; background: var(--rcn-main-dark); border-color: var(--rcn-main-dark); }
@media (min-width: 800px) { .rcn-legal-tabs { flex-wrap: wrap; justify-content: center; overflow: visible; } }

/* 目次 */
.rcn-legal-toc { margin-top: 22px; padding: 4px 18px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-legal-toc summary { display: flex; align-items: center; gap: 8px; min-height: 52px; font-weight: 700; color: var(--rcn-ink); cursor: pointer; list-style: none; font-family: var(--rcn-font-round); }
.rcn-legal-toc summary::-webkit-details-marker { display: none; }
.rcn-legal-toc summary .rcn-ico { width: 18px; height: 18px; color: var(--rcn-main-dark); }
.rcn-legal-toc summary span { margin-left: auto; font-size: 12px; color: var(--rcn-muted); }
.rcn-legal-toc ol { display: grid; gap: 2px; padding: 0 0 14px !important; }
@media (min-width: 700px) { .rcn-legal-toc ol { grid-template-columns: 1fr 1fr; column-gap: 20px; } }
.rcn-legal-toc a { display: block; padding: 7px 4px; font-size: 13.5px; color: var(--rcn-text) !important; border-bottom: 1px dashed var(--rcn-line); }
.rcn-legal-toc a:hover { color: var(--rcn-main-dark) !important; }

/* 本文（共通） */
.rcn-legal__body { margin-top: 22px; font-size: 15px; line-height: 1.95; color: var(--rcn-text); }
.rcn-legal__body p { margin: 0 0 .9em !important; }
.rcn-legal__body p:last-child { margin-bottom: 0 !important; }
.rcn-legal__body a { color: var(--rcn-main-dark) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.rcn-legal__body ul, .rcn-legal__body ol { margin: 0 0 .9em !important; padding-left: 1.4em !important; list-style: disc; }
.rcn-legal__body ol { list-style: decimal; }
.rcn-legal-intro { padding: 18px 20px; margin-bottom: 16px; background: var(--rcn-bg); border-left: 4px solid var(--rcn-main); border-radius: 0 var(--rcn-radius-s) var(--rcn-radius-s) 0; }

/* 見出しありのページ：項目ごとのカード */
.rcn-legal-sec { scroll-margin-top: 96px; margin-bottom: 14px; padding: 20px 20px 18px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-legal-sec__title {
	display: flex !important; align-items: center; gap: 12px;
	margin: 0 0 10px !important; padding: 0 !important;
	font-size: 17px !important; line-height: 1.5 !important;
	background: none !important; border: 0 !important; color: var(--rcn-ink) !important;
}
.rcn-legal-sec__title::before, .rcn-legal-sec__title::after { content: none !important; }
.rcn-legal-sec__num { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; font-size: 14px; color: #fff; background: var(--rcn-main); font-family: var(--rcn-font-round); }
.rcn-legal-sec__body { font-size: 14.5px; }
@media (min-width: 800px) { .rcn-legal-sec { padding: 26px 30px 24px; } .rcn-legal-sec__body { padding-left: 44px; } }

/* 特定商取引法：表 */
.rcn-legal-dl { margin: 0; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); overflow: hidden; }
.rcn-legal-dl > div { display: grid; gap: 4px; padding: 16px 20px; border-bottom: 1px solid var(--rcn-line); }
.rcn-legal-dl > div:last-child { border-bottom: 0; }
.rcn-legal-dl dt { font-size: 12.5px; font-weight: 700; color: var(--rcn-main-dark); }
.rcn-legal-dl dd { margin: 0; font-size: 14.5px; line-height: 1.85; color: var(--rcn-ink); }
.rcn-legal-dl dd p { margin: 0 0 .5em !important; }
@media (min-width: 700px) {
	.rcn-legal-dl > div { grid-template-columns: 220px 1fr; gap: 24px; padding: 18px 28px; }
	.rcn-legal-dl > div:nth-child(odd) { background: #fdfbf8; }
	.rcn-legal-dl dt { font-size: 13.5px; padding-top: 2px; }
}

/* 見出しなし：番号付きカード */
.rcn-legal__body--list { display: grid; gap: 12px; }
.rcn-legal-item { display: flex; gap: 14px; padding: 18px 20px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
.rcn-legal-item__num { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font-size: 13px; font-weight: 700; color: var(--rcn-main-dark); background: var(--rcn-mint); font-family: var(--rcn-font-round); }
.rcn-legal-item p { margin: 0 !important; font-size: 14.5px; }

.rcn-legal .rcn-op-contact { margin-top: 32px; }

/* ==========================================================================
   お問い合わせ（rcn-contact）
   ========================================================================== */
.rcn-contact__grid { display: grid; gap: 16px; margin-top: 22px; scroll-margin-top: 90px; }
@media (min-width: 900px) { .rcn-contact__grid { grid-template-columns: 300px 1fr; align-items: start; gap: 24px; } }

.rcn-contact__note { padding: 18px 20px; background: #fff; border-radius: var(--rcn-radius-s); box-shadow: var(--rcn-shadow); }
@media (min-width: 900px) { .rcn-contact__note { position: sticky; top: 100px; } }
.rcn-contact__notetitle { display: flex; align-items: center; gap: 6px; margin-bottom: 8px !important; font-weight: 700; color: var(--rcn-ink); font-family: var(--rcn-font-round); }
.rcn-contact__notetitle .rcn-ico { width: 18px; height: 18px; color: var(--rcn-main-dark); }
.rcn-contact__note ul { display: grid; gap: 8px; }
.rcn-contact__note li { position: relative; padding-left: 14px; font-size: 13px; line-height: 1.8; }
.rcn-contact__note li::before { content: ""; position: absolute; left: 0; top: .75em; width: 6px; height: 6px; border-radius: 50%; background: var(--rcn-main); }
.rcn-contact__note strong { color: var(--rcn-ink); }
.rcn-contact__note a { color: var(--rcn-main-dark) !important; text-decoration: underline !important; }

.rcn-contact__form { display: grid; gap: 18px; padding: 22px 20px 24px; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
@media (min-width: 800px) { .rcn-contact__form { padding: 32px 36px 34px; } }
.rcn-contact__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.rcn-field { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; }
.rcn-field > span, .rcn-field legend { display: flex; align-items: center; gap: 8px; padding: 0; font-size: 14px; font-weight: 700; color: var(--rcn-ink); }
.rcn-req, .rcn-opt { display: inline-flex; align-items: center; padding: 1px 8px; font-size: 11px; font-weight: 700; border-radius: 999px; line-height: 1.6; }
.rcn-req { color: #fff; background: var(--rcn-main-dark); }
.rcn-opt { color: var(--rcn-muted); background: var(--rcn-bg); border: 1px solid var(--rcn-line); }
.rcn-field input[type="text"], .rcn-field input[type="email"], .rcn-field input[type="url"], .rcn-field textarea {
	width: 100%; margin: 0; padding: 13px 16px;
	font-size: 16px; line-height: 1.6; color: #333; font-family: inherit;
	background: var(--rcn-bg); border: 2px solid var(--rcn-line); border-radius: 14px;
	box-shadow: none; -webkit-appearance: none; appearance: none;
	transition: border-color .15s, background-color .15s;
}
.rcn-field textarea { resize: vertical; min-height: 170px; }
.rcn-field input:focus, .rcn-field textarea:focus { outline: none; border-color: var(--rcn-main-dark); background: #fff; }
.rcn-field input::placeholder, .rcn-field textarea::placeholder { color: #b5aa9c; }
.rcn-field__row { display: grid; gap: 18px; }
@media (min-width: 700px) { .rcn-field__row { grid-template-columns: 1fr 1fr; } }

.rcn-field__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.rcn-field__chips label { cursor: pointer; }
.rcn-field__chips input { position: absolute; opacity: 0; pointer-events: none; }
.rcn-field__chips span {
	display: inline-flex; align-items: center; min-height: 42px; padding: 0 16px;
	font-size: 13.5px; font-weight: 700; color: var(--rcn-text);
	background: var(--rcn-bg); border: 1px solid var(--rcn-line); border-radius: 999px;
	transition: background-color .15s, color .15s, border-color .15s;
}
.rcn-field__chips input:checked + span { color: #fff; background: var(--rcn-main-dark); border-color: var(--rcn-main-dark); }
.rcn-field__chips input:focus-visible + span { outline: 3px solid var(--rcn-main); outline-offset: 2px; }

.rcn-field__agree { display: flex; align-items: center; gap: 12px; padding: 14px 16px; cursor: pointer; font-size: 14px; background: var(--rcn-bg); border-radius: 14px; }
.rcn-field__agree input { position: absolute; opacity: 0; pointer-events: none; }
.rcn-field__agree input:checked + .rcn-ox-check__box { background: var(--rcn-main-dark); border-color: var(--rcn-main-dark); color: #fff; }
.rcn-field__agree input:focus-visible + .rcn-ox-check__box { outline: 3px solid var(--rcn-main); outline-offset: 2px; }
.rcn-field__agree a { color: var(--rcn-main-dark) !important; text-decoration: underline !important; }

.rcn-contact__form .rcn-btn--block { width: 100%; margin-top: 4px; }

.rcn-contact__errors { padding: 14px 16px; color: #8a3b2a; background: #fdf0ea; border: 1px solid #f1cdbd; border-radius: 14px; font-size: 13.5px; }
.rcn-contact__errors p { display: flex; align-items: center; gap: 6px; font-weight: 700; margin-bottom: 4px !important; }
.rcn-contact__errors .rcn-ico { width: 18px; height: 18px; }
.rcn-contact__errors ul { padding-left: 1.2em !important; list-style: disc; }

.rcn-contact__done { grid-column: 1 / -1; display: grid; justify-items: center; gap: 12px; padding: 40px 24px; text-align: center; background: #fff; border-radius: var(--rcn-radius); box-shadow: var(--rcn-shadow); }
.rcn-contact__doneicon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: #fff; background: var(--rcn-main-dark); }
.rcn-contact__doneicon .rcn-ico { width: 32px; height: 32px; stroke-width: 2.6; }
.rcn-contact__done h2 { font-size: 22px !important; }
.rcn-contact__done p { max-width: 460px; font-size: 14.5px; line-height: 1.9; }

/* 酸素室ガイド：ヒーローの申し込みボタン */
.rcn-ox-hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 20px; }
.rcn-ox-hero__cta .rcn-btn { flex: 1 1 260px; max-width: 360px; }
.rcn-ox-hero__sub { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 700; color: var(--rcn-main-dark) !important; }
.rcn-ox-hero__sub .rcn-ico { width: 16px; height: 16px; }
.rcn-ox-hero__pr { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; margin-top: 10px !important; font-size: 11.5px; color: var(--rcn-muted); }
@media (max-width: 599px) { .rcn-ox-hero__cta .rcn-btn { max-width: none; } .rcn-ox-hero__cta { justify-content: center; } }
.rcn-aff-pixelwrap { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

/* 特集バナーの見出しリンク */
.rcn-feature__title a { color: inherit !important; text-decoration: none !important; }
.rcn-feature__title a:hover { text-decoration: underline !important; text-decoration-color: var(--rcn-main); text-underline-offset: 6px; }
