@charset "utf-8";
/************************
 * 記事本文 h2 / h3 — 見本サイト（/will/）デザインに合わせ込み
 * 参照元: 見本 default.css の #main .section h2 / h3
 *   h2: bg h2_bg.png(repeat-x) / 22.4px / height50 / lh55 / pl20 / #333
 *   h3: bg h3_bg.png(bottom) / 19.6px / height50 / lh50 / pl20 / #669900
 * SANGO はカスタマイザーのインライン <style> で .entry-content h2/h3 に
 * !important 付きの装飾（h2 赤文字+::after罫線 / h3 左赤バー grad）を当てる。
 * → 同セレクタ(0,1,1)より高い #main .entry-content(1,1,1) + !important で確実に上書き。
 * 画像は CORS 回避のため子テーマに自前ホスト（assets/img/）。
 ************************/

/* ---- h2 ----
 * 見本 h2_bg.png(710×57) の構造を CSS で再現:
 *   上5px 緑バー #72aa00 / フィル #eaf2d9 / 下2px #cfe2a8
 * 画像(横帯・固定高)だと長い見出しが折り返した際に2行目が背景外に出るため、
 * height:auto + 縦padding + 背景色/上下ボーダーにして複数行でも全行に背景が乗るようにする。
 */
#main .entry-content h2 {
	display: block !important;
	box-sizing: border-box !important;
	min-height: 50px !important;
	height: auto !important;
	padding: 9px 15px 9px 20px !important;
	line-height: 1.5 !important;          /* 折り返し可・複数行で読みやすく */
	font-size: 22.4px !important;
	font-weight: bold !important;
	margin: 0 0 20px !important;
	color: #333333 !important;
	background: #eaf2d9 !important;        /* 薄緑フィル */
	border: none !important;
	border-top: 5px solid #72aa00 !important;    /* 緑バー */
	border-bottom: 2px solid #cfe2a8 !important; /* 下線 */
	white-space: normal !important;              /* SANGO の nowrap を解除し折り返す */
	overflow-wrap: break-word !important;        /* 長い語も折り返す */
	word-break: normal !important;
}

/* SANGO の装飾用擬似要素（赤い罫線等）を除去 */
#main .entry-content h2::before,
#main .entry-content h2::after {
	content: none !important;
	display: none !important;
}

/* ---- h3 ---- */
#main .entry-content h3 {
	display: block !important;
	box-sizing: content-box !important;
	padding: 0 0 0 20px !important;
	height: 50px !important;
	line-height: 50px !important;
	font-size: 19.6px !important;
	font-weight: bold !important;
	margin: 0 0 20px !important;
	color: #669900 !important;
	background: url(../img/h3_bg.png) bottom no-repeat !important;
	border: none !important;
}

#main .entry-content h3::before,
#main .entry-content h3::after {
	content: none !important;
	display: none !important;
}

/* ---- h4 ---- 緑のフルワイド下線のみ（太字・装飾は下線だけ） */
#main .entry-content h4 {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	margin: 1.6em 0 1em !important;
	padding: 0 0 8px !important;
	line-height: 1.5 !important;
	font-size: 18px !important;
	font-weight: bold !important;
	color: #333333 !important;
	background: none !important;
	border: none !important;
	border-bottom: 2px solid #669900 !important;   /* 緑のフル幅下線 */
	white-space: normal !important;
	overflow-wrap: break-word !important;
}

#main .entry-content h4::before,
#main .entry-content h4::after {
	content: none !important;
	display: none !important;
}

/************************
 * TOPページ（フロント / body.home）のみ h2 を変更
 *   太字 ＋ マーカー風の緑アンダーライン（/will の緑バーは解除）
 *   body.home(1,2,3) > #main .entry-content(1,1,1) で確実に上書き。
 ************************/
body.home #main .entry-content h2 {
	display: table !important;          /* 文字幅に収縮させ下線を文字幅に合わせる */
	box-sizing: content-box !important;
	width: auto !important;
	height: auto !important;
	margin: 1.2em auto 0.9em !important; /* auto で中央寄せ */
	padding: 0 6px 6px !important;
	line-height: 1.5 !important;
	font-size: 26px !important;
	font-weight: 800 !important;
	color: #333333 !important;
	background: none !important;         /* h2_bg.png 緑バーを解除 */
	text-align: center !important;
	border: none !important;
}

/* マーカー風アンダーライン（::after を再有効化して描画） */
body.home #main .entry-content h2::after {
	content: '' !important;
	display: block !important;
	width: 100% !important;
	height: 10px !important;
	margin-top: 2px !important;
	background: linear-gradient(180deg, #9bcf4f 0%, #7eb52f 100%) !important;
	transform: skewX(-12deg);            /* ブラシ風に少し傾ける */
	border-radius: 2px;
}