@charset "UTF-8";

/* merge-build.js 산출물 — 납품 시 css/sections/*.css 전량이 이 아래로 합쳐진다. 손으로 쓰지 않는다(CLAUDE.md 원칙 14). */
/* merge-build:acon03 */
/* acon03 — 공용 조각(sub01·sub04) · 카드 간격은 slide.js spaceBetween. 모바일: 슬라이드 1장 노출 후보, 화살표 유지 */
.acon03 {
  background-color: #fff;
}

.acon03_iner {
  padding-top: calc(var(--px)*148);
  padding-bottom: calc(var(--px)*163);
}

.acon03__title {
  text-transform: uppercase;
}

.acon03__slider {
  width: calc(var(--px)*1432);
  margin-top: calc(var(--px)*64);
}

.acon03__card-body {
  padding-top: calc(var(--px)*60);
  padding-bottom: calc(var(--px)*51.45);
  gap: calc(var(--px)*12);
}

.acon03__card-desc {
  margin-top: calc(var(--px)*14);
}

.acon03__nav {
  gap: calc(var(--px)*15);
  margin-top: calc(var(--px)*77);
}

.acon03__nav-btn {
  width: calc(var(--px)*84);
  padding-block: calc(var(--px)*13.5);
  border-radius: 50vw;
  background-color: #090909;
  transition: background-color .25s ease-out;
}

.acon03__nav-btn--prev .acon03__nav-glyph {
  transform: scaleX(-1);
}

@media (hover:hover) {
  .acon03__nav-btn:hover {
    background-color: var(--secondary);
  }
}

.acon03__nav-btn:focus-visible {
  background-color: var(--secondary);
}

/* FONT:AUTO acon03 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.acon03 {
    text-align: center;
}

.acon03__title {
    font-family: var(--font-ackbar);
    font-size: var(--titleL);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.2;  /* OVR */
    color: #090909;
}

.acon03__card-status {
    font-family: var(--font-poppins);
    font-size: var(--titleXS);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1;
    color: #ffffff;
}

.acon03__card-desc {
    font-family: var(--font-noto);
    font-size: var(--bodyS);
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 1.37;
    color: #c87d7d;
}

.acon03__card-name {
    font-family: var(--font-noto);
    font-size: var(--headL);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1;
    color: #ffffff;
}

.acon03__nav {
    font-family: var(--font-suite);
    font-size: var(--subheadL);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1;  /* OVR */
    color: #ffffff;
}
/* /FONT:AUTO acon03 END */

/* INK:AUTO acon03 */
.acon03__title { margin-top: calc(var(--px) * -11.5); margin-bottom: calc(var(--px) * -11.5); } /* base 0,0 */
.acon03__card-status { margin-top: calc(var(--px) * -6.5); margin-bottom: calc(var(--px) * -2.5); } /* base 0,0 */
.acon03__card-desc { margin-top: calc(var(--px) * 9.23); margin-bottom: calc(var(--px) * -1.77); } /* base 13,0 */
.acon03__card-name { margin-top: calc(var(--px) * -3); margin-bottom: calc(var(--px) * 1); } /* base 0,0 */
/* /INK:AUTO acon03 END */

@media (max-width:599px) {
  .acon03_iner {
    padding-top: 17.0667vw;
    padding-bottom: 17.0667vw;
  }

  .acon03__slider {
    width: 100%;
    margin-top: 10.6667vw;
  }

  .acon03__card-body {
    padding-top: 8.5333vw;
    padding-bottom: 8.5333vw;
    gap: 2.1333vw;
  }

  .acon03__nav {
    gap: 2.1333vw;
    margin-top: 12.8vw;
  }

  .acon03__nav-btn {
    width: 12.8vw;
    padding-block: 2.1333vw;
  }

  .acon03__title { margin-top: -0.23em; margin-bottom: -0.23em; } /* INK -11.5/50 */
  .acon03__card-status { margin-top: -0.1857em; margin-bottom: -0.0714em; } /* INK /35 */
  .acon03__card-desc { margin-top: calc(2.1333vw - 0.2513em); margin-bottom: -0.118em; } /* base 8px + INK -3.77/15 */
  .acon03__card-name { margin-top: -0.0938em; margin-bottom: 0.0313em; } /* INK /32 */
}

