@charset "UTF-8";
/*
 * 2026-09-27 のサイト監査で見つかった表示崩れの手直し。
 * 既存の CSS の後に読むので、ここでの指定が優先される。
 */

/* ============================================= 年齢確認（最初から表示する） */

/* head 内のスクリプトが <html> に md-age-pending を付けたら、JS を待たずに確認画面を出す。 */
html.md-age-pending .md-agegate[hidden] {
	display: flex;
}

html.md-age-pending,
html.md-age-pending body {
	overflow: hidden;
}

/* ============================================ 特集の「掲載作品の目次」 */

/*
 * 特集本文は .md-prose（文章ページ用の書式）の中にあるため、番号付きリストの飾り
 * （ピンクの丸数字と左の余白）が目次にも付き、番号が「10 10」のように二重になっていた。
 * さらに .md-prose ol の縦並びが勝って、PC の2列表示も効いていなかった。
 */
.md-prose .md-ftoc__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 24px;
	margin: 0;
	padding: 0 22px 18px;
	counter-reset: none;
}

.md-prose .md-ftoc__item {
	padding-left: 0;
	min-height: 0;
	counter-increment: none;
	font-size: 14px;
	line-height: 1.6;
}

.md-prose .md-ftoc__item::before {
	content: none;
	display: none;
}

/* ================================================================ 作品詳細 */

/* Cocoon の記事テンプレートをやめたので、題名の見出しはここで整える。 */
.md-ihead {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 14px 0 22px;
}

.md-ihead__title {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	font-family: var(--md-font-round);
	font-weight: 800;
	font-size: 26px;
	line-height: 1.45;
	color: var(--md-ink);
	text-wrap: pretty;
}

.md-ihead__date {
	margin: 0;
	font-size: 12px;
	color: var(--md-ink-3);
}

/*
 * 作品カードの題名（h3）に記事用の見出し装飾（22px・枠線・余白）が付かないようにする。
 * 以前は関連作品のカードで題名が大きすぎて途中で切れていた。
 */
.md-itembody .md-card__title,
.entry-content .md-card__title,
.article .md-card__title {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	font-size: 13px;
	line-height: 1.45;
}

.md-itembody .md-card__title::before,
.md-itembody .md-card__title::after,
.entry-content .md-card__title::before,
.entry-content .md-card__title::after {
	content: none;
}

/* ============================================================ トップ */

.md-front-features {
	margin-top: 56px;
}

/* ============================================================ フッター */

.md-footer__credit {
	margin: 0;
	font-size: 11px;
	color: var(--md-ink-3);
}

.md-footer__credit a {
	color: var(--md-ink-3);
	text-decoration: underline;
}

/* ================================================================ スマホ */

@media screen and (max-width: 834px) {
	.md-prose .md-ftoc__list {
		grid-template-columns: minmax(0, 1fr);
		padding: 0 16px 14px;
	}

	.md-ihead { margin: 8px 0 16px; }
	.md-ihead__title { font-size: 20px; }

	.md-itembody .md-card__title,
	.entry-content .md-card__title,
	.article .md-card__title { font-size: 12.5px; }

	.md-front-features { margin-top: 40px; }

	/* 画面下の購入バーと「ページ上部へ」ボタンが重ならないようにする。 */
	.single-doujin .go-to-top {
		bottom: calc(84px + env(safe-area-inset-bottom));
	}
}
