/*!
 * bootstrap.custom.compat.css
 * MZ: Bootstrap 5.0.0-alpha1 → 5.0.0 クラス名互換シム
 *
 * 用途: 他メディア(5.0.0)で使われる新クラス名を、MZのalpha1環境でも動くようにする
 * 読込位置: bootstrap.custom.css の直後(本体は無改修)
 * 対象外:  data-* 属性 / .close / JSプラグインはCSSで救えないため触らない(alpha1 JS据え置き)
 * spacer:  bootstrap.custom.css のMZ独自スケールに準拠
 *          (1=.5rem 2=1rem 3=2rem 4=3rem 5=4rem 6=5rem 7=7rem)
 * breakpoint: 同上 (sm=481px md=769px)
 */

/* ===== margin: ml-* → ms-* / mr-* → me-* ===== */
.ms-0 { margin-left: 0 !important; }
.ms-1 { margin-left: 0.5rem !important; }
.ms-2 { margin-left: 1rem !important; }
.ms-3 { margin-left: 2rem !important; }
.ms-4 { margin-left: 3rem !important; }
.ms-5 { margin-left: 4rem !important; }
.ms-6 { margin-left: 5rem !important; }
.ms-7 { margin-left: 7rem !important; }
.ms-auto { margin-left: auto !important; }

.me-0 { margin-right: 0 !important; }
.me-1 { margin-right: 0.5rem !important; }
.me-2 { margin-right: 1rem !important; }
.me-3 { margin-right: 2rem !important; }
.me-4 { margin-right: 3rem !important; }
.me-5 { margin-right: 4rem !important; }
.me-6 { margin-right: 5rem !important; }
.me-7 { margin-right: 7rem !important; }
.me-auto { margin-right: auto !important; }

/* ===== padding: pl-* → ps-* / pr-* → pe-* (数字付きのみ。pe-none/pe-autoとは非衝突) ===== */
.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: 0.5rem !important; }
.ps-2 { padding-left: 1rem !important; }
.ps-3 { padding-left: 2rem !important; }
.ps-4 { padding-left: 3rem !important; }
.ps-5 { padding-left: 4rem !important; }
.ps-6 { padding-left: 5rem !important; }
.ps-7 { padding-left: 7rem !important; }

.pe-0 { padding-right: 0 !important; }
.pe-1 { padding-right: 0.5rem !important; }
.pe-2 { padding-right: 1rem !important; }
.pe-3 { padding-right: 2rem !important; }
.pe-4 { padding-right: 3rem !important; }
.pe-5 { padding-right: 4rem !important; }
.pe-6 { padding-right: 5rem !important; }
.pe-7 { padding-right: 7rem !important; }

/* ===== text-align: text-left → text-start / text-right → text-end ===== */
.text-start { text-align: left  !important; }
.text-end   { text-align: right !important; }

/* ===== float: float-left → float-start / float-right → float-end ===== */
.float-start { float: left  !important; }
.float-end   { float: right !important; }

/* ===== border: border-right → border-end / border-left → border-start ===== */
.border-end     { border-right: 1px solid #e5e5e5 !important; }
.border-end-0   { border-right: 0 !important; }
.border-start   { border-left: 1px solid #e5e5e5 !important; }
.border-start-0 { border-left: 0 !important; }

/* ===== rounded: rounded-right → rounded-end / rounded-left → rounded-start ===== */
.rounded-end {
  border-top-right-radius: 0.25rem !important;
  border-bottom-right-radius: 0.25rem !important; }
.rounded-start {
  border-bottom-left-radius: 0.25rem !important;
  border-top-left-radius: 0.25rem !important; }

/* ===== responsive 方向クラス (grep実測: mr-sm-3 / ml-md-3 / mr-md-3 のみ使用。対で補完) ===== */
@media (min-width: 481px) { /* sm */
  .ms-sm-3 { margin-left: 2rem !important; }
  .me-sm-3 { margin-right: 2rem !important; }
}
@media (min-width: 769px) { /* md */
  .ms-md-3 { margin-left: 2rem !important; }
  .me-md-3 { margin-right: 2rem !important; }
}