body{background:#0c1220}
header{height:62px;max-width:none;padding-inline:max(calc((100vw - 980px)/2),20px);background:#222b3c;border-bottom:0}
.brand{font-size:18px;letter-spacing:-.03em}.brand span{color:#fff}.brand:before{content:"▼";display:inline-grid;place-items:center;width:30px;height:24px;margin-right:8px;background:#f1bf32;color:#273045;clip-path:polygon(0 20%,70% 20%,70% 0,100% 50%,70% 100%,70% 80%,0 80%)}
nav a{padding:20px 10px 15px;border-bottom:3px solid transparent;color:#dce0e8}nav a:first-child{border-color:#4388f4}
.intro{padding:32px 20px 26px;text-align:center;background:#111827;border-bottom:1px solid #1d2636}.intro .eyebrow{display:none}.intro h1{font:800 clamp(26px,4vw,34px)/1.2 sans-serif;letter-spacing:0}.intro h1:after{content:"（ランキング）"}.intro>p:not(.eyebrow){margin:8px auto;color:#9ea8b8}.intro form{margin:24px auto 0;max-width:540px;background:#202838;border-color:#344054}.intro form button{background:#367ee8}.service-note{max-width:760px!important;margin-top:18px!important;font-size:10px;line-height:1.7!important;color:#6f7a8d!important}
.ranking{width:min(100%,1020px);margin:auto;padding:34px 20px 80px}.section-head{margin-bottom:15px}.section-head .eyebrow{display:none}.section-head h2{font:800 22px sans-serif}.section-head>p{color:#697589}.filter-row{justify-content:center;margin-bottom:28px}.filter-row button{min-width:100px;border-radius:6px;background:#202839;border-color:#313c50}.filter-row button.active{background:#397fe7;border-color:#397fe7;color:#fff}
.top-banner{width:min(calc(100% - 40px),980px);height:150px;margin:24px auto 0}.top-banner[hidden]{display:none}.promo-banner{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#1a2232;color:#fff;text-decoration:none;border:1px solid #364158}.promo-banner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 24%;filter:brightness(.5) saturate(.8);transition:transform .35s}.promo-banner:hover>img{transform:scale(1.025)}.promo-shade{position:absolute;inset:0;background:linear-gradient(90deg,#101827f5 0,#101827c9 55%,#10182728 100%)}.promo-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:18px 28px;width:66%}.promo-copy small{font-size:9px;color:#8d99aa}.promo-copy b{font-size:22px;color:#fff}.promo-copy strong{margin-top:5px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:14px}.promo-copy em{margin-top:12px;padding:7px 11px;background:#397fe7;font-size:10px;font-style:normal;font-weight:800}.promo-banner.inline{grid-column:1/-1;height:130px;margin:4px 0 8px}.promo-banner.inline .promo-copy{width:75%}
.video-grid{gap:28px 16px}.thumb{box-shadow:none;border-radius:3px;background:#171e2c}.rank{background:#222b3deF}.rank.top{background:#397fe7}.play{width:48px;height:48px}.video-card h3{font-size:13px;font-weight:600;color:#e9edf4}.video-card p{color:#778296}
footer{padding-inline:max(calc((100vw - 980px)/2),20px);background:#080d17;border-color:#202a3a}
.affiliate-button{background:#397fe7}.pulse{animation:pulseBlue .32s}@keyframes pulseBlue{50%{transform:scale(.985);background:#6aa4fa}}
@media(max-width:540px){header{padding-inline:14px}.brand{font-size:15px}.intro{padding-top:28px}.ranking{padding-inline:12px}.video-grid{grid-template-columns:1fr 1fr;gap:24px 10px}.video-card h3{font-size:12px}.play{width:42px;height:42px}.duration{font-size:8px}.rank{min-width:34px;height:32px;font-size:14px}.top-banner{width:calc(100% - 24px);height:120px;margin-top:14px}.promo-copy{width:82%;padding:14px}.promo-copy b{font-size:18px}.promo-copy strong{font-size:11px}.promo-copy em{margin-top:8px}.promo-banner.inline{height:110px}}