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

/* ===== 커뮤니티 공용 — 섹션 타이틀 (최초 정의 econ02, 섹션 간격은 .econNN_* 에만) ===== */
.e_title {
    font-size: calc(var(--px) * 50);
    letter-spacing: -0.16vw;
    padding-right: 0.16vw; /* 끝 글자 뒤 음수 자간만큼 박스가 좁아져 글자가 오른쪽으로 쏠리는 것 상쇄 */
    line-height: 2.6vw;
    color: #000;
    font-family: var(--font-nexon);
    font-weight: 700;
}

/* ===== 커뮤니티 공용 — 페이저 (최초 정의 econ02, 섹션 간격은 .econNN_pager 에만) ===== */
.e_pager {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
}

.e_pager_num {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: calc(var(--px) * 38);
    font-size: calc(var(--px) * 18);
    letter-spacing: 0;
    line-height: 1.0vw;
    color: #000;
    font-family: var(--font-free);
    font-weight: 400;
}

.e_pager_num::after {
    content: "";
    width: calc(var(--px) * 15);
    height: calc(var(--px) * 3);
    margin-top: 0.2vw;
    background-color: transparent;
}

.e_pager_num.is-active {
    color: var(--color-brown);
    font-weight: 800;
}

.e_pager_num.is-active::after {
    background-color: var(--color-brown);
}

.e_pager_arrow {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: calc(var(--px) * 47);
    font-size: calc(var(--px) * 18);
    letter-spacing: 0;
    line-height: 1.0vw;
    color: #000;
    font-family: 'Suit';
    font-weight: 700;
}

.e_pager_arrow.is-empty {
    visibility: hidden;
}

/* ===== 커뮤니티 탭 패널 — 활성 탭(?tab=) 패널만 노출. 전환은 js/community.js ===== */
.e_panel_off {
    display: none;
}

/* ===== econ01 공지사항 — 검색 + notice 게시판 목록 + 페이지네이션 ===== */
.econ01 {
    padding-top: 5.7vw;
    padding-bottom: 5.6vw;
    letter-spacing: 0;
    font-family: var(--font-free);
    font-weight: 500;
}

.econ01_title {
    line-height: 2.4vw;
}

.econ01_search {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    box-sizing: border-box;
    width: 75.5906%;
    margin-top: 3.0vw;
    padding-top: calc(var(--px) * 46);
    padding-bottom: calc(var(--px) * 40);
    padding-left: calc(var(--px) * 27);
    column-gap: calc(var(--px) * 18);
    border: 1px solid var(--color-point);
    background: #fffcf2;
}

.econ01_search_field {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: calc(var(--px) * 785);
    padding-bottom: calc(var(--px) * 16);
    border-bottom: 1px solid #000000;
}

.econ01_select {
    width: calc(var(--px) * 145);
    height: calc(var(--px) * 28);
    padding-left: calc(var(--px) * 19);
    background: url('/images/econ01_02.svg') no-repeat right center / calc(var(--px) * 14) calc(var(--px) * 8);
    font-size: calc(var(--px) * 18);
    color: #000000;
    cursor: pointer;
    outline: none;
}

.econ01_input {
    width: calc(var(--px) * 569);
    height: calc(var(--px) * 28);
    margin-left: calc(var(--px) * 71);
    font-size: calc(var(--px) * 18);
    color: #000000;
    outline: none;
}

.econ01_input::placeholder {
    color: rgba(0, 0, 0, 0.5);
    font-weight: 500;
}

.econ01_search_btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 104);
    height: calc(var(--px) * 48);
    background: #000000;
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #ffffff;
}

.econ01_table {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: 75.5906%;
    margin-top: 2.4vw;
}

.econ01_thead {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: calc(var(--px) * 50);
    background: var(--color-point);
}

.econ01_th {
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #ffffff;
    text-align: center;
}

.econ01_th_num {
    width: 13.8889%;
}

.econ01_th_subject {
    box-sizing: border-box;
    width: 67.9861%;
    padding-left: calc(var(--px) * 59);
}

.econ01_th_date {
    width: 18.125%;
}

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

.econ01_row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    box-sizing: border-box;
    width: 100%;
    height: calc(var(--px) * 61);
    border-bottom: 1px solid #c7c7c7;
}

.econ01_row_link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100%;
}

.econ01_td_num {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 13.8889%;
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #000000;
}

.econ01_td_subject {
    box-sizing: border-box;
    width: 67.9861%;
    padding-left: calc(var(--px) * 118);
    padding-right: calc(var(--px) * 40);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #000000;
    text-align: left;
}

.econ01_td_date {
    width: 18.125%;
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #525252;
    text-align: center;
}

.econ01_badge {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 86);
    height: calc(var(--px) * 34);
    margin-top: calc(var(--px) * 9);
    column-gap: calc(var(--px) * 5);
    background: #000000;
}

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

