/* ===== HERO SLIDER ===== */
  .hero-slider-wrap {
    position: relative;
    overflow: hidden;
    /* wrapの高さをslideと完全に揃える（途中切れ防止） */
    height: 560px;
  }

  /* slick初期化前：1枚目だけ表示・wrapの高さに完全フィット */
  .hero-slider .hero-slide:not(:first-child) { display: none; }
  .hero-slider.slick-initialized .hero-slide { display: block !important; }

  /* slick内部要素もwrapの高さに追従 */
  .hero-slider,
  .hero-slider .slick-list,
  .hero-slider .slick-track { height: 100% !important; overflow: hidden; }

  /*
   * slick-theme.css のデフォルト定義を上書き
   * .slick-dotted.slick-slider { margin-bottom: 30px } → 空白の原因
   * .slick-dots { bottom: -25px }                      → dots がwrap外にはみ出す原因
   */
  .hero-slider.slick-dotted.slick-slider { margin-bottom: 0 !important; }
  .hero-slider .slick-dots { bottom: 16px !important; }
  .hero-slider .slick-dots li button:before { font-family: 'slick'; }

  @media (max-width: 1024px) {
    .hero-slider-wrap { height: 500px; }
  }

  @media (max-width: 768px) {
    /* SP: vwベースで高さ設定・clampで最小最大を制御 */
    .hero-slider-wrap {
      height: clamp(420px, 88vw, 560px);
    }
  }

  .hero-slide {
    /* ★ 背景画像・オーバーレイ濃度はstyle属性で各スライド個別に指定 ★
       --slide-bg: url(...)
       --ov-l: 左端の不透明度 (default 0.62)
       --ov-m: 中央の不透明度 (default 0.42)
       --ov-r: 右端の不透明度 (default 0.10)
    ★ */
    background:
      linear-gradient(
        to right,
        rgba(20,60,35,var(--ov-l,0.60)) 0%,
        rgba(20,60,35,var(--ov-m,0.38)) 45%,
        rgba(20,60,35,var(--ov-r,0.08)) 100%
      ),
      var(--slide-bg) center center / cover no-repeat;
    background-size: auto, cover;
    height: 100%; /* .hero-slider-wrap の高さに追従 */
    display: flex !important;
    align-items: center;
    padding: 0;
    text-align: left;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
  }

  @media (max-width: 768px) {
    .hero-slide {
      height: 100%; /* wrapに追従 */
      background-size: auto, cover !important;
      background-position: center center !important;
    }
  }

  /* slickのdots上書き */
  .hero-slider .slick-dots {
    bottom: 20px;
  }
  .hero-slider .slick-dots li button:before {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
  }
  .hero-slider .slick-dots li.slick-active button:before {
    color: #fff;
    opacity: 1;
  }

  @keyframes fadeUp {
    from { transform: translateY(30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }

  .hero-slide::before {
    content: '信太山新地求人';
    position: absolute;
    right: -4px; bottom: clamp(16px, 4vh, 40px);
    font-size: clamp(48px, 9vw, 108px);
    font-family: 'Noto Serif JP', serif;
    font-weight: 700;
    color: rgba(255,255,255,0.18);
    opacity: 1;
    line-height: 1;
    pointer-events: none;
    user-select: none;
    z-index: 1;
  }

  /* .hero-woman は背景画像統合のため廃止 */
  .hero-woman { display: none; }

  .hero-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 26px;
    box-sizing: border-box;
    position: relative;
    z-index: 3;
  }

  .hero-badge {
    display: inline-block;
    font-size: clamp(11px, 1.1vw, 13px);
    color: rgba(255,255,255,0.95);
    font-weight: 600;
    letter-spacing: 0.1em;
    margin-bottom: clamp(12px, 1.6vw, 18px);
    background: rgba(75,127,82,0.80); /* var(--pink-deep) base */
    padding: 8px 28px 8px 16px;
    backdrop-filter: blur(4px);
    transform: skewX(-12deg);
    clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
  }
  .hero-badge span {
    display: inline-block;
    transform: skewX(12deg);
  }

  /* h1: PC〜SPで自然にスケール。vwの係数を上げてPCで大きく見せる */
  .hero-slide h1 {
    font-family: 'Noto Serif JP', serif;
    font-size: clamp(28px, 3.6vw + 8px, 56px);
    font-weight: 700;
    line-height: clamp(1.45, 1.45 + 0.1 * (1 - 1vw/10), 1.6);
    line-height: 1.5;
    color: #fff;
    margin-bottom: clamp(14px, 1.8vw, 24px);
    text-shadow: 0 2px 20px rgba(0,0,0,0.45);
    letter-spacing: 0.02em;
  }

  .hero-slide h1 span { color: var(--pink-medium); text-shadow: 0 1px 8px rgba(0,0,0,0.35); }

  .hero-sub {
    font-size: clamp(13px, 1.1vw + 6px, 16px);
    color: rgba(255,255,255,0.88);
    line-height: 1.85;
    margin-bottom: clamp(24px, 2.8vw, 40px);
    max-width: 480px;
    text-shadow: 0 1px 8px rgba(0,0,0,0.35);
  }

  .hero-tags {
    display: flex;
    gap: clamp(6px, 0.8vw, 10px);
    flex-wrap: wrap;
    margin-bottom: clamp(28px, 3vw, 44px);
  }

  .tag {
    font-size: clamp(12px, 1vw + 4px, 14px);
    color: rgba(255,255,255,0.9);
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.35);
    padding: clamp(5px, 0.5vw, 7px) clamp(12px, 1.2vw, 18px);
    border-radius: 50px;
    font-weight: 500;
    backdrop-filter: blur(4px);
    white-space: nowrap; /* タグ内改行禁止 */
  }

  /* hero内専用 btn-primary */
  .hero-inner .btn-primary {
    margin-top: clamp(4px, 0.6vw, 10px);
    font-size: clamp(14px, 1.1vw + 4px, 16px);
    padding: clamp(12px, 1.2vw, 16px) clamp(28px, 3vw, 44px);
  }

  /* ===== SP調整（768px以下） ===== */
  @media (max-width: 768px) {
    .hero-inner {
      padding: 0 20px;
    }
    .hero-slide h1 {
      font-size: clamp(24px, 6.5vw, 36px);
      line-height: 1.55;
      margin-bottom: 14px;
    }
    .hero-sub {
      font-size: 13px;
      line-height: 1.8;
      margin-bottom: 20px;
      max-width: 100%;
    }
    .hero-tags {
      gap: 6px;
      margin-bottom: 22px;
    }
    .tag {
      font-size: 11px;
      padding: 5px 11px;
    }
    .hero-inner .btn-primary {
      font-size: 14px;
      padding: 13px 32px;
      margin-top: 4px;
    }
    .hero-badge {
      font-size: 11px;
      margin-bottom: 12px;
      padding: 6px 22px 6px 12px;
    }
  }