@charset "utf-8";
.main-hero-section {padding-block: var(--space-100); background: linear-gradient(180deg,#E7F4F2 50%, #fff 100%); background-image: url(/img/main-hero-bg.webp); background-repeat: no-repeat; background-size: cover;}
.main-hero-section .inner {max-width: 795px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; row-gap: var(--space-60);}
.main-hero-section .tit-wrap {display: flex; flex-direction: column; align-items: center; row-gap: var(--fs-20); text-align: center;}
.main-hero-section .tit-wrap .body-large {color: var(--color-gray8);}

/* 이벤트 배너 섹션 */
.main-event-section a {display: block; width: 100%; height: var(--space240); border-radius: var(--fs-20); overflow: hidden; background-color: var(--color-static3);}

/* 인기관광지 주변매장 */
.spot-swiper {position: relative; margin-top: var(--fs-28);}
.spot-swiper .swiper-slide {height: auto;}
.spot-swiper .swiper-nav-btn {top: var(--nav-top, 50%);}
.spot-card {position: relative; display: block; overflow: hidden; border-radius: var(--radius);}
.spot-card .img-wrap {display: block; overflow: hidden; aspect-ratio: 491 / 360;}
.spot-card .img-wrap img {width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s;}
.spot-card:hover .img-wrap img {transform: scale(1.05);}
.spot-card .txt-wrap {height: 100%; position: absolute; inset: auto 0 0 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: var(--space-24); background-image: linear-gradient(180deg,rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1) 100%);}
.spot-card .spot-area {color: var(--color-white);}
.spot-card .spot-name {display: block; color: var(--color-white); margin-bottom: 8px;}
.spot-card .spot-desc {color: var(--color-white);}
.spot-card:focus-visible {outline: 2px solid var(--color-static1); outline-offset: -2px;}

/* 자주묻는질문 */
.main-faq-section {display: grid; grid-template-columns: 240px 1fr; gap: var(--space-40);}
@media screen and (max-width: 1024px) {
    .main-faq-section {grid-template-columns: 1fr;}
