@charset "utf-8";
/* margin top */
.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-35{
    margin-top: -35px !important;
}

.mt0{
    margin-top: 0px !important;
}
.mt5{
    margin-top: 5px !important;
}
.mt10{
    margin-top: 10px !important;
}
.mt15{
    margin-top: 15px !important;
}
.mt20{
    margin-top: 20px !important;
}
.mt25{
    margin-top: 25px !important;
}
.mt30{
    margin-top: 30px !important;
}
.mt35{
    margin-top: 35px !important;
}
.mt40{
    margin-top: 40px !important;
}
.mt45{
    margin-top: 45px !important;
}
.mt50{
    margin-top: 50px !important;
}
/* margin bottom */
.mb0{
    margin-bottom: 0px !important;
}
.mb5{
    margin-bottom: 5px !important;
}
.mb10{
    margin-bottom: 10px !important;
}
.mb15{
    margin-bottom: 15px !important;
}
.mb20{
    margin-bottom: 20px !important;
}
.mb25{
    margin-bottom: 25px !important;
}
.mb30{
    margin-bottom: 30px !important;
}
.mb35{
    margin-bottom: 35px !important;
}
.mb40{
    margin-bottom: 40px !important;
}
.mb45{
    margin-bottom: 45px !important;
}
.mb50{
    margin-bottom: 50px !important;
}
/* margin left */
.ml0{
    margin-left: 0px !important;
}
.ml5{
    margin-left: 5px !important;
}
.ml10{
    margin-left: 10px !important;
}
.ml15{
    margin-left: 15px !important;
}
.ml20{
    margin-left: 20px !important;
}
.ml25{
    margin-left: 25px !important;
}
.ml30{
    margin-left: 30px !important;
}
.ml35{
    margin-left: 35px !important;
}
.ml40{
    margin-left: 40px !important;
}
.ml45{
    margin-left: 45px !important;
}
.ml50{
    margin-left: 50px !important;
}
/* margin right */
.mr0{
    margin-right: 0px !important;
}
.mr5{
    margin-right: 5px !important;
}
.mr10{
    margin-right: 10px !important;
}
.mr15{
    margin-right: 15px !important;
}
.mr20{
    margin-right: 20px !important;
}
.mr25{
    margin-right: 25px !important;
}
.mr30{
    margin-right: 30px !important;
}
.mr35{
    margin-right: 35px !important;
}
.mr40{
    margin-right: 40px !important;
}
.mr45{
    margin-right: 45px !important;
}
.mr50{
    margin-right: 50px !important;
}
.ma{
    margin: auto !important;
}
.m5{
    margin: 5px !important;
}
.m10{
    margin: 10px !important;
}
.m15{
    margin: 15px !important;
}
.m20{
    margin: 20px !important;
}
.m25{
    margin: 25px !important;
}
.m30{
     margin: 30px !important;
 }
.m35{
    margin: 35px !important;
}
.m40{
    margin: 40px !important;
}
.m45{
    margin: 45px !important;
}
.m50{
    margin: 50px !important;
}

