/* 住み込み×工場求人の即マッチ（sokumatch）の見た目。2026-10-30 デザイン案（トップ994b1eb4・一覧2e3d067a・詳細c01a3f64）のコード化。
   方針（オーナー指摘「ボタンやイラストのAI感が強い」）：
   ・アイコンは線のアイコン1種類（太さ2・角丸の線）。人物イラスト・AI写真は使わない
   ・ボタンは平らな塗り（つや・立体・グラデーション・影なし）。角丸は 6px にそろえる
   ・色は赤 #d2232a・濃い赤 #a51b20・黄 #ffd400、LINEだけ緑。背景は白とごく薄いグレー、文字は墨色
   ・横360pxで12px未満の文字を出さない
   前半＝共通の画面（応募・会員・特集など）で使う部品、後半＝即マッチのトップ・一覧・求人詳細 */

:root{
  --brand:#d2232a;--brand-d:#a51b20;--brand-l:#fdeeee;--yel:#ffd400;--yel-l:#fff6c7;
  --cta:#d2232a;--cta-d:#a51b20;--keep:#d2232a;--line-app:#06c755;--line-app-d:#04a345;
  --pay:#d2232a;--fg:#1f2328;--muted:#5f6670;--line:#e1e4e8;--line-2:#c9cdd3;--bar:#f3f4f6;--soft:#f5f6f8;--bg:#fff;
  --r:6px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.7 "Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic UI",Meiryo,sans-serif;font-feature-settings:"palt" 0}
a{color:var(--brand-d)}
img{max-width:100%;height:auto;vertical-align:top}
button,input,select,textarea{font-family:inherit}
.inner{max-width:1120px;margin:0 auto;padding-inline:16px}
.ic{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted);font-size:13px}
:focus-visible{outline:3px solid var(--yel);outline-offset:2px}

