/* Clinic Price Table frontend v1.1.7 — clinic-card デザイントークン準拠
   テーブル関連はテーマCSS（SWELL等）の枠線・余白に負けないよう .cptt-wrap 起点で詳細度を確保 */
.cptt-wrap {
  --bg:#F4F7F7;--card:#fff;--text:#1C1917;--text-2:#57534E;--text-3:#A8A29E;
  --accent:#0C9298;--accent-dark:#0C9298;--accent-light:#E6F5F5;
  --border:#E2ECEC;--border-light:#EDF4F4;
  --sale:#DC2626;--sale-bg:#FEF2F2;
  --price:#E07B5A;
  --r:12px;--r-sm:8px;
}
.cptt-wrap[data-theme="mens"] {
  --accent:#1E5A8A;--accent-dark:#174A73;--accent-light:#EAF2F8;
  --border:#DDE7F0;--border-light:#EAF1F7;
}
.cptt-wrap,.cptt-wrap *{box-sizing:border-box}
.cptt-wrap{font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;color:var(--text);line-height:1.7;-webkit-font-smoothing:antialiased;margin:24px 0}

.cptt-wrap .cptt-block{margin-bottom:28px}
.cptt-wrap .cptt-block:last-of-type{margin-bottom:0}

/* カテゴリ見出し（ヘッダー行と同じ単色でシームレスに繋げる） */
.cptt-wrap .cptt-cat{background:var(--accent);color:#fff;font-size:15px;font-weight:700;letter-spacing:1px;text-align:center;padding:10px 16px;border-radius:var(--r) var(--r) 0 0;margin:0}

/* テーブル */
.cptt-wrap .cptt-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0;padding:0}
.cptt-wrap .cptt-table{width:100%;border-collapse:collapse !important;border-spacing:0 !important;background:var(--card);border:0 !important;border-bottom:1.5px solid var(--border) !important;font-size:14px;table-layout:fixed;margin:0}
.cptt-wrap .cptt-cat + .cptt-scroll .cptt-table{border-top:0 !important}

/* テーマ由来の枠線・背景・角丸リセット（セル間の白い隙間・接合部の欠け対策） */
.cptt-wrap .cptt-table,
.cptt-wrap .cptt-table tr,
.cptt-wrap .cptt-table th,
.cptt-wrap .cptt-table td{border-radius:0 !important}
.cptt-wrap .cptt-table tr,
.cptt-wrap .cptt-table th,
.cptt-wrap .cptt-table td{border:0 !important;box-shadow:none}
.cptt-wrap .cptt-table tr{background:transparent}
.cptt-wrap .cptt-table tbody th,
.cptt-wrap .cptt-table tbody td{background:var(--card)}
/* カテゴリバーとヘッダーを1px重ねてサブピクセルの継ぎ目を消す */
.cptt-wrap .cptt-cat{margin-bottom:-1px;position:relative;z-index:1}

/* 列幅の固定（複数テーブル間で列位置を揃える） */
.cptt-wrap .cptt-cols-4 .cptt-th-plan{width:40%}
.cptt-wrap .cptt-cols-4 .cptt-th-count{width:14%}
.cptt-wrap .cptt-cols-4 .cptt-th-price{width:26%}
.cptt-wrap .cptt-cols-4 .cptt-th-monthly{width:20%}
.cptt-wrap .cptt-cols-3 .cptt-th-plan{width:46%}
.cptt-wrap .cptt-cols-3 .cptt-th-count{width:18%}
.cptt-wrap .cptt-cols-3 .cptt-th-price{width:36%}

