
  :root{
    --paper:#fcfcfa; --ink:#1c1b18; --sub:#3c3a34; --mut:#a09a8c;
    --line:#e7e4dc; --brand:#e8382f; --dark:#161511; --darktx:#f2efe7;
  }
  html{scroll-behavior:smooth}
  body{margin:0; background:var(--paper); color:var(--ink);
    font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",sans-serif;
    -webkit-font-smoothing:antialiased; font-size:15px;}
  img{max-width:100%}
  a{color:inherit}
  .serif{font-family:"Hiragino Mincho ProN","Yu Mincho","Hiragino Serif",serif;}
  .wrap{max-width:1080px; margin:0 auto; padding:0 24px; box-sizing:border-box;}

  .note{background:var(--dark); color:#b5b0a2; font-size:12px; letter-spacing:.08em;
    text-align:center; padding:9px 16px; line-height:1.7;}
  .note b{color:#f2efe7; font-weight:600;}

  /* ナビ */
  .nav{position:sticky; top:0; z-index:40; background:rgba(252,252,250,.92);
    backdrop-filter:blur(8px); border-bottom:1px solid var(--line);}
  .nav .in{display:flex; align-items:center; gap:14px; max-width:1080px; margin:0 auto;
    padding:16px 24px; box-sizing:border-box;}
  .nav img.mk{width:34px; height:34px;}
  .nav img.mj{height:19px; width:auto;}
  .nav ul{display:flex; gap:24px; list-style:none; margin:0 0 0 auto; padding:0;
    font-size:12.5px; letter-spacing:.14em;}
  .nav a{text-decoration:none;}
  .nav a:hover{color:var(--brand);}
  .nav .now{color:var(--brand); border-bottom:1px solid var(--brand); padding-bottom:3px;}
  .nav .contact{border:1px solid var(--line); padding:9px 18px; margin-left:2px;}
  .nav .contact:hover{background:var(--ink); border-color:var(--ink); color:var(--paper);}
  .menubtn{display:none; appearance:none; background:none; border:1px solid var(--line);
    color:var(--ink); font-family:inherit; font-size:11px; letter-spacing:.28em;
    padding:10px 14px 10px 18px; margin-left:auto; cursor:pointer;}
  @media (max-width:700px){
    .menubtn{display:block;}
    .nav ul{display:none;}
    .nav.open ul{display:grid; position:absolute; top:100%; left:0; right:0;
      background:var(--paper); border-bottom:1px solid var(--line); z-index:41;
      margin:0; padding:0 0 14px; gap:0; font-size:14px; letter-spacing:.18em;}
    .nav.open li{border-top:1px solid var(--line);}
    .nav.open a{display:block; padding:16px 26px;}
    .nav.open .now{border-bottom:none;}
    .nav.open .contact{border:none; margin:0; color:var(--brand); font-weight:600;}
  }

  /* ヒーロー */
  .hero{position:relative; height:64vh; min-height:420px; max-height:680px; overflow:hidden;
    display:grid; place-items:end start;}
  .hero .bg{position:absolute; inset:0; background:var(--hero) center/cover no-repeat;
    animation:kb 20s ease-in-out infinite alternate;}
  @keyframes kb{from{transform:scale(1)} to{transform:scale(1.07)}}
  .hero .veil{position:absolute; inset:0;
    background:linear-gradient(to bottom, rgba(20,18,14,.2), rgba(20,18,14,.62));}
  .hero .inner{position:relative; padding:0 24px 56px; max-width:1080px; width:100%; box-sizing:border-box;
    margin:0 auto;}
  .hero .en{color:#d8d3c5; font-size:12px; letter-spacing:.44em; margin:0 0 18px;}
  .hero h1{color:#fff; font-weight:600; font-size:clamp(26px,4.6vw,44px); line-height:1.8;
    letter-spacing:.08em; margin:0; text-shadow:0 2px 26px rgba(0,0,0,.5); text-wrap:balance;}

  /* 共通 */
  .sec{padding:92px 0;}
  .sec + .sec{border-top:1px solid var(--line);}
  .eyebrow{font-size:11.5px; letter-spacing:.32em; color:var(--mut); margin:0 0 18px;}
  h2{font-weight:600; font-size:clamp(24px,3.3vw,33px); line-height:1.75; margin:0 0 26px;
    letter-spacing:.06em; text-wrap:balance;}
  p.body{font-size:14.5px; line-height:2.3; margin:0; max-width:34em; color:var(--sub);}
  .cols{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
  @media (max-width:760px){ .cols{grid-template-columns:1fr; gap:30px;} }

  /* 働く風景 */
  .scenes{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
    border:1px solid var(--line); margin-top:44px;}
  @media (max-width:760px){ .scenes{grid-template-columns:repeat(2,1fr);} }
  .scenes figure{margin:0}
  .scenes img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover;}

  /* 募集枠 */
  .jobs{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:44px;}
  @media (max-width:760px){ .jobs{grid-template-columns:1fr;} }
  .jobcard{display:flex; flex-direction:column; border:1px solid var(--line); padding:32px 28px 26px;
    text-decoration:none; transition:background .25s ease, border-color .25s ease;}
  .jobcard:hover{background:#f6f4ef; border-color:#cfcabf;}
  .jobcard .en{font-size:10.5px; letter-spacing:.3em; color:var(--brand); margin:0 0 14px; font-weight:600;}
  .jobcard h3{margin:0 0 14px; font-size:17.5px; letter-spacing:.12em; font-weight:600;}
  .jobcard p{margin:0 0 18px; font-size:13px; line-height:2.05; color:var(--sub);}
  .jobcard .tags{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px;}
  .jobcard .tags span{font-size:10.5px; letter-spacing:.12em; color:var(--sub);
    border:1px solid var(--line); padding:4px 10px;}
  .jobcard .lk{margin-top:auto; font-size:12px; letter-spacing:.2em; color:var(--mut);}
  .jobcard:hover .lk{color:var(--brand);}
  .subroles{margin-top:26px; font-size:12.5px; color:var(--mut); letter-spacing:.06em; line-height:2.2;}
  .subroles a{color:var(--sub); text-decoration:none; border-bottom:1px solid var(--line); margin:0 4px;}
  .subroles a:hover{color:var(--brand); border-color:var(--brand);}

  /* 声 */
  .voices{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  @media (max-width:760px){ .voices{grid-template-columns:1fr;} }
  .voice{border-top:2px solid var(--ink); padding-top:22px;}
  .voice .ph{width:76px; height:76px; border-radius:50%; background:#eceae3; border:1px solid var(--line);
    overflow:hidden; margin-bottom:16px;} .voice .ph svg{display:block; width:100%; height:100%;}
  .voice .role{font-size:11.5px; letter-spacing:.22em; color:var(--brand); margin:0 0 12px;}
  .voice p.q{font-size:13.5px; line-height:2.15; margin:0; color:var(--sub);}

  /* 応募の流れ */
  .flow{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
    border:1px solid var(--line); margin-top:44px;}
  @media (max-width:760px){ .flow{grid-template-columns:1fr;} }
  .step{background:var(--paper); padding:30px 24px 28px; position:relative;}
  .step .no{font-family:"Hiragino Mincho ProN","Yu Mincho",serif; font-size:30px; color:var(--brand);
    margin:0 0 12px; font-weight:600;}
  .step h3{margin:0 0 10px; font-size:15.5px; letter-spacing:.16em; font-weight:600;}
  .step p{margin:0; font-size:12.5px; line-height:2; color:var(--sub);}

  /* エントリーCTA */
  .entry{background:var(--dark); color:var(--darktx); padding:100px 0; text-align:center;}
  .entry .eyebrow{color:#8e887a;}
  .entry h2{color:var(--darktx);}
  .entry p.body{margin:0 auto; color:#c9c4b6;}
  .ebtn{display:inline-block; margin-top:44px; color:var(--darktx); text-decoration:none; font-size:13.5px;
    letter-spacing:.26em; border:1px solid #6b6656; padding:18px 56px;
    transition:background .25s ease, color .25s ease;}
  .ebtn:hover{background:var(--darktx); color:var(--dark);}
  .entry .tel{margin-top:26px; font-size:12px; color:#8e887a; letter-spacing:.1em; line-height:2;}

  /* フッター */
  .foot{border-top:1px solid var(--line); background:#f6f4ef; text-align:center; padding:40px 24px;}
  .foot .mkline{display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:14px;}
  .foot img.mk{width:30px; height:30px;} .foot img.mj{height:16px; width:auto;}
  .foot p{margin:4px 0; font-size:12px; color:var(--mut); letter-spacing:.14em; line-height:2;}
  .foot a{color:var(--sub);}

  /* 出現アニメーション */
  .foot .copy{margin-top:16px; font-size:10.5px; letter-spacing:.24em; color:#b8b3a6;}

  .totop{position:fixed; left:18px; bottom:18px; z-index:60; width:44px; height:44px;
    border-radius:50%; border:1px solid var(--line); background:rgba(252,252,250,.94);
    color:var(--ink); font-size:16px; cursor:pointer; opacity:0; pointer-events:none;
    transition:opacity .3s ease; box-shadow:0 4px 14px rgba(0,0,0,.12);}
  .totop.show{opacity:1; pointer-events:auto;}
  .nav .navhome{display:flex; align-items:center; gap:14px; text-decoration:none;}
  .backhome{text-align:center; padding:60px 24px 68px;}
  .backhome a{display:inline-block; font-size:12.5px; letter-spacing:.22em; text-decoration:none;
    border:1px solid #cfcabf; padding:14px 40px; color:var(--sub);
    transition:background .25s ease, color .25s ease, border-color .25s ease;}
  .backhome a:hover{background:var(--ink); border-color:var(--ink); color:var(--paper);}
  [data-r]{opacity:0; transform:translateY(30px); transition:opacity .9s ease, transform .9s cubic-bezier(.22,.9,.3,1);}
  [data-r].in{opacity:1; transform:none;}
  @media (prefers-reduced-motion: reduce){
    [data-r]{opacity:1; transform:none; transition:none}
    *{animation:none !important; transition:none !important}
  }
  a:focus-visible, button:focus-visible{outline:2px solid var(--brand); outline-offset:2px;}
