:root { --blue:#0d4b9e; --ink:#202936; }
* { box-sizing:border-box; }
html, body { min-height:100%; }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; color:var(--ink); background:#fff; font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; }
.site-header { min-height:90px; display:flex; align-items:center; padding:20px max(28px, calc((100vw - 1100px)/2)); border-bottom:1px solid #edf0f4; }
.brand { display:flex; align-items:center; gap:14px; }
.brand-logo { display:block; width:84px; height:auto; object-fit:contain; }
.brand-name { font-size:16px; line-height:1.35; font-weight:700; letter-spacing:.01em; }
.brand-name small { display:block; margin-top:3px; font-size:11px; font-weight:400; letter-spacing:.03em; }
.main { flex:1; display:flex; align-items:center; justify-content:center; padding:85px 28px 110px; }
.maintenance { width:min(100%,760px); text-align:center; }
.eyebrow { color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.2em; }
h1 { margin:22px 0 24px; font-size:clamp(24px, 3.4vw, 36px); line-height:1.5; letter-spacing:.035em; }
.rule { width:50px; height:3px; background:var(--blue); margin:0 auto 42px; }
p { margin:0 0 25px; font-size:15px; line-height:2.2; }
.site-footer { padding:22px 28px; text-align:center; color:#7c8590; background:#f7f9fc; font-size:11px; }
@media(max-width:600px) { .site-header { min-height:76px; padding:15px 20px; } .brand-logo { width:70px; } .brand-name { font-size:14px; } .brand-name small { font-size:10px; } .main { padding:75px 22px 90px; } h1 { font-size:25px; } .rule { margin-bottom:32px; } p { font-size:14px; line-height:2; } .desktop { display:none; } }