@charset "utf-8";
/* =============================================================================
 * リッセ（Lisse）固有CSS
 *
 *  レイアウト・UIは共通の /gasconro/css/series.css にある。
 *  このファイルはシリーズ固有の上書きだけを持つ。
 *  読み込み順は必ず series.css → このファイル。
 * ========================================================================== */

/* シリーズのアクセント色（リッセは上位クラスらしい落ち着いたブルーグレー） */
.gc2.lisse2 {
	--gc2-accent:    #1f3d52;
	--gc2-accent-bg: #eef3f7;
}

/* 後継機セクション：リッセは旧モデルの在庫販売が無く「型番の対応表」だけを出すため、
   1行に複数型番が並ぶ。サムネイル列が無い分だけ余白を整える。 */
.gc2.lisse2 .gc2-succ__to .gc2-succ__m { margin-bottom: 2px; }
.gc2.lisse2 .gc2-succ__to .gc2-succ__tag { margin-left: 5px; }

/* カラーは4色なので4列で並べる。
   共通CSS（series.css）の既定はマイトーンの5色に合わせた repeat(5,1fr)。
   共通側は触らず、ここでシリーズ限定で上書きする。 */
@media screen and (min-width: 768px) {
	.gc2.lisse2 .gc2-colors { grid-template-columns: repeat(4, 1fr); }
}
/* スマホは4列だと色名（スモーキーピンク等）が詰まるので2×2で並べる。
   共通側の既定は3列なので、4色だと1つだけ余ってしまう。 */
@media screen and (max-width: 767px) {
	.gc2.lisse2 .gc2-colors { grid-template-columns: repeat(2, 1fr); }
}

/* 型番の読み方一覧（.gc2-flags）：
   リッセは「J4 …… サテンシルバー」のようにラベルが長く、
   共通CSSの既定（9em）だと2行に折り返して読みにくい。
   共通側はマイトーンのラベル（「末尾が DFVW」など）に合わせてあるので触らず、
   ここでシリーズ限定で列幅を広げ、折り返しも止める。
   スマホは共通CSSで1カラムに切り替わるため上書き不要。 */
@media screen and (min-width: 768px) {
	.gc2.lisse2 .gc2-flags > li { grid-template-columns: 14em 1fr; }
	.gc2.lisse2 .gc2-flags b { white-space: nowrap; }
}

/* オプション画像は白背景で書き出してあるので、
   共通CSSの余白色（#f6f7f8）ではなく白でつなげる。 */
.gc2.lisse2 .gc2-opt__fig img { background: #fff; }

/* 施工実績データ：リッセは内訳が4つ（天板幅／天板カラー／レンジフード同時交換／モデル世代）。
   共通CSSは内訳3つのマイトーンに合わせて3枚目を全幅にしているため、
   そのままだと3枚目だけ横長になって不揃いになる。ここでは2×2に揃える。 */
@media screen and (min-width: 768px) {
	.gc2.lisse2 .gc2-idata__c:nth-of-type(3) { grid-column: auto; }
	.gc2.lisse2 .gc2-idata__c:nth-of-type(3) .gc2-bars__b { max-width: none; }
	.gc2.lisse2 .gc2-idata__c.is-wide { grid-column: 1 / -1; }
}