@charset "UTF-8";
/* ══════════════════════════════════════════════════════════
   エロ定額（ero-teigaku.com）
   配色 … 深緑 #14352B × クリーム #F6F4EE × 朱 #C4502B
   既存6サイト（ピンク/紫/青/真鍮/暗色）と重複しない帯を取っている。
   読者が「金額と本数を読む」場所なので、地は明色にして数字を読みやすくする。
   🔴 最小フォントサイズ 14px。本文コンテナ 1200px 以内。
   ══════════════════════════════════════════════════════════ */

:root {
	--et-ink:        #14352B;  /* 深緑。見出し・濃い地 */
	--et-ink-2:      #2C4A3F;
	--et-body:       #23302B;  /* 本文 */
	--et-mute:       #5C6B64;  /* 補足 */
	--et-bg:         #F6F4EE;  /* クリーム地 */
	--et-bg-2:       #FFFFFF;
	--et-bg-3:       #EDEAE1;  /* 表のゼブラ・囲み */
	--et-accent:     #C4502B;  /* 朱。CTAと強調 */
	--et-accent-d:   #A33E1E;
	--et-accent-w:   #FBEFEA;  /* 朱の薄地 */
	--et-line:       #D8D3C6;
	--et-line-2:     #BFB8A6;

	--et-gutter:     clamp(16px, 4vw, 32px);
	--et-max:        1120px;
	--et-radius:     10px;
}

/* ── 全体 ───────────────────────────────────────────── */

body.et {
	background: var(--et-bg);
	color: var(--et-body);
	font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans",
		"Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .02em;
	word-break: normal;
	overflow-wrap: anywhere;
	line-break: strict;
}

body.et a {
	color: var(--et-accent-d);
	text-underline-offset: .2em;
}

body.et a:hover {
	color: var(--et-accent);
}

/* Arkhe のコンテナ幅を上書き */
body.et .l-container,
body.et .c-postContent {
	max-width: var(--et-max);
}

/* ── 見出し ─────────────────────────────────────────── */

body.et .c-postContent h2 {
	margin: 3em 0 1.2em;
	padding: .6em .9em;
	background: var(--et-ink);
	color: #FFF;
	font-size: clamp(19px, 2.4vw, 23px);
	font-weight: 700;
	line-height: 1.55;
	border-radius: var(--et-radius);
	letter-spacing: .03em;
}

body.et .c-postContent h3 {
	margin: 2.4em 0 1em;
	padding: 0 0 .4em .1em;
	border-bottom: 2px solid var(--et-accent);
	color: var(--et-ink);
	font-size: clamp(17px, 2vw, 20px);
	font-weight: 700;
	line-height: 1.6;
}

body.et .c-postContent h4 {
	margin: 2em 0 .8em;
	color: var(--et-ink);
	font-size: clamp(16px, 1.8vw, 18px);
	font-weight: 700;
	line-height: 1.65;
}

body.et .c-postContent p {
	margin: 0 0 1.5em;
	font-size: clamp(15px, 1.7vw, 16px);
}

body.et .c-postContent strong {
	font-weight: 700;
	color: var(--et-ink);
	background: linear-gradient(transparent 62%, rgba(196, 80, 43, .18) 62%);
}

/* ── リスト ─────────────────────────────────────────── */

body.et .c-postContent ul,
body.et .c-postContent ol {
	margin: 0 0 1.6em;
	padding-left: 1.4em;
}

body.et .c-postContent li {
	margin-bottom: .5em;
	font-size: clamp(15px, 1.7vw, 16px);
}

/* ── 表（このサイトの主役） ──────────────────────────── */

.et-table-wrap {
	margin: 1.8em 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--et-line);
	border-radius: var(--et-radius);
	background: var(--et-bg-2);
}

.et-table {
	width: 100%;
	min-width: 480px;
	border-collapse: collapse;
	font-size: 15px;
	line-height: 1.7;
}

.et-table caption {
	padding: .9em 1em;
	background: var(--et-bg-3);
	color: var(--et-ink);
	font-size: 14px;
	font-weight: 700;
	text-align: left;
	border-bottom: 1px solid var(--et-line);
}

/* 🔴 Arkhe の main.css は要素セレクタで th/td を持っている。詳細度で必ず上回る */
body.et .et-table th,
body.et .et-table td {
	padding: .85em 1em;
	border-bottom: 1px solid var(--et-line);
	text-align: left;
	vertical-align: middle;
	background: transparent;
}

body.et .et-table thead th {
	background: var(--et-ink);
	color: #FFF;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	border-bottom: none;
}

body.et .et-table tbody tr:nth-child(even) td {
	background: var(--et-bg-3);
}

body.et .et-table tbody tr:last-child td {
	border-bottom: none;
}