/* padding top */
.pt0{
    padding-top: 0px !important;
}
.pt5{
    padding-top: 5px !important;
}
.pt10{
    padding-top: 10px !important;
}
.pt15{
    padding-top: 15px !important;
}
.pt20{
    padding-top: 20px !important;
}
.pt25{
    padding-top: 25px !important;
}
.pt30{
    padding-top: 30px !important;
}
.pt35{
    padding-top: 35px !important;
}
.pt40{
    padding-top: 40px !important;
}
.pt45{
    padding-top: 45px !important;
}
.pt50{
    padding-top: 50px !important;
}
/* padding bottom */
.pb0{
    padding-bottom: 0px !important;
}
.pb5{
    padding-bottom: 5px !important;
}
.pb10{
    padding-bottom: 10px !important;
}
.pb15{
    padding-bottom: 15px !important;
}
.pb20{
    padding-bottom: 20px !important;
}
.pb25{
    padding-bottom: 25px !important;
}
.pb30{
    padding-bottom: 30px !important;
}
.pb35{
    padding-bottom: 35px !important;
}
.pb40{
    padding-bottom: 40px !important;
}
.pb45{
    padding-bottom: 45px !important;
}
.pb50{
    padding-bottom: 50px !important;
}
/* padding left */
.pl0{
    padding-left: 0px !important;
}
.pl5{
    padding-left: 5px !important;
}
.pl10{
    padding-left: 10px !important;
}
.pl15{
    padding-left: 15px !important;
}
.pl20{
    padding-left: 20px !important;
}
.pl25{
    padding-left: 25px !important;
}
.pl30{
    padding-left: 30px !important;
}
.pl35{
    padding-left: 35px !important;
}
.pl40{
    padding-left: 40px !important;
}
.pl45{
    padding-left: 45px !important;
}
.pl50{
    padding-left: 50px !important;
}
/* padding right */
.pr0{
    padding-right: 0px !important;
}
.pr5{
    padding-right: 5px !important;
}
.pr10{
    padding-right: 10px !important;
}
.pr15{
    padding-right: 15px !important;
}
.pr20{
    padding-right: 20px !important;
}
.pr25{
    padding-right: 25px !important;
}
.pr30{
    padding-right: 30px !important;
}
.pr35{
    padding-right: 35px !important;
}
.pr40{
    padding-right: 40px !important;
}
.pr45{
    padding-right: 45px !important;
}
.pr50{
    padding-right: 50px !important;
}
/* padding */
.p0{
    padding: 0px !important;
}
.p5{
    padding: 5px !important;
}
.p10{
    padding: 10px !important;
}
.p15{
    padding: 15px !important;
}
.p20{
    padding: 20px !important;
}
.p25{
    padding: 25px !important;
}
.p30{
    padding: 30px !important;
}
.p35{
    padding: 35px !important;
}
.p40{
    padding: 40px !important;
}
.p45{
    padding: 45px !important;
}
.p50{
    padding: 50px !important;
}
/* width */
.w5p{
    width: 5% !important;
}
.w10p{
    width: 10% !important;
}
.w15p{
    width: 15% !important;
}
.w20p{
    width: 20% !important;
}
.w25p{
    width: 25% !important;
}
.w30p{
    width: 30% !important;
}
.w35p{
    width: 35% !important;
}
.w40p{
    width: 40% !important;
}
.w45p{
    width: 45% !important;
}
.w49p{
    width: 49% !important;
}
.w50p{
    width: 50% !important;
}
.w55p{
    width: 55% !important;
}
.w69p{
    width: 69% !important;
}
.w60p{
    width: 60% !important;
}
.w65p{
    width: 65% !important;
}
.w70p{
    width: 70% !important;
}
.w75p{
    width: 75% !important;
}
.w80p{
    width: 80% !important;
}
.w85p{
    width: 85% !important;
}
.w90p{
    width: 90% !important;
}
.w95p{
    width: 95% !important;
}
.w100p{
    width: 100% !important;
}
.mw80p{
    max-width: 80% !important;
}
.mw90p{
    max-width: 90% !important;
}
.mw100p{
    max-width: 100% !important;
}
.bn{
    border: none;
}
.nd{
    display: none;
}
.db{
    display: block;
}
.di{
    display: inline-block;
    vertical-align: top;
}

.text-center{
     text-align: center !important;
}
.text-left{
    text-align: left !important;
}
.text-right{
    text-align: right !important;
}

.fl{
    float: left;
}
.fr{
    float: right;
}

.bt{
    border-top: 1px solid #bdbdbd;
}
.bl,.blp{
    border-left: 1px solid #bdbdbd;
}
.br,.brp{
    border-right: 1px solid #bdbdbd;
}
.bb{
    border-bottom: 1px solid #bdbdbd;
}
.ba,.bap{
    border: 1px solid #bdbdbd;
}
.bab{
    border: 1px solid #66062c;
}
.bbb{
    border-bottom: 1px solid #66062c;
}

.baw{
    border: 1px solid #fde8d9;
}
.bag{
    border: 1px solid #58585A;
}
.btg{
    border-top: 1px solid #58585A;
}
.bbg{
    border-bottom: 1px solid #58585A;
}
@media screen and (max-width: 768px) {
    .blp{
        border-left: none;
    }
    .brp {
        border-right: none;
    }
    .bap{
        border-left: none;
        border-right: none;
    }
}

