footer{
    background-color: #333333;
    color: #fff;
}
footer > .container{
    max-width: var(--container-large-size);
    margin-left: auto;
    margin-right: auto;
    padding: 3em 1em;
}
footer .contents-area{
    display: flex;
    gap: clamp(1em,3vw,2em);
    justify-content: space-between;
    h3{
        margin-bottom: clamp(1em,3vw,2em);
    }
}
@media screen and (max-width:768px) { 
    .contents-area{
        flex-direction: column;
    } 
}
.footer-nav-01{
    padding: clamp(2em,6vw,3em) clamp(1em,3vw,2em);
    ul{
        list-style-type: none;
        padding-left: 0;
        li{
            a{
                color: var(--base-white-color);
                text-decoration: none;
            }
        }
    }
}
.footer-nav-02{
    padding: clamp(2em,6vw,3em) clamp(1em,3vw,2em);
    ul{
        list-style-type: none;
        padding-left: 0;
        li{
            a{
                color: var(--base-white-color);
                text-decoration: none;
                font-size: clamp(14px,1.6vw,16px);
            }
        }
    }
}
.footer-nav-03{
    padding: clamp(2em,6vw,3em) clamp(1em,3vw,2em);
    .footer-logo{
        width: clamp(100px,20vw,200px);
        margin-bottom: clamp(1em,3vw,2em);
    }
    dl{
        display: flex;
        dt{
            font-size: clamp(14px,1.6vw,16px);
            margin-right: 1em;
        }
        dd{
            margin-bottom: 0;
        }
    }
}
@media screen and (max-width:768px) { 
    .footer-nav-01,.footer-nav-02{
        border-bottom:1px solid var(--base-white-color);
    } 
}

.copyright-area{
    text-align: center;
}