@charset "utf-8";

/* =========================
   Acceptia LP Base Style (Enhanced)
   添付LPの「淡いピンク帯・角丸カード・丸アイコン・やわらかい区切り」を再現
   【修正点】
   1. CTAボタンの色（lp-btn-main、cta-btn）をコーラルオレンジ系に変更し強調
   2. 本文のline-heightを1.75に統一し可読性向上
========================= */

:root{
  --bg: #ffffff;
  --bg-soft: #f9eeee;     /* 淡いピンク系の帯 */
  --bg-soft-2:#f6e3e3;    /* もう一段濃い帯 */
  --text: #222;
  --muted:#666;
  --primary:#e67f7f;      /* アクセント（サーモン寄り） */
  --primary-dark:#d96a6a;
  --line:#ecd8d8;         /* 罫線 */
  --radius:16px;
  --shadow:0 8px 26px rgba(0,0,0,.07);
  --shadow-soft:0 4px 14px rgba(0,0,0,.05);
  --maxw: 1100px;
  --gap: 16px;
  --fs-hero: clamp(1.45rem, 1.2vw + 1.1rem, 1.95rem);
  --fs-h2:   clamp(1.15rem, .8vw + 1.00rem, 1.45rem);
  --fs-h3:   clamp(1.05rem, .6vw + .95rem, 1.25rem);  /* カード見出し */
  --fs-h4:   clamp(.98rem, .4vw + .92rem, 1.12rem);   /* 小見出し */
  --fs-body: 1rem;                                   /* 基本文 */
  --fs-small:clamp(.88rem, .2vw + .84rem, .95rem);   /* 注釈など */

  /* 【修正追加】CTAを際立たせる色 */
  --cta-main-color: #FF7F50; /* コーラルオレンジ系 */
  --cta-main-color-dark: #E66A3D;
}

html{
  font-size: clamp(.78rem, .20vw + .72rem, .88rem);
}

/* reset-ish */
*{ box-sizing:border-box; }
html, body{ height:100%; }
body.acceptia-lp{
  margin:0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  color:var(--text);
  background:var(--bg);
  /* 【修正】line-heightを1.75に統一し、可読性向上 */
  line-height:1.75;
  letter-spacing:.02em;
  font-size: 1rem;
  line-height: 1.75;
  letter-spacing: .02em;
}

/* ============================
   Fade Up (下から浮き上がる)
============================ */
.fade-up{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .6s ease, transform .6s ease;
}
.fade-up.inview{
  opacity:1;
  transform:translateY(0);
}

/* ============================
   Fade In (その場でじわっと出る)
============================ */
.fade-in{
  opacity:0;
  transition:opacity .8s ease;
}
.fade-in.inview{
  opacity:1;
}

/* ============================
   Slide Left / Slide Right
============================ */
.slide-left{
  opacity:0;
  transform:translateX(-25px);
  transition:opacity .6s ease, transform .6s ease;
}
.slide-left.inview{
  opacity:1;
  transform:translateX(0);
}

.slide-right{
  opacity:0;
  transform:translateX(25px);
  transition:opacity .6s ease, transform .6s ease;
}
.slide-right.inview{
  opacity:1;
  transform:translateX(0);
}

/* ============================
   Scale In (拡大しながら出る)
============================ */
.scale-in{
  opacity:0;
  transform:scale(.96);
  transition:opacity .6s ease, transform .6s ease;
}
.scale-in.inview{
  opacity:1;
  transform:scale(1);
}

/* ============================
   Stagger 子要素の遅延出現
============================ */
.stagger > *{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
}
.stagger.inview > *{
  opacity:1;
  transform:translateY(0);
}
.stagger.inview > *:nth-child(1){ transition-delay:.05s; }
.stagger.inview > *:nth-child(2){ transition-delay:.10s; }
.stagger.inview > *:nth-child(3){ transition-delay:.15s; }
.stagger.inview > *:nth-child(4){ transition-delay:.20s; }
.stagger.inview > *:nth-child(5){ transition-delay:.25s; }
.stagger.inview > *:nth-child(6){ transition-delay:.30s; }


/* =========================
   Layout helpers
========================= */
.lp-container{
  width:min(100%, var(--maxw));
  margin:0 auto;
  padding:18px 18px;
}

section{
  padding-right:0;
  padding-left:0;
  padding-top: 80px;
  padding-bottom: 80px;
  position:relative;
}

@media (max-width: 576px){
  section{
    padding-top: 56px;
    padding-bottom: 56px;
  }
}

/* 添付LPっぽい“やわらかい区切り線” */
section::before{
  content:"";
  position:absolute;
  top:0;
  left:0; right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--line), transparent);
}

