*{margin:0;padding:0;box-sizing:border-box}
body{background:#f5f2ee;color:#1b2236;font-family:"Hiragino Sans","Noto Sans JP",sans-serif;font-feature-settings:"palt";-webkit-text-size-adjust:100%}
.serif{font-family:"Hiragino Mincho ProN","Noto Serif JP","Yu Mincho",serif}
main{max-width:480px;margin:0 auto}
.hero{color:#fff;text-align:center;padding:40px 16px 34px;background:linear-gradient(180deg,#2b3a63 0%,#556a9c 55%,#d99a78 100%)}
.hero img{width:84px;height:84px;border-radius:50%;border:3px solid rgba(255,255,255,.85)}
.hero h1{font-size:32px;font-weight:700;margin-top:10px}
.hero p{font-size:13px;opacity:.85;margin-top:4px;letter-spacing:.06em}
.list{padding:16px;display:flex;flex-direction:column;gap:12px}
.card{position:relative;display:flex;align-items:flex-end;height:120px;padding:0 16px 12px;border-radius:16px;overflow:hidden;color:#fff;text-decoration:none;background-size:cover;background-position:center 75%;box-shadow:0 6px 16px rgba(40,40,60,.18)}
.card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,28,58,0) 30%,rgba(20,28,58,.72) 100%)}
.card>*{position:relative;text-shadow:0 2px 10px rgba(10,15,35,.55)}
.card .l{flex:1}.card .no{font-size:12px;opacity:.85;letter-spacing:.08em}
.card .nm{font-size:22px;font-weight:700;margin-top:2px}
.card .r{text-align:right}.card .pay{font-size:30px;font-weight:700;line-height:1}.card .pay small{font-size:13px;margin-left:2px}
.card .st{font-size:13px;color:#ffd37a;margin-top:6px}
.jh{position:relative;height:72vh;max-height:560px;min-height:440px;color:#fff;padding:20px;background-size:cover;background-position:center 70%}
.jh::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,18,38,.55) 0%,rgba(12,18,38,.1) 45%,rgba(12,18,38,.85) 100%)}
.jh>*{position:relative}
.back{color:#fff;font-size:14px;text-decoration:none;opacity:.9}
.jh h2{font-size:34px;line-height:1.3;margin-top:36px}
.jh h2 u{text-decoration:none;border-bottom:5px solid #E86F8C}
.stats{position:absolute;left:20px;right:20px;bottom:22px;display:flex;justify-content:space-between}
.stats div{font-size:12px}.stats b{display:block;font-size:28px;margin-top:2px}.stats b small{font-size:12px}.stats .s b{color:#ffd37a}
.body{padding:20px 16px 40px}
.note{display:block;background:#fff;color:#1b2236;text-decoration:none;border-radius:18px;padding:20px;box-shadow:0 6px 16px rgba(40,40,60,.12)}
.note .t{font-size:20px;font-weight:700}.note .d{font-size:14px;color:#596079;margin-top:6px}
.note .p{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:13px;color:#596079}
.note .p b{background:#E86F8C;color:#fff;border-radius:999px;padding:10px 22px;font-size:16px}
.prh{font-size:12px;letter-spacing:.14em;color:#8a8fa3;margin:26px 2px 10px}
.pr{display:flex;align-items:center;gap:14px;background:#fff;color:#1b2236;text-decoration:none;border-radius:16px;padding:16px;margin-bottom:10px}
.pr .tag{font-size:11px;border:1px solid #8a8fa3;color:#596079;border-radius:4px;padding:1px 6px}
.pr .x{flex:1}.pr .k{font-size:12px;color:#8a8fa3}.pr .n{font-size:16px;font-weight:700;margin-top:2px}
footer{text-align:center;font-size:11px;color:#8a8fa3;padding:24px 16px 40px;line-height:1.7}