/* ===== 上の帯・ヘッダー ===== */
.topbar{background:var(--fg);color:#fff;font-size:12px;line-height:1.5;padding-block:4px}
.topbar p,.topbar h1{margin:0;font-size:inherit;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd{background:#fff;border-bottom:3px solid var(--brand)}
.hd .inner{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:62px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--fg);flex:none}
.logo-mark{width:42px;height:42px;border-radius:var(--r);background:var(--brand);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:900;line-height:1}
.logo-txt{display:flex;flex-direction:column;line-height:1.15}
.logo-txt small{font-size:12px;font-weight:700;color:var(--fg);letter-spacing:.02em}
.logo-txt b{font-size:23px;font-weight:900;color:var(--brand);letter-spacing:.06em}
.hd-nav{display:flex;align-items:center;gap:4px}
.hd-i{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:46px;min-height:46px;text-decoration:none;color:var(--fg);font-size:12px;font-weight:700;line-height:1.3;position:relative}
.hd-i .ic{width:22px;height:22px;color:var(--fg)}
.hd-i.keepn i{position:absolute;top:0;right:2px;background:var(--brand);color:#fff;font-style:normal;font-size:12px;border-radius:9px;padding:0 5px;line-height:18px}
.hd-pc,.hd-tel{display:none}
.hd-line{padding:10px 14px;font-size:14px;white-space:nowrap}
.hd-tel{flex-direction:row;align-items:center;gap:8px;font-size:20px;font-weight:900;color:var(--fg);text-decoration:none;margin-right:6px;line-height:1.2}
.hd-tel .ic{color:var(--brand);width:24px;height:24px}
.hd-tel small{display:block;font-size:12px;color:var(--muted);font-weight:500}
.gnav{display:none;background:#fff;border-bottom:1px solid var(--line)}
.gnav ul{display:flex;list-style:none;margin:0;padding:0}
.gnav a{display:block;padding:10px 18px;font-size:14px;font-weight:700;color:var(--fg);text-decoration:none}
.gnav a:hover{color:var(--brand)}
@media (max-width:379px){.logo-txt b{font-size:20px}.logo-mark{width:38px;height:38px;font-size:23px}.hd-line{padding:9px 10px;font-size:13px}.hd-line .ic{display:none}}
@media (min-width:860px){.hd-pc,.hd-tel{display:flex}.gnav{display:block}.hd .inner{min-height:72px}.logo-mark{width:48px;height:48px;font-size:30px}.logo-txt b{font-size:26px}}

.crumbs{font-size:13px;color:var(--muted);padding-block:10px;overflow-x:auto;white-space:nowrap;display:flex;align-items:center;gap:4px}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--brand);text-decoration:underline}
.crumbs .ic{width:14px;height:14px;color:#9aa0a6}
.crumbs span[aria-current]{color:var(--fg)}

/* ===== 見出し ===== */
/* 共通の .bar：2026-10-30 寮寮ワークと同じ「灰色の帯＋太字」の控えめな見出しに（赤い太線・大きい字をやめた） */
.bar,.sec-h h2{background:#eef0f2;color:var(--fg);font-size:15px;font-weight:700;margin:0 0 10px;padding:8px 12px;border-left:0;line-height:1.45;display:flex;align-items:center;justify-content:space-between;gap:8px}
.bar a{font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;color:var(--brand-d)}
.bar small{font-size:12px;font-weight:500;color:var(--muted)}
.blk{margin:28px 0 0}
.blk-body{padding:10px 0}
.side-h{border-left:4px solid var(--brand);padding:1px 0 1px 10px;font-size:17px;font-weight:700;margin:28px 0 10px;line-height:1.45}
h1.pg{font-size:20px;line-height:1.5;margin:8px 0 12px;font-weight:900}
h1{font-size:20px;line-height:1.5;margin:10px 0}

/* ===== ボタン（平らな塗り・角丸6px） ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid transparent;border-radius:var(--r);padding:11px 14px;font:inherit;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;line-height:1.3;text-align:center;transition:background-color .15s,border-color .15s}
.btn .ic{width:20px;height:20px}
.btn-apply,.btn-navy{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-apply:hover,.btn-navy:hover{background:var(--brand-d);border-color:var(--brand-d)}
.btn-line{background:var(--line-app);border-color:var(--line-app);color:#fff}
.btn-line:hover{background:var(--line-app-d);border-color:var(--line-app-d)}
.btn-tel{background:#fff;color:var(--fg);border-color:var(--fg)}
.btn-tel .ic{color:var(--brand)}
.btn-more{background:#fff;color:var(--brand-d);border-color:var(--brand)}
.btn-more:hover{background:var(--brand-l)}
.btn-ghost{background:#fff;color:var(--fg);border-color:var(--line-2)}
.btn-keep{background:#fff;color:var(--fg);border-color:var(--line-2)}
.btn-keep .ic{color:var(--brand)}
.btn-keep[aria-pressed="true"]{background:var(--brand-l);color:var(--brand-d);border-color:var(--brand)}
.btn-keep[aria-pressed="true"] .ic{fill:currentColor}
.btn-sub{display:block;font-size:12px;font-weight:500}
.btn-wide{display:flex;width:100%}

/* ===== 条件の札 ===== */
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
/* 2026-10-30 寮寮ワークと同じ枠線だけの札（塗りの札をやめて落ち着かせる） */
.tag{display:inline-block;font-size:12px;font-weight:500;line-height:1.4;padding:2px 7px;border-radius:2px;color:var(--fg);background:#fff;border:1px solid var(--line-2);text-decoration:none;white-space:nowrap}
a.tag:hover{border-color:var(--brand);color:var(--brand-d)}
.tag.hot{border-color:#e3a3a5;color:var(--brand-d)}
.tag.new{background:var(--brand);border-color:var(--brand);color:#fff}

/* ===== 求人カード（即マッチ専用の _card）。一覧は1列 =====
   2026-10-30 夕 オーナー指摘「スマホで一覧が見にくい」：1件の縦を約520px→約300pxに。
   札は1行（はみ出す分は隠す）・題名は2行まで・写真の横に給与／勤務地／職種・寮費／募集人数／手取りは1行の帯・ボタンは1行。
   スマホではキャッチ・最寄り駅・寮の細かい中身・帯の補足は出さない（PC＝700px以上は出す） */
.jobs{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.jc{position:relative;display:grid;gap:8px;padding:12px;border:1px solid var(--line-2);border-radius:var(--r);background:#fff;min-width:0}
.jc:hover{border-color:var(--brand)}
.jc-tags{margin:0;flex-wrap:nowrap;overflow:hidden;gap:4px}
.jc-tags:empty{display:none}
.jc-tags .tag{flex:none}
.tag.soku{background:var(--brand-l);border-color:var(--brand);color:var(--brand-d);font-weight:700}
.jc h3{margin:0;font-size:16px;line-height:1.5;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jc h3 a{color:var(--fg);text-decoration:none}
.jc h3 a::after{content:'';position:absolute;inset:0;z-index:1}
.jc:hover h3 a{color:var(--brand-d);text-decoration:underline;text-underline-offset:3px}
.jc-catch{display:none;margin:-4px 0 0;font-size:13px;line-height:1.6;color:var(--muted)}
.jc-body{display:grid;grid-template-columns:104px minmax(0,1fr);gap:10px;align-items:start}
.jc-img{display:block;aspect-ratio:4/3;border-radius:2px;overflow:hidden;background:var(--soft)}
.jc-img img{width:100%;height:100%;object-fit:cover}
.jc-noimg{display:grid;place-items:center;width:100%;height:100%;color:#a7adb4}
.jc-noimg .ic{width:32px;height:32px;stroke-width:1.5}
.jc-dl{margin:0;display:grid;gap:3px;font-size:14px;line-height:1.45}
.jc-dl div{display:grid;grid-template-columns:3.3em minmax(0,1fr);gap:6px;align-items:baseline}
.jc-dl dt{color:var(--muted);font-size:12px;font-weight:700;white-space:nowrap}
.jc-dl dd{margin:0;overflow-wrap:anywhere}
.jc-dl .pv{color:var(--pay);font-weight:900;font-size:17px;line-height:1.3}
.jc-dl small{font-size:12px;color:var(--muted);font-weight:400}
.jc-dl small.sep{display:inline;white-space:nowrap}
.jc-dl .jc-st{display:none}
/* 寮費・募集人数・手取り：中身の長さに合わせて幅を分ける（「応募後にご案内」が途中で折れないように） */
.jc-key{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fffaf3}
.jc-key>div{flex:1 1 auto;padding:6px 8px;min-width:0;line-height:1.35}
.jc-key>div+div{border-left:1px solid var(--line)}
.jc-key span{display:block;font-size:12px;color:var(--muted)}
.jc-key b{display:block;font-size:15px;font-weight:700}
.jc-key b.pv{color:var(--pay)}
.jc-key small{display:none;font-size:12px;color:var(--muted)}
.jc-act{position:relative;z-index:2;display:flex;gap:8px;align-items:center}
.jc-act form{margin:0;display:flex}
.jc-act .btn{padding:8px 10px;font-size:14px;min-height:42px}
.jc-act .btn-keep{width:42px;height:42px;padding:0}
.jc-act .btn-keep .ic{width:18px;height:18px}
.jc-act .btn-more,.jc-act .btn-line{flex:1 1 0}
@media (min-width:700px){
  .jc{padding:14px 16px;gap:10px}
  .jc-catch{display:block}
  .jc-body{grid-template-columns:200px minmax(0,1fr);gap:16px}
  .jc-dl{gap:0}
  .jc-dl div{padding:5px 0;border-bottom:1px solid var(--line);grid-template-columns:4.6em minmax(0,1fr)}
  .jc-dl div:first-child{padding-top:0}
  .jc-dl div:last-child{border-bottom:0}
  .jc-dl dt{font-size:13px}
  .jc-dl .jc-st{display:inline;margin-left:6px}
  .jc-key small{display:block}
  .jc-key>div{padding:7px 12px}
  .jc-act{justify-content:flex-end}
  .jc-act .btn-more,.jc-act .btn-line{max-width:200px}
}
/* ===== 横に流れる小さいカード ===== */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:44%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 8px;scrollbar-width:thin}
@media (min-width:860px){.rail{grid-auto-columns:calc((100% - 50px)/6)}}
.rail>*{scroll-snap-align:start}
.mini{display:block;text-decoration:none;color:var(--fg);border:1px solid var(--line);border-radius:var(--r);background:#fff;min-width:0;overflow:hidden}
.mini:hover{border-color:var(--brand)}
.mini .jc-img{aspect-ratio:4/3;border-radius:0}
.mini div{padding:8px 10px 10px}
.mini b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.45;min-height:2.9em}
.mini .pay{font-size:13px;margin:4px 0 0;color:var(--pay);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .pay b{font-size:16px;display:inline;-webkit-line-clamp:unset;min-height:0}
.mini span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== 共通の求人カード表（info）・給与 ===== */
.info{width:100%;border-collapse:collapse;font-size:14px}
.info th,.info td{border-bottom:1px solid var(--line);padding:8px 0;text-align:left;vertical-align:top}
.info th{width:6.6em;color:var(--muted);font-weight:700;white-space:nowrap;font-size:13px}
.info th .ic{color:var(--brand);margin-right:4px}
.info td{overflow-wrap:anywhere}
.info tr:last-child th,.info tr:last-child td{border-bottom:0}
.info .pref{font-weight:700}
.pay{color:var(--pay);font-weight:700;line-height:1.3}
.pay .u{display:inline-block;font-size:12px;color:#fff;background:var(--pay);border-radius:3px;padding:1px 5px;margin-right:4px;vertical-align:3px}
.pay b{font-size:20px;font-variant-numeric:tabular-nums}
.pay small{font-size:13px;white-space:nowrap}
.pay .amt{white-space:nowrap}
.shift{display:inline-block;font-size:12px;font-weight:700;padding:0 6px;border-radius:3px;color:#fff;background:#3d6b45;margin-right:4px;line-height:20px}
.shift.s-nikotai{background:#2f5f8f}.shift.s-sankotai{background:#5d4a85}.shift.s-yakin{background:#3a4148}

/* ===== リンクの並び・チップ ===== */
/* 件数つきのリンク一覧（寮寮ワークの「職種から探す」と同じ形）。スマホ2列、PCは .links-3/4/5 で列を増やす */
.links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media (min-width:860px){.links-3{grid-template-columns:repeat(3,1fr)}.links-4{grid-template-columns:repeat(4,1fr)}.links-5{grid-template-columns:repeat(5,1fr)}}
.links li{border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-width:0}
.links a{display:flex;align-items:center;gap:6px;padding:10px 10px;min-height:44px;color:var(--fg);text-decoration:none;font-size:14px;line-height:1.45}
.links a::after{content:"›";color:var(--muted);flex:none}
.links a small{color:var(--muted);margin-left:auto;font-size:12px;white-space:nowrap}
.links a:hover{background:var(--soft);color:var(--brand-d)}
.chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.chips a{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:5px 10px;border:1px solid var(--line-2);border-radius:2px;background:#fff;color:var(--fg);text-decoration:none;font-size:13px;line-height:1.3}
.chips a .ic{color:var(--muted);width:14px;height:14px}
.chips a small{color:var(--muted);font-size:12px}
/* 詰めたリンク（一覧の市区町村・条件。2026-10-30 縦を短く） */
.cl{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.cl a{display:inline-block;padding:4px 9px;border:1px solid var(--line-2);border-radius:2px;background:#fff;color:var(--fg);text-decoration:none;font-size:13px;line-height:1.5}
.cl a small{color:var(--muted);font-size:12px;margin-left:2px}
.cl a:hover{border-color:var(--brand);color:var(--brand-d)}
details.more-d{margin-top:8px}
details.more-d>summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--brand-d);list-style:none;padding:4px 0}
details.more-d>summary::-webkit-details-marker{display:none}
details.more-d>summary::after{content:" ＋"}
details.more-d[open]>summary::after{content:" －"}
details.more-d>ul{margin-top:6px}
.chips a:hover{border-color:var(--brand);color:var(--brand-d)}
.chips a.on,.chips a[aria-current="true"]{background:var(--brand);border-color:var(--brand);color:#fff}
.chips a.on small{color:#fde3e3}
.region{display:grid;grid-template-columns:6.4em 1fr;border-bottom:1px solid var(--line)}
.region:first-child{border-top:1px solid var(--line)}
.region b{background:var(--soft);font-size:13px;padding:8px;display:flex;align-items:center;white-space:nowrap}
.region ul{list-style:none;margin:0;padding:6px 10px;display:flex;flex-wrap:wrap;gap:2px 14px}
.region a{font-size:14px;padding:4px 0;display:inline-block;text-decoration:none;color:var(--fg)}
.region a:hover{color:var(--brand-d);text-decoration:underline}
.region a small{color:var(--muted);font-size:12px;margin-left:2px}
.tks{display:grid;gap:10px}
@media (min-width:860px){.tks{grid-template-columns:repeat(3,1fr)}}
/* 2026-10-30 夕 枠をやめて区切り線だけに。スマホは札を1行に並べて横にずらす（縦を短く） */
.tks{gap:0;grid-template-columns:minmax(0,1fr)}
.tks-g{border-bottom:1px solid var(--line);padding:10px 0;background:#fff;min-width:0}
.tks-g:first-child{padding-top:2px}
.tks-g b{display:block;font-size:14px;margin-bottom:6px}
/* 2026-10-30 夜 オーナー指摘「特集から探すがスマホで見切れている」：横にずらす並びをやめ、折り返して全部見せる */
@media (max-width:699px){.tks .tks-g a{padding:6px 10px}}
@media (min-width:860px){.tks{gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}}
.tks-g ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.tks-g a{display:inline-block;font-size:13px;padding:4px 8px;border:1px solid var(--line-2);border-radius:2px;text-decoration:none;color:var(--fg)}
.tks-g a small{color:var(--muted);margin-left:4px;font-size:12px}
.tks-g a:hover{border-color:var(--brand);color:var(--brand-d)}
.more-links{list-style:none;margin:0;padding:0;display:grid;gap:8px}
@media (min-width:600px){.more-links{grid-template-columns:1fr 1fr}}
.more-links a{display:flex;align-items:center;gap:8px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--fg);text-decoration:none;font-size:15px;font-weight:700}
.more-links a small{display:block;font-weight:400;color:var(--muted);font-size:13px}
.more-links a::after{content:"›";margin-left:auto;color:var(--brand);font-size:20px}
.more-links a:hover{border-color:var(--brand)}

/* ===== 検索の箱（共通の _search・_search_list） ===== */
.sbox{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.sbox .bar{background:var(--fg);color:#fff;border-left:0;margin:0;padding:10px 12px;font-size:16px}
.srow{display:grid;grid-template-columns:7.2em 1fr;border-bottom:1px solid var(--line);min-height:48px}
.srow>label,.srow>.lbl{background:var(--soft);color:var(--fg);font-size:13px;font-weight:700;display:flex;align-items:center;gap:4px;padding:0 8px;white-space:nowrap}
.srow>label .ic,.srow>.lbl .ic{color:var(--brand)}
.srow select,.srow input{border:0;background:#fff;font:inherit;font-size:16px;padding:0 8px;min-width:0;width:100%;color:var(--fg);outline-offset:-2px}
.srow[hidden]{display:none}
.cityp{min-width:0}
.cityp summary{cursor:pointer;list-style:none;padding:0 28px 0 8px;min-height:48px;display:flex;align-items:center;font-size:15px;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cityp summary::-webkit-details-marker{display:none}
.cityp summary::after{content:'';position:absolute;right:12px;top:50%;width:7px;height:7px;border-right:2px solid #555;border-bottom:2px solid #555;transform:translateY(-70%) rotate(45deg)}
.cityp[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.cityp-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5em,1fr));gap:2px 8px;padding:6px 8px 10px;max-height:260px;overflow:auto;border-top:1px dashed var(--line)}
.cityp-list label{display:flex;align-items:center;gap:6px;font-size:14px;padding:6px 2px;cursor:pointer}
.cityp-list input{width:18px;height:18px;flex:none;padding:0;accent-color:var(--brand)}
.cityp-list small{color:var(--muted);font-size:12px}
.s-pay{grid-template-columns:7.2em 1fr}
.pay3{display:grid;gap:6px;padding:8px}
.pay3 label{display:grid;gap:3px;font-size:12px;color:var(--muted);font-weight:700}
.pay3 label b{color:var(--brand-d)}
.pay3 select{border:1px solid var(--line-2);border-radius:4px;min-height:42px;font-weight:400;font-size:16px}
.paynote{grid-column:1/-1;margin:0;padding:0 8px 8px;font-size:12px;color:var(--muted)}
@media (min-width:600px){.pay3{grid-template-columns:repeat(3,1fr)}}
.sfoot{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:12px}
.sfoot .clear{font-size:13px;color:var(--muted);background:#fff;border:1px solid var(--line-2);border-radius:var(--r);padding:11px 12px;text-decoration:none;cursor:pointer}
.sfoot .btn{padding:12px}
@media (min-width:860px){.sgrid{display:grid;grid-template-columns:1fr 1fr}.sgrid .srow{border-right:1px solid var(--line)}}
.qf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.qf-h{font-size:13px;font-weight:700;color:var(--muted)}
.sbox2 .chks{display:flex;flex-wrap:wrap;gap:2px 14px;padding:6px 8px;align-items:center}
.sbox2 .chks label{display:flex;align-items:center;gap:6px;font-size:14px;padding:6px 0;cursor:pointer}
.sbox2 .chks input{width:18px;height:18px;flex:none;padding:0;accent-color:var(--brand)}
.sbox2 .chks small{color:var(--muted);font-size:12px}
.sbox2 .chks .ncat{flex-basis:100%}
.sbox2 .chks .ncat summary{min-height:40px;font-size:14px;border:1px dashed var(--line-2);border-radius:4px;padding:8px}
.pick-regions{border-top:1px dashed var(--line);padding:4px 8px 10px;max-height:340px;overflow:auto}
.pick-region{border:0;margin:0;padding:4px 0;display:flex;flex-wrap:wrap;gap:0 12px;border-bottom:1px solid #f0f0f0}
.pick-region legend{padding:0;width:100%;font-size:13px;font-weight:700;color:var(--fg)}
.pick-region label{display:flex;align-items:center;gap:6px;font-size:14px;padding:6px 0;cursor:pointer}
.pick-region input{width:18px;height:18px;flex:none;padding:0;accent-color:var(--brand)}

/* ===== 一覧（共通部品） ===== */
.intro{font-size:14px;line-height:1.8;margin:0 0 12px;color:var(--fg)}
.intro b{color:var(--pay)}
.chg{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:#fff;color:var(--fg);border:2px solid var(--fg);border-radius:var(--r);text-align:center;padding:11px;font:inherit;font-weight:700;cursor:pointer;list-style:none}
.chg::-webkit-details-marker{display:none}
.chg .ic{color:var(--brand)}
details.chgbox{margin-bottom:12px}
details.chgbox[open]>summary{background:var(--fg);color:#fff}
details.chgbox[open]>summary .ic{color:#fff}
.count-line{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:4px 0 12px;font-size:14px}
.count-line b{font-size:22px;color:var(--pay);font-variant-numeric:tabular-nums}
.count-line .muted{font-size:13px}
@media (max-width:419px){.count-line{margin-bottom:8px}.sorts{gap:4px}.sorts a{padding:5px 8px;min-height:34px}}
.sorts{display:flex;gap:6px;align-items:center}
.sorts a{font-size:13px;text-decoration:none;color:var(--fg);border:1px solid var(--line-2);padding:6px 10px;border-radius:var(--r);background:#fff;min-height:36px;display:inline-flex;align-items:center}
.sorts a[aria-current="true"]{background:var(--fg);color:#fff;border-color:var(--fg)}
.cols{display:grid;gap:16px}
.side .bar{margin-top:24px}
.side .chips{padding:0}

/* ===== よくある質問 ===== */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:12px 28px 12px 0;font-weight:700;position:relative;line-height:1.6;font-size:15px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q.";color:var(--brand);margin-right:6px;font-weight:900}
.faq summary::after{content:"";position:absolute;right:8px;top:20px;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg)}
.faq details[open] summary::after{transform:rotate(-135deg);top:24px}
.faq details>div{padding:0 0 14px 1.7em;font-size:14px;line-height:1.85}

/* ===== 求人ページの共通部品 ===== */
table.spec{width:100%;border-collapse:collapse;border-top:1px solid var(--line);font-size:14px}
table.spec th,table.spec td{border-bottom:1px solid var(--line);padding:11px 10px;text-align:left;vertical-align:top}
table.spec th{background:var(--soft);width:7.5em;font-weight:700;font-size:13px}
table.spec td{white-space:pre-wrap;word-break:break-word;line-height:1.75}
@media (max-width:600px){table.spec th,table.spec td{display:block;width:auto}table.spec th{padding:7px 10px}}
.ended{background:#fff6e5;border:1px solid #e9c37c;border-radius:var(--r);padding:10px 12px;font-weight:700;margin:8px 0}
.status{background:var(--brand-l);border:1px solid #f1c1c3;border-radius:var(--r);padding:10px 12px;margin:8px 0}
.sticky-cta{display:none}

/* ===== 応募・会員・記事の画面で使う部品 ===== */
.card{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:14px;margin-bottom:12px}
.sec{margin-top:24px}
.sec-h{display:flex;align-items:center;justify-content:space-between}
.pills{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pills a{display:inline-block;padding:7px 12px;border:1px solid var(--line-2);border-radius:var(--r);background:#fff;color:var(--fg);text-decoration:none;font-size:14px}
.lead{background:var(--soft);border-radius:var(--r);padding:12px 14px;font-size:14px;margin:0 0 12px}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=date],input[type=number],select,textarea{font-size:16px}

/* ===== ページ送り ===== */
.pager{margin:24px 0}
.pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;list-style:none;padding:0;margin:0}
.pagination li a,.pagination li span{display:inline-grid;place-items:center;min-width:44px;height:44px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r);background:#fff;text-decoration:none;color:var(--fg);font-weight:700}
.pagination li a:hover{border-color:var(--brand);color:var(--brand-d)}
.pagination li.active span{background:var(--brand);color:#fff;border-color:var(--brand)}
.pagination li.disabled span{color:#b5b9be}

/* ===== フッター ===== */
.ft{background:var(--soft);border-top:1px solid var(--line);margin-top:48px;padding-block:28px 0;font-size:13px}
.ft a{color:var(--fg);text-decoration:none}
.ft a:hover{color:var(--brand-d);text-decoration:underline}
.ft-cols{display:grid;gap:20px}
@media (min-width:860px){.ft-cols{grid-template-columns:2fr 1fr 1fr}}
.ft h3{font-size:14px;margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line-2)}
.ft h3:not(:first-child){margin-top:16px}
.ft ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 12px}
.ft ul.ft-col{flex-direction:column}
.ft .copy{background:var(--fg);color:#fff;margin-top:28px;padding:14px 0;font-size:12px;text-align:center}
.ft .copy p{margin:0}
.ft .copy a{color:#fff}
.ft-min{margin-top:28px;padding-top:0;border-top:0}
.ft-min .copy{margin-top:0}

/* ===== スマホの画面下の固定バー（電話・LINE／求人ページは応募・LINE） ===== */
.fixbar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid var(--line);padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));display:flex;gap:8px}
.fixbar .btn{flex:1 1 0;min-width:0;white-space:nowrap;gap:6px}
.fixbar .btn-tel:not(:only-of-type){flex:0 0 auto;padding-inline:12px}
.fixbar:empty{display:none}
.fixbar .btn{padding:11px 6px;font-size:15px;min-height:50px}
body.has-fix{padding-bottom:76px}
@media (min-width:860px){.fixbar{display:none}body.has-fix{padding-bottom:0}}

/* ===== LINE・電話の相談枠（共通の _line_cta） ===== */
.kv-line{margin:28px 0 0;border:2px solid var(--line-app);border-radius:var(--r);padding:12px 14px;background:#fff}
.kv-line p{margin:0 0 10px;font-size:13px;line-height:1.7}
.kv-line p strong{display:block;font-size:16px;font-weight:700;margin-bottom:2px}
.kv-line-btns{display:grid;grid-template-columns:3fr 2fr;gap:8px}
.kv-line-btns .btn{flex-direction:column;gap:0;padding:10px 6px;font-size:16px;min-width:0}
.kv-line-btns .btn small{font-size:12px;font-weight:500;white-space:nowrap}
@media (min-width:860px){.kv-line{display:grid;grid-template-columns:1fr 420px;gap:16px;align-items:center}.kv-line p{margin:0}}

/* =====================================================================
   トップ（brands/sokumatch/site/home）。2026-10-30 寮寮ワークのトップの見せ方に寄せた：
   FV画像 → 件数の帯 → 灰色の帯の見出し＋件数つきのリンク一覧。大きいアイコンのカード・色付きの大きい箱は使わない
   ===================================================================== */
.fv-fig.fv-top{max-width:960px;margin:12px auto 0}
.fv-fig.fv-top img{border-radius:2px}
/* 2026-10-30 夕 スマホで見やすく：見出し＋件数は1行にまとめ、説明文はPCだけ。その下に「勤務地で探す」「急ぎの条件で探す」の2つのボタン */
.tband{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 12px;margin:10px 0 0;padding:10px 12px;background:var(--soft);border-bottom:3px solid var(--yel)}
.tband h1{margin:0;font-size:17px;font-weight:900;line-height:1.45}
.tband-n{margin:0;font-size:13px;font-weight:700;line-height:1.3;white-space:nowrap}
.tband-n b{font-size:22px;font-weight:900;color:var(--brand);margin:0 2px 0 4px}
.tband-n small{font-size:12px;font-weight:400;color:var(--muted);margin-left:6px}
.tband-d{flex-basis:100%;margin:4px 0 0;font-size:13px;line-height:1.65;display:none}
@media (min-width:600px){.tband-d{display:block}}
.tgo{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 0}
.tgo a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:52px;padding:8px;border:2px solid var(--brand);border-radius:var(--r);background:#fff;color:var(--brand-d);font-size:16px;font-weight:700;text-decoration:none;line-height:1.3;text-align:center}
.tgo a .ic{width:20px;height:20px;color:var(--brand)}
.tgo a:hover{background:var(--brand-l)}
@media (max-width:359px){.tgo a{font-size:15px;gap:4px}}
@media (min-width:860px){.tgo{display:none}}
/* 急ぎの条件：スマホは件数を隠して条件名を大きく（件数はどれもほぼ同じ） */
.links-isogi a{font-size:15px;font-weight:700;min-height:50px}
@media (max-width:599px){.links-isogi a small{display:none}.links.links-isogi a{display:flex}.links-isogi a::after{margin-left:auto}}
/* 検索（勤務地・職種）。トップの検索フォームはこれ1つ。見出しは外の .bar「勤務地で探す」 */
.qs{margin:0;background:var(--soft);border:1px solid var(--line);border-radius:2px}
.qs-in{padding:10px}
.qs-row{display:grid;gap:8px}
@media (min-width:380px){.qs-row{grid-template-columns:1fr 1fr}}
.qs-sel{position:relative}
.qs-sel .ic{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--brand);pointer-events:none}
.qs-sel .ic.dn{left:auto;right:9px;color:var(--muted)}
.qs-sel select{appearance:none;-webkit-appearance:none;width:100%;min-height:48px;border:1px solid var(--line-2);border-radius:2px;background:#fff;font:inherit;font-size:16px;color:var(--fg);padding:0 28px 0 36px}
.qs-go{width:100%;margin-top:8px;font-size:16px;padding:12px}
.qs-sub{margin:8px 0 0;font-size:13px;text-align:right}
@media (min-width:860px){.qs-in{display:grid;grid-template-columns:1fr 240px;gap:10px;align-items:center}.qs-go{margin-top:0}}
/* 地方ごとの都道府県（トップ）。スマホは閉じた行（地方名＋件数）を押すと開く。PCは開いた表 */
.rg-h{margin:16px 0 6px;font-size:14px;font-weight:700}
.rgs{border-top:1px solid var(--line)}
.rg{border-bottom:1px solid var(--line)}
.rg summary{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 34px 0 4px;cursor:pointer;list-style:none;position:relative;font-size:15px}
.rg summary::-webkit-details-marker{display:none}
.rg summary small{color:var(--muted);font-size:13px;margin-left:auto}
.rg summary::after{content:'';position:absolute;right:12px;top:50%;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:translateY(-70%) rotate(45deg)}
.rg[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.rg ul{list-style:none;margin:0;padding:0 4px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(8.4em,1fr));gap:0 8px}
.rg a{display:block;padding:8px 2px;font-size:15px;text-decoration:none;color:var(--fg)}
.rg a small{color:var(--muted);font-size:12px;margin-left:3px}
.rg a:hover{color:var(--brand-d);text-decoration:underline}
@media (min-width:860px){
  .rgs{border:1px solid var(--line);border-bottom:0}
  .rg{display:grid;grid-template-columns:9em 1fr}
  .rg summary{background:var(--soft);padding:8px;min-height:0;pointer-events:none;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;font-size:13px}
  .rg summary::after{display:none}
  .rg summary small{margin-left:0;font-size:12px}
  .rg ul{display:flex;flex-wrap:wrap;gap:0 14px;padding:6px 10px}
  .rg a{font-size:14px;padding:4px 0}
}
/* 職種のリンク：スマホは件数を名前の下に（名前が途中で折り返して読みにくかった） */
@media (max-width:599px){
  .links a{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:6px;align-content:center;padding:8px 10px;line-height:1.4}
  .links a small{grid-column:1;grid-row:2;margin-left:0}
  .links a::after{grid-column:2;grid-row:1 / span 2;align-self:center}
}
.stat-txt{font-size:14px;line-height:1.85;margin:0 0 12px}
.note{font-size:12px;color:var(--muted);margin:8px 0 0}
/* 地方・都道府県の一覧 */
.regions{border:1px solid var(--line);border-bottom:0}
.regions .region:first-child{border-top:0}
.more-btn{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:14px}
.top-cols{display:grid;gap:0}
@media (min-width:860px){.top-cols{grid-template-columns:1fr 1fr;gap:24px}}
.top-cols .links{grid-template-columns:1fr 1fr}
.org{font-size:14px;line-height:1.8;border:1px solid var(--line);padding:12px 14px;margin:0}
.org dt{font-weight:700;color:var(--muted);font-size:13px}
.org dd{margin:0 0 8px}
/* 一覧・特集・職種のページの見出しと説明（寮寮ワークの /shokushu と同じ形） */
h1.pg{font-size:19px;margin:8px 0 10px}
.pg-lead{margin:0 0 4px;background:var(--soft);border:1px solid var(--line);padding:12px 14px;font-size:14px;line-height:1.8}
.pg-ul{margin:0;padding-left:1.4em;font-size:14px;line-height:1.85}
.tg{margin:22px 0 0}
.tg-h{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;margin:0 0 8px}
.tg-h i{font-style:normal;width:26px;height:26px;border-radius:50%;color:#fff;display:grid;place-items:center;font-size:13px;flex:none;font-weight:700}
.tg-h i::before{content:attr(data-i)}
.tg-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;list-style:none;margin:0;padding:0}
@media (min-width:860px){.tg-list{grid-template-columns:repeat(4,1fr)}}
.tg-list a{display:block;border:1px solid var(--line);border-top:3px solid var(--c);background:#fff;padding:8px 10px;text-decoration:none;color:var(--fg);height:100%}
.tg-list a:hover{background:var(--soft)}
.tg-list b{display:block;font-size:14px;line-height:1.45}
.tg-list span{font-size:12px;color:var(--muted)}
.tg-list em{font-style:normal;color:var(--pay);font-weight:700}
/* =====================================================================
   一覧（brands/sokumatch/site/list）
   ===================================================================== */
/* 2026-10-30 寮寮ワークの一覧に寄せた：見出しは控えめ・説明は灰色の枠・カードは1列（PCは右に市区町村以外の条件の欄） */
.lh{margin:4px 0 12px}
.lh h1{margin:0;font-size:18px;font-weight:700;line-height:1.5}
.lh-n{display:inline;color:var(--brand);font-size:18px;margin-left:8px;font-variant-numeric:tabular-nums}
.lh-n small{font-size:14px;margin-left:1px}
.lh-n .upd{font-size:12px;color:var(--muted);font-weight:500;margin-left:6px}
.lh .intro{margin:8px 0 0;background:var(--soft);border:1px solid var(--line);padding:10px 12px;font-size:13px}
/* 2026-10-30 夕 一覧の上を短く：絞り込み（ボタン＋札）と市区町村は、スマホでは札を1行に並べて横にずらす */
.lfilter{margin:0 0 10px}
.lfilter details.chgbox{margin-bottom:8px}
.lfilter .qf{margin:0}
.chgbox .sbox>.bar{display:none}  /* 見出しは外の「条件を絞り込む」ボタンと同じなので出さない（検索の見出しを1つに） */
.lintro{margin:20px 0 0}
.lintro .intro{background:var(--soft);border:1px solid var(--line);padding:10px 12px;font-size:13px;margin:0 0 8px}
.lcity{margin:0 0 12px}
.lcity h2{font-size:14px;font-weight:700;color:var(--fg);margin:0 0 6px}
@media (max-width:699px){
  .qf .chips,.lcity>.cl{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px;-webkit-overflow-scrolling:touch}
  .qf .chips::-webkit-scrollbar,.lcity>.cl::-webkit-scrollbar{display:none}
  .qf .chips li,.lcity>.cl li{flex:none}
  .qf .chips a{min-height:38px;white-space:nowrap}
  .lcity>.cl a{padding:6px 10px;white-space:nowrap}
  .lcity .more-d{margin-top:4px}
}
.lkw{border:1px solid var(--line);border-left:3px solid var(--brand);background:#fff;padding:10px 12px;margin:14px 0;font-size:13px;line-height:1.7}
.lkw p{margin:0}
.lkw p b{display:block;font-size:14px}
.lkw ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px}
.lkw a{font-weight:700;font-size:13px}
.lkw a::after{content:" ›"}
.lkw small{color:var(--muted);font-weight:400;margin-left:4px;font-size:12px}
.lnote{font-size:12px;color:var(--muted);margin:10px 0 0}
.lgrid{display:grid;gap:0}
.lmain{min-width:0}
.lside{display:grid;gap:0;min-width:0}
@media (min-width:1000px){
  .lgrid{grid-template-columns:minmax(0,1fr) 280px;gap:28px;align-items:start}
  .lside>.blk:first-child{margin-top:0}
}
.wband{display:grid;grid-template-columns:8.5em 1fr 3.5em;gap:8px;align-items:center;font-size:13px;margin:6px 0}
.wband i{display:block;height:12px;background:var(--bar);border-radius:2px;overflow:hidden}
.wband i span{display:block;height:100%;background:var(--brand)}
.wband b{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}

/* =====================================================================
   求人詳細（brands/sokumatch/site/job）
   ===================================================================== */
/* 写真：寮寮ワークと同じく、スマホは次の写真が少しのぞくカルーセル、PCは左の欄に収める（2026-10-30） */
.jd-gal{margin:0}
.gal-wrap{position:relative}
.gal{display:grid;grid-auto-flow:column;grid-auto-columns:88%;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;scrollbar-width:none}
.gal:has(figure:only-child){grid-auto-columns:100%}
.gal::-webkit-scrollbar{display:none}
.gal figure{margin:0;scroll-snap-align:start;position:relative;aspect-ratio:4/3;background:var(--soft)}
.gal img{width:100%;height:100%;object-fit:cover}
.gal figcaption{position:absolute;left:0;bottom:0;background:rgba(0,0,0,.6);color:#fff;font-size:12px;padding:3px 10px}
.gal-n{font-size:12px;color:var(--muted);text-align:right;margin:4px 16px 0}
.gal-dots{display:flex;justify-content:center;gap:8px;margin:8px 0 0}
.gal-dots button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:#c8ccd1;cursor:pointer}
.gal-dots button[aria-current="true"]{background:var(--brand)}
.gal-nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:var(--r);border:0;background:rgba(31,35,40,.7);color:#fff;cursor:pointer;padding:0;display:grid;place-items:center}
.gal-nav .ic{width:22px;height:22px}
.gal-nav.prev{left:8px}.gal-nav.prev .ic{transform:rotate(180deg)}.gal-nav.next{right:8px}
.gal-nav[disabled]{opacity:0;pointer-events:none}
.jd-h{margin:8px 0 12px}
.jd-tags{margin-bottom:8px}
.jd-tags .tag{font-size:12px;padding:3px 8px}
.jd-h h1{margin:0;font-size:19px;font-weight:700;line-height:1.5}
.jd-catch{margin:4px 0 0;font-size:13px;line-height:1.6;color:var(--muted)}
.jd-dl{margin:12px 0 0;border:1px solid var(--line);background:#fff;font-size:14px}
.jd-dl div{display:grid;grid-template-columns:8.6em minmax(0,1fr);gap:8px;padding:9px 12px;border-bottom:1px solid var(--line)}
.jd-dl div:last-child{border-bottom:0}
.jd-dl dt{display:flex;align-items:flex-start;gap:5px;font-size:13px;font-weight:700;color:var(--muted);line-height:1.6}
.jd-dl dt .ic{width:15px;height:15px;color:var(--muted);margin-top:.2em}
.jd-dl dd{margin:0;line-height:1.6;overflow-wrap:anywhere}
.jd-dl dd small{display:block;font-size:12px;color:var(--muted)}
.jd-dl dd a{font-size:13px}
.jd-dl .pv{color:var(--pay);font-size:20px;font-weight:900}
.shift-b{display:inline-block;font-size:12px;color:#fff;background:#3d6b45;border-radius:2px;padding:0 6px;margin-right:6px;font-weight:700}
.who{margin:0}
.who-ul{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:4px}
.who-ul li{position:relative;padding-left:1.4em;font-size:15px;font-weight:700;line-height:1.6}
.who-ul li::before{content:"";position:absolute;left:.2em;top:.45em;width:.45em;height:.75em;border:solid var(--brand);border-width:0 2px 2px 0;transform:rotate(45deg)}
.who-dl{margin:0;border:1px solid var(--line);font-size:14px}
.who-dl div{display:grid;grid-template-columns:6.5em minmax(0,1fr);border-bottom:1px solid var(--line)}
.who-dl div:last-child{border-bottom:0}
.who-dl dt{background:var(--soft);font-weight:700;font-size:13px;padding:8px 10px}
.who-dl dd{margin:0;padding:8px 10px;line-height:1.6}
.who-note{margin:8px 0 0;font-size:13px;color:var(--muted);line-height:1.7}
.jd-sub{margin:4px 0 0;font-size:13px;color:var(--muted)}
.jd-tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
.jt{display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 10px;align-items:start;align-content:start;border:1px solid var(--line);border-radius:var(--r);padding:12px;background:#fff;min-width:0}
.jt>.ic{width:40px;height:40px;padding:9px;border-radius:50%;background:var(--brand-l);color:var(--brand);grid-row:1/3}
.jt .k{margin:1px 0 0;font-size:13px;color:var(--muted);line-height:1.4}
.jt .v{margin:0;font-size:15px;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.jt .v small{display:block;font-size:13px;font-weight:500;color:var(--muted);line-height:1.55;margin-top:2px}
.jt.wide{grid-column:1/-1}
.jt .pv{color:var(--pay);font-size:20px;font-weight:900}
.jt .v a{font-size:13px;font-weight:700;white-space:nowrap}
@media (max-width:599px){.jt{grid-template-columns:30px minmax(0,1fr);gap:2px 8px;padding:10px}.jt>.ic{width:30px;height:30px;padding:6px}}
@media (max-width:339px){.jd-tiles{grid-template-columns:1fr}}
.jd-meta{margin:6px 0 0;font-size:12px;color:var(--muted)}
.cta{display:grid;gap:8px;margin:14px 0}
.cta .btn{padding:11px 10px;font-size:17px;font-weight:700}
.cta .btn .ic{width:20px;height:20px}
.cta .btn-sub{font-size:12px;font-weight:500;margin-top:1px}
.cta .btn-tel{font-size:15px}
.cta .btn-keep{font-size:14px;font-weight:700}
.cta-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (min-width:860px){
  .jd-top{display:grid;grid-template-columns:400px minmax(0,1fr);gap:20px;align-items:start}
  .jd-top.noimg{grid-template-columns:minmax(0,1fr)}
  .jd-top .jd-dl{margin-top:0}
  .gal{grid-auto-columns:100%}
}
.hl3{border:1px solid var(--line);border-radius:var(--r);background:#fff;margin:16px 0;padding:14px}
.hl3 h2{margin:0 0 10px;font-size:17px;font-weight:900}
.hl3 ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
@media (min-width:700px){.hl3 ol{grid-template-columns:repeat(3,1fr)}}
.hl3 li{display:grid;grid-template-columns:28px 1fr;gap:2px 10px;align-items:start;background:var(--soft);border-radius:4px;padding:10px}
.hl3 .n{grid-row:1 / 3;width:28px;height:28px;border-radius:4px;background:var(--brand);color:#fff;font-weight:900;display:grid;place-items:center}
.hl3 b{font-size:15px;line-height:1.45}
.hl3 span.t{font-size:13px;line-height:1.65}
.pts{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:12px 14px;margin:12px 0}
.pts p{margin:0 0 6px;font-weight:900;font-size:15px}
.pts ul{margin:0;padding:0;list-style:none}
.pts li{position:relative;padding-left:24px;font-size:14px;line-height:1.75}
.pts li .ic{position:absolute;left:0;top:.35em;color:var(--brand)}
.txt{white-space:pre-wrap;font-size:15px;line-height:1.95;margin:0}
.spec-ul{margin:0;padding-left:1.2em;line-height:1.75}
.dorm-notes{border:1px solid var(--line);border-radius:var(--r);background:var(--soft);padding:10px 14px;margin:12px 0}
.dorm-notes p{margin:0 0 4px;font-weight:700;font-size:14px}
.dorm-notes ul{margin:0;padding-left:1.2em;font-size:14px;line-height:1.75}
.area-info{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:12px 14px;margin:12px 0}
.area-info h3{margin:0 0 8px;font-size:16px}
.area-info .rent{margin:8px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:14px}
.area-info .rent b{font-size:19px;color:var(--fg)}
.area-info .rent small{color:var(--muted);font-size:12px}
.area-info .save{margin:6px 0 0;font-size:14px;background:var(--yel-l);border-radius:4px;padding:8px 10px}
.area-info .save b{color:var(--pay)}
.area-info .save .fee{display:block;font-size:16px;color:var(--brand-d);margin-bottom:2px}
.area-info .rent .ref{font-size:12px;font-weight:700;color:#fff;background:#6b7178;border-radius:3px;padding:0 6px}
.area-info .rent-note{margin:4px 0 0;font-size:13px;color:var(--muted)}
.area-info .src{margin:8px 0 0;font-size:12px;color:var(--muted)}
.dorm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
@media (min-width:700px){.dorm-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}}
.dg{border:1px solid var(--line);border-radius:var(--r);padding:9px 12px;background:#fff;min-width:0}
.dg-k{display:block;font-size:12px;font-weight:700;color:var(--muted);line-height:1.45}
.dg-v{display:block;font-size:15px;font-weight:700;line-height:1.5}
.dorm-src{display:block;font-size:12px;color:var(--muted);margin-top:4px;padding-top:4px;border-top:1px dashed var(--line);line-height:1.55}
.dorm-ask{margin:8px 0 0;font-size:13px;color:var(--fg);background:var(--soft);border-radius:4px;padding:8px 10px}
.dorm-ask b{display:inline-block;font-size:12px;color:#fff;background:#6b7178;border-radius:3px;padding:0 6px;margin-right:8px}
.dorm-foot{margin:6px 0 0;font-size:12px;color:var(--muted)}
.rdorm{display:grid;gap:12px;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:12px;margin:0 0 12px}
@media (min-width:700px){.rdorm{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}
.rdorm-ph{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}
.rdorm-ph figure{margin:0;flex:0 0 100%;scroll-snap-align:start}
.rdorm-ph img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.rdorm-ph figcaption{font-size:12px;color:var(--muted);margin-top:2px}
.rdorm-at{margin:0;display:grid;gap:6px}
.rdorm-at div{display:grid;grid-template-columns:7.5em 1fr;gap:8px;font-size:14px}
.rdorm-at dt{font-weight:700;color:var(--muted)}
.rdorm-at dd{margin:0}
.rdorm-at small{color:var(--muted);font-size:12px;margin-left:4px}
.rdorm-note{margin:8px 0 0;font-size:14px;line-height:1.75}
.near-h{margin:12px 0 6px;font-size:14px;font-weight:700}
.near-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px}
.near-tiles li{border-radius:4px;padding:8px 10px;background:var(--soft)}
.near-tiles span{display:block;font-size:12px;color:var(--muted);font-weight:700}
.near-tiles b{font-size:16px}
.th-flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:6px}
.th-box{flex:1 1 140px;border:1px solid var(--line);border-radius:var(--r);padding:9px 12px;background:#fff;min-width:0}
.th-box .th-k{display:block;font-size:12px;font-weight:700;color:var(--muted)}
.th-box b{display:block;font-size:18px;line-height:1.4}
.th-box small{display:block;font-size:12px;color:var(--muted);line-height:1.45}
.th-box.th-end{border:2px solid var(--pay);background:#fff}
.th-box.th-end b{color:var(--pay);font-size:21px}
.th-op{align-self:center;font-size:18px;font-weight:700;color:var(--muted)}
@media (max-width:599px){
  .th-flow{flex-direction:column;gap:0;border:1px solid var(--line);border-radius:var(--r);background:#fff}
  .th-box{flex:none;display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:0 8px;border:0;border-radius:0;border-top:1px solid var(--soft);padding:8px 12px 8px 32px}
  .th-box:first-child{border-top:0}
  .th-box b{font-size:16px;text-align:right}
  .th-box small{grid-column:1 / -1}
  .th-box.th-end{border:0;border-top:2px solid var(--pay)}
  .th-box.th-end b{font-size:19px}
  .th-op{align-self:flex-start;height:0;margin:0 0 0 12px;font-size:15px;line-height:0;position:relative;top:18px;z-index:1}
}
.pay-ex small{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}
.gmap{position:relative;height:250px;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:#e9eef2}
.gmap-t{position:absolute;display:grid;grid-template-columns:repeat(5,256px);width:1280px}
.gmap-t img{display:block;width:256px;height:256px;max-width:none}
.gmap-pin{position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-22px 0 0 -11px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--brand);border:2px solid #fff}
.gmap-area{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;background:rgba(210,35,42,.12);border:2px solid rgba(210,35,42,.55)}
.gmap-lbl{position:absolute;left:8px;top:8px;background:rgba(255,255,255,.94);border-radius:4px;padding:3px 8px;font-size:13px;font-weight:700}
.gmap-attr{position:absolute;right:0;bottom:0;background:rgba(255,255,255,.88);font-size:12px;padding:1px 6px}
.gmap-attr a{color:var(--fg)}
.gmap-note{margin:6px 0 0;font-size:13px;color:var(--muted)}
.gmap-more{display:inline-block;margin-top:6px;font-weight:700}
.staff-say{background:var(--soft);border-radius:var(--r);padding:12px 14px;font-size:15px;line-height:1.85}
.staff-say p{margin:0 0 4px}
.staff-note{margin:6px 0 0;font-size:12px;color:var(--muted)}
.jd-end{margin:28px 0 0}
@media (min-width:860px){.jd-end{max-width:640px;margin-inline:auto}}

/* Taskyで作ったFV画像（2026-10-30） */
.fv-fig{margin:0 0 12px}
.fv-fig img{display:block;width:100%;height:auto;border-radius:8px}
.fv-area{max-width:860px;margin:0 auto 12px}
.hero-img .hero-k{margin-top:4px}
.hero-img h1.h1-sm .l1{font-size:15px}
.hero-img h1.h1-sm .l2{font-size:22px}
@media (min-width:860px){.hero-img h1.h1-sm .l1{font-size:17px}.hero-img h1.h1-sm .l2{font-size:26px}}

/* =====================================================================
   2026-10-30 夜 オーナー指摘で全体を直した分（上の指定より後に書いて上書きする）
   ①黒系に：ヘッダー・見出しの帯・フッター・主なボタンを墨色（#151515）、差し色は黄 #ffd400。給与の数字だけ赤、LINEは緑のまま
   ②文字が大きい：本文 15→14px、見出し・ボタン・リンクも一回り小さく
   ③ロゴ：赤い四角の「即」をやめ、黄色の「即」＋白い「マッチ」の文字だけ
   ④画面下の固定バー：電話（黄）とLINE（緑）を同じ大きさで並べ、PCでも出す
   ⑤求人カード：勤務形態・休日・月収・仕事内容を出し、寮費・募集人数・手取りは項目の途中で折り返さない
   ===================================================================== */
:root{--ink:#151515;--ink-2:#2a2a2a;--acc:#ffd400;--brand:#151515;--brand-d:#000;--brand-l:#f1f1f1;--cta:#151515;--cta-d:#000;--keep:#151515}
body{font-size:14px;line-height:1.7}
a{color:var(--ink)}
/* ヘッダー・ロゴ */
.hd{background:var(--ink);border-bottom:3px solid var(--acc)}
.hd .inner{min-height:56px}
.logo{color:#fff;gap:0}
.logo-mark{display:none}
.logo-txt small{color:#c9c9c9;font-size:12px;font-weight:500;letter-spacing:.08em}
.logo-txt b{display:flex;align-items:center;color:#fff;font-size:22px;font-weight:900;letter-spacing:.04em;line-height:1.15}
.logo-txt b i{font-style:normal;display:inline-block;background:var(--acc);color:var(--ink);padding:0 6px;margin-right:3px;transform:skewX(-8deg)}
.hd-i,.hd-i .ic{color:#fff}
.hd-i.keepn i{background:var(--acc);color:var(--ink)}
.hd-tel{color:#fff;font-size:18px}
.hd-tel .ic{color:var(--acc)}
.hd-tel small{color:#bdbdbd}
.hd-line{font-size:13px;padding:9px 12px}
.gnav{background:var(--ink-2);border-bottom:0}
.gnav a{color:#eee;font-size:13px;padding:9px 16px}
.gnav a:hover{color:var(--acc)}
@media (max-width:379px){.logo-txt b{font-size:19px}}
@media (min-width:860px){.hd .inner{min-height:64px}.logo-txt b{font-size:25px}}
/* 見出しの帯 */
.bar,.sec-h h2{background:var(--ink);color:#fff;font-size:14px;padding:7px 12px}
.bar a{color:var(--acc);font-size:12px}
.bar small{color:#c9c9c9}
.blk{margin-top:24px}
h1,h1.pg{font-size:18px}
.side-h{border-left-color:var(--ink);font-size:16px}
/* ボタン */
.btn{font-size:14px;padding:10px 13px}
.btn-apply,.btn-navy{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-apply:hover,.btn-navy:hover{background:#000;border-color:#000}
.btn-more{background:#fff;color:var(--ink);border-color:var(--ink)}
.btn-more:hover{background:var(--brand-l)}
.btn-tel{border-color:var(--ink)}
.btn-tel .ic{color:var(--ink)}
.btn-keep .ic{color:var(--ink)}
.btn-keep[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:var(--ink)}
/* 札 */
.tag.hot{border-color:#9a9a9a;color:var(--ink)}
.tag.soku{background:var(--acc);border-color:var(--acc);color:var(--ink);font-weight:700}
.tag.new{background:var(--ink);border-color:var(--ink)}
.chips a.on,.chips a[aria-current="true"]{background:var(--ink);border-color:var(--ink)}
.chips a.on small{color:#ddd}
.pagination li.active span{background:var(--ink);border-color:var(--ink)}
.gal-dots button[aria-current="true"],.gmap-pin,.hl3 .n,.wband i span{background:var(--ink)}
.jt>.ic{background:var(--brand-l);color:var(--ink)}
.who-ul li::before{border-color:var(--ink)}
.lkw{border-left-color:var(--ink)}
.faq summary{font-size:14px}
.faq summary::before{color:var(--ink);background:var(--acc);padding:0 4px;border-radius:2px}
.faq details>div{font-size:13px}
.links a{font-size:13px}
.links a:hover{color:#000}
.status{background:var(--brand-l);border-color:#cfcfcf}
/* トップ */
.tband{background:var(--ink);color:#fff;border-bottom:3px solid var(--acc)}
.tband h1{font-size:16px;color:#fff}
.tband-d{font-size:12px;color:#d5d5d5}
a.tband-n{color:#fff;text-decoration:none;display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:0 2px}
.tband-n b{color:var(--acc);font-size:21px}
.tband-n small{color:#bdbdbd}
.tband-go{font-size:12px;font-weight:700;color:var(--acc);margin-left:8px}
a.tband-n:hover .tband-go{text-decoration:underline}
.tgo a{border-color:var(--ink);color:var(--ink);font-size:15px;min-height:48px}
.tgo a::after{content:"›";margin-left:4px}
.tgo a:hover{background:var(--brand-l)}
.links-isogi a{font-size:14px;min-height:46px;white-space:nowrap}
@media (max-width:599px){.links-isogi a small{display:inline;grid-column:auto;grid-row:auto}.links.links-isogi a{display:flex}}
.qs-sel .ic{color:var(--ink)}
.cl-city{margin-top:2px}
.cl-city a{font-size:13px}
.cl-city a small{margin-left:6px}
.org-t{width:100%;border-collapse:collapse;font-size:13px;border-top:1px solid var(--line)}
.org-t th,.org-t td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top;line-height:1.6}
.org-t th{width:6.5em;background:var(--soft);font-weight:700;white-space:nowrap}
.org-t td small{display:block;color:var(--muted);font-size:12px}
.org-t a{font-weight:700}
.kv-line p{font-size:13px}
.kv-line p strong{font-size:15px}
/* フッター */
.ft{background:var(--ink);border-top:3px solid var(--acc);color:#cfcfcf}
.ft a{color:#e6e6e6}
.ft a:hover{color:var(--acc)}
.ft h3{color:#fff;font-size:13px;border-bottom-color:#3a3a3a}
.ft .copy{background:#000}
/* 画面下の固定バー（電話・LINE） */
.fixbar{background:rgba(21,21,21,.97);border-top:2px solid var(--acc);padding:7px 10px calc(7px + env(safe-area-inset-bottom,0px));gap:8px;justify-content:center}
.fixbar .btn{flex:1 1 0;max-width:300px;min-height:50px;padding:6px 8px;font-size:15px;border-radius:6px;gap:8px}
.fixbar .btn>span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}
.fixbar .btn small{font-size:12px;font-weight:500;opacity:.85}
.fixbar .btn-tel,.fixbar .btn-tel:not(:only-of-type){flex:1 1 0;background:var(--acc);border-color:var(--acc);color:var(--ink)}
.fixbar .btn-tel .ic{color:var(--ink)}
.fixbar .btn-apply{background:#fff;border-color:#fff;color:var(--ink)}
.fixbar:has(.btn-apply) .btn-tel{flex:0 0 auto;padding-inline:12px}
@media (min-width:860px){.fixbar{display:flex}body.has-fix{padding-bottom:72px}}
/* 求人カード */
.jc{gap:7px;padding:11px 12px}
.jc:hover{border-color:var(--ink)}
.jc h3{font-size:15px}
.jc:hover h3 a{color:#000}
.jc-dl{font-size:13px}
.jc-dl div{grid-template-columns:4.6em minmax(0,1fr)}
.jc-dl .pv{font-size:16px}
.jc-mon{display:inline-block;margin-left:8px;font-size:13px;font-weight:700;color:var(--ink);white-space:nowrap}
.jc-work{margin:0;font-size:13px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jc-work b{display:inline-block;font-size:12px;background:var(--brand-l);padding:0 6px;margin-right:6px;border-radius:2px}
ul.jc-key{list-style:none;margin:0;padding:6px 8px;display:flex;flex-wrap:wrap;gap:2px 14px;background:#f7f7f5;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
ul.jc-key li{white-space:nowrap;display:flex;align-items:baseline;gap:5px}
ul.jc-key b{font-size:14px;color:var(--ink);font-weight:700}
ul.jc-key b.pv{color:var(--pay)}
ul.jc-key small{display:none}
@media (min-width:700px){ul.jc-key small{display:inline;font-size:12px}.jc-dl div{grid-template-columns:5.4em minmax(0,1fr)}}@media (max-width:699px){.jc-mon{display:block;margin-left:0}}
/* 2026-10-30 夜 オーナー指摘「緑の枠がださい」「電話するが黒ふちのみでださい」：
   LINE・電話の相談枠は黒地に。LINEは緑、電話は黄の塗り（画面下の固定バーと同じ組み合わせ） */
.kv-line{background:var(--ink);border:0;border-left:6px solid var(--acc);border-radius:4px;padding:14px 16px;color:#fff}
.kv-line p{color:#d0d0d0;font-size:13px}
.kv-line p strong{color:#fff;font-size:16px;font-weight:900;margin-bottom:4px}
.kv-line-btns .btn{min-height:54px;border-radius:6px}
.kv-line-btns .btn-tel{background:var(--acc);border-color:var(--acc);color:var(--ink)}
.kv-line-btns .btn-tel:hover{background:#ffe14d;border-color:#ffe14d}
.kv-line-btns .btn small{opacity:.85}
@media (min-width:860px){.kv-line{grid-template-columns:1fr 440px;padding:16px 20px}}/* 特集の一覧（brands/sokumatch/site/features）2026-10-30 夜：黒い帯の見出し＋白いタイル。件数は右、押すと左に黄色の線 */
.ft-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:6px}
@media (min-width:600px){.ft-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:860px){.ft-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ft-tiles a{display:flex;align-items:center;gap:10px;min-height:50px;padding:8px 12px;border:1px solid var(--line-2);border-left:4px solid var(--ink);border-radius:4px;background:#fff;color:var(--ink);text-decoration:none}
.ft-tiles a:hover{border-left-color:var(--acc);background:#fffbe0}
.ft-tiles b{flex:1 1 auto;min-width:0;font-size:14px;line-height:1.45}
.ft-tiles span{flex:none;font-size:15px;font-weight:900;white-space:nowrap}
.ft-tiles span small{font-size:12px;font-weight:500;color:var(--muted);margin-left:1px}
.ft-tiles a::after{content:"›";flex:none;color:var(--muted);font-size:18px}
.pg-lead{background:#f7f7f5}
/* スマホでもグローバルメニューを出す（横にずらす1行）2026-10-30 夜 */
@media (max-width:859px){.gnav{display:block}.gnav ul{overflow-x:auto;scrollbar-width:none;white-space:nowrap}.gnav ul::-webkit-scrollbar{display:none}.gnav li{flex:none}.gnav a{padding:8px 12px;font-size:13px}}

/* 2026-10-31 なし系（家なし・所持金なし・携帯なし・身分証なし）の入口と判定表 */
.nashi{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.nashi li{border-bottom:1px solid var(--line);min-width:0}
.nashi a{display:grid;grid-template-columns:minmax(0,1fr) auto 10px;column-gap:10px;align-items:center;padding:10px 12px;color:var(--fg);text-decoration:none;min-height:56px}
.nashi a b{font-size:15px;font-weight:900;line-height:1.4}
.nashi a small{grid-column:1;grid-row:2;font-size:12px;color:var(--muted);line-height:1.5}
.nashi a .num{grid-column:2;grid-row:1 / span 2;font-size:13px;font-weight:700;white-space:nowrap}
.nashi a::after{content:"›";grid-column:3;grid-row:1 / span 2;color:var(--muted)}
.nashi a:hover{background:var(--soft)}
@media (min-width:860px){.nashi{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid var(--line)}.nashi li{border-right:1px solid var(--line)}}
.qf-nashi{margin-top:8px}
.qf-h{margin:0 0 4px;font-size:12px;font-weight:700;color:var(--muted)}
.lnashi{margin:16px 0;border-top:3px solid var(--acc,#ffd400)}
.lnashi h2{font-size:16px;font-weight:900;margin:10px 0 8px;line-height:1.5}
.nchk{margin:0;border:1px solid var(--line);font-size:14px}
.nchk div{display:grid;grid-template-columns:7.5em minmax(0,1fr);border-bottom:1px solid var(--line)}
.nchk div:last-child{border-bottom:0}
.nchk dt{background:var(--soft);font-weight:700;font-size:13px;padding:8px 10px;line-height:1.5}
.nchk dd{margin:0;padding:8px 10px;line-height:1.7}
.nchk dd b{font-weight:900}
.nchk .mk{display:inline-block;font-size:12px;font-weight:900;padding:1px 6px;margin-right:6px;border:1px solid var(--line-2);border-radius:3px;white-space:nowrap}
.nchk .mk.ok{background:var(--ink,#151515);color:#fff;border-color:var(--ink,#151515)}
.nchk .mk.ask{background:#fff;color:var(--muted)}
.who-alt{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;font-weight:700}
.org-t td small{display:block;font-size:12px;color:var(--muted)}
/* 2026-10-31 ユーザー指摘「CTAの文字がずれている」：電話ボタンの小さい文字（番号＋受付時間）がボタンからはみ出していた→2行にして左右同じ幅に */
.kv-line-btns{grid-template-columns:1fr 1fr}
.kv-line-btns .btn small{display:block;white-space:normal;line-height:1.35;text-align:center}
.cta-2 .btn-tel .btn-sub{line-height:1.35}