.msd-ba { display: grid; gap: 16px; }
.msd-ba__pair { display: grid; gap: 8px; }
.msd-ba__place { font-weight: 700; }
.msd-ba__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.msd-ba__label { font-weight: 700; margin:0;}
/* .msd-ba__caption { line-height: 1.6; } */

 /* 通常2カラム想定（例） */
.msd-ba__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.msd-ba__before img,
.msd-ba__after  img {
  display: block;
  width: 100%;
  height: auto;
}
/* 1カラム（Afterのみ）のとき */
.msd-ba__pair--single .msd-ba__grid,
.msd-ba__grid--single {
  display: block;              /* または grid にして 1fr だけでもOK */
}
.msd-ba__pair--single .msd-ba__after img {
  width: 100%;
  height: auto;
  display: block;
}
/* 余白や見出しを少し強調（任意） */
/* .msd-ba__pair--single .msd-ba__label {
  margin-bottom: .5rem;
} */
/* Before ラベルの背景色 */
.msd-ba__label.before-label {
  background-color:#d9534f;/* お好みの色に */
  color: #fff;
}
/* After ラベルの背景色 */
.msd-ba__label.after-label {
  background-color: #337ab7; /* 例: 緑系 */
  color: #fff;
}
/* 角丸やパディングなど整える場合 */
.msd-ba__label {
  padding:0.5rem 0;
  /* border-radius: 4px; */
  display:inline-block;
  font-weight:bold;
  width:100%;
  text-align:center;
}

.msd-ba__place{border:solid 1px #CCC;padding:0.5rem 0;margin-bottom:1rem;}
.msd-ba__place .msd-ba__place-tit{background-color:#f4f4e6;padding:0.5rem;margin-right:1rem;}