.main_top{
    width: 100%;
    height: 100vh;
    background-color: #fff2d3;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    z-index: 99999;
    pointer-events: none;
}

/* ============ 카카오맵 마커/오버레이 ============ */
.map_marker {
    position: relative;
    display: inline-block;
}

.my-place-label {
    background: #fff;
    border: 2px solid var(--mc);
    padding: 8px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: bold;
    color: #333;
    text-align: center;
    white-space: nowrap;
    position: relative;
    bottom: 50px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    z-index: 10;
    transform: translateY(-50%);
}

.my-place-label:after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    border-top: 8px solid var(--mc);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

.my-place-label:before {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    border-top: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    z-index: 1;
}

/* ============ 선택 ============ */
::selection {
    color: var(--mc);
}

/* ============ Base / Reset ============ */
*,
*::before,
*::after {
    box-sizing: unset;
    margin: 0;
}

button {
    outline: none;
    border: none;
}

html,
body {
    padding: 0;
    margin: 0;
}

ul,
ol {
    list-style: none;
    padding: 0;
    margin: 0;
}

a {
    text-decoration: none;
    color: inherit;
}

html {
    scroll-behavior: smooth;
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============ Layout Helpers ============ */
section {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    flex-direction: column;
}

.pc-mobile {
    display: flex;
}

.mobile-pc {
    display: none;
}

.pc {
    display: flex;
}

.pc-inline {
    display: inline;
}

.tablet {
    display: none;
}

.mobile {
    display: none;
}

.clearfix::before,
.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

.flowhid {
    overflow: hidden;
}

.hide {
    display: none !important;
}

.hideopa {
    opacity: 0 !important;
}

.show {
    opacity: 1 !important;
}

.absol {
    position: absolute;
}

.rltv {
    position: relative;
}

.fwrap {
    flex-wrap: wrap;
}

.pointer {
    cursor: pointer;
}

.leftflex {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 50%;
}

.rightflex {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 50%;
}

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

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

/* 무한 스크롤 (마키) */
.scrX {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.scrX .scrX_item {
    animation: marqueeX 20s linear infinite;
    width: 100%;
}

.scrX .scrX_item_absol {
    right: -100%;
    width: 100%;
}

.scrY {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.scrY .scrY_item {
    animation: marqueeY 20s linear infinite;
    height: 100%;
}

.scrY .scrY_item_absol {
    bottom: -100%;
    width: 100%;
}

/* ============ Fonts ============ */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;500;600;700&display=swap");

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'Pretendard', 'Noto Sans KR', system-ui, -apple-system, Segoe UI, Roboto, Apple SD Gothic Neo, 'Noto Serif KR', sans-serif;
}

/* ============ Keyframes (공통 재사용) ============ */
@keyframes marquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@keyframes marquee2 {
    from {
        transform: translateX(-50%);
    }

    to {
        transform: translateX(0);
    }
}

@keyframes marqueeX {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}

@keyframes marqueeY {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-100%);
    }
}

