@font-face {
    font-family: 'Shokz Sans Text';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('https://static.shokz.co.kr/fonts/DisplaySans/ShokzSansText-Regular.woff2?v=2609071820') format('woff2');
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('https://static.shokz.co.kr/fonts/NotoSansKR/NotoSansKR-Medium.woff2?v=2609071820') format('woff2'),
        url('https://static.shokz.co.kr/fonts/NotoSansKR/NotoSansKR-Medium.woff?v=2609071820') format('woff'),
        url('https://static.shokz.co.kr/fonts/NotoSansKR/NotoSansKR-Medium.otf?v=2609071820') format('opentype');
}

html:has(#pal-page) {
    min-height: 100%;
    background: #000;
}

html body:has(#pal-page) {
    margin-top: 0;
    padding-top: 0;
    min-height: 100%;
    height: auto;
    touch-action: manipulation;
    background-color: #000 !important;
    background-image: none !important;
}

html body:has(#pal-page) {
    position: relative;
}

/* 下半段装饰背景：由 JS 写入 --pal-bg-top / --pal-bg-height（锚点 → #ft 底） */
html body:has(#pal-page)::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: var(--pal-bg-top, 0);
    height: var(--pal-bg-height, 0);
    z-index: 0;
    pointer-events: none;
    background-color: #15161d;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
}

@media (max-width: 1023px) {
    html body:has(#pal-page)::before {
        background-image: url("https://static.shokz.co.kr/resource/2026/10/09/c__Users_WX219070_AppData_Roaming_Cursor_User_workspaceStorage_21baf6f64a1ceb16557981bf3b1f35c3_images_pre_log_bg_m-e1bc5214-8ed5-4766-904a-167fee5f20ef_6ac8a90f1298b.webp");
    }
}

@media (min-width: 1024px) {
    html body:has(#pal-page) {
        touch-action: auto;
    }

    html body:has(#pal-page)::before {
        background-image: url("https://static.shokz.co.kr/resource/2026/10/09/c__Users_WX219070_AppData_Roaming_Cursor_User_workspaceStorage_21baf6f64a1ceb16557981bf3b1f35c3_images_pre_log_bg-f00ec239-f578-4fae-8ae6-de8b866ded1b_6ac89de652969.webp");
    }
}

html body:has(#pal-page) #wrapper {
    position: relative;
    z-index: 1;
}

html body:has(#pal-page) #wrapper,
html body:has(#pal-page) #container,
html body:has(#pal-page) #hd,
html body:has(#pal-page) #hd #tnb,
html body:has(#pal-page) #hd #tnb #hd_wrapper,
html body:has(#pal-page) #hd #hd_wr,
html body:has(#pal-page) #section-announcement {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

html body:has(#pal-page) #ft {
    position: relative;
    z-index: 2;
    background: #000 !important;
    background-color: #000 !important;
    background-image: none !important;
    border-top: solid 1px rgba(151, 151, 151, 0.3) !important;
}

html body:has(#pal-page) #ft #ft_wr {
    background: transparent !important;
    background-image: none !important;
}

html body #wrapper,
html body #container {
    margin-top: 0;
    padding-top: 0;
}


#container.is_community:has(.pal) {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    padding-top: 0 !important;
}

#container.is_community.fixed:has(.pal) {
    padding-top: 0 !important;
}

.is_community p {
    word-break: break-all;
}

.pal {
    --pal-orange: #ff7a3d;
    --pal-orange-press: #ff6e25;
    --pal-header-underlay: 0px;
    margin-top: calc(-1 * var(--pal-header-underlay, 0px));
    background: transparent;
    color: #fff;
    font-family: "Pretendard";
    overflow: hidden;
}

.pal img {
    max-width: none;
}

/* Header over hero: white nav/icons (member-center parity) */
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) #hd_wrapper {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) {
    background: transparent !important;
    background-color: transparent !important;
}

body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .gnb_1da,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .hd_search_link,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .hd_login>li a span,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .hd_actions .hd_btn_certified,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .hd_actions .hd_btn_support {
    color: #fff !important;
}

html body #hd #tnb:hover .search-icon,
html body #hd #tnb.hovering .search-icon,
html body #hd #tnb.scrolled .search-icon {
    filter: brightness(0) invert(1) !important;
}

html body #hd #tnb:hover #hd_wrapper .hd_navi #gnb_1dul>.gnb_1dli>a.gnb_1da,
html body #hd #tnb.hovering #hd_wrapper .hd_navi #gnb_1dul>.gnb_1dli>a.gnb_1da,
html body #hd #tnb.has-search-open #hd_wrapper .hd_navi #gnb_1dul>.gnb_1dli>a.gnb_1da,
html body #hd #tnb.scrolled #hd_wrapper .hd_navi #gnb_1dul>.gnb_1dli>a.gnb_1da {
    color: #fff !important;
}

html body #hd #tnb:hover .cart-icon,
html body #hd #tnb.hovering .cart-icon,
html body #hd #tnb.scrolled .cart-icon {
    filter: brightness(0) invert(1) !important;
}

html body #hd #tnb:hover .mypage-icon,
html body #hd #tnb.hovering .mypage-icon,
html body #hd #tnb.scrolled .mypage-icon {
    filter: brightness(0) invert(1) !important;
}

