/* 記事で使う表と計算の箱（blog.css の色に合わせる） */
.article-table-wrap{margin:26px 0 34px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.article-table{width:100%;min-width:480px;border-collapse:collapse;border-top:2px solid var(--ink);font-size:13px;line-height:1.7}
.article-table caption{padding:0 0 10px;color:var(--orange);font-size:12px;font-weight:700;text-align:left;letter-spacing:.04em}
.article-table th,.article-table td{padding:13px 14px;border-bottom:1px solid #e2d6cb;text-align:left;vertical-align:top}
.article-table thead th{background:#f7f1eb;color:#4a413b;font-size:11px;font-weight:700;letter-spacing:.04em;white-space:nowrap}
.article-table td.num,.article-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.article-table tbody th{font-weight:600;color:var(--ink)}
.article-table small{display:block;color:#8a7d73;font-size:11px}
.article-table tfoot td,.article-table tfoot th{border-bottom:0;border-top:1px solid var(--ink);background:#fff3ee;font-weight:700}
.article-table tfoot .num{color:var(--orange);font-size:17px}
.article-total{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:8px 0 30px;padding:22px 26px;background:var(--ink);color:#fff}
.article-total span{font-size:12px;letter-spacing:.06em;color:#e7dbd2}
.article-total strong{font:400 clamp(30px,4vw,44px)/1 var(--serif);color:#fff}
.article-total strong small{margin-left:6px;font:600 12px var(--sans);color:#e7dbd2}
.article-calc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 32px}
.article-calc div{padding:22px 18px;border:1px solid #e2d4ca;background:#fff;text-align:center}
.article-calc div.is-main{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange)}
.article-calc span{display:block;color:#7a6d64;font-size:11px;line-height:1.6}
.article-calc strong{display:block;margin-top:8px;font:400 40px/1 var(--serif);color:var(--orange)}
.article-calc strong small{margin-left:3px;font:600 13px var(--sans);color:var(--ink)}
.article-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 30px}
.article-results div{padding:24px 16px;background:#f7f1eb;text-align:center}
.article-results span{display:block;color:#6f645c;font-size:11px}
.article-results strong{display:block;margin-top:8px;font-size:22px;line-height:1.4}
.article-results strong em{color:var(--orange);font-style:normal}
@media(max-width:800px){
  .article-table{font-size:12px}
  .article-total{padding:18px 20px}
  .article-calc,.article-results{grid-template-columns:1fr;gap:10px}
  .article-calc div{display:flex;align-items:baseline;justify-content:space-between;padding:16px 18px;text-align:left}
  .article-calc strong{margin-top:0;font-size:34px}
  .article-results div{display:flex;align-items:baseline;justify-content:space-between;padding:16px 18px;text-align:left}
  .article-results strong{margin-top:0;font-size:19px}
}
.article-table.is-2col{min-width:0}
@media(max-width:800px){
  .article-table.is-stack{min-width:0}
  .article-table.is-stack thead{display:none}
  .article-table.is-stack tr{display:block;padding:14px 0;border-bottom:1px solid #e2d6cb}
  .article-table.is-stack tbody th,.article-table.is-stack td{display:flex;justify-content:space-between;gap:12px;padding:3px 4px;border:0;text-align:left}
  .article-table.is-stack tbody th{display:block;padding-bottom:8px}
  .article-table.is-stack td:before{content:attr(data-label);color:#7a6d64;font-size:11px}
}
.article-table td.is-strong{color:var(--orange);font-weight:700}