/* /merge-build:acon03 */
/* merge-build:dcon01 */
/* dcon01 — 매장 위치 페이지 헤드 배너(배경 사진 + 중앙 타이틀) */
.dcon01 {
  /* HEIGHT: 배경 PNG 원본 비율(1905x647) 그대로 — 뷰포트·4:3 기준 폐기(고객 수정 2026-10-08, 확대·과다 높이) */
  aspect-ratio: 1905 / 647;
}

.dcon01 > .bg_img {
  object-position: 50% 0; /* dcon01_02 = 원본 사진 재합성(시안 영역은 위에서 85행) — 위 기준으로 잘라 제목·사진 관계 유지 */
}

.dcon01_iner {
  height: 100%;
  justify-content: center;
  padding: calc(var(--px)*96) 0 calc(var(--px)*94); /* 떠 있는 헤더 하단(96) · 하단 퀵바 94 사이 보이는 영역의 가운데 */
}

.dcon01__title {
  text-transform: uppercase;
}

/* FONT:AUTO dcon01 */
/* spec.json 파생 (tools/spec-font-to-css.js · unit=--px) — 재생성 대상, 직접 수정 금지 */
/* 예외: line-height · letter-spacing 는 값을 고치고 뒤에 OVR 주석을 붙이면 재생성이 보존한다 */
.dcon01__title {
    font-family: var(--font-ackbar);
    font-size: var(--displayL);
    font-weight: 400;
    letter-spacing: -0.01em;
    line-height: 1.2;  /* OVR */
    text-align: center;
    color: #ffffff;
}
/* /FONT:AUTO dcon01 END */

/* INK:AUTO dcon01 */
.dcon01__title { margin-top: calc(var(--px) * -17.9); margin-bottom: calc(var(--px) * -18.9); } /* base 0,0 */
/* /INK:AUTO dcon01 END */

@media (max-width:599px) {
  .dcon01 {
    aspect-ratio: auto;
    height: auto;
  }

  .dcon01 > .bg_img {
    top: -15.343%; /* 시안 영역(85행부터 554행)이 섹션에 맞게 — 원본 647행 기준 */
    height: 116.787%;
  }

  .dcon01_iner {
    height: auto;
    padding: 36.3333vw 0 17.0667vw;
  }

  .dcon01__title {
    margin-top: -3.8066vw;
    margin-bottom: -4.0192vw;
  }
}


/* /merge-build:dcon01 */
/* merge-build:store-map */
/* store-map — 공용 조각(sub01·sub04): 매장 검색 + 리스트 + 카카오맵 + 상세팝업 */
.smap {
    background: #ffffff;
    padding-top: 8.083990vw;
    padding-bottom: 4.619423vw;
}

.smap,
.smap * {
    box-sizing: border-box;
}

.smap img {
    display: block;
    width: 100%;
}

.smap_title {
    margin-top: 0.000000vw;
    align-self: center;
    width: calc(var(--px) * 246);
    aspect-ratio: 246 / 37;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ── 검색 (#31) ── */
.smap_search {
    display: flex;
    align-items: center;
    align-self: center;
    margin-top: 2.527034vw;
    width: calc(var(--px) * 640);
    height: calc(var(--px) * 62);
    padding-left: 1.679790vw;
    padding-right: 0.524934vw;
    border: 1px solid #0c0c0c;
    border-radius: calc(var(--px) * 31);
    background: #ffffff;
}

.smap_search_input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    background: transparent;
    font-family: var(--mf);
    font-weight: 400;
    font-size: var(--fs-17);
    letter-spacing: -0.05em;
    color: #0c0c0c;
    outline: none;
}

.smap_search_btn {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 48);
    height: calc(var(--px) * 48);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #db1e1e;
    color: #ffffff;
    cursor: pointer;
}