.section-soft{
  background:var(--bg-soft);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.section-soft-2{
  background:var(--bg-soft-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.muted{ color:var(--muted); }
.center{ text-align:center; }

/* =========================
   LP Header (Japanese BtoB - clean single source)
========================= */
.lp-header.lp-header--jp{
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
}

/* 上段 */
.lp-header-top{
  background:#fff;
}
/* 上段：ロゴ｜中央キャッチ｜右情報 の3カラム固定 */
.lp-header-top__inner{
  width:min(100%, var(--maxw));
  margin:0 auto;
  padding:8px 18px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  column-gap:16px;
  border-bottom:1px solid var(--line);
}

/* 中央キャッチ */
.lp-header-catch--center{
  text-align:center;
  font-size:13px;
  font-weight:900;
  color:#1b7a3a;
  white-space:nowrap;
}

.lp-header-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:3px;
}

/* 右側は縦積みで右揃え */
.lp-header-right{
  display:grid;
  grid-template-rows:auto auto;
  justify-items:end;
  row-gap:6px;
}

/* ロゴ */
.lp-header-logo{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  color:inherit;
}
.lp-logo-text{
  font-size:20px;
  font-weight:900;
  letter-spacing:.02em;
}
.lp-logo-sub{
  font-size:11px;
  color:var(--muted);
  font-weight:700;
  margin-top:2px;
}

/* ヘッダーロゴ基本 */
.lp-header-logo__img{
  width: 180px;   /* PC黄金サイズ */
  height: auto;
  display:block;
}
.lp-header-brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.lp-header-brand__sub{
  display:inline-flex;
  align-items:center;
  font-size:11px;
  font-weight:800;
  color:#666;
  white-space:nowrap;
}

/* 右側テキストを縦積み */
.lp-header-brand__texts{
  display:flex;
  flex-direction:column;
  gap:4px;
  line-height:1.2;
}

/* タブレット〜SP */
@media (max-width: 768px){
  .lp-header-logo__img{
    width: 160px;
  }
}

/* 最小端末 */
@media (max-width: 480px){
  .lp-header-logo__img{
    width: 150px;
  }
}


/* キャッチ：右上、CTAの上 */
.lp-header-catch{
  font-size:12.5px;
  font-weight:900;
  color:#1b7a3a;
  text-align:right;
  white-space:nowrap;
}

/* 受付時間と電話を縦で面合わせ */
.lp-header-contact{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
}
.lp-header-hours{
  font-size:11px;
  color:#555;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}
.lp-header-tel{
  text-decoration:none;
  color:#111;
  font-weight:900;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  line-height:1.05;
}
.lp-header-tel__label{
  font-size:10.5px;
  color:#666;
  font-weight:700;
}
.lp-header-tel__num{
  font-size:19px;
  letter-spacing:.03em;
}

/* CTA 1ボタン */
.lp-header-cta{
  display:flex;
  justify-content:flex-end;
}
.lp-btn--sm{
  padding:8px 14px;
  font-size:13px;
}
.lp-btn--unified{
  white-space:nowrap;
  font-weight:900;
  letter-spacing:.02em;
}

/* 下段ナビ */
.lp-header-nav{
  background: var(--primary-soft);
  border-top:1px solid var(--line);
}
.lp-header-nav__inner{
  width:min(100%, var(--maxw));
  margin:0 auto;
  display:flex;
  align-items:center;
}

/* 画面が狭い時の調整 */
@media (max-width: 992px){
  .lp-header-logo__img{ width:170px; }
  .lp-header-catch{ font-size:12.5px; }
}

/* PC：均等幅で整列 */
@media (min-width: 769px){
  .lp-header-nav__inner{
    justify-content:space-between;
    overflow:visible;
  }
  .lp-header-nav__inner a{
    flex:1 1 0;             /* ★均等幅 */
    text-align:center;
    padding:10px 12px;
    font-size:14px;
    font-weight:800;
    color:#222;
    text-decoration:none;
    white-space:nowrap;
    border-right:1px solid var(--line);
  }
  .lp-header-nav__inner a:last-child{
    border-right:none;
  }
  .lp-header-nav__inner a:hover{
    background:#fff;
  }
}

@media (max-width: 768px){

  /* 上段3カラム → 縦積みで整列 */
  .lp-header-top__inner{
    grid-template-columns:1fr;
    row-gap:8px;
    padding:10px 12px;
  }

  /* ロゴは左寄せのままでもOKだが、綺麗にするならセンター */
  .lp-header-logo{
    justify-self:start; /* ←左 */
    /* justify-self:center; ←中央にしたいならこっち */
  }

  .lp-header-brand{
    flex-direction:column;
    align-items:center;
    gap:6px;
  }

  /* キャッチはセンターで2行OK */
  .lp-header-catch--center{
    white-space:normal;
    text-align:center;
    font-size:12.5px;
    line-height:1.35;
  }
  .lp-header-brand__texts{ align-items:center; }

  /* 右側情報ブロックは横並び→縦で中央寄せ */
  .lp-header-right{
    justify-items:center;
    row-gap:6px;
  }

  .lp-header-contact{
    align-items:center;
  }

  .lp-header-hours{
    font-size:11px;
    text-align:center;
  }

  .lp-header-tel__num{
    font-size:18px;
  }

  /* CTAは幅広・中央で押しやすく */
  .lp-header-cta{
    width:100%;
    justify-content:center;
  }
  .lp-btn--unified{
    width:92%;
    white-space:normal;
    text-align:center;
    line-height:1.25;
    padding:11px 14px;
    font-size:13px;
  }
}

/* 最狭端末（iPhone SE）だけ微調整 */
@media (max-width: 480px){
  .lp-header-catch--center{
    font-size:12px;
  }
  .lp-header-tel__num{
    font-size:17px;
  }
}

/* =========================
  Burger button (SP only) - Rich
========================= */
.lp-burger{
  display:none;
  width:46px;
  height:40px;
  border:0;
  background:linear-gradient(180deg,#ffffff,#f3f6f7);
  border:1px solid var(--line);
  border-radius:10px;
  cursor:pointer;
  margin-left:auto;
  position:relative;
  box-shadow:
    0 6px 14px rgba(0,0,0,.10),
    inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .12s ease, box-shadow .2s ease, background .2s ease;
}
.lp-burger:active{
  transform:translateY(1px) scale(.98);
  box-shadow:
    0 2px 6px rgba(0,0,0,.12),
    inset 0 2px 6px rgba(0,0,0,.08);
}

.lp-burger span{
  position:absolute;
  left:10px; right:10px;
  height:2px;
  background:#1a1a1a;
  border-radius:2px;
  transition:.35s cubic-bezier(.2,.8,.2,1);
}
.lp-burger span:nth-child(1){ top:11px; }
.lp-burger span:nth-child(2){ top:19px; }
.lp-burger span:nth-child(3){ top:27px; }

/* open state（ちょいバネ感） */
.lp-burger.is-open{
  background:linear-gradient(180deg,#ffffff,#eaf1f2);
}
.lp-burger.is-open span:nth-child(1){
  top:19px; transform:rotate(45deg);
}
.lp-burger.is-open span:nth-child(2){
  opacity:0; transform:scaleX(.2);
}
.lp-burger.is-open span:nth-child(3){
  top:19px; transform:rotate(-45deg);
}

/* =========================
  Drawer - Rich motion & glossy
========================= */
.lp-drawer{
  position:fixed;
  top:0; right:0;
  width:min(90vw, 370px);
  height:100vh;
  background:
    radial-gradient(1200px 300px at 90% -10%, rgba(0,166,200,.12), transparent 60%),
    linear-gradient(180deg,#ffffff,#f7fafb);
  box-shadow:-14px 0 40px rgba(0,0,0,.18);
  transform:translateX(105%);
  opacity:.6;
  transition:
    transform .38s cubic-bezier(.2,.9,.2,1),
    opacity .38s ease;
  z-index:60;
  overflow:auto;
  padding:18px 16px 22px;
  overscroll-behavior:contain;
}
.lp-drawer.is-open{
  transform:translateX(0);
  opacity:1;
}

/* 閉じる時に少し“吸い込まれる”感じ */
.lp-drawer.is-closing{
  transform:translateX(105%) scale(.98);
  opacity:.0;
}

/* 中身 */
.lp-drawer__inner{
  display:grid;
  gap:10px;
  position:relative;
  padding-top:30px;
}

.lp-drawer-brand{
  margin-top:20px;
  text-align:center;
  padding:20px 0 14px;
}

.lp-drawer-logo{
  width: 160px;
  height:auto;
  display:block;
  margin:0 auto 8px;
}

.lp-drawer-brand__title{
  font-size:14px;
  font-weight:800;
  color:#333;
  letter-spacing:.03em;
}

.lp-drawer-close{
  position:absolute;
  top:8px;
  right:8px;
  width:46px;
  height:40px;
  border-radius:10px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fff,#eef3f5);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:10;
  transition:transform .12s ease, box-shadow .2s ease, background .2s ease;

}
.lp-drawer-close:hover{
  background:linear-gradient(180deg,#fff,#e9eff2);
}

.lp-drawer-close span{
  position:absolute;
  width:22px;
  height:2px;
  background:#222;
  border-radius:2px;
}
.lp-drawer-close span:nth-child(1){ transform:rotate(45deg); }
.lp-drawer-close span:nth-child(2){ transform:rotate(-45deg); }


/* Catch */
.lp-drawer-catch{
  text-align:center;
  margin-top:0;
  margin-bottom:3x;
  font-weight:900;
  color:#157a3a;
  font-size:13px;
  line-height:1.45;
  padding:4px 10px;
  /* border-radius:10px; */
  background:linear-gradient(180deg,#f3fff7,#ffffff);
  /* border:1px solid #daf2e1; */
}

/* Contact card */
.lp-drawer-contact{
  display:grid; gap:6px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  background:
    linear-gradient(180deg,#ffffff,#f6f8f9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

/* Menu items glossy + rich open */
.lp-drawer-nav{
  display:grid;
  gap:8px;
}
.lp-drawer-nav a{
  position:relative;
  display:block;
  padding:12px 14px;
  /* border:1px solid var(--line); */
  border-radius:12px;
  text-decoration:none;
  color:#1a1a1a;
  font-weight:800;
  background:linear-gradient(180deg,#fff,#f7f9fa);
  box-shadow:0 3px 8px rgba(0,0,0,.045);
  transform:translateY(0);
  transition:
    transform .12s ease,
    box-shadow .2s ease,
    background .2s ease;
}

/* テカリ（上の艶） */
.lp-drawer-nav a::after{
  content:"";
  position:absolute; inset:0;
  border-radius:12px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.9), rgba(255,255,255,0) 45%);
  opacity:.55;
  pointer-events:none;
}

/* 押した感 */
.lp-drawer-nav a:active{
  transform:translateY(1px) scale(.99);
  box-shadow:
    0 2px 6px rgba(0,0,0,.12),
    inset 0 2px 6px rgba(0,0,0,.10);
  background:linear-gradient(180deg,#ffffff,#e9eef0);
}
.lp-drawer-tel{
  text-align:center;
  margin-top:8px;
}
.lp-drawer-tel .lp-header-hours{
  font-size:10px;
  color:#666;
  opacity:.8;
  margin-bottom:2px;
}

.lp-drawer-tel .lp-header-tel{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:900;
  color:#222;
}
.lp-drawer-tel .lp-header-tel__num{
  font-size:19px;
  letter-spacing:.04em;
}

/* CTA */
.lp-drawer-cta .lp-btn{
  width:100%;
  margin-top:2px;
  text-align:center;
  padding:12px 14px;
  border-radius:999px;
  box-shadow:0 10px 20px rgba(255,120,80,.25);
}

/* Company info */
.lp-drawer-company{
  margin-top:2px;
  padding-top:10px;
  border-top:1px dashed var(--line);
  color:#666;
  font-size:12px;
  line-height:1.4;
  text-align:center;
}
.lp-drawer-company__name{ font-weight:800; color:#333; }

/* Backdrop - rich */
.lp-drawer-backdrop{
  position:fixed; inset:0;
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(2px);
  z-index:55;
}
@keyframes drawerItemIn{
  from{ opacity:0; transform:translateY(6px); }
  to{ opacity:1; transform:translateY(0); }
}

.lp-drawer.is-open .lp-drawer-nav a{
  opacity:0;
  animation:drawerItemIn .45s ease forwards;
}

/* 7項目分のディレイ */
.lp-drawer.is-open .lp-drawer-nav a:nth-child(1){ animation-delay:.02s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(2){ animation-delay:.06s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(3){ animation-delay:.10s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(4){ animation-delay:.14s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(5){ animation-delay:.18s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(6){ animation-delay:.22s; }
.lp-drawer.is-open .lp-drawer-nav a:nth-child(7){ animation-delay:.26s; }

@media (max-width:480px){
  .lp-drawer-logo{
    width: 150px;
  }
  .lp-drawer-brand__title{
    font-size:13px;
  }
}

/* =========================
  Responsive switch (same logic)
========================= */
@media (max-width: 768px){
  .lp-header-catch--center,
  .lp-header-meta,
  .lp-header-nav{
    display:none !important;
  }
  .lp-burger{ display:block; }

  .lp-header-top__inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 12px;
  }
}

/* =========================
   Buttons (BtoB CTA)
========================= */
.lp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
  transition:.25s ease; /* transitionを少し長くして滑らかに */
  border:1px solid transparent;
  white-space:nowrap;
  cursor:pointer;
  letter-spacing:.01em;
}
.lp-btn-primary{
  background:var(--primary);
  color:#fff;
  box-shadow:0 6px 14px rgba(230,127,127,.35);
}
.lp-btn-primary:hover{
  background:var(--primary-dark);
  transform:translateY(-1px);
}

/* 【修正】lp-btn-secondary のサイズを lp-btn-main に合わせる */
.lp-btn-secondary{
  background:#fff;
  color:var(--primary-dark);
  /* サイズを lp-btn-main に合わせるための追加プロパティ */
  padding:14px 28px; /* パディングを増やす */
  font-size: clamp(1.0rem, .6vw + 1rem, 1.25rem); /* フォントサイズを大きく */
  font-weight: 800; /* フォントを太く */
  border: 2px solid var(--primary); /* 境界線を2pxで太く強調 */
  /* 元のスタイルを維持 */
  box-shadow:var(--shadow-soft);
}
.lp-btn-secondary:hover{
  background:var(--bg-soft);
}

/* 【修正】最重要CTAをコーラルオレンジで強調 */
.lp-btn-main{
  background:var(--cta-main-color); /* ← 変更 */
  color:#fff; /* ← 変更 */
  border:2px solid var(--cta-main-color); /* ← 変更 */
  padding:14px 28px; /* パディングを増やして大きく */
  font-size: clamp(1.0rem, .6vw + 1rem, 1.25rem); /* フォントサイズも少し大きく */
  font-weight: 800; /* 太字で強調 */
  box-shadow: 0 8px 20px rgba(255,127,80,.4); /* 強いシャドウ */
}
.lp-btn-main:hover{
  background:var(--cta-main-color-dark); /* ← 変更 */
  border-color:var(--cta-main-color-dark); /* ← 変更 */
  color:#fff;
  transform:translateY(-2px); /* ホバー時の動きを強調 */
}

/* CTAボタン列 */
.lp-cta-buttons{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

/* =========================
   Hero
========================= */
.lp-hero{
  background:
    radial-gradient(1200px 220px at 50% -20%, #fff, transparent 60%),
    var(--bg-soft);
  padding:54px 0 42px;
  border-bottom:1px solid var(--line);
}
.lp-hero-content{
  width:min(100%, var(--maxw));
  margin:0 auto;
  padding:0 18px;
  text-align:center;
}
.lp-hero-title{
  margin:0 0 12px;
  font-size: var(--fs-hero);
  font-weight:800;
  line-height:1.35;
}
.lp-hero-lead{
  margin:0 auto 18px;
  max-width:860px;
  color:var(--muted);
  font-size: var(--fs-body);
}

/* 添付LPの丸アイコンをより強く再現 */
.lp-hero-icons{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
  margin:20px 0 20px;
}
.lp-hero-icons .icon-item{
  width:118px;
  height:118px;
  border-radius:50%;
  background:#fff;
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:var(--shadow);
  font-size: var(--fs-body);
  font-weight:800;
  color:#c95b5b;
  position:relative;
}
.lp-hero-icons .icon-item::after{
  content:"";
  position:absolute;
  inset:9px;
  border-radius:50%;
  border:1px dashed #efc9c9;
}
.lp-hero-icons .icon-item span{
  padding:0 8px;
  text-align:center;
  line-height:1.35;
}

/* =========================
   Section Title (帯+下線)
========================= */
.lp-section-title{
  text-align:center;
  font-size: var(--fs-h2);
  margin:0 0 26px;
  font-weight:800;
  position:relative;
}
.lp-section-title::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-8px;
  width:84px;
  height:8px;
  background:var(--bg-soft-2);
  border-radius:999px;
  z-index:-1;
}
.lp-section-title::after{
  content:"";
  display:block;
  width:64px;
  height:3px;
  background:var(--primary);
  margin:12px auto 0;
  border-radius:3px;
}

/* =========================
   Grid / Cards
========================= */
.lp-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:var(--gap);
}
@media (max-width: 900px){
  .lp-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 560px){
  .lp-grid{ grid-template-columns:1fr; }
}

.lp-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px 18px 20px;
  box-shadow:var(--shadow);
}
.lp-card h3{
  margin:0 0 8px;
  font-size: var(--fs-h3);
  font-weight:800;
}
.lp-card p{
  margin:0;
  color:var(--muted);
   font-size: var(--fs-small);
}

/* “大きめの1枚カード”の空気感 */
.lp-card-lg{
  padding:20px 20px 22px;
}

/* =========================
   Numbered Points List
========================= */
.points{
  max-width:920px;
  margin:0 auto;
  display:grid;
  gap:12px;
}
.point-item{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:14px 16px 14px 58px;
  position:relative;
  box-shadow:var(--shadow);
}
.point-item .num{
  position:absolute;
  left:12px; top:12px;
  width:34px; height:34px;
  border-radius:50%;
  background:var(--primary);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:800;
  font-size: var(--fs-body);
  box-shadow:0 4px 10px rgba(230,127,127,.45);
}
.point-item h4{
  margin:0 0 4px;
  font-size: var(--fs-h4);
  font-weight:800;
}
.point-item p{
  margin:0;
  font-size: var(--fs-body);
  color:var(--muted);
}

/* =========================
   Plan Table
========================= */
.plan-wrap{ overflow:auto; }

.plan-table{
  width:100%;
  min-width:720px;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.plan-table th,
.plan-table td{
  padding:12px 10px;
  border-bottom:1px solid var(--line);
  font-size: var(--fs-body);
  text-align:center;
  vertical-align:middle;
}
.plan-table th{
  background:#fff7f7;
  font-weight:800;
}
.plan-table tr:last-child td{ border-bottom:none; }

.plan-badge{
  display:inline-block;
  background:var(--bg-soft);
  border:1px solid var(--line);
  color:#b24b4b;
  padding:2px 8px;
  border-radius:999px;
  font-weight:800;
  font-size: var(--fs-body);
}

/* =========================
   CTA Section (添付LPの強い押し出し)
========================= */
.lp-cta{
  text-align:center;
  padding:10px 0 0;
}
.lp-cta-title{
  font-size:clamp(18px, 2.6vw, 24px);
  font-weight:800;
  margin:0 0 10px;
}
.lp-cta-lead{
  color:var(--muted);
  margin:0 0 18px;
  font-size: var(--fs-body);
}

/* CTAの白カード化（参考LPの最後の雰囲気） */
#cta .lp-container{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px 18px;
  box-shadow:var(--shadow);
}

/* =========================
   Images
========================= */
img{
  max-width:100%;
  margin-left: auto !important;
  margin-right: auto !important;
  height:auto;
  display:block;
}
.section-image{
  border-radius:12px;
  box-shadow:var(--shadow);
  border:1px solid var(--line);
}

/* =========================
   Footer
========================= */

.lp-footer {
  background:#fff;
  border-top:1px solid var(--line);
  padding:18px 0 26px;
}

.lp-footer-inner {
  width:min(100%, var(--maxw));
  margin:0 auto;
  padding:0 18px;
  text-align:center;
  color:var(--muted);
  font-size: var(--fs-body);
  line-height:1.6;
}

/* ===== lp-copy（フッターの段落） ===== */
.lp-copy {
  margin:6px 0;
  color:var(--muted);
  font-size:var(--fs-body);
}

/* フッター内のリンク */
.lp-footer a {
  color:var(--muted);
  text-decoration:underline;
  opacity:0.85;
}

.lp-footer a:hover {
  opacity:1;
}
.no-break{
  white-space: nowrap;
}

/* =========================
   Footer Responsive
========================= */
@media (max-width: 768px) {
  .lp-footer {
    padding:22px 0 32px;
  }

  .lp-footer-inner {
    padding:0 14px;
    font-size:calc(var(--fs-body) * 0.95);
  }

  .lp-copy {
    margin:10px 0;
    line-height:1.8;
    font-size:calc(var(--fs-body) * 0.95);
  }
}

@media (max-width: 480px) {
  .lp-footer {
    padding:24px 0 36px;
  }

  .lp-footer-inner {
    padding:0 12px;
    font-size:calc(var(--fs-body) * 0.9);
  }

  .lp-copy {
    margin:10px 0;
    font-size:calc(var(--fs-body) * 0.9);
  }
}
/* =========================
   Footer links spacing
========================= */

/* リンク段落だけを対象 */
.lp-footer-links{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;               /* ← PC横並びの余白 */
  flex-wrap:wrap;         /* 画面が狭いPCでも崩れにくい */
}

/* クリックしやすさと境界の明確化 */
.lp-footer-links .lp-footer-link{
  display:inline-block;
  padding:2px 0;          /* ほんの少しタップ領域UP */
}

/* =========================
   Footer links Responsive
========================= */
@media (max-width: 768px) {
  .lp-footer-links{
    flex-direction:column; /* ← 縦並び */
    gap:10px;              /* ← スマホ時の余白 */
  }
}


/* =========================
   Small tweaks for mobile
========================= */
@media (max-width: 560px){
  section{ padding:44px 0; }
  .lp-hero-icons .icon-item{
    width:104px; height:104px;
    font-size: var(--fs-body);
  }
  .lp-header-cta{
    display:flex; gap:6px;
  }
}

/* 長文（本文）を読みやすい行幅に固定 */
.lp-prose{
  max-width: 720px;          /* 参考LP相当の行幅 */
  margin: 0 auto;
  padding: 0px;
  font-size: var(--fs-body);
  line-height: 1.75;         /* 【修正】line-heightを1.75に統一 */
  color:#333;
}

.lp-prose p{
  margin: .9em 0;            /* 段落の呼吸 */
}

/* スマホは少しだけ左右余白 */
@media (max-width: 640px){
  .lp-prose{
    max-width: 100%;
    padding: 0 8px;
  }
}

/* =========================
   フッター住所：スマホで縦並び
========================= */
@media (max-width: 576px){
  .lp-address{
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: center; /* 左寄せにしたければ left */
  }

  /* 区切り記号「｜」を消す */
  .lp-address {
    white-space: normal;
  }
  .lp-address::before,
  .lp-address::after{
    content: "";
  }

  /* パイプ「｜」での折り返しを防止 → 改行しやすくする */
  .lp-address{
    word-break: keep-all;
  }
}


/* =========================
   PDF p1-2 layout overrides (緑帯のデザイン)
========================= */

/* PDFの緑帯 */
:root{
  --pdf-green:#1fb34a;
  --pdf-green-dark:#14933a;
  --pdf-gray:#f3f3f3;
}

/* ---------- p1 HERO（緑ヘッダー＋白文字） ---------- */
.pdf-hero{
  background: var(--pdf-gray);
  padding:0;
  padding-bottom: 10px;
  border-bottom:1px solid var(--line);
}
.pdf-hero-bar{
  background: var(--pdf-green);
  color:#fff;
  text-align:center;
  padding:28px 12px;
  font-weight:900;
  font-size:clamp(20px, 3vw, 30px);
  line-height:1.45;
  letter-spacing:.03em;
}
.pdf-hero-body{
  padding: 36px 0 54px;
}
.pdf-pill{
  display: block;
  width: fit-content;
  max-width: 92%;
  margin: 10px auto 20px;
  padding: 10px 18px;
  font-weight: 800;
  line-height: 1.5;
  font-size: 13px;
  text-align: center;
  background: linear-gradient(
      to bottom,
      #ffffff 0%,
      #f9f9f9 40%,
      #f2f2f2 100%
  );
  border: 1px solid #dcdcdc;
  border-radius: 18px;

  /* 光沢の“白い反射ライン” */
  position: relative;
  overflow: hidden;
}

.pdf-pill::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 45%;
  width: 100%;
  background: linear-gradient(
      to bottom,
      rgba(255,255,255,0.85),
      rgba(255,255,255,0)
  );
  pointer-events: none;
}

/* =========================
   p1 HERO Grid  (final)
========================= */

/* --- Base (SP / mobile-first) --- */
.pdf-hero-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
  justify-content: center;
  max-width: 680px;
  margin: 0 auto;
}

/* 左：画像（Base） */
.pdf-hero-shot{
  align-self: start;
  justify-self: center;
  width: 100%;
  max-width: 340px;
  background:#fff;
  border:1px solid var(--pdf-green);
  border-radius:12px;
  box-shadow:var(--shadow);
}

/* 右：本文（Base） */
.pdf-hero-text{
  align-self: start;
  justify-self: center;
  width: 100%;
  max-width: 100%;
  font-size: var(--fs-body);
  color:#333;
}
.pdf-hero-text p{
  margin: .6em 0;
}
.pdf-hero-text p:first-child{
  margin-top: 0;
}

/* --- PC / wide tablet: 横並び固定 --- */
@media (min-width: 861px){
  .pdf-hero-grid{
    grid-template-columns: minmax(320px, 380px) minmax(0, 520px);
    gap: 28px;
    max-width: 920px;
    align-items: start !important;
  }

  /* 画像は本文に寄せて一体感を出す */
  .pdf-hero-shot{
    justify-self: end;
    max-width: 380px;
align-items: start !important;
  }

  /* 本文は読みやすい行幅で固定 */
  .pdf-hero-text{
    justify-self: start;
    max-width: 520px;
    align-items: start !important;
  }
}

@media (max-width: 860px){
  .pdf-hero-shot{
    margin-bottom: 24px;   /* ← この余白で読みやすくなる */
  }

  /* 本文側にも少し余裕を追加してもOK */
  .pdf-hero-text.lp-prose{
    margin-top: 8px;
  }
}

/* ============================
   PDF HERO（スマホ最適化）
============================ */
@media (max-width: 576px){

  /* ヒーローバーの折り返し最適化 */
  .pdf-hero-bar {
    font-size: 17px;
    padding: 20px 10px;
    line-height: 1.4;
    word-break: keep-all;
  }

  /* ピル部分 */
  .pdf-pill{
    max-width: 92%;
    padding: 10px 14px;
    border-radius: 18px;
    font-size: 13px;
  }
}

/* --- iPhone SE等さらに小さい端末だけ微調整 --- */
@media (max-width: 480px){
  .pdf-hero-shot{ max-width: 300px; margin-bottom: 28px; }
}

/* ============================================== */
/* 1. ROIアピールセクション全体 (フルワイド) */
/* ============================================== */
.roi-appeal-section {
    padding: 60px 0;
    /* コントラストを出すため、ヒーローセクションと異なる色（例：濃い青やブランドカラー）を使用 */
    background: #0070c0;
    color: #ffffff;
    text-align: center;
}

/* ヒーローバーと重複しないように、モバイルでは少し余白を調整 */
@media (max-width: 576px) {
    .roi-appeal-section {
        padding: 40px 0;
    }
}

/* ============================================== */
/* 2. タイトルとキャッチコピー */
/* ============================================== */
.roi-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 40px;
    color: #ffffff; /* 白抜き */
    line-height: 1.4;
}
@media (max-width: 768px) {
    .roi-title {
        font-size: 18px;
        margin-bottom: 30px;
    }
}

/* ============================================== */
/* 3. 実績の数値ブロック (最もインパクトのある箇所) */
/* ============================================== */
.roi-stat-block {
    margin-bottom: 30px;
}

/* リード文 */
.roi-stat-lead {
    font-size: 16px;
    font-weight: 500;
    opacity: 0.8;
    margin-bottom: 5px;
}

/* 実績数値（90%）を特大表示 */
.roi-stat-number {
    font-size: 96px; /* 大胆なサイズ */
    font-weight: 900;
    line-height: 1;
    display: block; /* 縦幅を占有 */
    color: #ffcc00; /* 成果を強調する黄色やオレンジ */
}

/* % と 単位 */
.roi-stat-number .small {
    font-size: 0.5em; /* % は少し小さく */
    vertical-align: super;
}
.roi-stat-unit {
    display: block;
    font-size: 18px;
    font-weight: 700;
    margin-top: -5px; /* 数値に少し近づける */
}

/* モバイルでの調整 */
@media (max-width: 768px) {
    .roi-stat-number {
        font-size: 72px;
    }
    .roi-stat-unit {
        font-size: 18px;
    }
}

/* ============================================== */
/* 4. サポートテキスト */
/* ============================================== */
.roi-appeal-text {
    font-size: 18px;
    line-height: 1.8;
    max-width: 700px;
    margin: 0 auto;
    font-weight: 500;
    /* 〇〇万円分を強調する場合 */
    /* font-weight: 700; */
}
@media (max-width: 768px) {
    .roi-appeal-text {
        font-size: 12px;
    }
}
/* =========================
   p1 開発ストーリー（final）
========================= */

#story{
  padding: 64px 0;
}

/* タイトル（サイズはルートスケールに追従させるなら変数参照でもOK） */
.pdf-story-title{
  color: var(--pdf-green);
  font-size: var(--fs-h2);
  font-weight: 900;
  text-align: center;
  margin: 0 0 28px;
}

/* --- Base (SP / mobile-first) --- */
.pdf-story-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
  max-width: 720px;     /* ★SP時の塊サイズ */
  margin: 0 auto;
}

/* 本文ボックス（Base） */
.pdf-story-box{
  width: 100%;
  max-width: 560px;     /* ★本文の広がりを減らす（640→560） */
  margin: 0 auto;       /* SPは中央寄せ */
  padding: 16px 18px;
  font-size: var(--fs-body);
  line-height: 1.75;
  color: #333;

  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:var(--shadow);
}

/* 写真（Base） */
.pdf-story-photo{
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

/* --- PC / wide tablet: 横並び固定 --- */
@media (min-width: 861px){
  .pdf-story-grid{
    grid-template-columns: minmax(0, 560px) minmax(260px, 360px);
    gap: 24px;
    max-width: 920px;    /* ★2カラムの塊 */
  }

  /* PCでは本文を左カラムに“左寄せで収める” */
  .pdf-story-box{
    margin-left: 0;
    margin-right: auto;
    max-width: 560px;    /* ★行幅を560で固定 */
  }

  /* PCでは写真を右に寄せる */
  .pdf-story-photo{
    margin-left: auto;
    margin-right: 0;
    max-width: 360px;
  }
}

/* --- 小さめタブレット調整（必要なら） --- */
@media (max-width: 640px){
  #story{ padding: 56px 0; }
  .pdf-story-grid{ gap: 16px; }
  .pdf-story-box{ max-width: 100%; }
}

/* =========================
   p2 システムイメージ（final）
========================= */

#pdf-system{
  padding: 64px 0;
}

.pdf-system{
  background:#fff;
  padding:0;
}

/* 見出し帯（緑） */
.pdf-system-bar{
  background: var(--pdf-green);
  color:#fff;
  text-align:center;
  padding:20px 12px;
  font-size: var(--fs-h2);
  font-weight:900;
}

/* 本体ブロックの上下余白 */
.pdf-system-body{
  background:#fff;
  padding: 34px 0 48px;
}

/* 「注釈・強調ブロック」（PDFで淡いグレー帯のところ） */
.pdf-system-highlight {
  background: var(--pdf-gray);
  padding: 12px 16px;
  margin: 16px auto;
  max-width: 720px;
  font-weight: 500;
  border-radius: 6px;
}

/* 図（システム全体図） */
.pdf-system-figure{
  background:#fff;
  padding:10px;
  box-shadow:var(--shadow);
  margin:0 auto 24px;
  max-width: 900px;
}

/* 本文ブロック */
.pdf-system-text{
  max-width: 720px;    /* ← 行幅を短くして読みやすく */
  margin: 0 auto;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
  padding: 0 8px;      /* SPの左右余白 */
}

.pdf-system-text p{
  margin: .8em 0;
}

/* =========================
   Fullwidth band（PDFの段落帯）
========================= */
.fullwidth-band {
  width: 100%;
  background: var(--pdf-gray);
  padding: 14px 0;
}

.fullwidth-band .lp-container p {
  margin: 0;
  font-size: var(--fs-body);
  font-weight: 500;
  color: #333;
  text-align: left;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 8px;
}

/* =========================
   Media Queries
========================= */

/* --- PC / wide tablet --- */
@media (min-width: 861px){

  /* 本文行幅を固定しつつ、中央揃え */
  .pdf-system-text{
    max-width: 560px;   /* ← PDF感をさらに強くするならここがPOINT */
    padding: 0;
  }

  /* 図も大きすぎないように中央揃え */
  .pdf-system-figure{
    max-width: 880px;
    margin-bottom: 32px;
  }

  .pdf-system-highlight{
    max-width: 560px;
  }
}

/* --- iPhone SE・極小端末 --- */
@media (max-width: 480px){
  .pdf-system-figure{
    max-width: 100%;
  }
}

/* ==========================================
   小見出し（サムネ＋帯）共通ブロック
========================================== */
.pdf-subhead{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:720px;
  margin: 0 auto 14px;
  padding: 0 10px;
}

.pdf-subhead__thumb{
  flex:0 0 auto;
  width:64px;
  height:64px;
  border-radius:999px;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}
.pdf-subhead__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.pdf-subhead__label{
  flex:1;
  background: var(--bg-soft);

  padding:10px 16px 10px 26px;
  font-size: clamp(0.95rem, .4vw + .9rem, 1.08rem);
  font-weight:800;
  color:#333;
  position:relative;
  box-shadow: var(--shadow-soft);
}

/* 左の縦ライン（参考LPのアクセント） */
.pdf-subhead__label::before{
  content:"";
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  width:8px;
  height:70%;
  border-radius:999px;
  background: var(--primary);
  opacity:.9;
}

/* ==========================================
   fullwidth-band（背景帯）
========================================== */
.fullwidth-band{
  width:100%;
  background: var(--pdf-gray);
  padding:24px 0;
}
.fullwidth-band .pdf-system-text{
  max-width:720px;
  margin:0 auto;
  padding:0 10px;
}

/* ==========================================
   fullwidth-band--plain（白背景版）
   → これが「真ん中の白背景ブロック用」
========================================== */
.fullwidth-band--plain{
  width:100%;
  background:#fff;
  padding:24px 0;
}
.fullwidth-band--plain .pdf-system-text{
  max-width:720px;
  margin:0 auto;
  padding:0 10px;
}

/* SP調整 */
@media (max-width: 480px){
  .pdf-subhead__thumb{
    width:56px;
    height:56px;
  }
  .pdf-subhead{
    gap:12px;
  }
}
/* =========================
   voices: 導入事例/お客様の声
========================= */
.voices-section{
  padding: 64px 0;
  background: #fff;
}

.voices-section .lp-h2{
  text-align:center;
  color: var(--pdf-green);
  font-size: var(--fs-h2);
  font-weight:900;
  margin: 0 0 22px;
}

.voices-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 18px;
}

.voice-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow: var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height: 220px;
}

.voice-card__thumb{
  aspect-ratio: 16 / 9;
  background:#f7f7f7;
}
.voice-card__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.voice-card__body{
  padding: 14px 14px 16px;
}

.voice-card__title{
  font-size: clamp(1.0rem, .5vw + .95rem, 1.15rem);
  font-weight: 800;
  margin: 0 0 8px;
  color:#222;
}

.voice-card__excerpt{
  font-size: var(--fs-body);
  line-height: 1.7;
  color:#444;
  margin:0;
}

.voice-card-link{
  display:block;
  text-decoration:none;
  color:inherit;
}

.voice-card-link:hover .voice-card{
  box-shadow: 0 0 0 3px var(--pdf-green, #5ca27a) inset;
  transition:.2s;
}

.voices-more {
  text-align: center;
  margin-top: 32px;
}

.voices-more-btn {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 8px;
  background: #fff;
  color: #333;
  border: 2px solid #0b7;
  font-weight: 700;
  font-size: 18px;
  transition: 0.25s ease;
}

.voices-more-btn:hover {
  background: #0b7;
  color: #fff;
}



/* tablet */
@media (max-width: 992px){
  .voices-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* phone */
@media (max-width: 576px){
  .voices-grid{ grid-template-columns: 1fr; }
}

/* =========================================================
   Acceptia LP：導入事例 詳細ページ（single-case_voice）
   ※ bodyスコープ無しで確実に効く版
========================================================= */

/* ページ全体 */
.case-single{
  background:#fff;
  padding: 24px 0 72px;
}

/* ---------------------------------------------------------
   HERO（タイトル・リード文）
--------------------------------------------------------- */
.case-hero{
  padding: 36px 0 18px;
  text-align:center;
}
.case-hero__eyebrow{
  display:inline-block;
  color: var(--pdf-green);
  font-weight: 800;
  letter-spacing:.04em;
  margin:0 0 6px;
  font-size: clamp(.78rem, .26vw + .72rem, .9rem);
}
.case-hero__title{
  font-size: clamp(1.3rem, 1.6vw + 1rem, 2rem);
  font-weight: 900;
  line-height: 1.35;
  margin:0 0 10px;
  color:#111;
}
.case-hero__lead{
  max-width: 44em;
  margin: 0 auto;
  font-size: clamp(.95rem, .4vw + .9rem, 1.05rem);
  line-height:1.9;
  color:#333;
}

/* ---------------------------------------------------------
   サムネイル
--------------------------------------------------------- */
.case-thumb{
  padding: 18px 0 10px;
}
.case-thumb__img{
  width:100%;
  height:auto;
  border-radius:12px;
  border:1px solid var(--line);
  box-shadow: var(--shadow);
}

/* ---------------------------------------------------------
   本文セクションの外枠（case-body）
--------------------------------------------------------- */
.case-body{
  padding: 18px 0 64px;   /* ← LP他セクションと同じリズム */
  background:#fff;
}

/* ---------------------------------------------------------
   本文ブロック（pdf-system-text 相当）
--------------------------------------------------------- */
.case-prose{
  max-width: 720px;
  margin: 0 auto;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
  padding: 34px 8px 0;  /* SPの左右余白 */
  letter-spacing: .02em;
}

/* 段落 */
.case-prose p{
  margin: .8em 0;
}
.case-prose p:first-child{ margin-top:0; }
.case-prose p:last-child{ margin-bottom:0; }

/* h2（緑スティック見出し） */
.case-prose h2{
  font-size: clamp(1.05rem, 1vw + .9rem, 1.35rem);
  font-weight: 900;
  color: var(--pdf-green);
  margin: 1.8em 0 .8em;
  line-height: 1.45;
  position: relative;
  padding-left: .8em;
}
.case-prose h2::before{
  content:"";
  position:absolute;
  left:0;
  top:.25em;
  width:4px;
  height:1.2em;
  background: var(--pdf-green);
  border-radius: 2px;
}

/* h3（黒見出し） */
.case-prose h3{
  font-size: clamp(1rem, .7vw + .9rem, 1.2rem);
  font-weight: 800;
  color:#111;
  margin: 1.6em 0 .6em;
  line-height: 1.5;
}

/* リスト */
.case-prose ul,
.case-prose ol{
  margin: .6em 0 1.2em 1.2em;
  padding: 0;
}
.case-prose li{
  margin: .35em 0;
}

/* 引用 */
.case-prose blockquote{
  background: var(--pdf-gray);
  border-left: 4px solid var(--pdf-green);
  padding: 12px 14px;
  margin: 1.2em 0;
  border-radius: 8px;
  color:#222;
}

/* 強調 */
.case-prose strong{
  font-weight: 800;
}

/* 本文内画像 */
.case-prose img{
  max-width:100%;
  height:auto;
  border-radius:10px;
  margin: 1.6em 0 3.2em;   /* ← 上下余白を大きくした */
  border:1px solid var(--line);
}

/* case single 戻るボタン */
.case-back{
  margin-top: 10px;
  text-align:center;
}

.case-back__btn{
  display:inline-block;
  padding: 12px 20px;
  background: var(--primary);
  color:white;
  text-decoration:none;
  font-weight:900;
  border-radius:999px;
  letter-spacing:.03em;
  box-shadow:0 6px 16px rgba(255,100,150,.25);
  transition: transform .15s ease, box-shadow .25s ease;
}

.case-back__btn:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 20px rgba(255,100,150,.35);
}


/* SP調整 */
@media (max-width: 860px){
  .case-single{
    padding: 14px 0 56px;
  }
  .case-prose{
    padding: 22px;
    line-height: 1.85;
  }
  .case-prose h2{
    margin-top: 1.5em;
  }
}

/* =========================================================
   FEATURES（機能一覧）
========================================================= */

.features{
  padding: 72px 0;
  background: #fff;
}

.features-title{
  color: var(--pdf-green);
  font-size: clamp(20px, 2.6vw, 28px);
  font-weight: 900;
  text-align: center;
  margin: 0 0 10px;
}

.features-lead{
  max-width: 720px;
  margin: 0 auto 28px;
  font-size: var(--fs-body);
  line-height: 1.75;
  color: #333;
  text-align: center;
  padding: 0 8px;
}

/* グリッド */
.features-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
  align-items: stretch;
}

/* カード */
.feature-card{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 18px 20px !important;
  line-height: 1.65 !important;

}

.feature-card__head{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.feature-card__icon{
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--pdf-gray);
  font-size: 20px;
  flex-shrink: 0;
}

.feature-card__title{
  font-size: clamp(1.05rem, .9vw + .95rem, 1.25rem);
  font-weight: 900;
  color: #111;
  margin: 0;
  line-height: 1.4;
}

.feature-card__list{
  margin: 0;
  padding-left: 1.1em;
  font-size: var(--fs-body);
  line-height: 1.75;
  color: #333;
}
.feature-card__list li{
  margin: .35em 0;
}

/* 3列にしたい場合（PC幅広時に） */
@media (min-width: 1100px){
  .features-grid{
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
}

/* タブレット以下は1列 */
@media (max-width: 860px){
  .features{
    padding: 56px 0;
  }
  .features-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

/* SPだけ改行用 */
.sp-only{ display:none; }
@media (max-width: 576px){
  .sp-only{ display:block; }
}

/* =========================================================
   WHY LINE?（LP最適化版）
========================================================= */
.why-line{
  padding: 72px 0 0;
  background:#fff;
}

/* 見出し＋導入 */
.why-line-head{
  text-align:center;
  margin-bottom: 26px;
}
.why-line-title{
  color: var(--pdf-green);
  font-size: clamp(20px, 2.6vw, 28px);
  font-weight: 900;
  margin: 0 0 10px;
  letter-spacing: .02em;
}
.why-line-intro{
  max-width: 760px;
  margin: 0 auto;
  font-size: var(--fs-body);
  line-height: 1.8;
  color:#333;
  padding: 0 8px;
}
.why-line-intro strong{
  font-weight: 900;
}

/* 3カード */
.why-line-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
  align-items: stretch;
}

/* タブレット */
@media (max-width: 1024px){
  .why-line-grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

/* スマホ */
@media (max-width: 576px){
  .why-line{
    padding-top: 56px;
  }
  .why-line-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

.why-line-card{
  position: relative;
  background:#fff;
  border:1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 22px 18px 18px;
}

/* 左上番号バッジ */
.why-line-card__num{
  position:absolute;
  top: -10px; left: -10px;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--pdf-green);
  color:#fff;
  font-weight: 900;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 16px;
  box-shadow: var(--shadow);
}

/* アイコン */
.why-line-card__icon{
  font-size: 30px;
  margin-bottom: 8px;
}

/* タイトル */
.why-line-card__title{
  font-size: clamp(1.02rem, .6vw + 1rem, 1.2rem);
  font-weight: 900;
  color:#111;
  margin: 0 0 8px;
  line-height: 1.5;
}

/* 箇条書き */
.why-line-card__list{
  margin: 0;
  padding-left: 1.1em;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
}
.why-line-card__list li{
  margin: .4em 0;
}

/* まとめ帯（既存fullwidth-bandを流用しつつ余白調整） */
.why-line-summary{
  margin-top: 28px;
}
.why-line-summary p{
  font-size: var(--fs-body);
  line-height: 1.8;
  color:#333;
  margin: 0;
  padding: 6px 8px;
}

/* ============================
   料金プラン（シンプル版）
============================ */

.plans-section{
  padding: 80px 0;
  background: #fff;
}

.plans-title{
  text-align: center;
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 900;
  color: #222;
  margin-bottom: 12px;
}

.plans-lead{
  text-align: center;
  font-size: var(--fs-body);
  color:#444;
  margin-bottom: 36px;
  line-height: 1.75;
}

.plans-list{
  max-width: 760px;
  margin: 0 auto;
  display: grid;
  gap: 32px;
}

/* =============================
   Plans text structured
============================= */

.plan-item__desc{
  margin: 6px 0 12px;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
}

.plan-item__label{
  display:inline-block;
  margin-top: 8px;
  margin-bottom: 4px;
  padding: 4px 10px;
  font-size: 12.5px;
  font-weight: 900;
  color:#0f6a36;
  background: #eaf7ef;
  border-radius: 999px;
  letter-spacing:.02em;
}

.plan-item__target{
  margin: 0 0 8px;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
}

.plan-item__list{
  margin: 6px 0 0;
  padding-left: 1.2em;
  display:grid;
  gap: 6px;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
}

.plan-item__list li{
  position:relative;
  padding-left: .2em;
}

/* 箇条書きの黒丸を少しリッチに */
.plan-item__list li::marker{
  color: var(--pdf-green);
  font-size: 1.1em;
}

/* ============================
   Plans CTA 修正（中央寄せ＋ピンク統一）
============================ */

/* CTA全体の中央寄せ */
.plans-cta{
  text-align:center;
  margin-top: 30px;
}

/* ボタンをピンクに統一（header CTA と同じスタイル） */
.plans-cta .btn-primary{
  display:inline-block;
  background: var(--primary); /* ← ヘッダーCTAが使ってるピンクの変数 */
  color:#fff;
  padding: 14px 28px;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .03em;
  text-decoration:none;
  box-shadow: 0 6px 16px rgba(255, 100, 150, .28);
  transition: transform .15s ease, box-shadow .25s ease;
}

/* ホバー時のリッチ感 */
.plans-cta .btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(255, 120, 160, .35);
}

/* スマホ時のサイズ調整 */
@media (max-width: 576px){
  .plans-cta .btn-primary{
    font-size: 15px;
    padding: 12px 24px;
  }
}

/* =============================
   お知らせセクション
============================= */

.news-section{
  padding: 80px 0;
  background:var(--bg-soft);
}

.news-title{
  text-align:center;
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight:900;
  color:#222;
  margin-bottom:32px;
}

/* テーブル全体 */
.news-table{
  max-width:800px;
  margin:0 auto;
  border-top:1px solid #e3e3e3;
}

/* 1行 */
.news-row{
  display:grid;
  grid-template-columns: 120px 1fr 24px;
  align-items:center;
  gap:12px;

  padding:24px 4px;
  border-bottom:1px solid #e5e5e5;

  text-decoration:none;
  color:#222;

  transition: background .2s;
}

.news-row:hover{
  background:#f7f7f7;
}

/* 日付 */
.news-date{
  font-size:14px;
  color:#444;
  white-space:nowrap;
}

/* タイトル */
.news-title-cell{
  font-size: var(--fs-body);
  line-height:1.5;
  color:#222;
  display:flex;
  align-items:center;
  gap:8px;
}

/* NEW バッジ */
.news-badge{
  display:inline-block;
  background:#ff3b30;
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:2px 6px;
  border-radius:10px;
}

/* 矢印 */
.news-arrow{
  font-size:16px;
  color:#999;
  text-align:right;
  margin-left:auto;
}

/* SP */
@media(max-width:576px){
  .news-row{
    grid-template-columns: 90px 1fr 18px;
    padding:14px 2px;
  }
  .news-date{
    font-size:13px;
  }
}

/* =========================================================
   single-acceptia_news（お知らせ詳細）
========================================================= */

.news-single{
  background:#fff;
  padding: 24px 0 72px;
}

/* HERO */
.news-hero{
  padding: 36px 0 18px;
  text-align:center;
}
.news-hero__eyebrow{
  display:inline-block;
  color: var(--pdf-green);
  font-weight: 800;
  margin:0 0 8px;
  font-size: var(--fs-small);
  letter-spacing:.06em;
}
.news-hero__title{
  font-size: clamp(1.35rem, 1.8vw + 1rem, 2.1rem);
  font-weight: 900;
  line-height: 1.4;
  margin:0 0 8px;
  color:#111;
}
.news-hero__meta{
  font-size: .95rem;
  color:#666;
}

/* THUMB */
.news-thumb{
  padding: 18px 0 10px;
}
.news-thumb__img{
  width:100%;
  height:auto;
  border-radius:12px;
  border:1px solid var(--line);
  box-shadow: var(--shadow);
}

/* BODY（lp-proseに近い読みやすさ） */
.news-body{
  padding: 18px 0 64px;
}
.news-prose{
  max-width: 720px;
  margin: 0 auto;
  font-size: var(--fs-body);
  line-height: 1.75;
  color:#333;
  padding: 8px 8px 0;
  letter-spacing: .02em;
}

/* 段落 */
.news-prose p{
  margin: .9em 0;
}
.news-prose p:first-child{ margin-top:0; }

/* 見出し（LPと同じ緑ライン） */
.news-prose h2{
  font-size: clamp(1.05rem, 1vw + .9rem, 1.35rem);
  font-weight: 900;
  color: var(--pdf-green);
  margin: 1.8em 0 .8em;
  line-height: 1.45;
  position: relative;
  padding-left: .8em;
}
.news-prose h2::before{
  content:"";
  position:absolute;
  left:0; top:.25em;
  width:4px; height:1.2em;
  background: var(--pdf-green);
  border-radius:2px;
}
.news-prose h3{
  font-size: clamp(1rem, .7vw + .9rem, 1.2rem);
  font-weight: 800;
  color:#111;
  margin: 1.6em 0 .6em;
}

/* リスト */
.news-prose ul,
.news-prose ol{
  margin: .6em 0 1.2em 1.2em;
  padding: 0;
}
.news-prose li{
  margin:.35em 0;
}

/* 画像（本文内） */
.news-prose img{
  max-width:100%;
  height:auto;
  border-radius:10px;
  margin: 1.6em 0 2.2em;
  border:1px solid var(--line);
}

/* 引用 */
.news-prose blockquote{
  background: var(--pdf-gray);
  border-left: 4px solid var(--pdf-green);
  padding: 12px 14px;
  margin: 1.2em 0;
  border-radius: 8px;
  color:#222;
}

/* NAV */
.news-nav{
  padding-top: 8px;
}
.news-nav__inner{
  max-width: 720px;
  margin: 0 auto;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
  align-items:center;
  font-size: var(--fs-body);
}
.news-nav__inner a{
  text-decoration:none;
  color: var(--pdf-green);
  font-weight: 700;
}
.news-nav__prev{ justify-self:start; }
.news-nav__back{ justify-self:center; color:#444; }
.news-nav__next{ justify-self:end; }

/* SP */
@media (max-width: 576px){
  .news-single{ padding: 14px 0 56px; }
  .news-prose{ padding-top: 14px; }
  .news-nav__inner{
    grid-template-columns: 1fr;
    text-align:center;
  }
  .news-nav__prev,
  .news-nav__next{
    justify-self:center;
  }
}

/* =========================================================
   NEWS ARCHIVE（/news）
========================================================= */

.news-archive-hero{
  padding: 48px 0 24px;
  border-bottom: 1px solid #eee;
  background:#fff;
}
.news-archive-title{
  text-align:center;
  font-size: clamp(22px, 2.8vw, 32px);
  font-weight:900;
  color:#111;
  margin:0;
}

.news-archive-list{
  padding: 40px 0 80px;
  background:#fff;
}

/* 既存の news-table / news-row / news-badge / news-arrow が利用される */

/* ページネーション */
.news-pagination{
  text-align:center;
  margin-top: 32px;
}
.news-pagination .page-numbers{
  display:inline-block;
  margin: 0 6px;
  padding: 8px 12px;
  border-radius:6px;
  text-decoration:none;
  color:#333;
  border: 1px solid #ddd;
}
.news-pagination .current{
  background: var(--pdf-green);
  color:#fff;
  border-color: var(--pdf-green);
}
.news-pagination .page-numbers:hover{
  background:#f1f1f1;
}
/* =========================================================
   CTA（最終導線）
========================================================= */
.cta-section{
  padding: 84px 0;
  background: var(--pdf-green);
}

.cta-inner{
  text-align: center;
}

.cta-title{
  font-size: clamp(22px, 2.8vw, 34px);
  font-weight: 900;
  margin: 0 0 10px;
  letter-spacing: .02em;
  color:#333;
}

.cta-lead{
  font-size: var(--fs-body);
  line-height: 1.8;
  margin: 0 auto 26px;
  max-width: 720px;
  opacity: .95;
  padding: 0 8px;
  color:#333;
}

/* ボタン群（カードなしの太い導線） */
.cta-actions{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 260px));
  gap: 12px;
  justify-content: center;
  margin-top: 10px;
}

.cta-btn{
  display: grid;
  gap: 4px;
  padding: 14px 18px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  color: #111;
  background: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
  transition: transform .25s ease, opacity .15s ease; /* transitionを調整 */
}

/* 【修正】最終CTAボタンをコーラルオレンジで強調 */
.cta-btn--main{
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 20px rgba(255,100,150,.28);
}

.cta-btn--main:hover{
  background: var(--cta-main-color-dark);
}

.cta-btn:hover{
  transform: translateY(-2px); /* ホバー時の動きを強調 */
  opacity: .95;
}

.cta-btn__label{
  font-size: clamp(1rem, .6vw + 1rem, 1.15rem);
  line-height: 1.2;
}

.cta-btn__sub{
  font-size: .85rem;
  font-weight: 600;
  color: #444;
}

.cta-title,
.cta-lead,
.cta-note{
  text-wrap: balance;    /* 行の長さを均等化（対応ブラウザ増えてる） */
  line-break: strict;    /* 日本語の禁則を強める */
  word-break: keep-all;  /* 変な1文字落ちを減らす */
}

/* ボタン別の微色分け（白地の中で識別） */
.cta-btn--phone{ border: 2px solid #19a77c; }
.cta-btn--mail{  border: 2px solid #0b7c5e; }
/* .cta-btn--line{ border:2px solid #00c300; } */

.cta-note{
  color:#333;
  margin-top: 18px;
  font-size: .9rem;
  opacity: .9;
}

/* SP */
@media (max-width: 576px){
  .cta-section{ padding: 64px 0; }
  .cta-actions{
    grid-template-columns: 1fr;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }
    .cta-title{
    font-size: clamp(20px, 5.2vw, 26px);
    padding: 0 10px;     /* 端で詰まって改行が汚くなるのを防止 */
  }
}


/* =========================================================
   CONTACT PAGE (お問い合わせフォーム専用)
========================================================= */

/* ---------------------------------------------------------
   ヒーローセクション
--------------------------------------------------------- */
.contact-hero {
  padding: 56px 0 24px;
  background: var(--bg-soft); /* LPの淡いピンク帯 */
  border-bottom: 1px solid var(--line);
}

.contact-hero .lp-container {
  max-width: 800px; /* フォームに合わせた幅に制限 */
  margin: 0 auto;
}

/* 既存のタイトルスタイルを継承しつつ微調整 */
.contact-hero .pdf-section-title {
  color: var(--text);
  margin-bottom: 10px;
}

.contact-hero .lp-lead {
  text-align: center;
  font-size: var(--fs-body);
  color: var(--muted);
  line-height: 1.7;
}

/* ---------------------------------------------------------
   フォーム本体
--------------------------------------------------------- */
.contact-form {
  padding: 40px 0 80px;
  background: #fff;
}

.contact-form .lp-container {
  max-width: 720px; /* フォームの最大幅 */
  margin: 0 auto;
  padding: 0 18px;
}

/* ---------------------------------------------------------
   フォームの各グループ（.form-group）
--------------------------------------------------------- */
.form-group {
  margin-bottom: 22px;
}

.form-group label {
  display: block;
  font-size: var(--fs-body);
  font-weight: 700;
  color: var(--text);
  margin-bottom: 8px;
  line-height: 1.5;
}

/* 必須マークのスタイル */
.required-star {
  color: var(--primary-dark); /* LPのアクセントカラー（サーモン系） */
  font-weight: 800;
  font-size: 1.1em;
  margin-left: 4px;
}

/* ---------------------------------------------------------
   入力フィールド（.form-control）
--------------------------------------------------------- */
.form-control {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #ccc;
  border-radius: 8px; /* 角を丸く */
  font-size: var(--fs-body);
  color: var(--text);
  background-color: #fcfcfc;
  transition: border-color .2s, box-shadow .2s;
  box-shadow: 0 2px 5px rgba(0,0,0,.04) inset;
  appearance: none; /* selectのデフォルトスタイルをリセット */
}

/* プレースホルダーのスタイル */
.form-control::placeholder {
  color: #a0a0a0;
  opacity: 1;
}

/* フォーカス時のスタイル */
.form-control:focus {
  border-color: var(--primary); /* アクセントカラーを適用 */
  outline: none;
  box-shadow: 0 0 0 3px var(--bg-soft), 0 2px 5px rgba(0,0,0,.06) inset;
  background-color: #fff;
}

/* textareaの高さ調整 */
textarea.form-control {
  min-height: 140px;
  resize: vertical;
}

/* selectボックスの見た目調整 */
select.form-control {
  padding-right: 30px; /* 矢印スペース */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23666" d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 10px center;
}

.cf-privacy-wrap input[type="checkbox"] {
  margin-right: 8px !important;  /* ← ここが余白 */
}


/* ---------------------------------------------------------
   送信ボタン（.btn）
--------------------------------------------------------- */
.form-group.buttons {
  margin-top: 40px;
  text-align: center;
}

.form-group .btn {
  /* 【修正】中央寄せを確実にするための設定 */
  display: block; /* inline-block から block に変更 */
  margin: 0 auto; /* 左右の余白を自動にし、max-width適用時に中央寄せ */

  /* 以下は既存のスタイルを維持 */
  background: var(--primary);
  color: #fff;
  border: 2px solid var(--cta-main-color);
  padding: 14px 40px;
  font-size: clamp(1.0rem, .6vw + 1rem, 1.25rem);
  font-weight: 800;
  border-radius: 999px;
  text-decoration: none;
  cursor: pointer;
  transition: .25s ease;
  box-shadow: 0 8px 20px rgba(255,127,80,.4);
  letter-spacing: .05em;
  width: 100%;
  max-width: 340px;
}

.form-group .btn:hover {
  background: var(--cta-main-color-dark);
  border-color: var(--cta-main-color-dark);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(255,127,80,.45);
}

/* =========================================================
   FORM ASSURANCE BLOCK (フォーム直上に追加する安心感ブロック)
========================================================= */
.form-assurance-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 24px;
  margin: 0 auto 30px;
  padding: 15px;
  background: var(--bg-soft); /* LPの淡いピンク */
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: var(--fs-small);
  color: var(--muted);
}

.assurance-item {
  display: flex;
  align-items: center;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* アイコン用のスペースと色 */
.assurance-item::before {
  content: ' '; /* アイコンとして使用するためのダミー */
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  background-color: var(--primary); /* アクセントカラー */
  -webkit-mask-size: cover;
  mask-size: cover;
}

/* 🔒 SSLアイコン (例) */
.form-assurance-block .assurance-item:nth-child(1)::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 2C9.24 2 7 4.24 7 7v3h-1c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2h-1V7c0-2.76-2.24-5-5-5zm0 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3-6H9V7c0-1.66 1.34-3 3-3s3 1.34 3 3v3z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 2C9.24 2 7 4.24 7 7v3h-1c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2h-1V7c0-2.76-2.24-5-5-5zm0 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3-6H9V7c0-1.66 1.34-3 3-3s3 1.34 3 3v3z'/%3E%3C/svg%3E");
}

/* 営業電話アイコン (例) */
.form-assurance-block .assurance-item:nth-child(2)::before {
  background-color: var(--primary-dark);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M20 17.5c-1.4 0-2.7-.3-3.9-.9c-.6-.3-1.2-.2-1.7.2l-2.1 2.1c-2.3-1.2-4.4-3.3-5.6-5.6l2.1-2.1c.4-.4.5-1.1.2-1.7c-.6-1.2-.9-2.5-.9-3.9c0-.6-.5-1-1-1H3.5c-.6 0-1 .5-1 1C3.5 14.5 9.5 20.5 17.5 20.5c.6 0 1-.5 1-1V18.5c0-.6-.5-1-1-1z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M20 17.5c-1.4 0-2.7-.3-3.9-.9c-.6-.3-1.2-.2-1.7.2l-2.1 2.1c-2.3-1.2-4.4-3.3-5.6-5.6l2.1-2.1c.4-.4.5-1.1.2-1.7c-.6-1.2-.9-2.5-.9-3.9c0-.6-.5-1-1-1H3.5c-.6 0-1 .5-1 1C3.5 14.5 9.5 20.5 17.5 20.5c.6 0 1-.5 1-1V18.5c0-.6-.5-1-1-1z'/%3E%3C/svg%3E");
}

/* 必須項目アイコン (例) */
.form-assurance-block .assurance-item:nth-child(3)::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
  background-color: var(--pdf-green); /* LINE SaaSのキーカラー */
}

/* リード文の強調 */
.lp-lead .highlight-text {
  font-weight: 700;
  color: var(--primary-dark);
}

@media (max-width: 500px) {
  .form-assurance-block {
    flex-direction: column;
    gap: 8px;
    padding: 12px;
  }
}
/* =========================================================
   CONTACT THANKS PAGE (お問い合わせ完了)
========================================================= */

.contact-thanks-section {
  /* LPの主要トーンに合わせた背景色と上下のパディング */
  background: var(--bg-soft);
  padding: 80px 0 100px;
  min-height: 80vh; /* 最低高さを確保し、フッターが不自然に上がらないように */
}

.thanks-inner {
  max-width: 680px; /* 適切なコンテンツ幅に制限 */
  margin: 0 auto;
  padding: 40px 18px;
  text-align: center;

  /* サンクスコンテンツをカード状に目立たせる */
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.thanks-title {
  font-size: clamp(1.6rem, 2vw + 1.2rem, 2.2rem);
  font-weight: 900;
  color: var(--pdf-green); /* LINE SaaSの成功イメージに合わせた緑 */
  margin: 0 0 18px;
  line-height: 1.3;
}

.thanks-lead {
  font-size: var(--fs-body);
  line-height: 1.85;
  color: #333;
  margin: 0 auto 30px;
}

/* ---------------------------------------------------------
   ホームへ戻るボタン
--------------------------------------------------------- */
.thanks-actions {
  margin-top: 24px;
}

.thanks-btn {
  /* メインCTA（lp-btn-main/フォームのsubmit）と同一のサイズ・デザイン */
  display: inline-block;
  background: var(--primary); /* コーラルオレンジ */
  color: #fff;
  border: 2px solid var(--cta-main-color);
  padding: 14px 40px;
  font-size: clamp(1.0rem, .6vw + 1rem, 1.25rem);
  font-weight: 800;
  border-radius: 999px;
  text-decoration: none;
  cursor: pointer;
  transition: .25s ease;
  box-shadow: 0 8px 20px rgba(255,127,80,.4);
  letter-spacing: .05em;
}

.thanks-btn:hover {
  background: var(--cta-main-color-dark);
  border-color: var(--cta-main-color-dark);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(255,127,80,.45);
}

/* ---------------------------------------------------------
   SP調整
--------------------------------------------------------- */
@media (max-width: 560px) {
  .contact-thanks-section {
    padding: 60px 0 80px;
  }
  .thanks-inner {
    padding: 30px 18px;
  }
  .thanks-btn {
    width: 100%;
    max-width: 300px; /* SPでの幅を制限 */
  }
}

/* ---------------------------------------------------------
   追加要素（緊急連絡先・ソーシャルプルーフ）
--------------------------------------------------------- */

/* 緊急連絡先（赤系で強調し、即時性をアピール） */
.thanks-emergency-contact {
  margin: 10px 0 30px;
  font-size: var(--fs-body);
  font-weight: 500;
  color: var(--muted);
}
.thanks-emergency-contact p {
  margin: 0;
}
.thanks-emergency-contact a {
  color: var(--primary-dark); /* LPのアクセントカラー（赤系）で強調 */
  text-decoration: none;
  font-weight: 700;
  display: inline-block;
  padding: 2px 4px;
  border-bottom: 2px solid var(--primary-dark);
  transition: all 0.2s;
}
.thanks-emergency-contact a:hover {
  background: var(--bg-soft);
}

/* ソーシャルプルーフ（導入事例リンク。LINE SaaSのキーカラーである緑系で信頼感を補強） */
.thanks-social-proof {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--line); /* やわらかい罫線で区切る */
}
.thanks-social-proof p {
  margin: 0;
  font-size: var(--fs-body);
  color: var(--muted);
}
.proof-link {
  color: var(--pdf-green); /* システムのキーカラー（緑）で信頼感を補強 */
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid var(--pdf-green);
  transition: opacity 0.2s;
}
.proof-link:hover {
  opacity: 0.8;
}

/* ================================
   Privacy Policy Page (Acceptia LP Style)
   ================================ */

/* 全体の余白と幅 */
.privacy-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
  color: #444;
  line-height: 1.8;
  font-size: 16px;
}

/* H1 タイトル */
.privacy-container h1 {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 30px;
  text-align: center;
  color: #222;
  border-bottom: 3px solid var(--primary); /* アクセプティアのメインカラー */
  display: inline-block;
  padding-bottom: 8px;
}

/* セクション見出し */
.privacy-container h2 {
  font-size: 1.4rem;
  margin-top: 40px;
  margin-bottom: 15px;
  color: #222;
  font-weight: 700;
  border-left: 6px solid var(--primary);
  padding-left: 10px;
}

/* 小見出し */
.privacy-container h3 {
  font-size: 1.2rem;
  margin-top: 25px;
  margin-bottom: 10px;
  color: #333;
  font-weight: 600;
}

/* 本文 */
.privacy-container p {
  margin-bottom: 20px;
}

/* リスト */
.privacy-container ul li {
  margin-bottom: 8px;
  padding-left: 5px;
}

/* リンク */
.privacy-container a {
  color: var(--primary);
  text-decoration: underline;
}
.privacy-container a:hover {
  opacity: 0.8;
}

/* テーブル（もし使う場合） */
.privacy-container table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
}

.privacy-container table th,
.privacy-container table td {
  border: 1px solid #ddd;
  padding: 10px;
}

.privacy-container table th {
  background: #f8f8f8;
  font-weight: 600;
}

/* スマホ最適化 */
@media (max-width: 768px) {
  .privacy-container {
    padding: 30px 15px;
    font-size: 15px;
  }

  .privacy-container h1 {
    font-size: 1.6rem;
  }

  .privacy-container h2 {
    font-size: 1.2rem;
  }

  .privacy-container h3 {
    font-size: 1.1rem;
  }
}