@charset "UTF-8";



/* ====================================
   フォントサイズ
==================================== */
.fs-10 { font-size: 10px !important; }
.fs-12 { font-size: 12px !important; }
.fs-14 { font-size: 14px !important; }
.fs-15 { font-size: 15px !important; }
.fs-16 { font-size: 16px !important; }
.fs-18 { font-size: 18px !important; }
.fs-20 { font-size: 20px !important; }
.fs-22 { font-size: 22px !important; }
.fs-24 { font-size: 24px !important; }
.fs-26 { font-size: 26px !important; }
.fs-28 { font-size: 28px !important; }
.fs-30 { font-size: 30px !important; }
.fs-32 { font-size: 32px !important; }
.fs-36 { font-size: 36px !important; }
.fs-40 { font-size: 40px !important; }
.fs-48 { font-size: 48px !important; }
.fs-56 { font-size: 56px !important; }
.fs-64 { font-size: 64px !important; }

/* ====================================
   マージン（上）
==================================== */
.mt-0 { margin-top: 0px !important; }
.mt-5 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-15 { margin-top: 15px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-25 { margin-top: 25px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-60 { margin-top: 60px !important; }
.mt-70 { margin-top: 70px !important; }
.mt-80 { margin-top: 80px !important; }
.mt-90 { margin-top: 90px !important; }
.mt-100 { margin-top: 100px !important; }

/* ====================================
   マージン（下）
==================================== */
.mb-0 { margin-bottom: 0px !important; }
.mb-5 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-15 { margin-bottom: 15px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-25 { margin-bottom: 25px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }
.mb-60 { margin-bottom: 60px !important; }
.mb-70 { margin-bottom: 70px !important; }
.mb-80 { margin-bottom: 80px !important; }
.mb-90 { margin-bottom: 90px !important; }
.mb-100 { margin-bottom: 100px !important; }

/* ====================================
   マージン（左）
==================================== */
.ml-0 { margin-left: 0px !important; }
.ml-5 { margin-left: 5px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-15 { margin-left: 15px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-25 { margin-left: 25px !important; }
.ml-30 { margin-left: 30px !important; }
.ml-40 { margin-left: 40px !important; }
.ml-50 { margin-left: 50px !important; }
.ml-60 { margin-left: 60px !important; }
.ml-70 { margin-left: 70px !important; }
.ml-80 { margin-left: 80px !important; }
.ml-90 { margin-left: 90px !important; }
.ml-100 { margin-left: 100px !important; }

/* ====================================
   マージン（右）
==================================== */
.mr-0 { margin-right: 0px !important; }
.mr-5 { margin-right: 5px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-15 { margin-right: 15px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-25 { margin-right: 25px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }
.mr-50 { margin-right: 50px !important; }
.mr-60 { margin-right: 60px !important; }
.mr-70 { margin-right: 70px !important; }
.mr-80 { margin-right: 80px !important; }
.mr-90 { margin-right: 90px !important; }
.mr-100 { margin-right: 100px !important; }

/* ====================================
   マージン（左右）
==================================== */
.mx-0 { margin-left: 0px !important; margin-right: 0px !important; }
.mx-5 { margin-left: 5px !important; margin-right: 5px !important; }
.mx-10 { margin-left: 10px !important; margin-right: 10px !important; }
.mx-15 { margin-left: 15px !important; margin-right: 15px !important; }
.mx-20 { margin-left: 20px !important; margin-right: 20px !important; }
.mx-25 { margin-left: 25px !important; margin-right: 25px !important; }
.mx-30 { margin-left: 30px !important; margin-right: 30px !important; }
.mx-40 { margin-left: 40px !important; margin-right: 40px !important; }
.mx-50 { margin-left: 50px !important; margin-right: 50px !important; }
.mx-60 { margin-left: 60px !important; margin-right: 60px !important; }
.mx-70 { margin-left: 70px !important; margin-right: 70px !important; }
.mx-80 { margin-left: 80px !important; margin-right: 80px !important; }
.mx-90 { margin-left: 90px !important; margin-right: 90px !important; }
.mx-100 { margin-left: 100px !important; margin-right: 100px !important; }

/* ====================================
   マージン（上下）
==================================== */
.my-0 { margin-top: 0px !important; margin-bottom: 0px !important; }
.my-5 { margin-top: 5px !important; margin-bottom: 5px !important; }
.my-10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.my-15 { margin-top: 15px !important; margin-bottom: 15px !important; }
.my-20 { margin-top: 20px !important; margin-bottom: 20px !important; }
.my-25 { margin-top: 25px !important; margin-bottom: 25px !important; }
.my-30 { margin-top: 30px !important; margin-bottom: 30px !important; }
.my-40 { margin-top: 40px !important; margin-bottom: 40px !important; }
.my-50 { margin-top: 50px !important; margin-bottom: 50px !important; }
.my-60 { margin-top: 60px !important; margin-bottom: 60px !important; }
.my-70 { margin-top: 70px !important; margin-bottom: 70px !important; }
.my-80 { margin-top: 80px !important; margin-bottom: 80px !important; }
.my-90 { margin-top: 90px !important; margin-bottom: 90px !important; }
.my-100 { margin-top: 100px !important; margin-bottom: 100px !important; }

/* ====================================
   パディング（上）
==================================== */
.pt-0 { padding-top: 0px !important; }
.pt-5 { padding-top: 5px !important; }
.pt-10 { padding-top: 10px !important; }
.pt-15 { padding-top: 15px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-25 { padding-top: 25px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }
.pt-60 { padding-top: 60px !important; }
.pt-70 { padding-top: 70px !important; }
.pt-80 { padding-top: 80px !important; }
.pt-90 { padding-top: 90px !important; }
.pt-100 { padding-top: 100px !important; }

/* ====================================
   パディング（下）
==================================== */
.pb-0 { padding-bottom: 0px !important; }
.pb-5 { padding-bottom: 5px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-15 { padding-bottom: 15px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-25 { padding-bottom: 25px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }
.pb-50 { padding-bottom: 50px !important; }
.pb-60 { padding-bottom: 60px !important; }
.pb-70 { padding-bottom: 70px !important; }
.pb-80 { padding-bottom: 80px !important; }
.pb-90 { padding-bottom: 90px !important; }
.pb-100 { padding-bottom: 100px !important; }

/* ====================================
   パディング（左）
==================================== */
.pl-0 { padding-left: 0px !important; }
.pl-5 { padding-left: 5px !important; }
.pl-10 { padding-left: 10px !important; }
.pl-15 { padding-left: 15px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-25 { padding-left: 25px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }
.pl-50 { padding-left: 50px !important; }
.pl-60 { padding-left: 60px !important; }
.pl-70 { padding-left: 70px !important; }
.pl-80 { padding-left: 80px !important; }
.pl-90 { padding-left: 90px !important; }
.pl-100 { padding-left: 100px !important; }

/* ====================================
   パディング（右）
==================================== */
.pr-0 { padding-right: 0px !important; }
.pr-5 { padding-right: 5px !important; }
.pr-10 { padding-right: 10px !important; }
.pr-15 { padding-right: 15px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-25 { padding-right: 25px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }
.pr-50 { padding-right: 50px !important; }
.pr-60 { padding-right: 60px !important; }
.pr-70 { padding-right: 70px !important; }
.pr-80 { padding-right: 80px !important; }
.pr-90 { padding-right: 90px !important; }
.pr-100 { padding-right: 100px !important; }

/* ====================================
   パディング（左右）
==================================== */
.px-0 { padding-left: 0px !important; padding-right: 0px !important; }
.px-5 { padding-left: 5px !important; padding-right: 5px !important; }
.px-10 { padding-left: 10px !important; padding-right: 10px !important; }
.px-15 { padding-left: 15px !important; padding-right: 15px !important; }
.px-20 { padding-left: 20px !important; padding-right: 20px !important; }
.px-25 { padding-left: 25px !important; padding-right: 25px !important; }
.px-30 { padding-left: 30px !important; padding-right: 30px !important; }
.px-40 { padding-left: 40px !important; padding-right: 40px !important; }
.px-50 { padding-left: 50px !important; padding-right: 50px !important; }
.px-60 { padding-left: 60px !important; padding-right: 60px !important; }
.px-70 { padding-left: 70px !important; padding-right: 70px !important; }
.px-80 { padding-left: 80px !important; padding-right: 80px !important; }
.px-90 { padding-left: 90px !important; padding-right: 90px !important; }
.px-100 { padding-left: 100px !important; padding-right: 100px !important; }

/* ====================================
   パディング（上下）
==================================== */
.py-0 { padding-top: 0px !important; padding-bottom: 0px !important; }
.py-5 { padding-top: 5px !important; padding-bottom: 5px !important; }
.py-10 { padding-top: 10px !important; padding-bottom: 10px !important; }
.py-15 { padding-top: 15px !important; padding-bottom: 15px !important; }
.py-20 { padding-top: 20px !important; padding-bottom: 20px !important; }
.py-25 { padding-top: 25px !important; padding-bottom: 25px !important; }
.py-30 { padding-top: 30px !important; padding-bottom: 30px !important; }
.py-40 { padding-top: 40px !important; padding-bottom: 40px !important; }
.py-50 { padding-top: 50px !important; padding-bottom: 50px !important; }
.py-60 { padding-top: 60px !important; padding-bottom: 60px !important; }
.py-70 { padding-top: 70px !important; padding-bottom: 70px !important; }
.py-80 { padding-top: 80px !important; padding-bottom: 80px !important; }
.py-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
.py-100 { padding-top: 100px !important; padding-bottom: 100px !important; }

/* ====================================
   テキスト揃え
==================================== */
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.text-justify { text-align: justify !important; }

/* ====================================
   フォントウェイト
==================================== */
.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }
.fw-900 { font-weight: 900 !important; }
.fw-normal { font-weight: normal !important; }
.fw-bold { font-weight: bold !important; }

/* ====================================
   行間（line-height）
==================================== */
.lh-10 { line-height: 1.0 !important; }
.lh-12 { line-height: 1.2 !important; }
.lh-14 { line-height: 1.4 !important; }
.lh-15 { line-height: 1.5 !important; }
.lh-16 { line-height: 1.6 !important; }
.lh-17 { line-height: 1.7 !important; }
.lh-18 { line-height: 1.8 !important; }
.lh-19 { line-height: 1.9 !important; }
.lh-20 { line-height: 2.0 !important; }
.lh-25 { line-height: 2.5 !important; }
.lh-30 { line-height: 3.0 !important; }

/* ====================================
   文字間隔（letter-spacing）
==================================== */
.ls-0 { letter-spacing: 0 !important; }
.ls-001 { letter-spacing: 0.01em !important; }
.ls-002 { letter-spacing: 0.02em !important; }
.ls-003 { letter-spacing: 0.03em !important; }
.ls-004 { letter-spacing: 0.04em !important; }
.ls-005 { letter-spacing: 0.05em !important; }
.ls-006 { letter-spacing: 0.06em !important; }
.ls-007 { letter-spacing: 0.07em !important; }
.ls-008 { letter-spacing: 0.08em !important; }
.ls-009 { letter-spacing: 0.09em !important; }
.ls-01 { letter-spacing: 0.1em !important; }
.ls-015 { letter-spacing: 0.15em !important; }
.ls-02 { letter-spacing: 0.2em !important; }
.ls-025 { letter-spacing: 0.25em !important; }
.ls-03 { letter-spacing: 0.3em !important; }
.ls-n001 { letter-spacing: -0.01em !important; }
.ls-n002 { letter-spacing: -0.02em !important; }
.ls-n003 { letter-spacing: -0.03em !important; }
.ls-n005 { letter-spacing: -0.05em !important; }

/* ====================================
   表示・非表示
==================================== */
/* .d-none { display: none !important; }
.d-block { display: block !important; }
.d-inline { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-flex { display: flex !important; }
.d-inline-flex { display: inline-flex !important; } */

/* ====================================
   Border Radius
==================================== */
.radius-5 { border-radius: 5px !important; }
.radius-8 { border-radius: 5px !important; }
.radius-10 { border-radius: 10px !important; }
.radius-12 { border-radius: 12px !important; }
.radius-15 { border-radius: 15px !important; }

/* ====================================
   その他汎用クラス
==================================== */
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }
.mw-100 { max-width: 100% !important; }
.mh-100 { max-height: 100% !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; }

.position-relative { position: relative !important; }
.position-absolute { position: absolute !important; }
.position-fixed { position: fixed !important; }
.position-sticky { position: sticky !important; }

.overflow-hidden { overflow: hidden !important; }
.overflow-auto { overflow: auto !important; }
.overflow-scroll { overflow: scroll !important; }

/* ====================================
   テキストカラー
==================================== */
.text-primary { color: #2A3F50 !important; }
.text-white { color: #ffffff !important; }
.text-dark { color: #333333 !important; }
.text-muted { color: #6c757d !important; }
.text-light-gray { color: #999999 !important; }
.text-danger { color: #dc3545 !important; }
.text-success { color: #28a745 !important; }
.text-info { color: #17a2b8 !important; }
.text-warning { color: #ffc107 !important; }
.text-light-gray2{ color: #d2d8dc !important;}
.text-navy2{ color: #1e3c50 !important;}

/* ====================================
   パンくずリスト
==================================== */
.breadcrumb-item+.breadcrumb-item::before {
    content: '' !important;
}

/* ====================================
   ネガティブマージン（左右）vw単位
==================================== */
/* 左右両方 */
.mx-n1 { margin-left: -1vw !important; margin-right: -1vw !important; }
.mx-n2 { margin-left: -2vw !important; margin-right: -2vw !important; }
.mx-n3 { margin-left: -3vw !important; margin-right: -3vw !important; }
.mx-n4 { margin-left: -4vw !important; margin-right: -4vw !important; }
.mx-n5 { margin-left: -5vw !important; margin-right: -5vw !important; }
.mx-n6 { margin-left: -6vw !important; margin-right: -6vw !important; }
.mx-n7 { margin-left: -7vw !important; margin-right: -7vw !important; }
.mx-n8 { margin-left: -8vw !important; margin-right: -8vw !important; }
.mx-n10 { margin-left: -10vw !important; margin-right: -10vw !important; }
.mx-n12 { margin-left: -12vw !important; margin-right: -12vw !important; }
.mx-n16 { margin-left: -16vw !important; margin-right: -16vw !important; }
.mx-n20 { margin-left: -20vw !important; margin-right: -20vw !important; }

/* 左のみ */
.ml-n1 { margin-left: -1vw !important; }
.ml-n2 { margin-left: -2vw !important; }
.ml-n3 { margin-left: -3vw !important; }
.ml-n4 { margin-left: -4vw !important; }
.ml-n5 { margin-left: -5vw !important; }
.ml-n6 { margin-left: -6vw !important; }
.ml-n7 { margin-left: -7vw !important; }
.ml-n8 { margin-left: -8vw !important; }
.ml-n10 { margin-left: -10vw !important; }
.ml-n12 { margin-left: -12vw !important; }
.ml-n16 { margin-left: -16vw !important; }
.ml-n20 { margin-left: -20vw !important; }

/* 右のみ */
.mr-n1 { margin-right: -1vw !important; }
.mr-n2 { margin-right: -2vw !important; }
.mr-n3 { margin-right: -3vw !important; }
.mr-n4 { margin-right: -4vw !important; }
.mr-n5 { margin-right: -5vw !important; }
.mr-n6 { margin-right: -6vw !important; }
.mr-n7 { margin-right: -7vw !important; }
.mr-n8 { margin-right: -8vw !important; }
.mr-n10 { margin-right: -10vw !important; }
.mr-n12 { margin-right: -12vw !important; }
.mr-n16 { margin-right: -16vw !important; }
.mr-n20 { margin-right: -20vw !important; }

/* ====================================
   SP専用 (767px以下)
==================================== */
@media (max-width: 767px) {
    /* フォントサイズ */
    .sp-fs-10 { font-size: 10px !important; }
    .sp-fs-12 { font-size: 12px !important; }
    .sp-fs-13 { font-size: 13px !important; }
    .sp-fs-14 { font-size: 14px !important; }
    .sp-fs-15 { font-size: 15px !important; }
    .sp-fs-16 { font-size: 16px !important; }
    .sp-fs-18 { font-size: 18px !important; }
    .sp-fs-20 { font-size: 20px !important; }
    .sp-fs-22 { font-size: 22px !important; }
    .sp-fs-24 { font-size: 24px !important; }
    .sp-fs-26 { font-size: 26px !important; }
    .sp-fs-28 { font-size: 28px !important; }
    .sp-fs-30 { font-size: 30px !important; }
    .sp-fs-32 { font-size: 32px !important; }
    .sp-fs-36 { font-size: 36px !important; }
    .sp-fs-40 { font-size: 40px !important; }
    .sp-fs-48 { font-size: 48px !important; }
    .sp-fs-56 { font-size: 56px !important; }
    .sp-fs-64 { font-size: 64px !important; }

    /* テキスト揃え */
    .sp-text-left { text-align: left !important; }
    .sp-text-center { text-align: center !important; }
    .sp-text-right { text-align: right !important; }
    .sp-text-justify { text-align: justify !important; }

    .sp-mb-10{margin-bottom: 10px !important;}
    .sp-mb-50{margin-bottom: 50px !important;}
    .mb-80.sp-mb-50{margin-bottom: 50px !important;}

    .sp-order-2{
      order: 2;
    }
    .sp-order-1{
      order: 1;
    }

    /* ネガティブマージン（左右）vw単位 - SP専用 */
    /* 左右両方 */
    .sp-mx-n1 { margin-left: -1vw !important; margin-right: -1vw !important; }
    .sp-mx-n2 { margin-left: -2vw !important; margin-right: -2vw !important; }
    .sp-mx-n3 { margin-left: -3vw !important; margin-right: -3vw !important; }
    .sp-mx-n4 { margin-left: -4vw !important; margin-right: -4vw !important; }
    .sp-mx-n5 { margin-left: -5vw !important; margin-right: -5vw !important; }
    .sp-mx-n6 { margin-left: -6vw !important; margin-right: -6vw !important; }
    .sp-mx-n7 { margin-left: -7vw !important; margin-right: -7vw !important; }
    .sp-mx-n8 { margin-left: -8vw !important; margin-right: -8vw !important; }
    .sp-mx-n10 { margin-left: -10vw !important; margin-right: -10vw !important; }
    .sp-mx-n12 { margin-left: -12vw !important; margin-right: -12vw !important; }
    .sp-mx-n16 { margin-left: -16vw !important; margin-right: -16vw !important; }
    .sp-mx-n20 { margin-left: -20vw !important; margin-right: -20vw !important; }

    /* 左のみ */
    .sp-ml-n1 { margin-left: -1vw !important; }
    .sp-ml-n2 { margin-left: -2vw !important; }
    .sp-ml-n3 { margin-left: -3vw !important; }
    .sp-ml-n4 { margin-left: -4vw !important; }
    .sp-ml-n5 { margin-left: -5vw !important; }
    .sp-ml-n6 { margin-left: -6vw !important; }
    .sp-ml-n7 { margin-left: -7vw !important; }
    .sp-ml-n8 { margin-left: -8vw !important; }
    .sp-ml-n10 { margin-left: -10vw !important; }
    .sp-ml-n12 { margin-left: -12vw !important; }
    .sp-ml-n16 { margin-left: -16vw !important; }
    .sp-ml-n20 { margin-left: -20vw !important; }

    .sp-ml-0{ margin-left: 0 !important}

    /* 右のみ */
    .sp-mr-n1 { margin-right: -1vw !important; }
    .sp-mr-n2 { margin-right: -2vw !important; }
    .sp-mr-n3 { margin-right: -3vw !important; }
    .sp-mr-n4 { margin-right: -4vw !important; }
    .sp-mr-n5 { margin-right: -5vw !important; }
    .sp-mr-n6 { margin-right: -6vw !important; }
    .sp-mr-n7 { margin-right: -7vw !important; }
    .sp-mr-n8 { margin-right: -8vw !important; }
    .sp-mr-n10 { margin-right: -10vw !important; }
    .sp-mr-n12 { margin-right: -12vw !important; }
    .sp-mr-n16 { margin-right: -16vw !important; }
    .sp-mr-n20 { margin-right: -20vw !important; }

    .sp-mr-0{ margin-right: 0 !important}
}




:root {
    --animate-distance: 50px; /* デフォルトは100px */
    --animate-duration: 0.6s; /* デフォルトは1s */
}

/* アニメーション時間の適用 */
.animate__animated {
    animation-duration: var(--animate-duration) !important;
}

/* fadeInUp系 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, var(--animate-distance, 100px), 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* fadeInDown系 */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, calc(-1 * var(--animate-distance, 100px)), 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* fadeInLeft系 */
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(calc(-1 * var(--animate-distance, 100px)), 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* fadeInRight系 */
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(var(--animate-distance, 100px), 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
