/*---------------------------------
HIDDEN
----------------------------------*/
@media(min-width: 769px) {
    .is-hidden_pc {
        display:none
    }
}
@media(max-width: 768px)and (min-width: 651px) {
    .is-hidden_tb {
        display:none
    }
}
@media(max-width: 650px) {
    .is-hidden_sp {
        display:none
    }
}


/*---------------------------------
LAYOUT
----------------------------------*/

.u-dsp_block {
    display: block
}

.flex>.flex--img {
    text-align: center;
}

.flex .flex-shrink {
    flex-shrink: 0;
}

@media(min-width: 961px) {
    .flex {
        display:flex;
    }
}

.flex-wrap {
    flex-wrap: wrap
}

.u-ai-c {
    align-items: center
}
.u-jc-c {
    justify-content: center;
}

.u-jc-sb {
    justify-content: space-between;
}
.u-jc-sa {
    justify-content: space-around;
}
.u-flex-di-col {
    flex-direction: column
}

.img-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/*---------------------------------
FONT
----------------------------------*/
.fw_500 {
    font-weight: 500
}
.fw_600 {
    font-weight: 600
}
.fw_700 {
    font-weight: 700
}

/*LINE*/
.u-line-yellow {
/*    background: linear-gradient(transparent 1em, #FFF677 0, #FFF677 calc(1em + 10px), transparent 0);*/
   background: linear-gradient(transparent 1em, rgb(255 246 119 / 70%) 0, rgb(255 246 119 / 70%) calc(1em + 10px), transparent 0)
}
/*
.u-line_white {
    background: linear-gradient(transparent 1em, #fff 0, #fff calc(1em + 10px), transparent 0);
}
*/
.u-line_dot:after{
    content: "";
    width: 100%;
    height: 10px;
    background-image: linear-gradient(to right, #92BDD9 2px, transparent 2px);
    background-size: 10px 2px;
    background-repeat: repeat-x;
    background-position: left bottom;
    display: block;
    margin-bottom: 1em;
    margin-top: 1em;
}

.u-ttl-line {
    text-align: center;
}
.u-ttl-line:after {
    content: "";
    margin: 10px auto;
    width: 120px;
    height: 10px;
    border-radius: 5px;
    background: #1cb57b;
    display: block;
}

/* タイトル \ hogehoge / */
.u-ttl-diag {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    font-size: 1em;
    text-align: center;
}
.u-ttl-diag:before,
.u-ttl-diag:after{
    content: '';
    width: 3px;
    height: 1.5em;
    background-color: #111;
}
.u-ttl-diag:before {
    margin-right: 20px;
    transform: rotate(-35deg);
}
.u-ttl-diag:after {
    margin-left: 20px;
    transform: rotate(35deg);
}

.txt-shadow-w {
text-shadow: 0px 4px 10px #fff;
}

/*---------------------------------
color
----------------------------------*/
.c-pale {color: rgb(0 65 75 / 70%)}
.c-pink {color: #f08080;}
.c-green {color: #1CB57B;}
.c-yellow {color: #FFF677;}
.c-white {color: #fff;}


/*---------------------------------
link
----------------------------------*/
a.c-txt-link {
        color: #1E88E5;
    border-bottom: solid 1px;
}

/*---------------------------------
BG
----------------------------------*/

.bg_w {background-color: #fff}
.bg_pale {background-color: #FEF8EC;}


/*---------------------------------
 text-align
----------------------------------*/

.txt-left {
    text-align: left
}
.txt-center{
    text-align: center
}
.txt-right {
    text-align: right
}



/*---------------------------------
 font-size
----------------------------------*/
.txt-small {
    font-size: 0.9em;
}
.txt-x-small {
    font-size: 0.6em;
}
.txt-large {
    font-size: 2.2em;
}

.txt-lv-l {
    font-size: 32px;
}
.txt-lv-m {
    font-size: 24px;
}


@media(max-width: 650px) {
    .txt-lv-l {
        font-size: 24px;
    }

    .txt-lv-m {
        font-size: 16px;
    }
}

/*---------------------------------
WIDTH
----------------------------------*/

.w700 {
    width: 70rem !important
}

.w800 {
    width: 80rem !important
}

.w100_max {
    max-width: 100% !important
}

@media(max-width: 768px)and (min-width: 668px) {
    .u-w100_tb {
        width:100%;
        max-width: 100%;
    }
}
@media(max-width: 768px) {
    .u-w100_sp {
        width:100%;
        max-width: 100%;
    }
}


/*---------------------------------
MARGIN
----------------------------------*/

.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
}

.mb60 {
    margin-bottom: 60px !important
}

.mb70 {
    margin-bottom: 70px !important
}

.mb80 {
    margin-bottom: 80px !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
}

.mt40 {
    margin-top: 40px !important
}

.mt50 {
    margin-top: 50px !important
}

.ml_auto {
    margin-left: auto !important
}

.mr_auto {
    margin-right: auto !important
}

.pb0 {
    padding-bottom: 0 !important
}



/*---------------------------------
PADDING
----------------------------------*/

.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
}

.pb60 {
    padding-bottom: 60px !important
}

.pb70 {
    padding-bottom: 70px !important
}

.pb80 {
    padding-bottom: 80px !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
}

.pt40 {
    padding-top: 40px !important
}

.pt50 {
    padding-top: 50px !important
}

.pl_auto {
    padding-left: auto !important
}

.pr_auto {
    padding-right: auto !important
}

.pb0 {
    padding-bottom: 0 !important
}