/* 돋보기 = 인라인 SVG. fill:currentcolor 라 버튼 color 로 색이 결정됨 */
.smap_search_icon {
    display: block;
    width: calc(var(--px) * 24);
    height: calc(var(--px) * 24);
}

/* ── 리스트 + 지도 (#31) ── */
.smap_map_wrap {
    display: flex;
    align-self: center;
    margin-top: 2.099738vw;
    width: 100%;
    height: calc(var(--px) * 720);
    border: 1px solid #e0dcd5;
}

.smap_list {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    width: calc(var(--px) * 520);
    height: 100.000000%;
    overflow-y: auto;
    border-right: 1px solid #e0dcd5;
    background: #ffffff;
}

.smap_list_empty,
.smap_list_noresult {
    margin: 0;
    padding: 2.624672vw 0;
    font-family: var(--mf);
    font-weight: 400;
    font-size: var(--fs-17);
    letter-spacing: -0.05em;
    color: #8c8c8c;
    text-align: center;
}

/* 검색 결과 0건일 때만 JS 가 노출 */
.smap_list_noresult {
    display: none;
}

.smap_item {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    padding: 1.679790vw 3.149606vw 1.679790vw 1.942257vw;
    border-bottom: 1px solid #e0dcd5;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.smap_item:hover,
.smap_item.is-active {
    background: #faf8f5;
}

.smap_item.is-active {
    border-left: 3px solid #db1e1e;
}

.smap_item_name_row {
    display: flex;
    align-items: center;
    width: 100.000000%;
}

.smap_item_name_icon {
    flex: 0 0 auto;
    width: calc(var(--px) * 33);
    aspect-ratio: 33 / 36;
    display: flex;
    justify-content: center;
    align-items: center;
}

.smap_item_name {
    margin: 0 0 0 1.102362vw;
    font-family: var(--mf);
    font-weight: 700;
    font-size: var(--fs-22);
    line-height: 1.136;
    letter-spacing: -0.05em;
    color: #0c0c0c;
    white-space: nowrap;
}

/* 상세팝업 열기 — 카드 우상단 + 버튼 */
.smap_plus_btn {
    position: absolute;
    top: 1.679790vw;
    right: 1.259843vw;
    width: calc(var(--px) * 34);
    height: calc(var(--px) * 34);
    padding: 0;
    border: 1px solid #e0dcd5;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
}

.smap_plus_btn::before,
.smap_plus_btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: #0c0c0c;
    transform: translate(-50%, -50%);
}

.smap_plus_btn::before {
    width: calc(var(--px) * 14);
    height: 2px;
}

.smap_plus_btn::after {
    width: 2px;
    height: calc(var(--px) * 14);
}

.smap_item:hover .smap_plus_btn {
    border-color: #db1e1e;
    background: #db1e1e;
}

.smap_item:hover .smap_plus_btn::before,
.smap_item:hover .smap_plus_btn::after {
    background: #ffffff;
}

.smap_map {
    flex: 1 1 auto;
    min-width: 0;
    height: 100.000000%;
}

.smap_map_inner {
    width: 100.000000%;
    height: 100.000000%;
}

/* 지도 위 매장명 말풍선 (JS 생성) */
/* ★ position:relative 필수 — 없으면 _tail 의 absolute 기준이 카카오 CustomOverlay
   래퍼가 되어 말풍선과 어긋날 여지가 생긴다. */
.smap_bubble {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.524934vw 1.049869vw;
    border-radius: calc(var(--px) * 6);
    background: #0c0c0c;
    white-space: nowrap;
}

