:root{--red:#e8431a;--black:#111;--white:#fff;--gray:#f3f1ee;--text:#222}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;color:var(--text);background:var(--white);line-height:1.8;padding-bottom:72px}
img{max-width:100%}
a{color:inherit}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
section{padding:56px 0}
section.dark{background:var(--black);color:var(--white)}
section.gray{background:var(--gray)}
h2{font-size:1.5rem;font-weight:900;margin:0 0 24px;padding-left:14px;border-left:6px solid var(--red);line-height:1.4}
.hero{background:var(--black);color:var(--white);text-align:center;padding:48px 0 56px}
.logo{font-size:2.4rem;font-weight:900;background:var(--white);color:var(--black);display:inline-block;padding:4px 18px;border-bottom:6px solid var(--red);margin:0}
.logo small{display:block;font-size:.8rem;letter-spacing:.2em}
.catch{font-size:1.4rem;font-weight:900;margin:28px 0 8px}
.catch em{color:var(--red);font-style:normal}
.ph{background:#555;color:#ddd;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.85rem;border:2px dashed #999;min-height:200px;margin:24px 0}
.btn{display:inline-block;background:var(--red);color:var(--white);font-weight:900;text-decoration:none;padding:14px 28px;border-radius:999px;margin:6px}
.btn.line{background:transparent;border:2px solid currentColor}
.cards{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.card{background:var(--gray);padding:16px;border-radius:8px}
.card h3{margin:0 0 4px;font-size:1rem;color:var(--red)}
.card p{margin:0;font-size:.9rem}
table{width:100%;border-collapse:collapse}
td,th{padding:14px 8px;border-bottom:1px solid #ccc;text-align:left;vertical-align:top}
td.price{font-weight:900;color:var(--red);white-space:nowrap;font-size:1.1rem}
.small{font-size:.85rem;opacity:.8}
.tag{display:inline-block;background:var(--black);color:var(--white);padding:4px 12px;border-radius:999px;margin:4px;font-size:.9rem}
ol.flow{counter-reset:s;list-style:none;padding:0}
ol.flow li{counter-increment:s;padding:12px 0 12px 48px;position:relative;border-bottom:1px solid #ddd}
ol.flow li::before{content:counter(s);position:absolute;left:0;top:10px;width:34px;height:34px;border-radius:50%;background:var(--red);color:#fff;font-weight:900;text-align:center;line-height:34px}
.todo{background:#fff3cd;color:#7a5b00;font-size:.75rem;padding:1px 6px;border-radius:4px;margin-left:6px}
footer{background:var(--black);color:#ccc;text-align:center;padding:32px 20px;font-size:.85rem}
.fixed{position:fixed;left:0;right:0;bottom:0;background:var(--red);z-index:10;text-align:center}
.fixed a{display:block;color:#fff;font-weight:900;text-decoration:none;padding:16px}
@media(min-width:760px){.cards{grid-template-columns:repeat(3,1fr)}body{padding-bottom:0}.fixed{display:none}}