/** --------------------------------------------------------------- *
 *   Body
 *  --------------------------------------------------------------- */
.footer__body {
    width           : 100%;
    height          : 100%;
    margin          : 0;
    padding         : 0;
    box-sizing      : border-box;
}


/** --------------------------------------------------------------- *
 *   Breadcrumbs
 *  --------------------------------------------------------------- */
.footer-breadcrumbs-section {
    position        : relative;
    display         : flex;
    align-items     : center;
    width           : 100%;
    border-top      : solid 1px #707070;
    box-sizing      : border-box;
}
.footer-breadcrumbs__list {
    list-style      : none;
    display         : flex;
    align-items     : flex-end;
    margin          : 0;
    padding         : 0;
    width           : 100%;
}
.footer-breadcrumbs__item {
    position        : relative;
    display         : flex;
    align-items     : center;
    color           : #A3A3A3;
    max-width       : 30vw;
    overflow        : hidden;
}
.footer-breadcrumbs__item:last-child {
    max-width       : max-content;
}

.footer-breadcrumbs__item::before {
    content         : '>';
}
.footer-breadcrumbs__item:first-child::before {
    content         : none;
}
.footer-breadcrumbs__item-link {
    display         : flex;
    align-items     : center;
    color           : inherit;
    text-decoration : none;
    box-sizing      : border-box;
    overflow        : hidden;
}
.footer-breadcrumbs__item-link p {
    margin          : 0;
    white-space     : nowrap;
    overflow        : hidden;
    text-overflow   : ellipsis;
}

/** 共通テンプレート外breadcrumbs */
.footer-breadcrumbs_outrange {
    border-top      : 1px solid #747474;
    background-color: #000;
    color           : #A3A3A3;
    font-size       : 14px;
}
.footer-breadcrumbs_outrange>ol {
    align-items     : center;
    display         : flex;
}
.breadcrumb_outrange_item:nth-child(n+2):before{
    content         : '>';
    display         : inline-block;
    padding         : 0 10px;
}

/** --------------------------------------------------------------- *
 *   Information
 *  --------------------------------------------------------------- */
.footer-information-section {
    position        : relative;
    display         : flex;
    align-items     : center;
    color           : #A3A3A3;
    border-top      : solid 1px #707070;
    box-sizing      : border-box;
}


/** =============================================================== *
 *   phone-portrait（300px-560px）
 *  =============================================================== */
@media screen and (max-width: 561px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 12px;
        height          : 45px;
        font-size       : 1.2em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 28px;
        min-width       : 28px;
        max-width       : 28px;
        height          : 12px;
        min-height      : 12px;
        max-height      : 12px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 6px;
    }
    .footer-information-section {
        padding         : 0 0 0 12px;
        height          : 58px;
        font-size       : 1.0em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 12px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 45px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 28px;
        min-width       : 28px;
        max-width       : 28px;
        height          : 12px;
        min-height      : 12px;
        max-height      : 12px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.0em;
    }
}

/** =============================================================== *
 *   phone-landscape （561px〜767px）
 *  =============================================================== */
@media screen and (min-width: 561px) and (max-width: 768px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 22px;
        height          : 51px;
        font-size       : 1.2em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 33px;
        min-width       : 33px;
        max-width       : 33px;
        height          : 14px;
        min-height      : 14px;
        max-height      : 14px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 8px;
    }
    .footer-information-section {
        padding         : 0 0 0 22px;
        height          : 71px;
        font-size       : 1.1em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 22px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 51px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 33px;
        min-width       : 33px;
        max-width       : 33px;
        height          : 14px;
        min-height      : 14px;
        max-height      : 14px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.2em;
    }
}

/** =============================================================== *
 *   tablet-portrait （768〜1193px）
 *  =============================================================== */
@media screen and (min-width: 768px) and (max-width: 1194px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 32px;
        height          : 57px;
        font-size       : 1.2em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 38px;
        min-width       : 38px;
        max-width       : 38px;
        height          : 16px;
        min-height      : 16px;
        max-height      : 16px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 10px;
    }
    .footer-information-section {
        padding         : 0 0 0 32px;
        height          : 76px;
        font-size       : 1.2em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 32px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 57px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 38px;
        min-width       : 38px;
        max-width       : 38px;
        height          : 16px;
        min-height      : 16px;
        max-height      : 16px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.2em;
    }
}

/** =============================================================== *
 *   tablet-landscape （1194〜1349px）
 *  =============================================================== */
@media screen and (min-width: 1194px) and (max-width: 1350px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 48px;
        height          : 61px;
        font-size       : 1.3em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 38px;
        min-width       : 38px;
        max-width       : 38px;
        height          : 16px;
        min-height      : 16px;
        max-height      : 16px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 10px;
    }
    .footer-information-section {
        padding         : 0 0 0 48px;
        height          : 84px;
        font-size       : 1.2em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 48px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 61px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 38px;
        min-width       : 38px;
        max-width       : 38px;
        height          : 16px;
        min-height      : 16px;
        max-height      : 16px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.3em;
    }
}

/** =============================================================== *
 *   laptop （1350〜1899px）
 *  =============================================================== */
@media screen and (min-width: 1350px) and (max-width: 1900px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 54px;
        height          : 68px;
        font-size       : 1.3em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 44px;
        min-width       : 44px;
        max-width       : 44px;
        height          : 19px;
        min-height      : 19px;
        max-height      : 19px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 10px;
    }
    .footer-information-section {
        padding         : 0 0 0 54px;
        height          : 108px;
        font-size       : 1.2em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 54px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 68px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 44px;
        min-width       : 44px;
        max-width       : 44px;
        height          : 19px;
        min-height      : 19px;
        max-height      : 19px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.3em;
    }
}

/** =============================================================== *
 *   desktop (1900px〜)
 *  =============================================================== */
@media screen and (min-width: 1900px) {
    .footer-breadcrumbs-section {
        padding         : 0 0 0 329px;
        height          : 68px;
        font-size       : 1.3em;
    }
    .footer-breadcrumbs__item:first-child, .footer-breadcrumbs__item:first-child .footer-breadcrumbs__item-link {
        width           : 44px;
        min-width       : 44px;
        max-width       : 44px;
        height          : 19px;
        min-height      : 19px;
        max-height      : 19px;
    }
    .footer-breadcrumbs__item-link:first-child svg {
        width           : 100%;
        height          : 100%;
    }
    .footer-breadcrumbs__item::before {
        margin          : 0 10px;
    }
    .footer-information-section {
        padding         : 0 0 0 329px;
        height          : 108px;
        font-size       : 1.2em;
    }

    /** 共通テンプレート外breadcrumbs */
    .footer-breadcrumbs_outrange {
        padding         : 0px 0px 0px 329px;
    }
    .footer-breadcrumbs_outrange>ol {
        height          : 68px;
    }
    .breadcrumb_outrange_item:nth-child(1){
        width           : 44px;
        min-width       : 44px;
        max-width       : 44px;
        height          : 19px;
        min-height      : 19px;
        max-height      : 19px;
    }
    .breadcrumb_outrange_item:nth-child(n+2):before{
        font-size       : 1.3em;
    }
}