/* パソコン */
@media (1200px < width) {
    .d15bb675-b917-4cd4-9fb0-b4ad586bed3c {
        display: grid;
        grid-template:
            " f_grid f_grid ...... ...... " auto
            " f_grid f_grid ...... ...... " auto
            / 1fr 1fr 0.2fr 0.5fr;
    }
    .footer_grid {
        grid-area: f_grid;
        border-radius: 0 30px 0 0;
        background-color: var(--main-color2);
        display: grid;
        grid-template:
            " ...... ...... ...... ...... ...... " 20px
            " ...... fo_inf ...... fo_sns ...... " auto
            " ...... fo_inf ...... ...... ...... " 10px
            " ...... fo_inf ...... fo_map ...... " auto
            " ...... ...... ...... ...... ...... " 100px
            / 0.1fr 1fr 0.1fr 1fr 0.1fr;
    }
}

/* タブレット */
@media (768px <=width <=1200px) {
    .d15bb675-b917-4cd4-9fb0-b4ad586bed3c {
        display: grid;
        grid-template:
            " f_grid f_grid ...... ...... " auto
            " f_grid f_grid ...... ...... " auto
            / 1fr 1fr 0fr 0.3fr;
    }
    .footer_grid {
        grid-area: f_grid;
        border-radius: 0 30px 0 0;
        background-color: var(--main-color2);
        display: grid;
        grid-template:
            " ...... ...... ...... ...... ...... " 20px
            " ...... fo_inf ...... fo_sns ...... " auto
            " ...... fo_inf ...... ...... ...... " 10px
            " ...... fo_inf ...... fo_map ...... " auto
            " ...... ...... ...... ...... ...... " 100px
            / 0.1fr 1fr 0.1fr 1fr 0.1fr;
    }
}

/* スマホ */
@media (width < 768px) {
    .d15bb675-b917-4cd4-9fb0-b4ad586bed3c {
        display: grid;
        grid-template:
            " f_grid f_grid" auto
            " f_grid f_grid" auto
            / 1fr 1fr;
    }
    .footer_grid {
        grid-area: f_grid;
        border-radius: 0 30px 0 0;
        background-color: var(--main-color2);
        display: grid;
        grid-template:
            " ...... ...... ......" 20px
            " ...... fo_inf ......" auto
            " ...... ...... ......" 10px
            " ...... fo_sns ......" auto
            " ...... ...... ......" 10px
            " ...... fo_map ......" auto
            " ...... ...... ......" 100px
            / 0.1fr 1fr 0.1fr;
    }
}










.googlemap {
    grid-area: fo_map;
    height: 400px;
}




.footer_info {
    display: grid;
    grid-area: fo_inf;
    grid-template:
        " ...... ...... ...... " 10px
        " ...... f_titl ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_add ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_bus ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_tim ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_clo ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_tel ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_mai ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_par ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_cre ...... " auto
        " ...... ...... ...... " 10px
        " ...... fo_pay ...... " auto
        " ...... ...... ...... " 10px
        / 0fr 1fr 0fr;
}


.footer_info_title {
    grid-area: f_titl;
    overflow-wrap: anywhere;
}

.footer_address {
    grid-area: fo_add;
    overflow-wrap: anywhere;
}

.footer_business {
    grid-area: fo_bus;
    overflow-wrap: anywhere;
}

.footer_time {
    grid-area: fo_tim;
    overflow-wrap: anywhere;
}

.footer_closed {
    grid-area: fo_clo;
    overflow-wrap: anywhere;
}

.footer_tel {
    grid-area: fo_tel;
    overflow-wrap: anywhere;
}

.footer_parking {
    grid-area: fo_par;
    overflow-wrap: anywhere;
}

.footer_credit {
    grid-area: fo_cre;
    overflow-wrap: anywhere;
}

.footer_pay {
    grid-area: fo_pay;
    overflow-wrap: anywhere;
}
.footer_mail {
    grid-area: fo_mai;
    overflow-wrap: anywhere;
}



.footer_list {
    display: grid;
    grid-template:
        "....... ....... ....... ....... ......." 5px
        "....... inf_tit ....... inf_dat ......." auto
        "....... ....... ....... ....... ......." 5px
        / 0.1fr 1fr 0.1fr 2fr 0.1fr;
}

.info_title {
    grid-area: inf_tit;
}

.info_data {
    grid-area: inf_dat;
}





.footer_sns {
    grid-area: fo_sns;
    display: grid;
    grid-template:
        "...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ......" 10px
        "...... f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t f_sn_t ......" auto
        "...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ......" 10px
        "...... fo_s_1 ...... fo_s_2 ...... fo_s_3 ...... fo_s_4 ...... fo_s_5 ...... fo_s_6 ......" auto
        "...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ...... ......" 10px
        / 0.1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 0.1fr;
}

.footer_sns_title {
    grid-area: f_sn_t;
}

.footer_sns_1 {
    grid-area: fo_s_1;
}

.footer_sns_2 {
    grid-area: fo_s_2;
}

.footer_sns_3 {
    grid-area: fo_s_3;
}

.footer_sns_4 {
    grid-area: fo_s_4;
}

.footer_sns_5 {
    grid-area: fo_s_5;
}

.footer_sns_6 {
    grid-area: fo_s_6;
}

.footer_sns_icon {
    font-size: 35px;
}