:root{
  --maxw: 1100px;
  --text: #111;
  --muted: #444;
  --line: #6b6b6b;
  --blue: #a9c4f5;
  --orange: #f6c998;
  --bubble-radius: 22px;
}
*{box-sizing:border-box}
body {
  margin: 0;

  font-family:
    "Meiryo",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Noto Sans JP",
    sans-serif;
  line-height: 1.9;
  color: #333;
  background-color: #FFF8E7; /* ← 背景色（後述） */
}

a{color:inherit}
.nav{
  position: sticky; top:0;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
  border-bottom:1px solid #eee;
  z-index:10;
}
.nav-inner{
  max-width: var(--maxw);
  margin:0 auto;
  padding:10px 16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.nav a{
  font-size:14px;
  padding:6px 10px;
  border:1px solid #e7e7e7;
  border-radius:999px;
  text-decoration:none;
}
.nav a:hover{background:#f6f6f6}

.slide{
  max-width: var(--maxw);
  margin:0 auto;
  padding:42px 16px 56px;
}
h1{
  font-size: 2.3rem;   /* 例：2.3rem → 1.9rem */
  margin-bottom: 1.2em;
  line-height:1.1;
  letter-spacing:.01em;
  margin:0 0 22px;
  font-weight:600;
  letter-spacing: 0.05em;
 }
h2{
  font-size:1.7rem;
  margin-bottom: 1.2em;
  line-height:1.1;
  margin:0 0 18px;
  margin:0 0 22px;
  font-weight:600;
  letter-spacing: 0.05em;
}
h3{
  font-size:1.2rem;
  margin-bottom: 1.2em;
  line-height:1.1;
  margin:0 0 18px;
  margin:0 0 22px;
  font-weight:600;
  letter-spacing: 0.05em;
}
p, li{
  font-size:20px;
  line-height:1.55;
  margin:0 0 10px;
}
strong{font-weight:800}
.small{font-size:22px;color:var(--muted)}
.center{text-align:center}
.mt-16{margin-top:16px}
.mt-24{margin-top:24px}
.mt-32{margin-top:32px}
.mt-40{margin-top:40px}
.mt-48{margin-top:48px}

.grid-2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:36px;
}
@media (max-width: 900px){
  h1{font-size:42px}
  h2{font-size:40px}
  p, li{font-size:20px}
  .grid-2{grid-template-columns:1fr; gap:18px}
}

/* ===== 3-up bubbles (LP専用) ===== */
.grid-3-bubbles{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: stretch;
  max-width: 980px;
  margin: 0 auto;
}

@media (max-width: 900px){
  .grid-3-bubbles{
    grid-template-columns: 1fr;  /* スマホ/狭い画面は縦並び */
  }
}


.bubble{
  border:2px solid var(--line);
  border-radius: var(--bubble-radius);
  padding:18px 22px;
  background:#fff;
}
.bubble.blue{background: var(--blue)}
.bubble.orange{background: var(--orange)}
.bubble p{margin:0}
.pill{
  display:inline-block;
  padding:14px 26px;
  border:2px solid var(--line);
  border-radius:999px;
  font-weight:800;
  font-size:26px;
  background:#fff;
}
.pill.blue{background: var(--blue)}
.pill.orange{background: var(--orange)}

.speech{
  position: relative;
  border:2px solid var(--line);
  border-radius: 16px;
  padding:16px 18px;
  background:#f2f2f2;
}
.speech:after{
  content:"";
  position:absolute;
  width:0;height:0;
  border:14px solid transparent;
}
.tail-top-left:after{
  left:22px; top:-26px;
  border-bottom-color: var(--line);
}
.tail-top-left:before{
  content:"";
  position:absolute;
  width:0;height:0;
  left:22px; top:-23px;
  border:13px solid transparent;
  border-bottom-color:#f2f2f2;
}
.tail-top-right:after{
  right:22px; top:-26px;
  border-bottom-color: var(--line);
}
.tail-top-right:before{
  content:"";
  position:absolute;
  width:0;height:0;
  right:22px; top:-23px;
  border:13px solid transparent;
  border-bottom-color:#f2f2f2;
}
.tail-bottom-left:after{
  left:22px; bottom:-26px;
  border-top-color: var(--line);
}
.tail-bottom-left:before{
  content:"";
  position:absolute;
  width:0;height:0;
  left:22px; bottom:-23px;
  border:13px solid transparent;
  border-top-color:#f2f2f2;
}
.tail-bottom:after{
  left:50%; transform:translateX(-50%);
  bottom:-26px;
  border-top-color: var(--line);
}
.tail-bottom:before{
  content:"";
  position:absolute;
  width:0;height:0;
  left:50%; transform:translateX(-50%);
  bottom:-23px;
  border:13px solid transparent;
  border-top-color:#f2f2f2;
}

.table{
  width:100%;
  border-collapse: collapse;
  margin:18px 0 18px;
  font-size:20px;
}
.table th, .table td{
  border:2px solid #9a9a9a;
  padding:14px 14px;
  vertical-align:top;
}
.table thead th{
  background: var(--orange);
  font-weight:800;
  text-align:center;
}
.table td:first-child{
  width:80px;
  text-align:center;
  font-weight:800;
}

.steps{
  display:flex;
  gap:20px;
  align-items:stretch;
  justify-content:center;
  flex-wrap:wrap;
  margin:16px 0;
}
.step{
  position:relative;
  min-width: 260px;
  padding:26px 28px;
  background: var(--orange);
  border:2px var(--line);
  font-size:28px;
  font-weight:800;
  text-align:center;
  clip-path: polygon(0 0, 88% 0, 100% 50%, 88% 100%, 0 100%, 6% 50%);
}
@media (max-width: 900px){
  .step{min-width: 220px; font-size:22px}
  .table{font-size:18px}
}

.ul-bullets{
  margin:8px 0 0 0;
  padding-left: 1.2em;
}

/* --- LP spacing tweaks --- */
.lp-section{
  padding: 120px 0;   /* セクション間の余白（確実に効く） */
}

.lp-container{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 24px;
}

/* セクションの切れ目が分かりやすいように（不要なら削除OK） */
.lp-section + .lp-section{
  border-top: 1px solid rgba(0,0,0,0.06);
}

/* ===== LP styles (migrated from lp.html inline <style>) ===== */
html{ scroll-behavior: smooth; }

/* 固定ヘッダーの分だけ上を空ける（lp.htmlで使っていた値） */
body{ padding-top: 64px; }

/* LPヘッダー（固定） */
.lp-header{
  position: fixed;
  top: 0; left: 0; right: 0;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #eee;
  z-index: 100;
}
.lp-header .nav-inner{ padding: 10px 16px; }
.lp-header .brand{ font-weight: 800; letter-spacing: .02em; }
.lp-header .cta{
  margin-left: auto;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

/* ボタン */
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid #e7e7e7;
  text-decoration: none;
  font-size: 14px;
  background: #fff;
}
.btn.primary{ border-color: #111; }

/* LP共通レイアウト */
.lp-container{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 16px; /* inlineでは16pxだったので統一 */
}

/* セクション余白（←ここが今回の目的） */
.lp-section{
  padding: 80px 0; /* 28px → 大きく */
}
.lp-section + .lp-section{
  border-top: 1px solid rgba(0,0,0,0.06);
}

/* HEROと目次 */
.lp-hero{ padding: 18px 0 8px; }
.lp-toc{
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.lp-toc li a{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  border: 1px solid #eee;
  border-radius: 14px;
  text-decoration: none;
}
.toc-p{ font-weight: 800; min-width: 40px; }
.toc-t{ color: var(--muted); }

/* トップへ戻るボタン */
.backtop{
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid #e7e7e7;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* スマホ */
@media (max-width: 640px){
  body{ padding-top: 82px; }
  .lp-header .nav-inner{ gap: 8px; }
  .lp-header .cta{ width: 100%; margin-left: 0; }
  .lp-section{ padding: 72px 0; } /* スマホは余白控えめ */
}

/* ===== table compact tweak ===== */
.table th, .table td{
  padding: 8px 10px;      /* 行の高さはまずここで下がる */
  line-height: 1.25;      /* テーブル内は少し詰める */
}

.table p, .table li{
  margin: 0;              /* テーブル内の余計な下マージンを消す */
  line-height: 1.25;
}

.service-cta { margin: 18px 0 26px; }
.service-cta{ text-align:center; }
.service-cta__btn{
  display:inline-block;
  background:#d79a3a;
  color:#000;
  text-decoration:none;
  font-weight:800;
  padding:14px 18px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 2px 0 rgba(0,0,0,.10);
}
.service-cta__btn:hover{ filter:brightness(0.98); }

.eldercare-contact{
    max-width:800px;
    margin:80px auto;
    line-height:1.8;
}

.eldercare-contact h2{
    margin-top:50px;
}

.eldercare-contact ul{
    margin-left:20px;
}

.contact-button{
    display:inline-block;
    margin-top:20px;
    padding:12px 24px;
    border:1px solid #333;
    text-decoration:none;
}