/* =====================================================================
   記事の中タイトル（V16.0 2026-11-02）
   ・出力：<h2 class="nrocks-title"><span class="nrocks-title__text">中タイトル</span></h2>
   ・ショートコード [tl01] とブロック「中タイトル」で共通。公開ページと編集画面の両方で読み込む（functions.php の nrocks_enqueue_title_assets()）
   ・書式：左にトンボの線（記事一覧のタイトルの左と同じ横線）＋ 記事の幅いっぱいの下線（同じ色の実線）
   ・線の長さ・間・色は main.css の :root の --trim-mark-length / --trim-mark-gap / --trim-mark-color をそのまま使う
   ===================================================================== */
.nrocks-title {
	position: relative;
	margin: 30px 0 10px;          /* ★ 上：前の段落との間隔／下：次の要素との間隔（段落の上の 5px とは重なって 10px のまま） */
	padding: 0 0 .1em;            /* ★ 文字と下線の間（.35em → .1em 2026-11-02） */
	border-bottom: 1px solid var(--trim-mark-color, #bcbcbc);   /* ★ 下線：トンボの線と同じ色の実線（サイトの罫線はほぼ実線のため。点線も試した。720px 未満はトンボの線が出ないので、この下線が中タイトルの目印になる） */
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-size: 13.2px;            /* ★ 文字の大きさ（本文 12px の 1.1倍） */
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	color: #3c3c3b;
}

/* 左のトンボの線：列の外、1行目の文字の頭の高さ（記事一覧のタイトルと同じ形）
   ・トンボの線はサイト全体で 720px 以上のときだけ表示しているので、ここも同じ */
@media (min-width: 720px) {
	.nrocks-title::before {
		content: "";
		position: absolute;
		top: .3em;                /* ★ 1行目の文字の頭（行の高さ 1.5em と文字の高さの差の半分くらい） */
		left: calc((var(--trim-mark-length, 20px) + var(--trim-mark-gap, 10px)) * -1);
		width: var(--trim-mark-length, 20px);
		border-top: 1px solid var(--trim-mark-color, #bcbcbc);
		pointer-events: none;
	}
}

/* 本文の最初が中タイトルのときは、上の間隔をなくす */
.content > .nrocks-title:first-child {
	margin-top: 0;
}