:root{--y:#ffd60a;--p:#ff3e82;--n:#182c6e;--m:#48d6c8;--bg:#fffdf3}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--n);font-family:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;line-height:1.85;font-size:16px}
a{color:#d81b60}img{max-width:100%;height:auto}
header{background:var(--y);padding:10px 16px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 18px;position:sticky;top:0;z-index:5}
.logo{font-weight:800;font-size:24px;color:var(--p);text-decoration:none;line-height:1.2}.logo small{display:block;font-size:11px;color:var(--n)}
nav{display:flex;flex-wrap:wrap;gap:4px 14px}nav a{color:var(--n);font-weight:700;font-size:14px;text-decoration:none}nav a:hover{color:var(--p)}
main{max-width:1040px;margin:0 auto;padding:24px 16px 48px}
h1{font-size:26px;line-height:1.45;margin:6px 0 18px;font-weight:800}
h2.sec,.home h2{display:inline-block;background:var(--p);color:#fff;font-size:19px;padding:5px 20px;border-radius:30px;margin:34px 0 14px}
article{max-width:760px;margin:0 auto}article.wide{max-width:860px;text-align:center}article.wide .txt{text-align:center}article time{color:#6b76a3;font-size:14px}
.txt p,.txt h2,.txt h3{margin:.55em 0}.txt h2{font-size:21px}.txt{overflow-wrap:anywhere}
.pic{margin:18px 0;text-align:center}.pic img{border-radius:10px}
hr{border:0;border-top:3px dotted var(--m);margin:28px 0}
.yt{position:relative;aspect-ratio:16/9;margin:18px 0;border-radius:12px;overflow:hidden;background:#000}.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.quote{display:flex;gap:12px;align-items:center;background:#fff;border:2px solid #eee3a5;border-radius:12px;padding:10px;margin:14px 0;color:var(--n);text-decoration:none;text-align:left}.quote img{width:110px;height:80px;object-fit:cover;border-radius:8px;flex:none}.quote span{min-width:0}.quote b{display:block;line-height:1.5}.quote small{color:#6b76a3;line-height:1.5;display:block}
.btnw{margin:12px 0;text-align:center}.btn{display:inline-block;background:var(--p);color:#fff;font-weight:700;padding:10px 26px;border-radius:30px;text-decoration:none}.btn:hover{opacity:.85}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;flex:1;min-width:0;text-align:left}
.card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 8px #182c6e22;color:var(--n);text-decoration:none;display:flex;flex-direction:column;padding-bottom:12px}.card:hover{transform:translateY(-2px)}
.card img,.noimg{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.noimg{background:var(--y);color:var(--p);font-weight:800;display:flex;align-items:center;justify-content:center}
.card time{font-size:12px;color:#6b76a3;padding:8px 12px 0}.card b{padding:0 12px;line-height:1.5;font-size:15px}
.col{display:flex;gap:24px;align-items:flex-start}aside{width:220px;flex:none;background:#fff;border-radius:14px;padding:12px 16px}aside h3{margin:0 0 6px;font-size:15px}aside a{display:block;font-size:14px;color:var(--n);text-decoration:none;padding:3px 0}
.tags{margin-top:24px}.tag{background:var(--y);color:var(--n);font-size:13px;padding:3px 12px;border-radius:20px;text-decoration:none;margin-right:6px;display:inline-block}
.pn{display:flex;justify-content:space-between;gap:12px;margin-top:24px;font-size:14px}
.hero{background:var(--y);border-radius:20px;padding:24px;text-align:center}.hero h1{color:var(--p);font-size:34px;margin:0}.hero p{margin:6px 0 16px;font-weight:700}
.next{display:block;margin:24px auto;max-width:760px}.next img{border-radius:16px;display:block}
.home .old{text-align:center}
footer{background:var(--n);color:#fff;padding:24px 16px;text-align:center;font-size:13px}footer nav{justify-content:center;margin-bottom:10px}footer nav a,footer a{color:#fff}
@media(max-width:760px){.col{display:block}aside{width:auto;margin-top:20px}header{position:static}.hero h1{font-size:26px}h1{font-size:22px}.quote img{width:80px;height:64px}}

/* PCで画像が大きくなりすぎないように整える（スマホは幅いっぱいのまま） */
@media(min-width:761px){
.hero{max-width:800px;margin:0 auto}
.home .yt{max-width:640px;margin-left:auto;margin-right:auto}
.next{max-width:560px}
.pic img{max-height:520px;width:auto}
article .pic img{max-width:600px}
.home .old{max-width:760px;margin:0 auto}
.home .old .pic img{max-height:420px}
.home .old .quote{max-width:640px;margin-left:auto;margin-right:auto}
article .yt{max-width:640px;margin-left:auto;margin-right:auto}
}