@charset "utf-8";

/**
FOOTER
**/
#footer {
    .footer {
        padding:30px 0;
        border-top:1px solid var(--color_main);
        .footer_inner {
            width:calc(100% - 60px);
            max-width:1200px;
            margin:0 auto;
            display:grid;
            justify-items:center;
            grid-row-gap:30px;
            .menu-fmenu-container {
                .menu {
                    display:flex;
                    flex-wrap:wrap;
                    gap:1em 2em;
                    justify-content:flex-start;
                    font-size:1.6rem
                }
            }
            .copy {
                font-size:1.2rem;
                font-weight:400;
                letter-spacing:.05em;
            }
        }
        &.menu2 {
            padding:0 0 10px;
            border:none;
            width:calc(100% - 150px);
            max-width:1200px;
            margin:0 auto;
            ul {
                display:flex;
                justify-content:flex-end;
                font-size:1.5rem;
                li {
                    padding:0 1em;
                    border-right:1px solid #000000;
                    border-left:1px solid #000000;
                    &:first-child {
                        border-right:none;
                    }
                }
            }
        }
    }
}


#fixbtn {
    position:fixed;
    z-index: 80;
    top:20vh;
    right:0;
    display:grid;
    grid-row-gap:15px;
    a {
        font-size:1.6rem;
        padding:1em 0;
        width:50px;
        display:grid;
        text-align:center;
        align-items:center;
        justify-content:center;
        justify-items:center;
        line-height:1;
        border-radius:6px 0 0 6px;
        font-weight:600;
        letter-spacing:.05em;
        span {
            color:#FFFFFF;
            writing-mode: vertical-rl;
            transform:translateX(.1em);
        }
        &:first-child {
            background-color:#e2750f;
            grid-template-columns:repeat(2,auto);
            grid-column-gap:.1em;
            span {
                &:first-child {
                    order:1;
                }
            }
        }
        &:last-child {
            background-color:#3f9c4f;
            grid-row-gap:.33em;
            img {
                width:1.75em;
            }
        }
    }
}

@media (hover:hover) {


    #footer {
        .footer {
            .footer_inner {
                .menu-fmenu-container {
                    .menu {
                        li {
                            a {
                                &:hover {
                                    opacity:1;
                                    color:var(--color_main);
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    
    
    #fixbtn {
        a {
            &:hover {
                opacity:1;
                transform:translateX(5px);
            }
        }
    }
    
}

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

}

@media screen and (max-width:1024px) {
    
    #footer {
        .footer {
            .footer_inner {
                width:calc(100% - 50px);
                .menu-fmenu-container {
                    .menu {
                        gap:1em;
                    }
                }
            }
        }
    }
    
}

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

    #footer {
        .footer {
            padding:20px 0 75px;
            .footer_inner {
                width:calc(100% - 40px);
                .menu-fmenu-container {
                    .menu {
                        gap:.66em 1em;
                        justify-content:center;
                        font-size:1.4rem;
                        max-width:20em;
                        margin:0 auto;
                    }
                }
                .copy {
                    font-size:1.1rem;
                }
            }
            &.menu2 {
                width:calc(100% - 40px);
                ul {
                    justify-content:center;
                    font-size:1.3rem;
                    li {
                        padding:0 .66em;
                    }
                }
            }
        }
    }
    
    
    #fixbtn {
        position:fixed;
        top:auto;
        bottom:0;
        right:auto;
        left:2px;
        display:grid;
        grid-template-columns:66% 1fr;
        grid-column-gap:2px;
        width:calc(100% - 4px);
		z-index:90;
        a {
            font-size:1.5rem;
            padding:.5em 0;
            width:auto;
            border-radius:6px 6px 0 0;
            letter-spacing:normal;
            span {
                writing-mode: unset;
                transform:translateX(0);
            }
            &:first-child {
                grid-template-columns:1fr;
                align-content:center;
                grid-row-gap:.33em;
                span {
                    &:first-child {
                        order:unset;
                    }
                }
            }
            &:last-child {
                background-color:#3f9c4f;
                grid-row-gap:.33em;
                img {
                    width:1.75em;
                }
            }
        }
    }

    #wpfront-scroll-top-container {
        width:40px;
        right:5px!important;
        bottom:60px!important;
    }
    .menuopen {   
        #wpfront-scroll-top-container {
            z-index:-1;
        }
    }

}