@keyframes rotate360 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes zoom {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.02);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes zoom2 {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes opa {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes opazoom {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.02);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes ball {
    0% {
        bottom: 0;
    }

    100% {
        bottom: 20px;
    }
}

@keyframes blk {

    0%,
    30% {
        opacity: 0;
    }

    31%,
    99% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes blk2 {

    0%,
    49% {
        opacity: 0;
    }

    50%,
    99% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes scaleOpa {
    100% {
        transform: scale(1.1);
        opacity: 0;
    }
}

@keyframes scaleOpa2 {
    100% {
        transform: scale(1.4);
        opacity: 0;
    }
}

.rotate {
    animation: rotate360 20s linear infinite;
}

.blk {
    animation: blk 1s infinite;
}

.opazoom {
    animation: opazoom 1.5s infinite;
}

.scaleopa1 {
    animation: scaleOpa 2s infinite;
}

.scaleopa2 {
    animation: scaleOpa2 2s infinite;
}

/* ============ 클라이언트별 섹션 스타일은 아래에 추가 ============ */
body {
    overflow-x: clip;
    overflow-y: visible;
}

#content_wrap {
    overflow: visible;
}

.main {
    margin-top: 0;
    margin-left: 0;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    overflow: visible;
}

.title {
    font-family: var(--sf) !important;
    font-size: 3.2vw !important;
    line-height: 1.2 !important;
}

.subtt {
    font-family: var(--mf) !important;
    font-size: 1.1vw !important;
    margin-top: 1vw !important;
}

/* ============================================================
   MAIN SECTION (main_section)
   bg: red ceramic tile main_04.webp
   panel: video + 텍스트 overlay (1572/739 aspect)
   bowl: main_06~10 랜덤 2초, 다음섹션 위로 절반 걸침
   ============================================================ */
.main_section {
    position: relative;
    width: 100%;
    padding-top: 3.5696vw;
    padding-bottom: 5.8286vw;
    /* 사용자 보정 */
    background: url('/images/main_04.webp') center top / 100% auto no-repeat;
    background-color: #000;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
}

/* ── main_visual : panel 컨테이너 (가운데 정렬, panel 폭) ── */
.main_visual {
    position: relative;
    width: 82.5197%;
    /* 1572 / 1905 — header와 동일 폭 */
    align-self: center;
    margin-top: 0;
}

/* ── main_video_media : video panel (aspect-ratio 1572/739) ── */
.main_video_media {
    position: relative;
    width: 100%;
    aspect-ratio: 1572 / 739;
    overflow: hidden;
    border-radius: 0.5249vw;
    /* 10/1905 */
    margin-top: 0;
    background: #000;
}

/* ── video + dark overlay layer ── */
.main_video_layer {
    position: absolute;
    inset: 0;
    z-index: 1;
}
.main_video_layer video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main_video_el {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.main_visual_overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    pointer-events: none;
}

/* ── main_content_stack : panel 안 세로 rltv mt 체인 (logo → title → counter → desc) ── */
.main_content_stack {
    position: absolute;
    top: 6vw;
    /* logo PSD top (203-68)/1905 */
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 4;
    pointer-events: none;
}

/* logo — rltv 첫 요소 (mt:0), 높이 = naturalH 기준 */
.main_logo_img {
    position: relative;
    margin: 0;
    margin-top: 0;
    /* content_stack 첫 flow */
    width: 8.6514%;
    /* 136/1572 — natural */
    align-self: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.main_logo_img img {
    width: 100%;
    height: auto;
    display: block;
}

/* title — PSD font: OTMBC-1961GulimM → MBC1961 (noonnu 1134) */
.main_title {
    position: relative;
    margin: 0;
    margin-top: 1.3123vw;
    /* logo bottom y=253 → title y=278 = 25/1905 */
    width: auto;
    align-self: center;
    text-align: center;
    white-space: nowrap;
    font-family: var(--sf);
    /* MBC1961 (PSD OTMBC-1961GulimM) */
    font-weight: 400;
    font-size: 2.4934vw;
    /* 47.5/1905 */
    color: #e51323;
    line-height: 1.455;
    letter-spacing: -0.025em;
}

/* counter (big Anton number) */
.main_counter {
    position: relative;
    margin: 0;
    margin-top: -0.1627vw;
    width: auto;
    align-self: center;
    text-align: center;
    white-space: nowrap;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 8vw;
    color: #fff2d3;
    line-height: 1.231;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    overflow: hidden;
}

/* 분/초/CS 세그먼트 — 폭 고정 (값 바뀔 때 흔들림 0) */
.main_counter_seg {
    display: inline-block;
    width: 2.2ch;
    /* "00" 두 자리 폭 고정 (tabular '0' 기준) */
    text-align: center;
    flex-shrink: 0;
}

/* 콜론 — 폭 고정 */
.main_counter_sep {
    display: inline-block;
    width: 0.7ch;
    text-align: center;
    flex-shrink: 0;
    margin: 0 0.4ch;
    /* 콜론 좌우 여백 고정 */
}

/* desc */
.main_desc {
    position: relative;
    margin: 0;
    margin-top: 0.5vw;
    width: auto;
    align-self: center;
    text-align: center;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.1vw;
    color: #ffffff;
    line-height: 1.273;
    letter-spacing: -0.05em;
    word-break: keep-all;
}

/* ── main_bowl_img : panel 하단 컵밥 (다음섹션 위로 overflow) ── */
.main_bowl_img {
    position: absolute;
    top: 28.9239vw;
    /* (619-68)/1905 */
    left: 26.8767%;
    /* (631-174-34)/1572 — natural shadow 보정 */
    width: 46.3104%;
    /* 728/1572 natural */
    z-index: 5;
    pointer-events: none;
    line-height: 0;
}

.main_bowl_img_layer {
    width: 100%;
    height: auto;
    display: block;
    transform: translateY(2vw);
    transition:
        opacity 0.7s ease,
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.main_bowl_img_layer:not(.is-active) {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.main_bowl_img_layer.is-active {
    position: relative;
    opacity: 1;
    transform: translateY(0);
}

/* ── main_box_figure (좌/우 검은 박스, 308x239 aspect, section absol) ── */
/* heightSource: panel.rect baked 308x239 — PSD 사각형 6 복사 2 (단일 시각 박스) */
.main_box {
    position: absolute;
    top: 17.5853vw;
    /* 335/1905 */
    width: 16.1680%;
    /* 308/1905 */
    /* heightSource: panel.rect baked 308x239 */
    aspect-ratio: 308 / 239;
    background: #000000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    z-index: 6;
    box-sizing: border-box;
}

.main_box_left {
    left: 6.2467%;
}

/* 119/1905 */
.main_box_right {
    left: 78.3727%;
}

/* 1493/1905 */

.main_box_label {
    position: relative;
    margin: 0;
    margin-top: 3.3071vw;
    /* (398-335)/1905 */
    width: 100%;
    text-align: center;
    white-space: nowrap;
    align-self: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 1.1549vw;
    /* 22/1905 */
    color: #ffffff;
    line-height: 1.372;
    letter-spacing: -0.025em;
}

.main_box_value {
    position: relative;
    margin: 0;
    margin-top: 1.2073vw;
    /* (443-(398+22))/1905 = 23/1905 */
    width: auto;
    text-align: center;
    white-space: nowrap;
    align-self: center;
    color: #fff2d3;
    line-height: 1.0;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.2624vw;
    /* 5/1905 */
}

.main_box_num {
    font-family: var(--ff);
    /* Anton */
    font-weight: 400;
    font-size: 4.2520vw;
    /* 81/1905 */
    line-height: 1.0;
    letter-spacing: 0;
}

.main_box_unit {
    font-family: var(--sf);
    font-weight: 400;
    font-size: 2.6772vw;
    /* 51/1905 */
    line-height: 1.0;
    letter-spacing: -0.025em;
}

/* "분"/"년" 단위 이미지 (main_02.webp 분 / main_03.webp 년) — PSD 48x51 */
.main_box_unit_img {
    width: 2.5197vw;
    /* natural 48 / 1905 */
    height: auto;
    display: inline-block;
    margin-left: 0.2624vw;
    /* 5/1905 gap to number */
    transform: translateY(-0.05em);
}

/* ── main_checker_img : section 하단 빨강/흰 체커띠 (main_05) ── */
.main_checker_img {
    position: absolute;
    top: 0;
    /* section 끝에 딱 붙도록 */
    left: -0.3674%;
    /* slight overflow */
    width: 100.7349%;
    /* 1919/1905 */
    z-index: 8;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}

.main_checker_img img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================================
   CON01 — why / dual marquee panel
   ============================================================ */
.con1 {
    position: relative;
    width: 100%;
    padding-top: 2.619423vw;
    padding-bottom: 0.052493vw;
    /* (2140-2139)/1905 */
        background: url("/images/con01_04.webp") no-repeat;
    background-size: cover;
    background-position: center;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 6;
}

.c1_scene {
    position: relative;
    width: 100%;
    margin-top: 5vw;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

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

.c1_big_word_img {
    top: 27.139108vw;
    /* (1531-1014)/1905 */
    left: 5.8%;
    /* 119/1905 */
    width: 86.456693vw;
    /* 1647/1905 */
    display: flex;
    z-index: 1;
    pointer-events: none;
}

.c1_food_marquee {
    top: 30.498688vw;
    /* (1595-1014)/1905 */
    left: -8.346457%;
    /* -159/1905 */
    width: 116.535433%;
    overflow: visible;
    z-index: 3;
    pointer-events: none;
}

.c1_food_track {
    display: flex;
    align-items: flex-start;
    width: max-content;
    animation: marquee 30s linear infinite;
}

.c1_food_set {
    display: flex;
    align-items: flex-start;
    gap: 5.774278vw;
    /* 110/1905 */
    padding-right: 5.774278vw;
    flex: 0 0 auto;
}

.c1_food_img {
    position: relative;
    width: 18.950131vw;
    /* 361/1905 */
    display: flex;
    flex: 0 0 auto;
}

.c1_strip {
    top: 41.732283vw;
    /* (1809-1014)/1905 */
    left: -0.052493%;
    /* -1/1905 */
    width: 100.787402vw;
    /* natural image width / 1905 */
    overflow: hidden;
    display: flex;
    z-index: 4;
    pointer-events: none;
}

.c1_strip_bg_img {
    position: relative;
    width: 100%;
    margin-top: 0;
    display: flex;
}

.c1_text_marquee {
    top: 5.301837vw;
    /* (1910-1809)/1905 */
    left: 0;
    width: 101.627297vw;
    /* 1936/1905 */
    overflow: visible;
    z-index: 6;
}

.c1_text_track {
    display: flex;
    align-items: flex-start;
    width: max-content;
    animation: marquee2 28s linear infinite;
}

.c1_text_slide_img {
    position: relative;
    width: 101.627297vw;
    /* 1936/1905 */
    display: flex;
    flex: 0 0 auto;
}

.c1_white_panel {
    position: relative;
    width: 60.209974%;
    /* 1147/1905 */
    margin-top: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
}

.c1_white_panel::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #ffffff;
    border: 1px solid #e51323;
    box-sizing: border-box;
    z-index: 2;
    pointer-events: none;
}

.c1_why_img {
    top: 5.931759vw;
    /* (1127-1014)/1905 */
    left: 39.843069%;
    /* (844-387)/1147 */
    width: 20.139494%;
    /* 231/1147 */
    display: flex;
    z-index: 5;
    pointer-events: none;
}

.c1_title {
    position: relative;
    margin-top: 11.128609vw;
    /* (1226-1014)/1905 */
    text-align: center;
    white-space: nowrap;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    white-space: nowrap;
    white-space: nowrap;
    line-height: 1.333;
    letter-spacing: -0.04em;
    color: #000000;
    z-index: 5;
}

.c1_title p {
    margin: 0;
}

.c1_body {
    position: relative;
    margin-top: 1.050919vw;
    /* body top after title linebox */
    text-align: center;
    white-space: nowrap;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 0.997375vw;
    white-space: nowrap;
    white-space: nowrap;
    line-height: 1.579;
    letter-spacing: -0.07em;
    color: #000000;
    z-index: 5;
}

.c1_body p {
    margin: 0;
}

.c1_center_cup {
    position: relative;
    width: 48.648649%;
    margin-top: 2.046877vw;
    display: flex;
    z-index: 6;
    margin-bottom: -6vw;
}

/* ============================================================
   CON02 — sticky left copy + right scroll stack
   ============================================================ */
.con2 {
    position: relative;
    width: 100%;
    padding-top: 0.000000vw;
    padding-bottom: 0.000000vw;
    background: #ffffff;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
}

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

.c02_title {
    position: relative;
    width: 45.459318%;
    margin-top: 9vw;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 4;
}

.c02_title_main {
    position: relative;
    margin: 0;
    text-align: center;
    white-space: nowrap;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    color: #000000;
    line-height: 1.2;
    letter-spacing: -0.04em;
}

.c02_title_main span {
    color: #e60012;
}

.c02_title_sub {
    position: relative;
    margin: 0;
    margin-top: 1.627297vw;
    text-align: center;
    white-space: nowrap;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.049869vw;
    color: #000000;
    line-height: 1.5;
    letter-spacing: -0.06em;
}

.c02_frame {
    position: relative;
    width: 97.585302%;
    margin-top: 2.3vw;
    align-self: center;
    padding-bottom: 8.398950vw;
    border: 1px solid #e51323;
    background: #fff8e9;
    overflow: visible;
    box-sizing: border-box;
}

.c02_competitive_badge {
    top: 0;
    left: 45.777300%;
    width: 8.230231%;
    z-index: 5;
    pointer-events: none;
}

.c02_timeline_layer {
    top: 0.000000vw;
    left: 0.000000%;
    width: 100%;
    z-index: 2;
    pointer-events: none;
}

.c02_timeline_line {
    top: 0;
    left: 49.865519%;
    width: 1px;
    height: 105vw;
    background: rgba(229, 19, 35, 0.2);
}

.c02_marker_stack {
    top: 13.490814vw;
    left: 48.359333%;
    width: 2.904788%;
}

.c02_marker_img {
    position: relative;
    width: 100%;
    display: flex;
}

.c02_marker_01 {
    margin-top: 0.000000vw;
}

.c02_marker_02 {
    margin-top: 29.763780vw;
}

.c02_marker_03 {
    margin-top: 29.973753vw;
}

.c02_frame_body {
    position: relative;
    width: 100%;
    margin-top: 7.821522vw;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    z-index: 4;
}

.c02_left_sticky {
    position: sticky;
    top: 8.556430vw;
    width: 26.681011%;
    margin-top: 0.734908vw;
    margin-left: 11.135019%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: flex-start;
    z-index: 4;
}

.c02_left_icon {
    position: relative;
    width: 9.072581%;
    margin-top: 0.000000vw;
    margin-left: 0.806452%;
    display: flex;
}

.c02_left_title {
    position: relative;
    margin: 0;
    margin-top: 1.207349vw;
    white-space: nowrap;
    text-align: left;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    color: #000000;
    line-height: 1.167;
    letter-spacing: -0.03em;
}

.c02_left_body {
    position: relative;
    margin: 0;
    margin-top: 2.467192vw;
    white-space: nowrap;
    text-align: left;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.154856vw;
    color: #000000;
    line-height: 1.364;
    letter-spacing: -0.07em;
}

.c02_right_stack {
    position: relative;
    width: 37.869822%;
    margin-top: 0.000000vw;
    margin-left: 23%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    z-index: 4;
}

.c02_card {
    position: relative;
    width: 100%;
    margin-top: 0.000000vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c02_card01_media {
    position: relative;
    width: 70.454545%;
    margin-top: 0.000000vw;
    display: flex;
}

/* video 3개 absol cover (이미지 위에 깔리는 순차 재생 layer) */
.c02_card01_video {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
}
.c02_card01_video.is-active {
    opacity: 1;
}

.c02_card_title {
    position: relative;
    margin: 0;
    margin-top: 2.3vw;
    white-space: nowrap;
    text-align: left;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 2.204724vw;
    color: #000000;
    line-height: 1.667;
    letter-spacing: -0.03em;
}

.c02_card_title span {
    color: #e51323;
}

.c02_card_body {
    position: relative;
    margin: 0;
    margin-top: 0.5vw;
    white-space: nowrap;
    text-align: left;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.049869vw;
    color: #000000;
    line-height: 1.5;
    letter-spacing: -0.07em;
}

.c02_separator {
    position: relative;
    width: 100%;
    background: rgba(0, 0, 0, 0.1019607843);
    height: 1px;
    margin-top: 4vw;
    margin-left: -4.5vw;
}

.c02_card02 {
    margin-top: 4.776903vw;
}

.c02_gauge_stage {
    top: 8.65vw;
    left: 55.7%;
    width: 21.022727%;
    z-index: 5;
    pointer-events: none;
}

.c02_gauge_img {
    position: absolute;
    top: 0.000000vw;
    left: 0.000000%;
    width: 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.c02_gauge_img.on {
    opacity: 1;
}

.c02_card02_body {
    width: auto;
}

.c02_card03 {
    margin-top: 3.989501vw;
}

.c02_card03_body {
    width: auto;
}

.con04 {
    position: relative;
    width: 1905px;
    container-type: inline-size;
    padding-bottom: 0.104987cqw;
    background: #e60012;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
}

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

.con04_top_food_img,
.con04_badge_icon,
.con04_grid_band_img,
.con04_side_food_left_img,
.con04_side_food_right_img,
.con04_center_banner_img,
.con04_bottom_food_right_img,
.con04_bottom_food_left_img,
.con04_menu_tiles>div,
.con04_ball_item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.con04_top_food_img {
    position: absolute;
    top: -8.926509cqw;
    left: 42.388381%;
    width: 16.352878%;
    z-index: 5;
    pointer-events: none;
}

.con04_badge {
    position: absolute;
    top: 1.052493cqw;
    left: 46.089239%;
    width: 8.661417%;
    z-index: 9;
    pointer-events: none;
}

.con04_badge_icon {
    position: relative;
    width: 27.272727%;
    margin-top: 0;
}

.con04_badge_text {
    position: absolute;
    top: 0.997375cqw;
    left: 34.545455%;
    width: 65.454545%;
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 1.859318cqw;
    line-height: 1.077;
    letter-spacing: -0.03em;
    color: #ffffff;
    white-space: nowrap;
}

.con04_mid_deco {
    position: absolute;
    top: 14.9vw;
    left: -0.052493%;
    width: 100.892388%;
    z-index: 4;
    pointer-events: none;
}

.con04_grid_band_img {
    position: absolute;
    top: 6.5vw;
    left: 0;
    width: 99.895941%;
    z-index: 1;
}

.con04_side_food_left_img {
    position: absolute;
    top: 0;
    left: 14.984391%;
    width: 15.296566%;
    z-index: 3;
}

.con04_side_food_right_img {
    position: absolute;
    top: -0.5vw;
    left: 70.447451%;
    width: 15.765869%;
    z-index: 3;
}

.anim-ready .con04_food_spin img {
    animation: con04FoodSpin 24s linear infinite;
}

.anim-ready .con04_food_spin_reverse img {
    animation: con04FoodSpinReverse 28s linear infinite;
}

.con04_ball_stage {
    position: absolute;
    z-index: 12;
    pointer-events: none;
    bottom: 15vw;
}

.con04_ball_stage_left {
    left: 1.574803%;
    width: 24.514436%;
}

.con04_ball_stage_right {
    left: 75.223097%;
    width: 24.461942%;
}

.con04_ball_item {
    position: absolute;
    z-index: 1;
    will-change: transform;
}

.con04_ball_13_img {
    top: 0;
    left: 16.488223%;
    width: 32.548180%;
}

.con04_ball_14_img {
    top: 6.824147cqw;
    left: 0;
    width: 32.762313%;
}

.con04_ball_15_img {
    top: 6.351706cqw;
    left: 30.620985%;
    width: 32.548180%;
}

.con04_ball_16_img {
    top: 6.456693cqw;
    left: 63.382227%;
    width: 32.762313%;
}

.con04_ball_17_img {
    top: 0;
    left: 16.094421%;
    width: 32.618026%;
}

.con04_ball_18_img {
    top: 6.824147cqw;
    left: 0;
    width: 32.618026%;
}

.con04_ball_19_img {
    top: 6.299213cqw;
    left: 30.472103%;
    width: 32.618026%;
}

.con04_ball_20_img {
    top: 6.404199cqw;
    left: 63.304721%;
    width: 32.618026%;
}

.con04_ball_item.is-pending {
    opacity: 0;
}

.con04_panel {
    position: relative;
    width: 97.585302%;
    margin-top: 5.041995cqw;
    align-self: center;
    background: #ffffff;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    box-sizing: border-box;
}

.con04_copy_stack {
    position: relative;
    width: auto;
    margin-top: 11.5vw;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 4;
    margin-left: 0.9vw;
}

.con04_title {
    position: relative;
    margin: 0;
    align-self: center;
    text-align: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606cqw;
    line-height: 1.25;
    letter-spacing: -0.04em;
    color: #000000;
    white-space: nowrap;
}

.con04_center_banner_img {
    position: relative;
    width: 100%;
    margin-top: 2vw;
    align-self: center;
    z-index: 4;
}

.con04_body {
    position: relative;
    margin: 0;
    margin-top: 2.257218cqw;
    align-self: center;
    text-align: center;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.049869cqw;
    line-height: 1.5;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
}

.con04_bottom_foods {
    position: relative;
    width: 46.100054%;
    margin-block-start: -2.099738cqw;
    align-self: center;
    transform: translateY(4.669291cqw);
    z-index: 5;
}

.con04_bottom_food_right_img {
    position: relative;
    width: 35.355893%;
    margin-top: 0;
    margin-left: 64.644107%;
    z-index: 4;
}

.con04_bottom_food_left_img {
    position: absolute;
    top: 0.262467cqw;
    left: 0;
    width: 35.472579%;
    z-index: 4;
}

.con04_menu_tiles {
    position: absolute;
    top: 0.419948cqw;
    left: 23.803967%;
    width: 52.275379%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.734908cqw;
    z-index: 7;
}

.con04_menu_tiles>div {
    position: relative;
    width: 22.321429%;
    margin-top: 0;
}

@keyframes con04FoodSpin {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes con04FoodSpinReverse {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(-360deg);
    }
}

/* ============================================================
   CON05 — 수익의 사각지대 ZERO
   card 1 PSD active sample is normalized to the default card state.
   ============================================================ */
.con05 {
    position: relative;
    width: 100%;
    padding-bottom: 31.338583vw;
    background-color: transparent;
    background-image: url('/images/con05_07.webp'), url('/images/con05_08.webp');
    background-size: 100.787402vw auto, 100.787402vw auto;
    background-position: center -0.734908vw, center 48.136483vw;
    background-repeat: no-repeat, no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 3;
}

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

.con05_badge_img,
.con05_label,
.con05_word_img,
.con05_scooter_img,
.con05_store_img {
    display: flex;
    justify-content: center;
    align-items: center;
}
.con05_scooter_img{
  animation: car 2s infinite;
}
@keyframes car {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2vw);
  }
  75% {
    transform: translateX(2vw);
  }
}

.con05_badge_img {
    position: absolute;
    top: 17.322835vw;
    left: 79.632546%;
    width: 8.451444%;
    z-index: 10;
    pointer-events: none;
}

.con05_title_stack {
    position: relative;
    width: 28.293963%;
    margin-top: 7.716535vw;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 5;
}

.con05_label {
    position: relative;
    width: 25.602968%;
    margin-top: 0;
    align-self: center;
    aspect-ratio: 138 / 38;
    line-height: 0;
    box-sizing: border-box;
}

.con05_title {
    position: relative;
    margin: 0;
    margin-top: 1.364829vw;
    align-self: center;
    text-align: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.25;
    letter-spacing: -0.04em;
    color: #000000;
    white-space: nowrap;
}

.con05_title span {
    color: #e60012;
}

.con05_desc {
    position: relative;
    margin: 0;
    margin-top: 0.419948vw;
    align-self: center;
    text-align: center;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.154856vw;
    line-height: 1.455;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
}

.con05_showcase {
    position: relative;
    width: 100%;
    margin-top: 2vw;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    z-index: 4;
}

.con05_scene_group {
    position: relative;
    width: 100%;
    margin-top: 0;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    z-index: 4;
}

.con05_cards_row {
    position: absolute;
    top: 0;
    left: 16.430446%;
    width: 68.031496%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    gap: 1.312336vw;
    z-index: 3;
}

.con05_card {
    position: relative;
    width: 23.533951%;
    margin: 0;
    padding: 3.7vw 0;
    background: #ffffff;
    border: 1px solid #e9d29c;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}


.con05_card_copy {
    position: relative;
    width: 100%;
    margin-top: 0;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.con05_card_title {
    position: relative;
    margin: 0;
    align-self: center;
    text-align: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 2.099738vw;
    line-height: 1;
    margin-bottom: 1vw;
    letter-spacing: -0.03em;
    color: #000000;
    white-space: nowrap;
    transition: 0.3s color;
}

.con05_card_body {
    position: relative;
    margin: 0;
    margin-top: 0;
    align-self: center;
    text-align: center;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 0.997375vw;
    line-height: 1.316;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
    transition: 0.3s;
}
/* 카드 배경 이미지 — absol cover, 기본 보임 */
.con05_02 {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    transition: opacity 0.3s;
}
.con05_02 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* card_copy 가 이미지 위에 오도록 */
.con05_card_copy {
    z-index: 1;
}
.con05_02 {
    opacity: 0;
    transition: 0.3s;
}
.con05_card.on .con05_02 {
    opacity: 1;
}

.con05_card.on .con05_card_title {
    color: #e60012;
}

.con05_card.on .con05_card_body {
    color: #ffffff;
}

.con05_word_img {
    position: absolute;
    top: 21.469816vw;
    left: 11.653543%;
    width: 77.427822%;
    z-index: 2;
    pointer-events: none;
}

.con05_scooter_img {
    position: absolute;
    top: 23.464567vw;
    left: 62.204724%;
    width: 12.125984%;
    z-index: 16;
    pointer-events: none;
}

.con05_store_img {
    position: relative;
    width: 31.181102%;
    margin-top: 11.7vw;
    align-self: center;
    z-index: 5;
}

/* main_section end */

/* ============================================================
   CON03 — 오늘도, 내일도 남매컵밥! (소형매장 / 다각화매출)
   canvas: 1905, sectionH = stripe h = 678/1905 = 35.59vw
   bg: #101010, pt=0, pb=0 (위/아래 검정 공간 없음, 컵밥 하단 ov hidden)
   structure:
     • c3_stripe (rltv _img, single image con03_04) ← heightChain 단일
     • c3_red_panel (absol wrapper, bgImage con03_01)
       └ c3_main_img (absol _img, single image con03_02 컵밥)
       └ c3_title_img (absol _img, single image con03_03 손글씨, z:5)
     • c3_left (absol wrapper) — 소형매장 + 타이틀 + 본문
     • c3_right (absol wrapper) — 다각화매출 + 타이틀 + 본문
   ============================================================ */
.con03 {
    position: relative;
    width: 100%;
    background: #101010;
    overflow: hidden;
    /* ★ 컵밥 하단 stripe 밖 튀어나옴 잘림 */
}

/* ── stripe (rltv _img, single image, heightChain 단일) ── */
.c3_stripe {
    align-self: center;
    width: 100%;
    aspect-ratio: 128/45;
    margin-top: 0;
}

.c3_stripe img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* ── 중앙 빨강 격자 패널 (absol wrapper, bgImage con03_01) ── */
.c3_red_panel {
    top: 0;
    left: 32.230971%;
    width: 36.325459%;
    height: 35.156250vw;
    background: url('/images/con03_01.webp') center/cover no-repeat;
    z-index: 1;
}

/* ── 메인 컵밥 (absol _img, single image, red_panel 자식) ── */
.c3_main_img {
    top: 8.661417vw;
    /* (4553-4388)/1905 — red_panel 기준 */
    left: 8.526012%;
    /* (673-614)/692 */
    width: 82.225434%;
    /* 569/692 */
    aspect-ratio: 569/592;
    z-index: 2;
}

.c3_main_img img {
    width: 100%;
    height: 100%;
    display: block;
}

/* ── 손글씨 타이틀 (absol _img, single image, z:5 컵밥 위) ── */
.c3_title_img {
    top: 5.406824vw;
    /* (4491-4388)/1905 — red_panel 기준 */
    left: -8.670520%;
    /* (554-614)/692 — 패널 좌측 살짝 넘침 */
    width: 117.485549%;
    /* 813/692 */
    aspect-ratio: 813/143;
    z-index: 5;
    /* ★ 컵밥(2) 위로 */
}

.c3_title_img img {
    width: 100%;
    height: 100%;
    display: block;
}

/* ── 왼쪽 그룹 wrapper ── */
.c3_left {
    top: 5.564304vw;
    /* (4494-4388)/1905 */
    left: 3.202100%;
    /* 61/1905 */
    width: 24.356955%;
    /* 464/1905 */
    height: 21.942257vw;
    /* 418/1905 */
    z-index: 10;
}

.c3_left_top_img {
    /* 소형매장 세로 — con03_05 23×114 */
    top: 0;
    left: 0;
    width: 4.956897%;
    /* 23/464 */
    aspect-ratio: 23/114;
}

.c3_left_top_img img {
    width: 100%;
    height: 100%;
    display: block;
}

.c3_left_title {
    top: 12.860892vw;
    /* (4739-4494)/1905 */
    left: 26.077586%;
    /* 121/464 */
    margin: 0;
    font-family: 'MBC1961', sans-serif;
    font-weight: 400;
    font-size: 2.099738vw;
    /* 40/1905 */
    color: #ffffff;
    line-height: 1.25;
    letter-spacing: -0.03em;
    white-space: nowrap;
}

.c3_left_desc {
    top: 19.370079vw;
    /* (4863-4494)/1905 */
    left: 25.862069%;
    /* 120/464 */
    margin: 0;
    font-family: 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.102362vw;
    /* 21/1905 */
    color: #ffffff;
    line-height: 1.429;
    letter-spacing: -0.07em;
    white-space: nowrap;
}

/* ── 오른쪽 그룹 wrapper ── */
.c3_right {
    top: 5.564304vw;
    left: 74.435696%;
    /* 1418/1905 */
    width: 23.307087%;
    /* 444/1905 */
    height: 21.679790vw;
    /* 413/1905 */
    z-index: 10;
}

.c3_right_top_img {
    /* 다각화매출 세로 — con03_06 23×144 */
    top: 0;
    left: 94.819820%;
    /* 421/444 */
    width: 5.180180%;
    /* 23/444 */
    aspect-ratio: 23/144;
}

.c3_right_top_img img {
    width: 100%;
    height: 100%;
    display: block;
}

.c3_right_title {
    top: 12.860892vw;
    right: 27.702703%;
    /* (1862-1739)/444 — PSD right edge 1739 */
    margin: 0;
    font-family: 'MBC1961', sans-serif;
    font-weight: 400;
    font-size: 2.099738vw;
    color: #ffffff;
    line-height: 1.25;
    letter-spacing: -0.03em;
    white-space: nowrap;
    text-align: right;
}

.c3_right_desc {
    top: 19.107612vw;
    /* (4858-4494)/1905 */
    right: 27.927928%;
    /* (1862-1738)/444 — PSD right edge 1738 */
    margin: 0;
    font-family: 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.102362vw;
    color: #ffffff;
    line-height: 1.429;
    letter-spacing: -0.07em;
    white-space: nowrap;
    text-align: right;
}

/* ============================================================
   CON06 — 남매컵밥 선택, 무엇이 다를까요?
   ============================================================ */
   .con0607{
    overflow: visible;
   }
.con06 {
    position: relative;
    width: 100%;
    margin-top: -27.559055vw;
    padding-top: 0;
    padding-bottom: 3.464567vw;
    /* (8711-8645)/1905 */
    background: #ffffff;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: auto;
}

.c6_panel {
    position: relative;
    width: 94.435696%;
    /* 1799/1905 */
    margin-top: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: auto;
}

.c6_panel img {
    display: block;
    width: 100%;
    height: auto;
}

.c6_panel_bg_img {
    top: -2.929134vw;
    left: 0;
    width: 99.888827%;
    /* 1797/1799 */
    z-index: 1;
    pointer-events: none;
}

.c6_top_bowl_img {
    top: -20.104987vw;
    /* (6960-7343)/1905 */
    left: 30.239022%;
    /* (607-63)/1799 */
    width: 39.299611%;
    /* 707/1799 */
    z-index: 2;
    pointer-events: none;
}

.c6_title_box {
    width: 28.293496%;
    /* 509/1799 */
    margin-top: 14.593176vw;
    /* (7621-7343)/1905 */
    overflow: visible;
    z-index: 5;
}

.c6_title_black {
    display: none;
    top: 0;
    left: 0;
    margin: 0;
    font-family: 'SuSeongHyeJeong', 'HsJandari', 'Paperozi', 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 5.781102vw;
    /* 110.13/1905 */
    line-height: 0.98;
    letter-spacing: -0.03em;
    color: #000000;
    text-align: left;
    white-space: nowrap;
    white-space: nowrap;
    z-index: 1;
}

.c6_title_red_img {
    width: 100%;
    margin-top: 0;
    z-index: 2;
    pointer-events: none;
}

.c6_desc {
    margin: 1.417323vw 0 0;
    /* (7851-7824)/1905 */
    font-family: 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.154856vw;
    /* 22/1905 */
    line-height: 1.364;
    letter-spacing: -0.07em;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    white-space: nowrap;
    z-index: 5;
}

.c6_compare_table {
    width: 68.538077%;
    /* 1233/1799 */
    margin-top: 2.099738vw;
    /* (7941-7901)/1905 */
    overflow: visible;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    z-index: 6;
}

.c6_left_table,
.c6_right_red_panel {
    position: relative;
    padding-top: 3.307087vw;
    /* 63/1905 */
    padding-bottom: 2.782152vw;
    /* 53/1905 */
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}
.c6_right_red_panel{
    scale: 0.9;
}

.c6_left_table {
    width: 50.202758%;
    /* 619/1233 */
    z-index: 2;
}

.c6_right_red_panel {
    width: 50.121655%;
    /* 618/1233 */
    margin-left: -0.324413%;
    /* align x=959 against table x=344 */
    background: #e60012;
    z-index: 1;
}

.c6_right_red_panel::before {
    content: "";
    position: absolute;
    top: 6.246719vw;
    /* 119/1905 */
    left: 0;
    width: 1px;
    height: 16.902887vw;
    /* 322/1905 */
    background: rgba(0, 0, 0, .2);
    z-index: 2;
}

.c6_table_head {
    margin: 0;
    font-family: 'MBC1961', 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.784777vw;
    /* 34/1905 */
    line-height: 1.142;
    letter-spacing: -0.03em;
    white-space: nowrap;
    white-space: nowrap;
    text-align: center;
    z-index: 3;
}

.c6_left_head {
    color: #000000;
}

.c6_right_head {
    color: #ffffff;
}

.c6_rows {
    width: 100%;
    margin-top: 0.848924vw;
    /* row top 118px minus header block */
    z-index: 3;
}

.c6_rows p {
    width: 100%;
    height: 4.199475vw;
    /* 80/1905 */
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
}

.c6_left_rows p {
    border-top: 1px solid rgba(0, 0, 0, .2);
    font-family: 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.154856vw;
    /* 22/1905 */
    line-height: 1;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
}

.c6_left_rows p:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, .2);
}

.c6_right_rows p {
    border-top: 1px solid rgba(255, 255, 255, .45);
    font-family: 'MBC1961', 'Pretendard Variable', sans-serif;
    font-weight: 400;
    font-size: 1.312336vw;
    /* 25/1905 */
    line-height: 1;
    letter-spacing: -0.07em;
    color: #ffffff;
    white-space: nowrap;
}

.c6_right_rows p:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, .45);
}

.c6_logo_badge_img {
    top: 9.448819vw;
    /* (8121-7941)/1905 */
    left: 42.254663%;
    /* 521/1233 */
    width: 15.166261%;
    /* 187/1233 */
    z-index: 5;
}

.c6_food_group_img {
    top: 48.293963vw;
    /* (8263-7343)/1905 */
    left: 56.642579%;
    /* (1082-63)/1799 */
    width: 79.433018%;
    /* 1429/1799 */
    z-index: 8;
    pointer-events: none;
}

.c6_bottom_text_slide {
    width: 161.089494%;
    /* 2898/1799 */
    margin-top: 9.186352vw;
    margin-left: -29.961089%;
    /* (-476-63)/1799 */
    overflow: visible;
    align-self: flex-start;
    z-index: 7;
    pointer-events: none;
}

.c6_bottom_text_track {
    width: max-content;
    display: flex;
    align-items: flex-start;
    animation: marquee 30s linear infinite;
}

.c6_bottom_text_img {
    width: 152.125984vw;
    /* 2898/1905 */
    flex: 0 0 auto;
}

/* ============================================================
   CON07 — 13년 데이터 매출 증명
   ============================================================ */
.swiper_con07 {
    width: 100%;
    background-color: #fff;
    position: absolute;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    top: 53%;
    z-index: 3;
}
   .con07_slide{
    background-color: #fff;
    width: 13.45vw;
    text-align: center;
    border-right: 1px solid #000;
   }
   .con07_slide_top{
    padding: 1vw 0;
    border-bottom: 1px solid #000;
    font-size: 1vw;
   }
   .con07_slide_btm{
    padding: 1vw 0;
    font-size: 2vw;
    font-family: var(--ff);
   }





.con07 {
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 20;
}

.c07_panel {
    position: relative;
    width: 94.488189%;
    /* 1800/1905 */
    margin-top: 0;
    padding-bottom: 0;
    background: #e60012;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 6;
}

.c07_panel img {
    display: block;
    width: 100%;
    height: auto;
}

.c07_red_grid_img {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

.c07_food_img {
    top: 18.477690vw;
    /* diagonal visual top from PSD/webp */
    left: 0;
    width: 100%;
    z-index: 2;
    pointer-events: none;
}

.c07_title_stack {
    width: 32.166667%;
    /* 579/1800 */
    margin-top: 8.608924vw;
    /* (8875-8711)/1905 */
    overflow: visible;
    z-index: 5;
}

.c07_title_main {
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    /* 60/1905 */
    line-height: 1.05;
    letter-spacing: -0.04em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_title_main span {
    color: #fff2d3;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_title_desc {
    margin: 1.837270vw 0 0;
    /* (9036-9001)/1905 */
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.154856vw;
    /* 22/1905 */
    line-height: 1.182;
    letter-spacing: -0.07em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_badge {
    top: 16.850394vw;
    /* (9032-8711)/1905 */
    left: 79.277778%;
    /* (1486-59)/1800 */
    width: 11.222222%;
    /* 202/1800 */
    z-index: 6;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c07_badge_halo_img {
    position: relative;
    width: 100%;
    opacity: .72;
    overflow: visible;
    z-index: 1;
}

.c07_badge_halo_pulse {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: url('/images/con07_04.webp') center/100% auto no-repeat;
    z-index: 2;
    pointer-events: none;
}

.c07_badge_core_img {
    /* 38/202 */
    width: 62.376238%;
    /* 126/202 */
    z-index: 2;
}

.c07_sales_strip {
    top: 30.498688vw;
    /* (9292-8711)/1905 */
    left: -12.444444%;
    /* (-165-59)/1800 */
    width: 125.055556%;
    /* 2251/1800 */
    height: 7.926509vw;
    /* 151/1905 */
    background: transparent;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
    overflow: hidden;
    z-index: 4;
    background-color: #fff;
}

.c07_sales_track {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: stretch;
    transition-timing-function: linear !important;
}

.c07_sales_cell {
    position: relative;
    width: 15vw !important;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 1.154856vw;
    /* 22/1905 */
    border-right: 1px solid #000;
    box-sizing: border-box;
    transform: scale(.985);
    transform-origin: center center;
    transition: transform .35s ease;
}

.c07_sales_cell::before {
    content: "";
    position: absolute;
    top: 2.992126vw;
    /* 57/1905 */
    left: 0;
    width: 103%;
    height: 1px;
    background: #000;
}

.c07_sales_month {
    margin: 0;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 0.944882vw;
    /* 18/1905 */
    line-height: 1;
    letter-spacing: -0.07em;
    text-align: center;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_sales_value {
    margin: 2.2vw 0 0;
    /* 24/1905 */
    font-family: var(--ff);
    font-weight: 400;
    font-size: 2.099738vw;
    /* 40/1905 */
    line-height: 1;
    letter-spacing: -0.01em;
    text-align: center;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_phone_stage {
    position: relative;
    width: 49.722222%;
    /* 895/1800 */
    margin-top: 2.519685vw;
    /* (9136-9088)/1905 */
    margin-bottom: 0;
    margin-left: 12.277778%;
    /* (280-59)/1800 */
    align-self: flex-start;
    overflow: visible;
    display: flex;
    z-index: 7;
}

.c07_phone_video_mask {
    top: 0.892388vw;
    /* 17/1905 */
    left: 59.635196%;
    /* 540/895 */
    width: 28.944134%;
    /* 259/895 */
    aspect-ratio: 268 / 476;
    overflow: hidden;
    border-radius: 1.154856vw;
    background: #000000;
    z-index: 2;
}

.c07_phone_video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .35s ease;
}

.c07_phone_video.is-active {
    opacity: 1;
}

.c07_phone_img {
    width: 100%;
    z-index: 3;
    pointer-events: none;
}

.c07_sales_box {
    top: 44.199475vw;
    /* (9553-8711)/1905 */
    left: 30.166667%;
    /* (602-59)/1800 */
    width: 39.833333%;
    /* 717/1800 */
    height: 9.186352vw;
    /* 175/1905 */
    box-sizing: border-box;
    background: #000000;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    z-index: 8;
}

.c07_sales_label {
    margin: 2.5vw 0.944882vw 0 2.939633vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.154856vw;
    /* 22/1905 */
    line-height: 1.364;
    letter-spacing: -0.07em;
    color: #ffffff;
    text-align: left;
    white-space: nowrap;
    white-space: nowrap;
}

.c07_sales_amount {
    margin: 0;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 6.450394vw;
    /* 122.88/1905 */
    line-height: 1.077;
    letter-spacing: -0.01em;
    color: #fff2d3;
    text-align: left;
    white-space: nowrap;
    white-space: nowrap;
}

/* ============================================================
   CON08 — 매출/원가 (3 columns: 좌-카피, 중-파이, 우-테이블)
   ============================================================ */
.con08 {
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 2.152231vw;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    box-sizing: border-box;
}

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

.c8_inner {
    position: relative;
    width: 81.837270%;
    margin-top: 0;
    align-self: center;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 4vw;
}

/* LEFT */
.c8_left {
    position: relative;
    width: 24.951892%;
    margin-top: 9.763780vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c8_icon {
    position: relative;
    width: 13.110540%;
    aspect-ratio: 51 / 61;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c8_title {
    position: relative;
    margin: 0;
    margin-top: 1.889764vw;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.25;
    letter-spacing: -0.04em;
    color: #000000;
    text-align: left;
    white-space: nowrap;
}

.c8_title .red {
    color: #e60012;
}

.c8_desc {
    position: relative;
    margin: 0;
    margin-top: 1.732283vw;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.154856vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #000000;
    text-align: left;
    white-space: nowrap;
}

/* CENTER pie */
.c8_pie {
    position: relative;
    width: 31.686979%;
    margin-top: 0;
    margin-left: 7.207184%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c8_pie_img {
    position: relative;
    width: 97.773279%;
    margin-top: 5.931759vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c8_pie_margin_num {
    position: absolute;
    margin: 0;
    top: 11.968504vw;
    left: 61.352227%;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 2.362205vw;
    line-height: 1.077;
    color: #ffffff;
    white-space: nowrap;
    z-index: 6;
}

/* RIGHT table */
.c8_table {
    position: relative;
    width: 29.121231%;
    margin-top: 6.666667vw;
    margin-left: 6.032713%;
}

.c8_table_img {
    position: relative;
    width: 99.779736%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c8_table_rate_num {
    position: absolute;
    margin: 0;
    top: 20.009974vw;
    left: 78.634361%;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 1.417323vw;
    line-height: 1.077;
    color: #ffffff;
    white-space: nowrap;
    z-index: 6;
}

/* ── 모바일 ── */

/* ============================================================
   CON09 — 24시간 남매컵밥
   ============================================================ */
.con09 {
    --c09-scale: 1;
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    z-index: 1;
}

.con09 img {
    width: 100%;
    height: auto;
    display: block;
}

.c09_scene {
    position: relative;
    width: calc(100.787402vw * var(--c09-scale));
    margin-top: 0;
    margin-left: calc((100vw - (100.787402vw * var(--c09-scale))) / 2);
    align-self: flex-start;
    overflow: hidden;
    background: #0b0b0b;
}

.c09_bg_layer {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
}

.c09_photo_img {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}

.c09_noise_img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.c09_noise_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.62;
}

.c09_dim_overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.73);
    z-index: 2;
    pointer-events: none;
}

.c09_content_layer {
    width: 100%;
    margin-top: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c09_copy_row {
    width: 74.687500%;
    height: calc(12.545932vw * var(--c09-scale));
    margin-top: calc(14.068241vw * var(--c09-scale));
    margin-left: 12.395833%;
    align-self: flex-start;
    z-index: 7;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    pointer-events: none;
}

.c09_left_copy {
    width: 42.817294%;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c09_eyebrow {
    margin: 0;
    font-family: var(--tf, 'Paperlogy'), var(--mf);
    font-weight: 700;
    font-size: calc(1.837270vw * var(--c09-scale));
    line-height: 2;
    letter-spacing: -0.03em;
    color: #ffffff;
    text-align: left;
    white-space: nowrap;
}

.c09_title {
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: calc(3.149606vw * var(--c09-scale));
    line-height: 1.25;
    letter-spacing: -0.03em;
    color: #fff2d3;
    text-align: left;
    white-space: nowrap;
}

.c09_body {
    margin: 0;
    width: 24.686192%;
    margin-top: calc(0.419948vw * var(--c09-scale));
    margin-left: 0;
    font-family: var(--mf);
    font-weight: 300;
    font-size: calc(1.102362vw * var(--c09-scale));
    line-height: 1.667;
    letter-spacing: -0.07em;
    color: #ffffff;
    text-align: right;
    white-space: nowrap;
    z-index: 7;
}

.c09_time_stack {
    width: 100%;
    margin-top: calc(-13.910761vw * var(--c09-scale));
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c09_clock_img {
    width: 4.531250%;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 8;
    pointer-events: none;
    animation: alarmShakeJump 1.1s ease-in-out infinite;
}
@keyframes  alarmShakeJump {
    0% {
    transform: translateY(0) rotate(0deg);
}
15% {
    transform: translateY(-0.6vw) rotate(-6deg);
}
30% {
    transform: translateY(-0.6vw) rotate(6deg);
}
45% {
    transform: translateY(-0.6vw) rotate(-4deg);
}
60% {
    transform: translateY(-0.6vw) rotate(4deg);
}
75% {
    transform: translateY(-0.6vw) rotate(-2deg);
}

90% {
    transform: translateY(-0.6vw) rotate(2deg);
}
100% {
    transform: translateY(0) rotate(0deg);
}
}

.c09_24h_img {
    font-family: var(--ff);
    font-size: 11vw;
    opacity: 0.9;
    margin-top: -2.5vw;
    margin-bottom: -3.8vw;
}

.c09_24h_img {
    background: linear-gradient(#d20000 50%, transparent 69%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.c09_orbit_field {
    width: 60.104167%;
    margin-top: calc(-5.039370vw * var(--c09-scale));
    margin-left: 0;
    margin-bottom: calc(-37.532808vw * var(--c09-scale));
    z-index: auto;
}

.c09_ring_img {
    width: 100%;
    margin-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
    pointer-events: none;
}

.c09_cup_img {
    top: 52%;
    width: 27.717vw;
    left: 36%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 6;
    pointer-events: none;
}

.c09_orbit_badge {
    --c09-orbit-radius: calc(29.422572vw * var(--c09-scale));
    top: calc(31.601050vw * var(--c09-scale));
    left: 49.956672%;
    width: calc(5.249344vw * var(--c09-scale));
    z-index: 7;
    animation: c09Orbit 6.6s linear infinite;
    animation-play-state: paused;
    will-change: transform;
}

.c09_orbit_badge_img {
    position: relative;
    width: 100%;
    margin-top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c09_orbit_label {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: calc(1.797900vw * var(--c09-scale));
    line-height: 1.077;
    letter-spacing: -0.03em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    opacity: 0;
    animation: c09OrbitLabel 6.6s linear infinite;
    animation-play-state: paused;
}

.c09_orbit_badge.is-running .c09_orbit_label {
    animation-play-state: running;
}

.c09_orbit_label_morning {
    animation-name: c09OrbitLabelMorning;
}

.c09_orbit_label_lunch {
    animation-name: c09OrbitLabelLunch;
}

.c09_orbit_label_dinner {
    animation-name: c09OrbitLabelDinner;
}

@keyframes c09Orbit {
    0% {
        transform: translate(-50%, -50%) rotate(200deg) translateX(var(--c09-orbit-radius)) rotate(-200deg);
    }

    33.333333% {
        transform: translate(-50%, -50%) rotate(270deg) translateX(var(--c09-orbit-radius)) rotate(-270deg);
    }

    66.666667% {
        transform: translate(-50%, -50%) rotate(340deg) translateX(var(--c09-orbit-radius)) rotate(-340deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(560deg) translateX(var(--c09-orbit-radius)) rotate(-560deg);
    }
}

@keyframes c09OrbitLabelMorning {

    0%,
    23.999999% {
        opacity: 1;
    }

    24%,
    100% {
        opacity: 0;
    }
}

@keyframes c09OrbitLabelLunch {

    0%,
    23.999999%,
    48%,
    100% {
        opacity: 0;
    }

    24%,
    47.999999% {
        opacity: 1;
    }
}

@keyframes c09OrbitLabelDinner {

    0%,
    47.999999%,
    76%,
    100% {
        opacity: 0;
    }

    48%,
    75.999999% {
        opacity: 1;
    }
}

/* CON03 end */

/* ============================================================
   CON10 — 오늘도 남매컵밥 (main_menu 게시판 연동)
   canvas: 1905, sectionH: ~877px (=46.04vw)
   ============================================================ */
.con10 {
    position: relative;
    width: 100%;
    background: #ffffff;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c10_menu_logo {
    align-self: center;
    width: 18.005249%;
    aspect-ratio: 343/77;
    margin-top: 6.5vw;
    overflow: hidden;
}

.c10_menu_logo img {
    width: 100%;
    height: 100%;
    display: block;
}

.c10_title {
    align-self: center;
    margin: 2vw 0 0;
    font-family: 'MBC1961', sans-serif;
    font-weight: 400;
    font-size: 3.149606vw;
    color: #000000;
    line-height: 1.25;
    letter-spacing: -0.04em;
    white-space: nowrap;
}

.c10_desc {
    align-self: center;
    margin: 0.2vw 0 0 !important;
    font-family: 'Pretendard Variable', sans-serif;
    font-weight: 500;
    font-size: 1.154856vw;
    color: #000000;
    line-height: 1.455;
    letter-spacing: -0.07em;
    white-space: nowrap;
}

.c10_panel {
    position: relative;
    align-self: center;
    width: 80.734908%;
    margin-top: 2.414698vw;
    background: #fff7e8;
    border: 1px solid #e70a1b;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 4.461942vw;
    overflow: visible;
}

.c10_grid_left_img,
.c10_grid_right_img {
    width: 21.523vw;
    top: 0;
}

.c10_grid_left_img {
    left: 0;
}

.c10_grid_left_img img {
    rotate: 180deg;

}

.c10_grid_right_img {
    right: 0;
}

.c10_grid_line {
    width: 100%;
    height: 1px;
    background-color: #e80a1b;
    top: 4.2vw;
}

.c10_tab {
    align-self: center;
    margin: 0.8vw 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 2.624672vw;
    z-index: 2;
}

.c10_tab_item {
    font-family: 'MBC1961', sans-serif;
    font-weight: 400;
    font-size: 1.312336vw;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #000000;
    padding: 0.629921vw 1.732283vw;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
    border: 1px solid transparent;
}

.c10_tab_item.is-active {
    background: #000000;
    color: #ffffff;
}

.c10_tab_item:focus-visible {
    outline: 2px solid var(--mc);
    outline-offset: 2px;
}

.c10_divider {
    align-self: stretch;
    margin: 0.682415vw 0 0;
    width: 100%;
    height: 1px;
    border: 0;
    background: #000000;
    z-index: 1;
}

.c10_menu_grid {
    align-self: center;
    margin: 4.251969vw 0 0;
    width: 80%;
    display: flex;
    flex-wrap: wrap;
    gap: 1.994751vw 1.994751vw;
    justify-content: flex-start;
    z-index: 2;
}

.c10_card {
    width: 31.260229%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    box-sizing: border-box;
}

.c10_card[hidden] {
    display: none;
}

.c10_card_img {
    width: 100%;
    aspect-ratio: 382/286;
    overflow: hidden;
    border: 1px solid #000000;
    box-sizing: border-box;
}

.c10_card_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.c10_card_name {
    margin: 1.312336vw 0 0;
    font-family: 'MBC1961', sans-serif;
    font-weight: 400;
    font-size: 1.2vw;
    line-height: 1.2;
    letter-spacing: -0.03em;
    color: #000000;
    text-align: center;
    white-space: nowrap;
}

.c10_more_img {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 50%);
    margin: 0;
    width: 7.191601%;
    aspect-ratio: 137/52;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    z-index: 5;
}

.c10_more_img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: transform 0.3s ease;
}

/* 모두 펼쳐진 상태 — 이미지 180° 회전 (닫기 효과) */
.c10_more_img.is-open img {
    transform: rotate(180deg);
}

.c10_more_img[hidden] {
    display: none;
}

.c10_more_img:focus-visible {
    outline: 2px solid var(--mc);
    outline-offset: 4px;
}

/* ── con10 bottom strip (checker band + NAM.MAE 박스) ──
   con11 상단에 있던 띠를 con10 꼬리로 이동. 띠 이미지가 wrapper 높이를 만들고
   NAM.MAE 박스는 absol 중앙으로 띠 위에 얹힘. */
.c10_bottom_strip {
    align-self: stretch;
    width: 100%;
    margin-top: 7vw;
    z-index: 2;
}

.c10_bottom_strip_img {
    width: 100%;
}

.c10_bottom_strip_img img {
    width: 100%;
    height: auto;
    display: block;
}

.c10_nam_mae_img {
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8.9239vw;
    z-index: 3;
}

.c10_nam_mae_img img {
    width: 100%;
    height: auto;
    display: block;
}

/* CON10 end */

/* ============================================================
   CON11 — EASY & FAST 게이지 + 3 STEP 영상
   ============================================================ */
.con11 {
    position: relative;
    width: 100%;
    padding-top: 1vw;
    padding-bottom: 10vw;
    background: url('/images/con11_10.webp') center top / 100% 100% no-repeat, #fffaea;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    /* margin-top: -2.8vw; */
}

/* con11 top strip moved to con10 bottom — see .c10_bottom_strip block above */
.c10_bottom_strip ::after{
    width: 100%;
    height: 50%;
    bottom: 0;
    left: 0;
    position: absolute;
    content: "";
    background-color: #fef4de;
    z-index: -1;
}
.c11_eyebrow {
    position: relative;
    margin: 0;
    margin-top: 6.5vw;
    align-self: center;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 2.8vw;
    color: #d42628;
    line-height: 1.21;
    letter-spacing: 0.4em;
    white-space: nowrap;
    text-align: center;
}

.c11_title {
    position: relative;
    margin: 0;
    margin-top: 2vw;
    align-self: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.2546vw;
    color: #000;
    line-height: 1.2;
    letter-spacing: -0.025em;
    text-align: center;
}

.c11_subtitle {
    position: relative;
    margin: 0;
    margin-top: 2.1522vw;
    align-self: center;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.1549vw;
    color: #000;
    line-height: 1.455;
    letter-spacing: -0.07em;
    white-space: nowrap;
    text-align: center;
}

.c11_gauge {
    position: relative;
    width: 100%;
    margin-top: 3.5170vw;
    aspect-ratio: 1905 / 126;
    background: #0a0a0a;
    overflow: hidden;
    z-index: 2;
}

.c11_gauge_fill {
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: linear-gradient(90deg, #e91626 0%, #f23a48 60%, #ffb1b8 100%);
    box-shadow:
        0 0 1.5vw rgba(255, 50, 60, 0.5),
        inset -2vw 0 3vw rgba(255, 200, 200, 0.35);
    will-change: width;
}

.c11_gauge_fill::after {
    content: "";
    position: absolute;
    top: 0;
    right: -0.5vw;
    width: 1vw;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100%);
    filter: blur(0.4vw);
    pointer-events: none;
}

.c11_gauge_divider {
    position: absolute;
    top: 0;
    width: 0.0525vw;
    height: 100%;
    background-image: linear-gradient(to bottom, #fff 70%, transparent 50%);
    background-size: 0.0525vw 0.5vw;
    background-repeat: repeat-y;
    opacity: 0.85;
    z-index: 4;
}

.c11_gauge_divider_1 {
    left: 33.3333%;
}

.c11_gauge_divider_2 {
    left: 66.6666%;
}

.c11_gauge_icon {
    position: absolute;
    z-index: 6;
    opacity: 0.4;
    transition: opacity 0.4s ease, transform 0.4s ease, filter 0.4s ease;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c11_gauge_icon img {
    width: 100%;
    height: auto;
    display: block;
}

.c11_gauge_icon.is-active {
    opacity: 1;
    transform: scale(1.12);
    filter: drop-shadow(0 0 0.6vw rgba(255, 255, 255, 0.6));
}

.c11_gauge_icon_1 {
    left: 1.7848%;
    top: 1.6798vw;
    width: 2.9396vw;
}

.c11_gauge_icon_2 {
    left: 35.3805%;
    top: 1.4698vw;
    width: 3.3071vw;
}

.c11_gauge_icon_3 {
    left: 68.5564%;
    top: 2.2047vw;
    width: 3.0446vw;
}

.c11_gauge_counter {
    position: absolute;
    margin: 0;
    top: 1.5vw;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--ff);
    font-weight: 400;
    font-size: 3.6745vw;
    color: #fff;
    line-height: 1.0;
    letter-spacing: 0.02em;
    white-space: nowrap;
    z-index: 8;
    font-variant-numeric: tabular-nums;
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    text-shadow: 0 0 0.4vw rgba(0, 0, 0, 0.4);
}

.c11_gauge_counter_seg {
    display: inline-block;
    width: 2.2ch;
    text-align: center;
}

.c11_gauge_counter_sep {
    display: inline-block;
    width: 0.7ch;
    margin: 0 0.2ch;
    text-align: center;
}

.c11_steps {
    position: relative;
    width: 100%;
    margin-top: 4vw;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding: 0;
    box-sizing: border-box;
    z-index: 2;
    gap: 5vw;
}

.c11_step {
    width: 22vw !important;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c11_step_2 {
    transform: translateY(3vw);
}

.c11_step_media {
    position: relative;
    width: 100%;
    height: 16vw;
    overflow: hidden;
}

.c11_step_media video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c11_step_label {
    position: relative;
    margin-top: 0.8vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: flex-start;
    gap: 0.7vw;
}

.c11_step_badge_img {
    width: 6.4042vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c11_step_badge_img img {
    width: 100%;
    height: auto;
    display: block;
}

.c11_step_text {
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 1.2073vw;
    color: #222;
    line-height: 1.0;
    letter-spacing: -0.025em;
    white-space: nowrap;
}

/* CON11 end */

/* ============================================================
   CON12 — 가성비 넘치는 컵밥과 다채로운 사이드메뉴
   캔버스 1905 · bg:#da0d1d + 빨간 타일 텍스처 con12_05
   ============================================================ */
.con12 {
    background: #da0d1d url('/images/con12_05.webp') center center / cover no-repeat;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
}

.swiper_con12 {
    width: 100%;
    top: 18%;
    overflow: hidden;
}

.swiper_con12.left {
    left: -75%;
}

.swiper_con12.right {
    right: -75%;
}

.swiper_con12_slide {
    width: 15.8005vw;
    height: 25.1969vw;
}

.swiper_con12_slide video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 좌측 리뷰 슬라이드 (peek) — section absol overlay */
.c12_left_swiper {
    top: 13.9633vw;
    left: 0;
    width: 22.0998%;
    height: 25.4068vw;
    overflow: hidden;
    z-index: 1;
}

.c12_left_swiper .swiper-slide {
    width: 15.8005vw;
    aspect-ratio: 301 / 480;
    overflow: hidden;
    border-radius: 0.157480vw;
    opacity: .92;
    transform: scale(.96);
    transition: transform .32s ease, opacity .32s ease;
}

.c12_left_swiper .swiper-slide img {
    width: 100%;
    display: block;
}

/* 우측 영상 클립 슬라이드 (peek) */
.c12_right_swiper {
    top: 13.3858vw;
    left: auto;
    right: 0;
    width: 21.5748%;
    height: 25.3018vw;
    overflow: hidden;
    z-index: 1;
}

.c12_right_swiper .swiper-slide {
    width: 15.8005vw;
    aspect-ratio: 301 / 480;
    overflow: hidden;
    border-radius: 0.157480vw;
    opacity: .92;
    transform: scale(.96);
    transition: transform .32s ease, opacity .32s ease;
}

.c12_right_swiper .swiper-slide img {
    width: 100%;
    display: block;
}

/* 하단 단체주문 마퀴 */
.c12_marquee {
    bottom: 0;
    left: 0;
    width: 100%;
    height: 13.6483vw;
    overflow: hidden;
    z-index: 2;
    background-color: #fff;
    padding: 0.5vw 0 3vw 0;
}

.c12_marquee .swiper-slide {
    width: 18.3727vw;
    aspect-ratio: 350 / 260;
    overflow: hidden;
    transform: scale(.96);
}

.c12_marquee .swiper-slide img {
    width: 100%;
    display: block;
}

/* 슬라이드.md 마퀴 룰 — 3개 swiper 모두 적용 */
.c12_left_swiper .swiper-wrapper,
.c12_right_swiper .swiper-wrapper,
.c12_marquee .swiper-wrapper {
    transition-timing-function: linear !important;
    pointer-events: none;
}

/* NAM/MAE 합성 박스 */
.c12_namae_img {
    margin-top: 0;
    align-self: center;
    width: 7.7165%;
    aspect-ratio: 147 / 134;
}

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

/* 이브로우 */
.c12_eyebrow {
    margin: 0;
    margin-top: 2.8654vw;
    align-self: center;
    font-family: var(--tf);
    font-weight: 400;
    font-size: 1.5748vw;
    color: #ffffff;
    letter-spacing: -0.03em;
    line-height: 0.9000;
    white-space: nowrap;
}

/* 메인 타이틀 — 1줄 #fff / 2줄 #fff2d3 */
.c12_title {
    margin: 0;
    margin-top: 1.6378vw;
    align-self: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.1496vw;
    color: #ffffff;
    text-align: center;
    letter-spacing: -0.04em;
    line-height: 1.0500;
    white-space: nowrap;
}

.c12_title_accent {
    color: #fff2d3;
    white-space: nowrap;
}

/* 서브타이틀 */
.c12_subtitle {
    margin: 0;
    margin-top: 1.6378vw;
    align-self: center;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.1549vw;
    color: #ffffff;
    text-align: center;
    letter-spacing: -0.07em;
    line-height: 1.2045;
    white-space: nowrap;
}

/* 컵 + 음식 모션 스테이지 */
.c12_cup_stage {
    margin-top: 3.3596vw;
    align-self: center;
    width: 30.7087%;
}

/* 음식 모션 컨테이너 (absol overlay, 컵 위로 솟음) — z:4 (cup_img 위) */
.c12_food_media {
    top: 0;
    left: 4.4444%;
    width: 90.5983%;
    aspect-ratio: 530 / 532;
    z-index: 4;
}

.c12_food_img {
    top: -1vw;
    left: 0;
    width: 100%;
    aspect-ratio: 530 / 532;
    opacity: 0;
    will-change: transform, opacity;
    animation: c12_food_swap 12.5s linear infinite both;
}

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

.c12_food_26_img {
    animation-delay: 0s;
}

.c12_food_27_img {
    animation-delay: 2.5s;
}

.c12_food_28_img {
    animation-delay: 5s;
}

.c12_food_29_img {
    animation-delay: 7.5s;
}

.c12_food_30_img {
    animation-delay: 10s;
}

/* 음식이 아래에서 올라와 자리잡고 다시 아래로 내려가며 사라지는 모션 — 5장 순차 (20%씩 노출)
   0~4%: 컵 아래에서 fade-in 상승
   4~16%: 자리잡고 잠시 머뭄 (컵 위 떠 있는 상태)
   16~20%: 아래로 내려가며 fade-out
*/
@keyframes c12_food_swap {
    0% {
        opacity: 0;
        transform: translateY(45%);
    }

    4% {
        opacity: 1;
        transform: translateY(0);
    }

    16% {
        opacity: 1;
        transform: translateY(0);
    }

    20% {
        opacity: 0;
        transform: translateY(45%);
    }

    100% {
        opacity: 0;
        transform: translateY(45%);
    }
}

/* 컵 베이스 (rltv heightChain main) — z:5 (food_media z:4보다 위 → 음식 하단 가려 컵 안에 들어간 느낌) */
.c12_cup_img {
    margin-top: 10.1837vw;
    width: 100%;
    aspect-ratio: 585 / 434;
    z-index: 5;
}

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

/* 컵 입구 림 — 음식 하단 가림 */
.c12_cup_rim_img {
    top: 10.1837vw;
    left: 0;
    width: 100%;
    aspect-ratio: 585 / 448;
    z-index: 4;
    pointer-events: none;
}

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

/* NAM.MAE 컵 위 흰색 로고 — 컵 가로 정중앙 */
.c12_logo {
    top: 15vw;
    left: 50%;
    transform: translateX(-50%);
    width: 49.2308%;
    aspect-ratio: 288 / 108;
    z-index: 6;
}

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

/* 단체주문 특화시스템 라벨 — 컵 가로 정중앙 */
.c12_subgrp_lbl {
    margin: 0;
    top: 21.5vw;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--mf);
    font-weight: 600;
    font-size: 1.1549vw;
    color: #ffffff;
    letter-spacing: -0.07em;
    line-height: 1.364;
    white-space: nowrap;
    z-index: 6;
}

/* 단체주문 맛집 남매컵밥 (메인) — 컵 가로 정중앙 */
.c12_grp_title {
    margin: 0;
    top: 24vw;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--sf);
    font-weight: 700;
    font-size: 3.0037vw;
    color: #ffffff;
    text-align: center;
    letter-spacing: -0.03em;
    line-height: 0.973;
    white-space: nowrap;
    z-index: 6;
}

/* CON12 end */

/* ============================================================
   CON14 — INTERIOR gallery
   ============================================================ */
.con14 {
    position: relative;
    width: 100%;
    padding-bottom: 5.5vw;
    background: #fff2d3;
    overflow: hidden;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    box-sizing: border-box;
}

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

.c14_probe_swiper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0.052493vw;
    overflow: visible;
    opacity: 0;
    pointer-events: none;
    z-index: -1;
}

.c14_probe_swiper .swiper-wrapper,
.c14_probe_swiper .swiper-slide {
    width: 100%;
    height: 0.052493vw;
}

.c14_probe_swiper img {
    width: 0.052493vw;
    height: 0.052493vw;
    margin-left: 49.973753vw;
}

.c14_inner {
    position: relative;
    width: 100.000000%;
    margin-top: 5.931759vw;
    align-self: flex-start;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: visible;
    box-sizing: border-box;
}

.c14_left {
    position: relative;
    width: 45.249344%;
    margin-top: 0;
    margin-left: 3.149606%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: visible;
    z-index: 4;
}

.c14_label_img {
    position: relative;
    width: 11.948956%;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c14_copy_stack {
    position: relative;
    width: 62.645012%;
    margin-top: 6.981627vw;
    margin-left: 20.765661%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.c14_title {
    position: relative;
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.167;
    letter-spacing: -0.04em;
    color: #000000;
    white-space: nowrap;
    text-align: left;
}

.c14_title span {
    color: #e40a1b;
}

.c14_desc {
    position: relative;
    margin: 0;
    margin-top: 1.259843vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.154856vw;
    line-height: 1.591;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
    text-align: left;
}

.c14_word_img {
    position: relative;
    width: 84.338747%;
    margin-top: 6.456693vw;
    margin-left: -10.788864%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.c14_nav {
    position: relative;
    width: 18.909513%;
    margin-top: 0;
    margin-left: 81.090487%;
    transform: translateY(-2.519685vw);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.367454vw;
    z-index: 6;
}

.c14_nav_btn {
    position: relative;
    width: 46.012270%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease;
    box-sizing: border-box;
}

.c14_nav_btn:hover,
.c14_nav_btn:focus-visible {
    transform: scale(1.08);
}

.c14_prev_btn img {
    transform: rotate(180deg);
}

.c14_media {
    position: relative;
    width: 49.711286%;
    margin-top: 2.099738vw;
    margin-left: 1.889764vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: hidden;
    z-index: 3;
}

.c14_main_swiper {
    position: relative;
    width: 100vw;
    margin-top: 0;
    margin-left: -50.288714vw;
    height: 25.721785vw;
    aspect-ratio: 777 / 490;
    overflow: hidden;
}

.c14_main_swiper .swiper-wrapper,
.c14_main_swiper .swiper-slide {
    height: 100%;
}

.c14_main_slide {
    position: relative;
    overflow: hidden;
}

.c14_main_slide img {
    width: 40.787402%;
    height: 100%;
    margin-left: 50.288714%;
    object-fit: cover;
}

.c14_thumb_swiper {
    position: relative;
    width: 100.000000%;
    margin-top: 1.574803vw;
    margin-left: 0;
    transform: translateY(0);
    overflow: hidden;
}

.c14_thumb_swiper .swiper-wrapper {
    align-items: flex-start;
}

.c14_thumb_slide {
    position: relative;
    width: 26.927139%;
    aspect-ratio: 255 / 186;
    overflow: hidden;
    background: #2e2e2e;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border: 1px solid transparent;
    box-sizing: border-box;
    cursor: pointer;
    transition: border-color 0.25s ease, filter 0.25s ease, transform 0.25s ease;
}

.c14_thumb_slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c14_thumb_slide.is-active {
    position: relative;
    border-color: #e40a1b;
    filter: saturate(1.08) contrast(1.03);
    transform: translateY(-0.157480vw);
    z-index: 2;
}

.c14_thumb_slide:hover {
    filter: saturate(1.08) contrast(1.03);
}

/* ============================================================
   CON13 — 성공 창업 대상 카드
   ============================================================ */
.con13 {
    position: relative;
    width: 100%;
    padding-top: 5vw;
    padding-bottom: 5.039370vw;
    background: #ffffff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 5;
}

.con13 img {
    display: block;
    width: 100%;
    height: auto;
}

.c13_left_edge_img {
    top: 31.089239vw;
    left: -14%;
    width: 20.000000%;
    z-index: 4;
    pointer-events: none;
}

.c13_right_food_img {
    top: 11.181102vw;
    left: 72.178478%;
    width: 43.202100%;
    z-index: 4;
    pointer-events: none;
}

.c13_chicken_img {
    top: 17vw;
    left: 6.036745%;
    width: 21.994751%;
    z-index: 5;
    pointer-events: none;
}

.c13_title_group {
    width: 38.740157%;
    margin-top: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 6;
}

.c13_marker_img {
    width: 5.284553%;
    margin-top: 0;
    z-index: 1;
}

.c13_eyebrow {
    margin: 0.839895vw 0 0;
    font-family: var(--tf);
    font-weight: 600;
    font-size: 1.312336vw;
    line-height: 1.286;
    letter-spacing: -0.03em;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    z-index: 1;
}

.c13_title {
    margin: 1.417323vw 0 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.05;
    letter-spacing: -0.04em;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    z-index: 1;
}

.c13_title span {
    color: #e40a1b;
    white-space: nowrap;
}

.c13_cards {
    width: 100%;
    margin-top: 2.992126vw;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    z-index: 3;
}

.c13_card {
    position: relative;
    width: 100%;
    margin: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-top: 1px solid rgba(0, 0, 0, .2);
    box-sizing: border-box;
    --c13-delay: 0s;
}

.c13_card:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, .2);
}

.c13_card_01 {
    --c13-delay: 0s;
}

.c13_card_02 {
    --c13-delay: 2.5s;
}

.c13_card_03 {
    --c13-delay: 5s;
}

.c13_card_04 {
    --c13-delay: 7.5s;
}

.c13_card_05 {
    --c13-delay: 10s;
}

.c13_card_cover_img {
    top: 0;
    left: -0.393701%;
    width: 100.787402%;
    height: 100%;
    overflow: visible;
    clip-path: inset(0 100% 0 0);
    z-index: 1;
    pointer-events: none;
    transition: clip-path 0.5s;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
}

.c13_card.on .c13_card_cover_img {
    clip-path: inset(0 0 0 0) !important;
}

.c13_card.on .c13_card_num {
    transform: translateY(0);
}

.c13_card.on .c13_card_text {
    color: #fff;
}

.c13_card_cover_img img {
    height: 100%;
    object-fit: cover;
}

.c13_card_num {
    top: -0.629921vw;
    left: 33.438320%;
    margin: 0;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 4.611024vw;
    line-height: 1;
    letter-spacing: 0;
    color: #fef1d2;
    white-space: nowrap;
    z-index: 2;
    pointer-events: none;
    transform: translateY(-100%);
    transition: 0.5s;
}

.c13_card_text {
    width: auto;
    margin: 0;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.154856vw;
    line-height: 5.091864vw;
    letter-spacing: -0.07em;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    z-index: 3;
    transition: 0.5s;
}

.swiper_con14_wrap {
    width: 50%;
    left: 50%;
    top: 7%;
}

.swiper_con14_top {
    width: 40.7874vw;
    overflow: hidden;
    pointer-events: none;
}
.con14_top_slide{
    width: 100%;
}

.swiper_con14_btm {
    width: 100%;
    margin-top: 1.5vw;
    overflow: hidden;
    pointer-events: none;
}

.con14_btm_slide {
    width: 14vw;
}



/* ── CON15 : promise card stack transition ── */
.main_video {
    width: 100%;
    height: 55vw;
}

.main_video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.con15 {
    width: 100%;
    margin-top: 0;
    /* margin-bottom: -7.769029vw; */
    padding-bottom: 8.923885vw;
    background: url("/images/con15_10.webp") no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    z-index: 1;
    /* transform: translateY(-7.769029vw); */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

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

.c15_scene {
    width: 100%;
    overflow: hidden;
    background: transparent;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /* margin-top: -8vw; */
}

.c15_awning_img {
    top: -0.5vw;
    left: 6.876640%;
    width: 87.034121%;
    z-index: 8;
}

.c15_bowl_img {
    top: -8vw;
    left: 36.377953%;
    width: 28.031496%;
    z-index: 6;
}

.c15_wordmark_img {
    top: 11vw;
    left: 27.874016%;
    width: 45.039370%;
    z-index: 3;
    mix-blend-mode: plus-lighter;
    opacity: 0.8;
}

.c15_head {
    width: 26.404199%;
    margin-top: 24vw;
    align-self: center;
    text-align: center;
    z-index: 7;
}

.c15_title {
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.167;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
    text-align: center;
}

.c15_title span {
    color: #e91c1c;
}

.c15_desc {
    margin: 0;
    margin-top: 0.367454vw;
    font-family: var(--mf);
    font-weight: 300;
    font-size: 1.154856vw;
    line-height: 1.364;
    letter-spacing: -0.07em;
    color: #ffffff;
    white-space: nowrap;
    text-align: center;
}

.c15_parts {
    width: 100%;
    height: 21.207349vw;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    z-index: 8;
}

.c15_part_label {
    position: absolute;
    top: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 1.574803vw;
    line-height: 1.358;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
    cursor: pointer;
    transition: 0.3s;
}


.c15_part_label_left {
    left: 17.795276%;
}

.c15_part_label_right {
    left: 71.706037%;
    opacity: 0.3;
}

.c15_card_group {
    position: absolute;
    top: 2.887139vw;
    left: 17.742782%;
    width: 65.301837%;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2.047244vw;
    /* opacity: 0; */
    pointer-events: none;
    transform: translateX(0);
    /* transition: transform 0.78s cubic-bezier(.2, .82, .2, 1), opacity 0.45s ease;
    z-index: 9; */
}
.c15_card1{
    z-index: 6;
}
.c15_card2{
    z-index: 5;
}
.c15_card3{
    z-index: 4;
}
.c15_card4{
    z-index: 4;
}
.c15_card5{
    z-index: 5;
}
.c15_card6{
    z-index: 6;
}

.c15_card {
    width: 31.270096%;
    height: 18.320210vw;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    background: url("/images/con15_09.webp") no-repeat;
    background-size: cover;
    background-position: center;
}

.c15_card_group_left .c15_card {
    transform-origin: left center;
}
.c15_card_group_left {
    z-index: 5;
}

.c15_card_group_right .c15_card {
    transform-origin: right center;
}

.c15_card .c15_card_icon {
    width: 15.424164%;
    margin-top: 3.202100vw;
}

.c15_card h3 {
    margin: 0;
    margin-top: 1.994751vw;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 1.469816vw;
    line-height: 1;
    letter-spacing: -0.04em;
    color: #000000;
    white-space: nowrap;
}

.c15_card p {
    margin: 0;
    margin-top: 1.522310vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 0.944882vw;
    line-height: 1.389;
    letter-spacing: -0.07em;
    color: #000000;
    white-space: nowrap;
}

.c15_stack_preview {
    top: 2.992126vw;
    width: 7.454068vw;
    height: 18.320210vw;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    opacity: 0.72;
    z-index: 8;
    cursor: pointer;
    perspective: 31.496063vw;
    transition: opacity 0.45s ease, transform 0.78s cubic-bezier(.2, .82, .2, 1);
}

.c15_stack_preview_right {
    right: -1.574803vw;
}

.c15_stack_preview_left {
    left: -1.574803vw;
}

.c15_stack_leaf {
    position: absolute;
    top: 0;
    width: 2.624672vw;
    height: 100%;
    overflow: hidden;
    border: 1px solid #e70a1b;
    background: #fff8e9;
    box-shadow: inset 0 0 0 1px #ffffff;
    box-sizing: border-box;
    transform-origin: center center;
    transition: transform 0.78s cubic-bezier(.2, .82, .2, 1), opacity 0.45s ease;
}

.c15_stack_leaf img {
    position: absolute;
    top: 0;
    left: 0;
    width: 20.209974vw;
    min-width: 20.209974vw;
    height: auto;
}

.c15_stack_leaf_1 {
    left: 0;
}

.c15_stack_leaf_2 {
    left: 2.309711vw;
}

.c15_stack_leaf_3 {
    left: 4.619423vw;
}

.c15_stack_preview_left .c15_stack_leaf_1 {
    transform: rotateY(14deg) translateX(-0.262467vw);
}

.c15_stack_preview_left .c15_stack_leaf_2 {
    transform: rotateY(4deg);
}

.c15_stack_preview_left .c15_stack_leaf_3 {
    transform: rotateY(-12deg) translateX(0.262467vw);
}

.c15_stack_preview_right .c15_stack_leaf_1 {
    transform: rotateY(12deg) translateX(-0.262467vw);
}

.c15_stack_preview_right .c15_stack_leaf_2 {
    transform: rotateY(-4deg);
}

.c15_stack_preview_right .c15_stack_leaf_3 {
    transform: rotateY(-14deg) translateX(0.262467vw);
}

.c15_stack_preview:hover .c15_stack_leaf_1 {
    transform: rotateY(0deg) translateX(-0.524934vw);
}

.c15_stack_preview:hover .c15_stack_leaf_2 {
    transform: rotateY(0deg) translateX(0);
}

.c15_stack_preview:hover .c15_stack_leaf_3 {
    transform: rotateY(0deg) translateX(0.524934vw);
}

.c15_scene.is-stable .c15_part_label_left,
.c15_scene.is-franchise .c15_part_label_right {
    opacity: 1;
}

.c15_scene.is-stable .c15_part_label_right,
.c15_scene.is-franchise .c15_part_label_left {
    opacity: 0.42;
}

.c15_scene.is-stable .c15_card_group_left,
.c15_scene.is-franchise .c15_card_group_right {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

/* .c15_scene.is-stable .c15_card_group_right {
    transform: translateX(44.934383vw);
} */

.c15_scene.is-franchise .c15_card_group_left {
    transform: translateX(-44.934383vw);
}

.c15_scene.is-stable .c15_stack_preview_left,
.c15_scene.is-franchise .c15_stack_preview_right {
    opacity: 0;
    pointer-events: none;
}

.c15_scene.is-stable .c15_stack_preview_left {
    transform: translateX(-6.299213vw);
}

.c15_scene.is-franchise .c15_stack_preview_right {
    transform: translateX(6.299213vw);
}

.c15_scene.is-stable .c15_stack_preview_right,
.c15_scene.is-franchise .c15_stack_preview_left {
    opacity: 0.72;
    pointer-events: auto;
    transform: translateX(0);
}

.c15_scene.is-visible .c15_card:nth-child(1) {
    transition-delay: 0.05s;
}

.c15_scene.is-visible .c15_card:nth-child(2) {
    transition-delay: 0.14s;
}

.c15_scene.is-visible .c15_card:nth-child(3) {
    transition-delay: 0.23s;
}

.c15_card:hover {
    transform: translateY(-0.314961vw);
}

.c15_scene:not(.is-visible) .c15_card:hover {
    transform: none;
}

.c15_scene.is-folding.is-stable .c15_card_group_left .c15_card {
    animation: c15CardUnfoldLeft 0.72s cubic-bezier(.2, .82, .2, 1) both;
}

.c15_scene.is-folding.is-franchise .c15_card_group_right .c15_card {
    animation: c15CardUnfoldRight 0.72s cubic-bezier(.2, .82, .2, 1) both;
}

.c15_scene.is-folding.is-stable .c15_card_group_left .c15_card:nth-child(2),
.c15_scene.is-folding.is-franchise .c15_card_group_right .c15_card:nth-child(2) {
    animation-delay: 0.08s;
}

.c15_scene.is-folding.is-stable .c15_card_group_left .c15_card:nth-child(3),
.c15_scene.is-folding.is-franchise .c15_card_group_right .c15_card:nth-child(3) {
    animation-delay: 0.16s;
}

@keyframes c15CardUnfoldLeft {
    0% {
        opacity: 0.18;
        clip-path: inset(0 82% 0 0);
        transform: translateX(-0.682415vw);
    }

    56% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: translateX(0.262467vw);
    }

    100% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: translateX(0);
    }
}

@keyframes c15CardUnfoldRight {
    0% {
        opacity: 0.18;
        clip-path: inset(0 0 0 82%);
        transform: translateX(0.682415vw);
    }

    56% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: translateX(-0.262467vw);
    }

    100% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: translateX(0);
    }
}

/* CON13 end */

/* ============================================================
   CON17 — 남매컵밥 창업비용 (red bg + 비용 table + 합계 + 요약)
   ============================================================ */
.con17 {
    position: relative;
    width: 100%;
    padding-top: 9.543307vw;
    padding-bottom: 0;
    background-color: #e60012;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: visible;
    box-sizing: border-box;
    margin-top: 0;
}

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

.c17_strip_img {
    position: absolute;
    top: 0;
    left: -0.393701%;
    width: 100.787402%;
    z-index: 2;
}

.c17_dish_img {
    position: absolute;
    top: -4vw;
    left: -7.191601%;
    width: 29.973753%;
    z-index: 6;
}

.c17_cup_img {
    position: absolute;
    top: 49.5vw;
    left: 76.955381%;
    width: 32.073491%;
    z-index: 6;
}

.c17_title {
    position: relative;
    margin: 0;
    align-self: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.167;
    letter-spacing: -0.04em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    z-index: 5;
}

.c17_title .cream {
    color: #fff2d3;
}

.c17_subtitle {
    position: relative;
    margin: 0;
    margin-top: 0.3vw !important;
    align-self: center;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.154856vw;
    line-height: 1.591;
    letter-spacing: -0.07em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    z-index: 5;
}

.c17_table_panel {
    position: relative;
    align-self: center;
    margin-top: 1.942257vw;
    width: 63.097113%;
    background: #ffffff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 5;
}

.c17_table {
    width: 72.213000%;
    border-collapse: collapse;
    table-layout: fixed;
    margin-top: 3.569554vw;
    border-top: 2px solid #000;
}

.c17_table thead th {
    height: 3.149606vw;
    padding: 0;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.102362vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #000;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.c17_table thead th:nth-child(1) {
    width: 30.299540%;
    border-right: 1px solid #ddd;
}

.c17_table thead th:nth-child(2) {
    width: 37.442396%;
    border-right: 1px solid #ddd;
}

.c17_table thead th:nth-child(3) {
    width: 31.105991%;
}

.c17_table tbody td {
    padding: 0;
    border-bottom: 1px solid #ddd;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.05vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #000;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.c17_table tbody tr:nth-child(1) td {
    height: 2.572178vw;
}

.c17_table tbody tr:nth-child(2) td {
    height: 2.677165vw;
}

.c17_table tbody tr:nth-child(3) td {
    height: 2.572178vw;
}

.c17_table tbody tr:nth-child(4) td {
    height: 2.677165vw;
}

.c17_table tbody tr:nth-child(5) td {
    height: 2.572178vw;
}

.c17_table tbody tr:nth-child(6) td {
    height: 2.677165vw;
}

.c17_table tbody tr:nth-child(7) td {
    height: 2.572178vw;
}

.c17_table tbody tr:nth-child(8) td {
    height: 2.572178vw;
}

.c17_table tbody td:nth-child(1) {
    border-right: 1px solid #ddd;
}

.c17_table tbody td:nth-child(2) {
    border-right: 1px solid #ddd;
}

.c17_table tbody tr:last-child td {
    border-bottom: 0;
}

.c17_table tbody tr.this {
    height: 4.5vw;
}

.con17 .c17_callout_img {
    width: 11.969vw;
    display: inline-block;
    vertical-align: middle;
}

.c17_table_total {
    position: relative;
    width: 100%;
    margin-top: 0vw;
    background: #000;
    padding: 1.469816vw 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.c17_total_label {
    margin-left: 21.880200%;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.102362vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
}

.c17_total_value {
    margin-left: 13.477537%;
    font-family: var(--mf);
    font-weight: 500;
    font-size: 1.102362vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
}

.c17_summary_row {
    position: relative;
    align-self: center;
    margin-top: 1.259843vw;
    width: 63.097113%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    z-index: 5;
}

.c17_summary_box {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 4vw;
    height: 5.091864vw;
    background: #000;
    box-sizing: border-box;
}

.c17_summary_change {
    width: 49.168053%;
}

.c17_summary_new {
    width: 49.251248%;
    margin-left: 1.580699%;
}

.c17_summary_label {
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.469816vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
}

.c17_summary_divider {
    flex: 0 0 auto;
    width: 1px;
    height: 1.574803vw;
    background: #515151;
}

.c17_summary_value {
    font-family: var(--ff);
    font-weight: 400;
    font-size: 2.300787vw;
    line-height: 1.077;
    color: #fff2d3;
    white-space: nowrap;
}

.c17_summary_unit {
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.469816vw;
    line-height: 1.455;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
    margin-left: -3.5vw;
}

.c17_disclaimer {
    position: relative;
    margin: 0;
    margin-top: 0.944882vw;
    align-self: flex-start;
    margin-left: 18.4%;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 0.85vw;
    line-height: 1.591;
    letter-spacing: -0.07em;
    color: #ffffff;
    text-align: left;
    white-space: nowrap;
    z-index: 5;
}

/* ============================================================
   CON18 — 남매컵밥 창업절차 (white bg, 8-step grid 2 rows of 4)
   ============================================================ */
.con18 {
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    background-color: #e60012;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    box-sizing: border-box;
}

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

.c18_namrae_img {
    position: relative;
    align-self: center;
    margin-top: 6.624672vw;
    width: 24.776903%;
    z-index: 5;
}

.c18_panel {
    position: relative;
    align-self: center;
    margin-top: -2.572178vw;
    width: 94.593176%;
    background: #ffffff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 7.611549vw;
    padding-bottom: 4.934383vw;
    z-index: 4;
    margin-bottom: 4vw;
}

.c18_title {
    position: relative;
    margin: 0;
    align-self: center;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.149606vw;
    line-height: 1.167;
    letter-spacing: -0.04em;
    color: #000;
    text-align: center;
    white-space: nowrap;
}

.c18_title .red {
    color: #e60012;
}

.c18_subtitle {
    position: relative;
    margin: 0;
    margin-top: 1.259843vw;
    align-self: center;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.154856vw;
    line-height: 1.591;
    letter-spacing: -0.07em;
    color: #000;
    text-align: center;
    white-space: nowrap;
    margin-top: 0.2vw !important;
}

.c18_steps_row1,
.c18_steps_row2 {
    position: relative;
    align-self: center;
    width: 78.634851%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1vw;
}

.c18_steps_row1 {
    margin-top: 3vw;
}

.c18_steps_row2 {
    margin-top: 2.204724vw;
}

.c18_step_img {
    position: relative;
    width: 21.312632%;
    flex-shrink: 0;
}

.c18_arrow_img {
    position: relative;
    width: 1.693719%;
    flex-shrink: 0;
}

/* ============================================================
   CON19 — 가족점 (매장 안내 / 카카오맵)
   ============================================================ */
.con19 {
    background: url("/images/con19_02.webp") no-repeat;
    background-size: cover;
    background-position: center;
    padding-top: 4.724409vw;
    padding-bottom: 8vw;
    width: 100%;
}

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

/* 타이틀 그룹 */
.c19_title {
    align-self: center;
    width: 18.845144%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.c19_title_icon {
    width: 62.395543%;
    aspect-ratio: 224/82;
}

.c19_main_title {
    margin-top: 1.837270vw;
    white-space: nowrap;
    font-family: var(--sf);
    font-size: 3.149606vw;
    font-weight: 400;
    color: #000000;
    letter-spacing: -0.04em;
    line-height: 1.167;
}

.c19_main_title .red {
    color: #e60012;
}

.c19_sub {
    margin-top: 0.2vw !important;
    white-space: nowrap;
    font-family: var(--mf);
    font-size: 1.154856vw;
    font-weight: 400;
    color: #000000;
    letter-spacing: -0.07em;
    line-height: 1.591;
}

/* 지도 카드 */
.c19_map_card {
    /* heightSource: PSD outer card rect 1565x654 (단일 시각 박스 baked) */
    align-self: center;
    width: 82.152231%;
    height: 34.330709vw;
    margin-top: 2.572178vw;
    background-color: #fef9ed;
    border: 1px solid #e60012;
    overflow: hidden;
}

/* 지도 배경 이미지 (con19_02 — 베이지 줄무늬 패턴, 카드 영역 cover) */
.c19_map_pic {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: #fef9ed;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

/* 카카오맵 영역 (SDK 동적 렌더, fallback 배경 위 overlay) */
.c19_kakaomap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

/* 좌측 패널 wrapper (탭 + strip + body 통째로 — 카드 내부 좌상단 absol) */
.c19_panel {
    top: 1.522310vw;
    left: 2.428115%;
    width: 25.878595%;
    display: flex;
    flex-direction: column;
    z-index: 3;
    border: 1px solid #000;
}

/* 탭 그룹 */
.c19_tabs {
    display: flex;
    flex-direction: row;
    width: 100%;
}

/* 탭 (좌/우 동일 폭 — 높이는 padding 으로) */
.c19_tab {
    cursor: pointer;
    flex: 1 1 0;
    padding: 1.181296vw 0;
    background-color: #ffffff;
    font-family: var(--mf);
    font-size: 0.946982vw;
    font-weight: 600;
    color: #131313;
    letter-spacing: -0.07em;
    line-height: 0.942;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    box-sizing: border-box;
}

.c19_tab.is-active {
    background-color: #e60012;
    color: #ffffff;
}

/* 빨간 strip (활성 탭과 panel body 사이) — 검색박스 감쌈, 높이는 padding 으로 */
.c19_panel_strip {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0.760498vw 0;
    background-color: #e60012;
}

/* 흰 검색박스 — 높이는 padding 으로 */
.c19_search {
    display: flex;
    align-items: center;
    width: 94.814815%;
    padding: 0.788058vw 0.787402vw;
    background-color: #ffffff;
    box-sizing: border-box;
}

.c19_search_input,
.c19_region_select {
    flex: 1 1 auto;
    border: 0;
    outline: 0;
    background: transparent;
    font-family: var(--mf);
    font-size: 0.946982vw;
    font-weight: 500;
    color: #131313;
    letter-spacing: -0.07em;
    line-height: 0.942;
    white-space: nowrap;
    box-sizing: border-box;
}

.c19_search_input::placeholder {
    color: #757575;
}

.c19_region_select {
    display: none;
    cursor: pointer;
}

.c19_search.region-mode .c19_search_input {
    display: none;
}

.c19_search.region-mode .c19_region_select {
    display: block;
}

.c19_search_icon {
    flex: 0 0 auto;
    width: 1.469816vw;
    aspect-ratio: 28/28;
    margin-left: 0.5vw;
}

.c19_search_icon img {
    width: 100%;
    height: 100%;
    display: block;
}

/* 패널 본체 + 매장 리스트 (overflow-y 스크롤) */
.c19_panel_body {
    width: 100%;
    height: 23.832021vw;
    background-color: #ffffff;
    overflow: hidden;
    box-sizing: border-box;
}

.c19_store_list {
    margin-top: 2.099738vw;
    margin-left: 8.395062%;
    width: 83.209877%;
    height: calc(100% - 4.199476vw);
    overflow-y: auto;
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: #ababab transparent;
}

.c19_store_list::-webkit-scrollbar {
    width: 0.3vw;
}

.c19_store_list::-webkit-scrollbar-thumb {
    background-color: #ababab;
    border-radius: 2px;
}

.c19_store_list::-webkit-scrollbar-track {
    background: transparent;
}

.c19_store {
    border-bottom: 1px solid #ababab;
    padding-bottom: 1.732283vw;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.c19_store+.c19_store {
    margin-top: 1.732283vw;
}

.c19_store:last-child {
    border-bottom: 0;
}

.c19_store_name {
    margin-left: 6.824926%;
    white-space: nowrap;
    font-family: var(--mf);
    font-size: 0.946982vw;
    font-weight: 700;
    color: #131313;
    letter-spacing: -0.07em;
    line-height: 0.942;
}

.c19_store_addr {
    margin-top: 0.892388vw;
    margin-left: 6.231454%;
    white-space: nowrap;
    font-family: var(--mf);
    font-size: 0.841470vw;
    font-weight: 400;
    color: #000000;
    letter-spacing: -0.07em;
    line-height: 0.936;
}

.c19_store_tel {
    margin-top: 0.419948vw;
    margin-left: 6.528190%;
    white-space: nowrap;
    font-family: var(--mf);
    font-size: 0.841470vw;
    font-weight: 400;
    color: #000000;
    letter-spacing: -0.07em;
    line-height: 0.936;
}

.c19_empty {
    margin-top: 4vw;
    text-align: center;
    white-space: nowrap;
    font-family: var(--mf);
    font-size: 0.946982vw;
    font-weight: 500;
    color: #ababab;
    letter-spacing: -0.07em;
    line-height: 0.942;
}

/* ============================================================
   CON20 — 13년의 진심
   ============================================================ */
.con20 {
    --c20-progress-index: 0;
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    background-color: #000000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 3;
}

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

.c20_top_marquee {
    width: 100.787402%;
    margin-top: 0;
    align-self: center;
    overflow: visible;
    z-index: 4;
}

.c20_top_bg_img {
    width: 100%;
    margin-top: 0;
    z-index: 1;
}

.c20_marquee_track {
    top: 5.249344vw;
    left: 0;
    width: max-content;
    display: flex;
    align-items: center;
    overflow: visible;
    z-index: 2;
    pointer-events: none;
    animation: c20TopMarquee 26s linear infinite;
}

.c20_marquee_strip {
    width: 101.627297vw;
    flex: 0 0 auto;
}

.c20_bowl_img {
    top: -17.007874vw;
    left: 33.880208%;
    width: 34.635417%;
    z-index: 5;
    pointer-events: none;
}

.c20_bowl_img img {
    transform-origin: 50% 50%;
    animation: c20BowlRotate 18s linear infinite;
    will-change: transform;
}

.c20_history_panel {
    width: 100%;
    margin-top: 0;
    padding-bottom: 11.023622vw;
    align-self: center;
    overflow: hidden;
    background-color: #000000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 2;
}

.c20_bg_photo {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url('/images/con20_04.webp') center center / cover no-repeat;
    z-index: 1;
    pointer-events: none;
}

.c20_history_panel::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.36);
    z-index: 2;
    pointer-events: none;
}

.c20_title_group {
    width: 39.527559%;
    margin-top: 10vw;
    align-self: center;
    text-align: center;
    z-index: 3;
}

.c20_title_main {
    margin: 0;
    font-family: var(--sf);
    font-size: 3.149606vw;
    white-space: nowrap;
    font-weight: 400;
    color: #ffffff;
    letter-spacing: -0.04em;
    line-height: 1.167;
}

.c20_title_main span {
    color: #e60012;
}

.c20_title_sub {
    margin-top: 1.942257vw;
    font-family: var(--mf);
    font-size: 1.154856vw;
    white-space: nowrap;
    font-weight: 400;
    color: #ffffff;
    letter-spacing: -0.07em;
    line-height: 1.364;
}

.c20_divider {
    width: 66.299213%;
    height: 3px;
    margin-top: 3.044619vw;
    align-self: center;
    overflow: visible;
    background-color: rgba(255, 255, 255, 0.18);
    z-index: 3;
}

.c20_line_red {
    top: 0;
    left: 0;
    width: 33.412510%;
    height: 3px;
    background-color: #e60012;
    transform: translate3d(calc(var(--c20-progress-index) * 100%), 0, 0);
    transition: transform 0.82s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 2;
}

.c20_story_swiper {
    width: 100%;
    margin-top: 6.666667vw;
    align-self: center;
    overflow: visible;
    z-index: 4;
}

.c20_story_swiper .swiper-wrapper {
    align-items: stretch;
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.c20_story_slide {
    width: 48.818898%;
    opacity: 0.28;
    transform: scale(0.92);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.c20_story_slide.swiper-slide-active,
.c20_story_slide.swiper-slide-duplicate-active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.c20_story_inner {
    width: 100%;
    text-align: center;
}

.c20_story_title {
    margin: 0;
    font-family: var(--tf);
    font-size: 1.469816vw;
    white-space: nowrap;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: -0.02em;
    line-height: 1.12;
}

.c20_reveal_title {
    width: fit-content;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.36);
    background-image: linear-gradient(90deg, #ffffff 0, #ffffff 50%, rgba(255, 255, 255, 0.36) 50%, rgba(255, 255, 255, 0.36) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: none;
}

.c20_reveal_title.c20_reveal_run {
    animation: c20StoryFill 3s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.c20_story_body {
    margin-top: 1.259843vw;
    font-family: var(--mf);
    font-size: 0.997375vw;
    white-space: nowrap;
    font-weight: 300;
    color: #ffffff;
    letter-spacing: -0.07em;
    line-height: 1.579;
}

.c20_bottom_line {
    width: 66.299213%;
    height: 1px;
    margin-top: 5.511811vw;
    align-self: center;
    overflow: visible;
    background-color: rgba(255, 255, 255, 0.18);
    z-index: 3;
}

@keyframes c20TopMarquee {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-101.627297vw, 0, 0);
    }
}

@keyframes c20StoryFill {

    0%,
    18% {
        background-position: 100% 0;
    }

    58%,
    100% {
        background-position: 0 0;
    }
}

@keyframes c20BowlRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* ============================================================
   CON21 — 상담 신청 폼 (PSD 정확값 기준 + rltv mt heightChain)
   bg: 빨강 세라믹 타일 (con21_03) cover
   heightChain: c21_content (rltv) → c21_bottom_food_img (rltv mt, aspect-ratio)
   c21_bg_media/top_logo/right_food = absol decoration (heightChain 미참여)
   ============================================================ */
.con21 {
    position: relative;
    width: 100%;
    background: url('/images/con21_03.webp') center top / cover no-repeat, #e60012;
    overflow: visible;
    /* NAM.MAE 박스 상단 걸침 */
    box-sizing: border-box;
    padding-top: 7.0866vw;
    /* NAM.MAE box bottom(84) ↔ form top GAP ~52 — 디자인 매칭 (135/1905) */
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ── 데코 레이어 (absol — heightChain 미참여) ── */
.c21_bg_media {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    opacity: 0;
    /* section background-image 가 실제 bg — 이건 PSD 매핑 흔적 */
}

.c21_bg_media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* 상단 NAM.MAE 박스 (사각형 23 복사 3: 168×168 #e60012 borderRadius:0)
   섹션 최상단에 절반 걸침. 흰색 inner border. */
.c21_top_logo_box {
    top: -4.4094vw;
    /* 168/1905 절반 위로 */
    left: 50%;
    transform: translateX(-50%);
    width: 8.8189vw;
    /* 168/1905 */
    aspect-ratio: 1 / 1;
    background: #e60012;
    border-radius: 0;
    /* PSD borderRadius:0 */
    box-shadow: inset 0 0 0 0.2099vw #ffffff;
    /* 흰색 inner border 4/1905 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 12;
}

.c21_top_logo_img {
    position: relative;
    width: 69.0476%;
    /* 116/168 */
    aspect-ratio: 116 / 91;
    display: flex;
    justify-content: center;
    align-items: center;
}

.c21_top_logo_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

/* 우측 음식 부동 이미지 (con21_05 378×625) */
.c21_right_food_img {
    top: 0vw;
    left: 80.1574%;
    /* PSD x=1527 / 1905 */
    width: 19.8425vw;
    /* 378/1905 */
    aspect-ratio: 378 / 625;
    z-index: 3;
    /* 폼 뒤로 — form_panel(z:7) 가 위에 */
    pointer-events: none;
    overflow: hidden;
}

.c21_right_food_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    margin-top: -6vw;
}

/* ============================================================
   c21_content — 메인 컨텐츠 wrapper (rltv heightChain)
   form_panel 의 rltv 자식 체인이 자연 높이 만듦
   left 는 absol 로 같은 수직 영역 위에 얹힘
   ============================================================ */
.c21_content {
    width: 100%;
    z-index: 5;
    box-sizing: border-box;
}

/* 좌측 카피 블럭 (absol — 메인 컨텐츠 위에 오버레이) */
.c21_left {
    top: 5.3543vw;
    /* PSD y 26133 - 26031 = 102 / 1905 (form panel top 기준) */
    left: 12.5984%;
    /* PSD x=240 / 1905 */
    width: 30%;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.c21_title {
    margin: 0;
    font-family: var(--sf);
    font-weight: 400;
    font-size: 3.1496vw;
    /* PSD 60px / 1905 */
    line-height: 1.167;
    letter-spacing: -0.04em;
    color: #ffffff;
    white-space: nowrap;
}

.c21_title_top {
    color: #ffffff;
}

.c21_title_accent {
    color: #fff2d3;
}

/* PSD 3행 #fff2d3 */
.c21_subtitle {
    margin: 0;
    margin-top: 1.4173vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.1549vw;
    line-height: 1.591;
    letter-spacing: -0.07em;
    color: #ffffff;
    white-space: nowrap;
}

.c21_call {
    margin-top: 2.8084vw;
    display: flex;
    align-items: center;
    gap: 1.1024vw;
}

.c21_call_icon_img {
    width: 2.8346vw;
    aspect-ratio: 54 / 54;
}

.c21_call_icon_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.c21_call_num {
    font-family: var(--ff);
    font-weight: 400;
    font-size: 3.2136vw;
    line-height: 1;
    letter-spacing: 0;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
}

/* ============================================================
   FORM PANEL — rltv heightChain (form rows mt → 자연 높이)
   panel: PSD (1017, 26031) 664×685 / borderRadius:0
   ============================================================ */
.c21_form_panel {
    margin-left: auto;
    margin-right: 11.7585%;
    /* PSD: section 우측 가장자리에서 (1905-(1017+664))/1905 = 224/1905 */
    width: 34.8556%;
    /* 664/1905 */
    background: #ffffff;
    border-radius: 0;
    /* PSD borderRadius:0 */
    z-index: 7;
    border: 0;
    padding-top: 5.8268vw;
    /* PSD row1 text top 111/1905 */
    padding-bottom: 3.7795vw;
    /* PSD bottom space 72/1905 */
    padding-left: 6.2992vw;
    /* PSD row1 텍스트 시작 120/1905 (vw — % 부모기준 회피) */
    padding-right: 6.2467vw;
    /* PSD 우측 패딩 119/1905 */
    box-sizing: border-box;
}

/* 폼 행 공통 (rltv — mt 로 세로 chain) */
.c21_form_row {
    margin: 0;
    margin-top: 0;
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: 0.5249vw;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 1.1533vw;
    /* PSD 21.97 / 1905 */
    line-height: 1.4;
    color: #000000;
    letter-spacing: -0.05em;
    white-space: nowrap;
}

.c21_chunk {
    white-space: nowrap;
    flex-shrink: 0;
}

/* 행간 mt — PSD 정확값 (각 행 사이 gap) */
.c21_row_1 {
    margin-top: 0;
}

.c21_row_2 {
    margin-top: 2.2572vw;
}

/* PSD 43/1905 */
.c21_row_3 {
    margin-top: 1.6273vw;
}

/* PSD 31/1905 — chip 행 */
.c21_row_4 {
    margin-top: 2.0472vw;
}

/* PSD 39/1905 */
.c21_row_5 {
    margin-top: 1.6273vw;
}

/* PSD 31/1905 */

/* 입력 underline 인풋 — PSD 선 864 시리즈 정확값 */
.c21_input {
    flex: 0 0 auto;
    border: 0;
    border-bottom: 1px solid #000000;
    background: transparent;
    font-family: inherit;
    font-size: inherit;
    line-height: 1;
    color: #000000;
    padding: 0.1574vw 0.2099vw 0.2099vw;
    outline: none;
    box-sizing: border-box;
    letter-spacing: inherit;
    text-align: center;
}

.c21_input_a {
    width: 6.9291vw;
}

/* 132/1905 */
.c21_input_b {
    width: 6.8766vw;
}

/* 131/1905 */
.c21_input_wide {
    width: 13.8583vw;
}

/* 264/1905 */
.c21_input_c {
    width: 12.0210vw;
}

/* 229/1905 */
.c21_input::placeholder {
    color: rgba(0, 0, 0, 0.22);
}

.c21_input:focus {
    border-bottom-color: var(--mc);
}

/* 라디오 행 */
.c21_row_radio {
    gap: 0.7349vw;
    align-items: center;
}

.c21_radio {
    display: inline-flex;
    cursor: pointer;
    margin: 0;
    position: relative;
}

.c21_radio+.c21_radio {
    margin-left: 0.3675vw;
}

/* PSD 칩 간 7/1905 */
.c21_radio input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.c21_chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 6.7192vw;
    /* 128/1905 */
    height: 2.2572vw;
    /* 43/1905 */
    background: #000000;
    color: #ffffff;
    font-family: var(--mf);
    font-weight: 400;
    font-size: 0.9428vw;
    /* PSD 17.96 / 1905 */
    letter-spacing: -0.03em;
    border-radius: 0;
    /* PSD borderRadius:0 */
    transition: background-color 0.15s ease;
    white-space: nowrap;
    user-select: none;
}

.c21_radio input:checked+.c21_chip {
    background: #e60012;
}

.c21_radio input:focus-visible+.c21_chip {
    outline: 0.1049vw solid rgba(230, 0, 18, 0.55);
    outline-offset: 0.1049vw;
}

/* divider (선 877: 569 wide, opacity 0.1) */
.c21_divider {
    margin-top: 2.1522vw;
    /* PSD 41/1905 */
    margin-left: -10.5422%;
    /* panel left padding 18% → divider 가 panel 가로 padding 안에서 더 넓게 ((120-48)/(664-240)) */
    margin-right: -10.5422%;
    height: 0.2099vw;
    /* 4/1905 */
    background: rgba(0, 0, 0, 0.102);
    border: 0;
}

/* 동의 체크 */
.c21_agree {
    width: 100%;
    margin: 0 auto;
    align-self: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4724vw;
    cursor: pointer;
    user-select: none;
}
.c21_line {
    width: 130%;
    height: 1px;
    background-color: #e6e6e6;
    margin: 3vw 0 2vw 0;
    margin-left: -15%;
}

.c21_agree input {
    appearance: none;
    -webkit-appearance: none;
    width: 0.9449vw;
    height: 0.9449vw;
    border: 0.1049vw solid #000000;
    border-radius: 50%;
    margin: 0;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
    transition: background-color 0.15s ease;
}

.c21_agree input:checked {
    background: #000000;
}

.c21_agree input:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.3149vw;
    height: 0.3149vw;
    background: #ffffff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.c21_agree_text {
    font-family: var(--mf);
    font-weight: 400;
    font-size: 0.8903vw;
    color: #000000;
    letter-spacing: -0.05em;
    white-space: nowrap;
}

/* submit (사각형 669 복사 3: 385×67 #e60012 borderRadius:0) */
.c21_submit {
    margin-top: 1.2598vw;
    /* PSD 24/1905 */
    align-self: center;
    width: 20.2099vw;
    /* 385/1905 */
    height: 3.5172vw;
    /* 67/1905 */
    background: #e60012;
    color: #ffffff;
    font-family: var(--mf);
    font-weight: 600;
    font-size: 1.0478vw;
    letter-spacing: -0.05em;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    transition: background-color 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c21_submit:hover {
    background: #c0001a;
}

.c21_submit:focus-visible {
    outline: 0.1574vw solid #ffffff;
    outline-offset: 0.2099vw;
}

/* 바닥 컵밥 어레인지먼트 (rltv — heightChain 마지막) */
.c21_bottom_food_img {
    margin-top: -13.4383vw;
    /* PSD overlap (26716-26460)/1905 = 256 정확값 */
    margin-left: 13.4908%;
    /* PSD x=257 / 1905 */
    width: 74.9081%;
    /* 1427/1905 */
    aspect-ratio: 1427 / 798;
    z-index: 4;
    pointer-events: none;
    align-self: flex-start;
    margin-bottom: -21vw;
    /* footer 위로 cupbap 걸쳐짐 */
}

.c21_bottom_food_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}