/* 工種ページ：洗面所（共通部品は assets/css/sv-common.css） */

/* No.01 急ぎのとき */
.sv-urgent { display: flex; gap: 28px; align-items: center; padding: 18px 24px; background: var(--white); border: 2px solid var(--ink); }
.sv-stamp { display: inline-block; padding: 6px 16px; border: 3px solid var(--red); border-radius: 999px; color: var(--red); font-weight: 900; font-size: 15px; line-height: 1.6; transform: rotate(-3deg); }
.sv-urgent__stamp { flex-shrink: 0; }
.sv-urgent__text { font-size: 14.5px; line-height: 1.9; }

/* No.02 できる工事：グループごとのイラストつきカード */
.sv-items { display: flex; flex-direction: column; gap: 34px; }
.sv-items__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; font-weight: 900; font-size: 24px; line-height: 1.5; }
.sv-items__head::after { content: ""; flex: 1; border-bottom: 2px dashed var(--ink); }
.sv-items__text { margin-top: 6px; font-size: 14px; line-height: 1.85; color: var(--gray); }

/* No.04 契約の前に */
.sv-before { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 24px; }
.sv-before__card { display: flex; gap: 14px; align-items: flex-start; background: var(--white); border: 2px solid var(--ink); box-shadow: 8px 8px 0 var(--teal); padding: 22px 24px; min-width: 0; }
.sv-before__mark { font-family: var(--f-hand); font-weight: 600; font-size: 30px; color: var(--red); line-height: 1; }
.sv-before__title { font-weight: 900; font-size: 18px; line-height: 1.5; }
.sv-before__text { margin-top: 6px; font-size: 14.5px; line-height: 1.85; color: var(--gray); }

@media (max-width: 1199.98px) {
}
@media (max-width: 1023.98px) {
	.sv-urgent { flex-direction: column; align-items: flex-start; gap: 12px; }
	.sv-before { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
	.sv-urgent { gap: 10px; padding: 16px; }
	.sv-urgent__stamp { padding: 4px 14px; font-size: 14px; transform: rotate(-2deg); }
	.sv-urgent__text { font-size: 13.5px; }

	.sv-items { gap: 26px; }
	.sv-items__head { gap: 10px; margin-bottom: 12px; font-size: 20px; }
	.sv-items__list { grid-template-columns: 1fr; gap: 14px; }
	.sv-items__body { min-width: 0; }
	.sv-items__text { margin-top: 4px; font-size: 13px; line-height: 1.8; }

	.sv-before { gap: 16px; }
	.sv-before__card { gap: 12px; padding: 16px; box-shadow: 5px 5px 0 var(--teal); }
	.sv-before__mark { font-size: 24px; }
	.sv-before__title { font-size: 16px; line-height: 1.55; }
	.sv-before__text { margin-top: 4px; font-size: 13.5px; }
}