@charset "UTF-8"; /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
footer {
    background: var(--theme_m_color);
    padding: 10rem 0 5rem;
    color: #fff;
}

footer .feather_bg::before {
    background-image: url("../images/common/index_footer_hane2.png");
    width: 22.5rem;
    height: 23.2rem;
    top: 13rem;
    left: 6rem;
    z-index: 1;
}

@media (max-width: 1700px) {
    footer .feather_bg::before {
        left: 0;
    }
}

footer .feather_bg::after {
    background-image: url("../images/common/index_footer_hane1.png");
    width: 28.4rem;
    height: 25.8rem;
    top: -23rem;
    right: 5rem;
    z-index: 1;
}

footer .base_width {
    max-width: 110rem;
    min-width: 110rem;
}

footer .f_inner {
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 7.5rem;
}


footer .f_inner .info_area p.name_top {
    letter-spacing: .1em;
    font-size: 2rem;
}

footer .f_inner .info_area p.school_name {
    font-size: 3.8rem;
    letter-spacing: .1em;
    margin-bottom: 1rem;
}

footer .f_inner .info_area .info_grid {
    width: 51rem;
    grid-template-columns: 1fr 8rem;
    gap: 2rem;
}


footer .f_inner .info_area .info_grid .contact_info .addr p {
    font-size: 2rem;
}

footer .f_inner .info_area .info_grid .contact_info .tel p {
    font-size: 3.2rem;
    letter-spacing: .06em;
    display: flex;
    align-items: center;
}

footer .f_inner .info_area .info_grid .contact_info .tel p .TEL {
    font-size: 70%;
}

footer .f_inner .info_area .info_grid .contact_info .tel p .num {
    font-family: "Jost", sans-serif;
}

footer .f_inner .info_area .info_grid p.insta a {
    width: 8rem;
    display: block;
}

footer .f_inner .info_area .info_grid p.insta a:hover {
    opacity: .7;
}

footer .f_inner .f_btn_wrap {
    margin-top: 1rem;
    display: grid;
    gap: 2rem;
}

footer .f_inner .f_btn_wrap p.btn.cmn_btn a {
    width: 40rem;
    color: var(--theme_m_color);
    font-size: 2.6rem;
}

@media (min-width: 769px) { 
    footer .f_inner .f_btn_wrap p.btn.cmn_btn a:hover {
        color: #fff;
        background: var(--theme_m_color);
        border-color: #fff;
    }
    
    footer .f_inner .f_btn_wrap p.btn.cmn_btn a:hover::after {
        background: #fff;
    }
}

footer .f_nav_wrap {
    justify-content: space-between;
    gap: 2.5rem;
    margin-bottom: 8.5rem;
    flex-wrap: nowrap;
}

footer .f_nav_wrap .f_nav_item h3.ttl {
    font-size: 2rem;
    letter-spacing: .1em;
    margin-bottom: 2rem;
}

footer .f_nav_wrap .f_nav_item ul.f_nav_menu {
    display: grid;
    gap: 1.8rem;
}

footer .f_nav_wrap .f_nav_item ul.f_nav_menu li a {
    font-size: 1.6rem;
    color: #fff;
    padding-left: 1em;
    position: relative;
    display: block;
    line-height: 1.5;
}

footer .f_nav_wrap .f_nav_item ul.f_nav_menu li a::before {
    position: absolute;
    content: "";
    width: .5em;
    height: 1px;
    top: .85em;
    left: -0.3em;
    background: #fff;
}

footer .f_nav_wrap .f_nav_item ul.f_nav_menu li a:hover {
    opacity: .7;
}

footer .f_bottom > .f_wrap {
    justify-content: space-between;
    align-items: center;
}

footer .f_bottom p.privacy a {
    font-size: 1.8rem;
    color: #fff;
}

footer .f_bottom ul.other_scool {
    gap: 3rem;
}

footer .f_bottom ul.other_scool li a {
    font-size: 1.6rem;
    color: #fff;
    padding-left: 2rem;
    position: relative;
}

footer .f_bottom ul.other_scool li a::before {
    position: absolute;
    content: "";
    mask: url("../images/common/main_arrow.svg") no-repeat 50% / contain;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 1rem;
    height: 1rem;
    background-color: #fff;
}

footer .f_bottom p.copyright {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 5rem;
}

footer .f_bottom a:hover {
    opacity: .7;
}