.econ01_badge_txt {
    font-size: calc(var(--px) * 17);
    letter-spacing: -0.03vw;
    line-height: 1.0vw;
    color: #ffffff;
    font-family: "Pretendard Variable";
    font-weight: 600;
}

.econ01_row_empty {
    align-items: center;
}

.econ01_empty {
    width: 100%;
    font-size: calc(var(--px) * 18);
    line-height: 1.0vw;
    color: #333333;
    text-align: center;
}

.econ01_pager {
    margin-top: 2.6vw;
}

/* ===== econ02 홍보영상 — main_video 게시판 3×2 카드 + 페이저 ===== */
.econ02 {
    background-color: #faf4e1;
    padding-top: 8.0vw;
    padding-bottom: 6.7vw;
}

.econ02_board {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
}

.econ02_list {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    row-gap: 1.6vw;
    width: calc(var(--px) * 1380);
    margin-top: 2.6vw;
    box-sizing: border-box;
}

.econ02_item {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(100% / 3);
}

.econ02_card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: calc(var(--px) * 431);
    box-sizing: border-box;
    border: 1px solid var(--color-brown);
    background-color: #fff;
}

.econ02_video {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    aspect-ratio: 429 / 288;
    background-color: #000;
    overflow: hidden;
}

.econ02_caption {
    padding-top: calc(var(--px) * 27);
    padding-bottom: calc(var(--px) * 34);
    padding-left: calc(var(--px) * 20);
    padding-right: calc(var(--px) * 20);
    font-size: calc(var(--px) * 20);
    letter-spacing: 0;
    line-height: 1.0vw;
    color: #000;
    font-family: var(--font-free);
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.econ02_pager {
    margin-top: 3.5vw;
}

.econ02_empty {
    margin-top: 2.6vw;
    padding: 5.2vw 0;
    font-size: calc(var(--px) * 20);
    letter-spacing: 0;
    line-height: 1.0vw;
    color: #000;
    font-family: var(--font-free);
    font-weight: 400;
    text-align: center;
}

/* ===== econ03 고객의 소리 — 흰 폼 박스 + 좌측 음식 사진 데코 + 우측 워드마크 블록 ===== */
.econ03 {
    background-color: #faf4e1;
    padding-top: 7.5vw;
    padding-bottom: 8.5vw;
}

.econ03_photo {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 227);
    aspect-ratio: 227 / 281;
    left: 11.2%;
    top: 9.0vw;
}

.econ03_title {
    font-family: var(--font-nexon);
    font-size: calc(var(--px) * 50);
    font-weight: 700;
    letter-spacing: -0.16vw;
    padding-right: 0.16vw; /* 끝 글자 뒤 음수 자간 상쇄 (.e_title 과 동일) */
    line-height: 2.4vw;
    color: #000000;
}

.econ03_sub {
    margin-top: 1.3vw;
    font-family: var(--font-free);
    font-size: calc(var(--px) * 18);
    font-weight: 400;
    letter-spacing: -0.01vw;
    line-height: 0.9vw;
    color: rgba(0, 0, 0, 0.6);
}

.econ03_form {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 60.6299%;
    margin-top: 2.3vw;
    box-sizing: border-box;
    border: 1px solid #545253;
    padding: calc(var(--px) * 92) calc(var(--px) * 149) calc(var(--px) * 69);
    background-color: #ffffff;
    font-family: var(--font-free);
    letter-spacing: 0;
    color: #000000;
}

.econ03_row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding-left: calc(var(--px) * 18);
    box-sizing: border-box;
}

.econ03_row_01 {
    padding-bottom: calc(var(--px) * 17);
}

.econ03_row_02 {
    padding: calc(var(--px) * 30) 0 calc(var(--px) * 23) calc(var(--px) * 18);
}

.econ03_row_03 {
    padding: calc(var(--px) * 24) 0 calc(var(--px) * 26) calc(var(--px) * 18);
}

.econ03_row_04 {
    align-items: flex-start;
    padding: calc(var(--px) * 30) 0 0 calc(var(--px) * 18);
}

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

.econ03_field_l {
    width: 48.7455%;
}

.econ03_field_r {
    width: 51.2545%;
}

.econ03_field_full {
    width: 100%;
}

.econ03_field_top {
    align-items: flex-start;
}

.econ03_label {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: calc(var(--px) * 113);
    flex-shrink: 0;
    font-size: calc(var(--px) * 22);
    font-weight: 600;
    line-height: 1.2vw;
}

.econ03_label_r {
    width: calc(var(--px) * 120);
}

.econ03_req {
    margin-right: calc(var(--px) * 3);
    color: var(--color-brown);
}

