@charset "utf-8";
/* ===== store page styles ===== */

/* ===== dcon01 매장 검색·리스트 + 카카오맵 ===== */
.dcon01 {
    padding-top: 3.0vw;
    padding-bottom: 7.8vw;
}

.dcon01_box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    width: 95.1706%;
    border: 1px solid #000000;
    box-sizing: border-box;
}

.dcon01_left {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: 26.0077%;
    border-right: 1px solid #000000;
    box-sizing: border-box;
    flex-shrink: 0;
}

.dcon01_search_bar {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding-top: calc(var(--px) * 41);
    padding-bottom: calc(var(--px) * 41);
    background-color: var(--color-point);
    background-image: linear-gradient(90deg, transparent calc(var(--px) * 12), rgba(254, 250, 238, 0.051) calc(var(--px) * 12), rgba(254, 250, 238, 0.051) calc(var(--px) * 13), transparent calc(var(--px) * 13));
    background-size: calc(var(--px) * 20) 100%;
    background-repeat: repeat-x;
}

.dcon01_search {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: calc(var(--px) * 355);
    height: calc(var(--px) * 75);
    padding-left: calc(var(--px) * 33);
    padding-right: calc(var(--px) * 40);
    box-sizing: border-box;
    background: #ffffff;
}

.dcon01_search_input {
    width: calc(var(--px) * 247);
    align-self: stretch;
    outline: none;
    font-family: var(--font-free);
    font-size: calc(var(--px) * 18);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: #000000;
}

.dcon01_search_input::placeholder {
    letter-spacing: 0;
    color: #4d4d4d;
}

.dcon01_search_btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 35);
    aspect-ratio: 35 / 36;
}

.dcon01_search_btn img {
    width: 100%;
}

.dcon01_list_wrap {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: calc(var(--px) * 654);
    overflow-y: auto;
    padding-top: calc(var(--px) * 41);
    padding-bottom: calc(var(--px) * 32);
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: var(--color-point) transparent;
    scrollbar-gutter: stable both-edges;
}

.dcon01_list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: calc(var(--px) * 413);
    row-gap: 2.4vw;
}

.dcon01_item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: 100%;
    cursor: pointer;
}

.dcon01_item_row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.dcon01_item_thumb {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 122);
    aspect-ratio: 1 / 1;
    background: #000000;
    flex-shrink: 0;
    overflow: hidden;
}

/* 게시판 첨부 썸네일 — object-fit 은 게시판 첨부 전용 허용 (board-integration) */
.dcon01_item_thumb > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dcon01_item_thumb_none {
    background: var(--color-cream);
}

.dcon01_item_noimg {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 61);
    aspect-ratio: 81 / 116;
}

.dcon01_item_noimg img {
    width: 100%;
}

.dcon01_item_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 7.7%;
}

.dcon01_item_name {
    font-family: var(--font-free);
    font-size: calc(var(--px) * 20);
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: #000000;
    word-break: keep-all;
}

.dcon01_item_addr {
    margin-top: 1.0vw;
    font-family: var(--font-free);
    font-size: calc(var(--px) * 16);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: #333333;
    word-break: keep-all;
}

.dcon01_item_tel {
    font-family: var(--font-free);
    font-size: calc(var(--px) * 16);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: #333333;
}

.dcon01_item_line {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 1px;
    margin-top: 2.1vw;
    background: #d9d9d9;
}

.dcon01_noshop {
    display: none;
    padding-top: 0;
    font-family: var(--font-free);
    font-size: calc(var(--px) * 16);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: #333333;
    text-align: center;
}

/* 카카오맵 컨테이너 — flex 지정 금지 (SDK 가 내부 레이어 배치) */
/* flex-start 정렬 = 일반 흐름과 동일 → SDK 내부 레이어(100%×100%) 배치 영향 없음. 드래그 중 커서는 SDK 가 직접 바꿈 */
.dcon01_map {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 73.9923%;
    height: calc(var(--px) * 811);
    cursor: grab;
}

/* 전역 img pointer-events 류 무력화 → 마커 클릭 보존 (kakao-map 스킬 계약) */
.dcon01_map img {
    pointer-events: auto;
}