html body #hd #tnb:hover #logo .asz_logo,
html body #hd #tnb.hovering #logo .asz_logo,
html body #hd #tnb.scrolled #logo .asz_logo {
    filter: brightness(0) invert(1) !important;
}

body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) #logo .asz_logo {
    filter: brightness(0) invert(1) !important;
}

body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .search-icon,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .cart-icon,
body.has-pal-hero #tnb:not(.scrolled):not(.hovering):not(:hover) .mypage-icon {
    filter: brightness(0) invert(1) !important;
}

body.has-pal-hero #hd.is-pages-template #section-announcement .announcement,
body.has-pal-hero #hd.is-pages-template .ga4_topbar .announcement {
    background: rgba(0, 0, 0, 0.35) !important;
}

body.has-pal-hero #hd.is-pages-template .announcement-item a,
body.has-pal-hero #hd.is-pages-template .announcement-item span {
    color: #fff !important;
}

@media (max-width: 1023px) {

    body.has-pal-hero #hd #tnb,
    body.has-pal-hero #hd #tnb #hd_wrapper,
    body.has-pal-hero #hd #tnb.is-fixed #hd_wrapper,
    body.has-pal-hero #hd,
    body.has-pal-hero #hd_wr,
    body.has-pal-hero #hd_wr.is-fixed,
    body.has-pal-hero #hd_wr.scrolled,
    body.has-pal-hero #hd_wr.is-fixed.scrolled {
        background: transparent !important;
        background-color: transparent !important;
        border-bottom: none !important;
        box-shadow: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    body.has-pal-hero #hd_wr #btn_hdcate,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdcate,
    body.has-pal-hero #hd_wr.scrolled #btn_hdcate {
        background-image: url("https://static.shokz.co.kr/img/common/m-icon-menu_white.png") !important;
    }

    body.has-pal-hero #hd_wr #logo .logo_wr,
    body.has-pal-hero #hd_wr.is-fixed #logo .logo_wr,
    body.has-pal-hero #hd_wr.scrolled #logo .logo_wr {
        background-image: url("https://static.shokz.co.kr/resource/2025/11/12/m-logo_6913a762744a8.png") !important;
    }

    body.has-pal-hero #hd_wr #btn_hdcart .cart-icon-mo,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdcart .cart-icon-mo,
    body.has-pal-hero #hd_wr.scrolled #btn_hdcart .cart-icon-mo {
        filter: brightness(0) invert(1) !important;
    }

    body.has-pal-hero #hd_wr #btn_hdsearch,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdsearch,
    body.has-pal-hero #hd_wr.scrolled #btn_hdsearch,
    body.has-pal-hero #hd_wr #btn_hdsearch svg,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdsearch svg,
    body.has-pal-hero #hd_wr.scrolled #btn_hdsearch svg {
        color: #fff !important;
    }

    body.has-pal-hero #hd_wr #btn_hdsearch svg circle,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdsearch svg circle,
    body.has-pal-hero #hd_wr.scrolled #btn_hdsearch svg circle,
    body.has-pal-hero #hd_wr #btn_hdsearch svg path,
    body.has-pal-hero #hd_wr.is-fixed #btn_hdsearch svg path,
    body.has-pal-hero #hd_wr.scrolled #btn_hdsearch svg path {
        stroke: #fff !important;
    }

    body.has-pal-hero #hd_wr #hd_btn a,
    body.has-pal-hero #hd_wr #hd_btn button,
    body.has-pal-hero #hd_wr.is-fixed #hd_btn a,
    body.has-pal-hero #hd_wr.is-fixed #hd_btn button,
    body.has-pal-hero #hd_wr.scrolled #hd_btn a,
    body.has-pal-hero #hd_wr.scrolled #hd_btn button {
        color: #fff !important;
    }

    body.has-pal-hero #hd_wr.scrolled #cart_total_product_cnt,
    body.has-pal-hero #hd_wr.is-fixed #cart_total_product_cnt {
        color: #fff !important;
    }
}

.pal-hero {
    position: relative;
    height: 554px;
    margin-top: 0;
    background: #15161d;
    overflow: hidden;
}

