/* location.css */
@charset 'utf-8';

@media screen and (max-width: 740px){/* SP */}
@media screen and (min-width: 741px){/* PC */}

/*==============================
LOCATION
==============================*/
/*---------- map ----------*/
.map_iframe { width: 100%; height: 400px; }
/*---------- map ----------*/
.access_caption .caption_title { margin-bottom: 0; }
.access_caption .caption_text { margin-bottom: 24px; }
.access_img { width: 60%; margin: 0 auto; }
@media screen and (max-width: 740px){/* SP */
    .access_img { width: 100%; }
}
/*---------- spot ----------*/
.spot_category { display: flex; flex-wrap: wrap; gap: 60px; }
.spot_category li { width: 100%; }
.spot_list { display: flex; flex-wrap: wrap; gap: 20px 40px; }
.spot_list li { display: flex; flex-direction: column; gap: 8px; width: calc(calc(100% - 120px) / 4); }
.spot_img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #777; }
.spot_info { line-height: 1.75em; }
@media screen and (max-width: 1024px){/* Pad */
    .spot_list li { width: calc(calc(100% - 80px) / 3); }
}
@media screen and (max-width: 740px){/* SP */
    .spot_list { gap: 12px 20px; }
    .spot_list li { width: calc(calc(100% - 20px) / 2); }
}