/*
 * legal.css — リーガル系ページ（規約・基本方針・重要事項説明書 等）のコンテンツ用スタイル
 * 固定ページ本文を .legal-content でラップし、汎用セレクタ(.legal-content h2 等)で指定する。
 * 元デザインの Tailwind 子セレクタ（[&>h2]:... 等）の値を移植。余白感は踏襲。
 * Tailwind ブレークポイント: sm=640 / md=768 / lg=1024 / xl=1280 / 2xl=1536
 */

.legal-content { display: flex; flex-direction: column; gap: 20px; }
.legal-content > * { margin: 0; }

.legal-content h2 { color: #00584c; font-size: 18px; font-weight: 700; line-height: normal; }
.legal-content > h2:first-child { text-align: center; }
.legal-content h3 { color: #00584c; font-size: 16px; font-weight: 700; line-height: normal; }
.legal-content p { color: #464646; font-size: 14px; line-height: 1.9; }
.legal-content ul,
.legal-content ol { color: #464646; font-size: 14px; line-height: 1.9; }
.legal-content strong { font-weight: 700; }
/* 末尾の署名/制定日行（下から2番目の段落）を右寄せ。構造依存のため編集時は要注意 */
.legal-content > p:nth-last-child(2) { text-align: right; }

/* 表 */
.legal-content table { width: 100%; border-collapse: collapse; border: 1px solid #00584c; margin: 20px 0; }
.legal-content th { border: 1px solid #00584c; background: #dcf3df; color: #00584c; font-size: 14px; font-weight: 700; text-align: center; padding: 8px; }
.legal-content td { border: 1px solid #00584c; color: #464646; font-size: 14px; padding: 8px; }
.legal-content hr { border: 0; border-top: 1px solid #00584c; margin: 20px 0; }

@media (min-width: 640px) {
  .legal-content { gap: 22px; }
  .legal-content h2 { font-size: 20px; }
  .legal-content h3 { font-size: 18px; }
  .legal-content p, .legal-content ul, .legal-content ol,
  .legal-content th, .legal-content td { font-size: 15px; }
  .legal-content table, .legal-content hr { margin: 22px 0; }
  .legal-content th, .legal-content td { padding: 10px; }
}
@media (min-width: 768px) {
  .legal-content { gap: 24px; }
  .legal-content h2 { font-size: 22px; }
  .legal-content h3 { font-size: 20px; }
  .legal-content table, .legal-content hr { margin: 24px 0; }
  .legal-content th, .legal-content td { padding: 12px; }
}
@media (min-width: 1024px) {
  .legal-content h2 { font-size: 26px; }
  .legal-content h3 { font-size: 24px; }
}
@media (min-width: 1280px) {
  .legal-content { gap: 32px; }
  .legal-content h2 { font-size: 35px; }
  .legal-content h3 { font-size: 32px; }
  .legal-content p, .legal-content ul, .legal-content ol,
  .legal-content th, .legal-content td { font-size: 18px; }
  .legal-content table, .legal-content hr { margin: 32px 0; }
  .legal-content th, .legal-content td { padding: 16px; }
}
@media (min-width: 1536px) {
  .legal-content { gap: 35px; }
  .legal-content h2 { font-size: 39px; }
  .legal-content h3 { font-size: 36px; }
  .legal-content p, .legal-content ul, .legal-content ol,
  .legal-content th, .legal-content td { font-size: 20px; }
  .legal-content table, .legal-content hr { margin: 35px 0; }
  .legal-content th, .legal-content td { padding: 18px; }
}