/* 注文住宅（/house/ 配下）の共通の見た目
   ヘッダーまわりは inc/ietate/header.css にある。 */

/* 記事一覧のサムネイルの比率。
   イエタテの記事のアイキャッチは 1200x630（630/1200 = 52.5%）なので、
   SWELLの既定（61.805%）のままだと左右が切れる。 */
body.house_wrapper {
	--card_posts_thumb_ratio: 52.5%;
	--list_posts_thumb_ratio: 52.5%;
	--thumb_posts_thumb_ratio: 52.5%;
	--big_posts_thumb_ratio: 52.5%;
	--blogcard_thumb_ratio: 52.5%;
}

/* ページタイトルを出す
   フドナビは本文先頭の見出し帯をタイトル代わりにするため .c-pageTitle を
   隠しているが、イエタテの一覧・記事は元サイトと同じくタイトルを出す。
   /house/ のTOPだけはメインビジュアルが主役なので出さない。 */
body.house_wrapper.ietate_page:not(.ietate_front):not(.ietate_archive) .c-pageTitle {
	display: block;
}

/* タイトルまわりの余白を元サイト（SWELLの既定）に戻す
   フドナビは `.page .l-content { padding-top: 0 }` と
   `.l-mainContent__inner > .post_content { margin-top: 0 !important }` で
   詰めているが、タイトルを出すイエタテのページでは余白が必要。 */
body.house_wrapper.ietate_page:not(.ietate_front):not(.ietate_archive) .l-content {
	padding-top: 2em;
}

body.house_wrapper.ietate_page:not(.ietate_front):not(.ietate_archive) .l-mainContent__inner > .post_content {
	margin-top: 2em !important;
}

@media (min-width: 600px) {
	body.house_wrapper.ietate_page:not(.ietate_front):not(.ietate_archive) .l-content {
		padding-top: 4em;
	}
}

/* ==========================================================================
   見出しと基本色をイエタテにそろえる（2026-10-02 本人指示）

   SWELLの見出しデザイン・メインカラーは11事業で共通の設定なので変えられない。
   イエタテのページだけCSSで上書きする。元サイトの設定は
   h2 = b_left2 / h3 = main_gray / h4 = left_line、メインカラー #1E3A5F、
   本文色 #2B2B2B（SWELLの生成するCSSと同じものを書いている）。
   ========================================================================== */

body.house_wrapper.ietate_page {
	--color_main: #1E3A5F;
	--color_htag: #1E3A5F;
	--color_text: #2B2B2B;
}

/* H2 … 左に8pxの縞（b_left2）。フドナビの「塗り」を打ち消す */
body.house_wrapper.ietate_page .post_content h2:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title)) {
	background: none;
	color: var(--color_text, #2B2B2B);
	border-radius: 0;
	padding: .5em 0 .5em 24px;
}

body.house_wrapper.ietate_page .post_content h2:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title))::before {
	content: "";
	left: 0;
	top: 0;
	bottom: auto;
	width: 8px;
	height: 100%;
	border: 0;
	box-sizing: border-box;
	background: repeating-linear-gradient(var(--color_htag) 0%, var(--color_htag) 50%, rgba(30, 58, 95, .15) 50%, rgba(30, 58, 95, .15) 100%);
}

/* H3 … 下に2pxの線。左の29.3%だけネイビー（main_gray） */
body.house_wrapper.ietate_page .post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title)) {
	padding: 0 .5em .5em;
}

body.house_wrapper.ietate_page .post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title))::before {
	content: "";
	left: 0;
	bottom: 0;
	top: auto;
	width: 100%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--color_htag) 0%, var(--color_htag) 29.3%, rgba(150, 150, 150, .2) 29.3%, rgba(150, 150, 150, .2) 100%);
}

/* よくある質問は元サイトと同じく開いた状態で出す
   フドナビは style.css と parts/js/faq.js で開閉式にしているが、
   イエタテのページでは閉じない（JSの読み込みは inc/faq.php 側で止めている）。 */
html.fn-js body.house_wrapper.ietate_page .swell-block-faq__item > .faq_a {
	display: block;
}

html.fn-js body.house_wrapper.ietate_page .swell-block-faq .faq_q {
	padding-right: 0;
	cursor: auto;
}

html.fn-js body.house_wrapper.ietate_page .swell-block-faq .faq_q:hover {
	background-color: transparent;
}

html.fn-js body.house_wrapper.ietate_page .swell-block-faq .faq_q::after {
	content: none;
}

/* 都道府県ページ（フドナビの見出し帯を出さないページ）はタイトルを見せる */
body.house_wrapper.ietate_areahead .c-pageTitle {
	display: block;
}

/* ブロックの色パレット「メインカラー」もイエタテのネイビーにする
   （見出しの is-style-section_ttl などは has-swl-main-background-color
   というクラスで、SWELLのCSS変数ではなくWordPressのパレット変数を使う） */
body.house_wrapper.ietate_page {
	--wp--preset--color--swl-main: #1E3A5F;
}

/* ボタンの色を元サイトと同じ（SWELLの既定）に戻す
   フドナビは .house_wrapper .is-style-btn_normal の --the-btn-bg を
   事業カラーの単色で !important 上書きしているが、イエタテは
   SWELL既定のグラデーション（見学予約の red_ はオレンジ）を使っている。 */
body.house_wrapper.ietate_page .is-style-btn_normal,
body.house_wrapper.ietate_page .is-style-btn_shiny {
	--the-btn-bg: linear-gradient(100deg, var(--the-btn-color) 0%, var(--the-btn-color2) 100%) !important;
}

/* 「この記事を書いた人」（SWELLの著者枠と同じ見た目にそろえる） */
body.house_wrapper.ietate_page .p-ietateAuthor .p-authorBox__name {
	display: block;
	margin-top: .4em;
	font-weight: 700;
}

body.house_wrapper.ietate_page .p-ietateAuthor__note {
	margin: .8em 0 0;
	color: var(--color-text-muted, #6B6B6B);
}

body.house_wrapper.ietate_page .p-ietateAuthor__mark {
	display: block;
	width: 100px;
	height: 100px;
	margin: 0 auto;
	border-radius: 50%;
	background: var(--color_main, #1E3A5F);
}