/* =============================================================
   障害福祉ファクタリングLP
   A案「青ベース・信頼×親しみ」  参考2寄せ / 配色: 青系＋水色系＋黄オレンジCTA
   イラスト・アイコンは全てインラインSVG自作（フラット・統一タッチ・AI不使用）
   ============================================================= */

:root {
  /* ブランド配色 */
  --blue: #2E7BD6;
  --blue-mid: #4A93E4;
  --navy: #12315F;
  --sky: #EAF3FD;
  --sky2: #F5FAFE;
  --orange: #FF8A33;
  --orange-d: #F26F16;
  --yellow: #FFC24B;
  --ink: #26313F;
  --ink-mute: #67788B;
  --line: #E4ECF5;
  /* イラスト用（B案はここだけ差し替え） */
  --il-primary: #2E7BD6;
  --il-primary-d: #12315F;
  --il-accent: #FF8A33;
  --il-accent-2: #FFC24B;
  --il-light: #DCEBFB;
  --il-skin: #F6C7A0;
  /* フォント */
  --f-jp: 'Noto Sans JP', sans-serif;
  --f-en: 'Poppins', sans-serif;
  --inner: 1080px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--f-jp); color: var(--ink); background: #fff; -webkit-font-smoothing: antialiased; font-feature-settings: "palt"; line-height: 1.85; }
