@charset "utf=8";

/* ==========================================
menu01
========================================== */

.menu01 {
    position: relative;
    padding: 4rem 0 0;
}

.menu01-bg {
    max-width: 180.7rem;
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

.menu01-frame {
    padding: 20.5rem 1.5rem 18.5rem;
    z-index: 1;
}

.menu01-text-block {
    max-width: 84rem;
    width: 100%;
    margin: 0 auto;
    padding: 5.4rem 1.5rem 6.25rem;
    background: rgba(255, 255, 255, .6);
    position: relative;
}

.menu01-text-block:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/menu_textBox01.png) no-repeat center;
    background-size: cover;
    z-index: 5;
}

.menu01-title-box {
    position: relative;
    max-width: 54.3rem;
    width: 100%;
    margin: 0 auto;
    padding: 0 0 1.1rem 0;
    z-index: 10;
}

.menu01-title-box:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: -3.5rem;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/deco_line02.png) no-repeat center;
    background-size: contain;
    z-index: 5;
}

.menu01-title-box .title01 {
    text-align: center;
}

.menu01-text-box {
    position: relative;
    max-width: 65.5rem;
    width: 100%;
    margin: 4rem auto 0;
    z-index: 10;
}

.menu01-text-box p {
    font-weight: 700;
    line-height: 2.2em;
    text-align: center;
}

.name-text {
    margin: 3rem auto 0;
    font-size: 2.3rem;
    letter-spacing: 0.08em;
}

/* ==========================================
menu02
========================================== */

.menu02 {
    padding: 9rem 0 12rem;
}

.menu02-frame01 {
    max-width: 150.4rem;
    width: 100%;
    margin: 0 auto;
}

.menu02-img01 {
    position: relative;
    max-width: 73.9rem;
    width: 49.14%;
    z-index: 20;
}

.menu02-text-block {
    max-width: 94.4rem;
    width: 62.77%;
    padding: 10.9rem 1.5rem 10.4rem;
    background: var(--primary);
    margin: -18% 0px 0 auto;
}

.menu02-text-block:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/menu_textBox02.png) no-repeat center;
    background-size: cover;
    z-index: 1;
}

.menu02-text-block .title01 {
    position: relative;
    text-align: center;
    margin: 0 0 0 10%;
    z-index: 5;
}

.menu02-text-block .title01 br {
    display: none;
}

.menu02-title-deco {
    position: relative;
    max-width: 14.3rem;
    width: 100%;
    margin: 4rem auto 0;
    z-index: 5;
}

/* menu02-frame02 */

.menu02-frame02 {
    max-width: 108.8rem;
    width: 100%;
    margin: 6rem auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menu02-img02 {
    max-width: 39.3rem;
    width: 36.12%;
}

.menu02-text-box {
    max-width: 55.8rem;
    width: 51.29%;
}

.menu02-text-box .text01 {
    line-height: 2.25em;
}


/* ==========================================
menu03
========================================== */

.menu03 {
    padding: 0 0 15rem;
}

.menu03-item01-wrapper {
    position: relative;   
}

.menu03-item01-img01 {
    position: absolute;
    max-width: 92.8rem;
    width: 48.33%;
    top: 8rem;
    right: 0;
    z-index: 5;
}

.menu03-item01-block {
    position: relative;
    max-width: 110rem;
    width: 57.29%;
    padding: 13.4rem 1.5rem 20.3rem;
    background: rgba(255,255,255,.7);
}

.menu03-item01-block:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/menu_textBox03.png) no-repeat center;
    background-size: cover;
    z-index: 1;
}

.menu03-item01-text-block {
    position: relative;
    max-width: 46.5rem;
    width: 100%;
    margin: 0 22.1rem 0 auto;
    z-index: 5;
}

.menu03-item01-title-block {
    max-width: 32.1rem;
    width: 100%;
}

.menu03-item01-text-box {
    width: 100%;
    z-index: 5;
}

.menu03-item01-title-box {
    padding: 0 0 .8rem 0;
    border-bottom: .1rem solid;
}

.menu03-item01-title {
    font-size: 3rem;
    letter-spacing: 0.05em;
}

.menu03-item01-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin: .5rem 0 0;
}

