:root{--bg:#fbf6ee;--card:#fff;--ink:#3b2d23;--sub:#7a6a5e;--line:#eadfce;--accent:#e2572b;--accent2:#f3b23d;--soft:#fff1e3;--leaf:#5f8f4e}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;line-height:1.85;font-size:16px}
a{color:inherit}img{max-width:100%;display:block}
.wrap{max-width:720px;margin:0 auto;padding:0 16px}
header.top{position:sticky;top:0;z-index:10;background:rgba(251,246,238,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:54px}
.logo{font-weight:900;font-size:18px;text-decoration:none;letter-spacing:.02em}.logo span{color:var(--accent)}
.logo{white-space:nowrap;font-size:17px}
.navlinks{display:flex;gap:10px;font-size:12px;font-weight:700;white-space:nowrap}.navlinks a{text-decoration:none}
.navlinks .ig-l{background:var(--accent);color:#fff;border-radius:999px;padding:3px 10px}
.sec-h{flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:#fff;text-decoration:none;font-weight:900;border-radius:999px;padding:13px 22px;font-size:15px;box-shadow:0 4px 0 #b9411c}
.btn.ghost{background:#fff;color:var(--accent);border:2px solid var(--accent);box-shadow:none}
.btn.ig{background:linear-gradient(45deg,#f6a23a,#e4405f,#9b3dbd);box-shadow:none}
h1,h2,h3{line-height:1.35;margin:0}
.hero{padding:22px 0 8px}
.hero .kicker{display:inline-block;background:var(--accent2);color:#3b2d23;font-weight:900;font-size:13px;border-radius:999px;padding:3px 12px}
.hero h1{font-size:34px;font-weight:900;margin:12px 0 8px;letter-spacing:.01em}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero p.lead{margin:0 0 16px;color:var(--sub);font-weight:700}
.heroimgs{display:grid;grid-template-columns:2fr 1fr;gap:8px;margin:14px 0}
.heroimgs img{width:100%;height:100%;object-fit:cover;border-radius:16px;aspect-ratio:3/4}
.heroimgs .stack{display:grid;gap:8px}.heroimgs .stack img{aspect-ratio:1/1}
section{padding:28px 0}
.sec-h{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.sec-h h2{font-size:24px;font-weight:900}.sec-h small{color:var(--sub);font-weight:700}
.rank{display:grid;gap:12px}
.rank a{display:grid;grid-template-columns:110px 1fr;gap:12px;background:var(--card);border-radius:18px;padding:10px;text-decoration:none;border:1px solid var(--line);position:relative}
.rank img{width:110px;height:140px;object-fit:cover;border-radius:12px}
.rank .no{position:absolute;left:-6px;top:-8px;background:var(--accent);color:#fff;font-weight:900;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:16px;border:3px solid var(--bg)}
.rank h3{font-size:18px;font-weight:900;margin:4px 0 6px}
.badges{display:flex;flex-wrap:wrap;gap:6px}
.badge{background:var(--soft);color:var(--accent);border:1px solid #f6cdb5;border-radius:10px;padding:2px 9px;font-size:13px;font-weight:900;white-space:nowrap}
.badge b{font-size:15px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font-weight:700;font-size:14px;cursor:pointer;color:var(--ink);font-family:inherit}
.chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.card{background:#fff;border-radius:16px;overflow:hidden;text-decoration:none;border:1px solid var(--line)}
.card img{width:100%;aspect-ratio:4/5;object-fit:cover}
.card div{padding:8px 10px 12px}.card h3{font-size:15px;font-weight:900}
.card .tags{font-size:11px;color:var(--sub);margin-top:4px}
.about{background:#fff;border-radius:22px;padding:20px;border:1px solid var(--line)}
.about .who{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:center}
.about .who img{width:96px;height:96px;object-fit:cover;border-radius:50%;border:3px solid var(--accent2)}
.about h3{font-size:20px;font-weight:900}
.msgs{display:grid;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.msgs li{background:var(--soft);border-radius:14px;padding:10px 14px;font-weight:900}
.msgs li small{display:block;font-weight:500;color:var(--sub);font-size:13px}
.cta{background:var(--ink);color:#fff;border-radius:22px;padding:24px 20px;text-align:center}
.cta h2{font-size:22px;font-weight:900;margin-bottom:8px}.cta p{margin:0 0 16px;opacity:.9}
footer{padding:30px 0 50px;text-align:center;color:var(--sub);font-size:12px}
/* article */
.crumb{font-size:12px;color:var(--sub);padding-top:12px}.crumb a{text-decoration:none}
.art-h{padding:10px 0 4px}.art-h h1{font-size:32px;font-weight:900;margin:6px 0 12px}
.catch{font-weight:900;color:var(--accent);font-size:17px}
.bignum{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.bignum div{flex:1 1 30%;background:#fff;border:2px solid var(--accent);border-radius:14px;text-align:center;padding:6px 4px}
.bignum b{display:block;font-size:22px;color:var(--accent);font-weight:900;line-height:1.2}.bignum span{font-size:12px;font-weight:700;color:var(--sub)}
.badge-note{font-size:12px;color:var(--sub);margin:0}
.heroimg{border-radius:20px;overflow:hidden;margin:14px 0;position:relative}
.heroimg img{width:100%;aspect-ratio:4/5;object-fit:cover}
.heroimg span{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;border-radius:8px;padding:2px 8px}
.intro{background:#fff;border-radius:18px;padding:16px;border:1px solid var(--line);font-size:16px}
.box{background:#fff;border-radius:18px;padding:16px 18px;border:1px solid var(--line);margin:18px 0}
.box h2{font-size:20px;font-weight:900;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.box h2 .serv{font-size:13px;background:var(--accent2);border-radius:999px;padding:1px 10px}
.ing{list-style:none;margin:0;padding:0}
.ing li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line)}
.ing li span:last-child{font-weight:700;text-align:right}
.note{font-size:13px;color:var(--sub);margin:8px 0 0}
.step{margin:22px 0;}
.step .num{display:flex;gap:10px;align-items:flex-start}
.step .num b{flex:none;background:var(--accent);color:#fff;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:900}
.step .num p{margin:2px 0 0;font-weight:700;font-size:17px}
.shots{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 2px 6px;margin:0 -16px;padding-left:16px;padding-right:16px}
.shots figure{margin:0;flex:0 0 46%;scroll-snap-align:start}
.shots.one figure{flex-basis:70%}
.shots img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:14px;background:#eee}
.shots figcaption{font-size:12px;color:var(--sub);line-height:1.5;margin-top:4px}
.tip{background:#f3f8ef;border-left:4px solid var(--leaf);border-radius:10px;padding:8px 12px;font-size:14px;margin-top:8px}
.tip b{color:var(--leaf)}
.point{background:#fff8e1;border:2px dashed var(--accent2);border-radius:18px;padding:14px 18px;margin:18px 0}
.point h2{font-size:18px;font-weight:900;margin-bottom:6px}.point ul{margin:0;padding-left:1.2em}
.voice{background:var(--soft);border-radius:22px;padding:18px;margin:22px 0;position:relative}
.voice h2{font-size:18px;font-weight:900;margin-bottom:8px;display:flex;align-items:center;gap:10px}
.voice h2 img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--accent2)}
.voice blockquote{margin:10px 0;font-weight:700;font-size:16px}
.voice cite{display:block;font-style:normal;font-size:12px;color:var(--sub);font-weight:500}
.reels{display:grid;gap:10px}
.embed{margin:0 0 14px;display:flex;justify-content:center}.embed .instagram-media{min-width:0!important;width:100%!important;max-width:400px!important;margin:0!important}
.reel{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px;text-decoration:none}
.reel img{width:80px;height:100px;object-fit:cover;border-radius:10px}
.reel b{display:block;font-size:15px}.reel small{color:var(--sub);font-size:12px}
.reel .go{color:var(--accent);font-weight:900;font-size:14px}
.tsukurepo{text-align:center;background:#fff;border:2px solid var(--accent);border-radius:20px;padding:18px;margin:18px 0}
.tsukurepo h2{font-size:19px;font-weight:900;margin-bottom:6px}.tsukurepo p{margin:0 0 12px;font-size:14px}
/* about page */
.ab-hero{text-align:center;padding:24px 0 6px}
.ab-hero img{width:150px;height:150px;border-radius:50%;object-fit:cover;margin:0 auto 12px;border:4px solid var(--accent2)}
.ab-hero h1{font-size:30px;font-weight:900}.ab-hero p{color:var(--sub);font-weight:700;margin:6px 0}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}
.facts div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 12px;font-size:14px}
.facts b{display:block;font-size:12px;color:var(--sub)}
.big-msg{font-size:24px;font-weight:900;line-height:1.5;text-align:center;margin:10px 0}
.big-msg em{font-style:normal;color:var(--accent)}
.table-photo{margin:0 0 10px}.table-photo img{width:100%;border-radius:22px}.table-photo figcaption{text-align:center;font-size:12px;color:var(--sub);margin-top:6px}
.story{text-align:center;padding:40px 0;line-height:2.2;font-size:15px}
.story p{margin:0 0 22px}
.story .s-lead{font-size:24px;font-weight:900;line-height:1.6;margin-bottom:28px}
.story em{font-style:normal;color:var(--accent);background:linear-gradient(transparent 62%,#ffe2b8 62%)}
.story .s-end{font-weight:900;font-size:18px;line-height:1.8;margin:0}
.pos{margin:14px 0 6px;font-size:16px;line-height:1.8;color:var(--sub);font-weight:700}.pos b{display:inline-block;margin-top:2px;color:var(--ink);font-size:19px;font-weight:900;background:linear-gradient(transparent 60%,#ffe2b8 60%)}
.promise{background:var(--ink);color:#fff;border-radius:24px;padding:22px 18px;margin:20px 0}
.promise .p-core{margin:0 0 12px;font-weight:900;color:var(--accent2);text-align:center}
.p3{display:grid;gap:10px}.p3>div{background:rgba(255,255,255,.07);border-radius:16px;padding:12px 14px}
.p3 b{color:var(--accent2);font-size:13px}.p3 h3{font-size:19px;font-weight:900;margin:2px 0 4px}.p3 p{margin:0;font-size:14px;opacity:.85}
.core-band{background:var(--soft);border-radius:24px;padding:24px 12px;margin-top:16px;text-align:center}
.core-band .core-s{margin:0;font-weight:900;color:var(--sub);font-size:13px}
.sign{margin:12px 0 0;text-align:right;font-weight:900;color:var(--accent)}.sign small{color:var(--sub);font-weight:700}
footer .core{font-size:16px;font-weight:900;color:var(--ink);margin-bottom:6px}
@media(min-width:640px){.p3{grid-template-columns:1fr 1fr 1fr}}
@media(min-width:640px){.grid{grid-template-columns:1fr 1fr 1fr}.hero h1{font-size:42px}.shots figure{flex-basis:30%}.shots.one figure{flex-basis:45%}}