.econ03_input,
.econ03_textarea {
    padding: 0;
    font-size: calc(var(--px) * 18);
    font-weight: 500;
    line-height: 1.2vw;
}

.econ03_input {
    width: calc(100% - var(--px) * 113);
    height: calc(var(--px) * 40);
}

.econ03_input_r {
    width: calc(100% - var(--px) * 120);
}

.econ03_textarea {
    width: calc(100% - var(--px) * 113);
    height: calc(var(--px) * 109);
    resize: none;
}

.econ03_input::placeholder,
.econ03_textarea::placeholder {
    color: rgba(0, 0, 0, 0.3);
}

.econ03_line {
    width: 100%;
    height: 1px;
    background-color: var(--color-brown);
}

.econ03_agree {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 1.2vw;
}

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

.econ03_agree_item_02 {
    margin-left: 13.0%;
}

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

.econ03_check {
    width: calc(var(--px) * 16);
    height: calc(var(--px) * 16);
    flex-shrink: 0;
    box-sizing: border-box;
    border: 1px solid #000000;
    border-radius: 50%;
}

.econ03_check:checked {
    background-color: var(--color-brown);
    box-shadow: inset 0 0 0 calc(var(--px) * 3) #ffffff;
}

.econ03_agree_txt {
    margin-left: calc(var(--px) * 3);
    font-size: calc(var(--px) * 18);
    font-weight: 500;
    line-height: 1.1vw;
}

.econ03_agree_view {
    margin-left: calc(var(--px) * 34);
    font-size: calc(var(--px) * 18);
    font-weight: 600;
    line-height: 1.1vw;
    color: rgba(0, 0, 0, 0.5);
    text-decoration: underline;
    text-underline-offset: calc(var(--px) * 3);
}

.econ03_agree_view_02 {
    margin-left: calc(var(--px) * 41);
}

.econ03_submit {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 229);
    height: calc(var(--px) * 58);
    margin-top: 2.3vw;
    background-color: #000000;
    font-size: calc(var(--px) * 20);
    font-weight: 600;
    line-height: 1.1vw;
    color: #ffffff;
}

.econ03_brand {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    left: 75.3%;
    top: 32.7vw;
    padding: calc(var(--px) * 31) calc(var(--px) * 17) calc(var(--px) * 29) calc(var(--px) * 50);
    background-color: var(--color-brown);
}

