/* 実質月額ラボ：装飾は最小限。外部フォント・外部画像は使わない */
:root {
  --fg: #1d2630;
  --muted: #55606c;
  --bg: #ffffff;
  --line: #c9d1d9;
  --head: #f1f4f7;
  --accent: #0b5cad;
  --notice-bg: #fff6d6;
  --notice-line: #b58900;
  --warn: #a4261a;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  color: var(--fg);
  background: var(--bg);
  font-family: system-ui, -apple-system, "Hiragino Sans", "Yu Gothic", "Noto Sans CJK JP", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.wrap { max-width: 960px; margin: 0 auto; padding: 0 16px; }
a { color: var(--accent); }
h1 { font-size: 1.6rem; line-height: 1.4; margin: 1.2em 0 .6em; }
h2 { font-size: 1.3rem; margin: 2em 0 .6em; padding-bottom: .2em; border-bottom: 2px solid var(--line); }
h3 { font-size: 1.1rem; margin: 1.6em 0 .5em; }
hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
ul { padding-left: 1.4em; }

.site-header { border-bottom: 1px solid var(--line); background: var(--head); }
.site-header .site-name, .site-footer .site-name { font-weight: bold; font-size: 1.15rem; margin: .6em 0 0; }
.site-header .site-name a { color: var(--fg); text-decoration: none; }
nav ul { list-style: none; padding: 0; margin: .3em 0 .6em; display: flex; flex-wrap: wrap; gap: 0 14px; }
nav li { margin: 0; }
nav a { display: inline-block; padding: .25em 0; font-size: .92rem; }
nav a[aria-current="page"] { font-weight: bold; color: var(--fg); text-decoration: none; border-bottom: 2px solid var(--fg); }
.site-footer { margin-top: 3em; border-top: 1px solid var(--line); background: var(--head); padding: 1em 0 1.5em; font-size: .92rem; }
.site-footer p { margin: .2em 0; }

/* 広告表記・ページ冒頭の注記：文字の大きさと色を明瞭に（06 §2-1） */
.notice {
  background: var(--notice-bg);
  border: 2px solid var(--notice-line);
  border-radius: 4px;
  padding: .5em 1em;
  margin: 1em 0;
  font-size: 1.05rem;
  color: #3b2f00;
}
.notice p { margin: .3em 0; }

.table-wrap { overflow-x: auto; margin: 1em 0; -webkit-overflow-scrolling: touch; }
table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: .95rem; line-height: 1.55; }
th, td { border: 1px solid var(--line); padding: .45em .6em; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
th { background: var(--head); white-space: nowrap; }
td.num, th.num { text-align: right; white-space: nowrap; }

/* 計算ツール */
.toolwrap { border: 2px solid var(--line); border-radius: 6px; padding: 0 14px 14px; margin: 1.5em 0; }
fieldset { border: 1px solid var(--line); border-radius: 4px; margin: 1em 0; padding: .6em .9em .9em; min-width: 0; }
legend { font-weight: bold; padding: 0 .4em; }
fieldset.inline { border: 0; padding: .2em 0; margin: .4em 0; }
fieldset.inline legend { padding: 0; font-weight: bold; font-size: .95rem; }
label.opt { display: inline-block; margin-right: 1.2em; padding: .2em 0; }
input[type="radio"], input[type="checkbox"] { width: 1.1em; height: 1.1em; vertical-align: -.15em; }
.field { margin: .7em 0; }
.field label { display: block; font-weight: bold; font-size: .95rem; }
input[type="text"], select {
  font: inherit; width: 100%; max-width: 28em; padding: .4em .5em; border: 1px solid #8794a1; border-radius: 4px; background: #fff; color: var(--fg);
}
.hint { color: var(--muted); font-size: .88rem; margin: .2em 0; }
.err { color: var(--warn); font-size: .9rem; margin: .2em 0; min-height: 0; }
.small { font-size: .85rem; color: var(--muted); }
.strong { font-weight: bold; }
.nodata, .nodata-row td { color: var(--warn); }
.nodata-row td.num { font-weight: bold; }
.nodata { border-left: 4px solid var(--warn); padding: .3em .8em; background: #fdf0ee; }
table.calc td.num, table.compare td.num { text-align: right; white-space: nowrap; }
table.calc tr.sub td { font-weight: bold; background: var(--head); }
table.calc tr.total td { font-weight: bold; font-size: 1.05rem; background: #e8f0fa; }
.notes { margin-top: 1em; font-size: .95rem; }
.plan-name { margin: .4em 0; }

@media (max-width: 600px) {
  body { font-size: 15.5px; }
  h1 { font-size: 1.4rem; }
  .notice { font-size: 1rem; }
  label.opt { display: block; }
}