/* ===== 補助金サポート（Figma 14511:47864）1440×1014 / bg main＋写真50%＋上方向グラデ / pt200 px120 pb160 ===== */
.hojokin{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:100px;width:100%;padding:200px var(--pad-side) var(--sp-section-gap);overflow:hidden;background:var(--c-main)}
.hojokin__bg{position:absolute;inset:0;pointer-events:none}
.hojokin__bg img{width:100%;height:100%;object-fit:cover;opacity:.5;mix-blend-mode:multiply}
.hojokin__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,#1549a0 18.083%,rgba(21,73,160,0) 100%)}
/* 上部マーキー帯 1440×144: 125px Lato SemiBold ＋ free thinking. SVG / soft-light 70% / 左右フェード */
.hojokin__marquee{position:absolute;left:0;top:0;width:100%;height:144px;overflow:hidden}
.hojokin__marquee-track{position:absolute;left:calc(50% + .22px);top:50%;display:flex;align-items:center;gap:44px;transform:translate(-50%,-50%);mix-blend-mode:soft-light;opacity:.7}
.hojokin__marquee-run{position:relative;display:flex;align-items:center;flex:none}
.hojokin__marquee-group{display:flex;align-items:center;gap:44px;flex:none}
.hojokin__marquee-group--clone{position:absolute;left:calc(100% + 44px);top:0}
.hojokin__marquee-text{font-family:var(--font-en);font-weight:600;font-size:125px;line-height:1.2;letter-spacing:1.25px;color:var(--c-base2);white-space:nowrap;font-feature-settings:normal}
.hojokin__marquee-svg{flex:none;display:block;width:910px;height:105.491px}
.hojokin__marquee-svg--2{height:104.541px}
.hojokin__marquee-fade{position:absolute;inset:0;background:linear-gradient(90deg,#1549a0 0%,rgba(21,73,160,0) 10%,rgba(21,73,160,0) 90%,#1549a0 100%)}
/* 白カード 1200×(auto) / border2 #c2cde0 / r10 / px70 py40（内側シャドウは あおさん指示 B-2 で削除） */
.hojokin__card{position:relative;display:flex;align-items:center;gap:64px;width:100%;padding:40px 70px;background:var(--c-base);border:2px solid var(--c-border);border-radius:10px;overflow:hidden}
.hojokin__main{display:flex;flex-direction:column;align-items:flex-start;gap:48px;flex:1 0 0;min-width:1px}
.hojokin__intro{display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:100%}
.hojokin__upper{display:flex;flex-direction:column;align-items:flex-start;gap:32px;width:100%}
.hojokin__lead{display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:100%}
.hojokin__title{display:flex;flex-direction:column;align-items:flex-start;width:415px}
.hojokin__title-line{display:inline-flex;align-items:center;padding:0 12px;background:var(--c-base2);font-size:32px;font-weight:500;line-height:1.6;letter-spacing:1.28px;color:var(--c-text-sub);white-space:nowrap}
.hojokin__title-line:nth-child(2){width:100%}
.hojokin__text{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:1.6;letter-spacing:.16px}
.hojokin__systems{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.hojokin__systems-head{width:100%;padding-bottom:4px;border-bottom:1px solid var(--c-border2);font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px}
/* 制度名を2026年9月の現行制度に差し替えた際、1項目が最長20字（新事業進出・ものづくり商業サービス補助金）に伸びたため
   固定464pxをやめて残り幅いっぱいに。折り返しは制度名の途中で切れないよう nowrap のまま行送りする */
.hojokin__systems-list{display:flex;flex-wrap:wrap;align-content:flex-start;gap:4px 24px;width:100%;list-style:none}
.hojokin__systems-list li{display:flex;align-items:center;gap:8px;font-size:var(--fs-body-m);font-weight:400;line-height:1.6;letter-spacing:.16px;white-space:nowrap}
.hojokin__systems-list li::before{content:"";flex:none;width:4px;height:4px;border-radius:50%;background:var(--c-main)}
.hojokin__notes{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;list-style:none;font-size:var(--fs-body-s);font-weight:400;line-height:1.6;letter-spacing:.14px;color:var(--c-gray)}
.hojokin__notes li{display:flex;align-items:flex-start;gap:2px;width:100%}
.hojokin__notes li span:first-child{flex:none;white-space:nowrap}
.hojokin__notes li span:last-child{flex:1 0 0;min-width:1px}
/* 右：かんたん補助金診断 480px / base3 / r5 / px30 pt24 pb40 */
.hojokin__quiz{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;flex:none;width:480px;min-height:570px;padding:24px 30px 40px;background:var(--c-base3);border-radius:var(--r-m);overflow:hidden}
.hojokin__quiz-inner{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%}
.hojokin__quiz-head{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;line-height:1.6;text-align:center}
.hojokin__quiz-title{display:flex;flex-direction:column;align-items:center;width:249px;font-weight:500}
.hojokin__quiz-catch{width:100%;font-size:18px;letter-spacing:.18px;color:#0f2a4f}
.hojokin__quiz-h{width:100%;font-size:var(--fs-h4);letter-spacing:.24px;color:var(--c-text-sub)}
.hojokin__quiz-lead{width:100%;font-size:var(--fs-body-s);font-weight:400;letter-spacing:.14px}
.hojokin__form{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%}
.hojokin__q{display:flex;flex-direction:column;align-items:flex-start;gap:5px;width:100%}
.hojokin__q-label{display:flex;align-items:flex-start;gap:8px;font-weight:500;white-space:nowrap;cursor:pointer}
.hojokin__q-num{font-size:18px;line-height:1.6;letter-spacing:.18px;color:var(--c-text-sub2)}
.hojokin__q-text{font-size:var(--fs-body-m);line-height:2;letter-spacing:.48px}
/* プルダウン（あおさん指示 B-2: 機能させる）: 本物の <select>。下層 hojokin.html の .quiz__input と同じ作法
   （appearance:none で標準矢印を消し、右16pxに img/ic_chevron.svg を重ねる）。高さは旧ダミー div と同じ 49.6px（py11＋行高25.6＋枠2） */
.hojokin__select-wrap{position:relative;width:100%}
/* Chrome の UA スタイルは select の letter-spacing / font-feature-settings を normal に戻すため、本文と同じ palt を明示する */
.hojokin__select{display:block;width:100%;height:49.6px;padding:0 44px 0 20px;background:var(--c-base);border:1px solid var(--c-border);border-radius:var(--r-s);font-family:inherit;font-size:var(--fs-body-m);font-weight:400;line-height:1.6;letter-spacing:.16px;font-feature-settings:"palt";color:var(--c-text);white-space:nowrap;appearance:none;-webkit-appearance:none;cursor:pointer}
.hojokin__select:focus-visible{outline:2px solid var(--c-main2);outline-offset:3px}
/* シェブロンは枠の内側16px（＝外側から 枠線1px＋16px）。旧ダミー div の padding-right:16px と同じ位置 */
.hojokin__select-chev{position:absolute;right:17px;top:50%;width:12px;height:15px;transform:translateY(-50%);pointer-events:none}
.btn--accent2{background:var(--c-main2);border-color:var(--c-main2)}
.hojokin__br-sp{display:none}

/* ===== SP（768px以下・Figma 14600:69458 375×1429）: pt160 px18 pb80 / 白カード → 診断カードの縦積み ===== */
@media (max-width:768px){
  .hojokin{gap:100px;padding:160px 18px 80px}
  /* 背景写真: 幅322.75%・高59.89% を left-136.5% top40.12% に配置（Figma逐語） */
  .hojokin__bg img{position:absolute;left:-136.5%;top:40.12%;width:322.75%;height:59.89%;max-width:none}
  .hojokin__bg::after{background:linear-gradient(to bottom,#1549a0 36.776%,rgba(21,73,160,0) 100%)}
  /* マーキー帯: 1440幅を中央固定・top12・高120 / 文字100px / svg 700幅 */
  /* transform で中央寄せすると stacking context ができて soft-light が地色と混ざらなくなるため left で寄せる */
  .hojokin__marquee{left:calc(50% - 719.5px);top:12px;width:1440px;height:120px}
  .hojokin__marquee-text{font-size:100px;letter-spacing:1px}
  .hojokin__marquee-svg{width:700px;height:81.15px}
  .hojokin__marquee-svg--2{height:80.417px}
  /* 外枠カードは透明な縦積みコンテナに。白カード＝__main、診断＝__quiz をそれぞれ独立した箱にする */
  .hojokin__card{flex-direction:column;align-items:stretch;gap:24px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
  .hojokin__main{flex:none;width:100%;gap:40px;padding:32px 18px;background:var(--c-base);border:2px solid var(--c-border);border-radius:5px}
  .hojokin__lead{gap:20px}
  .hojokin__title{width:100%}
  /* 24px×1.6=38.4 を Figma は 38px で描画するため、SPの24px見出しは行高を38pxに固定 */
  .hojokin__title-line{padding:0 8px;font-size:24px;line-height:38px;letter-spacing:.96px}
  .hojokin__quiz-h{line-height:38px}
  .hojokin__systems{width:100%}
  .hojokin__systems-list{width:100%;gap:6px 24px}
  /* 375幅では最長の制度名（実測300px）が本文幅303pxとほぼ同じで見切れる恐れがあるため、SPだけ折り返しを許す */
  .hojokin__systems-list li{align-items:flex-start;white-space:normal}
  .hojokin__systems-list li::before{margin-top:10px}
  .hojokin__br-pc{display:none}
  .hojokin__br-sp{display:inline}
  /* SPボタン: pl20 pr12 py10。白カード w299 gap32 / 診断 w199 gap24（ラベルは残り幅で中央寄せ） */
  .hojokin .btn{padding:10px 12px 10px 20px}
  .hojokin .btn__label{flex:1 0 0;min-width:1px}
  .hojokin__main .btn{width:299px;gap:32px}
  .hojokin__quiz{width:100%;min-height:0;gap:32px;padding:32px 18px}
  .hojokin__quiz-inner{gap:16px}
  .hojokin__quiz-head{gap:8px}
  .hojokin__q-text{font-size:16px}
  /* select: Figma実測48px高。文字は iOS のフォーカス時ズームを避けるため 16px（SPの --fs-body-m=15px より1px大きい） */
  .hojokin__select{height:48px;font-size:16px}
  .hojokin__quiz .btn{width:199px;gap:24px}
}