/* ---------------------------------------------------------
   投稿ページ用の簡易ユーティリティ（Bootstrap 風スケール）
   - 主に .p-post__body 内でのレイアウト調整に使用
   - margin/padding は 0.25rem 刻み（1=0.25rem, 2=0.5rem, 3=1rem, 4=1.5rem, 5=3rem）
   - なるべく記事専用クラス（例: .post-2026-01-09 .hoge { ... }）と併用してください
--------------------------------------------------------- */
.mt-0 {
  margin-top: 0 !important;
}
.mt-1 {
  margin-top: 0.25rem !important;
}
.mt-2 {
  margin-top: 0.5rem !important;
}
.mt-3 {
  margin-top: 1rem !important;
}
.mt-4 {
  margin-top: 1.5rem !important;
}
.mt-5 {
  margin-top: 3rem !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}
.mb-1 {
  margin-bottom: 0.25rem !important;
}
.mb-2 {
  margin-bottom: 0.5rem !important;
}
.mb-3 {
  margin-bottom: 1rem !important;
}
.mb-4 {
  margin-bottom: 1.5rem !important;
}
.mb-5 {
  margin-bottom: 3rem !important;
}

.pt-0 {
  padding-top: 0 !important;
}
.pt-1 {
  padding-top: 0.25rem !important;
}
.pt-2 {
  padding-top: 0.5rem !important;
}
.pt-3 {
  padding-top: 1rem !important;
}
.pt-4 {
  padding-top: 1.5rem !important;
}
.pt-5 {
  padding-top: 3rem !important;
}

.pb-0 {
  padding-bottom: 0 !important;
}
.pb-1 {
  padding-bottom: 0.25rem !important;
}
.pb-2 {
  padding-bottom: 0.5rem !important;
}
.pb-3 {
  padding-bottom: 1rem !important;
}
.pb-4 {
  padding-bottom: 1.5rem !important;
}
.pb-5 {
  padding-bottom: 3rem !important;
}

.text-start {
  text-align: left !important;
}
.text-center {
  text-align: center !important;
}
.text-end {
  text-align: right !important;
}

.fw-bold {
  font-weight: 700 !important;
}
.fw-normal {
  font-weight: 400 !important;
}

.w-100 {
  width: 100% !important;
}

/* --------------------------------------------------------- */
.p-post__body p + * {
  margin-top: 3em;
}
.p-post__body img.rounded {
  border-radius: 20px;
}
.p-post__body .img_2col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3em;
}
.p-post__body .img_2col + * {
  margin-top: 3em;
}
@media (max-width: 576px) {
  .p-post__body p + * {
    margin-top: 2em;
  }
  .p-post__body .img_2col {
    grid-template-columns: auto;
    gap: 2em;
  }
  .p-post__body .img_2col + * {
    margin-top: 2em;
  }
}