img, svg { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
.inner { width: var(--inner); max-width: calc(100% - 64px); margin: 0 auto; }
em { font-style: normal; }

/* ---- 共通見出し ---- */
.sec-head { margin-bottom: 52px; }
.sec-head.center { text-align: center; }
.sec-en { display: inline-block; font-family: var(--f-en); font-weight: 600; font-size: 14px; letter-spacing: .12em; color: var(--blue); position: relative; padding-left: 30px; }
.sec-en::before { content: ""; position: absolute; left: 0; top: 50%; width: 22px; height: 2px; background: var(--orange); transform: translateY(-50%); }
.sec-head.center .sec-en { padding: 0 0 0 0; }
.sec-head.center .sec-en::before { display: none; }
.sec-en.light { color: #fff; opacity: .9; }
.sec-h2 { font-size: 33px; font-weight: 900; line-height: 1.5; color: var(--navy); margin-top: 14px; letter-spacing: .01em; }
.sec-h2.sm { font-size: 29px; }
.sec-desc { max-width: 760px; margin: 20px auto 0; color: var(--ink-mute); font-size: 15.5px; }
.sec-desc b { color: var(--blue); font-weight: 700; }

/* ---- ボタン ---- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 700; font-size: 16px; padding: 17px 30px; border-radius: 40px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; line-height: 1.4; text-align: center; }
.btn .arw { width: 20px; height: 20px; }
.btn b { font-weight: 900; }
.btn-main { background: linear-gradient(120deg, var(--orange) 0%, var(--orange-d) 100%); color: #fff; box-shadow: 0 12px 24px -10px rgba(242,110,22,.6); }
.btn-sub { background: #fff; color: var(--blue); border: 2px solid var(--blue); }
.btn-ghost { background: rgba(255,255,255,.14); color: #fff; border: 2px solid rgba(255,255,255,.6); }
.btn.lg { font-size: 18px; padding: 20px 40px; }
@media (hover:hover){ .btn:hover{ transform: translateY(-3px); } .btn-main:hover{ box-shadow: 0 18px 30px -10px rgba(242,110,22,.7); } .btn .arw{transition:transform .2s} .btn:hover .arw{transform:translateX(4px)} }
.text-cta { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-weight: 700; }
.text-cta .arw { width: 18px; height: 18px; }

/* ============ ヘッダー ============ */
.hdr { position: absolute; top: 0; left: 0; right: 0; z-index: 20; }
.hdr-in { display: flex; align-items: center; justify-content: space-between; height: 82px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; background: var(--blue); border-radius: 11px; }
.brand-mark svg { width: 24px; height: 24px; }
.brand-mark svg use { --il-primary: #fff; --il-primary-d: #fff; }
.brand-tx { display: flex; flex-direction: column; line-height: 1.3; }
.brand-tx b { font-size: 19px; font-weight: 900; color: var(--navy); letter-spacing: .02em; }
.brand-tx i { font-size: 11px; font-style: normal; color: var(--ink-mute); font-weight: 500; }
.gnav { display: flex; align-items: center; gap: 28px; }
.gnav a { font-size: 14.5px; font-weight: 700; color: var(--navy); }
.gnav a:not(.gnav-cta):hover { color: var(--blue); }
.gnav-cta { display: inline-flex; align-items: center; gap: 7px; background: var(--blue); color: #fff !important; padding: 12px 22px; border-radius: 40px; }
.gnav-cta .arw { width: 17px; height: 17px; }

/* ============ ① ヒーロー ============ */
.hero { position: relative; background: linear-gradient(160deg, var(--sky) 0%, #fff 78%); padding: 130px 0 76px; overflow: hidden; }
.hero-blob { position: absolute; top: -140px; right: -160px; width: 620px; height: 620px; background: radial-gradient(circle at 40% 40%, rgba(74,147,228,.16), rgba(74,147,228,0) 68%); border-radius: 50%; }
.hero-in { display: grid; grid-template-columns: 1.05fr .95fr; gap: 30px; align-items: center; position: relative; }
.hero-badge { display: inline-block; background: #fff; color: var(--blue); font-weight: 700; font-size: 14px; padding: 8px 18px; border-radius: 30px; box-shadow: 0 6px 18px -8px rgba(46,123,214,.5); }
.hero-h1 { font-size: 46px; font-weight: 900; line-height: 1.34; color: var(--navy); margin: 20px 0 20px; letter-spacing: .005em; }
.hero-h1 em { color: var(--blue); background: linear-gradient(transparent 66%, rgba(255,194,75,.5) 66%); padding: 0 2px; }
.hero-lead { font-size: 15.5px; color: var(--ink); max-width: 520px; margin-bottom: 24px; }
.hero-checks { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 22px; margin-bottom: 30px; }
.hero-checks li { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 700; color: var(--navy); }
.hero-checks .ic { width: 22px; height: 22px; flex-shrink: 0; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 14px; }
.hero-cta .btn-main { gap: 12px; padding: 14px 24px; }
.hero-cta .btn-main b { font-size: 18px; }
.hero-note { font-size: 12.5px; color: var(--ink-mute); margin-top: 16px; }
.hero-art { position: relative; }
.hero-svg { width: 100%; max-width: 460px; margin-left: auto; }

/* ============ ② 対象外地域バナー ============ */
.notice { background: var(--navy); }
.notice-in { display: flex; align-items: center; gap: 22px; padding: 22px 34px; }
.notice-ic { width: 46px; height: 46px; flex-shrink: 0; background: rgba(255,255,255,.12); border-radius: 12px; display: grid; place-items: center; }
.notice-ic svg { width: 28px; height: 28px; }
.notice-ic svg use { --il-primary: #fff; --il-primary-d: #cfe0f6; --il-accent: var(--yellow); }
.notice p { color: #fff; font-size: 14.5px; line-height: 1.7; }
.notice p b { color: var(--yellow); }
.notice-link { margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; background: #fff; color: var(--navy); font-weight: 700; font-size: 14px; padding: 11px 20px; border-radius: 30px; white-space: nowrap; }
.notice-link .arw { width: 17px; height: 17px; }

/* ============ ③ お悩み ============ */
.worry { padding: 100px 0; background: var(--sky2); }
.worry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.w-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 34px 28px; box-shadow: 0 20px 40px -30px rgba(18,49,95,.4); transition: transform .25s ease, box-shadow .25s ease; }
@media (hover:hover){ .w-card:hover{ transform: translateY(-6px); box-shadow: 0 28px 48px -28px rgba(18,49,95,.45); } }
.w-ic { width: 72px; height: 72px; display: grid; place-items: center; background: var(--sky); border-radius: 18px; margin-bottom: 20px; }
.w-ic svg { width: 46px; height: 46px; }
.w-ic.lg { width: 128px; height: 128px; border-radius: 30px; }
.w-ic.lg svg { width: 78px; height: 78px; }
.w-card h3 { font-size: 19px; font-weight: 800; color: var(--navy); margin-bottom: 10px; }
.w-card p { font-size: 14.5px; color: var(--ink-mute); line-height: 1.85; }

/* ============ ④ 解決バンド ============ */
.solve { background: linear-gradient(130deg, var(--blue) 0%, var(--navy) 100%); padding: 84px 0; }
.solve-in { display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: center; }
.solve-art svg { width: 100%; }
.solve-art svg use { --il-primary: #fff; }
.solve-copy .sec-en::before { background: var(--yellow); }
.solve-h2 { font-size: 31px; font-weight: 900; color: #fff; line-height: 1.5; margin: 14px 0 26px; }
.solve-list { list-style: none; display: grid; gap: 15px; margin-bottom: 32px; }
.solve-list li { display: flex; gap: 13px; color: #fff; font-size: 16px; font-weight: 500; line-height: 1.7; }
.solve-list .ic { width: 24px; height: 24px; flex-shrink: 0; margin-top: 3px; }
.solve-list .ic use { --il-primary: var(--yellow); }
.solve-list .ic path { stroke: var(--navy); }

/* ============ ⑤ 他社NG ============ */
.reject { padding: 100px 0; }
.reject-in { display: grid; grid-template-columns: 1fr 300px; gap: 56px; align-items: center; }
.reject-copy p { font-size: 15px; color: var(--ink); margin-bottom: 16px; }
.reject-copy p b { color: var(--blue); }
.reject-copy .text-cta { margin-top: 8px; }
.reject-art { display: grid; place-items: center; }
.reject-art .w-ic.lg { background: var(--sky); }

/* ============ ⑥ 事例 ============ */
.case { padding: 100px 0; background: var(--sky2); }
.case-card { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border-radius: 22px; box-shadow: 0 30px 60px -34px rgba(18,49,95,.5); }
.case-lead { background: linear-gradient(150deg, var(--blue) 0%, var(--navy) 100%); color: #fff; padding: 46px 42px; }
.case-tag { display: inline-block; background: var(--orange); color: #fff; font-size: 13px; font-weight: 700; padding: 6px 16px; border-radius: 20px; margin-bottom: 18px; }
.case-lead h3 { font-size: 23px; font-weight: 800; line-height: 1.55; margin-bottom: 16px; }
.case-lead p { font-size: 14.5px; opacity: .92; }
.case-facts { background: #fff; padding: 40px 42px; display: flex; flex-direction: column; justify-content: center; gap: 0; }
.case-facts dl { display: grid; grid-template-columns: 108px 1fr; gap: 16px; padding: 15px 0; border-bottom: 1px dashed var(--line); align-items: start; }
.case-facts dl:last-child { border-bottom: none; }
.case-facts dt { font-size: 13.5px; font-weight: 700; color: var(--blue); }
.case-facts dd { font-size: 15px; color: var(--ink); font-weight: 500; }
.case-facts dl.hi { background: var(--sky); margin: 8px -20px 0; padding: 18px 20px; border-radius: 12px; border-bottom: none; }
.case-facts dl.hi dt { color: var(--orange-d); }
.case-facts dl.hi dd { font-weight: 700; color: var(--navy); }

/* ============ ⑦ 資料請求 ============ */
.doc { padding: 100px 0; }
.doc-in { display: grid; grid-template-columns: 380px 1fr; gap: 60px; align-items: center; background: var(--sky); border-radius: 26px; padding: 56px 54px; }
.doc-art svg { width: 100%; max-width: 320px; margin: 0 auto; filter: drop-shadow(0 24px 34px rgba(18,49,95,.22)); }
.doc-copy p { font-size: 15px; color: var(--ink); margin-bottom: 24px; }
.doc-know { background: #fff; border-radius: 16px; padding: 24px 26px; margin-bottom: 28px; }
.doc-know-h { font-weight: 800; color: var(--navy); font-size: 16px; margin-bottom: 14px !important; padding-left: 14px; border-left: 4px solid var(--orange); }
.doc-know ul { list-style: none; display: grid; gap: 11px; }
.doc-know li { display: flex; gap: 11px; font-size: 14.5px; font-weight: 500; color: var(--ink); line-height: 1.6; }
.doc-know .ic { width: 21px; height: 21px; flex-shrink: 0; margin-top: 2px; }

/* ============ ⑧ 選ばれる理由 ============ */
.reason { padding: 100px 0; background: var(--sky2); }
.reason-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.r-card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 40px 30px 32px; overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
@media (hover:hover){ .r-card:hover{ transform: translateY(-6px); box-shadow: 0 28px 48px -28px rgba(18,49,95,.4); } }
.r-no { position: absolute; top: 18px; right: 24px; font-family: var(--f-en); font-weight: 700; font-size: 44px; color: var(--sky); line-height: 1; }
.r-ic { width: 74px; height: 74px; display: grid; place-items: center; background: var(--sky); border-radius: 50%; margin-bottom: 18px; }
.r-ic svg { width: 46px; height: 46px; }
.r-card h3 { font-size: 19px; font-weight: 800; color: var(--navy); margin-bottom: 12px; line-height: 1.5; }
.r-card p { font-size: 14px; color: var(--ink-mute); line-height: 1.85; }
.r-card p small { display: block; margin-top: 8px; font-size: 11.5px; color: #98a6b6; line-height: 1.6; }

/* ============ ⑨ 仕組み ============ */
.mech { padding: 100px 0; }
.mech-flow { display: flex; align-items: stretch; justify-content: center; gap: 8px; margin-top: 48px; }
.mech-node { flex: 1; max-width: 260px; background: #fff; border: 1.5px solid var(--line); border-radius: 18px; padding: 30px 22px; text-align: center; }
.mech-node.hi { background: var(--navy); border-color: var(--navy); }
.mech-node.hi b { color: #fff; } .mech-node.hi i { color: #b9cdea; }
.mech-node.hi .w-ic { background: rgba(255,255,255,.12); }
.mech-node.hi .w-ic svg use { --il-primary: #fff; }
.mech-node .w-ic { margin: 0 auto 16px; }
.mech-node b { display: block; font-size: 17px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
.mech-node i { font-style: normal; font-size: 13px; color: var(--ink-mute); line-height: 1.6; }
.mech-arrow { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--blue); min-width: 76px; }
.mech-arrow span { font-size: 11px; font-weight: 700; color: var(--orange-d); white-space: nowrap; }
.mech-arrow svg { width: 32px; height: 32px; }

/* ============ ⑩ 流れ ============ */
.flow { padding: 100px 0; background: var(--sky2); }
.flow-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; counter-reset: none; position: relative; }
.f-step { background: #fff; border-radius: 16px; padding: 30px 18px 26px; text-align: center; border: 1px solid var(--line); position: relative; }
.f-no { display: block; font-family: var(--f-en); font-weight: 700; font-size: 13px; letter-spacing: .06em; color: var(--orange); margin-bottom: 14px; }
.f-ic { width: 76px; height: 76px; margin: 0 auto 16px; display: grid; place-items: center; background: var(--sky); border-radius: 50%; }
.f-ic svg { width: 48px; height: 48px; }
.f-step h3 { font-size: 16.5px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
.f-step p { font-size: 12.5px; color: var(--ink-mute); line-height: 1.7; }

/* ============ ⑪ 手数料 + 比較表 ============ */
.fee { padding: 100px 0; }
.cmp-wrap { margin-top: 46px; overflow: hidden; border-radius: 18px; box-shadow: 0 26px 54px -34px rgba(18,49,95,.5); border: 1px solid var(--line); }
.cmp { width: 100%; border-collapse: collapse; }
.cmp th, .cmp td { padding: 20px 24px; text-align: center; font-size: 15px; }
.cmp thead th { font-size: 16px; font-weight: 800; color: #fff; }
.cmp .cmp-item { background: var(--navy); text-align: left; width: 30%; }
.cmp .cmp-us { background: var(--blue); position: relative; }
.cmp .cmp-other { background: #8698ab; }
.cmp tbody th { text-align: left; background: var(--sky2); font-weight: 700; color: var(--navy); font-size: 14.5px; }
.cmp tbody tr:not(:last-child) th, .cmp tbody tr:not(:last-child) td { border-bottom: 1px solid var(--line); }
.cmp td.us { color: var(--navy); font-weight: 800; background: var(--sky); }
.cmp td.us .ic { width: 20px; height: 20px; display: inline-block; vertical-align: -4px; margin-right: 6px; }
.cmp td.other { color: var(--ink-mute); font-weight: 500; }

/* ============ ⑫ FAQ ============ */
.faq { padding: 100px 0; background: var(--sky2); }
.faq-list { max-width: 860px; margin: 0 auto; display: grid; gap: 14px; }
.faq details { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 22px 26px; font-size: 16px; font-weight: 700; color: var(--navy); }
.faq summary::-webkit-details-marker { display: none; }
.faq .q { width: 30px; height: 30px; flex-shrink: 0; display: grid; place-items: center; background: var(--blue); color: #fff; border-radius: 8px; font-family: var(--f-en); font-weight: 700; font-size: 15px; }
.faq .fa-mk { margin-left: auto; width: 20px; height: 20px; position: relative; flex-shrink: 0; }
.faq .fa-mk::before, .faq .fa-mk::after { content: ""; position: absolute; background: var(--blue); border-radius: 2px; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.faq .fa-mk::before { width: 16px; height: 2.5px; }
.faq .fa-mk::after { width: 2.5px; height: 16px; transition: transform .2s ease; }
.faq details[open] .fa-mk::after { transform: translate(-50%,-50%) scaleY(0); }
.faq .fa-a { display: flex; gap: 16px; padding: 0 26px 24px 26px; }
.faq .a { width: 30px; height: 30px; flex-shrink: 0; display: grid; place-items: center; background: var(--orange); color: #fff; border-radius: 8px; font-family: var(--f-en); font-weight: 700; font-size: 15px; }
.faq .fa-a p { font-size: 14.5px; color: var(--ink); line-height: 1.8; padding-top: 3px; }

/* ============ ⑬ 最後のCTA ============ */
.cta-band { position: relative; background: linear-gradient(135deg, var(--orange) 0%, var(--orange-d) 100%); padding: 90px 0; text-align: center; overflow: hidden; }
.cta-blob { position: absolute; inset: 0; background: radial-gradient(circle at 15% 20%, rgba(255,255,255,.18), transparent 40%), radial-gradient(circle at 85% 90%, rgba(255,255,255,.14), transparent 42%); }
.cta-in { position: relative; }
.cta-band .sec-en { color: #fff; }
.cta-h2 { font-size: 36px; font-weight: 900; color: #fff; line-height: 1.45; margin: 14px 0 18px; }
.cta-band > .inner > p { color: #fff; font-size: 16px; max-width: 680px; margin: 0 auto 34px; opacity: .96; }
.cta-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.cta-btns .btn-main { background: #fff; color: var(--orange-d); box-shadow: 0 16px 30px -12px rgba(0,0,0,.3); }
.cta-btns .btn-main b { color: var(--orange-d); }
.cta-note { color: #fff; opacity: .85; font-size: 12.5px; margin-top: 22px; }

/* ============ ⑭ 会社概要 ============ */
.company { padding: 90px 0; }
.company-in { display: grid; grid-template-columns: 1fr 380px; gap: 54px; align-items: center; }
.company-tbl { width: 100%; border-collapse: collapse; margin-top: 26px; }
.company-tbl th, .company-tbl td { text-align: left; padding: 16px 8px; border-bottom: 1px solid var(--line); font-size: 15px; }
.company-tbl th { width: 130px; color: var(--navy); font-weight: 700; }
.company-tbl td { color: var(--ink-mute); }
.company-map { height: 240px; background: var(--sky); border-radius: 16px; display: grid; place-items: center; border: 1px dashed #b8cff0; }
.company-map span { color: var(--blue); font-weight: 700; font-family: var(--f-en); letter-spacing: .05em; }

/* ============ フッター ============ */
.ftr { background: var(--navy); padding: 46px 0 0; }
.ftr-in { display: flex; align-items: center; justify-content: space-between; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.12); }
.ftr-brand .brand-tx b { color: #fff; }
.ftr-brand .brand-tx i { color: #9fb6d6; }
.ftr-brand .brand-mark { background: rgba(255,255,255,.14); }
.ftr-nav { display: flex; gap: 26px; }
.ftr-nav a { color: #cdddf2; font-size: 14px; font-weight: 500; }
.ftr-nav a:hover { color: #fff; }
.ftr-cr { text-align: center; color: #7f97ba; font-size: 12.5px; padding: 22px 0; font-family: var(--f-en); }

/* ============ レスポンシブ（SP 390px） ============ */
@media (max-width: 900px) {
  .inner { max-width: calc(100% - 40px); }
  .sec-h2 { font-size: 25px; } .sec-h2.sm { font-size: 23px; }
  .gnav { display: none; }
  .hdr-in { height: 66px; }
  .hero { padding: 96px 0 56px; }
  .hero-in { grid-template-columns: 1fr; gap: 8px; }
  .hero-h1 { font-size: 32px; }
  .hero-checks { grid-template-columns: 1fr; gap: 10px; }
  .hero-art { order: -1; }
  .hero-svg { max-width: 320px; margin: 0 auto; }
  .hero-cta { flex-direction: column; align-items: stretch; }
  .notice-in { flex-direction: column; align-items: flex-start; gap: 14px; padding: 22px 22px; }
  .notice-link { margin-left: 0; }
  .worry, .reject, .case, .doc, .reason, .mech, .flow, .fee, .faq { padding: 64px 0; }
  .worry-grid, .reason-grid { grid-template-columns: 1fr; }
  .solve-in { grid-template-columns: 1fr; gap: 28px; text-align: center; }
  .solve-art svg { max-width: 180px; margin: 0 auto; }
  .solve-copy .sec-en { padding-left: 0; } .solve-copy .sec-en::before{display:none;}
  .solve-list li { text-align: left; }
  .reject-in { grid-template-columns: 1fr; gap: 30px; }
  .reject-art { order: -1; }
  .case-card { grid-template-columns: 1fr; }
  .doc-in { grid-template-columns: 1fr; padding: 40px 26px; gap: 32px; }
  .doc-art svg { max-width: 220px; }
  .mech-flow { flex-direction: column; align-items: center; }
  .mech-node { max-width: 320px; width: 100%; }
  .mech-arrow { flex-direction: row; padding: 4px 0; }
  .mech-arrow svg { transform: rotate(90deg); }
  .flow-steps { grid-template-columns: 1fr 1fr; }
  .cmp th, .cmp td { padding: 14px 10px; font-size: 12.5px; }
  .cmp .cmp-item { width: 34%; }
  .company-in { grid-template-columns: 1fr; gap: 30px; }
  .cta-h2 { font-size: 27px; }
  .ftr-in { flex-direction: column; gap: 22px; }
  .ftr-nav { flex-wrap: wrap; justify-content: center; gap: 16px; }
}

/* =============================================================
   B案「暖色主役・あたたかい」テーマ上書き（A案からの差分）
   黄オレンジを主役／青を差し色＆安心アンカー／見出し=丸ゴシック
   ============================================================= */
:root {
  --blue: #F5921E; --blue-mid: #F8A94A;   /* プライマリ=オレンジ */
  --navy: #153C66;                         /* 見出し＆青アンカー帯（青系を残す） */
  --sky: #FFEFD8;                          /* 淡い暖色（アイコンタイル/淡背景） */
  --sky2: #FFFBF4;                         /* 生成りホワイト */
  --orange: #F0871A; --orange-d: #D96E08;  /* CTA=深めオレンジ */
  --yellow: #FBB040;
  --ink: #38302A; --ink-mute: #8A7A66; --line: #F0E3D0;
  --il-primary: #F5921E; --il-primary-d: #C36A10;
  --il-accent: #3B86D6;                    /* 差し色=青（暖色ページに青のポップ） */
  --il-accent-2: #FBB040; --il-light: #FDE6C4; --il-skin: #F6C7A0;
  --f-head: 'Zen Maru Gothic', 'Noto Sans JP', sans-serif;
}
/* 見出し・タイトル類を丸ゴシックでやわらかく */
.hero-h1, .sec-h2, .solve-h2, .cta-h2, .case-lead h3, .brand-tx b,
.w-card h3, .r-card h3, .f-step h3, .mech-node b, .faq summary,
.doc-know-h, .hero-badge, .gnav-cta { font-family: var(--f-head); }
.sec-h2 { letter-spacing: 0; }
/* ヒーロー背景＝クリーム */
.hero { background: linear-gradient(160deg, #FFEFD8 0%, #fff 76%); }
.hero-blob { background: radial-gradient(circle at 40% 40%, rgba(245,146,30,.16), rgba(245,146,30,0) 68%); }
.hero-h1 em { color: var(--orange-d); background: linear-gradient(transparent 66%, rgba(251,176,64,.55) 66%); }
/* solve帯＝青アンカー（相談の安心・青系を残す・暖色ページの中の抜け） */
.solve { background: linear-gradient(130deg, #2E7BD6 0%, #123A63 100%); }
.solve-list .ic use { --il-primary: var(--yellow); }
/* 事例＝暖色グラデ／タグ＝紺 */
.case-lead { background: linear-gradient(150deg, #F7A23A 0%, #D96E08 100%); }
.case-tag { background: #153C66; }
/* FAQ：Q=オレンジ / A=紺（コントラスト＋青系） */
.faq .a { background: #153C66; }
/* mechの強調ノード・フッター・比較見出しは --navy=紺 のまま＝青アンカー */
/* 丸ゴシックは字幅が広い→H1を微調整して2行に収める */
.hero-h1 { font-size: 40px; line-height: 1.38; }

/* QA修正: SP の CONTACT 主要CTAをヒーロー同様に縦積み（2×2折返し崩れの解消） */
@media (max-width: 900px) {
  .cta-btns .btn-main { gap: 12px; }
  .cta-btns .btn.lg { padding: 16px 26px; }
}

/* QA修正(B): 水色系を明示（資料パネルを淡水色に＋ヒーロー装飾に寒色を一点） */
.doc-in { background: #E9F3FD; }
.doc-know-h { border-left-color: var(--orange); }
.hero-blob { background:
  radial-gradient(circle at 36% 40%, rgba(245,146,30,.15), transparent 60%),
  radial-gradient(circle at 80% 22%, rgba(120,182,236,.22), transparent 55%); }

/* ヒーローイラスト（Nano Banana生成・B=暖色版画像） */
.hero-img { width: 100%; max-width: 460px; margin-left: auto; display: block; }
@media (max-width: 900px) { .hero-img { max-width: 320px; margin: 0 auto; } }

/* 見出しの孤立改行（1文字残り）を防ぐ・本文の孤立語も抑制（Chrome/Edge） */
.hero-h1, .sec-h2, .solve-h2, .cta-h2, .case-lead h3, .w-card h3, .r-card h3,
.f-step h3, .mech-node b, .doc-know-h, .faq summary, .notice p { text-wrap: balance; }
.hero-lead, .sec-desc, .reject-copy p, .doc-copy p, .solve-list li,
.cta-band > .inner > p, .w-card p, .r-card p, .f-step p, .case-lead p, .fa-a p { text-wrap: pretty; }

/* モバイルでは見出しの手動改行(<br>)を無効化し、balanceで自然に折り返す（孤立文字防止） */
@media (max-width: 900px) {
  .sec-h2 br, .solve-h2 br, .cta-h2 br, .case-lead h3 br { display: none; }
}

/* ===== 改行・マージン最終調整（QAスイープ反映 2026-07-15） ===== */
/* CJK文節改行: ください/未払い/確認 等を語の途中で割らない（Chrome/Edge・非対応は通常改行にフォールバック） */
h1, h2, h3, .faq summary, .doc-know-h, .mech-node b,
p, li, dd, .cmp td, .btn { word-break: auto-phrase; }
/* 会社概要: 地図をテーブル高さに揃える（右の空白解消） */
.company-in { align-items: stretch; }
.company-map { height: auto; min-height: 240px; }
@media (max-width: 900px) {
  .solve-h2 { font-size: 22px; }
  /* 事例スペック表: ラベル列を詰めて値列を確保（放課後等デイサービス等の単文字孤立解消） */
  .case-facts { padding: 30px 24px; }
  .case-facts dl { grid-template-columns: 74px 1fr; gap: 8px; }
  .case-facts dl.hi { margin: 8px -12px 0; padding: 16px 14px; }
}

/* B: 丸ゴシックの字幅補正（SP見出しの溢れ・事例見出しケース。解消） */
.case-lead h3 { font-size: 21px; }
@media (max-width: 900px) {
  .hero-h1 { font-size: clamp(20px, 6.2vw, 28px); line-height: 1.42; }
  .cta-h2 { font-size: 24px; }
  .solve-h2 { font-size: 20px; }
}

/* CTAボタン：プレフィックスを小さく＋太字メイン、矢印は右側(row) */
.btn-2line { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.3; text-align: center; }
.btn-2line small { font-size: 12.5px; font-weight: 700; opacity: .95; letter-spacing: .01em; margin-bottom: 1px; }
.btn-2line b { font-size: 18px; font-weight: 900; }
.btn.lg .btn-2line b { font-size: 20px; }