/* 記録と数値を、飾りを加えず読めるように組む。 */
.vn-figure { margin-block: 32px; color: #1d2e31; }
.vn-figure :is(p,ul,ol,dl) { margin: 0; }
.vn-figure ul { padding: 0; list-style: none; }
.vn-figure .vn-note { margin-top: 16px; color: #596568; font-size: 14px; line-height: 1.85; }
.vn-figure .vn-rule { margin-top: 20px; font-size: 14px; line-height: 1.85; color: #596568; }

/* 初回来院予約の同じ40人を、一人一状態で集計する。 */
.vn-cohort .vn-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 20px; margin-top: 20px; }
.vn-context strong { font-size: 17px; font-weight: 700; line-height: 1.7; }
.vn-context > span { color: #596568; font-size: 14px; line-height: 1.7; }
.vn-cohort .vn-scope { margin-top: 8px; font-size: 14px; line-height: 1.85; }
.vn-cohort .vn-bars { margin-top: 25px; display: grid; gap: 20px; }
.vn-bar__label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; font-size: 15px; line-height: 1.7; }
.vn-bar__label strong { font-size: 16px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.vn-bar__track { height: 12px; background: #eef1f1; }
.vn-bar__track > span { display: block; height: 100%; background: #269b9d; }
.vn-bar__track--32 > span { width: 80%; }
.vn-bar__track--5 > span { width: 12.5%; }
.vn-bar__track--2 > span { width: 5%; }
.vn-bar__track--1 > span { width: 2.5%; }
.vn-bar__scale { display: flex; justify-content: space-between; margin-top: 10px; color: #596568; font-size: 13px; line-height: 1.7; font-variant-numeric: tabular-nums; }

/* 一人の問い合わせ記録から、二つの項目の違いを示す。 */
.vn-discovery .vn-record__heading { margin-top: 22px; color: #596568; font-size: 14px; line-height: 1.7; }
.vn-discovery .vn-record { margin-top: 10px; }
.vn-record > div { display: grid; grid-template-columns: minmax(95px,.4fr) minmax(0,1fr); gap: 24px; padding-block: 16px; border-bottom: 1px solid #d3dadb; }
.vn-record > div:first-child { border-top: 1px solid #d3dadb; }
.vn-record dt,.vn-record dd { margin: 0; font-size: 16px; line-height: 1.75; }
.vn-record dt { font-weight: 650; }

/* 損益と入出金を、同じ項目で横に読み比べる。 */
.vn-compare { width: 100%; table-layout: fixed; border-collapse: collapse; margin-top: 22px; font-size: 15px; line-height: 1.8; }
.vn-compare th,.vn-compare td { padding: 16px 12px; border-bottom: 1px solid #d3dadb; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.vn-compare thead th { border-bottom: 2px solid #1d2e31; font-weight: 700; }
.vn-compare th:first-child { width: 22%; }
.vn-compare tbody th { font-weight: 650; }

@media(max-width:600px) {
 .vn-figure { margin-block: 28px; }
 .vn-bar__label { font-size: 14px; }
 .vn-record > div { grid-template-columns: 105px minmax(0,1fr); gap: 16px; }
 .vn-record dt,.vn-record dd { font-size: 15px; }
 .vn-compare { font-size: 14px; }
 .vn-compare th,.vn-compare td { padding: 14px 7px; }
 .vn-compare th:first-child { width: 24%; }
}
