/*------------------------------------------------------*/
/* footer
/*------------------------------------------------------*/
div#footer {
    margin-top: 36px;
    background-color: #f2f2f2;
}

div#footer div.inner {
    padding: 16px;
}

div#footer div.utility {
    margin-bottom: 12px;
}

div#footer div.utility ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

div#footer div.utility ul li {
    padding: 0 16px;
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    margin: 8px 0;
    display: flex;
    align-items: center;
    height: 20px;
}

/* AF版 - デフォルトは非表示 */
div#footer div.utility ul li.footer_utility_af {
    display: none;
}

div#footer div.utility ul li.footer_utility_pc {
    display: flex;
}
@media (max-width: 768px) {
    div#footer div.utility ul li.footer_utility_pc {
        display: none;
    }
}

div#footer div.utility ul li.footer_utility_sp {
    display: none;
}
@media (max-width: 768px) {
    div#footer div.utility ul li.footer_utility_sp {
        display: flex;
    }
}

/* AF判定時 - AF版を表示、PC/SP版を非表示 */
div#footer div.is-af div.utility ul li.footer_utility_pc {
    display: none;
}
div#footer div.is-af div.utility ul li.footer_utility_sp {
    display: none;
}
div#footer div.is-af div.utility ul li.footer_utility_af {
    display: flex;
}

div#footer li#logout_btn {
    display: none;
}

div#logged_in li#logout_btn {
    display: inline-block !important;
    border: none;
}

div#footer a:link,
div#footer a:visited {
    color: #1b1b1b;
    text-decoration: none;
}
@media (max-width: 768px) {
    div#footer a:link,
    div#footer a:visited {
        color: #1b1b1b;
    }
}

div#footer a:hover {
    color: #a9a9a9;
}

div#footer div.copyright {
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    gap: 12px;
    font-size: 10px;
    color: #777777;
}
@media (max-width: 768px) {
    div#footer div.copyright {
        flex-direction: column;
        gap: 0;
    }

    /* AFがgap効かないためmarginで調整 */
    div#footer div.copyright > * + * {
        margin-top: 12px;
    }
}
/* footer End--------------------------------- */