@charset "utf-8";

/*
* vw 단위 사용법
* 80px => calc(80 * var(--vw));
*/

.imc { --vw: 0.625px; } /* 1920px 기준 */
@media screen and (min-width: 1200px) {
    .imc { --vw: 0.052083333vw; }
}

/* ============================================================
 * 에어글로시 바람막이 기획전 (NB2024-12204) PC
 * ============================================================ */
.imc, .imc__content { width: 100%; background: #000; }

.wb {
    width: 100%;
    overflow-x: clip;
    background: #000;
    color: #fff;
    --font-serif: 'ITCGaramondStd', serif;
    --font-kr: 'Noto Sans KR', sans-serif;
    --font-proxima: 'ProximaNova', sans-serif;
}
.wb * { box-sizing: border-box; }
.wb img { display: block; width: 100%; }
.wb .en { font-family: var(--font-proxima); }
.wb .wb__sec { position: relative; }

/* 공통 타이틀/카피 */
.wb__title { font-family: var(--font-serif); font-weight: 400; font-size: calc(60 * var(--vw)); line-height: 1.1; letter-spacing: -0.01em; }
.wb__copy { font-family: var(--font-kr); font-weight: 400; font-size: calc(26 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.04em; }

/* ===== 01. KV ===== */
.wb__kv { padding-bottom: calc(160 * var(--vw)); text-align: center; }
.wb__kvVisual img { width: 100%; }
.wb__kvCopy { margin-top: calc(60 * var(--vw)); }
.wb__eyebrow { font-family: var(--font-serif); font-weight: 400; font-size: calc(60 * var(--vw)); line-height: 1.1; letter-spacing: -0.01em; }
.wb__kvTitle { font-family: var(--font-serif); font-weight: 400; font-size: calc(90 * var(--vw)); line-height: 1.1; letter-spacing: -0.01em; }
.wb__desc { margin-top: calc(20 * var(--vw)); font-family: var(--font-kr); font-weight: 400; font-size: calc(28 * var(--vw)); line-height: calc(44 * var(--vw)); letter-spacing: -0.04em; }

/* ===== 02. Kids Pick ===== */
.wb__pick { display: flex; flex-direction: column; align-items: center; gap: calc(30 * var(--vw)); padding-bottom: calc(160 * var(--vw)); text-align: center; }
.wb__pickBtn { width: calc(178 * var(--vw)); height: calc(62 * var(--vw)); border: 1px solid #fff; border-radius: calc(200 * var(--vw)); background: transparent; color: #fff; font-family: var(--font-proxima); font-weight: 700; font-size: calc(28 * var(--vw)); box-shadow: 0 calc(3 * var(--vw)) calc(6 * var(--vw)) rgba(0,0,0,0.25); cursor: pointer; }

/* ===== 03. 컬러 스위처 ===== */
.wb__color { display: flex; flex-direction: column; align-items: center; background-image: url("https://image.nbkorea.com/NBRB_PC/event/imc/NKWINDBREAKER/wb__color--bg.jpg"); background-repeat:no-repeat; background-position: center; background-size: cover; padding: calc(102 * var(--vw)) 0 calc(114 * var(--vw)); text-align: center; }
.wb__colorViews { display: flex; gap: calc(40 * var(--vw)); justify-content: center; margin-top: calc(40 * var(--vw)); }
.wb__colorView { position: relative; width: calc(500 * var(--vw)); height: calc(500 * var(--vw)); border-radius: calc(10 * var(--vw)); overflow: hidden; }
.wb__colorView .jsWbColorImg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(600 * var(--vw)); height: auto; display: none; }
.wb__colorView .jsWbColorImg.is-on { display: block; }
.wb__colorFoot { display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--vw)); margin-top: calc(40 * var(--vw)); }
.wb__colorGuide { font-family: var(--font-kr); font-weight: 400; font-size: calc(24 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.03em; }
.wb__swatches { display: flex; gap: calc(34 * var(--vw)); justify-content: center; }
.wb__swatches button { display: flex; flex-direction: column; align-items: center; gap: calc(16 * var(--vw)); background: none; border: 0; cursor: pointer; color: #fff; }
.wb__swatchDot { width: calc(40 * var(--vw)); height: calc(40 * var(--vw)); border-radius: 50%; }
.wb__swatchDot[data-color="ivory"] { background: #ece7db; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.25); }
.wb__swatchDot[data-color="purple"] { background: #9b87b5; }
.wb__swatchDot[data-color="silver"] { background: #b0b1b3; }
.wb__swatchDot[data-color="black"] { background: #1c1c1c; }
.wb__swatchTxt { font-family: var(--font-kr); font-weight: 400; font-size: calc(14 * var(--vw)); line-height: 1.2; letter-spacing: -0.02em; }
.jsWbSwatch.is-on .wb__swatchDot { outline: calc(2 * var(--vw)) solid #fff; outline-offset: calc(2 * var(--vw)); }

/* ===== 04. Air Glossy Detail ===== */
.wb__detail { display: flex; flex-direction: column; align-items: center; gap: calc(60 * var(--vw)); padding: calc(160 * var(--vw)) 0; text-align: center; }
.wb__detailPin { position: relative; width: calc(1300 * var(--vw)); height: calc(800 * var(--vw)); }
.wb__detailPinImg { width: 100%; height: 100%; object-fit: cover; }
.wb__pinLabel { position: absolute; background: #fff; color: #300c4e; font-family: var(--font-kr); font-weight: 500; font-size: calc(15 * var(--vw)); line-height: calc(25 * var(--vw)); letter-spacing: -0.03em; padding: calc(3 * var(--vw)) calc(10 * var(--vw)); white-space: nowrap; }
.wb__pinLabel b.en { font-family: var(--font-proxima); font-weight: 500; font-size: calc(17 * var(--vw)); }
.wb__pinLabel--back { left: calc(273 * var(--vw)); top: calc(88 * var(--vw)); }
.wb__pinLabel--zip { left: calc(992 * var(--vw)); top: calc(176 * var(--vw)); }
.wb__pinLabel--reflect { left: calc(1033 * var(--vw)); top: calc(516 * var(--vw)); }
.wb__pinLabel--mesh { left: calc(147 * var(--vw)); top: calc(318 * var(--vw)); }
.wb__pinLabel--string { left: calc(168 * var(--vw)); top: calc(565 * var(--vw)); }
.wb__detailCards { width: 100%; margin: 0 auto; overflow: hidden; }
.wb__detailCards .swiper-wrapper { align-items: center; transition-timing-function: linear; }
.wb__detailCardList { display: flex; }
.wb__detailCard { display: flex; flex-direction: column; gap: calc(40 * var(--vw)); width: calc(500 * var(--vw)); }
.wb__detailCardImg { width: calc(500 * var(--vw)); height: calc(500 * var(--vw)); overflow: hidden; }
.wb__detailCardImg img, .wb__detailCardImg video { width: 100%; height: 100%; object-fit: cover; }
.wb__detailCardTit { font-family: var(--font-kr); font-weight: 900; font-size: calc(22 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.02em; }
.wb__detailCardTit b.en { font-family: var(--font-proxima); font-weight: 800; font-size: calc(24 * var(--vw)); }
.wb__detailCardDesc { margin-top: calc(7 * var(--vw)); font-family: var(--font-kr); font-weight: 400; font-size: calc(17 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.02em; }
.wb__detailCardDesc b.en { font-family: var(--font-proxima); font-weight: 400; font-size: calc(19 * var(--vw)); }

/* ===== 05. Move with Air Glossy ===== */
.wb__media { display: flex; flex-direction: column; align-items: center; gap: calc(60 * var(--vw)); padding-bottom: calc(76 * var(--vw)); text-align: center; }
.wb__mediaBox { width: calc(800 * var(--vw)); height: calc(800 * var(--vw)); overflow: hidden; }
.wb__mediaBox img, .wb__mediaBox video { width: 100%; height: 100%; object-fit: cover; }
.wb__mediaTxt { width: calc(800 * var(--vw)); }

/* ===== 06 / 09. 화보 (스태거 3컷) ===== */
.wb__gallery { position: relative; width: 100%; margin: 0 auto; }
.wb__gallery--a { height: calc(1012 * var(--vw)); }
.wb__gallery--b { height: calc(869 * var(--vw)); }
.wb__galImg { position: absolute; object-fit: cover; }
.wb__galImg--a1 { left: calc(140 * var(--vw)); top: calc(2 * var(--vw)); width: calc(620 * var(--vw))!important; height: calc(850 * var(--vw)); }
.wb__galImg--a2 { left: calc(880 * var(--vw)); top: calc(67 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }
.wb__galImg--a3 { left: calc(1300 * var(--vw)); top: calc(127 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }
.wb__galImg--b1 { left: calc(25 * var(--vw)); top: calc(42 * var(--vw)); width: calc(850 * var(--vw))!important; height: calc(620 * var(--vw)); }
.wb__galImg--b2 { left: calc(996 * var(--vw)); top: calc(5 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }
.wb__galImg--b3 { left: calc(1416 * var(--vw)); top: calc(65 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }

/* ===== 07. Feel the Rhythm ===== */
.wb__rhythm { display: flex; gap: calc(116 * var(--vw)); align-items: center; justify-content: center; width: 100%; margin: 0 auto; padding-bottom: calc(160 * var(--vw)); }
.wb__rhythmGroup { display: flex; gap: calc(40 * var(--vw)); align-items: center; }
.wb__rhythmMain { position: relative; width: calc(843 * var(--vw)); height: calc(850 * var(--vw)); overflow: hidden; }
.wb__rhythmMain > img { width: 100%; height: 100%; object-fit: cover; }
.wb__rhythmTxt { position: absolute; right: calc(41 * var(--vw)); top: calc(703 * var(--vw)); width: calc(410 * var(--vw)); text-align: right; }
.wb__rhythmSide { display: flex; flex-direction: column; gap: calc(40 * var(--vw)); width: calc(245 * var(--vw)); }
.wb__rhythmSide img { width: 100%; height: calc(244 * var(--vw)); object-fit: cover; }
.wb__rhythmPurple { width: calc(673 * var(--vw)); height: calc(850 * var(--vw)); overflow: hidden; }
.wb__rhythmPurple img { width: 100%; height: 100%; object-fit: cover; }

/* ===== 08. Move Together ===== */
.wb__together { padding-bottom: calc(160 * var(--vw)); }
.wb__togetherBox { position: relative; width: 100%; height: calc(1000 * var(--vw)); margin: 0 auto; overflow: hidden; }
.wb__togetherBox > img { width: 100%; height: 100%; object-fit: cover; }
.wb__togetherBox::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: calc(632 * var(--vw)); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 100%); opacity: 0.5; }
.wb__togetherTxt { position: absolute; left: calc(71 * var(--vw)); top: calc(819 * var(--vw)); z-index: 1; width: calc(686 * var(--vw)); }

/* ===== 10. Ride Your Way ===== */
.wb__ride { position: relative; width: 100%; height: calc(1142 * var(--vw)); margin: 0 auto; }
.wb__rideImg { position: absolute; object-fit: cover; }
.wb__rideImg--1 { left: calc(1160 * var(--vw)); top: calc(2 * var(--vw)); width: calc(620 * var(--vw))!important; height: calc(850 * var(--vw)); }
.wb__rideImg--2 { left: calc(560 * var(--vw)); top: calc(67 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }
.wb__rideImg--3 { left: calc(140 * var(--vw)); top: calc(127 * var(--vw)); width: calc(480 * var(--vw))!important; height: calc(657 * var(--vw)); }
.wb__rideTxt { position: absolute; left: 50%; transform: translateX(-50%); top: calc(877 * var(--vw)); width: calc(800 * var(--vw))!important; text-align: center; }

/* 화보 겹겹이 자동 롤링/랜덤 (댓글: 각 박스 여러 컷 스택) */
.jsWbRoll { overflow: hidden; }
.jsWbRoll img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 0.8s ease; }
.jsWbRoll img.is-on { opacity: 1; }

/* ===== 11. MD's comment (글래스 말풍선) ===== */
.wb__md { display: flex; flex-direction: column; align-items: center; gap: calc(40 * var(--vw)); background: linear-gradient(180deg, #355c77 0%, #000 100%); padding: calc(100 * var(--vw)) 0; text-align: center; }
.wb__mdList { position: relative; width: calc(702 * var(--vw)); height: calc(605 * var(--vw)); }
.wb__mdCard { position: absolute; display: flex; align-items: center; justify-content: center; gap: calc(20 * var(--vw)); padding: calc(24 * var(--vw)) calc(25 * var(--vw)); background: rgba(255,255,255,0.3);backdrop-filter: blur(7.5px); border: calc(2 * var(--vw)) solid rgba(255,255,255,0.3); text-align: left; }
.wb__mdCard--right { border-radius: calc(50 * var(--vw)) calc(30 * var(--vw)) 0 calc(50 * var(--vw)); }
.wb__mdCard--left { border-radius: calc(30 * var(--vw)) calc(50 * var(--vw)) calc(50 * var(--vw)) 0; }
.wb__mdCard:nth-child(1) { left: calc(261 * var(--vw)); top: 0; width: calc(406 * var(--vw)); }
.wb__mdCard:nth-child(2) { left: calc(35 * var(--vw)); top: calc(134 * var(--vw)); width: calc(489 * var(--vw)); }
.wb__mdCard:nth-child(3) { left: calc(261 * var(--vw)); top: calc(268 * var(--vw)); width: calc(469 * var(--vw)); }
.wb__mdCard:nth-child(4) { left: calc(35 * var(--vw)); top: calc(425 * var(--vw)); width: calc(461 * var(--vw)); }
.wb__mdCard:nth-child(1), .wb__mdCard:nth-child(2) { height: calc(156 * var(--vw)); }
.wb__mdCard:nth-child(3), .wb__mdCard:nth-child(4) { height: calc(180 * var(--vw)); }
.wb__mdIcon { flex-shrink: 0; width: calc(78 * var(--vw)); height: calc(78 * var(--vw)); overflow: hidden; }
.wb__mdIcon img { width: 100%; height: 100%; object-fit: cover; }
.wb__mdTit { font-family: var(--font-kr); font-weight: 900; font-size: calc(20 * var(--vw)); line-height: calc(24 * var(--vw)); }
.wb__mdDesc { margin-top: calc(4 * var(--vw)); font-family: var(--font-kr); font-weight: 400; font-size: calc(17 * var(--vw)); line-height: calc(24 * var(--vw)); }
/* 1,3 / 2,4 같이 깜빡 페이드 강조 (댓글 지시) */
.wb__mdCard:nth-child(1), .wb__mdCard:nth-child(3) { animation: wbMdBlink 2.4s ease-in-out infinite; }
.wb__mdCard:nth-child(2), .wb__mdCard:nth-child(4) { animation: wbMdBlink 2.4s ease-in-out infinite; animation-delay: 1.2s; }
@keyframes wbMdBlink { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* ===== 12. 이벤트 (Double Reward + 사은품) ===== */
.wb__event { display: flex; justify-content: center; padding: calc(100 * var(--vw)) 0 calc(80 * var(--vw)); }
.wb__eventCard { display: flex; flex-direction: column; width: calc(1358 * var(--vw)); background: #fff; padding: calc(98 * var(--vw)) calc(81 * var(--vw)) calc(95 * var(--vw)) calc(85 * var(--vw)); color: #151515; }
.wb__eventEyebrow { font-family: var(--font-proxima); font-weight: 800; font-size: calc(28 * var(--vw)); line-height: calc(45 * var(--vw)); letter-spacing: -0.01em; color: #1d5e8d; text-transform: uppercase; }
.wb__eventTit { margin-top: calc(4 * var(--vw)); font-family: var(--font-kr); font-weight: 900; font-size: calc(28 * var(--vw)); line-height: calc(45 * var(--vw)); letter-spacing: -0.01em; }
.wb__eventTit b.en { font-family: var(--font-proxima); font-weight: 800; font-size: calc(30 * var(--vw)); }
.wb__eventDesc { margin-top: calc(14 * var(--vw)); font-family: var(--font-kr); font-weight: 400; font-size: calc(23 * var(--vw)); letter-spacing: -0.03em; line-height: calc(41 * var(--vw)); }
.wb__eventDesc b.en { font-family: var(--font-proxima); font-weight: 400; font-size: calc(25 * var(--vw)); }
.wb__eventLine { display: block; width: 100%; height: 1px; background: rgba(21, 21, 21, 0.5); margin: calc(23 * var(--vw)) 0; }
.wb__eventBlock--review { display: flex; flex-direction: column; align-items: center; width: calc(744 * var(--vw)); margin: 0 auto; text-align: center; }
.wb__eventReview { font-family: var(--font-kr); font-weight: 700; font-size: calc(18 * var(--vw)); line-height: calc(41 * var(--vw)); letter-spacing: -0.05em; white-space: nowrap; }
.wb__eventReview b.en { font-family: var(--font-proxima); font-weight: 400; font-size: calc(20 * var(--vw)); }
.wb__eventBlock--gift { display: flex; gap: calc(51 * var(--vw)); align-items: flex-end; margin-top: calc(108 * var(--vw)); }
.wb__giftImg { flex-shrink: 0; width: calc(562 * var(--vw)); height: calc(562 * var(--vw)); background: linear-gradient(180deg, #dddddd 0%, #bcbfc1 100%); overflow: hidden; }
.wb__giftImg img, .wb__giftImg video { width: 100%; height: 100%; object-fit: contain; }
.wb__giftTxt { width: calc(579 * var(--vw)); text-align: left; }
.wb__eventInfo { margin-top: 0; }
.wb__eventInfo div { display: flex; gap: calc(67 * var(--vw)); align-items: baseline; }
.wb__eventInfo dt { font-family: var(--font-kr); font-weight: 700; font-size: calc(18 * var(--vw)); line-height: calc(41 * var(--vw)); letter-spacing: -0.05em; white-space: nowrap; }
.wb__eventInfo dd { font-family: var(--font-kr); font-weight: 400; font-size: calc(18 * var(--vw)); line-height: calc(41 * var(--vw)); letter-spacing: -0.05em; }
.wb__eventInfo dd b.en { font-family: var(--font-proxima); font-weight: 400; font-size: calc(20 * var(--vw)); }
.wb__eventNotice { margin-top: calc(29 * var(--vw)); color: #8e8f8f; }
.wb__eventNoticeTit { font-family: var(--font-kr); font-weight: 700; font-size: calc(16 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.05em; }
.wb__eventNotice ul li { font-family: var(--font-kr); font-weight: 400; font-size: calc(16 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.05em; padding-left: calc(10 * var(--vw)); text-indent: calc(-10 * var(--vw)); width: max-content; }
.wb__eventNotice ul li::before { content: '- '; }
.wb__eventNotice ul li b.en { font-family: var(--font-proxima); font-weight: 400; font-size: calc(17 * var(--vw)); }

/* ===== 13. Logo ===== */
.wb__logo { display: flex; justify-content: center; align-items: center; padding: calc(108 * var(--vw)) 0; }
.wb__logo img { width: calc(170 * var(--vw)); height: auto; }

/* ============================================================
 * Kids Pick 레이어팝업 (PC)  — .imc 밖이라 --vw/폰트 자체 선언
 * ============================================================ */
.wbpop { --vw: 0.625px; }
@media screen and (min-width: 1200px) { .wbpop { --vw: 0.052083333vw; } }
body.wb-popup-open { overflow: hidden; }
.wbpop {
    display: none; position: fixed; inset: 0; z-index: 1000;
    overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;
    --font-serif: 'ITCGaramondStd', serif;
    --font-kr: 'Noto Sans KR', sans-serif;
    --font-proxima: 'ProximaNova', sans-serif;
}
.wbpop.is-open { display: block; }
.wbpop * { box-sizing: border-box; }
.wbpop__dimm { position: fixed; inset: 0; background: rgba(0,0,0,0.7); }
.wbpop__panel { position: relative; z-index: 1; width: 100%; min-height: 100%; margin: 0; background-color: #0c2640; background-image: url("https://image.nbkorea.com/NBRB_PC/event/imc/NKWINDBREAKER/popup/wbpop__panel--bg.jpg"); background-repeat:no-repeat; background-position: center; background-size: cover; color: #fff; padding: calc(120 * var(--vw)) 0; }
.wbpop__close { z-index: 6!important; position: fixed; top: calc(24 * var(--vw)); right: calc(24 * var(--vw)); z-index: 2; width: calc(52 * var(--vw)); height: calc(52 * var(--vw)); border-radius: 50%; background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.6); cursor: pointer; }
.wbpop__close::before, .wbpop__close::after { content: ''; position: absolute; top: 50%; left: 50%; width: calc(22 * var(--vw)); height: 2px; background: #fff; }
.wbpop__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.wbpop__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.wbpop__content { display: flex; flex-direction: column; align-items: center; }
.wbpop__sec { display: flex; flex-direction: column; align-items: center; width: 100%; }
.wbpop__copy { font-family: var(--font-kr); font-weight: 400; font-size: calc(30 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.03em; text-align: center; }

/* 헤더 + 히어로 */
.wbpop__hero { gap: calc(40 * var(--vw)); padding-bottom: calc(120 * var(--vw)); }
.wbpop__head { display: flex; flex-direction: column; gap: calc(20 * var(--vw)); text-align: center; }
.wbpop__title { font-family: 'ITC Avant Garde Gothic Std', var(--font-proxima); font-weight: 700; font-size: calc(60 * var(--vw)); line-height: 1.1; letter-spacing: -0.01em; }
.wbpop__heroImg { position: relative; width: calc(800 * var(--vw)); height: calc(800 * var(--vw)); border-radius: 0; overflow: hidden; }
.wbpop__heroImg > img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(900 * var(--vw)); height: auto; }
.wbpop__heroStar { position: absolute; z-index: 2; width: calc(38 * var(--vw)); height: calc(38 * var(--vw)); padding: 0; border: 0; cursor: pointer; background: url("data:image/svg+xml,%3Csvg%20width%3D%2244%22%20height%3D%2243%22%20viewBox%3D%220%200%2044%2043%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20filter%3D%22url(%23filter0_d_36_512)%22%3E%3Cpath%20d%3D%22M20.0915%207.40675C20.6922%205.55793%2023.3078%205.55794%2023.9085%207.40676L25.8296%2013.3192C26.0982%2014.146%2026.8687%2014.7058%2027.7381%2014.7058H33.9548C35.8987%2014.7058%2036.707%2017.1934%2035.1343%2018.336L30.1049%2021.9901C29.4016%2022.5011%2029.1073%2023.4068%2029.3759%2024.2337L31.297%2030.1461C31.8977%2031.9949%2029.7816%2033.5323%2028.2089%2032.3897L23.1795%2028.7356C22.4762%2028.2246%2021.5238%2028.2246%2020.8205%2028.7356L15.7911%2032.3897C14.2184%2033.5323%2012.1023%2031.9949%2012.703%2030.1461L14.6241%2024.2337C14.8927%2023.4068%2014.5984%2022.5011%2013.8951%2021.9901L8.8657%2018.336C7.293%2017.1934%208.10127%2014.7058%2010.0452%2014.7058H16.2619C17.1313%2014.7058%2017.9018%2014.146%2018.1704%2013.3192L20.0915%207.40675Z%22%20fill%3D%22url(%23paint0_linear_36_512)%22%2F%3E%3Cpath%20d%3D%22M18.1825%206.78691C19.384%203.08926%2024.6161%203.08928%2025.8175%206.78691L27.738%2012.6993H33.9551C37.8428%2012.6996%2039.4588%2017.6738%2036.3136%2019.959L31.284%2023.6138L33.2055%2029.5262C34.4067%2033.2238%2030.1749%2036.2981%2027.0296%2034.0129L22%2030.3591L16.9704%2034.0129C13.8251%2036.2981%209.59329%2033.2237%2010.7945%2029.5262L12.716%2023.6138L7.6864%2019.959C4.54119%2017.6737%206.15726%2012.6996%2010.0449%2012.6993H16.262L18.1825%206.78691Z%22%20stroke%3D%22white%22%20stroke-width%3D%224%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_d_36_512%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2244%22%20height%3D%2242.834%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%3CfeOffset%20dy%3D%222%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22out%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.25%200%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22effect1_dropShadow_36_512%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22effect1_dropShadow_36_512%22%20result%3D%22shape%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_36_512%22%20x1%3D%2230.5286%22%20y1%3D%2231.6338%22%20x2%3D%2212.9697%22%20y2%3D%2215.0784%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22white%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23A586AE%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") center / contain no-repeat; animation: wbpopStarPulse 1.4s ease-in-out infinite; transition: transform 0.6s ease; }
.wbpop__heroStar:hover { transform: rotate(360deg); }
.wbpop__heroStar--1 { left: calc(521 * var(--vw)); top: calc(317 * var(--vw)); }
.wbpop__heroStar--2 { left: calc(270 * var(--vw)); top: calc(372 * var(--vw)); animation-delay: 0.35s; }
.wbpop__heroStar--3 { left: calc(466 * var(--vw)); top: calc(519 * var(--vw)); animation-delay: 0.7s; }
@keyframes wbpopStarPulse { 0%, 100% { opacity: 0.8; } 50% { opacity: 1; } }
/* 별 클릭 → 기능 GIF/영상 누끼 위 재생 */
.wbpop__heroPlay { position: absolute; inset: 0; z-index: 3; display: none; background: #000; }
.wbpop__heroPlay.is-on { display: block; }
.wbpop__heroPlay video { width: 100%; height: 100%; object-fit: cover; }
.wbpop__heroPlayTxt { position: absolute; left: 0; bottom: calc(40 * var(--vw)); width: 100%; text-align: center; color: #fff; font-family: var(--font-kr); font-weight: 700; font-size: calc(26 * var(--vw)); letter-spacing: -0.02em; text-shadow: 0 calc(2 * var(--vw)) calc(8 * var(--vw)) rgba(0,0,0,0.6); }
.wbpop__heroPlayClose { position: absolute; top: calc(20 * var(--vw)); right: calc(20 * var(--vw)); width: calc(44 * var(--vw)); height: calc(44 * var(--vw)); border-radius: 50%; background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.6); cursor: pointer; }
.wbpop__heroPlayClose::before, .wbpop__heroPlayClose::after { content: ''; position: absolute; top: 50%; left: 50%; width: calc(18 * var(--vw)); height: 2px; background: #fff; }
.wbpop__heroPlayClose::before { transform: translate(-50%, -50%) rotate(45deg); }
.wbpop__heroPlayClose::after { transform: translate(-50%, -50%) rotate(-45deg); }

/* 색상 별 스위처 */
.wbpop__color { gap: calc(40 * var(--vw)); padding-bottom: calc(120 * var(--vw)); }
.wbpop__colorStars { display: flex; gap: calc(40 * var(--vw)); justify-content: center; }
.wbpop__colorStars button { display: flex; flex-direction: column; align-items: center; gap: calc(6 * var(--vw)); background: none; border: 0; cursor: pointer; color: #fff; }
.wbpop__starIco { display: block; width: calc(56 * var(--vw)); height: calc(56 * var(--vw)); background-repeat: no-repeat; background-position: center; background-size: contain; }
.wbpop__starIco[data-color="ivory"] { background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2261%22%20height%3D%2259%22%20viewBox%3D%220%200%2061%2059%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20filter%3D%22url(%23filter0_d_36_567)%22%3E%3Cpath%20d%3D%22M28.597%207.38536C29.196%205.54188%2031.804%205.54188%2032.403%207.38536L36.3401%2019.5024C36.6079%2020.3269%2037.3762%2020.8851%2038.2431%2020.8851H50.9837C52.9221%2020.8851%2053.728%2023.3654%2052.1598%2024.5048L41.8524%2031.9935C41.1511%2032.5031%2040.8577%2033.4062%2041.1256%2034.2306L45.0626%2046.3477C45.6616%2048.1912%2043.5517%2049.7242%2041.9835%2048.5848L31.6761%2041.0961C30.9748%2040.5865%2030.0252%2040.5865%2029.3239%2041.0961L19.0165%2048.5848C17.4483%2049.7242%2015.3384%2048.1912%2015.9374%2046.3477L19.8744%2034.2306C20.1423%2033.4062%2019.8489%2032.5031%2019.1476%2031.9935L8.84015%2024.5048C7.272%2023.3654%208.07793%2020.8851%2010.0163%2020.8851H22.7569C23.6238%2020.8851%2024.3921%2020.3269%2024.6599%2019.5024L28.597%207.38536Z%22%20fill%3D%22url(%23paint0_linear_36_567)%22%2F%3E%3Cpath%20d%3D%22M26.6935%206.7673C27.8915%203.08034%2033.1085%203.08035%2034.3065%206.7673L38.2429%2018.8843H50.9841C54.8605%2018.8846%2056.472%2023.8454%2053.3358%2026.1239L43.0283%2033.6128L46.9657%2045.7297C48.1633%2049.4166%2043.9437%2052.4821%2040.8075%2050.2035L30.5%2042.7147L20.1925%2050.2035C17.0563%2052.4821%2012.8367%2049.4165%2014.0343%2045.7297L17.9717%2033.6128L7.6642%2026.1239C4.52799%2023.8454%206.13948%2018.8846%2010.0159%2018.8843H22.7571L26.6935%206.7673Z%22%20stroke%3D%22white%22%20stroke-width%3D%224%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_d_36_567%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2261%22%20height%3D%2258.9991%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%3CfeOffset%20dy%3D%222%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22out%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.25%200%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22effect1_dropShadow_36_567%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22effect1_dropShadow_36_567%22%20result%3D%22shape%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_36_567%22%20x1%3D%2243.0321%22%20y1%3D%2245.7596%22%20x2%3D%2217.2307%22%20y2%3D%2221.4325%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22white%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23DFDACA%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); }
.wbpop__starIco[data-color="purple"] { background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2261%22%20height%3D%2259%22%20viewBox%3D%220%200%2061%2059%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20filter%3D%22url(%23filter0_d_36_570)%22%3E%3Cpath%20d%3D%22M28.597%207.38536C29.196%205.54188%2031.804%205.54188%2032.403%207.38536L36.3401%2019.5024C36.6079%2020.3269%2037.3762%2020.8851%2038.2431%2020.8851H50.9837C52.9221%2020.8851%2053.728%2023.3654%2052.1598%2024.5048L41.8524%2031.9935C41.1511%2032.5031%2040.8577%2033.4062%2041.1256%2034.2306L45.0626%2046.3477C45.6616%2048.1912%2043.5517%2049.7242%2041.9835%2048.5848L31.6761%2041.0961C30.9748%2040.5865%2030.0252%2040.5865%2029.3239%2041.0961L19.0165%2048.5848C17.4483%2049.7242%2015.3384%2048.1912%2015.9374%2046.3477L19.8744%2034.2306C20.1423%2033.4062%2019.8489%2032.5031%2019.1476%2031.9935L8.84015%2024.5048C7.272%2023.3654%208.07793%2020.8851%2010.0163%2020.8851H22.7569C23.6238%2020.8851%2024.3921%2020.3269%2024.6599%2019.5024L28.597%207.38536Z%22%20fill%3D%22url(%23paint0_linear_36_570)%22%2F%3E%3Cpath%20d%3D%22M26.6935%206.7673C27.8915%203.08034%2033.1085%203.08035%2034.3065%206.7673L38.2429%2018.8843H50.9841C54.8605%2018.8846%2056.472%2023.8454%2053.3358%2026.1239L43.0283%2033.6128L46.9657%2045.7297C48.1633%2049.4166%2043.9437%2052.4821%2040.8075%2050.2035L30.5%2042.7147L20.1925%2050.2035C17.0563%2052.4821%2012.8367%2049.4165%2014.0343%2045.7297L17.9717%2033.6128L7.6642%2026.1239C4.52799%2023.8454%206.13948%2018.8846%2010.0159%2018.8843H22.7571L26.6935%206.7673Z%22%20stroke%3D%22white%22%20stroke-width%3D%224%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_d_36_570%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2261%22%20height%3D%2258.9991%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%3CfeOffset%20dy%3D%222%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22out%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.25%200%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22effect1_dropShadow_36_570%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22effect1_dropShadow_36_570%22%20result%3D%22shape%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_36_570%22%20x1%3D%2243.0321%22%20y1%3D%2245.7596%22%20x2%3D%2217.2307%22%20y2%3D%2221.4325%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22white%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23A586AE%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); }
.wbpop__starIco[data-color="silver"] { background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2261%22%20height%3D%2259%22%20viewBox%3D%220%200%2061%2059%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20filter%3D%22url(%23filter0_d_36_573)%22%3E%3Cpath%20d%3D%22M28.597%207.38536C29.196%205.54188%2031.804%205.54188%2032.403%207.38536L36.3401%2019.5024C36.6079%2020.3269%2037.3762%2020.8851%2038.2431%2020.8851H50.9837C52.9221%2020.8851%2053.728%2023.3654%2052.1598%2024.5048L41.8524%2031.9935C41.1511%2032.5031%2040.8577%2033.4062%2041.1256%2034.2306L45.0626%2046.3477C45.6616%2048.1912%2043.5517%2049.7242%2041.9835%2048.5848L31.6761%2041.0961C30.9748%2040.5865%2030.0252%2040.5865%2029.3239%2041.0961L19.0165%2048.5848C17.4483%2049.7242%2015.3384%2048.1912%2015.9374%2046.3477L19.8744%2034.2306C20.1423%2033.4062%2019.8489%2032.5031%2019.1476%2031.9935L8.84015%2024.5048C7.272%2023.3654%208.07793%2020.8851%2010.0163%2020.8851H22.7569C23.6238%2020.8851%2024.3921%2020.3269%2024.6599%2019.5024L28.597%207.38536Z%22%20fill%3D%22url(%23paint0_linear_36_573)%22%2F%3E%3Cpath%20d%3D%22M26.6935%206.7673C27.8915%203.08034%2033.1085%203.08035%2034.3065%206.7673L38.2429%2018.8843H50.9841C54.8605%2018.8846%2056.472%2023.8454%2053.3358%2026.1239L43.0283%2033.6128L46.9657%2045.7297C48.1633%2049.4166%2043.9437%2052.4821%2040.8075%2050.2035L30.5%2042.7147L20.1925%2050.2035C17.0563%2052.4821%2012.8367%2049.4165%2014.0343%2045.7297L17.9717%2033.6128L7.6642%2026.1239C4.52799%2023.8454%206.13948%2018.8846%2010.0159%2018.8843H22.7571L26.6935%206.7673Z%22%20stroke%3D%22white%22%20stroke-width%3D%224%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_d_36_573%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2261%22%20height%3D%2258.9991%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%3CfeOffset%20dy%3D%222%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22out%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.25%200%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22effect1_dropShadow_36_573%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22effect1_dropShadow_36_573%22%20result%3D%22shape%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_36_573%22%20x1%3D%2243.0321%22%20y1%3D%2245.7596%22%20x2%3D%2217.2307%22%20y2%3D%2221.4325%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22white%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%239A9A9A%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); }
.wbpop__starIco[data-color="black"] { background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2261%22%20height%3D%2259%22%20viewBox%3D%220%200%2061%2059%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20filter%3D%22url(%23filter0_d_36_576)%22%3E%3Cpath%20d%3D%22M28.597%207.38536C29.196%205.54188%2031.804%205.54188%2032.403%207.38536L36.3401%2019.5024C36.6079%2020.3269%2037.3762%2020.8851%2038.2431%2020.8851H50.9837C52.9221%2020.8851%2053.728%2023.3654%2052.1598%2024.5048L41.8524%2031.9935C41.1511%2032.5031%2040.8577%2033.4062%2041.1256%2034.2306L45.0626%2046.3477C45.6616%2048.1912%2043.5517%2049.7242%2041.9835%2048.5848L31.6761%2041.0961C30.9748%2040.5865%2030.0252%2040.5865%2029.3239%2041.0961L19.0165%2048.5848C17.4483%2049.7242%2015.3384%2048.1912%2015.9374%2046.3477L19.8744%2034.2306C20.1423%2033.4062%2019.8489%2032.5031%2019.1476%2031.9935L8.84015%2024.5048C7.272%2023.3654%208.07793%2020.8851%2010.0163%2020.8851H22.7569C23.6238%2020.8851%2024.3921%2020.3269%2024.6599%2019.5024L28.597%207.38536Z%22%20fill%3D%22url(%23paint0_linear_36_576)%22%2F%3E%3Cpath%20d%3D%22M26.6935%206.7673C27.8915%203.08034%2033.1085%203.08035%2034.3065%206.7673L38.2429%2018.8843H50.9841C54.8605%2018.8846%2056.472%2023.8454%2053.3358%2026.1239L43.0283%2033.6128L46.9657%2045.7297C48.1633%2049.4166%2043.9437%2052.4821%2040.8075%2050.2035L30.5%2042.7147L20.1925%2050.2035C17.0563%2052.4821%2012.8367%2049.4165%2014.0343%2045.7297L17.9717%2033.6128L7.6642%2026.1239C4.52799%2023.8454%206.13948%2018.8846%2010.0159%2018.8843H22.7571L26.6935%206.7673Z%22%20stroke%3D%22white%22%20stroke-width%3D%224%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_d_36_576%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2261%22%20height%3D%2258.9991%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%20result%3D%22hardAlpha%22%2F%3E%3CfeOffset%20dy%3D%222%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20operator%3D%22out%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.25%200%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22effect1_dropShadow_36_576%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22effect1_dropShadow_36_576%22%20result%3D%22shape%22%2F%3E%3C%2Ffilter%3E%3ClinearGradient%20id%3D%22paint0_linear_36_576%22%20x1%3D%2243.0321%22%20y1%3D%2245.7596%22%20x2%3D%2217.2307%22%20y2%3D%2221.4325%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22white%22%2F%3E%3Cstop%20offset%3D%221%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); }
.wbpop__colorTxt { font-family: var(--font-kr); font-weight: 700; font-size: calc(22 * var(--vw)); letter-spacing: -0.02em; }
.jsWbPopColor:not(.is-on) .wbpop__starIco { opacity: 0.4; }
.jsWbPopColor.is-on .wbpop__starIco { transform: scale(1.1); }
.wbpop__starIco { transition: transform 0.6s ease; }
.wbpop__colorStars button:hover .wbpop__starIco { transform: rotate(360deg); }
.wbpop__colorImg { position: relative; width: calc(800 * var(--vw)); height: calc(800 * var(--vw)); border-radius: calc(10 * var(--vw)); overflow: hidden; }
.wbpop__colorImg .jsWbPopColorImg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: auto; display: none; }
.wbpop__colorImg .jsWbPopColorImg.is-on { display: block; }

/* 운동 스위처(sticky) + 화보 자동 롤링 */
.wbpop__sport { width: 100%; }
.wbpop__sportBar {background-color: #0c2640; background-image: url("https://image.nbkorea.com/NBRB_PC/event/imc/NKWINDBREAKER/popup/wbpop__panel--bg.jpg"); background-repeat:no-repeat; background-position: center; background-size: cover;  position: sticky; top: 0; z-index: 5; display: flex; flex-direction: column; align-items: center; gap: calc(40 * var(--vw)); width: 100%; padding: calc(40 * var(--vw)) 0; }
.wbpop__sportTabs { display: flex; gap: calc(40 * var(--vw)); justify-content: center; }
.wbpop__sportTabs button { padding: 0; background: none; border: 0; cursor: pointer; }
.wbpop__sportThumb { position: relative; display: block; width: calc(195 * var(--vw)); height: calc(195 * var(--vw)); border-radius: 50%; overflow: hidden; background: #333; }
.wbpop__sportThumb img { width: 100%; height: 100%; object-fit: cover; }
.wbpop__sportThumb::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.35); transition: background 0.2s; }
.wbpop__sportTxt { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; z-index: 1; font-family: var(--font-kr); font-weight: 900; font-style: normal; font-size: calc(30 * var(--vw)); line-height: 1.2; color: #fff; text-align: center; letter-spacing: -0.03em; }
.jsWbPopSport:not(.is-on) .wbpop__sportThumb::after { background: rgba(0,0,0,0.6); }
.jsWbPopSport.is-on .wbpop__sportThumb { outline: calc(3 * var(--vw)) solid #fff; outline-offset: calc(-3 * var(--vw)); }
.wbpop__galleries { width: 100%; margin-top: calc(40 * var(--vw)); }
.wbpop__gallery { display: none; }
.wbpop__gallery.is-on { display: block; }
/* 화보 콜라주 (시안 3행 스태거) */
.wbpop__collage { display: flex; flex-direction: column; gap: calc(40 * var(--vw)); padding-top: calc(80 * var(--vw)); }
.wbpop__cimg { display: block; object-fit: cover; }
.wbpop__crow1, .wbpop__crow3 { position: relative; width: 100%; }
.wbpop__crow1 { height: calc(1011 * var(--vw)); }
.wbpop__crow3 { height: calc(869 * var(--vw)); }
.wbpop__crow1 .cA { position: absolute; left: calc(1160 * var(--vw)); top: calc(2 * var(--vw)); width: calc(620 * var(--vw)); height: calc(850 * var(--vw)); }
.wbpop__crow1 .cB { position: absolute; left: calc(560 * var(--vw)); top: calc(67 * var(--vw)); width: calc(480 * var(--vw)); height: calc(657 * var(--vw)); }
.wbpop__crow1 .cC { position: absolute; left: calc(140 * var(--vw)); top: calc(127 * var(--vw)); width: calc(480 * var(--vw)); height: calc(657 * var(--vw)); }
.wbpop__crow2 { display: flex; gap: calc(116 * var(--vw)); align-items: center; justify-content: center; width: 100%; padding-bottom: calc(160 * var(--vw)); }
.wbpop__cgroup { display: flex; gap: calc(40 * var(--vw)); align-items: center; }
.wbpop__cbig { width: calc(843 * var(--vw)); height: calc(850 * var(--vw)); }
.wbpop__ccol { display: flex; flex-direction: column; gap: calc(40 * var(--vw)); width: calc(245 * var(--vw)); }
.wbpop__ccol .wbpop__cimg { width: 100%; height: calc(244 * var(--vw)); }
.wbpop__cpurple2 { width: calc(673 * var(--vw)); height: calc(850 * var(--vw)); }
.wbpop__crow3 .cA { position: absolute; left: calc(25 * var(--vw)); top: calc(5 * var(--vw)); width: calc(850 * var(--vw)); height: calc(717 * var(--vw)); }
.wbpop__crow3 .cB { position: absolute; left: calc(996 * var(--vw)); top: calc(5 * var(--vw)); width: calc(480 * var(--vw)); height: calc(657 * var(--vw)); }
.wbpop__crow3 .cC { position: absolute; left: calc(1416 * var(--vw)); top: calc(65 * var(--vw)); width: calc(480 * var(--vw)); height: calc(657 * var(--vw)); }