.hbm-recruit-page{
    --navy:#07192F;
    --navy-2:#102F54;
    --ink:#16202C;
    --paper:#F4F7F8;
    --surface:#FFFFFF;
    --surface-soft:#F9FBFC;
    --aqua:#19C6C3;
    --aqua-deep:#087D82;
    --sun:#FFC24A;
    --line:#DCE5EA;
    --muted:#687583;
    --shadow:0 18px 45px rgba(7,25,47,.13);
    --radius:14px;
  }
  *{box-sizing:border-box;}.hbm-recruit-page img{max-width:100%;}
  .hbm-recruit-page a{transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;}
  .hbm-recruit-page a:focus-visible{outline:3px solid rgba(25,198,195,.45); outline-offset:3px;}
  .display{font-family:'Shippori Antique B1','Noto Sans JP',sans-serif;}
  .hbm-recruit-page{
    width:100%;
    max-width:390px;
    margin:0 auto;
    background:var(--surface);
    min-height:100vh;
    position:relative;
    box-shadow:0 0 70px rgba(7,25,47,.16);
    overflow:hidden;
  }
  @media (min-width:481px){}

  .topbar{
    position:sticky; top:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    padding:13px 16px;
    background:rgba(7,25,47,.9);
    backdrop-filter:blur(10px);
    color:#fff;
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .topbar .brand{
    min-width:0;
    font-size:12px; letter-spacing:.14em; font-weight:900;
    display:flex; align-items:center; gap:8px;
  }
  .topbar .brand .dot{
    width:7px;height:7px;border-radius:50%;background:var(--aqua);
    box-shadow:0 0 0 4px rgba(25,198,195,.18);
  }
  .topbar .cta{
    flex:0 0 auto;
    font-size:12px; font-weight:900; color:var(--navy);
    background:#fff; padding:8px 14px; border-radius:999px;
    text-decoration:none; white-space:nowrap;
    box-shadow:0 8px 18px rgba(0,0,0,.18);
  }
  .topbar .cta:hover{transform:translateY(-1px);}

  .hero{
    position:relative;
    background:linear-gradient(180deg,#07192F 0%,#0B2542 100%);
    color:#fff;
    padding-bottom:34px;
    overflow:hidden;
  }
  .hero-media{position:relative; height:302px; overflow:hidden;}
  .hero-media img{
    width:100%; height:100%; object-fit:cover; object-position:center 28%; display:block;
    filter:saturate(.92) contrast(1.03);
  }
  .hero-media::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg,rgba(7,25,47,.02) 20%,rgba(7,25,47,.55) 64%,rgba(7,25,47,.98) 100%);
  }
  .rec-tag{
    position:absolute; top:14px; right:14px; z-index:2; max-width:calc(100% - 28px);
    display:flex; align-items:center; gap:7px;
    background:rgba(7,25,47,.62);
    border:1px solid rgba(255,255,255,.28);
    color:#fff; font-size:10px; letter-spacing:.08em; font-weight:900; white-space:nowrap;
    padding:6px 11px; border-radius:999px;
  }
  .rec-tag .rec-dot{width:6px;height:6px;border-radius:50%;background:#FF5F5F;}
  .hero-copy{padding:0 24px; margin-top:-68px; position:relative; z-index:2;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-size:11px; font-weight:900; letter-spacing:.14em;
    color:var(--sun); margin-bottom:10px;
  }
  .hero h1{font-size:31px; line-height:1.34; margin:0 0 12px; font-weight:900; letter-spacing:0;}
  .hero h1 span{color:var(--aqua);}
  .hero p{font-size:14px; line-height:1.9; color:rgba(255,255,255,.82); margin:0 0 24px; max-width:39ch;}
  .hero-actions{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px;}
  .btn-primary,.btn-ghost{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    min-height:48px; padding:13px 16px; border-radius:999px;
    text-decoration:none; min-width:0;
    font-weight:900; font-size:13px; white-space:nowrap;
  }
  .btn-primary{background:var(--aqua); color:#03201F; box-shadow:0 12px 26px rgba(25,198,195,.32);}
  .btn-ghost{background:rgba(255,255,255,.06); color:#fff; border:1px solid rgba(255,255,255,.36);}
  .btn-primary:hover,.btn-ghost:hover{transform:translateY(-1px);}

  .hbm-recruit-page section{padding:44px 24px;}
  .kicker{font-size:11px; font-weight:900; letter-spacing:.16em; color:var(--aqua-deep); margin:0 0 8px; display:block;}
  .hbm-recruit-page h2{font-size:22px; line-height:1.48; margin:0 0 22px; font-weight:900; color:var(--ink); letter-spacing:0;}

  .facts{padding-top:34px;}
  .fact-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px;}
  .fact-card{
    background:var(--surface-soft); border:1px solid var(--line); border-radius:var(--radius);
    padding:18px 16px; box-shadow:0 10px 26px rgba(7,25,47,.05);
  }
  .fact-card .ic{
    width:34px; height:34px; border-radius:10px;
    background:rgba(25,198,195,.12); display:flex; align-items:center; justify-content:center; margin-bottom:12px;
  }
  .fact-card .ic svg{width:18px;height:18px;}
  .fact-card h3{font-size:14px; line-height:1.45; margin:0 0 6px; font-weight:900;}
  .fact-card p{font-size:12.5px; line-height:1.75; color:var(--muted); margin:0;}
  .comic-card{padding:10px; background:#fff; border:1px solid #CCD8DF; border-radius:14px; box-shadow:var(--shadow);}
  .comic-img{display:block; width:100%; border-radius:10px;}

  .req{background:var(--paper);}
  .req-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
  .req-list li{
    display:flex; gap:14px; align-items:flex-start;
    background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px;
    box-shadow:0 8px 22px rgba(7,25,47,.04);
  }
  .req-list .num{
    flex:0 0 auto; width:28px;height:28px; border-radius:8px;
    background:var(--navy); color:#fff; font-size:12px; font-weight:900;
    display:flex; align-items:center; justify-content:center;
  }
  .req-list .txt strong{display:block; font-size:14px; margin-bottom:3px;}
  .req-list .txt span{font-size:12.5px; color:var(--muted); line-height:1.7;}

  .welcome .hbm-recruit-page h2{margin-bottom:10px;}
  .welcome .lead{font-size:13.5px; color:var(--muted); line-height:1.85; margin:0 0 22px;}
  .chip-cloud{display:flex; flex-wrap:wrap; gap:9px;}
  .chip{font-size:13px; font-weight:700; padding:9px 14px; border-radius:999px; background:#fff; border:1px solid var(--line); color:var(--ink);}
  .chip.on{background:var(--navy); color:#fff; border-color:var(--navy); font-weight:900;}

  .trust{
    background:linear-gradient(180deg,#07192F 0%,#0B2A4D 100%); color:#fff;
    border-radius:18px; margin:0 20px; padding:36px 24px; box-shadow:var(--shadow);
  }
  .trust .kicker{color:var(--aqua); margin-bottom:6px;}
  .trust h2{color:#fff; margin-bottom:12px;}
  .stat-row{
    display:flex; align-items:center; gap:12px; margin:0 0 16px;
    padding:14px 16px; border-radius:16px;
    background:linear-gradient(135deg,rgba(25,198,195,.18),rgba(255,255,255,.06));
    border:1px solid rgba(25,198,195,.28);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  }
  .stat-row .num{font-family:'Shippori Antique B1',sans-serif; font-size:58px; color:var(--aqua); line-height:.92;}
  .stat-row .unit{font-size:14px; font-weight:900; color:#fff; line-height:1.45;}
  .trust p{font-size:13.5px; line-height:1.9; color:rgba(255,255,255,.78); margin:0 0 22px;}
  .trust-points{display:flex; flex-direction:column; gap:12px;}
  .trust-points div{display:flex; gap:10px; align-items:center; font-size:13px; color:rgba(255,255,255,.88);}
  .trust-points .chk{flex:0 0 auto; width:20px;height:20px; border-radius:50%; background:rgba(25,198,195,.16); color:var(--aqua); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:900;}

  .flow-list{display:flex; flex-direction:column;}
  .flow-item{display:flex; gap:16px; position:relative; padding-bottom:28px;}
  .flow-item:last-child{padding-bottom:0;}
  .flow-item .badge{
    flex:0 0 auto; width:36px;height:36px; border-radius:50%;
    background:#fff; border:2px solid var(--navy); color:var(--navy); font-weight:900; font-size:14px;
    display:flex; align-items:center; justify-content:center; position:relative; z-index:1;
  }
  .flow-item:not(:last-child)::before{content:""; position:absolute; left:17px; top:36px; bottom:0; width:2px; background:var(--line);}
  .flow-item h3{font-size:14.5px; margin:6px 0 4px; font-weight:900;}
  .flow-item p{font-size:12.5px; color:var(--muted); line-height:1.75; margin:0;}

  .final{
    position:relative; text-align:center; padding:24px 18px 28px; margin:18px 20px 26px;
    background:linear-gradient(180deg,#FFFFFF 0%,#F4FBFC 100%);
    border:2px solid rgba(25,198,195,.48); border-radius:18px;
    box-shadow:0 24px 46px rgba(4,16,34,.18); overflow:hidden;
    scroll-margin-top:72px;
  }
  .final::before{content:""; position:absolute; inset:8px; border:1px solid rgba(25,198,195,.22); border-radius:13px; pointer-events:none;}
  .final > *{position:relative; z-index:1;}
  .final h2{font-size:30px; margin:4px 0 8px; color:var(--navy); line-height:1.25;}
  .final p{font-size:13.5px; color:#536170; margin:0 0 18px; line-height:1.8;}
  .final .btn-primary{background:linear-gradient(135deg,#2EA8FF,#0B78D8); color:#fff; width:100%; justify-content:center; padding:16px 22px; font-size:15px; box-shadow:0 16px 34px rgba(8,20,39,.34);}
  .final .note{margin-top:14px; font-size:12px; color:rgba(255,255,255,.8);}
  .final .apply-points{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 0 18px;}
  .final .apply-points span{display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; background:#EEF8F8; border:1px solid rgba(25,198,195,.28); color:var(--navy); font-size:12px; font-weight:900;}
  .final .note-strong{margin-top:16px; padding:12px 14px; border-radius:14px; background:#EAF9F9; border:1px solid rgba(25,198,195,.28); color:var(--navy); font-size:12.5px; line-height:1.8; font-weight:700;}

  .hbm-recruit-page footer{padding:26px 24px 112px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); line-height:1.9; background:#fff;}
  .final .contact-grid{display:grid; gap:14px; margin:0 0 22px;}
  .final .contact-card{text-align:left; background:linear-gradient(180deg,#07192F 0%,#123C68 100%); border:1px solid rgba(25,198,195,.32); border-radius:14px; padding:16px; box-shadow:0 14px 28px rgba(8,20,39,.24);}
  .final .contact-label{display:inline-block; font-size:11px; font-weight:900; letter-spacing:.12em; color:#8FD3FF; margin-bottom:10px;}
  .final .line-wrap{display:flex; gap:14px; align-items:center;}
  .final .qr{width:108px; height:108px; border-radius:12px; object-fit:cover; flex:0 0 auto; border:2px solid rgba(255,255,255,.28); background:#fff;}
  .final .contact-card h3{margin:0 0 8px; font-size:16px; color:#fff;}
  .final .contact-card p{margin:0; font-size:12.5px; color:rgba(255,255,255,.82); line-height:1.7;}
  .final .line-id{display:inline-block; margin-top:10px; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.24); font-size:13px; font-weight:900; color:#fff;}
  .final .form-box{display:flex; align-items:center; justify-content:space-between; gap:12px;}
  .final .form-tag{display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,#2EA8FF,#0B78D8); color:#fff; font-size:18px; font-weight:900; box-shadow:0 8px 18px rgba(8,20,39,.24);}
  .final .form-text strong{display:block; font-size:15px; margin-bottom:4px; color:#fff;}
  .final .form-text span{display:block; font-size:12.5px; color:rgba(255,255,255,.82); line-height:1.7;}

  .blog-latest{background:#fff; padding-top:38px;}
  .blog-latest .section-head{margin-bottom:18px;}
  .blog-latest h2{margin-bottom:8px;}
  .blog-latest .section-head p{margin:0; font-size:13px; line-height:1.75; color:var(--muted);}
  .diary-list{display:grid; gap:12px;}
  .diary-card{
    display:grid; grid-template-columns:104px minmax(0,1fr); gap:14px; align-items:center;
    padding:12px; border-radius:16px; background:var(--surface-soft);
    border:1px solid var(--line); text-decoration:none; color:var(--ink);
    box-shadow:0 10px 24px rgba(7,25,47,.05);
  }
  .diary-thumb{
    width:104px; aspect-ratio:16/10; border-radius:12px; overflow:hidden;
    background:linear-gradient(135deg,#07192F,#19C6C3);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-size:11px; font-weight:900; letter-spacing:.14em;
  }
  .diary-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
  .diary-meta{font-size:11px; font-weight:900; color:var(--aqua-deep); margin-bottom:5px;}
  .diary-card h3{
    margin:0; font-size:14px; line-height:1.55; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .diary-card:hover{border-color:rgba(25,198,195,.45); transform:translateY(-1px);}

  .fare-banner{
    padding:18px 16px 10px;
    background:linear-gradient(180deg,#fff 0%,#F4F7F8 100%);
  }
  .fare-banner.is-hero{
    margin-top:-1px;
    padding-top:16px;
  }
  .fare-banner.is-final{
    padding-top:8px;
    padding-bottom:2px;
    background:#fff;
  }
  .fare-banner a{
    display:block;
    position:relative;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 18px 34px rgba(7,25,47,.18);
    transform:translateZ(0);
  }
  .fare-banner a::after{
    content:"";
    position:absolute;
    inset:0;
    border:1px solid rgba(255,255,255,.65);
    border-radius:16px;
    pointer-events:none;
  }
  .fare-banner a:hover{transform:translateY(-2px);}
  .fare-banner img{
    display:block;
    width:100%;
    height:auto;
  }
  .fare-caption{
    margin:10px 4px 0;
    color:var(--muted);
    font-size:11.5px;
    line-height:1.7;
    text-align:center;
  }

  .hbm-floating-apply{
    position:fixed;
    left:50%;
    bottom:14px;
    z-index:90;
    width:min(calc(100% - 28px),362px); max-width:calc(100vw - 28px);
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 10px 10px 16px;
    border-radius:999px;
    background:rgba(7,25,47,.94);
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 18px 36px rgba(4,16,34,.34);
    color:#fff;
    text-decoration:none;
    backdrop-filter:blur(10px);
  }
  .hbm-floating-apply span{
    display:block;
    min-width:0;
    font-size:11px;
    line-height:1.35;
    color:rgba(255,255,255,.72);
  }
  .hbm-floating-apply strong{
    display:block;
    margin-top:1px;
    font-size:14px;
    line-height:1.25;
    color:#fff;
    white-space:nowrap;
  }
  .hbm-floating-apply .floating-pill{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 18px;
    border-radius:999px;
    background:#19C6C3;
    color:#03201F;
    font-size:13px;
    font-weight:900;
    box-shadow:0 10px 22px rgba(25,198,195,.3);
  }
  .hbm-floating-apply:hover{transform:translateX(-50%) translateY(-2px);}

  .reveal{opacity:1; transform:none;}
  .reveal.in{opacity:1; transform:none;}
  @media (max-width:380px){
    .hero-actions{grid-template-columns:1fr;}
    .fact-grid{grid-template-columns:1fr;}
    .diary-card{grid-template-columns:92px minmax(0,1fr); gap:12px;}
    .diary-thumb{width:92px;}
    .final .line-wrap{align-items:flex-start;}
    .final .qr{width:96px;height:96px;}
  }
  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1; transform:none;}}

.recruit-body { margin: 0; background: #e9eef1; }
.recruit-body .hbm-recruit-page { overflow-wrap: anywhere; }
.recruit-body .recruit-line-link { display: block; margin-top: 18px; text-align: center; }
.recruit-preview-note { padding: 12px 16px 110px; background: #fff; color: #687583; font-size: 11px; text-align: center; }
.recruit-diary-page .recruit-preview-note { padding-bottom: 24px; }
.recruit-diary-page .topbar > a:first-child { color: #fff; text-decoration: none; font-size: 14px; font-weight: 800; }
.recruit-diary-main { padding: 24px 20px 48px; color: #16202c; }
.recruit-diary-main h1 { font-size: 24px; line-height: 1.45; margin: 18px 0 24px; }
.diary-back,.diary-all-link { color: #087d82; font-size: 14px; font-weight: 700; text-decoration: none; }
.diary-all-link { display: block; margin-top: 20px; }
.diary-cover { width: 100%; height: auto; display: block; border-radius: 6px; margin-bottom: 24px; }
.diary-body { font-size: 15px; line-height: 1.95; overflow-wrap: anywhere; }
.recruit-diary-main .diary-list { margin-top: 22px; }
.diary-summary { font-size: 12px; color: #687583; line-height: 1.6; margin: 8px 0 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.diary-pagination { display: flex; justify-content: space-between; gap: 16px; margin-top: 24px; }
.diary-pagination a { color: #087d82; padding: 10px 0; }
.recruit-article .diary-meta { margin-top: 24px; }