@charset "utf-8";
/* =============================================================================
 * ノーリツ ガスコンロ シリーズページ 共通CSS
 * /gasconro/noritz/css/noritz.css
 *
 *  【3層構成】
 *   ① ガスコンロ共通UI … /gasconro/css/series.css（.gc2-* のレイアウト一式）
 *      ※中身はメーカーに依存しないので、gasconro 直下の共通ディレクトリに置いている。
 *        リンナイもノーリツも同じファイルを読む（2026-09-07 に rinnai 配下から移動）。
 *   ② ノーリツ共通   … このファイル（ブランドの色調・ロゴ帯・見出しのトーン）
 *   ③ シリーズ固有   … /gasconro/noritz/<series>/css/<series>.css（最小限）
 *
 *  見出し（h2/h3 の heading_01）はサイト共通 /css/common.css のものをそのまま使う。
 *  メーカーごとに見出しの体裁を変えない（サイト内で見出しが混ざると読みにくい）。
 *  ノーリツの赤（#e60012）はヒーローのバッジなど、ごく一部の目印だけに使う。
 *  シリーズごとのアクセント色（--gc2-accent）は ③ で上書きする。
 * ========================================================================== */

/* ノーリツ共通の下敷き。--gc2-accent は各シリーズで必ず上書きする */
.gc2.noritz {
	--nz-red:      #e60012;   /* ノーリツの赤。要所のみ */
	--nz-ink:      #23201c;
	--nz-line:     #ded8cf;
	--nz-bg:       #faf8f5;   /* グレージュ。ノーリツ商品写真の背景に近い */
}

/* -----------------------------------------------------------------------------
 * ヒーロー
 *   ノーリツの商品写真は白〜ベージュの明るい背景が多いので、
 *   リンナイページ（白地）より少し暖かい下地にして写真をなじませる。
 * -------------------------------------------------------------------------- */
.gc2.noritz .gc2-hero {}
.gc2.noritz .gc2-hero__series { color: var(--nz-ink); }
/* シリーズ名の右に出す小さなバッジだけノーリツの赤を使う */
.gc2.noritz .gc2-hero__new { background: var(--nz-red); }

/* 見出しは上書きしない。h2/h3 の heading_01 はサイト共通のものを使う。 */

/* -----------------------------------------------------------------------------
 * 価格バー・表・枠の線をノーリツのグレージュに寄せる
 * -------------------------------------------------------------------------- */
.gc2.noritz .gc2-pricebar {}
.gc2.noritz .gc2-item,
.gc2.noritz .gc2-sec .card { border-color: var(--nz-line); }
.gc2.noritz .gc2-cmp th,
.gc2.noritz .gc2-cmp td { border-color: var(--nz-line); }

/* -----------------------------------------------------------------------------
 * ノーリツの「N」マークを模した箇条書きの点は作らない（商標のため）。
 * 代わりに角丸の小さな四角で、リンナイページの丸と見分けが付くようにする。
 * -------------------------------------------------------------------------- */
.gc2.noritz .gc2-fl dt::before {
	border-radius: 2px;
	width: 7px; height: 7px;
}

/* -----------------------------------------------------------------------------
 * メーカー横断で使う小物
 * -------------------------------------------------------------------------- */
/* 公式表記のバッジ（「マルチグリル」「ラックリーナ」など商標名の目印） */
.gc2.noritz .nz-tm {
	display: inline-block; padding: 1px 7px; margin: 0 2px;
	font-size: 11.5px; font-weight: bold; letter-spacing: 0;
	color: #7a5a12; background: #fdf6e3; border: 1px solid #e8d9a8; border-radius: 3px;
	white-space: nowrap; vertical-align: 1px;
}

/* -----------------------------------------------------------------------------
 * 写真つき解説のグリッド（ノーリツ共通）
 *   「写真＋見出し＋説明」を2列（SPは1列）で並べる形。共通CSS(series.css)には
 *   同じ用途のグリッドが無いため、メーカー共通のこの層で1本だけ持つ。
 *   ・is-wide … 図の中に文字が入っている横長の図は、縮小すると読めないので
 *               1行を使い切って実寸に近い大きさで出す。
 *   既存の各シリーズは .prg-/.orc-/.nst-/.mke-/.fam- で同じものを個別に持っている。
 *   新しいシリーズはこのクラスを使う（複製を増やさない）。
 *   既存4シリーズをこちらへ寄せるときは、各ページの class を同時に直すこと。
 * -------------------------------------------------------------------------- */
.gc2.noritz .nz-cards {
	list-style: none; margin: 0 10px; padding: 0;
	display: grid; grid-template-columns: 1fr; gap: 12px;
}
.gc2.noritz .nz-cards > li {
	border: 1px solid var(--gc2-line); border-radius: var(--gc2-radius);
	background: #fff; overflow: hidden;
}
.gc2.noritz .nz-cards > li::before { content: none; }
.gc2.noritz .nz-cards__fig { margin: 0; background: #fff; }
.gc2.noritz .nz-cards__fig img { display: block; width: 85%; height: auto; margin: 0 auto;text-align: center;margin-top: 5%}
.gc2.noritz .nz-cards__b { padding: 11px 13px 13px; }
.gc2.noritz .nz-cards__t { display: block; font-size: 16px; font-weight: bold; line-height: 1.35; }
.gc2.noritz .nz-cards__sub {
	display: inline-block; margin: 4px 0 0; padding: 2px 8px;
	font-size: 11.5px; font-weight: bold; line-height: 1.4;
	color: #fff; background: var(--gc2-accent); border-radius: 3px;
}
.gc2.noritz .nz-cards__d { margin: 7px 0 0; font-size: 13.5px; line-height: 1.75; }

@media screen and (min-width: 760px) {
	.gc2.noritz .nz-cards { grid-template-columns: 1fr 1fr; gap: 14px; }
	/* 文字入りの横長の図は1行使い切る */
	.gc2.noritz .nz-cards > li.is-wide { grid-column: 1 / -1; }
}