.econ03_brand_img {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: calc(var(--px) * 473);
    aspect-ratio: 473 / 205;
    flex-shrink: 0;
}

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

    .e_title {
        font-size: 7vw;
        line-height: 9vw;
        letter-spacing: -0.4vw;
    }

    .econ02_list {
        width: 92vw;
        margin-top: 6vw;
        row-gap: 2vw;
    }

    .econ02_item {
        width: 50%;
    }

    .econ02_card {
        width: 44vw;
    }

    .econ02_caption {
        padding: 2.6vw 2vw 2.9vw;
        font-size: 3.5vw;
        line-height: 4.5vw;
    }

    .econ02_pager {
        margin-top: 8vw;
    }

    .e_pager_num {
        width: 8.5vw;
    }

    .e_pager_arrow {
        width: 10.5vw;
    }

    .e_pager_num,
    .e_pager_arrow {
        font-size: 4vw;
        line-height: 4.6vw;
    }

    .e_pager_num::after {
        width: 3.3vw;
        height: 0.8vw;
        margin-top: 1.2vw;
    }

    .econ02_empty {
        font-size: 3.5vw;
    }

    /* ----- econ01 공지사항 — 검색 2단(선택+입력 / 버튼) · 표 → 카드형 행(제목 위, 작성일 아래) ----- */
    .econ01 {
        padding-top: 13.3vw;
        padding-bottom: 13.3vw;
    }

    /* 셀렉트 · 검색창 · 검색버튼 한 줄 (유저 지시 2026-10-23 — 세로 3단이 너무 컸음) */
    .econ01_search {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        width: 89.3%;
        margin-top: 8vw;
        padding: 3.2vw;
        column-gap: 2.1vw;
    }

    .econ01_search_field {
        width: 74%;
        padding-bottom: 1.1vw;
    }

    .econ01_select {
        width: 34%;
        height: 8vw;
        padding-left: 0.5vw;
        background-size: 2.7vw 1.6vw;
        font-size: 3.5vw;
    }

    .econ01_input {
        width: 62%;
        height: 8vw;
        margin-left: 4%;
        font-size: 3.5vw;
    }

    .econ01_search_btn {
        width: 22%;
        height: 9.1vw;
        font-size: 3.5vw;
        line-height: 5.6vw;
    }

    .econ01_table {
        width: 89.3%;
        margin-top: 6.4vw;
    }

    /* 열 머리글은 카드형에서 의미가 없어 글자를 숨기고 진갈색 띠만 상단 경계로 남긴다 */
    .econ01_thead {
        height: 0.8vw;
    }

    .econ01_th {
        display: none;
    }

    .econ01_row {
        height: auto;
    }

    .econ01_row_link {
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        padding: 4.3vw 1.1vw;
        box-sizing: border-box;
    }

    .econ01_td_num {
        display: none;
    }

    .econ01_row_notice .econ01_td_num {
        display: flex;
        justify-content: flex-start;
        width: 100%;
        margin-bottom: 2.1vw;
    }

    .econ01_badge {
        width: 15.5vw;
        height: 6.4vw;
        margin-top: 0;
        column-gap: 1.1vw;
    }

    .econ01_badge_pin {
        width: 2.1vw;
    }

    .econ01_badge_txt {
        font-size: 3.3vw;
        letter-spacing: 0;
        line-height: 4vw;
    }

    .econ01_td_subject {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        white-space: normal;
        word-break: keep-all;
        overflow-wrap: anywhere;
        font-size: 3.8vw;
        line-height: 5.6vw;
    }

    .econ01_td_date {
        width: 100%;
        margin-top: 1.6vw;
        font-size: 3.3vw;
        line-height: 4.5vw;
        text-align: left;
    }

    .econ01_row_empty {
        padding: 10.7vw 0;
    }

    .econ01_empty {
        font-size: 3.6vw;
        line-height: 5.6vw;
    }

    .econ01_pager {
        margin-top: 8vw;
    }

    /* ----- econ03 고객의 소리 — 폼 세로 스택(필드 1줄씩) · 음식 사진 숨김 · 워드마크 블록은 폼 우하단에 걸침 ----- */
    .econ03 {
        padding-top: 13.3vw;
        padding-bottom: 13.3vw;
    }

    .econ03_photo {
        display: none;
    }

    .econ03_title {
        font-size: 7vw;
        letter-spacing: -0.4vw;
        padding-right: 0.4vw;
        line-height: 9vw;
    }

    .econ03_sub {
        max-width: 89.3%;
        margin-top: 2.7vw;
        font-size: 3.6vw;
        line-height: 5.6vw;
        text-align: center;
        word-break: keep-all;
    }

    .econ03_form {
        width: 89.3%;
        margin-top: 8vw;
        padding: 4.3vw 5.3vw 8vw;
    }

    .econ03_row {
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        padding-left: 0;
    }

    .econ03_row_01 {
        padding-bottom: 2.1vw;
    }

    .econ03_row_02,
    .econ03_row_03 {
        padding: 2.1vw 0;
    }

    .econ03_row_04 {
        padding: 4.3vw 0 3.2vw;
    }

    .econ03_field_l,
    .econ03_field_r {
        width: 100%;
    }

    /* 좌우 2칸이 세로로 쌓이면서 위 칸(작성자·이메일) 아래 구분선이 없어짐 → 행 구분선(.econ03_line)과 같은 선 (유저 지시 2026-10-23) */
    .econ03_field_l {
        border-bottom: 1px solid var(--color-brown);
    }

    .econ03_label,
    .econ03_label_r {
        width: 21.3vw;
        font-size: 3.8vw;
        line-height: 5.6vw;
    }

    .econ03_req {
        margin-right: 0.8vw;
    }

    .econ03_input,
    .econ03_input_r,
    .econ03_textarea {
        width: calc(100% - 21.3vw);
        font-size: 4.3vw;
        line-height: 6vw;
    }

    .econ03_input {
        height: 11.7vw;
    }

    .econ03_textarea {
        height: 37.3vw;
    }

    .econ03_agree {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        margin-top: 5.3vw;
        row-gap: 3.2vw;
    }

    .econ03_agree_item_02 {
        margin-left: 0;
    }

    .econ03_check {
        width: 4.5vw;
        height: 4.5vw;
    }

    .econ03_check:checked {
        box-shadow: inset 0 0 0 0.8vw #ffffff;
    }

    .econ03_agree_txt {
        margin-left: 1.6vw;
        font-size: 3.6vw;
        line-height: 5.6vw;
    }

    .econ03_agree_view,
    .econ03_agree_view_02 {
        margin-left: 3.2vw;
        padding: 1.1vw 0;
        font-size: 3.4vw;
        line-height: 5.2vw;
        text-underline-offset: 0.8vw;
    }

    .econ03_submit {
        width: 100%;
        height: 13.3vw;
        margin-top: 6.4vw;
        font-size: 4.3vw;
        line-height: 6vw;
    }

    .econ03_brand {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
        align-self: flex-end;
        margin-top: -5.3vw;
        padding: 4.3vw 2.7vw 4vw 6.4vw;
    }

    .econ03_brand_img {
        width: 56vw;
    }
}