/* ========================================
//headerのナビゲーション
=========================================== */
#location .sub-nav-wrap {
    --sub-nav-bg: var(--color-gray);
}
#location .sub-nav { 
    --simple-w: calc(100% / 4);
    --simple-h: 30px;
    font-weight: bold;
    padding-inline: 10px;
    padding-block: var(--pad-4);
}
#location .sub-nav.location-list .width-limiter { --width-limit:970px; }
#location .sub-nav.location-list .location-block:last-child { margin-top: var(--space-3); }
#location .sub-nav.location-list .location-block h2 { 
    text-indent: .5em;
    font-size: 18px;
}
#location .sub-nav .location-block ul { margin-top: var(--space-1); }
#location .sub-nav .button.button-simple {
    font-weight: bold !important;
    border-width: 2px;
    padding: calc(var(--padding) / 2) 2px;
}
#location .sub-nav .button.button-simple span { 
    font-size: 14px;
    letter-spacing: 0;
}
/* ===== main ===== */
#location .title-group figure {
    --figure-w: 126px;
    --figure-h: 131px;
}
#location .bubble {
    --bubble-w: 269px;
    --bubble-h: 38px;
    left: clamp(0px, 18.7vw, 269px) !important;
}
#location .area-wrap .grid { grid-template-columns: repeat(auto-fill, 260px); }

/* ===== エリア用 ===== */
.area-wrap h3 { font-size: 1.375em; }
.area-wrap .button:hover { filter: none; }
.area-wrap .button.button-simple { cursor: auto !important; }
.area-wrap article { margin-top: var(--space-2); }
.area-wrap article .button.button-simple {
    min-width: auto;
    --simple-w: fit-content;
    --simple-h: 24px;
    --font-size: 14px;
    border-width: 1px;
    padding: 0 10px;
    font-weight: normal;
    line-height: var(--simple-h);
}
.area-wrap article { gap: var(--gap-3); }
.area-wrap article figure.location-image {
    border: var(--border-base);
    border-width: 3px;
    width: 260px;
    height: 180px;
}
.area-wrap article h4 { font-size: 1.375em;}
.area-wrap article h4 .button.button-simple { 
    border-width: 3px; 
}
.area-wrap article h4,
.area-wrap article a { position: static; }
.area-wrap article a::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}
.area-wrap article .icon-location {
    width: 25px;
    height: 34px;
}
.area-wrap article .icon-location + p { font-size: 14px; }
.area-wrap article .font-small { font-size: 12px; }
.area-wrap article > section { padding-block: 0; }
.area-wrap article h5 { margin-bottom: var(--space-1); }
.area-wrap article section > ul { --gap: .7em; }

.light-green .button.button-simple { --simple-bg-color: rgb(221, 235, 154); }
.light-pink .button.button-simple { --simple-bg-color: rgb(248, 179, 214); }

#kawasaki, #yokohama { padding-bottom: 0; }

/* ===== locationのフッター部分 ===== */
#footer-location {
    background-color: var(--color-light-gray);
    padding: 0;
}
#footer-location .map {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}
#footer-location iframe {
    height: calc(100% + 300px);
    position: relative;
    top: -150px;
}
#footer-location .main-content {
    padding: var(--pad-10) var(--pad-6);
    padding-bottom: 295px;
}
#footer-location .main-content .title-group .bubble {
    --bubble-w: 269px;
    background-color: var(--color-white);
    left: clamp(0px, 10vw, 180px);
    top: -50px;
}
#footer-location figure {
    width: clamp(90px, 10vw, 148px);
    aspect-ratio: 148 / 154;
    position: absolute;
    bottom: -560px;
    right:  0;
}
#footer-location .location-block {
    padding: 0;
    margin-top: var(--space-5);
}
#footer-location .location-block h3 { font-size: 1.25em; }
#footer-location .location-list .button.button-simple {
    min-width: unset;
    --simple-w: clamp(108px, 1vw, 116px);;
    aspect-ratio: 116 / 36;
    padding: 0; 
    font-size: clamp(14px, 1vw, 1em);
}
#footer-location .centering-box {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 120px;
    margin: auto;    
}

@media (max-width: 920px) {
    #location .bubble { 
        position: absolute;
        top: -20px !important; 
    }
}
@media (max-width: 768px) {
    #footer .location-cta a { padding-block: var(--pad-1) var(--pad-1);}
    #location .area-wrap .grid { 
         justify-content: center;
        grid-template-columns: repeat(auto-fit, ,minmax(260px, 1fr)); 
    }
}
@media (max-width: 520px) {
    #location .title-group { gap: var(--gap-3); }
    #location .title-group figure {
        width:200px;
        margin-inline:auto;
    }
    #location .location-block ul {justify-content: center;}
    #footer-location figure { 
        position: relative;
        bottom: 0; 
    }
    #footer-location .main-content {
        padding: var(--pad-8) var(--pad-4);
        padding-bottom: 295px;
    }
}