@charset "UTF-8";

.legal-header {
  background: var(--green-deep);
  padding: 18px 0;
}
.legal-header .header-inner { padding-top: 0; padding-bottom: 0; }

.legal {
  max-width: 860px;
  margin: 0 auto;
  padding: 46px 28px 80px;
}
.legal .back {
  display: inline-block; margin-bottom: 22px;
  color: var(--green); font-size: 0.85rem;
}
.legal .back:hover { text-decoration: underline; }
.legal h1 {
  font-size: 1.5rem; color: var(--green-dark);
  padding-bottom: 14px; margin-bottom: 8px;
  border-bottom: 2px solid var(--green-dark);
}
.legal .lead { font-size: 0.85rem; color: var(--text-light); margin-bottom: 30px; }

.legal h2 {
  font-size: 1.05rem; color: var(--green-dark);
  margin: 34px 0 12px; padding: 7px 14px;
  background: #eef4ee; border-left: 4px solid var(--green-dark);
  border-radius: 0;
}
.legal h3 { font-size: 0.92rem; margin: 22px 0 8px; color: #2a2a2a; }
.legal p { font-size: 0.83rem; line-height: 1.95; margin-bottom: 10px; }
.legal ol, .legal ul { margin: 0 0 12px; padding-left: 1.6em; }
.legal ol { list-style: decimal; }
.legal ul { list-style: none; padding-left: 1.2em; }
.legal li { font-size: 0.83rem; line-height: 1.95; margin-bottom: 6px; }
.legal .note {
  font-size: 0.76rem; color: var(--text-light);
  background: #f6f7f5; border-radius: 5px; padding: 10px 14px; margin: 10px 0 14px;
}
.legal .formula {
  background: #f4f7f2; border: 1px solid #dfe6de; border-radius: 5px;
  padding: 10px 14px; font-size: 0.82rem; margin: 10px 0;
}

table.legal-table { width: 100%; border-collapse: collapse; margin-top: 18px; }
table.legal-table th, table.legal-table td {
  text-align: left; padding: 13px 14px;
  border-bottom: 1px solid #e6e9e5; vertical-align: top;
  font-size: 0.83rem; line-height: 1.9;
}
table.legal-table th {
  width: 32%; color: var(--green-dark); font-weight: bold; background: #f7faf5;
}
td.todo {
  background: #fff8e6;
  color: #8a5a12;
}
td.todo::after {
  content: " ← 要記入";
  font-size: 0.7rem; color: #a8342a; font-weight: bold;
}

.legal-footer {
  background: var(--green-deep); color: #cfdcd3;
  text-align: center; padding: 20px; font-size: 0.68rem;
}
.legal-footer a { text-decoration: underline; opacity: .85; }

@media (max-width: 700px) {
  .legal { padding: 32px 20px 60px; }
  table.legal-table th, table.legal-table td { display: block; width: 100%; border-bottom: none; }
  table.legal-table td { border-bottom: 1px solid #e6e9e5; padding-top: 6px; }
}