/* ============================================================
   MIRAI 確認リスト
   参照 .check-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 65px;margin:40px 0}
        .check-grid h3{font-weight:500;font-size:21px}
   記号は CSS とテキストだけで描く（SVG・アイコンフォントは本番で除去される場合がある）
   ============================================================ */
.mj-checklist {
  background-color: rgb(var(--color-background));
}

.mj-checklist__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px 65px;
  counter-reset: mj-check;
}

.mj-checklist__item {
  counter-increment: mj-check;
  min-width: 0;
}

/* 参照 .check-grid h3{font-weight:500;font-size:21px}（ゴシック） */
.mj-checklist .mj-checklist__title {
  font-family: var(--mj-font-body);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.7;
  margin: 0;
}

/* 参照 .check-grid の p は font-size 指定なし＝本文18pxを継承 */
.mj-checklist .mj-checklist__text {
  font-size: var(--mj-body-size);
  margin-block: 10px 0;
}

/* 番号。設定欄が空なら連番を自動で入れる */
.mj-checklist--number .mj-checklist__marker {
  margin-block-end: 10px;
}

.mj-checklist--number .mj-checklist__marker:empty::before {
  content: counter(mj-check, decimal-leading-zero);
}

/* チェック記号（枠線だけで描く） */
.mj-checklist--check .mj-checklist__marker {
  display: none;
}

.mj-checklist--check .mj-checklist__title {
  position: relative;
  padding-inline-start: 30px;
}

.mj-checklist--check .mj-checklist__title::before {
  content: '';
  position: absolute;
  inset-inline-start: 2px;
  inset-block-start: 0.45em;
  width: 14px;
  height: 8px;
  border-inline-start: 2px solid var(--mj-brand);
  border-block-end: 2px solid var(--mj-brand);
  transform: rotate(-45deg);
}

.mj-checklist--none .mj-checklist__marker {
  display: none;
}

.mj-checklist__link {
  display: inline-flex;
  margin-block-start: 40px;
}

/* 参照 @media(max-width:760px){.check-grid{grid-template-columns:1fr;gap:20px}} */
@media (max-width: 760px) {
  .mj-checklist__grid { grid-template-columns: 1fr; gap: 20px; }
  .mj-checklist .mj-checklist__title { font-size: 19px; }
}