.et-table .et-num {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.et-table .et-strong {
	color: var(--et-ink);
	font-weight: 700;
}

.et-table--breakeven td.et-strong {
	color: var(--et-accent-d);
	font-size: 16px;
}

.et-note {
	margin: -.6em 0 2em;
	color: var(--et-mute);
	font-size: 14px;
	line-height: 1.8;
}

/* ── CTA ───────────────────────────────────────────── */

.et-cta {
	margin: 2.4em 0;
	padding: clamp(20px, 4vw, 30px);
	background: var(--et-accent-w);
	border: 1px solid #EBD3C8;
	border-radius: var(--et-radius);
	text-align: center;
}

.et-cta__lead {
	margin: 0 0 1.1em;
	color: var(--et-ink);
	font-size: clamp(15px, 1.8vw, 17px);
	font-weight: 700;
	line-height: 1.75;
}

.et-cta__btn {
	display: inline-block;
	max-width: 100%;
	padding: .95em 2.2em;
	background: var(--et-accent);
	color: #FFF !important;
	font-size: clamp(15px, 1.8vw, 17px);
	font-weight: 700;
	line-height: 1.5;
	text-decoration: none;
	border-radius: 999px;
	box-shadow: 0 3px 0 var(--et-accent-d);
	transition: transform .15s ease, box-shadow .15s ease;
}

.et-cta__btn:hover {
	transform: translateY(2px);
	box-shadow: 0 1px 0 var(--et-accent-d);
	color: #FFF !important;
}

.et-cta__note {
	margin: .9em 0 0;
	color: var(--et-mute);
	font-size: 14px;
}

/* ── PR表記 ────────────────────────────────────────── */

.et-pr {
	margin: 0 0 1.8em;
	color: var(--et-mute);
	font-size: 14px;
	line-height: 1.7;
}

/* ── 記事リスト ─────────────────────────────────────── */

.et-postlist {
	margin: 1.6em 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--et-line);
}

body.et .et-postlist li {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--et-line);
}

.et-postlist a {
	display: block;
	padding: .95em .2em .95em 1.4em;
	position: relative;
	font-size: 15px;
	line-height: 1.7;
	text-decoration: none;
	color: var(--et-body);
}

.et-postlist a::before {
	content: "";
	position: absolute;
	left: .3em;
	top: 1.45em;
	width: 6px;
	height: 6px;
	border-top: 2px solid var(--et-accent);
	border-right: 2px solid var(--et-accent);
	transform: rotate(45deg);
}

.et-postlist a:hover {
	background: var(--et-bg-3);
	color: var(--et-accent-d);
}

/* ── 年齢確認 ───────────────────────────────────────── */

.et-agegate {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--et-gutter);
	background: rgba(20, 53, 43, .96);
}

.et-agegate[hidden] {
	display: none;
}

.et-agegate__box {
	width: 100%;
	max-width: 480px;
	padding: clamp(24px, 6vw, 40px);
	background: var(--et-bg);
	border-radius: var(--et-radius);
	text-align: center;
}

.et-agegate__lead {
	margin: 0 0 1em;
	color: var(--et-mute);
	font-size: 14px;
	line-height: 1.8;
}

.et-agegate__q {
	margin: 0 0 1.6em;
	color: var(--et-ink);
	font-size: clamp(17px, 2.2vw, 20px);
	font-weight: 700;
}

.et-agegate__btns {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: center;
}

.et-agegate__yes {
	width: 100%;
	padding: .95em 1.5em;
	background: var(--et-accent);
	color: #FFF;
	font-size: 16px;
	font-weight: 700;
	border: none;
	border-radius: 999px;
	cursor: pointer;
}

.et-agegate__no {
	color: var(--et-mute);
	font-size: 14px;
	text-decoration: underline;
}

/* ── フッター ───────────────────────────────────────── */

.et-footer {
	padding: clamp(32px, 6vw, 52px) var(--et-gutter);
	background: var(--et-ink);
	color: #D9E2DD;
}

.et-footer__inner {
	max-width: var(--et-max);
	margin: 0 auto;
	text-align: center;
}

.et-footer__lead {
	margin: 0 0 1.8em;
	font-size: clamp(14px, 1.7vw, 16px);
	line-height: 1.95;
}

.et-footer__nav,
.et-footer__sub {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	justify-content: center;
	margin: 0 0 1.4em;
}

