.knowledge-body .renewal-reading-diagram {
  --reading-line: #cbd8d6;
  --reading-ink: #17454b;
  margin: 2rem 0 3rem;
  padding: 1.5rem 0;
  border-top: 1px solid var(--reading-line);
  border-bottom: 1px solid var(--reading-line);
  color: var(--reading-ink);
  font-size: 1rem;
  line-height: 1.7;
}
.renewal-reading-diagram figcaption { font-weight: 650; font-size: 1.15rem; margin-bottom: 1.25rem; }
.renewal-reading-diagram .reading-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.renewal-reading-diagram .reading-inputs > div { padding-bottom: 1rem; }
.knowledge-body .renewal-reading-diagram p { margin: .5rem 0 0; }
.knowledge-body .renewal-reading-diagram .reading-value-chain {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem;
  list-style: none; padding: 1.25rem 0 0; margin: 0; border-top: 1px solid var(--reading-line);
}
.renewal-reading-diagram .reading-value-chain li { position: relative; margin: 0; padding: 0; }
.renewal-reading-diagram .reading-value-chain li + li::before { content: '→'; position: absolute; left: -1.2rem; }
.renewal-reading-diagram strong, .renewal-reading-diagram .reading-value-chain span { display: block; }
.renewal-reading-diagram .reading-area-ledger { margin: 0; }
.renewal-reading-diagram .reading-area-ledger > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 1.5rem; padding: 1rem 0; }
.renewal-reading-diagram .reading-area-ledger > div + div { border-top: 1px solid var(--reading-line); }
.renewal-reading-diagram dt { font-weight: 650; }
.renewal-reading-diagram dd { margin: 0; }
.knowledge-body .renewal-reading-diagram .reading-diagram-note { font-size: .9rem; margin-top: 1.25rem; color: #4c6266; }
@media (max-width: 639px) {
  .renewal-reading-diagram .reading-inputs,
  .knowledge-body .renewal-reading-diagram .reading-value-chain,
  .renewal-reading-diagram .reading-area-ledger > div { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .knowledge-body .renewal-reading-diagram .reading-value-chain { gap: 1.5rem; }
  .renewal-reading-diagram .reading-value-chain li + li::before { content: '↓'; top: -1.4rem; left: 0; }
}