/* ヘッダー行（カテゴリ見出しと同配色・境界線はアクセント同系色で隙間を見せない） */
.cptt-wrap .cptt-table thead th{background:var(--accent);color:#fff;font-size:12px;font-weight:700;letter-spacing:.5px;padding:10px 12px;text-align:center;white-space:nowrap;border:0 !important}
/* tbody側の左右1px枠線とテーブル端座標を揃えるため、ヘッダー両端にも同幅の縁（地色と同色＝不可視）を与える */
.cptt-wrap .cptt-table thead th:first-child{border-left:1px solid var(--accent) !important}
.cptt-wrap .cptt-table thead th:last-child{border-right:1px solid var(--accent) !important}
.cptt-wrap .cptt-table .cptt-th-plan{text-align:center}

/* 本文セル（自前の水平罫線のみ。縦罫線なし） */
.cptt-wrap .cptt-table tbody th,
.cptt-wrap .cptt-table tbody td{border-top:1px solid var(--border-light) !important;padding:12px;vertical-align:middle}
.cptt-wrap .cptt-table tbody tr.cptt-row-first th,
.cptt-wrap .cptt-table tbody tr.cptt-row-first td{border-top:1.5px solid var(--border) !important}
.cptt-wrap .cptt-table tbody tr:first-child th,
.cptt-wrap .cptt-table tbody tr:first-child td{border-top:0 !important}

/* プラン名セル（上下左右中央揃え・背景は他セルと同色） */
.cptt-wrap .cptt-plan{text-align:center;vertical-align:middle;background:var(--card) !important;min-width:0;font-weight:400}
/* プラン名セルの縦枠線＋本文の左右外枠（theadは全幅のまま＝段差なし） */
.cptt-wrap .cptt-table tbody .cptt-plan{border-left:1px solid var(--border) !important;border-right:1px solid var(--border) !important}
.cptt-wrap .cptt-table tbody tr > *:last-child{border-right:1px solid var(--border) !important}
.cptt-wrap .cptt-plan-name{display:block;font-size:14px;font-weight:700;line-height:1.5}
.cptt-wrap .cptt-badge{display:inline-block;margin-top:6px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;letter-spacing:.5px;padding:2px 10px;border-radius:99px}
.cptt-wrap .cptt-desc{display:block;margin-top:6px;font-size:11px;color:var(--text-2);line-height:1.6}

/* 回数・価格セル */
.cptt-wrap .cptt-count{text-align:center;white-space:nowrap;color:var(--text-2);font-weight:600;font-size:13px}
.cptt-wrap .cptt-price{text-align:center;white-space:nowrap}
.cptt-wrap .cptt-amount,.cptt-wrap .cptt-sale{font-size:17px;font-weight:700;letter-spacing:.2px}
.cptt-wrap .cptt-amount small,.cptt-wrap .cptt-sale small,.cptt-wrap .cptt-monthly small{font-size:11px;font-weight:600;margin-left:1px}
.cptt-wrap .cptt-amount{color:var(--price)}
.cptt-wrap .cptt-sale{color:var(--sale)}
.cptt-wrap .cptt-regular{display:block;font-size:11px;color:var(--text-3);text-decoration:line-through;line-height:1.4}
.cptt-wrap .cptt-label{display:block;margin-top:3px;font-size:10px;font-weight:700;color:var(--sale);background:var(--sale-bg);border-radius:4px;padding:1px 8px;width:fit-content;margin-left:auto;margin-right:auto}
.cptt-wrap .cptt-monthly{text-align:center;white-space:nowrap;font-weight:700;color:var(--text-2);font-size:14px}
.cptt-wrap .cptt-none{color:var(--text-3);font-weight:400}

/* 注釈 */
.cptt-wrap .cptt-notes{margin-top:8px}
.cptt-wrap .cptt-note-line,.cptt-wrap .cptt-footer-line{display:block;font-size:11px;color:var(--text-3);line-height:1.7}
.cptt-wrap .cptt-footer{margin-top:16px;padding-top:12px;border-top:1px dashed var(--border)}

/* スマホ */
@media (max-width:560px){
  .cptt-wrap .cptt-table{font-size:12px}
  .cptt-wrap .cptt-table thead th{font-size:10px;letter-spacing:0;padding:8px 4px}
  .cptt-wrap .cptt-table tbody th,
  .cptt-wrap .cptt-table tbody td{padding:9px 5px}
  /* 列幅の再配分（価格・月々を優先確保） */
  .cptt-wrap .cptt-cols-4 .cptt-th-plan{width:38%}
  .cptt-wrap .cptt-cols-4 .cptt-th-count{width:12%}
  .cptt-wrap .cptt-cols-4 .cptt-th-price{width:29%}
  .cptt-wrap .cptt-cols-4 .cptt-th-monthly{width:21%}
  .cptt-wrap .cptt-cols-3 .cptt-th-plan{width:44%}
  .cptt-wrap .cptt-cols-3 .cptt-th-count{width:16%}
  .cptt-wrap .cptt-cols-3 .cptt-th-price{width:40%}
  .cptt-wrap .cptt-plan{min-width:0}
  .cptt-wrap .cptt-plan-name{font-size:12px;line-height:1.45}
  .cptt-wrap .cptt-desc{font-size:9px;line-height:1.5;margin-top:4px}
  .cptt-wrap .cptt-badge{font-size:9px;padding:1px 8px;margin-top:4px}
  .cptt-wrap .cptt-count{font-size:11px}
  .cptt-wrap .cptt-amount,.cptt-wrap .cptt-sale{font-size:13px;letter-spacing:0}
  .cptt-wrap .cptt-amount small,.cptt-wrap .cptt-sale small,.cptt-wrap .cptt-monthly small{font-size:9px}
  .cptt-wrap .cptt-regular{font-size:9px}
  .cptt-wrap .cptt-label{font-size:9px;padding:1px 6px}
  .cptt-wrap .cptt-monthly{font-size:12px}
  .cptt-wrap .cptt-cat{font-size:13px;padding:8px 12px}
  .cptt-wrap .cptt-note-line,.cptt-wrap .cptt-footer-line{font-size:10px}
}

/* アコーディオン（その他のプラン） */
.cptt-wrap .cptt-more-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:4px 0 28px;padding:12px 16px;background:var(--card);border:1.5px solid var(--accent);border-radius:var(--r-sm);color:var(--accent);font-family:inherit;font-size:14px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:background .2s}
.cptt-wrap .cptt-more-btn:hover{background:var(--accent-light)}
.cptt-wrap .cptt-more-arrow{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.cptt-wrap .cptt-more-btn[aria-expanded="true"] .cptt-more-arrow{transform:rotate(225deg) translateY(-2px)}
.cptt-wrap .cptt-more-body{margin:0}
@media (max-width:560px){
  .cptt-wrap .cptt-more-btn{font-size:12px;padding:10px 12px;margin-bottom:20px}
}