/* ===== 지도 말풍선 (CustomOverlay — JS 주입) ===== */
.map_marker {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.map_marker_text {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: calc(var(--px) * 8) calc(var(--px) * 16);
    background: #ffffff;
    border: 2px solid var(--color-point);
    border-radius: 50vw;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.18);
    font-family: var(--font-free);
    font-size: calc(var(--px) * 16);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.3vw;
    color: var(--color-point);
    white-space: nowrap;
}

.map_marker_tail {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 14);
    height: calc(var(--px) * 14);
    margin-top: calc(var(--px) * -8);
    background: #ffffff;
    border-right: 2px solid var(--color-point);
    border-bottom: 2px solid var(--color-point);
    transform: rotate(45deg);
}

/* ===== dcon02 신규 매장 오픈 티커 (공통 .c_ticker* = sub_common.css) ===== */
.dcon02 {
    padding-top: calc(var(--px) * 38);
    padding-bottom: calc(var(--px) * 39);
}

.dcon02_item {
    margin-right: calc(var(--px) * 78);
    font-size: calc(var(--px) * 19);
    letter-spacing: 0;
    line-height: 1.2vw;
}

/* ===== 모바일 (store 단일 블록) ===== */
@media (max-width:599px) {
    /* ----- dcon01 — 지도(위) → 검색바 → 리스트(내부 스크롤) 세로 스택 ----- */
    .dcon01 {
        padding-top: 8vw;
        padding-bottom: 13.3vw;
    }

    .dcon01_box {
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        width: 89.3%;
    }

    .dcon01_left {
        width: 100%;
        border-right: 0;
    }

    .dcon01_search_bar {
        padding-top: 4.3vw;
        padding-bottom: 4.3vw;
    }

    .dcon01_search {
        width: 89.3%;
        height: 11.7vw;
        padding-left: 4.3vw;
        padding-right: 3.2vw;
    }

    .dcon01_search_input {
        width: calc(100% - 6.4vw);
        font-size: 4.3vw;
        line-height: 5.6vw;
    }

    .dcon01_search_btn {
        width: 6.4vw;
    }

    .dcon01_list_wrap {
        height: auto;
        max-height: 100vw;
        padding-top: 5.3vw;
        padding-bottom: 5.3vw;
    }

    .dcon01_list {
        width: 89.3%;
        row-gap: 4.3vw;
    }

    .dcon01_item_thumb {
        width: 21.3vw;
    }

    .dcon01_item_noimg {
        width: 10.7vw;
    }

    .dcon01_item_info {
        min-width: 0;
        margin-left: 4.3vw;
    }

    .dcon01_item_name {
        overflow-wrap: anywhere;
        font-size: 4.3vw;
        line-height: 6vw;
    }

    .dcon01_item_addr {
        overflow-wrap: anywhere;
        margin-top: 1.1vw;
        font-size: 3.4vw;
        line-height: 5.2vw;
    }

    .dcon01_item_tel {
        font-size: 3.4vw;
        line-height: 5.2vw;
    }

    .dcon01_item_line {
        margin-top: 4.3vw;
    }

    .dcon01_noshop {
        padding-top: 8vw;
        padding-bottom: 8vw;
        font-size: 3.6vw;
        line-height: 5.6vw;
    }

    .dcon01_map {
        order: -1;
        width: 100%;
        height: 80vw;
    }

    /* 말풍선 — kakao-map B-4 모바일값 (높이는 store.js 가 클릭 시 실측해 yAnchor 계산) */
    .map_marker_text {
        padding: 1.6vw 3.2vw;
        font-size: 3.5vw;
        line-height: 4.6vw;
    }

    .map_marker_tail {
        width: 2.7vw;
        height: 2.7vw;
        margin-top: -1.5vw;
    }

    /* ----- dcon02 신규 매장 티커 ----- */
    .dcon02 {
        padding-top: 3.2vw;
        padding-bottom: 3.2vw;
    }

    .dcon02_item {
        margin-right: 8vw;
        font-size: 3.5vw;
        line-height: 4.6vw;
    }
}