/* 共通ヘッダー・ボタン・入稿ガイドのレイアウトを再利用。 */
.install-page .sheet-breadcrumb { flex-wrap:wrap; }
.install-page .sheet-hero h1 { font-size:clamp(30px,3.7vw,46px); }
.install-assurance { display:flex; align-items:flex-start; gap:18px; padding:22px 26px; margin-top:26px; border:1px solid #dce4eb; border-left:4px solid var(--blue); background:#fff; border-radius:10px; }
.install-assurance > span { color:var(--blue); font-size:26px; font-weight:800; }
.install-assurance strong { font-size:19px; }
.install-assurance p { color:var(--muted); margin-top:6px; }
.install-methods { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:26px; }
.install-method { border:1px solid #dce4eb; border-radius:12px; overflow:hidden; background:#fff; transition:border-color .2s; }
.install-method:hover,.install-products > a:hover { border-color:var(--blue); }
.install-method img { width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; display:block; }
.install-method > div { padding:26px; }
.install-method h3 { display:flex; justify-content:space-between; gap:12px; margin:12px 0; }
.install-method p,.install-tools p,.install-step-heading + img + p,.install-surfaces article > p:last-child,.install-mistakes p,.install-print-calp p { color:var(--muted); font-size:15px; line-height:1.9; }
.install-tag { display:inline-block; color:var(--blue); background:var(--blue-soft); font-size:12px; font-weight:700; padding:4px 10px; border-radius:4px; }
.install-image-note { font-size:12px; color:var(--muted); margin-top:18px; }
.install-tools { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; list-style:none; margin:26px 0; }
.install-tools li { padding:22px; border:1px solid #dce4eb; background:#fff; border-radius:10px; }
.install-tools svg { width:34px; height:34px; color:var(--blue); margin-bottom:12px; }
.install-tools h3 { font-size:16px; margin-bottom:8px; }
.install-tools p { font-size:14px; }
.install-note,.install-warning,.install-layers { padding:22px 26px; background:var(--cream); border:1px solid var(--line); border-radius:10px; margin:26px 0; }
.install-note strong,.install-warning strong,.install-layers strong { display:block; font-size:17px; }
.install-note p,.install-warning p { margin-top:8px; color:var(--muted); }
.install-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; list-style:none; margin-top:32px; }
.install-steps > li { min-width:0; }
.install-step-heading { margin-bottom:14px; min-height:78px; }
.install-step-heading > span { color:var(--blue); font:800 12px 'DM Sans',sans-serif; letter-spacing:.12em; }
.install-step-heading h3 { margin-top:8px; }
.install-steps img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:10px; background:#eef2f6; }
.install-steps li > p { margin-top:16px; }
.install-print-calp { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:32px; margin-top:40px; padding:26px; border:1px solid #dce4eb; border-radius:12px; background:var(--cream); }
.install-print-calp img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:8px; }
.install-print-calp h3 { margin-top:12px; }
.install-print-calp p { margin:12px 0 18px; }
.install-layers { background:#fff; }
.install-layers p { display:flex; flex-wrap:wrap; gap:12px; margin:14px 0; }
.install-layers p span { padding:6px 12px; background:var(--blue-soft); color:var(--blue); border-radius:4px; font-size:14px; font-weight:700; }
.install-layers small { color:var(--muted); font-size:14px; }
.install-surfaces { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.install-surfaces article { padding:24px; border:1px solid #dce4eb; border-radius:10px; }
.install-rating { color:var(--blue); margin:12px 0; font-size:14px; }
.install-rating strong { font-size:24px; margin-left:8px; }
.install-warning { border-left:4px solid var(--orange); }
.install-mistakes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:24px; }
.install-mistakes article { padding:24px; border:1px solid #dce4eb; border-radius:10px; background:#fff; }
.install-mistakes article > span { font:800 13px 'DM Sans',sans-serif; color:var(--blue); }
.install-mistakes h3 { margin:10px 0 12px; }
.install-products { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:28px; }
.install-products > a { display:block; min-width:0; border:1px solid #dce4eb; border-radius:12px; overflow:hidden; background:#fff; }
.install-products img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; }
.install-products > a > div { padding:22px; }
.install-products h3 { font-size:18px; }
.install-products p { font-size:14px; color:var(--muted); margin:10px 0 16px; }
.install-products div > span { color:var(--blue); font-size:14px; font-weight:700; }
.install-cta { text-align:center; }
.install-cta > p { color:var(--muted); }
.install-cta .button { margin-top:28px; }
@media(max-width:1000px) { .install-surfaces,.install-mistakes,.install-products { grid-template-columns:repeat(2,minmax(0,1fr)); } .install-tools { grid-template-columns:repeat(4,minmax(0,1fr)); } .install-tools li { padding:18px; } }
@media(max-width:800px) { .install-steps { grid-template-columns:1fr; gap:32px; } .install-step-heading { min-height:0; } .install-print-calp { grid-template-columns:1fr; gap:22px; } .install-tools { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .install-methods,.install-surfaces,.install-mistakes,.install-products { grid-template-columns:1fr; gap:20px; } .install-assurance { padding:18px; gap:12px; } .install-assurance strong { font-size:17px; } .install-method > div,.install-surfaces article,.install-mistakes article,.install-print-calp { padding:20px; } .install-tools li { padding:16px; } .install-tools h3 { font-size:15px; } .install-tools p { font-size:14px; } .install-note,.install-warning,.install-layers { padding:18px; } .install-cta .button { width:100%; min-width:0; gap:16px; } .install-cta h2 { font-size:24px; } }

/* 立体文字は旧ページの実際の施工写真で、原稿の準備から順に案内。 */
.install-arrival { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-top:28px; }
.install-arrival article { min-width:0; padding:24px; border:1px solid #dce4eb; border-radius:12px; background:#fff; }
.install-arrival figure,.install-step-photos figure { margin:0; min-width:0; }
.install-arrival img,.install-steps--kanji img { display:block; width:100%; max-width:300px; height:auto; aspect-ratio:4/3; object-fit:contain; margin-inline:auto; border-radius:8px; }
.install-arrival h3 { margin:20px 0 10px; font-size:20px; }
.install-arrival p,.install-steps--kanji > li > p { color:var(--muted); font-size:15px; line-height:1.9; }
.install-step-photos--pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.install-step-photos figcaption { margin-top:10px; font-size:14px; line-height:1.7; color:var(--muted); }
@media(max-width:600px) { .install-arrival { grid-template-columns:1fr; gap:20px; } .install-arrival article { padding:20px; } .install-step-photos--pair { grid-template-columns:1fr; gap:20px; } }

/* 作業前確認と原稿から取り付けまでの見通し。 */
.install-page .install-tool-use { display:inline-block; margin-bottom:10px; padding:3px 8px; border-radius:4px; background:var(--blue-soft); color:var(--blue-deep); font-size:11px; font-weight:700; }
.install-page .install-surface-label { display:block; margin:12px 0; padding:8px 10px; border-radius:6px; background:var(--blue-soft); color:var(--blue-deep); font-size:13px; font-weight:700; }
.install-page .install-overview { padding:22px; border:1px solid #dce4eb; border-radius:12px; background:var(--blue-soft); margin-top:26px; }
.install-page .install-overview ol { display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin-top:12px; }
.install-page .install-overview li { display:flex; align-items:center; gap:10px; }
.install-page .install-overview li:not(:last-child)::after { content:'→'; color:var(--blue); }
.install-page .install-overview a { display:flex; align-items:center; min-height:44px; padding:8px 12px; border-radius:6px; background:#fff; color:var(--blue); font-size:14px; font-weight:700; }
.install-page .install-print-calp figure { min-width:0; }
.install-page .install-print-calp figcaption { margin-top:10px; color:var(--muted); font-size:12px; }
@media(max-width:600px) {
 .install-page .install-overview { padding:18px; }
 .install-page .install-overview ol { flex-direction:column; gap:8px; }
 .install-page .install-overview li { flex-direction:column; gap:8px; }
 .install-page .install-overview li:not(:last-child)::after { content:'↓'; }
 .install-page .install-overview a { width:100%; justify-content:center; }
}
