@charset "UTF-8";
/* 住まいガイド専用。すべて .sg-guide 内に限定し、既存ページの装飾を変更しない。PC/SP同一内容。 */
.sg-guide { --sg-accent:#176956; --sg-tint:#eef5f1; --sg-ink:#253e36; --sg-line:#dedfd9; box-sizing:border-box; background:#f8f8f4; color:#283830; font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif; font-size:16px; line-height:1.9; }
.sg-guide *, .sg-guide *::before, .sg-guide *::after { box-sizing:border-box; }
.sg-guide .sg-theme-buy, .sg-guide.sg-theme-buy { --sg-accent:#a33760; --sg-tint:#faf0f3; }
.sg-guide .sg-theme-rent, .sg-guide.sg-theme-rent { --sg-accent:#146a96; --sg-tint:#edf6fb; }
.sg-guide a, .sg-guide a:visited { color:var(--sg-accent); text-underline-offset:4px; }
.sg-guide a:hover { text-decoration-thickness:2px; }
.sg-guide a:focus-visible { outline:3px solid #765614; outline-offset:5px; }
.sg-guide h1, .sg-guide h2, .sg-guide h3 { color:var(--sg-ink); font-weight:700; overflow-wrap:anywhere; }
.sg-guide .sg-shell { max-width:1160px; margin:0 auto; padding:20px 32px 36px; }
.sg-guide .sg-breadcrumb { font-size:12px; margin:0 0 22px; color:#57665f; }
.sg-guide .sg-breadcrumb ol { display:flex; flex-wrap:wrap; gap:4px 12px; list-style:none; padding:0; }
.sg-guide .sg-breadcrumb li:not(:last-child)::after { content:"/"; padding-left:12px; color:#87938b; }
.sg-guide .sg-eyebrow { font-size:12px; letter-spacing:.12em; font-weight:700; color:var(--sg-accent); margin:0 0 12px; }
.sg-guide .sg-hub-hero { padding:28px 0 36px; border-bottom:1px solid var(--sg-line); }
.sg-guide .sg-hub-hero h1 { font-size:38px; line-height:1.5; margin:0 0 20px; letter-spacing:.03em; }
.sg-guide .sg-hub-hero p:last-child { color:#506058; font-size:16px; }
.sg-guide .sg-mobile-break { display:none; }
.sg-guide .sg-category-nav { display:flex; gap:16px; margin:24px 0 40px; }
.sg-guide .sg-category-link { display:flex; align-items:center; justify-content:space-between; gap:15px; width:50%; min-height:58px; padding:12px 22px; border:1px solid var(--sg-accent); border-radius:4px; text-decoration:none; background:#fff; font-weight:700; }
.sg-guide .sg-category-link:hover, .sg-guide .sg-selected { background:var(--sg-tint); }
.sg-guide .sg-category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
.sg-guide .sg-category { scroll-margin-top:24px; min-width:0; }
.sg-guide .sg-category-heading { padding:0 0 20px 18px; border-left:4px solid var(--sg-accent); }
.sg-guide .sg-category-heading h2 { font-size:25px; line-height:1.4; margin:0 0 10px; }
.sg-guide .sg-category-heading p:last-child { font-size:14px; color:#506058; }
.sg-guide .sg-category-heading .sg-eyebrow { margin-bottom:6px; }
.sg-guide .sg-card-list { display:grid; gap:24px; margin-top:24px; }
.sg-guide .sg-card { background:#fff; border:1px solid var(--sg-line); border-radius:6px; overflow:hidden; }
.sg-guide .sg-card-link { display:block; text-decoration:none; height:100%; }
.sg-guide .sg-card-link:hover { background:var(--sg-tint); }
.sg-guide .sg-card-copy { padding:24px; }
.sg-guide .sg-card h3 { font-size:22px; line-height:1.65; margin:12px 0; }
.sg-guide .sg-card p { color:#506058; font-size:15px; margin:0 0 22px; }
.sg-guide .sg-tag { display:inline-block; background:var(--sg-tint); color:var(--sg-accent); font-size:12px; font-weight:700; padding:4px 11px; border-radius:3px; letter-spacing:.04em; }
.sg-guide .sg-read { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--sg-line); padding-top:14px; font-size:14px; font-weight:700; }
.sg-guide .sg-photo { margin:0; overflow:hidden; position:relative; background:var(--sg-tint); }
.sg-guide .sg-photo--card { aspect-ratio:16/9; }
.sg-guide .sg-photo--hero { min-height:300px; }
.sg-guide .sg-photo img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; display:block; }
.sg-guide .sg-photo figcaption { position:absolute; bottom:8px; right:10px; padding:2px 7px; background:rgba(255,255,255,.92); color:#4c5751; font-size:11px; }
.sg-guide .sg-photo-placeholder { position:absolute; inset:16px; border:1px solid var(--sg-accent); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--sg-accent); padding:12px; text-align:center; }
.sg-guide .sg-photo-placeholder svg { width:64px; height:64px; flex-shrink:0; }
.sg-guide .sg-photo-placeholder span { font-size:16px; letter-spacing:.08em; }
.sg-guide .sg-photo-placeholder small { font-size:10px; letter-spacing:.16em; }
.sg-guide .sg-article-hero { display:grid; grid-template-columns:1.25fr 1fr; border-top:4px solid var(--sg-accent); background:#fff; margin-bottom:42px; }
.sg-guide .sg-hero-copy { padding:32px; }
.sg-guide .sg-hero-copy .sg-eyebrow { margin:18px 0 12px; }
.sg-guide .sg-hero-copy h1 { font-size:30px; line-height:1.6; margin:0 0 18px; }
.sg-guide .sg-title-part { display:inline-block; max-width:100%; }
.sg-guide .sg-hero-deck { font-size:14px; color:#506058; }
.sg-guide .sg-byline { font-size:12px; color:#627169; margin-top:22px; }
.sg-guide .sg-reading-layout { display:grid; grid-template-columns:245px minmax(0,1fr); gap:42px; align-items:start; }
.sg-guide .sg-toc { position:sticky; top:24px; background:#fff; padding:22px 18px; border-top:3px solid var(--sg-accent); }
.sg-guide .sg-toc h2 { font-size:15px; margin:0 0 14px; }
.sg-guide .sg-toc ol { list-style:none; padding:0; margin:0; }
.sg-guide .sg-toc li { border-top:1px solid #e9ece6; }
.sg-guide .sg-toc a { display:block; padding:10px 0; font-size:13px; line-height:1.65; text-decoration:none; }
.sg-guide .sg-toc a:hover { text-decoration:underline; }
.sg-guide .sg-prose { min-width:0; }
.sg-guide .sg-prose p { margin:0 0 20px; overflow-wrap:anywhere; }
.sg-guide .sg-intro { font-size:17px; line-height:2; padding-bottom:16px; }
.sg-guide .sg-section { scroll-margin-top:24px; padding:32px 0 12px; border-top:1px solid var(--sg-line); }
.sg-guide .sg-section h2 { font-size:23px; line-height:1.65; margin:0 0 22px; padding-left:16px; border-left:4px solid var(--sg-accent); }
.sg-guide .sg-section h3 { font-size:18px; line-height:1.8; margin:26px 0 12px; }
.sg-guide .sg-prose ul { padding:20px 24px 20px 42px; margin:0 0 24px; background:var(--sg-tint); }
.sg-guide .sg-prose li { margin:6px 0; }
.sg-guide .sg-prose table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:14px; background:#fff; margin:0 0 24px; }
.sg-guide .sg-prose th, .sg-guide .sg-prose td { border:1px solid #d7ded6; text-align:left; padding:14px; vertical-align:top; overflow-wrap:anywhere; }
.sg-guide .sg-prose th { background:var(--sg-tint); font-weight:700; }
.sg-guide .sg-prose th:first-child, .sg-guide .sg-prose td:first-child { width:31%; }
.sg-guide .sg-faq h3::before { content:"Q. "; color:var(--sg-accent); }
.sg-guide .sg-faq p { background:#fff; padding:18px 20px; border-left:2px solid #d7ded6; }
.sg-guide .sg-cta { margin-top:42px; padding:30px; border-top:3px solid var(--sg-accent); background:var(--sg-tint); display:grid; grid-template-columns:1fr 260px; gap:28px; align-items:center; }
.sg-guide .sg-cta h2 { font-size:23px; line-height:1.6; margin:0 0 12px; }
.sg-guide .sg-cta p:last-child { font-size:14px; }
.sg-guide .sg-actions { display:grid; gap:12px; }
.sg-guide .sg-button { display:flex; align-items:center; justify-content:center; gap:16px; min-height:50px; padding:12px 20px; font-size:14px; border:1px solid var(--sg-accent); border-radius:4px; text-align:center; background:#fff; text-decoration:none; font-weight:700; }
.sg-guide .sg-button--primary, .sg-guide .sg-button--primary:visited { background:var(--sg-accent); color:#fff; }
.sg-guide .sg-button:hover { text-decoration:underline; }
.sg-guide .sg-bottom-nav { margin-top:32px; padding-top:20px; border-top:1px solid var(--sg-line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px; font-size:13px; }
.sg-guide .sg-hub-note { background:#fff; margin-top:44px; padding:30px; border:1px solid var(--sg-line); }
.sg-guide .sg-hub-note h2 { font-size:21px; margin-bottom:12px; }
.sg-guide .sg-hub-note p { font-size:15px; margin-bottom:22px; }
.sg-guide .sg-hub-note .sg-button { max-width:280px; }
/* SPアプリは広い画面でも既存430px幅。ビューポート幅だけに依存しない。 */
.sg-guide.sg-sp .sg-shell { padding:14px 18px 28px; }
.sg-guide.sg-sp .sg-category-grid, .sg-guide.sg-sp .sg-article-hero, .sg-guide.sg-sp .sg-reading-layout, .sg-guide.sg-sp .sg-cta { grid-template-columns:minmax(0,1fr); gap:24px; }
.sg-guide.sg-sp .sg-category-grid { gap:40px; }
.sg-guide.sg-sp .sg-toc { position:static; }
.sg-guide.sg-sp .sg-hub-hero h1 { font-size:29px; }
.sg-guide.sg-sp .sg-mobile-break { display:block; }
.sg-guide.sg-sp .sg-category-nav { gap:10px; margin:20px 0 30px; }
.sg-guide.sg-sp .sg-category-link { padding:10px 12px; font-size:14px; }
.sg-guide.sg-sp .sg-hero-copy { padding:24px 20px 0; }
.sg-guide.sg-sp .sg-hero-copy h1 { font-size:24px; }
.sg-guide.sg-sp .sg-photo--hero { aspect-ratio:16/10; min-height:0; }
.sg-guide.sg-sp .sg-article-hero { gap:24px; margin-bottom:28px; }
.sg-guide.sg-sp .sg-section h2 { font-size:21px; }
.sg-guide.sg-sp .sg-card-copy, .sg-guide.sg-sp .sg-hub-note, .sg-guide.sg-sp .sg-cta { padding:22px 18px; }
.sg-guide.sg-sp .sg-card h3 { font-size:21px; }
.sg-guide.sg-sp .sg-prose th, .sg-guide.sg-sp .sg-prose td { padding:10px; }
@media (max-width:800px) {
 .sg-guide .sg-shell { padding:14px 18px 28px; }
 .sg-guide .sg-category-grid, .sg-guide .sg-article-hero, .sg-guide .sg-reading-layout, .sg-guide .sg-cta { grid-template-columns:minmax(0,1fr); gap:24px; }
 .sg-guide .sg-category-grid { gap:40px; }
 .sg-guide .sg-toc { position:static; }
 .sg-guide .sg-hub-hero h1 { font-size:29px; }
 .sg-guide .sg-mobile-break { display:block; }
 .sg-guide .sg-category-nav { gap:10px; margin:20px 0 30px; }
 .sg-guide .sg-category-link { padding:10px 12px; font-size:14px; }
 .sg-guide .sg-hero-copy { padding:24px 20px 0; }
 .sg-guide .sg-hero-copy h1 { font-size:24px; }
 .sg-guide .sg-photo--hero { aspect-ratio:16/10; min-height:0; }
 .sg-guide .sg-article-hero { gap:24px; margin-bottom:28px; }
 .sg-guide .sg-section h2 { font-size:21px; }
 .sg-guide .sg-card-copy, .sg-guide .sg-hub-note, .sg-guide .sg-cta { padding:22px 18px; }
 .sg-guide .sg-card h3 { font-size:21px; }
 .sg-guide .sg-prose th, .sg-guide .sg-prose td { padding:10px; }
}
@media print {
 .sg-guide { background:#fff; font-size:11pt; }
 .sg-guide .sg-category-nav, .sg-guide .sg-toc, .sg-guide .sg-photo, .sg-guide .sg-cta, .sg-guide .sg-bottom-nav { display:none; }
 .sg-guide .sg-reading-layout, .sg-guide .sg-article-hero { display:block; }
 .sg-guide .sg-shell, .sg-guide .sg-hero-copy { padding:0; }
 .sg-guide .sg-section h2, .sg-guide .sg-section h3 { break-after:avoid; }
 .sg-guide .sg-prose table { break-inside:avoid; }
}