.district.media-directory--work{--sign-edge:#ba9b60;--sign-paper:#f4ecd9;padding:40px 34px 28px;border-radius:3px;background:linear-gradient(145deg,#14382f,#0a2622 72%);box-shadow:0 20px 40px #091c2926,4px 6px 0 #baa06e}
.district.media-directory--work::before{opacity:.5;background:linear-gradient(90deg,#0a2924b8,#0a292440),linear-gradient(180deg,transparent,#0a2622 94%),url('./assets/hero.webp') 62% top/auto 560px no-repeat}
.district-head{gap:24px;padding-bottom:26px}.district h3{font-size:clamp(28px,3.2vw,42px);line-height:1.65}.district .eyebrow{font-size:13px;letter-spacing:.17em;color:#e9ce94}
.district-total strong{font-size:128px}.district-total>span{font-size:18px}
.district-breakdown{display:flex;gap:22px;align-items:baseline;font-size:18px;line-height:1.8}.district-breakdown b{font-weight:500}.district-breakdown>span{font-size:17px;color:#eee0c1}.district-breakdown small{margin-left:18px;font-size:13px;color:#d9c9a6;white-space:nowrap}
.district .district-controls{margin:18px 0 26px;font-size:14px;color:#e3d7bd}.district .atlas-motion-toggle{min-height:44px;border-color:#b99b65;background:#102f28;font-size:13px}
.district-stage::before{inset:10% -5% 0;opacity:.1;background-size:100% 100%}
.district .district-intros{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 16px;align-items:stretch}
.district .district-item,.district .district-item:nth-child(n){grid-column:auto!important;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-width:0;min-height:220px;margin:0;padding:27px 14px 18px;border:1px solid #a68d5b;border-radius:2px;color:var(--sign-paper);background:linear-gradient(145deg,#294b3d,#12372d 68%);box-shadow:inset 0 1px 0 #fff1c952,inset 0 -3px 0 #061d1866,0 8px 12px #020f0d4d;gap:0}
.district .district-item::before{inset:5px;border-color:#d7bd7f20}.district .district-item::after{left:18%;right:18%;box-shadow:0 0 12px #e3be6a70}
.district .district-item--map{background:linear-gradient(145deg,#24443e,#102e2a 68%);border-color:#9d9779}
.district .district-index{top:8px;left:12px;color:#d8c094;font-size:11px;letter-spacing:.12em;line-height:1.3}
.district .district-art{width:100%;height:90px;flex:0 0 90px;margin:0 0 15px;padding:10px 12px;border-radius:1px;background:#fff;box-shadow:0 3px 6px #021b1530;display:flex;align-items:center;justify-content:center}
.district .district-logo{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:none!important;opacity:1!important;transform:none!important;box-shadow:none;border:0;border-radius:0}
.district .district-logo--note{width:90px;height:90px;max-height:none}.district .district-item--note .district-art{padding:0}
.district .district-logo--hatena{width:70px;height:70px}.district .district-logo--blogger,.district .district-logo--fc2,.district .district-logo--google,.district .district-logo--apple{width:64px;height:64px}
.district .district-logo--jugem{width:140px;height:auto}.district .district-logo--ameba{width:128px;height:auto}
.district .district-item--livedoor .district-art{background:#172d28;box-shadow:none}.district .district-logo--livedoor{width:150px;height:auto}
.district .district-item--local .district-art{background:transparent;box-shadow:none;color:#e9cf94;padding:4px 16px}.district .district-art svg{width:100%;height:100%}
.district .district-caption{text-align:center;min-width:0}.district .district-caption>span{font-size:12px;letter-spacing:.02em;color:#d7c8a7;line-height:1.6;margin:0 0 5px}
.district .district-caption strong,.district .district-item--note .district-caption strong,.district .district-item--local .district-caption strong,.district .district-item--map .district-caption strong{font-size:18px;font-weight:500;line-height:1.65;letter-spacing:0;overflow-wrap:normal;word-break:normal;color:var(--sign-paper)}
.district .district-caption strong>span{display:block;font-size:inherit}.district .district-item--google .district-caption strong>span{font-size:13px;white-space:nowrap}
.district .district-light{top:-24px;height:24px;background:linear-gradient(#bda06522,#f0ce86);box-shadow:0 0 8px #e4bf6840}
.district footer.district-foot{padding-top:20px;margin-top:26px;border-color:#a58d6055}.district footer.district-foot .district-disclaimer{font-size:13px;line-height:1.9;color:#d5cdbb;max-width:80em}.district footer.district-foot .district-variation{font-size:12px;line-height:1.8;color:#c7b99c;margin:10px 0 0}
@media (max-width:1100px) and (min-width:761px){.district.media-directory--work{padding-inline:24px}.district .district-intros{gap:22px 12px}.district .district-item:nth-child(n){padding-inline:10px;min-height:208px}.district .district-art{height:80px;flex-basis:80px;padding-inline:8px}.district .district-caption strong{font-size:16px}.district .district-item--google .district-caption strong>span{font-size:11px}.district .district-logo--note{width:80px;height:80px}.district .district-logo--livedoor{width:130px}}
@media(max-width:760px){
 .district.media-directory--work{padding:28px 16px 22px;margin:28px 0 36px;box-shadow:3px 5px 0 #bca16d,0 16px 30px #14272128}
 .district.media-directory--work::before{background:linear-gradient(180deg,#0a292460,#0a2622 98%),url('./assets/hero.webp') 63% top/auto 560px no-repeat;opacity:.48}
 .district-head{padding-bottom:20px}.district .eyebrow{font-size:12px}.district h3{font-size:28px;letter-spacing:.01em}.district-total{margin-top:20px;gap:18px}.district-total strong{font-size:112px}.district-total>span{font-size:17px}
 .district-breakdown{display:block;font-size:17px;margin-top:17px}.district-breakdown>span{display:block;font-size:16px;margin-top:1px}.district-breakdown small{display:block;margin:3px 0 0;font-size:12px;line-height:1.7}
 .district .district-controls{margin:16px 0 24px;gap:10px;flex-wrap:wrap;font-size:12px}.district .atlas-motion-toggle{font-size:12px;padding:6px 9px;min-height:44px}
 .district .district-intros{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
 .district .district-item:nth-child(n){display:flex;min-height:182px;padding:25px 9px 15px;gap:0}
 .district .district-art{height:72px;flex:0 0 72px;margin:0 0 12px;padding:8px}
 .district .district-logo--note{width:72px;height:72px}.district .district-logo--hatena{width:56px;height:56px}.district .district-logo--blogger,.district .district-logo--fc2,.district .district-logo--google,.district .district-logo--apple{width:54px;height:54px}
 .district .district-logo--jugem{width:116px;height:auto}.district .district-logo--ameba{width:108px;height:auto}.district .district-logo--livedoor{width:116px;height:auto}
 .district .district-item--local .district-art{padding:2px 12px}
 .district .district-caption>span{font-size:11px;margin-bottom:4px}.district .district-caption strong,.district .district-item--note .district-caption strong,.district .district-item--local .district-caption strong,.district .district-item--map .district-caption strong{font-size:16px;line-height:1.65}
 .district .district-item--google .district-caption strong>span{font-size:11px;line-height:1.8}
 .district .district-index{font-size:10px;left:10px;top:8px}.district .district-light{top:-22px;height:22px}
 .district footer.district-foot{margin-top:22px;padding-top:18px}.district footer.district-foot .district-disclaimer{font-size:12px;line-height:1.9}.district footer.district-foot .district-variation{font-size:11px;margin-top:10px}
}
@media(max-width:359px){.district.media-directory--work{padding-inline:12px}.district .district-intros{gap:20px 10px}.district .district-item:nth-child(n){padding-inline:7px}.district .district-caption strong,.district .district-item--note .district-caption strong,.district .district-item--local .district-caption strong,.district .district-item--map .district-caption strong{font-size:14px}.district .district-item--google .district-caption strong>span{font-size:10px}.district .district-art{padding-inline:5px}.district .district-logo--livedoor{max-width:100%}.district h3{font-size:26px}}
.district .district-intros{grid-auto-rows:1fr}
.district .district-caption strong>span>span{display:inline-block;white-space:nowrap}
.district .district-item--google .district-caption strong>span{font-size:12px;white-space:normal}
.district .district-caption>span{font-size:12px}
.district footer.district-foot .district-variation{font-size:12px}