/* 規約系ページ（/terms /legal）。読ませることだけを目的にした最小の体裁。
   LP の styles.css を土台に、本文の可読性だけ足す。 */

.legal {
  padding: 96px 20px 120px;
}
.legal-shell {
  max-width: 760px;
  margin: 0 auto;
  color: #16222e;
  font-size: 15px;
  line-height: 2;
}
.legal-back {
  margin: 0 0 28px;
  font-size: 14px;
}
.legal-back a {
  color: #5b7591;
  text-decoration: none;
}
.legal-back a:hover { text-decoration: underline; }

.legal-shell h1 {
  font-size: 26px;
  line-height: 1.5;
  margin: 0 0 8px;
  letter-spacing: .01em;
}
.legal-meta {
  margin: 0 0 40px;
  color: #5b7591;
  font-size: 13px;
}
.legal-shell h2 {
  font-size: 17px;
  line-height: 1.6;
  margin: 44px 0 12px;
  padding-top: 22px;
  border-top: 1px solid #e4e9ef;
}
.legal-shell h2:first-of-type { border-top: 0; padding-top: 0; }
.legal-shell p { margin: 0 0 14px; }
.legal-shell ol { margin: 0 0 14px; padding-left: 1.5em; }
.legal-shell ol > li { margin-bottom: 10px; }
.legal-shell strong { font-weight: 700; }
.legal-shell a { color: #09365a; }

/* 表は横に溢れさせない。狭い画面ではこの中だけ横スクロールする。 */
.legal-table-wrap {
  overflow-x: auto;
  margin: 0 0 20px;
  -webkit-overflow-scrolling: touch;
}
.legal-shell table {
  border-collapse: collapse;
  width: 100%;
  min-width: 420px;
  font-size: 14px;
}
.legal-shell th,
.legal-shell td {
  border: 1px solid #e4e9ef;
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
  line-height: 1.9;
}
.legal-shell thead th { background: #f4f6f8; white-space: nowrap; }
.legal-def th {
  background: #f4f6f8;
  width: 210px;
  font-weight: 600;
}

@media (max-width: 640px) {
  .legal { padding: 72px 16px 88px; }
  .legal-shell { font-size: 14.5px; line-height: 1.95; }
  .legal-shell h1 { font-size: 22px; }
  .legal-def th { width: auto; }
}