.smap_bubble_text {
    font-family: var(--mf);
    font-weight: 700;
    font-size: var(--fs-15);
    letter-spacing: -0.05em;
    color: #ffffff;
}

.smap_bubble_tail {
    position: absolute;
    bottom: calc(var(--px) * -6);
    left: 50%;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #0c0c0c;
    transform: translateX(-50%);
}

/* ── 매장 상세 팝업 (#32) ── */
.smap_popup {
    position: fixed;
    inset: 0;
    display: none;
    justify-content: center;
    align-items: center;
    background: rgba(12, 12, 12, 0.62);
    z-index: 999;
}

.smap_popup.is-open {
    display: flex;
}

.smap_popup_card {
    display: flex;
    width: calc(var(--px) * 880);
    padding: 2.099738vw;
    border-radius: calc(var(--px) * 12);
    background: #ffffff;
}

.smap_popup_close {
    position: absolute;
    top: 1.049869vw;
    right: 1.049869vw;
    width: calc(var(--px) * 34);
    height: calc(var(--px) * 34);
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.smap_popup_close::before,
.smap_popup_close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(var(--px) * 20);
    height: 2px;
    background: #0c0c0c;
}

.smap_popup_close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.smap_popup_close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.smap_popup_photo {
    flex: 0 0 auto;
    width: calc(var(--px) * 400);
    aspect-ratio: 475 / 260;
    overflow: hidden;
    border-radius: calc(var(--px) * 8);
}

.smap_popup_photo img {
    width: 100.000000%;
    height: 100.000000%;
    object-fit: cover;
}

.smap_popup_info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    margin-left: 2.099738vw;
}

.smap_popup_name {
    margin: 0;
    font-family: var(--mf);
    font-weight: 700;
    font-size: var(--fs-32);
    line-height: 1.2;
    letter-spacing: -0.05em;
    color: #0c0c0c;
    white-space: nowrap;
}

.smap_popup_divider {
    margin-top: 1.049869vw;
    width: 100.000000%;
    height: 1px;
    background: #e0dcd5;
}

.smap_popup_addr,
.smap_popup_time,
.smap_popup_tel {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 0 0 0.629921vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: var(--fs-17);
    line-height: 1.687;
    letter-spacing: -0.05em;
    color: #0c0c0c;
}

.smap_popup_row_address {
    margin-top: 1.312336vw;
}

.smap_popup_naver {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.679790vw;
    width: calc(var(--px) * 128);
    aspect-ratio: 128 / 34;
}

.smap_info_row {
    display: flex;
    align-items: flex-start;
    margin-top: 0.577428vw;
    width: 100.000000%;
}

.smap_info_row_address {
    margin-top: 1.312336vw;
}