@media screen and (max-width: 768px) {
    /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */footer {
        padding: 11rem 0 14rem;
    }

    footer .feather_bg::before {
        content: none;
    }

    footer .base_width {
        min-width: auto;
    }

    footer .f_inner {
        gap: 5rem;
        margin-bottom: 11rem;
        justify-content: center;
    }

    footer .f_inner .info_area {
        padding: 0 3rem 0 2rem;
        width: 100%;
    }

    footer .f_inner .info_area p.name_top {
        font-size: 2.8rem;
        letter-spacing: .12em;
        margin-bottom: 0;
    }

    footer .f_inner .info_area p.school_name {
        letter-spacing: .12em;
        font-size: 4.6rem;
        margin-bottom: 1.5rem;
        line-height: 1.35;
    }

    footer .f_inner .info_area .info_grid {
        grid-template-columns: 1fr 13rem;
        width: 100%;
        align-items: flex-end;
    }

    footer .f_inner .info_area .info_grid .contact_info .addr {
        font-size: 2.8rem;
    }

    footer .f_inner .info_area .info_grid .contact_info .addr p {
        font-size: 3rem;
    }

    footer .f_inner .info_area .info_grid .contact_info .tel p {
        align-items: center;
    }

    footer .f_inner .info_area .info_grid .contact_info .tel p .TEL {
        font-size: 2.2rem;
        margin-right: 1rem;
        display: block;
        margin-top: 1rem;
    }

    footer .f_inner .info_area .info_grid .contact_info .tel p .num {
        font-size: 3.8rem;
        display: block;
    }

    footer .f_inner .info_area .info_grid p.insta {
        margin-bottom: 1.5rem;
    }

    footer .f_inner .info_area .info_grid p.insta a {
        width: 13rem;
    }

    footer .f_inner .f_btn_wrap {
        gap: 3rem;
    }

    footer .f_inner .f_btn_wrap p.btn.cmn_btn a {
        width: 60rem;
        min-height: 14rem;
        border-radius: 7rem;
        font-size: 3.6rem;
    }

    footer .f_nav_wrap {
        display: grid;
        grid-template-columns: repeat(2 , 1fr);
        gap: 8rem 0rem;
        /* width: 100vw; */
        /* margin: 0 calc(50% - 50vw) 10rem; */
        /* padding: 0 3rem; */
        margin-bottom: 14rem;
    }

    footer .f_nav_wrap .f_nav_item h3.ttl {
        font-size: 3rem;
    }

    footer .f_nav_wrap .f_nav_item ul.f_nav_menu li a {
        font-size: 2.8rem;
        white-space: nowrap;
    }

    footer .f_nav_wrap .f_nav_item ul.f_nav_menu li a::before {
        left: 0;
    }

    footer .f_bottom > .f_wrap {
        flex-direction: column-reverse;
        align-items: flex-start;
    }

    footer .f_bottom p.privacy {
        width: 100%;
    }

    footer .f_bottom p.privacy a {
        font-size: 3rem;
        display: table;
        margin: 0 auto;
    }

    footer .f_bottom ul.other_scool {
        gap: 1rem 6rem;
        margin-bottom: 6rem;
        padding-left: 2rem;
    }

    footer .f_bottom ul.other_scool li a {
        font-size: 3rem;
        padding-left: 3rem;
    }

    footer .f_bottom ul.other_scool li a::before {
        width: 1.5rem;
        height: 1.5rem;
    }

    footer .f_bottom p.copyright {
        font-size: 2rem;
        margin-top: 3rem;
    }

    footer .f_bottom a:hover {
    }
}

/**********************************
スマホ固定
**********************************/
.sp_fixed_bottom {
    opacity: 0;
    visibility: hidden;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 1500;
    position: fixed;
    transition: .2s ease-in;
}

.sp_fixed_bottom.active {
    opacity: 1;
    visibility: visible;
}

.sp_fixed_bottom .sp_nav_menu02 {
    display: grid;
    grid-template-columns:repeat(3,1fr);
    justify-content: center;
    margin: 0;
    padding: 0;
}

.sp_fixed_bottom .sp_nav_menu02 li {
    list-style: none;
}

.sp_fixed_bottom .sp_nav_menu02 li a {
    height: 14rem;
    background: #fff;
    color: var(--theme_m_color);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.6rem;
    font-weight: 600;
    padding-top: 4rem;
    position: relative;
}

.sp_fixed_bottom .sp_nav_menu02 li a::before {
    content: "";
    position: absolute;
    background: no-repeat 50%/ contain;
    top: 3rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 4.5rem;
}

.sp_fixed_bottom .sp_nav_menu02 li.topics a::before {
    height: 3.2rem;
    background-image: url("../images/common/tab_icon_topics.svg");
}

.sp_fixed_bottom .sp_nav_menu02 li.exam a::before {
    height: 3.7rem;
    background-image: url("../images/common/tab_icon_exam.svg");
}

.sp_fixed_bottom .sp_nav_menu02 li.graduate a::before {
    height: 3.2rem;
    background-image: url("../images/common/tab_icon_sotugyo.svg");
}

.sp_fixed_bottom .sp_nav_menu02 li:not(:last-child) a::after {
    position: absolute;
    content: "";
    background: #CCCCCC;
    width: 1px;
    height: 58%;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto 0;
}
