/* /recruit/ 共用。tools/gen_recruit.py が生成する。手で直さない。 */

/* --- ヒーロー（白基調・右に写真） --- */
.rh{position:relative;background:linear-gradient(180deg,#eef4fc 0%,#f7fafe 58%,#fff 100%);border-bottom:1px solid var(--hair)}
.rh .in{max-width:var(--wrap);margin:0 auto;padding:40px 20px 42px;
        display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,420px);gap:40px;align-items:center}
.rh .eyebrow{font-size:13px;letter-spacing:.14em;color:var(--blue);font-weight:700}
.rh h1{font-size:clamp(27px,3.6vw,42px);font-weight:900;line-height:1.45;margin-top:10px;color:var(--black)}
.rh h1 em{font-style:normal;color:var(--blue)}
.rh .sub{margin-top:16px;font-size:16.5px;line-height:2;color:#333;max-width:32em}
.rh .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.rh .chips span{font-size:13.5px;background:#fff;border:1px solid #cfdcf0;color:#2b4a7a;border-radius:999px;padding:6px 15px}
.rh .rhcta{margin-top:24px;display:flex;flex-wrap:wrap;gap:10px}
.rh .photo{border-radius:18px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 14px 34px rgba(31,64,115,.16);background:#e7eef8}
.rh .photo img{width:100%;height:100%;object-fit:cover;display:block}

/* --- 求人カード（一覧） --- */
.jgroup{margin-top:30px}
.jgroup>h3{font-size:19px;font-weight:900;padding-bottom:10px;border-bottom:2px solid var(--blue);display:inline-block}
.jlist{display:grid;gap:16px;margin-top:18px}
.jcard{background:#fff;border:1px solid var(--hair);border-radius:16px;overflow:hidden;
       display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr)}
.jcard .ph{background:#dce4ef;min-height:170px}
.jcard .ph img{width:100%;height:100%;object-fit:cover;display:block}
.jcard .bd{padding:20px 22px 22px}
.jcard .tags{display:flex;flex-wrap:wrap;gap:6px}
.jcard .tags span{font-size:12px;color:var(--blue);background:#eef4fd;border-radius:6px;padding:3px 10px}
.jcard .tags span.w{color:#8a5a00;background:#fdf2dd}
.jcard h4{font-size:19px;font-weight:900;line-height:1.55;margin-top:10px}
.jcard h4 a{color:var(--black);text-decoration:none}
.jcard h4 a:hover{color:var(--blue);text-decoration:underline}
.jcard .lead{font-size:14.5px;color:#444;line-height:1.9;margin-top:7px}
.jcard .pay{font-size:23px;font-weight:900;color:var(--blue);line-height:1.35;margin-top:12px}
.jcard .pay small{display:block;font-size:12.5px;color:var(--gray);font-weight:400;margin-top:2px}
.jcard .meta{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:3px 14px;font-size:14px;margin-top:12px;line-height:1.9}
.jcard .meta dt{color:var(--gray);font-size:13px}
.jcard .meta dd{margin:0}
.jcard .go{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.jcard.nophoto{grid-template-columns:minmax(0,1fr)}
.jcard.prep{background:#fafbfd}
.jcard.prep .pay{color:#666;font-size:18px}

/* --- 1求人ページ --- */
.jcrumb{font-size:13px;color:var(--gray);padding:14px 0 0}
.jcrumb a{color:var(--blue)}
.jhead{background:#f7fafe;border-bottom:1px solid var(--hair)}
.jhead .in{max-width:var(--inner);margin:0 auto;padding:6px 20px 30px}
.jhead h1{font-size:clamp(23px,3vw,32px);font-weight:900;line-height:1.5;margin-top:12px}
.jhead .pay{font-size:27px;font-weight:900;color:var(--blue);margin-top:14px;line-height:1.35}
.jhead .pay small{display:block;font-size:13px;color:var(--gray);font-weight:400;margin-top:3px}
.jhead .meta{display:grid;grid-template-columns:6em minmax(0,1fr);gap:4px 16px;font-size:15px;margin-top:14px;line-height:1.95}
.jhead .meta dt{color:var(--gray);font-size:13.5px}
.jhead .meta dd{margin:0}
.jhead .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.jhead .tags span{font-size:12px;color:var(--blue);background:#e8f0fd;border-radius:6px;padding:3px 10px}
.jbody{max-width:var(--inner);margin:0 auto;padding:0 20px}
.jbody h2{font-size:20px;font-weight:900;margin-top:34px;padding-bottom:8px;border-bottom:1px solid var(--hair)}
.jbody p{font-size:15.5px;line-height:2;color:#333;margin-top:14px}
.jdl{display:grid;grid-template-columns:11em minmax(0,1fr);gap:8px 18px;font-size:15px;line-height:1.95;margin-top:16px}
.jdl dt{color:var(--gray);font-size:13.5px}
.jdl dd{margin:0}
.jsteps{display:flex;flex-wrap:wrap;gap:8px;font-size:14.5px;margin-top:16px}
.jsteps span{background:#fff;border:1px solid var(--hair);border-radius:999px;padding:6px 15px}
.tl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:16px}
.tl div{background:#f7fafe;border:1px solid #e2ebf7;border-radius:12px;padding:14px 16px}
.tl time{display:block;font-size:12.5px;color:var(--blue);font-weight:700;letter-spacing:.04em}
.tl b{display:block;margin:4px 0;font-size:15px}
.tl p{font-size:13.5px;color:#444;line-height:1.85;margin:0}

/* --- 登録フォーム --- */
.rentry{background:#f7fafe;padding:34px 20px 40px;border-top:1px solid var(--hair)}
.rcard{background:#fff;border:1px solid var(--hair);border-radius:16px;padding:22px 24px 24px;
       box-shadow:0 8px 26px rgba(31,64,115,.10);max-width:820px;margin:0 auto}
.rcard .ttl{font-weight:900;font-size:20px;line-height:1.45}
.rcard .ttl em{font-style:normal;color:var(--blue)}
.rcard .sub{font-size:13.5px;color:var(--gray);margin-top:5px;line-height:1.8}
.rbar{display:flex;gap:7px;margin:16px 0}
.rbar i{flex:1;height:6px;border-radius:3px;background:#e6ecf5;display:block;transition:background .2s}
.rbar i.on{background:var(--blue)}
.rstep{font-size:12.5px;color:var(--gray);letter-spacing:.04em}
.rq{font-weight:700;font-size:16px;margin:3px 0 11px}
.ropts{display:flex;flex-wrap:wrap;gap:8px}
.ropt input{position:absolute;opacity:0;width:0;height:0}
.ropt span{display:inline-block;border:1.5px solid var(--hair);border-radius:10px;padding:9px 15px;font-size:15px;cursor:pointer;background:#fff;line-height:1.6}
.ropt input:checked+span{border-color:var(--blue);background:#eef4fd;color:var(--blue);font-weight:700}
.ropt input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.rf{margin-top:13px}
.rf label{display:block;font-size:13px;color:var(--gray);margin-bottom:5px}
.rf input,.rf select,.rf textarea{width:100%;font:inherit;font-size:16px;padding:11px 12px;border:1px solid var(--hair);border-radius:10px;background:#fbfcfe}
.rf textarea{min-height:78px;resize:vertical}
.rnav{display:flex;justify-content:space-between;gap:10px;margin-top:16px}
.rerr{display:none;color:#c0392b;font-size:13.5px;margin-top:9px}
.ragree{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;font-size:13px;line-height:1.8;margin-top:12px;color:#444}
.ragree input{margin-top:5px;width:17px;height:17px}
.rnote{font-size:12px;color:var(--gray);line-height:1.8;margin-top:11px}

/* --- QA・注記 --- */
.qa{display:grid;gap:10px;margin-top:20px}
.qa details{background:#fff;border:1px solid var(--hair);border-radius:12px;padding:15px 18px}
.qa summary{cursor:pointer;font-weight:700;font-size:16px}
.qa p{margin-top:9px;font-size:15px;color:#333;line-height:1.95}
.fineprint{font-size:12.5px;color:var(--gray);line-height:1.95;margin-top:18px}

/* --- 広告用LP（/recruit/entry/）。出口を作らない縦1本の導線 --- */
.lp .hd{justify-content:space-between}
.lp [hidden]{display:none!important}   /* .btn の display が [hidden] に勝つため */
.lpfv{background:linear-gradient(180deg,#eef4fc 0%,#f7fafe 60%,#fff 100%);border-bottom:1px solid var(--hair)}
.lpfv .in{max-width:var(--wrap);margin:0 auto;padding:30px 20px 36px;display:grid;
          grid-template-columns:minmax(0,1fr) minmax(0,460px);grid-template-areas:'copy form' 'body form';
          column-gap:36px;row-gap:20px;align-items:start}
.lpcopy{grid-area:copy}
.lpbody{grid-area:body}
.lpform{grid-area:form}
.lpfv h1{font-size:clamp(26px,3.4vw,40px);font-weight:900;line-height:1.45;color:var(--black)}
.lpfv h1 em{font-style:normal;color:var(--blue)}
.lpfv .eyebrow{font-size:13px;letter-spacing:.14em;color:var(--blue);font-weight:700}
.lpfv .pts{display:grid;gap:10px;margin-top:20px}
.lpfv .pts li{list-style:none;background:#fff;border:1px solid var(--hair);border-radius:12px;padding:12px 16px;font-size:15.5px;line-height:1.8;
             display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start}
.lpfv .pts b{color:var(--blue);font-weight:900}
.lpfv .ph{margin-top:20px;border-radius:16px;overflow:hidden;aspect-ratio:16/9}
.lpfv .ph img{width:100%;height:100%;object-fit:cover;display:block}
/* フォームは右列（スマホでは見出しの直後） */
.lpform{background:#fff;border:1px solid var(--hair);border-radius:16px;box-shadow:0 10px 30px rgba(31,64,115,.12);padding:20px 22px 22px;position:sticky;top:84px}
.lpform .ttl{font-size:19px;font-weight:900;line-height:1.5}
.lpform .ttl em{font-style:normal;color:var(--blue)}
.lpform .note{font-size:12.5px;color:var(--gray);margin-top:6px;line-height:1.8}
.lpbar{display:flex;gap:5px;margin:14px 0 6px}
.lpbar i{flex:1;height:5px;border-radius:3px;background:#e6ecf5;display:block}
.lpbar i.on{background:var(--blue)}
.lpleft{font-size:12.5px;color:var(--gray);text-align:right}
.lpsub2{margin-top:14px;font-size:16.5px;line-height:2;color:#333;max-width:30em}
.lphint{display:block;font-size:12.5px;color:var(--blue);margin-top:6px;line-height:1.7}
.lpnote{font-size:12.5px;color:var(--gray);line-height:1.95;margin-top:16px}
.lpq{font-weight:700;font-size:17px;margin:10px 0 12px}
.lpsub{font-size:13px;color:var(--gray);margin:-6px 0 12px;line-height:1.7}
.lpgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px}
.lpopt input{position:absolute;opacity:0;width:0;height:0}
.lpopt span{display:block;text-align:center;border:1.5px solid var(--hair);border-radius:11px;padding:13px 10px;font-size:15.5px;cursor:pointer;background:#fff;line-height:1.5}
.lpopt input:checked+span{border-color:var(--blue);background:#eef4fd;color:var(--blue);font-weight:700}
.lpopt input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.lprow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.lpnav{display:flex;justify-content:space-between;gap:10px;margin-top:18px}
.lpnav .btn{min-width:120px;justify-content:center}
.lpnav .btn-fill{flex:1}
.lpwhy{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:26px}
.lpwhy div{background:#fff;border:1px solid var(--hair);border-radius:16px;padding:20px 22px}
.lpwhy b{display:block;font-size:17px;font-weight:900;color:var(--blue)}
.lpwhy p{font-size:14.5px;line-height:1.95;color:#333;margin-top:8px}
.lpjobs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:24px}
.lpjob{background:#fff;border:1px solid var(--hair);border-radius:16px;overflow:hidden}
.lpjob .ph{aspect-ratio:16/9;background:#dce4ef}
.lpjob .ph img{width:100%;height:100%;object-fit:cover;display:block}
.lpjob .bd{padding:16px 18px 18px}
.lpjob b{font-size:16.5px;font-weight:900;line-height:1.55;display:block}
.lpjob .pay{font-size:20px;font-weight:900;color:var(--blue);margin-top:8px;line-height:1.35}
.lpjob .pay small{display:block;font-size:12px;color:var(--gray);font-weight:400;margin-top:2px}
.lpjob p{font-size:14px;color:#444;line-height:1.9;margin-top:8px}
.lpend{background:#f7fafe;border-top:1px solid var(--hair);padding:34px 20px 40px;text-align:center}
.lpend h2{font-size:23px;font-weight:900}
.lpend p{font-size:15px;color:#333;line-height:2;margin-top:10px}
.lpfoot{font-size:12.5px;color:var(--gray);line-height:2;padding:26px 20px 90px;text-align:center}
.lpfoot a{color:var(--blue)}
@media(max-width:980px){
  .lpfv .in{grid-template-columns:minmax(0,1fr);grid-template-areas:'copy' 'form' 'body';row-gap:20px;padding-block:22px 28px}
  .lpform{position:static}
  .lpfv .ph{aspect-ratio:16/10}
}

/* --- LPの視覚要素（バッジ・チェック・吹き出し・比較） --- */
.lpbadges{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.lpbadges span{display:inline-flex;align-items:center;gap:6px;background:#fff7e8;border:1px solid #f3d9a4;color:#8a5a00;
               font-size:13.5px;font-weight:700;border-radius:999px;padding:7px 15px}
.lpbadges span::before{content:"";width:16px;height:16px;flex:none;background:var(--accent);
               -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
               mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.lpfv .pts li{grid-template-columns:auto minmax(0,1fr)}
.lpfv .pts li::before{content:"";width:22px;height:22px;margin-top:2px;flex:none;background:var(--blue);
               -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1 15-4-4 1.4-1.4L11 14.2l5.6-5.6L18 10z'/%3E%3C/svg%3E") center/contain no-repeat;
               mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1 15-4-4 1.4-1.4L11 14.2l5.6-5.6L18 10z'/%3E%3C/svg%3E") center/contain no-repeat}
.lpfv .pts li>b{display:none}

/* 吹き出し（不安 → 答え） */
.lpvoice{display:grid;gap:18px;margin-top:26px}
.lpvoice .row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.lpvoice .who{width:46px;height:46px;border-radius:50%;background:#e8f0fd;flex:none;position:relative}
.lpvoice .who::after{content:"";position:absolute;inset:9px;background:var(--blue);opacity:.55;
               -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.4 0-8 2.2-8 5v1h16v-1c0-2.8-3.6-5-8-5z'/%3E%3C/svg%3E") center/contain no-repeat;
               mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.4 0-8 2.2-8 5v1h16v-1c0-2.8-3.6-5-8-5z'/%3E%3C/svg%3E") center/contain no-repeat}
.lpvoice .say{position:relative;background:#fff;border:1px solid var(--hair);border-radius:14px;padding:13px 17px;font-size:16px;font-weight:700;line-height:1.75}
.lpvoice .say::before{content:"";position:absolute;left:-7px;top:16px;width:12px;height:12px;background:#fff;border-left:1px solid var(--hair);border-bottom:1px solid var(--hair);transform:rotate(45deg)}
.lpvoice .lpans{margin:10px 0 0 60px;background:#eef4fd;border-radius:14px;padding:14px 18px;font-size:14.5px;line-height:1.95;color:#25406b}
.lpvoice .lpans b{color:var(--blue)}

/* 比較（一般的な求人サイト / Anchor） */
.lpcmp{margin-top:24px;background:#fff;border:1px solid var(--hair);border-radius:16px;overflow:hidden}
.lpcmp .r{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) minmax(0,1.6fr);gap:0;border-top:1px solid var(--hair)}
.lpcmp .r:first-child{border-top:0;background:#f7fafe}
.lpcmp .c{padding:14px 16px;font-size:14.5px;line-height:1.85}
.lpcmp .c.h{font-weight:700;color:var(--gray);font-size:13.5px}
.lpcmp .c.a{background:#f4f8ff;font-weight:700;color:#25406b;border-left:3px solid var(--blue)}
.lpcmp .r:first-child .c{font-weight:700;color:var(--black);font-size:14px}
@media(max-width:820px){
  .lpcmp .r{grid-template-columns:minmax(0,1fr)}
  .lpcmp .c{padding:10px 14px}
  .lpcmp .c.h{background:#f7fafe;font-weight:900;color:var(--black)}
  .lpcmp .r:first-child{display:none}
  .lpcmp .c.g::before{content:"一般的な求人サイト：";color:var(--gray);font-size:12.5px}
  .lpcmp .c.a::before{content:"Anchor：";color:var(--blue);font-size:12.5px}
  .lpvoice .lpans{margin-left:0}
}

/* --- スマホ固定CTA --- */
.spbar{display:none}
@media(max-width:980px){
  .rh .in{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:32px 30px}
  .rh .photo{aspect-ratio:16/9}
  .jcard{grid-template-columns:minmax(0,1fr)}
  .jcard .ph{aspect-ratio:16/9;min-height:0}
}
@media(max-width:820px){
  .jdl,.jhead .meta{grid-template-columns:minmax(0,1fr);gap:0}
  .jdl dt,.jhead .meta dt{padding-top:10px}
  body{padding-bottom:76px}
  .spbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--hair);
         padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));gap:10px;box-shadow:0 -4px 14px rgba(15,27,46,.08)}
  .spbar .btn{flex:1;justify-content:center}
}