.smap_info_icon {
    flex: 0 0 auto;
    margin-top: 0.157480vw;
    width: calc(var(--px) * 16);
    aspect-ratio: 16 / 19;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 주소/영업시간은 DB 가변 텍스트라 <br> 제어가 불가능하다.
   nowrap+ellipsis 로 두면 긴 주소(성수점 등)가 잘려 정보가 소실되므로 이 영역만 줄바꿈을 허용한다. */
.smap_info_text {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 0 0 0.629921vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: var(--fs-15);
    line-height: 1.687;
    letter-spacing: -0.05em;
    color: #0c0c0c;
    white-space: normal;
    word-break: keep-all;
}

.smap_card_links {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.312336vw;
    width: 100.000000%;
}

.smap_card_map_img {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0.000000vw;
    width: calc(var(--px) * 128);
    aspect-ratio: 128 / 34;
}

@media (max-width: 599px) {

    .smap {
        padding-top: 15.000000vw;
        padding-bottom: 12.000000vw;
    }

    .smap_title {
        width: 42.000000%;
    }

    /* 모바일: 검색 → 지도 → 리스트 세로 스택 */
    .smap_search {
        margin-top: 7.000000vw;
        width: 88.000000%;
        height: 12.000000vw;
        padding-left: 4.500000vw;
        padding-right: 1.500000vw;
        border-radius: 6.000000vw;
    }

    .smap_search_input {
        font-size: 3.600000vw;
    }

    .smap_search_btn {
        width: 9.000000vw;
        height: 9.000000vw;
    }

    .smap_search_icon {
        width: 5.000000vw;
        height: 5.000000vw;
    }

    .smap_map_wrap {
        flex-direction: column-reverse;
        margin-top: 5.000000vw;
        width: 100.000000%;
        height: auto;
        border-left: 0;
        border-right: 0;
    }

    .smap_list {
        width: 100.000000%;
        height: 92.000000vw;
        border-right: 0;
    }

    .smap_map {
        width: 100.000000%;
        height: 78.000000vw;
    }

    .smap_item {
        padding: 4.500000vw 12.000000vw 4.500000vw 4.500000vw;
    }

    .smap_item_name_icon {
        width: 10.500000%;
    }

    .smap_item_name {
        margin-left: 2.500000vw;
        font-size: 4.400000vw;
        white-space: nowrap;
    }

    .smap_plus_btn {
        top: 4.500000vw;
        right: 4.000000vw;
        width: 8.000000vw;
        height: 8.000000vw;
    }

    .smap_plus_btn::before {
        width: 3.400000vw;
    }

    .smap_plus_btn::after {
        height: 3.400000vw;
    }

    /* 팝업: 사진 위 / 정보 아래 */
    /* border-radius 도 --px 무효화로 폐기되어 모바일에서 각진다 → vw 재지정
       (PC 12단위 → 3.2vw / PC 8단위 → 2.133vw, 375 기준 동일 크기) */
    .smap_popup_card {
        flex-direction: column;
        width: 88.000000%;
        padding: 5.000000vw;
        border-radius: 3.200000vw;
    }

    .smap_popup_photo {
        width: 100.000000%;
        border-radius: 2.133000vw;
    }

    .smap_popup_info {
        margin-top: 4.500000vw;
        margin-left: 0.000000vw;
    }

    .smap_popup_name {
        font-size: 5.000000vw;
    }

    .smap_popup_addr,
    .smap_popup_time,
    .smap_popup_tel {
        margin-left: 2.000000vw;
        font-size: 3.600000vw;
    }

    .smap_popup_naver {
        margin-top: 5.000000vw;
        width: 38.000000%;
    }

    .smap_popup_close {
        top: 3.000000vw;
        right: 3.000000vw;
        width: 8.000000vw;
        height: 8.000000vw;
    }

    .smap_popup_close::before,
    .smap_popup_close::after {
        width: 4.500000vw;
    }

    /* ★ 모바일은 --px:initial 이라 PC 의 calc(var(--px)*N) 선언이 통째로 폐기된다.
       border-radius 는 0 이 되고, _tail 의 bottom 은 auto 로 떨어져 꼬리가
       말풍선 세로 중앙에 박힌다. 둘 다 vw 로 재지정해야 한다. (PC 6단위 → 1.6vw) */
    .smap_bubble {
        padding: 1.200000vw 2.400000vw;
        border-radius: 1.600000vw;
    }

    .smap_bubble_tail {
        bottom: -1.600000vw;
    }

    .smap_bubble_text {
        font-size: 3.200000vw;
    }

    .smap_info_row {
        margin-top: 2.200000vw;
    }

    .smap_info_row_address {
        margin-top: 4.500000vw;
    }

    .smap_info_icon {
        width: 5.200000%;
    }

    .smap_info_text {
        margin-left: 2.000000vw;
    }

    .smap_card_links {
        margin-top: 5.000000vw;
    }

    .smap_card_map_img {
        margin-left: 0.000000vw;
        width: 38.000000%;
    }

}

/* /merge-build:store-map */