:root { --ink:#222; --muted:#666; --line:#d9d9d9; --paper:#fff; }
html,body { height:100% }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"游明朝","Yu Mincho","Noto Serif JP",serif;
  font-size:14px; line-height:1.9; letter-spacing:.02em;
}

/* レイアウト */
.wrap{ max-width:1000px; margin:0 auto; padding:60px 140px 100px }

/* 見出し */
.title{ font-size:20px; font-weight:700; margin:0 0 14px }
.lead{ color:#444; margin:0 0 26px }

/* パネル */
.panel{ border:1px solid var(--line); background:#fff; padding:0 40px; margin:40px 0 }
.panel.slim{ padding:0 24px }
.panel h2{ margin:0; padding:12px 0; font-size:16px; font-weight:700; border-bottom:1px solid var(--line) }

/* 電話案内 */
.callout .columns{ display:grid; grid-template-columns: 1fr 280px; gap:24px; align-items:start; }
.callout .big-tel{ margin:8px 0 0 }
.tel{
  font-size:26px; font-weight:800; letter-spacing:.02em;
  color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px;
}
.tel:focus, .tel:hover{ border-bottom-color:#aaa }
.note.small{ margin-top:8px }

.mini{ font-size:13px; margin:10px 0 6px }
.addr{ font-style:normal; line-height:1.8; }

/* タググリッド */
.tag-grid{
  list-style:none; margin:0; padding:12px 0 18px;
  display:grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:10px 16px;
}
.tag-grid li{
  border:1px solid var(--line); text-align:center; font-weight:700;
  padding:8px 10px; line-height:1.6; letter-spacing:.02em;
}
.tag-grid li{ grid-column: span 3; text-align:left; }

/* 申込の流れ */
.flow{ list-style:none; margin:0; padding:10px 0 14px }
.flow li{
  display:grid; grid-template-columns: 8em 1fr; gap:10px;
  border-bottom:1px solid var(--line); padding:6px 0;
}
.flow .k{ font-weight:700 }
.flow .d{ color:#333 }

/* FAQ */
.faq{ margin:0; padding:12px 0 18px }
.qa{ border-bottom:1px solid var(--line); padding:6px 0 }
.qa dt{ font-weight:700 }
.qa dd{ margin:4px 0 0 }

.small{ font-size:12px }
.muted{ color:var(--muted) }
.ref{ margin-top:12px }

/* レスポンシブ */
@media (min-width:1200px){
  .tag-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width:680px){
  body{ font-size:15px; line-height:1.95 }
  .wrap{ padding:28px 16px 56px; max-width:none }
  .panel{ padding:0 14px; margin:28px 0 }
  .panel.slim{ padding:0 12px }
  .callout .columns{ grid-template-columns: 1fr; }
  .tag-grid{ grid-template-columns: 1fr; gap:8px 12px }
  .flow li{ grid-template-columns: 1fr; }
}