/* dokanto.net — 掲示板・速報。墨の黒・警告の黄・印の赤。見出しは Murecho 900、金額は Oswald */
:root{
  --ink:#121212; --ink-2:#4A4A4A; --bg:#fff; --surface:#fff; --soft:#F6F4EC; --line:#E3DFD0;
  --brand:#121212; --brand-ink:#fff; --accent:#D4241F; --accent-ink:#fff; --pay:#121212;
  --yellow:#FFD400; --red:#D4241F;
  --f-d:"Murecho",var(--f-b); --f-n:"Oswald",var(--f-b);
  --r:6px; --r-lg:10px;
}
a{color:#0B57B7}
.logo__name{font-family:var(--f-d);font-weight:900;font-size:1.2rem;letter-spacing:.01em;display:flex;align-items:center;gap:4px}
.logo__net{font-family:var(--f-n);font-weight:700;font-size:.8em;background:var(--yellow);color:var(--ink);padding:0 5px;border-radius:3px;letter-spacing:.04em}
.ft .logo__net{background:var(--yellow);color:var(--ink)}
.hd{border-bottom:3px solid var(--ink)}
.hd__cta{background:var(--red)}
.h2{font-weight:900}
.h2__tag{display:inline-block;font-size:.7em;vertical-align:.18em;background:var(--yellow);color:var(--ink);padding:2px 10px;margin-right:10px;border-radius:3px}
.job__new{background:var(--yellow);color:var(--ink)}

/* 速報の帯：黄と黒の斜めストライプにはさまれた黒い帯 */
.ticker{background:var(--ink);color:#fff;position:relative;border-bottom:6px solid transparent;border-image:repeating-linear-gradient(-45deg,var(--yellow) 0 12px,var(--ink) 12px 24px) 6}
.ticker__in{max-width:var(--wrap);margin:0 auto;padding:8px max(var(--gut),env(safe-area-inset-left));display:flex;gap:6px 18px;align-items:center;overflow-x:auto;white-space:nowrap;font-weight:700;font-size:.9rem;scrollbar-width:none}
.ticker__l{background:var(--red);color:#fff;padding:2px 8px;border-radius:3px;font-size:.78rem}
.ticker__i{display:inline-flex;align-items:center;gap:6px}
.ticker__i::before{content:"";width:6px;height:6px;background:var(--yellow);border-radius:50%}

/* ヒーロー：左に黒地の見出しと条件ボタン、右に写真 */
.hero{background:var(--ink);color:#fff}
.hero__in{display:grid;grid-template-columns:1fr}
@media (min-width:1000px){.hero__in{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);min-height:460px}}
.hero__text{padding:28px max(var(--gut),env(safe-area-inset-left)) 28px;display:flex;flex-direction:column;justify-content:center;min-width:0}
@media (min-width:1000px){.hero__text{padding:48px 40px 48px max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)))}}
.hero__t{display:flex;flex-direction:column;align-items:flex-start;font-family:var(--f-d);font-weight:900;margin:0}
.hero__t .hero__eyebrow{font-family:var(--f-b);font-weight:700;font-size:.85rem;color:var(--ink);background:var(--yellow);padding:3px 10px;border-radius:3px;line-height:1.5;max-width:100%}
.hero__main{align-self:stretch;margin-top:16px;font-size:clamp(1.9rem,1.2rem + 2.6vw,3rem);line-height:1.3}
.hero__main mark{background:none;color:var(--yellow)}
.hero__lead{margin-top:14px;color:#D7D7D7;font-size:.98rem;max-width:34em}
.hero__photo{min-height:220px;max-height:560px}
.hero__photo img{object-position:65% 40%}
@media (max-width:999px){.hero__photo{aspect-ratio:16/8}}

/* 大きな条件ボタン（件数つき） */
.cbtn{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:22px}
.cbtn__a{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:64px;padding:10px 14px;background:#fff;color:var(--ink);text-decoration:none;border-radius:var(--r);border:2px solid #fff;box-shadow:4px 4px 0 var(--yellow);transition:transform .12s,box-shadow .12s}
.cbtn__a:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--yellow)}
.cbtn__a:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--yellow)}
.cbtn__l{font-weight:900;font-family:var(--f-d);font-size:1.02rem}
.cbtn__n{font-size:.8rem;color:var(--ink-2);font-weight:700}
.cbtn__n .num{font-size:1.3rem;color:var(--red);margin-right:2px}