.bln{
    border-left: none !important;
}
.brn{
    border-right: none !important;
}

.fwn{
    font-weight: normal !important;
}
.fwb{
    font-weight: bold !important;
}
.fcb{
    color: #66062c;
}
.fco{
    color: #f89d49;
}

.fs10{
    font-size: 10px;
    font-size: 0.625rem;
}
.fs12{
    font-size: 12px;
    font-size: 0.75rem;
}
.fs13{
    font-size: 13px;
    font-size: 0.8125rem;
}
.fs14{
    font-size: 14px;
    font-size: 0.875rem;
}
.fs16{
     font-size: 16px;
     font-size: 1rem;
}
.fs18{
    font-size: 18px;
    font-size: 1.125rem;
}
.fs20{
    font-size: 20px;
    font-size: 1.25rem;
}
.fs22{
    font-size: 22px;
    font-size: 1.375rem;
}
.fs24{
     font-size: 24px !important;
     font-size: 1.5rem !important;
 }
.fs26{
    font-size: 26px;
    font-size: 1.625rem;
}
.fs28{
    font-size: 28px;
    font-size: 1.75rem;
}
.fs30{
    font-size: 30px;
    font-size: 1.875rem;
}
.pos-a{
    position: absolute;
}
.pos-r{
    position: relative;
}

.bw{
    background-color: #fde8d9;
}
.btw{
    background-color: #ffffff;
}
.cw{
    color: #fde8d9 !important;
}
.ctw{
    color: #ffffff;
}
.cb{
    color: #66062c;
}
.cg{
    color: #58585A;
}
.clear-fix {
    clear: both;
}
.bg_cb{
    background-color: #66062c !important;
}

@media screen and (min-width: 769px) {
    .sp_only {
        display: none !important;
    }
}

@media screen and (max-width: 768px) {
    .pc_only {
        display: none !important;
    }
}

input[readonly],
select[readonly]{
    background-color:#f0f0f0;
}
a[disabled]{
    pointer-events: none;
    background-color: #f0f0f0;
    color: #333;
}

div{
    /*text-align: center;*/
}
.fk{
    font-family: "KodomoRounded";
    font-weight: normal;
}

.loading-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5);
    overflow: hidden;
    display: none;
    z-index: 3;
}
.loading-wrapper .loading-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 60px;
    height: 60px;
    margin: auto;
    z-index: 4;
}
.loading-wrapper .loading-img img {
    width: 100%;
    height: auto;
}

.btn_line_area{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    flex: 1;
}

.btn_line{
    background-color: #06c755;
    display: flex;
    line-height: 1;
    width: 300px;
    border-radius: 10px;
    text-decoration: none;
}
.btn_line .image{
    border-right: 1px solid #00b300;
}
.btn_line .image img{
    width: 66px;
    height: 66px;
    vertical-align: bottom;
}
.btn_line .text {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: bold;
    color: #fff;
}

.youtube {
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 10px 0;
    padding: 10px;
}
@media screen and (max-width: 768px) {
    .youtube {
        border-bottom: 1px solid #ffffff;
    }
}
.youtube iframe {
    width: 100%;
    height: 100%;
}
@media screen and (min-width: 769px) {
    .pc_3col {
        width: 33%;
        display: inline-block;
    }
    .pc_2col {
        width: 49.5%;
        display: inline-block;
    }
}

.pc_sp_2col {
    width: 49.5%;
    display: inline-block;
    text-align: center;
}
.pc_sp_2col video {
    max-width: 100%;
}
@media screen and (min-width: 769px) {
    .pc_sp_2col video {
        max-width: 200px;
    }
}

/* モーダルCSS */
.modalArea {
    display: none;
    position: fixed;
    z-index: 10; /*サイトによってここの数値は調整 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.modalBg {
    width: 100%;
    height: 100%;
    background-color: rgba(30,30,30,0.8);
}

.modalWrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    width: 95%;
    max-width: 640px;
    padding: 10px 30px;
    background-color: #fff;
}