.pal-hero__media {
    position: absolute;
    left: 0%;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.pal-hero__poster[hidden],
.pal-hero__video[hidden],
.pal-hero__still[hidden] {
    display: none;
}

.pal-hero__still {
    z-index: 1;
    display: block;
    background: #15161d;
}

.pal-hero__still img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.pal-hero.is-still .pal-hero__shade {
    display: none;
}

.pal-hero__video.is-preloading {
    opacity: 0;
}

.pal-hero__loader {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.pal-hero__loader[hidden] {
    display: none;
}

.pal-hero__loader-ring {
    display: block;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.pal-hero__loader-track,
.pal-hero__loader-bar {
    fill: none;
    stroke-width: 2;
}

.pal-hero__loader-track {
    stroke: rgba(255, 255, 255, 0.35);
}

.pal-hero__loader-bar {
    stroke: #fff;
    stroke-linecap: round;
    stroke-dasharray: 144.51;
    stroke-dashoffset: 144.51;
}

.pal-hero__loader-ring.is-indeterminate {
    animation: pal-hero-loader-spin 0.9s linear infinite;
}

.pal-hero__loader-ring.is-indeterminate .pal-hero__loader-bar {
    stroke-dasharray: 36 108.51;
    stroke-dashoffset: 0;
}

@keyframes pal-hero-loader-spin {
    to {
        transform: rotate(270deg);
    }
}

.pal-hero__shade {
    display: none;
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #15161d 17%, rgba(21, 22, 29, 0.81) 58%, rgba(21, 22, 29, 0) 100%);
}

.pal-hero.is-playing .pal-hero__shade {
    display: none;
}

/* Mobile: Figma 20745:5195 */
.pal-hero__controls {
    position: absolute;
    right: 24px;
    bottom: 24px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 16px;
}

.pal-hero__btn {
    position: relative;
    overflow: visible;
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    padding: 8px;
    border: 0;
    border-radius: 100px;
    background: rgba(212, 215, 222, 0.3);
    backdrop-filter: blur(2px);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pal-hero__btn img {
    display: block;
    width: 24px;
    height: 24px;
}

.pal-hero__icon-play {
    display: none;
    width: 40px;
    height: 40px;
}

.pal-hero__btn.is-paused {
    padding: 0;
    background: transparent;
    backdrop-filter: none;
}

.pal-hero__btn.is-paused .pal-hero__icon-pause {
    display: none;
}

.pal-hero__btn.is-paused .pal-hero__icon-play {
    display: block;
}

.pal-hero__icon-replay {
    display: none;
    width: 24px;
    height: 24px;
}

.pal-hero__btn.is-ended {
    padding: 8px;
    background: rgba(212, 215, 222, 0.3);
    backdrop-filter: blur(2px);
}

.pal-hero__btn.is-ended .pal-hero__icon-pause,
.pal-hero__btn.is-ended .pal-hero__icon-play {
    display: none;
}

.pal-hero__btn.is-ended .pal-hero__icon-replay {
    display: block;
}

.pal-hero__btn.is-muted {
    position: relative;
}

.pal-hero__btn.is-muted::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: #fff;
    transform: rotate(-40deg);
}

.pal-quiz {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 16px 0;
}

.pal-lower>.pal-prize {
    width: 100%;
    padding: 48px 0;
    box-sizing: border-box;
}

.pal-lower {
    position: relative;
}

.pal-quiz__photo {
    position: absolute;
    inset: 0;
    /* Figma 21307:2335 @3x 导出（含渐变），见 .cursor/figma/export-3x-assets.md */
    background: #000 url("https://static.shokz.co.kr/resource/2026/10/20/pal-quiz-photo-m_mvfzkccz.webp") center top / 100% auto no-repeat;
    height: 1073px;
}

.pal-quiz {
    background-color: #000;
}

.pal-quiz__photo::after {
    content: "";
    position: absolute;
    inset: 0;
}

.pal-quiz__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 361px;
    margin-top: 466px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pal-quiz__title {
    position: relative;
    z-index: 1;
    margin: 0;
    width: 100%;
    max-width: 326px;
    font-family: Pretendard, "Noto Sans KR", sans-serif;
    font-weight: 900;
    font-size: 32px;
    line-height: 52px;
    letter-spacing: 0;
    text-align: center;
    white-space: nowrap;
    background: linear-gradient(90deg, #fff 1.327%, #b5b9bc 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.br-m {
    display: block;
}

.pal-card {
    width: 100%;
    box-sizing: border-box;
    padding: 32px 24px;
    border-radius: 12px;
    background: rgba(91, 91, 91, 0.5);
    backdrop-filter: blur(8px);
}

.pal-card__head {
    text-align: center;
    color: #fff;
}

/* Mobile: Figma 20745:5199 */
.pal-card__promo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin-top: 16px;
    text-align: center;
}

.pal-card__promo p {
    margin: 0;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: 16px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: 0;
    background: linear-gradient(204deg, #d3dbe2 0%, #ebeced 73%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    white-space: pre;
}

.pal-card__promo strong {
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: 16px;
    font-weight: 900;
    line-height: 28px;
    color: #fff;
    -webkit-text-fill-color: #fff;
}

@media (max-width: 362px) {

    .pal-card__promo .mb-break,
    .pal-card__ko .mb-break {
        display: block;
    }
}

@media (max-width: 376px) {
    .pal-card__promo p {
        font-size: 15px;
    }
}


@media (min-width: 363px) {

    .pal-card__promo .mb-break,
    .pal-card__ko .mb-break {
        display: none;
    }
}

.pal-card__en {
    margin: 0;
    color: var(--font-white, #FFF);
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-M-H3--size, 23px);
    font-style: normal;
    font-weight: var(--text-M-H3--weight, 600);
    line-height: var(--text-M-H3--line-height, 35px);
    letter-spacing: var(--text-M-H3--letter-spacing, 0);
}

.pal-card__q {
    display: none;
}

.pal-card__ko {
    margin: 8px 0 0;
    color: var(--font-white, #FFF);
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-M-H4--size, 19px);
    font-style: normal;
    font-weight: var(--text-M-H4--weight, 600);
    line-height: var(--text-M-H4--line-height, 26px);
    letter-spacing: var(--text-M-H4--letter-spacing, 0);
}

.pal-card__form {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.pal-field {
    position: relative;
    z-index: 4;
    display: block;
    width: 100%;
    margin: 0;
}

.pal-field__caret {
    position: absolute;
    top: 50%;
    left: 16px;
    z-index: 3;
    width: 2px;
    height: 32px;
    background: #FF7A3D;
    border-radius: 1px;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0;
}

.pal-field__caret.is-on {
    animation: pal-field-caret-blink 1.06s steps(1) infinite;
}

.pal-field__mirror {
    position: absolute;
    left: -9999px;
    top: 0;
    visibility: hidden;
    overflow: hidden;
    white-space: pre;
    pointer-events: none;
}

@keyframes pal-field-caret-blink {

    0%,
    49% {
        opacity: 1;
    }

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

.pal-field input {
    position: relative;
    z-index: 2;
    width: 100%;
    box-sizing: border-box;
    height: 64px;
    border: 0;
    border-radius: 6px;
    background: #fff;
    padding: 19px 16px 19px 28px;
    font-family: "Shokz Sans Text", "Pretendard", sans-serif;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0.16px;
    color: #404040;
    outline: none;
    caret-color: transparent;
}

.pal-field input::placeholder {
    color: #404040;
    line-height: 26px;
}

.pal-field input:focus {
    box-shadow: 0 0 0 1px #ff7a3d;
}

.pal-agree {
    position: relative;
    z-index: 3;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0 8px;
    color: #a3a3a3;
    font-size: 14px;
    line-height: 21px;
}

.pal-agree--no-consent .pal-agree__required {
    cursor: default;
}

.pal-agree--no-consent .pal-agree__required input,
.pal-agree--no-consent .pal-agree__required .pal-agree__box,
.pal-agree--no-consent .pal-agree__text-label {
    display: none;
}

.pal-agree--no-consent .pal-agree__text {
    flex: none;
}

.pal-agree--no-consent {
    display: none;
}

.pal-agree__check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    cursor: pointer;
}

.pal-agree__check input {
    position: absolute;
    opacity: 0;
    width: 16px;
    height: 16px;
}

.pal-agree__box {
    flex: none;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    background: url("https://static.shokz.co.kr/resource/2026/10/09/checkbox-off_6ac895194a015.svg") center / 16px 16px no-repeat;
}

.pal-agree__check input:checked+.pal-agree__box {
    background-image: url("https://static.shokz.co.kr/resource/2026/10/09/checkbox-on_6ac8951952041.svg");
}

.pal-agree__check input:focus-visible+.pal-agree__box {
    outline: 2px solid #ff7a3d;
    outline-offset: 2px;
}

.pal-agree__text {
    flex: 1;
    min-width: 0;
    color: var(--font-quaternary, #A3A3A3);
    font-family: var(--Shokz-Sans-Text, Pretendard);
    font-size: var(--text-utility-size, 13px);
    font-style: normal;
    font-weight: var(--text-utility-weight, 400);
    line-height: var(--text-utility-line-height, 21px);
    letter-spacing: var(--text-utility-letter-spacing, 0);
}

.pal-agree__more {
    border: 0;
    padding: 0;
    background: none;
    color: #a3a3a3;
    font: inherit;
    line-height: 18px;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

.pal-agree__pop {
    position: absolute;
    left: 0;
    top: calc(100% + 8px);
    z-index: 7;
    box-sizing: border-box;
    margin: 0;
    padding: 12px;
    border: 1px solid #f1f1f1;
    border-radius: 6px;
    background: #fff;
    color: #666;
    font-family: "Shokz Sans Text", "Pretendard", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
    text-align: left;
    width: 265px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04), 0 18px 24px rgba(0, 0, 0, 0.08);
}

.pal-agree__pop[hidden] {
    display: none;
}

.pal-agree__pop::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 36px;
    width: 16px;
    height: 8px;
    background: #fff;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    filter: drop-shadow(0 -1px 0 #f1f1f1);
}

.pal-agree__pop p {
    margin: 0;
}

.pal-agree__pop p+p {
    margin-top: 0;
}

.pal-agree__pop a {
    color: #666;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pal-form__msg {
    width: 100%;
    margin: 0;
    color: #ffb199;
    font-size: 13px;
    line-height: 18px;
    text-align: center;
    /* display: none; */
}

.pal-form__msg.is-ok {
    color: #d7f5c8;
}

.pal-submit-wrap {
    position: relative;
    width: 100%;
    margin-top: 14px;
}

.pal-submit {
    width: 100%;
    height: 48px;
    margin-top: 0;
    border: 0;
    border-radius: 4px;
    background: var(--pal-orange);
    color: #fff;
    font-family: "Noto Sans KR";
    font-size: 16px;
    font-weight: 500;
    line-height: 22.4px;
    cursor: pointer;
}

.pal-submit:hover {
    background: var(--pal-orange-press);
}

.pal-card.is-done .pal-field input,
.pal-card.is-done .pal-agree__check {
    cursor: default;
}

.pal-card.is-done .pal-submit,
.pal-card.is-done .pal-submit:hover,
.pal-card.is-done .pal-submit:disabled {
    background: #c6c6c6;
    color: #666;
    opacity: 1;
    cursor: default;
    font-family: var(--Shokz-Sans-Text, Pretendard);
    font-size: 17px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.16px;
}

.pal-tip {
    position: absolute;
    z-index: 6;
    box-sizing: border-box;
    width: 200px;
    margin: 0;
    padding: 12px;
    border: 1px solid #f1f1f1;
    border-radius: 6px;
    background: #fff;
    color: #666;
    font-family: "Shokz Sans Text", "Pretendard", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
    text-align: center;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04), 0 18px 24px rgba(0, 0, 0, 0.08);
}

.pal-tip[hidden] {
    display: none;
}

.pal-tip::before {
    content: "";
    position: absolute;
    top: -7px;
    width: 16px;
    height: 8px;
    background: #fff;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    filter: drop-shadow(0 -1px 0 #f1f1f1);
}

.pal-tip--answer {
    left: 50%;
    top: calc(100% + 4px);
    transform: translateX(-50%);
}

.pal-tip--answer::before {
    left: 50%;
    transform: translateX(-50%);
}

.pal-tip--agree {
    left: -16px;
    top: calc(100% + 4px);
}

.pal-tip--agree::before {
    left: 15px;
}

.pal-tip--login {
    left: 50%;
    top: calc(100% + 13px);
    width: max-content;
    max-width: 360px;
    transform: translateX(-50%);
    white-space: nowrap;
}

.pal-tip--login::before {
    left: 50%;
    transform: translateX(-50%);
}

/* Mobile: Figma 20745:5223 */
.pal-prize {
    position: relative;
    padding: 0;
}

.pal-prize__hit {
    display: block;
    color: inherit;
}

.pal-prize__band {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pal-prize__film-pc {
    display: none;
}

.pal-prize__layout {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.pal-prize__copy {
    display: none;
}

.pal-prize__line {
    margin: 0;
    background: linear-gradient(90deg, #bdbfc3 1%, #76838d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-family: "Shokz Sans Display", "Pretendard", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: 0.16px;
    padding: 0 12px;
}

.pal-prize__line strong {
    color: #e3e5e6;
    -webkit-text-fill-color: #e3e5e6;
    font-weight: 800;
    font-size: 18px;
    line-height: 28px;
}

.pal-prize__line--sub {
    margin-top: 8px;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
}

.pal-prize__line--sub strong {
    display: inline;
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
}

.pal-prize__stage {
    position: relative;
    width: 292px;
    height: 540px;
    box-sizing: border-box;
    background: url("https://static.shokz.co.kr/resource/2026/10/10/prize_bg_m_6aca0f79a62ac.webp") center / 100% 100% no-repeat;
}

.pal-prize__label {
    position: absolute;
    top: 24px;
    left: 0;
    right: 0;
    margin: 0;
    color: #fff;
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-M-H4--size, 19px);
    font-weight: var(--text-M-H4--weight, 600);
    line-height: var(--text-M-H4--line-height, 26px);
    letter-spacing: var(--text-M-H4--letter-spacing, 0);
}

.pal-prize__items {
    position: absolute;
    top: 77px;
    left: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    width: 210px;
    height: 373px;
    transform: translateX(-50%);
}

.pal-prize__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

/* Figma 20745:5233 – mobile first prize visual */
.pal-prize__visual {
    position: relative;
    width: 135px;
    height: 100px;
    flex-shrink: 0;
}

.pal-prize__product {
    position: absolute;
    left: 0;
    top: 12px;
    display: block;
    width: 100px;
    height: 113px;
    object-fit: contain;
    object-position: center bottom;
}

.pal-prize__badge {
    position: absolute;
    right: 0;
    bottom: 0;
    left: auto;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pal-prize__badge img {
    position: absolute;
    inset: 0;
    width: 32px;
    height: 32px;
}

.pal-prize__badge span {
    position: relative;
    color: #fff;
    font-family: "Noto Sans KR", "Pretendard", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    text-shadow: 0 5px 5px rgba(92, 96, 102, 0.25);
}

.pal-prize__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    border-radius: 8px;
    background: linear-gradient(99deg, #8B99A6 -27.94%, #3C4255 77.09%), linear-gradient(88deg, #68777F 3.64%, #636796 104.98%);
    white-space: nowrap;
    color: var(--font-icon-white, #FFF);
    text-align: center;
    font-family: var(--Shokz-Sans-Text, Pretendard);
    font-size: var(--text-body-size, 15px);
    font-style: normal;
    font-weight: var(--text-body-weight, 400);
    line-height: var(--text-body-line-height, 24px);
    letter-spacing: var(--text-body-letter-spacing, -0.6px);
}

.pal-prize__item:last-child .pal-prize__chip {
    box-sizing: border-box;
}

.pal-prize__split {
    width: 165px;
    height: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.pal-prize__split img {
    width: 2px;
    height: 165px;
    flex: none;
    transform: rotate(-90deg);
}

.pal-prize__coins {
    width: 100px;
    height: 89px;
    object-fit: contain;
    object-position: bottom;
}

.pal-bf-wrap {
    padding: 0 16px 64px;
}

.pal-bf {
    position: relative;
    display: block;
    height: 180px;
    overflow: hidden;
    background-color: #2c211d;
    background-image: url("https://static.shokz.co.kr/resource/2026/10/15/M-listingbanner_mv8x9tvn.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    text-decoration: none;
}

.pal-bf__copy {
    position: absolute;
    z-index: 2;
    left: 16px;
    top: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 183px;
    box-sizing: border-box;
    transform: translateY(-50%);
    gap: 12px;
}

.pal-bf__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
}

.pal-bf__date {
    color: #8b746d;
    font-family: Pretendard, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 31px;
}

.pal-bf__title {
    color: #ac7561;
    font-family: "Shokz Sans Display", Pretendard, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0.16px;
    word-break: break-word;
}

.pal-bf__title span {
    display: block;
}

.pal-bf__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 12px;
    border-radius: 4px;
    background: var(--pal-orange-press, #ff6e25);
    color: #fff;
    font-family: var(--Shokz-Sans-Text, Pretendard);
    font-size: 13px;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0;
    white-space: nowrap;
}

.pal-notes {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 16px 64px;
    background: transparent;
}

.pal-notes h2 {
    margin: 0;
    color: var(--font-tertiary, #737373);
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-PC-H5--size, 19px);
    font-weight: var(--text-PC-H5--weight, 500);
    line-height: var(--text-PC-H5--line-height, 26px);
    letter-spacing: var(--text-PC-H5--letter-spacing, 0);
}

.pal-notes__rule {
    height: 1px;
    margin: 16px 0 32px;
    background: #A3A3A3;
    /* background: url("https://static.shokz.co.kr/resource/2026/10/09/notes-divider_6ac8951a48dc5.svg") center / 100% 1px no-repeat; */
}

.pal-notes__body p {
    margin: 0;
    color: var(--font-quaternary, #A3A3A3);
    font-family: var(--Shokz-Sans-Text, Pretendard);
    font-size: var(--text-body-size, 15px);
    font-style: normal;
    font-weight: var(--text-body-weight, 400);
    line-height: var(--text-body-line-height, 24px);
    letter-spacing: var(--text-body-letter-spacing, -0.6px);
}

@media (min-width: 1024px) {
    .pal {
        margin-top: calc(-1 * var(--pal-header-underlay, 0px));
    }

    .pal-hero {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    @supports not (aspect-ratio: 16 / 9) {
        .pal-hero {
            height: 0;
            padding-top: 56.25%;
        }
    }

    .br-m {
        display: none;
    }

    .pal-hero__media {
        left: 0;
        top: 0;
        width: 100%;
        max-width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        object-fit: contain;
        vertical-align: top;
    }

    .pal-hero__still img {
        width: 100%;
        max-width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        object-fit: contain;
    }

    .pal-hero__controls {
        right: 120px;
        bottom: 48px;
        gap: 24px;
    }

    .pal-hero__btn {
        width: 48px;
        height: 48px;
        padding: 12px;
    }

    .pal-hero__icon-play {
        width: 48px;
        height: 48px;
    }

    .pal-hero__btn.is-ended {
        padding: 12px;
    }

    .pal-agree__pop::before {
        right: 36px;
        left: initial;
    }

    .pal-agree__pop {
        left: initial;
        right: 0;
    }

    .pal-agree--no-consent .pal-agree__pop::before {
        right: initial;
        left: 36px;
    }

    .pal-agree--no-consent .pal-agree__pop {
        left: 0;
        right: initial;
    }

    .pal-quiz {
        min-height: 0;
        align-items: flex-end;
        justify-content: flex-start;
        padding: 96px max(120px, calc((100% - 1200px) / 2)) 0;
    }

    .pal-agree__check {
        align-items: center;
    }

    .pal-lower {
        background: transparent;
    }

    .pal-lower>.pal-prize {
        align-self: stretch;
        position: relative;
        z-index: 1;
        width: 100vw;
        max-width: 100vw;
        margin-top: 34px;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding: 0;
    }

    .pal-quiz__photo {
        background-color: #161616;
        background-image:
            radial-gradient(56.68% 54.18% at 38.85% 43.2%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 84.49%, #000 100%),
            linear-gradient(180deg, rgba(0, 0, 0, 0.8) 10%, rgba(0, 0, 0, 0.2) 26%),
            linear-gradient(90deg, rgba(21, 22, 29, 0) 43.89%, rgba(21, 22, 29, 0.81) 71.12%, #15161d 77.5%),
            url("https://static.shokz.co.kr/resource/2026/10/21/1920px_banner_6ad88d564bc81.webp");
        background-position: center, center, center, center;
        background-size: auto, auto, auto, cover;
        background-repeat: no-repeat;
        height: 1103px;
    }

    @media (min-width: 1441px) {
        .pal-quiz__photo {
            background-image:
                radial-gradient(56.68% 54.18% at 38.85% 43.2%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 84.49%, #000 100%),
                linear-gradient(180deg, rgba(0, 0, 0, 0.8) 10%, rgba(0, 0, 0, 0.2) 26%),
                linear-gradient(90deg, rgba(21, 22, 29, 0) 43.89%, rgba(21, 22, 29, 0.81) 71.12%, #15161d 77.5%),
                url("https://static.shokz.co.kr/resource/2026/10/21/photo1440_6ad88d5704221.webp");
        }
    }

    .pal-quiz {
        background-color: transparent;
    }

    .pal-quiz__photo::after {
        display: none;
    }

    .pal-quiz__panel {
        width: 588px;
        max-width: 100%;
        margin-top: 48px;
    }

    .pal-quiz__title {
        width: 588px;
        max-width: 100%;
        font-size: 46px;
        line-height: 52px;
    }

    .pal-card {
        padding: 32px 24px;
    }

    .pal-card__en,
    .pal-card__ko {
        color: var(--font-white, #FFF);
        text-align: center;
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: var(--text-PC-H3--size, 34px);
        font-weight: var(--text-PC-H3--weight, 600);
        line-height: var(--text-PC-H3--line-height, 51px);
        letter-spacing: var(--text-PC-H3--letter-spacing, 0);
    }

    .pal-card__ko {
        margin-top: 8px
    }

    .pal-card__promo {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        margin-top: 48px;
        text-align: center;
    }

    .pal-card__promo p {
        margin: 0;
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 23px;
        font-weight: 600;
        line-height: 32px;
        letter-spacing: 0.16px;
        background: linear-gradient(204deg, #d3dbe2 0%, #ebeced 73%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .pal-card__promo strong {
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 23px;
        font-weight: 900;
        line-height: 35px;
        color: #fff;
        -webkit-text-fill-color: #fff;
    }

    .pal-card__form {
        width: 394px;
        margin-top: 40px;
        gap: 12px;
        margin-left: auto;
        margin-right: auto;
    }

    .pal-submit-wrap {
        margin-top: 14px;
    }

    .pal-agree__text,
    .pal-agree__more {
        font-size: 13px;
        line-height: 21px;
        letter-spacing: var(--text-utility-letter-spacing, 0);
    }

    .pal-agree__more {
        line-height: 18px;
    }

    .pal-bf__btn {
        color: var(--font-icon-white, #FFF);
        font-family: var(--Shokz-Sans-Text, Pretendard);
        font-size: var(--text-body-size, 15px);
        font-style: normal;
        font-weight: var(--text-body-weight, 400);
        line-height: var(--text-body-line-height, 24px);
        letter-spacing: var(--text-body-letter-spacing, -0.6px);
        height: 40px;
    }


    /* PC: Figma 20745:5051 / 20745:5053 */
    .pal-prize__band {
        --pal-prize-film-span: 1440px;
        --pal-prize-film-half: 720px;
        --pal-prize-content-inset: 112px;
        height: 361px;
        overflow: hidden;
        display: block;
        /* background: #000; */
    }

    .pal-prize__film-pc {
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        width: 361px;
        height: var(--pal-prize-film-span);
        max-width: none;
        transform: translate(-50%, -50%) rotate(-90deg);
        object-fit: fill;
        pointer-events: none;
    }

    /* 与旋转后胶片右缘对齐，内缩 112px（宽屏时随胶片居中；窄屏不低于 112px） */
    .pal-prize__layout {
        position: absolute;
        top: 0;
        right: max(var(--pal-prize-content-inset), calc(50% - var(--pal-prize-film-half) + var(--pal-prize-content-inset)));
        bottom: 0;
        left: auto;
        width: 648px;
        max-width: min(648px, calc(100% - 224px));
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: 66px;
        box-sizing: border-box;
    }

    .pal-prize__stage {
        position: static;
        width: 100%;
        max-width: none;
        height: auto;
        background: none;
    }

    .pal-prize__label {
        position: static;
        width: 100%;
        max-width: 512px;
        margin: 0 auto 9px;
        color: #d9d9d9;
        text-align: center;
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 23px;
        font-style: normal;
        font-weight: 600;
        line-height: 35px;
        letter-spacing: 0;
    }

    .pal-prize__items {
        position: static;
        transform: none;
        flex-direction: row;
        align-items: flex-end;
        justify-content: center;
        gap: 48px;
        width: auto;
        height: auto;
        padding: 0 48px 16px;
    }

    .pal-prize__visual {
        width: 203px;
        height: 112px;
    }

    .pal-prize__product {
        position: absolute;
        left: 36px;
        top: 17px;
        width: 100px;
        height: 113px;
        object-fit: cover;
        object-position: center top;
    }

    .pal-prize__badge {
        left: 145px;
        top: 71px;
        width: 41px;
        height: 41px;
    }

    .pal-prize__badge img {
        width: 41px;
        height: 41px;
    }

    .pal-prize__badge span {
        color: #fff;
        text-align: center;
        text-shadow: 0 5.161px 5.161px rgba(92, 96, 102, 0.25);
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 16px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: 0.32px;
    }

    .pal-prize__chip {
        border-radius: 4px;
        color: #fff;
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 17px;
        font-weight: 500;
        line-height: 23px;
        letter-spacing: 0;
    }

    .pal-prize__item:first-child .pal-prize__chip {
        padding: 8px 16px;
        border-radius: 4px;
        background-image:
            linear-gradient(131.87deg, #8b99a6 27.942%, #3c4255 77.088%),
            linear-gradient(80.54deg, #68777f 3.644%, #636796 104.98%);
        color: #fff;
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: 17px;
        font-weight: 500;
        line-height: 23px;
        letter-spacing: 0;
    }

    .pal-prize__item:last-child {
        width: 235px;
        min-height: 167px;
        justify-content: flex-end;
    }

    .pal-prize__item:last-child .pal-prize__chip {
        width: 181px;
        max-width: 100%;
        box-sizing: border-box;
    }

    .pal-prize__split {
        width: 2px;
        height: 146px;
        align-self: center;
    }

    .pal-prize__split img {
        width: 2px;
        height: 146px;
        transform: none;
    }

    .pal-prize__coins {
        width: 99px;
        height: 89px;
    }

    .pal-bf-wrap {
        padding: 96px 120px;
        box-sizing: border-box;
    }

    .pal-bf {
        width: 100%;
        max-width: 1200px;
        height: 240px;
        margin: 0 auto;
        background-image: url("https://static.shokz.co.kr/resource/2026/10/15/PC-listingbanner_mv8x5lec.webp");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .pal-bf__copy {
        left: 86px;
        width: auto;
        gap: 32px;
    }

    .pal-bf__text {
        gap: 0;
    }

    .pal-bf__date {
        font-size: 16px;
        line-height: 31px;
        color: #957b72;
    }

    .pal-bf__title {
        color: #d29680;
        font-size: 34px;
        line-height: 51px;
        max-width: none;
        white-space: nowrap;
    }

    .pal-bf__title span {
        display: inline;
    }

    .pal-bf__title span+span::before {
        content: " ";
    }

    .pal-bf__btn {
        height: 40px;
        padding: 0 24px;
        font-size: 15px;
        line-height: 24px;
        letter-spacing: -0.6px;
    }

    .pal-notes {
        padding: 0 0 96px;
        background: transparent;
    }

    .pal-notes h2 {
        color: var(--font-tertiary, #737373);
        font-family: var(--Shokz-Sans-Display, Pretendard);
        font-size: var(--text-PC-H4--size, 27px);
        font-weight: var(--text-PC-H4--weight, 600);
        line-height: var(--text-PC-H4--line-height, 41px);
        letter-spacing: var(--text-PC-H4--letter-spacing, 0);
    }

    .pal-notes__body p {
        color: var(--font-quaternary, #A3A3A3);
        font-family: var(--Shokz-Sans-Text, Pretendard);
        font-size: var(--text-body-size, 15px);
        font-weight: var(--text-body-weight, 400);
        line-height: var(--text-body-line-height, 24px);
        letter-spacing: var(--text-body-letter-spacing, -0.6px);
    }
}

.pal-done {
    position: fixed;
    inset: 0;
    z-index: 10020;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, 0.45);
}

.pal-done[hidden] {
    display: none;
}

.pal-done__card {
    position: relative;
    width: min(375px, 100%);
    height: 480px;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(180deg, #575e64 13.636%, #ebeef2 103.75%);
}

.pal-done__close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 1;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.pal-done__close img {
    display: block;
    width: 32px;
    height: 32px;
}

.pal-done__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 283px;
    max-width: calc(100% - 48px);
    margin: 88px auto 0;
    text-align: center;
}

.pal-done__title {
    margin: 0;
    color: #FFF;
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-PC-H3--size, 34px);
    font-style: normal;
    font-weight: var(--text-PC-H3--weight, 600);
    line-height: var(--text-PC-H3--line-height, 51px);
    letter-spacing: var(--text-PC-H3--letter-spacing, 0);
}

.pal-done__sub {
    margin: 12px 0 0;
    color: var(--be, #E3E5E6);
    text-align: center;
    font-family: var(--Shokz-Sans-Display, Pretendard);
    font-size: var(--text-PC-H4--size, 27px);
    font-style: normal;
    font-weight: var(--text-PC-H4--weight, 600);
    line-height: var(--text-PC-H4--line-height, 41px);
    letter-spacing: var(--text-PC-H4--letter-spacing, 0);
}

.pal-done__coins {
    display: block;
    width: 144px;
    height: 112px;
    margin-top: 48px;
    object-fit: contain;
    object-position: bottom;
}

@media (min-width: 769px) {
    .pal-done__card {
        width: 716px;
        height: 440px;
    }

    .pal-done__close {
        top: 4px;
        right: 4px;
        width: 48px;
        height: 48px;
    }

    .pal-done__close img {
        width: 48px;
        height: 48px;
    }

    .pal-done__body {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 534px;
        max-width: calc(100% - 80px);
        margin: 0;
        transform: translate(-50%, -50%);
    }

    .pal-done__sub {
        margin-top: 16px;
    }

    .pal-done__title {
        font-size: var(--text-PC-H3--size, 34px);
    }
}


@media (max-width: 375px) {
    .pal-card {
        padding: 32px 20px;
    }
}

@media (max-width: 360px) {
    .pal-card {
        padding: 32px 10px;
    }
}