@charset "UTF-8";

/* ========================================
   Bootstrap 3 向けマージンユーティリティ
   Bootstrap 5 の命令文を再現
   ======================================== */

/* スケール設定（Bootstrap 5相当） */
:root {
    --bs-spacer: 1rem;
    /* base 16px */
    --bs-spacer-0: 0;
    --bs-spacer-1: calc(var(--bs-spacer) * 0.25);
    /* 4px */
    --bs-spacer-2: calc(var(--bs-spacer) * 0.5);
    /* 8px */
    --bs-spacer-3: var(--bs-spacer);
    /* 16px */
    --bs-spacer-4: calc(var(--bs-spacer) * 1.5);
    /* 24px */
    --bs-spacer-5: calc(var(--bs-spacer) * 3);
    /* 48px */
}

/* 共通マージン (all sides) */
.m-0 {
    margin: var(--bs-spacer-0) !important;
}

.m-1 {
    margin: var(--bs-spacer-1) !important;
}

.m-2 {
    margin: var(--bs-spacer-2) !important;
}

.m-3 {
    margin: var(--bs-spacer-3) !important;
}

.m-4 {
    margin: var(--bs-spacer-4) !important;
}

.m-5 {
    margin: var(--bs-spacer-5) !important;
}

/* 個別方向 */
.mt-0 {
    margin-top: var(--bs-spacer-0) !important;
}

.mt-1 {
    margin-top: var(--bs-spacer-1) !important;
}

.mt-2 {
    margin-top: var(--bs-spacer-2) !important;
}

.mt-3 {
    margin-top: var(--bs-spacer-3) !important;
}

.mt-4 {
    margin-top: var(--bs-spacer-4) !important;
}

.mt-5 {
    margin-top: var(--bs-spacer-5) !important;
}

.mb-0 {
    margin-bottom: var(--bs-spacer-0) !important;
}

.mb-1 {
    margin-bottom: var(--bs-spacer-1) !important;
}

.mb-2 {
    margin-bottom: var(--bs-spacer-2) !important;
}

.mb-3 {
    margin-bottom: var(--bs-spacer-3) !important;
}

.mb-4 {
    margin-bottom: var(--bs-spacer-4) !important;
}

.mb-5 {
    margin-bottom: var(--bs-spacer-5) !important;
}

.ms-0 {
    margin-left: var(--bs-spacer-0) !important;
}

.ms-1 {
    margin-left: var(--bs-spacer-1) !important;
}

.ms-2 {
    margin-left: var(--bs-spacer-2) !important;
}

.ms-3 {
    margin-left: var(--bs-spacer-3) !important;
}

.ms-4 {
    margin-left: var(--bs-spacer-4) !important;
}

.ms-5 {
    margin-left: var(--bs-spacer-5) !important;
}

.me-0 {
    margin-right: var(--bs-spacer-0) !important;
}

.me-1 {
    margin-right: var(--bs-spacer-1) !important;
}

.me-2 {
    margin-right: var(--bs-spacer-2) !important;
}

.me-3 {
    margin-right: var(--bs-spacer-3) !important;
}

.me-4 {
    margin-right: var(--bs-spacer-4) !important;
}

.me-5 {
    margin-right: var(--bs-spacer-5) !important;
}

/* 上下・左右セット */
.mx-0 {
    margin-left: var(--bs-spacer-0) !important;
    margin-right: var(--bs-spacer-0) !important;
}

.mx-1 {
    margin-left: var(--bs-spacer-1) !important;
    margin-right: var(--bs-spacer-1) !important;
}

.mx-2 {
    margin-left: var(--bs-spacer-2) !important;
    margin-right: var(--bs-spacer-2) !important;
}

.mx-3 {
    margin-left: var(--bs-spacer-3) !important;
    margin-right: var(--bs-spacer-3) !important;
}

.mx-4 {
    margin-left: var(--bs-spacer-4) !important;
    margin-right: var(--bs-spacer-4) !important;
}

.mx-5 {
    margin-left: var(--bs-spacer-5) !important;
    margin-right: var(--bs-spacer-5) !important;
}

.my-0 {
    margin-top: var(--bs-spacer-0) !important;
    margin-bottom: var(--bs-spacer-0) !important;
}

.my-1 {
    margin-top: var(--bs-spacer-1) !important;
    margin-bottom: var(--bs-spacer-1) !important;
}

.my-2 {
    margin-top: var(--bs-spacer-2) !important;
    margin-bottom: var(--bs-spacer-2) !important;
}

.my-3 {
    margin-top: var(--bs-spacer-3) !important;
    margin-bottom: var(--bs-spacer-3) !important;
}

.my-4 {
    margin-top: var(--bs-spacer-4) !important;
    margin-bottom: var(--bs-spacer-4) !important;
}

.my-5 {
    margin-top: var(--bs-spacer-5) !important;
    margin-bottom: var(--bs-spacer-5) !important;
}

/* 自動マージン (中央寄せ) */
.m-auto {
    margin: auto !important;
}

.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

/* ========================================
   Bootstrap 3 向け画像ユーティリティ
   Bootstrap 5 命令文を再現
   ======================================== */

/* 画像のリサイズ（レスポンシブ対応） */
.img-fluid {
    max-width: 100%;
    height: auto;
    display: block;
}

/* サムネイル風枠線 */
.img-thumbnail {
    padding: 0.25rem;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    max-width: 100%;
    height: auto;
}

/* 丸みを帯びた角 */
.rounded {
    border-radius: 0.25rem !important;
}

.rounded-0 {
    border-radius: 0 !important;
}

.rounded-circle {
    border-radius: 50% !important;
}

.rounded-pill {
    border-radius: 50rem !important;
}

/* 配置制御 */
.float-start {
    float: left !important;
}

.float-end {
    float: right !important;
}

.float-none {
    float: none !important;
}

/* 画像中央寄せ（inline-block対応） */
.d-block {
    display: block !important;
}

.d-inline {
    display: inline !important;
}

.d-inline-block {
    display: inline-block !important;
}

/* ブロック画像を中央寄せする */
.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}

/* 影付きスタイル */
.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

.shadow {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
}

.shadow-none {
    box-shadow: none !important;
}

/* オブジェクトフィット */
.object-fit-cover {
    object-fit: cover !important;
}

.object-fit-contain {
    object-fit: contain !important;
}

/* 画像の枠調整 */
.img-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.img-contain {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* カラム幅に合わせる */
.img-fit {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

/* 原寸優先（大きい時だけ縮む） */
.img-natural {
    display: block;
    max-width: 100%;
    height: auto;
}

/*　テキスト　*/
.text-color-black-semi {
    color: #4b4e53 !important;
}