.sec__src{font-size:.8rem;color:var(--ink-2)}

/* 求人カード：金額は Oswald で大きく、日払いの求人には赤い「日払い」の印 */
.job{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.job:hover{box-shadow:6px 6px 0 var(--ink)}
.job__payv{font-size:1.45rem;letter-spacing:.01em}
.job__tags li{background:var(--soft);border:1px solid var(--line)}
.job[data-flags~="hibarai"] .job__media::after{content:"日払い";position:absolute;top:10px;right:10px;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;border:3px double var(--red);color:var(--red);background:rgb(255 255 255 / .92);font-weight:900;font-size:.95rem;transform:rotate(-12deg);font-family:var(--f-d)}
.chip.is-on{background:var(--ink);border-color:var(--ink)}

/* 早見表 */
.hayami{background:var(--soft);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.hy{overflow-x:auto;background:#fff;border:2px solid var(--ink);border-radius:var(--r);position:relative}
.hy__t{border-collapse:separate;border-spacing:0;width:100%;min-width:720px;font-size:.92rem}
.hy__t th,.hy__t td{padding:10px 12px;border-top:1px solid var(--line);text-align:left;vertical-align:middle}
.hy__t thead th{background:var(--ink);color:#fff;font-size:.8rem;border-top:0;white-space:nowrap}
.hy__fix{position:sticky;left:0;z-index:1;background:#fff;min-width:210px;box-shadow:2px 0 0 var(--line)}
thead .hy__fix{background:var(--ink)}
.hy__fix a{display:flex;flex-direction:column;min-height:44px;justify-content:center;text-decoration:none;color:var(--ink)}
.hy__comp{font-size:.75rem;color:var(--ink-2)}
.hy__title{font-weight:900;font-family:var(--f-d)}
.hy__pay{font-family:var(--f-n);font-weight:700;white-space:nowrap}
.hy__c{text-align:center!important}
.hy__m{text-align:center!important;font-weight:900;font-size:1.05rem}
.hy__m.is-on span[aria-hidden]{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--yellow);color:var(--ink)}
.hy__m.is-off{color:#6B6B6B}
.hy__note{font-size:.82rem;color:var(--ink-2);margin-top:10px}
.hy__o{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--yellow);color:var(--ink);font-weight:900;font-size:.8rem;margin-right:2px}

/* 給与の受け取り方（本文）と写真 */
.guide__in{display:grid;gap:28px}
@media (min-width:1000px){.guide__in{grid-template-columns:minmax(0,1fr) 380px;gap:48px;align-items:start}.guide__side{position:sticky;top:96px}}
.guide__main{min-width:0;max-width:820px}
.guide__photo{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;border:2px solid var(--ink)}
.guide__photo img{object-position:40% 50%}
.prose h2{border-bottom:3px solid var(--ink)}
.prose th{background:var(--soft)}

.terms{display:flex;flex-wrap:wrap;gap:8px}
.terms a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 14px;border-radius:999px;border:2px solid var(--ink);background:#fff;text-decoration:none;color:var(--ink);font-weight:700}
.readable{max-width:820px}
.ft{background:var(--ink);border-top:6px solid transparent;border-image:repeating-linear-gradient(-45deg,var(--yellow) 0 12px,var(--ink) 12px 24px) 6}

/* スマホ：条件ボタンは2列、グリッドの子は画面幅を超えない */
.hero__in>*{min-width:0}
.hero__photo{width:100%}
@media (max-width:640px){.cbtn{grid-template-columns:repeat(2,minmax(0,1fr))}.hero__text{padding-bottom:20px}}
.prose td:first-child,.prose th:first-child{white-space:nowrap}
