@charset "UTF-8";
/**
 * 結婚相談所のすゝめの記事 6 本で、移行元スマホ版だけが持つ目次と cta02 を携帯幅だけ出す
 * （Bug #8391・ユーザー決定 D575）。
 *
 * 🚨 **幅 750px 以上は 1px も動かさない。**足した 2 つ（`.pa-word-sp-toc`・`.pa-word-sp-cta02`）は
 * 既定で伏せ、携帯幅の規則だけが出す。上の導線（`.pa-word-sp-toc-pc-cta`）を伏せるのも携帯幅だけ。
 *
 * この CSS は 6 本にだけ配られる（`inc/word-sp-toc.php` の `pa_word_sp_toc_enqueue()`）。
 * 配る側と差し込む側は同じ判定関数を呼ぶ.
 */

.pa-word-sp-toc,
.pa-word-sp-cta02 {
	display: none;
}

@media (max-width: 749px) {
	.pa-word-sp-toc,
	.pa-word-sp-cta02 {
		display: block;
	}

	/* 移行元スマホ版は記事の上に導線を置かない（パソコン版だけが `word/include/cta.shtml` を持つ）. */
	.pa-word-sp-toc-pc-cta {
		display: none;
	}

	/*
	 * 目次。写し元は移行元 `sp/word/css/style.css` の 834〜912 行。移行元は `rem` で書き、
	 * 根の字の大きさは 13px である（実測 2026-09-25・幅 375・目次の 1 段目のリンク 1.2rem が 15.6px）。
	 * dev の根の字の大きさは違うので、ここでは 13px を掛けた px で書く.
	 */
	.pa-word-sp-toc .table-of-contents {
		counter-reset: count;
		margin: 0 0 45px;
		padding: 13px 3%;
		border: 1px solid #ccc;
		border-radius: 6px;
		overflow: hidden;
		line-height: 1.5;
	}

	.pa-word-sp-toc .table-of-contents::before {
		content: "目次";
		display: block;
		margin-bottom: 20px;
		font-size: 16.9px;
		font-weight: bold;
		text-align: center;
	}

	/*
	 * 🚨 **行送りは項目にも書く。**移行元は目次の 1.5 を項目とリンクが受け継ぐが、dev は
	 * テーマの規則で `normal` に戻る（実測 2026-09-25・目次の高さが 28px 高かった）.
	 */
	.pa-word-sp-toc .table-of-contents > li {
		position: relative;
		margin: 0 0 0.5em 1em;
		list-style-type: none;
		font-size: 19.5px;
		font-weight: bold;
		line-height: 1.5;
	}

	.pa-word-sp-toc .table-of-contents li a {
		display: block;
		color: #a3762b;
		font-size: 15.6px;
		line-height: 1.5;
		text-decoration: none;
		transition: 0.15s ease-in-out;
	}

	.pa-word-sp-toc .table-of-contents > li > a::before {
		content: counter(count) ".";
		position: absolute;
		right: 100%;
		padding-right: 0.3em;
		color: #a3762b;
		counter-increment: count;
		transition: 0.15s ease-in-out;
	}

	/* 入れ子の並びの外余白の em は、移行元と同じ 13px を基準にする（移行元の計算値 0 / 13px / 26px）. */
	.pa-word-sp-toc .table-of-contents li ul {
		counter-reset: subcount;
		margin: 0 0 1em 2em;
		padding: 0;
		font-size: 13px;
	}

	.pa-word-sp-toc .table-of-contents li ul li {
		position: relative;
		margin: 4px 0 0;
		list-style: none;
		font-size: 18.2px;
		font-weight: normal;
		line-height: 1.5;
	}

	.pa-word-sp-toc .table-of-contents ul li a {
		padding: 0.2em 0;
		color: #454545;
	}

	.pa-word-sp-toc .table-of-contents li > ul li a::before {
		content: counter(count) "-" counter(subcount);
		display: inline-block;
		position: absolute;
		top: 0.2em;
		right: calc(100% + 0.5em);
		padding-right: 0.5em;
		letter-spacing: 0;
		white-space: nowrap;
		counter-increment: subcount;
	}

	.pa-word-sp-toc .table-of-contents li ul li a::after {
		content: "";
		display: block;
		position: absolute;
		top: 0.5em;
		left: -0.5em;
		width: 1px;
		height: 1em;
		background: #a7a7a7;
	}
}