.et-footer__nav a {
	color: #FFF !important;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}

.et-footer__sub a {
	color: #A8BAB2 !important;
	font-size: 14px;
	text-decoration: none;
}

.et-footer__nav a:hover,
.et-footer__sub a:hover {
	text-decoration: underline;
}

.duga-credit {
	margin-top: 1.6em;
}

.duga-credit img {
	vertical-align: middle;
}

/* ── SP ────────────────────────────────────────────── */

@media (max-width: 600px) {
	body.et {
		font-size: 15px;
	}

	.et-table {
		font-size: 14px;
	}

	body.et .et-table th,
	body.et .et-table td {
		padding: .75em .8em;
	}
}

/* 逆引き表：単発より安くなるセル */
body.et .et-table--lookup td.et-win {
	background: var(--et-accent-w);
	color: var(--et-accent-d);
	font-weight: 700;
}

body.et .et-table--lookup tbody tr:nth-child(even) td.et-win {
	background: #F6E2D9;
}

/* ══════════════════════════════════════════════════════════
   TOPページ
   ══════════════════════════════════════════════════════════ */

.et-front-wrap {
	margin: 0;
}

/* ── ヒーロー ───────────────────────────────────────── */

.et-hero {
	padding: clamp(48px, 9vw, 96px) var(--et-gutter);
	background: linear-gradient(160deg, var(--et-ink) 0%, #0D251D 100%);
	color: #EAF0ED;
}

.et-hero__inner {
	max-width: var(--et-max);
	margin: 0 auto;
	text-align: center;
}

.et-hero__eyebrow {
	margin: 0 0 1.2em;
	color: #9FB6AC;
	font-size: clamp(13px, 1.6vw, 15px);
	font-weight: 700;
	letter-spacing: .12em;
}

.et-hero__title {
	margin: 0 0 .9em;
	color: #FFF;
	font-size: clamp(26px, 5vw, 46px);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .02em;
}

.et-hero__lead {
	margin: 0 auto 2.4em;
	max-width: 44em;
	font-size: clamp(15px, 1.8vw, 17px);
	line-height: 2;
}

.et-hero__lead strong {
	color: #F5C6A8;
	font-weight: 700;
}

.et-hero__figures {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(14px, 3vw, 28px);
	justify-content: center;
	margin: 0 0 2.6em;
}

.et-fig {
	flex: 1 1 170px;
	max-width: 240px;
	padding: clamp(16px, 3vw, 24px) 12px;
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--et-radius);
}

.et-fig__num {
	display: block;
	margin-bottom: .35em;
	color: #F09A6B;
	font-size: clamp(24px, 4vw, 34px);
	font-weight: 700;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
}

.et-fig__cap {
	display: block;
	color: #C4D3CC;
	font-size: 14px;
	line-height: 1.65;
}

.et-hero__btn {
	display: inline-block;
	max-width: 100%;
	padding: 1em 2.4em;
	background: var(--et-accent);
	color: #FFF !important;
	font-size: clamp(15px, 1.8vw, 17px);
	font-weight: 700;
	line-height: 1.5;
	text-decoration: none;
	border-radius: 999px;
	box-shadow: 0 3px 0 var(--et-accent-d);
	transition: transform .15s ease, box-shadow .15s ease;
}

.et-hero__btn:hover {
	transform: translateY(2px);
	box-shadow: 0 1px 0 var(--et-accent-d);
	color: #FFF !important;
}

/* ── セクション ─────────────────────────────────────── */

.et-sec {
	padding: clamp(40px, 7vw, 72px) var(--et-gutter);
	background: var(--et-bg);
}

.et-sec--alt {
	background: var(--et-bg-3);
}

.et-sec__inner {
	max-width: var(--et-max);
	margin: 0 auto;
}

.et-sec__title {
	margin: 0 0 .7em;
	color: var(--et-ink);
	font-size: clamp(21px, 3vw, 30px);
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}

.et-sec__title--sub {
	margin-top: 2.2em;
}

.et-sec__lead {
	margin: 0 auto 2em;
	max-width: 46em;
	color: var(--et-body);
	font-size: clamp(15px, 1.7vw, 16px);
	line-height: 1.95;
	text-align: center;
}

/* ── 番組カード ─────────────────────────────────────── */

.et-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin-top: 2em;
}

.et-card {
	display: flex;
	flex-direction: column;
	gap: .35em;
	padding: clamp(18px, 3vw, 24px);
	background: var(--et-bg-2);
	border: 1px solid var(--et-line);
	border-radius: var(--et-radius);
	text-decoration: none;
	transition: border-color .15s ease, transform .15s ease;
}

.et-card:hover {
	border-color: var(--et-accent);
	transform: translateY(-2px);
}

.et-card__name {
	color: var(--et-ink);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}

.et-card__price {
	color: var(--et-accent-d);
	font-size: 22px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1.3;
}

.et-card__price span {
	font-size: 13px;
	font-weight: 400;
	color: var(--et-mute);
}

.et-card__works {
	color: var(--et-body);
	font-size: 15px;
	font-variant-numeric: tabular-nums;
}

.et-card__note {
	margin-top: .3em;
	color: var(--et-mute);
	font-size: 13px;
	line-height: 1.7;
}

/* TOPではリストの上下余白を詰める */
.et-sec .et-postlist {
	margin-top: 1.2em;
}

/* TOPのPR表記（ヒーローの上・地色に合わせる） */
.et-pr-top {
	padding: 10px var(--et-gutter);
	background: var(--et-bg-3);
}

.et-pr-top .et-pr {
	max-width: var(--et-max);
	margin: 0 auto;
	font-size: 13px;
}
