@charset "UTF-8";
/* ----------------------------------------
* loader
---------------------------------------- */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f5f8fc;
    z-index: 99999;
}


.loader,
.loader:after {
    border-radius: 50%;
    width: 50px;
    height: 50px;
}

.loader {
    margin: auto;
    border-top: 2px solid rgba(0, 0, 0, 0.1);
    border-right: 2px solid rgba(0, 0, 0, 0.1);
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    border-left: 2px solid #0148a0;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* ----------------------------------------
* Utilities
---------------------------------------- */
/* line-height */
.line-h-0 {
    line-height: 0 !important;
}

.line-h-1 {
    line-height: 1 !important;
}

.line-h-1-3 {
    line-height: 1.3 !important;
}

.line-h-1-5 {
    line-height: 1.5 !important;
}

.line-h-1-8 {
    line-height: 1.8 !important;
}

.line-h-2 {
    line-height: 2 !important;
}

.line-h-2-5 {
    line-height: 2.5 !important;
}

/* letter-spacing */
.letter-s-0-5 {
    letter-spacing: 0.5px !important;
}

.letter-s-1 {
    letter-spacing: 1px !important;
}

.letter-s-1-8 {
    letter-spacing: 1.8px !important;
}

.letter-s-2 {
    letter-spacing: 2px !important;
}

.letter-s-3 {
    letter-spacing: 2px !important;
}

.letter-s-4 {
    letter-spacing: 4px !important;
}

.letter-s-5 {
    letter-spacing: 5px !important;
}

.letter-s-7 {
    letter-spacing: 7px !important;
}

.letter-s-8 {
    letter-spacing: 8px !important;
}

.letter-s-9 {
    letter-spacing: 9px !important;
}

/* width */
.w-100 {
    width: 100px !important;
}

.w-200 {
    width: 200px !important;
}

.w-280 {
    width: 280px !important;
}

.w-480 {
    width: 480px !important;
}

/* height */
.h-100 {
    height: 100px !important;
}

.h-200 {
    height: 200px !important;
}

/* max-width */
.max-width-100 {
    max-width: 100% !important;
}

.max-w-100 {
    max-width: 100px !important;
}

.max-w-360 {
    max-width: 360px !important;
}

.max-w-450 {
    max-width: 450px !important;
}

.max-w-490 {
    max-width: 490px !important;
}

.max-w-500 {
    max-width: 500px !important;
}

.max-w-520 {
    max-width: 520px !important;
}

.max-w-580 {
    max-width: 580px !important;
}

.max-w-900 {
    max-width: 900px !important;
}

.max-w-1040 {
    max-width: 1040px !important;
}

.max-w-1100 {
    max-width: 1110px !important;
}

/* max-height */
.man-h-100 {
    max-height: 100px !important;
}

/* mix-width */
.mix-w-100 {
    min-width: 100px !important;
}

/* min-height */
.min-h-100 {
    min-height: 100px !important;
}

/* font-size */
.f-1,.f-1-0 {
    font-size: 1.0rem !important;
}

.f-1-1 {
    font-size: 1.1rem !important;
}

.f-1-2 {
    font-size: 1.2rem !important;
}

.f-1-3 {
    font-size: 1.3rem !important;
}

.f-1-4 {
    font-size: 1.4rem !important;
}

.f-1-5 {
    font-size: 1.5rem !important;
}

.f-1-6 {
    font-size: 1.6rem !important;
}

.f-1-7 {
    font-size: 1.7rem !important;
}

.f-1-8 {
    font-size: 1.8rem !important;
}

.f-1-9 {
    font-size: 1.9rem !important;
}

.f-2, .f-2-0 {
    font-size: 2rem !important;
}

.f-2-1 {
    font-size: 2.1rem !important;
}

.f-2-2 {
    font-size: 2.2rem !important;
}

.f-2-4 {
    font-size: 2.4rem !important;
}

.f-2-5 {
    font-size: 2.5rem !important;
}

.f-2-6 {
    font-size: 2.6rem !important;
}

.f-2-7 {
    font-size: 2.7rem !important;
}

.f-2-8 {
    font-size: 2.8rem !important;
}

.f-2-9 {
    font-size: 2.9rem !important;
}

.f-3, .f-3-0 {
    font-size: 3.0rem !important;
}

.f-3-1 {
    font-size: 3.1rem !important;
}

.f-3-2 {
    font-size: 3.2rem !important;
}

.f-3-3 {
    font-size: 3.3rem !important;
}

.f-3-5 {
    font-size: 3.5rem !important;
}

.f-3-6 {
    font-size: 3.6rem !important;
}

.f-3-8 {
    font-size: 3.8rem !important;
}

.f-4,.f-4-0 {
    font-size: 4rem !important;
}

.f-4-5 {
    font-size: 4.5rem !important;
}

.f-4-7 {
    font-size: 4.7rem !important;
}

.f-5, .f-5-0 {
    font-size: 5rem !important;
}

.f-5-7 {
    font-size: 5.7rem !important;
}

.f-6-1 {
    font-size: 6.1rem !important;
}

.f-7,.f-7-0 {
    font-size: 7rem !important;
}

/* margin */
.mb-55 {
    margin-bottom: 55px !important;
}

.mb-150 {
    margin-bottom: 150px !important;
}

.ml-8 {
    margin-left: 8px !important;
}

.ml-160 {
    margin-left: 160px !important;
}

.ml-200 {
    margin-left: 200px !important;
}

.ml-220 {
    margin-left: 220px !important;
}

.ml-250 {
    margin-left: 250px !important;
}

.mr-200 {
    margin-right: 200px !important;
}

.mr-250 {
    margin-right: 250px !important;
}

/* padding */
.pt-8, .py-8 {
    padding-top: 8px !important;
}

.pt-165 {
    padding-top: 165px !important;
}

.pt-240 {
    padding-top: 240px !important;
}

.pt-340 {
    padding-top: 340px !important;
}

.pt-400 {
    padding-top: 400px !important;
}

.pb-8, .py-8 {
    padding-bottom: 8px !important;
}

.pb-180 {
    padding-bottom: 180px !important;
}

.pb-250 {
    padding-bottom: 250px !important;
}

/* border */
.border-none {
    border: 0 !important;
}

/* color */
.c-black {
    color: black !important;
}

.c-white {
    color: white !important;
}

.c-blue {
    color: #0148a0 !important;
}

.c-red{
    color: red !important;
}

/* vertical-align */
.va-top {
    vertical-align: top !important;
}

.va-middle {
    vertical-align: middle !important;
}

/* position */
.pos-relative {
    position: relative !important;
}

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

.hidden-xs2,
.hidden-xs3 {
    display: block !important;
}

.visible-xs2,
.visible-xs3 {
    display: none !important;
}

/* md */
@media (max-width: 1199px) {
    /* text-align */
    .text-md-center {
        text-align: center !important;
    }

    .text-md-left {
        text-align: left !important;
    }

    .text-md-right {
        text-align: right !important;
    }
    
    /* line-height */
    .line-h-md-1-3 {
        line-height: 1.3 !important;
    }

    .line-h-md-1-7 {
        line-height: 1.7 !important;
    }

    /* width */
    .w-md-250 {
        width: 250px !important;
    }

    .w-md-350 {
        width: 350px !important;
    }

    /* max-width */
    .max-w-md-490 {
        max-width: 490px !important;
    }

    /* height */
    .height-md-100 {
        height: 100% !important;
    }

    /* margin */
    .mt-md-0, .m-md-0 {
        margin-top: 0 !important;
    }

    .mt-md-20, .my-md-20, .m-md-20 {
        margin-top: 20px !important;
    }

    .mt-md-50 {
        margin-top: 50px !important;
    }

    .mb-md-0, .m-md-0 {
        margin-bottom: 0 !important;
    }

    .mb-md-10 {
        margin-bottom: 10px !important;
    }

    .mb-md-15 {
        margin-bottom: 15px !important;
    }

    .mb-md-20, .my-md-20, .m-md-20 {
        margin-bottom: 20px !important;
    }

    .mb-md-35 {
        margin-bottom: 35px !important;
    }

    .ml-md-0, .m-md-0 {
        margin-left: 0 !important;
    }

    .ml-md-10, .mx-md-10 {
        margin-left: 10px !important;
    }

    .ml-md-20, .mx-md-20, .m-md-20 {
        margin-left: 20px !important;
    }

    .mr-md-0, .m-md-0 {
        margin-right: 0 !important;
    }

    .ml-md-10, .mx-md-10 {
        margin-right: 10px !important;
    }

    .mr-md-20, .mx-md-20, .m-md-20 {
        margin-right: 20px !important;
    }

    /* padding */
    .pt-md-0 {
        padding-top: 0 !important;
    }

    .pt-md-20 {
        padding-top: 20px !important;
    }

    .pt-md-25, .py-md-25 {
        padding-top: 25px !important;
    }

    .pt-md-30 {
        padding-top: 30px !important;
    }

    .pt-md-50, .py-md-50 {
        padding-top: 50px !important;
    }

    .pt-md-250 {
        padding-top: 250px !important;
    }

    .pt-md-300 {
        padding-top: 250px !important;
    }

    .pb-md-25, .py-md-25 {
        padding-bottom: 25px !important;
    }

    .pb-md-30 {
        padding-bottom: 30px !important;
    }

    .pb-md-40 {
        padding-bottom: 40px !important;
    }

    .pb-md-50, .py-md-50 {
        padding-bottom: 50px !important;
    }

    .pb-md-150 {
        padding-bottom: 150px !important;
    }

    .pr-md-20 {
        padding-right: 20px !important;
    }

    /* font-size */
    .f-md-1-6 {
        font-size: 1.6rem !important;
    }

    .f-md-1-7 {
        font-size: 1.7rem !important;
    }

    .f-md-1-8 {
        font-size: 1.8rem !important;
    }

    .f-md-2, .f-md-2-0 {
        font-size: 2rem !important;
    }

    .f-md-2-1 {
        font-size: 2.1rem !important;
    }

    .f-md-2-5 {
        font-size: 2.5rem !important;
    }

    .f-md-2-8 {
        font-size: 2.8rem !important;
    }

    .f-md-2-9 {
        font-size: 2.9rem !important;
    }

    .f-md-3, .f-md-3-0 {
        font-size: 3rem !important;
    }

    .f-md-3-8 {
        font-size: 3.8rem !important;
    }

}

/* sm */
@media (max-width: 991px) {
    /* text-align */
    .text-sm-center {
        text-align: center !important;
    }

    .text-sm-left {
        text-align: left !important;
    }

    .text-sm-right {
        text-align: right !important;
    }

    /* line-height */
    .line-h-sm-1-3 {
        line-height: 1.3 !important;
    }

    .line-h-sm-1-5 {
        line-height: 1.5 !important;
    }

    .line-h-sm-1-8 {
        line-height: 1.8 !important;
    }

    /* width */
    .width-sm-100 {
        width: 100% !important;
    }

    .width-sm-70 {
        width: 70% !important;
    }

    .w-sm-80 {
        width: 80px !important;
    }

    /* max-width */
    .max-w-sm-500 {
        max-width: 500px !important;
    }
    
    /* font-size */
    .f-sm-1, .f-sm-1-0 {
        font-size: 1.0rem !important;
    }

    .f-sm-1-1 {
        font-size: 1.1rem !important;
    }

    .f-sm-1-2 {
        font-size: 1.2rem !important;
    }

    .f-sm-1-3 {
        font-size: 1.3rem !important;
    }

    .f-sm-1-4 {
        font-size: 1.4rem !important;
    }

    .f-sm-1-5 {
        font-size: 1.5rem !important;
    }

    .f-sm-1-6 {
        font-size: 1.6rem !important;
    }

    .f-sm-1-7 {
        font-size: 1.7rem !important;
    }

    .f-sm-1-8 {
        font-size: 1.8rem !important;
    }

    .f-sm-2-1 {
        font-size: 2.1rem !important;
    }

    .f-sm-2-2 {
        font-size: 2.2rem !important;
    }

    .f-sm-2-3 {
        font-size: 2.3rem !important;
    }

    .f-sm-2-4 {
        font-size: 2.4rem !important;
    }

    .f-sm-2-5 {
        font-size: 2.5rem !important;
    }

    .f-sm-2-6 {
        font-size: 2.6rem !important;
    }

    .f-sm-2-9 {
        font-size: 2.9rem !important;
    }

    .f-sm-4-5 {
        font-size: 4.5rem !important;
    }

    /* margin */
    .mt-sm-0, .my-sm-0 {
        margin-top: 0 !important;
    }

    .mt-sm-10 {
        margin-top: 10px !important;
    }

    .mt-sm-15, .my-sm-15 {
        margin-top: 15px !important;
    }

    .mt-sm-20 {
        margin-top: 20px !important;
    }

    .mt-sm-30 {
        margin-top: 30px !important;
    }

    .mb-sm-0, .my-sm-0 {
        margin-bottom: 0 !important;
    }

    .mb-sm-10 {
        margin-bottom: 10px !important;
    }

    .mb-sm-15, .my-sm-15 {
        margin-bottom: 15px !important;
    }

    .ml-sm-0, .mx-sm-0 {
        margin-left: 0px !important;
    }

    .ml-sm-10 {
        margin-left: 10px !important;
    }

    .ml-sm-20, .mx-sm-20 {
        margin-left: 20px !important;
    }

    .mr-sm-0, .mx-sm-0 {
        margin-right: 0px !important;
    }

    .mr-sm-2 {
        margin-right: 2px !important;
    }

    .mr-sm-5 {
        margin-right: 5px !important;
    }

    .mr-sm-20, .mx-sm-20 {
        margin-right: 20px !important;
    }

    /* padding */
    .pt-sm-0, .p-sm-0 {
        padding-top: 0 !important;
    }

    .pt-sm-15, .p-sm-15 {
        padding-top: 15px !important;
    }

    .pt-sm-20 {
        padding-top: 20px !important;
    }

    .pt-sm-30 {
        padding-top: 30px !important;
    }

    .pb-sm-0, .p-sm-0 {
        padding-bottom: 0 !important;
    }

    .pb-sm-15, .p-sm-15 {
        padding-bottom: 15px !important;
    }

    .pb-sm-30 {
        padding-bottom: 30px !important;
    }

    .pl-sm-0, .px-sm-0, .p-sm-0 {
        padding-left: 0 !important;
    }

    .pl-sm-15, .p-sm-15 {
        padding-left: 15px !important;
    }

    .pr-sm-0, .px-sm-0, .p-sm-0 {
        padding-right: 0 !important;
    }

    .pr-sm-15, .p-sm-15 {
        padding-right: 15px !important;
    }

    /* scale */
    .scale-sm-0-8 {
        transform: scale(0.8) !important;
    }
}

/* xs */
@media (max-width: 767px) {
    /* text-align */
    .text-xs-center {
        text-align: center !important;
    }

    .text-xs-left {
        text-align: left !important;
    }

    .text-xs-right {
        text-align: right !important;
    }

    /* line-height */
    .line-h-xs-1 {
        line-height: 1 !important;
    }

    .line-h-xs-1-2 {
        line-height: 1.2 !important;
    }

    .line-h-xs-1-4 {
        line-height: 1.4 !important;
    }

    .line-h-xs-1-5 {
        line-height: 1.5 !important;
    }

    .line-h-xs-2 {
        line-height: 2 !important;
    }
    
    /* letter-spacing */
    .letter-s-xs-0 {
        letter-spacing: 0 !important;
    }

    .letter-s-xs-1 {
        letter-spacing: 1px !important;
    }

    .letter-s-xs-2 {
        letter-spacing: 2px !important;
    }

    .letter-s-xs-4 {
        letter-spacing: 4px !important;
    }

    .letter-s-xs-5 {
        letter-spacing: 5px !important;
    }

    /* width */
    .width-xs-100 {
        width: 100% !important;
    }

    .w-xs-170 {
        width: 170px !important;
    }

    /* max-width */
    .max-w-xs-290 {
        max-width: 290px !important;
    }

    /* font-size */
    .f-xs-1,.f-xs-1-0 {
        font-size: 1.0rem !important;
    }

    .f-xs-1-2 {
        font-size: 1.2rem !important;
    }

    .f-xs-1-3 {
        font-size: 1.3rem !important;
    }

    .f-xs-1-4 {
        font-size: 1.4rem !important;
    }

    .f-xs-1-5 {
        font-size: 1.5rem !important;
    }

    .f-xs-1-6 {
        font-size: 1.6rem !important;
    }

    .f-xs-1-7 {
        font-size: 1.7rem !important;
    }

    .f-xs-2, .f-xs-2-0 {
        font-size: 2rem !important;
    }

    .f-xs-2-1 {
        font-size: 2.1rem !important;
    }

    .f-xs-2-2 {
        font-size: 2.2rem !important;
    }

    .f-xs-2-4 {
        font-size: 2.4rem !important;
    }

    .f-xs-2-6 {
        font-size: 2.6rem !important;
    }

    .f-xs-3-1 {
        font-size: 3.1rem !important;
    }

    /* margin */
    .mt-xs-0 {
        margin-top: 0 !important;
    }

    .mt-xs-10 {
        margin-top: 10px !important;
    }

    .mt-xs-15, .my-xs-15 {
        margin-top: 15px !important;
    }

    .mt-xs-20, .my-xs-20 {
        margin-top: 20px !important;
    }

    .mt-xs-30 {
        margin-top: 30px !important;
    }

    .mt-xs-50 {
        margin-top: 50px !important;
    }

    .mb-xs-0 {
        margin-bottom: 0 !important;
    }

    .mb-xs-5 {
        margin-bottom: 5px !important;
    }

    .mb-xs-10 {
        margin-bottom: 10px !important;
    }

    .mb-xs-15, .my-xs-15 {
        margin-bottom: 15px !important;
    }

    .mb-xs-20, .my-xs-20 {
        margin-bottom: 20px !important;
    }

    .mb-xs-25 {
        margin-bottom: 25px !important;
    }

    .mb-xs-100 {
        margin-bottom: 100px !important;
    }

    .ml-xs-0, .mx-xs-0 {
        margin-left: 0 !important;
    }

    .ml-xs-5, .mx-xs-5 {
        margin-left: 5px !important;
    }

    .ml-xs-10, .mx-xs-10 {
        margin-left: 10px !important;
    }

    .mr-xs-0, .mx-xs-0 {
        margin-right: 0 !important;
    }

    .mr-xs-5, .mx-xs-5 {
        margin-right: 5px !important;
    }

    .mr-xs-10, .mx-xs-10 {
        margin-right: 10px !important;
    }

    /* padding */
    .pt-xs-0, .py-xs-0, .p-xs-0 {
        padding-top: 0 !important;
    }

    .pt-xs-5, .py-xs-5 {
        padding-top: 5px !important;
    }

    .pt-xs-15, .py-xs-15, .p-xs-15 {
        padding-top: 15px !important;
    }

    .pt-xs-20, .py-xs-20, .p-xs-20 {
        padding-top: 20px !important;
    }

    .pt-xs-180 {
        padding-top: 180px !important;
    }

    .pt-xs-220 {
        padding-top: 220px !important;
    }

    .pt-xs-300 {
        padding-top: 300px !important;
    }

    .pb-xs-0, .py-xs-0, .p-xs-0 {
        padding-bottom: 0 !important;
    }

    .pb-xs-5, .py-xs-5 {
        padding-bottom: 5px !important;
    }

    .pb-xs-10 {
        padding-bottom: 10px !important;
    }

    .pb-xs-15, .py-xs-15, .p-xs-15 {
        padding-bottom: 15px !important;
    }

    .pb-xs-20, .py-xs-20, .p-xs-20 {
        padding-bottom: 20px !important;
    }

    .pl-xs-0, .px-xs-0, .p-xs-0 {
        padding-left: 0 !important;
    }

    .pl-xs-10 {
        padding-left: 10px !important;
    }

    .pl-xs-15, .px-xs-15, .p-xs-15 {
        padding-left: 15px !important;
    }

    .pl-xs-20, .px-xs-20, .p-xs-20 {
        padding-left: 20px !important;
    }

    .pr-xs-0, .px-xs-0, .p-xs-0 {
        padding-right: 0 !important;
    }

    .pr-xs-10 {
        padding-right: 10px !important;
    }

    .pr-xs-15, .px-xs-15, .p-xs-15 {
        padding-right: 15px !important;
    }

    .pr-xs-20, .px-xs-20, .p-xs-20 {
        padding-right: 20px !important;
    }

    /* scale */
    .scale-xs-0-8 {
        transform: scale(0.8) !important;
    }
}

/* xs2 */
@media (max-width: 460px) {
    /* display */
    .hidden-xs2 {
        display: none !important;
    }
    .visible-xs2 {
        display: block !important;
    }
}

/* xs3 */
@media (max-width: 370px) {
    /* display */
    .hidden-xs3 {
        display: none !important;
    }
    .visible-xs3 {
        display: block !important;
    }
}

/* youtube */
.movie-wrap {
    position: relative;
    padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
    height: 0;
    overflow: hidden;
}

.movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.padding-100 {
    padding-bottom: 100px !important;
}
