@charset "UTF-8";

/* =========================================================
  Bootstrap Fallback (minimal)
  - CDNが読み込めない環境でも、今回のページが崩れない程度の
    container / grid / utilities だけを再現しています。
  - Bootstrap本体が読み込まれた場合は、そちらが上書きされます。
========================================================= */

/* Container */
.container{
  width: 100%;
  padding-right: 12px;
  padding-left: 12px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px){ .container{ max-width: 540px; } }
@media (min-width: 768px){ .container{ max-width: 720px; } }
@media (min-width: 992px){ .container{ max-width: 960px; } }
@media (min-width: 1200px){ .container{ max-width: 1140px; } }
@media (min-width: 1400px){ .container{ max-width: 1320px; } }

/* Grid */
.row{
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display:flex;
  flex-wrap:wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row > *{
  box-sizing:border-box;
  flex-shrink:0;
  width:100%;
  max-width:100%;
  padding-right: calc(.5 * var(--bs-gutter-x));
  padding-left: calc(.5 * var(--bs-gutter-x));
  margin-top: var(--bs-gutter-y);
}

.g-3{ --bs-gutter-x: 1rem; --bs-gutter-y: 1rem; }
.g-4{ --bs-gutter-x: 1.5rem; --bs-gutter-y: 1.5rem; }

.col-12{ flex: 0 0 auto; width:100%; }

@media (min-width: 768px){
  .col-md-6{ flex: 0 0 auto; width: 50%; }
}

@media (min-width: 992px){
  .col-lg-4{ flex: 0 0 auto; width: 33.3333333%; }
  .col-lg-6{ flex: 0 0 auto; width: 50%; }
  .col-lg-8{ flex: 0 0 auto; width: 66.6666667%; }
}

/* Alignment */
.align-items-center{ align-items:center !important; }

/* Display utilities */
.d-none{ display:none !important; }
@media (min-width: 992px){
  .d-lg-inline{ display:inline !important; }
}

/* Spacing utilities (必要なものだけ) */
.py-4{ padding-top:1.5rem !important; padding-bottom:1.5rem !important; }
.py-5{ padding-top:3rem !important; padding-bottom:3rem !important; }
.pb-5{ padding-bottom:3rem !important; }
.mt-5{ margin-top:3rem !important; }

/* Text utilities */
.text-center{ text-align:center !important; }
.text-muted{ color:#6c757d !important; }
@media (min-width: 992px){
  .text-lg-end{ text-align:right !important; }
}

/* Image */
.img-fluid{ max-width:100%; height:auto; }

/* Misc */
.small{ font-size:0.875em; }

.mb-2{ margin-bottom:.5rem !important; }