/* 公開ページ固有のレイアウト。ページ単位の構造はここに足していく */
.bm-shell {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.bm-main { flex: 1; }

/* margin-inline: auto がないと 1120px 以上で左寄りになる（法務ページの
   .bm-legal には margin: 0 auto があるのに、こちらだけ抜けていた） */
.bm-prose { max-width: var(--bm-measure); margin-inline: auto; }

.bm-stack {
  display: flex;
  flex-direction: column;
  gap: var(--bm-space-3);
}

/* 法務ページ。読むための画面なので、装飾を足さない */
.bm-legal {
  max-width: var(--bm-measure);
  margin: 0 auto;
  padding: var(--bm-space-5) var(--bm-space-3) var(--bm-space-6);
}

.bm-legal h1 { margin-bottom: var(--bm-space-4); font-size: 26px; }
.bm-legal h2 { margin: var(--bm-space-4) 0 var(--bm-space-2); font-size: 18px; }
.bm-legal h3 { font-size: 15px; }
.bm-legal p, .bm-legal li { font-size: 14px; }

.bm-legal-dl { margin: 0; font-size: 14px; }

.bm-legal-dl dt {
  padding-top: var(--bm-space-2);
  color: var(--bm-ink);
  font-weight: 700;
}

.bm-legal-dl dd {
  margin: 0 0 var(--bm-space-2);
  padding-bottom: var(--bm-space-2);
  border-bottom: 1px solid var(--bm-line);
}

@media (min-width: 768px) {
  .bm-section { padding: var(--bm-space-6) 0; }
}

@media (min-width: 1120px) {
  .bm-container { padding: 0 var(--bm-space-4); }

  /* 読み物ページは本文幅を保つ。1120px いっぱいに伸ばすと1行が長くなりすぎる */
  .bm-prose { max-width: var(--bm-measure); }

  .bm-legal { padding: var(--bm-space-6) var(--bm-space-4); }
  .bm-form { max-width: 560px; }
}