.course-title {
    font-size: 5.5rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.course-price {
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.menu03-item01-text-box {
    margin: 5rem 0 0;
}

.menu03-item01-text-box .text01 {
    line-height: 2.25em;
}

/* menu03-item01-row */

.menu03-item01-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: -10.7rem auto 0;
    position: relative;
    z-index: 5;
}

.menu03-item01-img02 {
    max-width: 56.9rem;
    width: 45.89%;
    margin: 3rem 0 0;
}

.menu-list-area {
    max-width: 43rem;
    width: 34.68%;
    margin: 0 6% 0 0;
}

.menu-list-box {
    text-align: center;
}

.menu-list-block-in {
    padding: 3.8rem 1.5rem 5rem;
    border: .1rem solid;
}

.menu-list-atten-text {
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    font-weight: 500;
    text-align: center;
    margin: 1rem 0 0;
}

.menu-list-title {
    font-size: 2.2rem;
    letter-spacing: 0.05em;
    font-weight: 500;
    text-align: center;
}

.menu-list-title-deco {
    max-width: 14.3rem;
    width: 100%;
    margin: 3rem auto 0;
}

.menu-list-row {
    max-width: 22.3rem;
    width: 100%;
    margin: 5rem auto 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.menu-list-row.text02 {
    line-height: 2.3em;
}

.menu03-frame02 {
    max-width: 107rem;
    width: 100%;
    margin: 7.6rem auto 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.menu03-item02 {
    width: 48%;
}

.menu03-item02:last-child {
    margin: 7rem 0 0;
}

.menu03-frame02 .menu-list-area {
    max-width: 43rem;
    width: 100%;
    margin: 7rem auto 0;
}

.course-title02 {
    font-size: 4.5rem;
    font-weight: 500;
}

.menu03-item-title-block {
    position: relative;
    text-align: center;
}

.menu03-item-title-block:before {
    content: "";
    position: absolute;
    top: -8rem;
    right: 0;
    bottom: auto;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/menu_textCircle.png) no-repeat center;
    background-size: contain;
    z-index: 1;
}

.menu03-item-title-box {
    max-width: 32.1rem;
    width: 100%;
    margin: 0 auto;
    padding: 0 0 2rem 0;
    border-bottom: .1rem solid;
    position: relative;
    z-index: 5;
}

.course-price-box {
    position: relative;
    margin: 1.1rem 0 0;
    z-index: 5;
}

.course-price02 {
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.course-price-atten {
    position: absolute;
    top: .5rem;
    right: 0;
    bottom: 0;
    margin: auto;
}

.menu03-item-text-box {
    margin: 3rem 0 0;
}

/* ==========================================
menu04
========================================== */

.menu04 {
    position: relative;
    padding: 9.4rem 0 15rem;
}

.menu04:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    margin: auto;
    width: 100%;
    height: 78.31%;
    background: url(../../../../uploads/menu_bg02.png) no-repeat center;
    background-size: cover;
    z-index: 2;
}

.menu04:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    margin: auto;
    width: 100%;
    height: 78.31%;
    background: var(--primary);
    background-size: cover;
    z-index: 1;
}

.menu04-frame01 {
    position: relative;
    z-index: 3;
}

.menu04-title-block {
    max-width: 32.1rem;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.menu04-title-box {
    padding: 0 0 2rem 0;
    border-bottom: .1rem solid;
}

.menu04-title-block .course-price02 {
    margin: 2rem auto 0;
}

.menu04-title {
    font-size: 3.5rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.menu04-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 7rem auto 0;
}

.menu04-left {
    max-width: 65.8rem;
    width: 53.06%;
    margin: 6.5rem 0 0;
}

.menu04-text-box {
    max-width: 55.6rem;
    width: 100%;
    margin: 0 auto;
}

.menu04-text-box .text01 {
    line-height: 2.25em;
}

.menu04-img {
    width: 100%;
    margin: 6rem 0 0;
}

.menu04-right {
    max-width: 50rem;
    width: 40.32%;
}

.menu04-right .menu-list-area {
    max-width: 50rem;
    width: 100%;
}

.menu04-right .menu-list-block-in {
    position: relative;
    padding: 3.8rem 1.5rem 5rem;
    border: 0 solid;
    background: rgba(255,255,255,.7);
}

.menu04-right .menu-list-block-in:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url(../../../../uploads/menu_textBox04.png) no-repeat center;
    background-size: cover;
    z-index: 4;
}

.menu04-right .menu-list-row {
    max-width: 36.2rem;
    position: relative;
    z-index: 5;
}

.menu-small-text {
    font-size: 1.4rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 2.25em
}

.menu-small-text br {
    display: none;
}

/* ==========================================
menu05
========================================== */

.menu05 {
    padding: 0 0 18.5em 0;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1920px) {

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1550px) {

    .menu01-frame {
        padding: 15rem 1.5rem 15rem;
    }


}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1024px) {

    .menu01-bg {
        position: static;
    }

    .menu01-frame {
        padding: 4rem 1.5rem 8rem;
    }

    .menu02 {
        padding: 8rem 0 8rem;
    }

    .menu02-text-block {
        padding: 6rem 1.5rem 6rem;
    }

    .menu02-text-block .title01 br {
        display: block;
    }

    
    .menu03 {
        padding: 0 0 8rem;
    }

    .menu03-item01-img01 {
        position: static;
        width: 100%;
        margin: 0 auto;
    }

    .menu03-item01-block {
        max-width: 92.8rem;
        width: 100%;
        margin: 0 auto;
        padding: 8rem 1.5rem 15.3rem;
    }

    .menu03-item01-title-block {
        max-width: 60rem;
        width: 100%;
    }

    .menu03-item01-text-block {
        position: relative;
        max-width: 60rem;
        width: 100%;
        margin: 0 auto;
        z-index: 5;
    }

    .menu03-item01-row {
        max-width: 92.8rem;
        width: 90%;
    }

    .menu03-item01-img02 {
        margin: 0;
    }

    .menu-list-area {
        max-width: 43rem;
        width: 45%;
        margin: 8rem 0 0;
    }

    .menu-list-block-in {
        padding: 3.8rem 1.5rem 3rem;
    }

    .menu04-left {
        width: 50%;
    }

    .menu04-right {
        width: 46.5%;
    }

    .menu05 {
        padding: 0 0 14rem 0;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 768px) {

    .menu02 {
            padding: 0rem 0 8rem;
    }

    .menu02-img01 {
        width: 80%;
        margin: 0 auto;
    }

    .menu02-text-block {
        max-width: 94.4rem;
        width: 100%;
        margin: -5rem auto 0;
        padding: 8rem 1.5rem 4rem;
    }

    .menu02-frame02 {
        flex-direction: column-reverse;
    }

    .menu02-img02 {
        width: 100%;
    }

    .menu02-text-box {
        width: 100%;
        margin: 4rem auto 0;
    }

    .menu03-item01-row {
        align-items: center;
        flex-direction: column;
    }

    .menu03-item01-img02 {
        width: 100%;
    }

    .menu-list-area {
        max-width: 56.9rem;
        width: 100%;
        margin: 4rem 0 0;
    }

    .menu03-frame02 {
        flex-direction: column;
        align-items: center;
    }


    .menu03-item01-img01.tb-block {
        width: 100%;
        max-width: 56.9rem;
        margin: 4rem auto 0;
    }

    .menu03-item02 {
        width: 100%;
    }

    .menu04 {
        padding: 8rem 0;
    }

    .menu04-row {
        flex-direction: column;
        align-items: center;
    }

    .menu04-left {
        width: 100%;
        margin: 0;
    }

    .menu04-right {
        width: 100%;
    }

    .menu04-right .menu-list-row {
        max-width: 24rem;
        width: 100%;
    }

    .menu-small-text br {
        display: block;
    }

    .menu05 {
        padding: 0 0 10rem 0;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 576px) {

    .menu01-bg {
        max-width: unset;
        width: auto;
        overflow: hidden;
        margin: 0 -1.5rem;
    }
    
    .menu01-bg > img {
        transform: scale(1.2);
    }

    .menu01-frame {
        padding: 4rem 0 8rem;
    }

    .menu01-text-box .text02 {
        text-align: left;
    }

    .menu02-img01 {
        width: 90%;
    }

    .menu02-img02 img {
        margin: 0 auto;
    }

    .menu03-item01-img01.tb-block {
        width: 90%;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */