@charset "utf-8";

/**
FOOTER
**/

#footer {
    overflow: clip;
    .footer_contact {
        background:url(../img/top/contact-bg.jpg) no-repeat center center/cover;
        .footer_contact_inner {
            width:calc(100% - 60px);
            max-width:1100px;
            margin:0 auto;
            padding:70px 0;
            text-align:center;
            h2 {
                font-size:2.0rem;
                line-height:1;
                margin-bottom:2em;
                display:grid;
                span {
                    font-size:5em;
                    font-weight:500;
                    font-style:italic;
                    color:var(--color_main);
                }
            }
            p {
                line-height:2;
                margin-bottom:2em;
            }
            .contents_inner {
                max-width:640px;
                margin:0 auto;
                display:grid;
                grid-template-columns:repeat(2,1fr);
                grid-gap:2.5%;
                .btn {
                    width:100%;
                    height:55px;
                    font-size:1.6rem;
                    line-height:1;
                    background-color:var(--color_main);
                    display:grid;
                    grid-template-columns:repeat(2,auto);
                    align-items:center;
                    justify-content:center;
                    grid-column-gap:1em;
                    color:#FFFFFF;
                    position:relative;
                    padding-right:1em;
                    img {
                        &:first-child {
                            width:1em;
                        }
                    }
                    .arrow {
                        width:1.25em;
                        position:absolute;
                        right:1em;
                        top:50%;
                        transform:translateY(-50%);
                    }
                    &.green {
                        background-color:var(--color_sub);
                        grid-column-gap:.33em;
                        img {
                            &:first-child {
                                width:2em;
                            }
                        }
                    }
                }
            }
        }
    }
    .footer {
        background-color:#F9F9F9;
        padding:75px 0;
        .footer_inner {
            max-width:1100px;
            width:calc(100% - 60px);
            margin:0 auto;
            display:grid;
            grid-template-columns:auto 1fr;
            grid-column-gap:10%;
            dl {
                dt {
                    max-width:220px;
                    margin-bottom:15px;
                }
                dd {
                    display:flex;
                    column-gap:15px;
                    img {
                        width:32px;
                    }
                }
            }
            .footer_menu {
                display:grid;
                grid-template-columns:repeat(4,auto);
                justify-content:space-between;
                grid-column-gap:3%;
                .menu {
                    display:grid;
                    grid-row-gap:1.5em;
                    font-size:1.6rem;
                    li {
                        line-height:1.3;
                    }
                    & > li {
                        & > a {
                            font-weight:500;
                        }
                    }
                    .sub-menu {
                        font-size:1.5rem;
                        padding-top:1em;
                        display:grid;
                        grid-row-gap:.66em;
                        li {
                            text-indent:-1.4em;
                            padding-left:1.4em;
                            &::before {
                                content:'ー';
                                margin:0 .2em;
                            }
                        }
                    }
                }
            }
        }
    }
    .footer_copy {
        background-color:#F9F9F9;
        padding-bottom:40px;
        .footer_inner {
            max-width:1100px;
            width:calc(100% - 60px);
            margin:0 auto;
            display:grid;
            grid-template-columns:repeat(2,auto);
            justify-content:space-between;
            align-items:center;
            font-size:1.5rem;
            letter-spacing:.05em;
            div[class^="menu-fmenu2-"] {
                .menu {
                    display:flex;
                    align-items:center;
                    column-gap:2em;
                    li {
                        position:relative;
                        a[target="_blank"] {
                            &::after {
                                content:'';
                                display:inline-block;
                                vertical-align:baseline;
                                width:1em;
                                height:1em;
                                background:url(../img/common/icon-open.svg) no-repeat center center/contain;
                                margin-left:.5em;
                                transform:translateY(.1em);
                            }
                        }
                    }
                }
            }
            .copyright {
                font-size:1.4rem;
            }
        }
    }
}

@media (hover:hover) {
}

@media screen and (max-width:1200px) {

}

@media screen and (max-width:1024px) {
    
    #footer {
        .footer_contact {
            .footer_contact_inner {
                width:calc(100% - 40px);
                padding:60px 0;
                h2 {
                    font-size:1.6rem;
                }
            }
        }
        .footer {
            padding:60px 0;
            .footer_inner {
                width:calc(100% - 40px);
                max-width:750px;
                grid-template-columns:1fr;
                grid-row-gap:60px;
                .footer_menu {
                    display:grid;
                    grid-template-columns:repeat(4,1fr);
                    justify-content:space-between;
                    grid-column-gap:3%;
                    max-width:750px;
                    width:100%;
                    .menu {
                        display:grid;
                        grid-row-gap:1.5em;
                    }
                }
            }
        }
        .footer_copy {
            .footer_inner {
                width:calc(100% - 40px);
            }
        }
    }
    
}

@media screen and (max-width:768px) {

    #footer {
        .footer_contact {
            .footer_contact_inner {
                h2 {
                    font-size:1.4rem;
                    margin-bottom:1.5em;
                    span {
                        font-size:3.2em;
                    }
                }
                p {
                    text-align:left;
                    margin-bottom:1.5em;
                }
                .contents_inner {
                    max-width:280px;
                    grid-template-columns:1fr;
                    grid-row-gap:10px;
                }
            }
        }
        .footer {
            .footer_inner {
                grid-row-gap:50px;
                dl {
                    dt {
                        max-width:150px;
                        margin-bottom:10px;
                    }
                    dd {
                        img {
                            width:24px;
                        }
                    }
                }
                .footer_menu {
                    grid-template-columns:1fr;
                    grid-row-gap:1.33em;
                    font-size:1.6rem;
                    .menu {
                        grid-row-gap:1.33em;
                        .sub-menu {
                            display:flex;
                            flex-wrap:wrap;
                            gap:.75em 1em;
                        }
                    }
                }
            }
        }
        .footer_copy {
            padding-bottom:20px;
            .footer_inner {
                grid-template-columns:1fr;
                font-size:1.4rem;
                grid-row-gap:30px;
                div[class^="menu-fmenu2-"] {
                    .menu {
                        flex-wrap:wrap;
                        gap:.75em 1.5em;
                    }
                }
                .copyright {
                    font-size:min(3.7vw,1.3rem);
                    text-align:center;
                }
            }
        }
    }

}