@charset "utf-8";

/* ============================================================
 * 라이팅스 책가방 티저 (NB2024-13486) PC
 * ============================================================ */
.imc {
    width: 100%;
    overflow-x: clip;
    background: #1e202c;
    color: #fff;
    --font-serif: 'ITCGaramondStd', serif;
    --g-sky: linear-gradient(90deg, #a6c8ff 0%, #dd8ab7 100%);
    --g-girl: linear-gradient(90deg, #ffd4a2 0%, #ee77b8 100%);
    --g-boy: linear-gradient(90deg, #a6f0f0 0%, #928add 100%);
    --g-coupon: linear-gradient(90deg, #86a5d5 0%, #c870a0 100%);
}
.imc em, .imc i { font-style: normal; font-weight: inherit; }
.imc button { cursor: pointer; }
.lb__sec { position: relative; }

/* 그라데이션 텍스트 */
.lb__grad { background-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.lb__grad--sky { background-image: var(--g-sky); }
.lb__grad--girl { background-image: var(--g-girl); }
.lb__grad--boy { background-image: var(--g-boy); }

/* 공통 헤드 */
.lb__head { display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--vw)); text-align: center; }
.lb__eyebrow { font-weight: 700; font-size: calc(26 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; }
.lb__eyebrow--sm { font-size: calc(20 * var(--vw)); line-height: calc(28 * var(--vw)); letter-spacing: 0; }
.lb__eyebrow i { margin: 0 calc(8 * var(--vw)); font-weight: 400; }
.lb__title { font-weight: 900; font-size: calc(40 * var(--vw)); line-height: calc(56 * var(--vw)); letter-spacing: -0.05em; color: #fff; }
.lb__title--dark { color: #111; }
.lb__title em { font-size: calc(42 * var(--vw)); }
.lb__copy { font-weight: 400; font-size: calc(24 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.05em; color: #fff; }

/* ===== 01. KV ===== */
.lb__kv { padding-bottom: calc(160 * var(--vw)); }
.lb__kvVisual { position: relative; height: calc(960 * var(--vw)); overflow: hidden; }
.lb__kvVisual > img { height: 100%; object-fit: cover; }
.lb__kvLogo { position: absolute; top: calc(343 * var(--vw)); left: 50%; width: calc(563 * var(--vw)); transform: translateX(-50%); text-align: center; }
.lb__kvDate { margin-top: calc(1 * var(--vw)); font-weight: 800; font-size: calc(34 * var(--vw)); line-height: calc(44 * var(--vw)); color: #fff; }
.lb__kvDate i { margin: 0 calc(12 * var(--vw)); font-weight: 500; }
.lb__kvCopy { display: flex; flex-direction: column; align-items: center; margin-top: calc(60 * var(--vw)); text-align: center; }
.lb__kvSub { font-weight: 700; font-size: calc(35 * var(--vw)); line-height: calc(39 * var(--vw)); letter-spacing: -0.01em; text-transform: uppercase; }
.lb__kvTitle { margin-top: calc(12 * var(--vw)); font-family: var(--font-serif); font-weight: 400; font-size: calc(90 * var(--vw)); line-height: calc(99 * var(--vw)); letter-spacing: -0.01em; color: #fff; }
.lb__kvDesc { margin-top: calc(20 * var(--vw)); font-weight: 400; font-size: calc(28 * var(--vw)); line-height: calc(44 * var(--vw)); letter-spacing: -0.05em; }
.lb__kvDescEn { font-size: calc(30 * var(--vw)); letter-spacing: calc(0.6 * var(--vw)); }
.lb__kvDesc b { font-weight: 800; font-size: calc(30 * var(--vw)); }
.lb__kvDesc b i { margin: 0 calc(10 * var(--vw)); font-weight: 400; }

/* ===== 02. 선공개 2종 ===== */
.lb__first { padding-bottom: calc(215 * var(--vw)); }
.lb__firstList { display: flex; justify-content: center; gap: calc(20 * var(--vw)); margin-top: calc(60 * var(--vw)); }
.lb__firstItem { display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--vw)); width: calc(550 * var(--vw)); }
.lb__firstImg { position: relative; width: 100%; height: calc(730 * var(--vw)); border-radius: calc(20 * var(--vw)); overflow: hidden; }
.lb__firstItem--girl .lb__firstImg { background: linear-gradient(90deg, #ffd4a2 0%, #c972a2 100%); }
.lb__firstItem--boy .lb__firstImg { background: linear-gradient(90deg, #a6f0f0 0%, #928add 100%); }
.lb__firstImg img { position: absolute; top: 1px; left: 1px; width: calc(100% - 2px); height: calc(100% - 2px); object-fit: cover; border-radius: calc(20 * var(--vw) - 1px); }
.lb__firstDim { transition: opacity 1.4s ease 0.4s; }
.lb__firstList.is-on .lb__firstDim { opacity: 0; }
.lb__firstTxt { font-weight: 700; font-size: calc(26 * var(--vw)); line-height: calc(48 * var(--vw)); letter-spacing: -0.05em; text-align: center; color: #fff; }
.lb__firstTxt b { font-size: calc(29 * var(--vw)); }
.lb__firstTxt span { font-size: calc(32 * var(--vw)); letter-spacing: calc(-1.6 * var(--vw)); }
.lb__firstTxt span em { font-size: calc(35 * var(--vw)); }

/* ===== 03. 선발매 혜택 ===== */
.lb__benefit { padding: calc(140 * var(--vw)) 0; background: #f5f5f5; color: #151415; }
.lb__benefit .lb__head { gap: calc(10 * var(--vw)); }
.lb__benefitList { display: flex; flex-direction: column; gap: calc(25 * var(--vw)); width: calc(1160 * var(--vw)); margin: calc(60 * var(--vw)) auto 0; }
.lb__benefitItem { display: flex; align-items: center; justify-content: center; gap: calc(60 * var(--vw)); padding: calc(60 * var(--vw)) calc(50 * var(--vw)); background: #fff; }
.lb__benefitTxt { width: calc(440 * var(--vw)); }
.lb__benefitTit { margin-bottom: calc(13 * var(--vw)); font-weight: 800; font-size: calc(34 * var(--vw)); line-height: 1; letter-spacing: -0.02em; }
.lb__benefitDesc { font-weight: 400; font-size: calc(24 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.05em; }
.lb__benefitDesc em { font-size: calc(26 * var(--vw)); }
.lb__benefitSub { font-weight: 700; font-size: calc(18 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.05em; color: #939393; }

.lb__keyring { position: relative; width: calc(560 * var(--vw)); height: calc(230 * var(--vw)); }
.lb__keyringItem { position: absolute; top: calc(-19 * var(--vw)); width: calc(220 * var(--vw)); }
.lb__keyringItem:nth-child(1) { left: calc(15 * var(--vw)); }
.lb__keyringItem:nth-child(2) { left: calc(170 * var(--vw)); }
.lb__keyringItem:nth-child(3) { left: calc(325 * var(--vw)); }
.lb__keyringItem span { position: absolute; top: calc(211 * var(--vw)); left: 0; width: 100%; font-weight: 700; font-size: calc(18 * var(--vw)); line-height: calc(20 * var(--vw)); letter-spacing: -0.02em; text-align: center; color: rgba(0, 0, 0, 0.4); }

.lb__coupon { display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--vw)); width: calc(560 * var(--vw)); }
.lb__couponCard { position: relative; width: calc(504 * var(--vw)); height: calc(207 * var(--vw)); border-radius: calc(10 * var(--vw)); background: var(--g-coupon); color: #fff; }
.lb__couponCard::before,
.lb__couponCard::after { content: ''; position: absolute; top: calc(92 * var(--vw)); width: calc(23 * var(--vw)); height: calc(23 * var(--vw)); border-radius: 50%; background: #fff; }
.lb__couponCard::before { left: calc(-11.5 * var(--vw)); }
.lb__couponCard::after { right: calc(-11.5 * var(--vw)); }
.lb__couponBrand { position: absolute; top: calc(25 * var(--vw)); left: calc(34 * var(--vw)); font-family: var(--font-serif); font-weight: 400; font-size: calc(31.5 * var(--vw)); line-height: calc(38 * var(--vw)); }
.lb__couponType { position: absolute; top: calc(161 * var(--vw)); left: calc(34 * var(--vw)); font-family: 'ITC Avant Garde Gothic Std', 'ProximaNova', sans-serif; font-weight: 600; font-size: calc(15.3 * var(--vw)); line-height: calc(22 * var(--vw)); letter-spacing: -0.01em; }
.lb__couponValue { position: absolute; top: calc(77 * var(--vw)); right: calc(33 * var(--vw)); font-weight: 700; font-size: calc(81 * var(--vw)); line-height: calc(81 * var(--vw)); letter-spacing: -0.05em; }
.lb__couponBtn { width: calc(200 * var(--vw)); height: calc(60 * var(--vw)); border: 0; border-radius: calc(5 * var(--vw)); background: #151415; font-weight: 700; font-size: calc(20 * var(--vw)); letter-spacing: -0.05em; color: #fff; }
.lb__couponBtn.is-done { color: #a4a4a4; cursor: default; }

.lb__noticeBtn { display: block; margin: calc(60 * var(--vw)) auto 0; padding: 0; border: 0; background: none; font-weight: 700; font-size: calc(18 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.05em; color: #8e8f8f; text-decoration: underline; text-underline-offset: calc(3 * var(--vw)); }
.lb__notice { display: none; width: calc(680 * var(--vw)); margin: calc(60 * var(--vw)) auto 0; font-weight: 400; font-size: calc(16 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.05em; color: #8e8f8f; }
.lb__notice.is-open { display: block; }
.lb__notice strong { display: block; font-weight: 700; }
.lb__notice li { white-space: nowrap; }

/* ===== 04. 런칭 일정 ===== */
.lb__schedule { padding: calc(140 * var(--vw)) 0; background: #fff; color: #111; }
.lb__schedule .lb__head { gap: calc(10 * var(--vw)); }
.lb__timeline { position: relative; width: calc(784 * var(--vw)); height: calc(276 * var(--vw)); margin: calc(60 * var(--vw)) auto 0; border: 1px solid #d5d5d5; border-radius: calc(10 * var(--vw)); background: #f5f5f5; }
.lb__timelineDate li { position: absolute; top: calc(34 * var(--vw)); transform: translateX(-50%); font-weight: 600; font-size: calc(24 * var(--vw)); line-height: calc(31 * var(--vw)); letter-spacing: -0.03em; color: rgba(0, 0, 0, 0.25); white-space: nowrap; }
.lb__timelineDate li.is-point { font-weight: 700; color: #323232; }
.lb__timelineDate li small { font-weight: 700; font-size: calc(21 * var(--vw)); }
.lb__timelineDate li:nth-child(1) { left: calc(118 * var(--vw)); }
.lb__timelineDate li:nth-child(2) { left: calc(224 * var(--vw)); }
.lb__timelineDate li:nth-child(3) { left: calc(325 * var(--vw)); }
.lb__timelineDate li:nth-child(4) { left: calc(414 * var(--vw)); }
.lb__timelineDate li:nth-child(5) { left: calc(496 * var(--vw)); }
.lb__timelineDate li:nth-child(6) { left: calc(580 * var(--vw)); }
.lb__timelineDate li:nth-child(7) { left: calc(676 * var(--vw)); }
.lb__timelineLine { position: absolute; top: calc(84 * var(--vw)); left: calc(45 * var(--vw)); width: calc(695 * var(--vw)); height: 1px; background: #323232; }
.lb__timelineDot { position: absolute; top: calc(80 * var(--vw)); width: calc(8 * var(--vw)); height: calc(8 * var(--vw)); border-radius: 50%; background: #323232; }
.lb__timelineDot--first { left: calc(110 * var(--vw)); }
.lb__timelineDot--main { left: calc(672 * var(--vw)); }
.lb__timelineTag { position: absolute; width: calc(120 * var(--vw)); border-radius: calc(8 * var(--vw)); font-weight: 500; font-size: calc(16 * var(--vw)); line-height: calc(26 * var(--vw)); letter-spacing: -0.02em; color: #fff; white-space: nowrap; }
.lb__timelineTag b { display: block; font-weight: 900; font-size: calc(20 * var(--vw)); letter-spacing: -0.05em; }
.lb__timelineTag em { font-size: calc(18 * var(--vw)); }
.lb__timelineTag--first { top: calc(106 * var(--vw)); left: calc(58 * var(--vw)); height: calc(87 * var(--vw)); padding: calc(16 * var(--vw)); background: #7a8fc3; }
.lb__timelineTag--main { top: calc(106 * var(--vw)); left: calc(616 * var(--vw)); height: calc(87 * var(--vw)); padding: calc(16 * var(--vw)) calc(14 * var(--vw)); background: #405791; }
.lb__timelineTag--live { top: calc(198 * var(--vw)); left: calc(616 * var(--vw)); height: calc(55 * var(--vw)); padding: calc(15 * var(--vw)) calc(14 * var(--vw)); background: #8d63ba; }

/* ===== 05. 11.04 라인업 ===== */
.lb__lineup { padding: calc(160 * var(--vw)) 0; }
.lb__lineupList { display: flex; justify-content: center; gap: calc(20 * var(--vw)); margin-top: calc(60 * var(--vw)); }
.lb__lineupItem { display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--vw)); width: calc(437 * var(--vw)); }
.lb__lineupImg { position: relative; width: 100%; height: calc(600 * var(--vw)); border-radius: calc(18.24 * var(--vw)); overflow: hidden; }
.lb__lineupList--girl .lb__lineupImg { background: linear-gradient(135deg, #ffd4a2 0%, #1e202c 50%, #ee77b8 100%); }
.lb__lineupList--boy .lb__lineupImg { background: linear-gradient(135deg, #a6f0f0 0%, #1e202c 50%, #928add 100%); }
.lb__lineupImg img { position: absolute; top: 2px; left: 2px; width: calc(100% - 4px); height: calc(100% - 4px); object-fit: cover; border-radius: calc(18.24 * var(--vw) - 2px); }
.lb__lineupItem.is-soon .lb__lineupImg::after { content: ''; position: absolute; inset: 2px; border-radius: calc(18.24 * var(--vw) - 2px); background: rgba(0, 0, 0, 0.05); }
.lb__lineupBadge { position: absolute; top: calc(20 * var(--vw)); right: calc(20 * var(--vw)); z-index: 1; width: calc(165 * var(--vw)); height: calc(45 * var(--vw)); border-radius: calc(200 * var(--vw)); font-weight: 700; font-size: calc(24 * var(--vw)); line-height: calc(45 * var(--vw)); letter-spacing: -0.02em; text-align: center; color: #1e202c; }
.lb__lineupList--girl .lb__lineupBadge { background: var(--g-girl); }
.lb__lineupList--boy .lb__lineupBadge { background: var(--g-boy); }
.lb__lineupName { font-weight: 700; font-size: calc(30 * var(--vw)); line-height: calc(35 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; color: #fff; }
.lb__lineupName em { font-size: calc(33 * var(--vw)); }

/* ===== 06. 런칭 캘린더·라이브 알림 ===== */
.lb__alarm { padding: calc(140 * var(--vw)) 0; background: #fff; }
.lb__alarmBtns { display: flex; justify-content: center; gap: calc(12 * var(--vw)); margin-top: calc(40 * var(--vw)); }
.lb__alarmBtn { height: calc(65 * var(--vw)); padding: 0 calc(40 * var(--vw)); border: 0; border-radius: calc(5 * var(--vw)); background: #111; font-weight: 400; font-size: calc(16 * var(--vw)); line-height: calc(22 * var(--vw)); letter-spacing: -0.05em; color: #fff; }
.lb__alarmBtn em { font-size: calc(18 * var(--vw)); }
.lb__alarmBtn b { font-weight: 700; }
.lb__alarmBtn--live { background: var(--g-coupon); }
.lb__alarmBtn.is-done { color: #a4a4a4; cursor: default; }
.lb__alarmBtn--live.is-done { color: #ccc; }

/* ===== 07~08. CHOOSE YOUR SPOTLIGHT ===== */
.lb__spotlight { background: #1e202c; }
.lb__choose { padding-top: calc(140 * var(--vw)); }

/* 고정 네비게이터 */
.lb__nav { position: sticky; top: 106px; z-index: 20; margin-top: calc(40 * var(--vw)); padding: calc(20 * var(--vw)) 0; background: #1e202c; }
.lb__navInner { display: flex; justify-content: center; gap: calc(12 * var(--vw)); }
.lb__navBtn { display: flex; flex-direction: column; align-items: center; justify-content: center; height: calc(80 * var(--vw)); padding: 0; border: 2px solid transparent; border-radius: calc(200 * var(--vw)); font-weight: 700; font-size: calc(26 * var(--vw)); line-height: 1; letter-spacing: -0.02em; text-transform: uppercase; transition: background 0.2s, color 0.2s; }
.lb__navBtn--girl { width: calc(311 * var(--vw)); background: linear-gradient(#1e202c, #1e202c) padding-box, var(--g-girl) border-box; color: #f189b4; }
.lb__navBtn--boy { width: calc(309 * var(--vw)); background: linear-gradient(#1e202c, #1e202c) padding-box, var(--g-boy) border-box; color: #91b9fa; }
.lb__navBtn--girl.is-on { background: var(--g-girl) border-box; color: #1e202c; }
.lb__navBtn--boy.is-on { background: var(--g-boy) border-box; color: #1e202c; }
.lb__navBtn--pick { width: calc(273 * var(--vw)); border-color: #fff; background: transparent; color: #fff; }
.lb__navBtn--pick b { font-weight: 700; font-size: calc(24 * var(--vw)); letter-spacing: -0.02em; }
.lb__navBtn--pick small { margin-top: calc(8 * var(--vw)); font-weight: 500; font-size: calc(15 * var(--vw)); line-height: 1; letter-spacing: -0.02em; opacity: 0.5; }
.lb__navBtn--pick:hover { background: #fff; color: #1e202c; }

/* 여아/남아 */
.lb__genderHead { display: flex; flex-direction: column; align-items: center; gap: calc(15 * var(--vw)); text-align: center; }
.lb__gender--girl .lb__genderHead { padding-top: calc(40 * var(--vw)); }
.lb__gender--boy .lb__genderHead { padding-top: calc(160 * var(--vw)); }
.lb__gender--boy { padding-bottom: calc(162 * var(--vw)); }
.lb__genderTitle { font-family: var(--font-serif); font-weight: 400; font-size: calc(60 * var(--vw)); line-height: calc(60 * var(--vw)); letter-spacing: -0.01em; }
.lb__genderCopy { font-weight: 400; font-size: calc(24 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.05em; color: #fff; }
.lb__genderCopy span { font-size: calc(26 * var(--vw)); }

/* 상품 패널 가로 스크롤 */
/* 넘길 때 좌측 여백까지 패널이 보이도록 margin 대신 padding (overflow 는 padding 영역까지 노출) */
.lb__prod.swiper-container { margin: calc(60 * var(--vw)) 0 0; padding: 0 0 calc(46 * var(--vw)) calc(175 * var(--vw)); }
.lb__prod .lb__panel { position: relative; width: calc(600 * var(--vw)); height: calc(740 * var(--vw)); overflow: hidden; background: #fff; }
.lb__prod > .lb__prodBar { position: absolute; left: calc(175 * var(--vw)); bottom: 0; width: calc(1570 * var(--vw)); height: calc(6 * var(--vw)); border-radius: 0; background: #a2a2a2; }
.lb__prodBar .swiper-scrollbar-drag { border-radius: 0; background: #fff; }
.lb__panel .lb__bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

.lb__panel--intro::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: calc(495 * var(--vw)); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%); opacity: 0.5; }
.lb__panelIntro { position: absolute; left: calc(50 * var(--vw)); bottom: calc(46 * var(--vw)); z-index: 1; color: #fff; }
.lb__panelEyebrow { font-weight: 700; font-size: calc(28 * var(--vw)); line-height: calc(28 * var(--vw)); letter-spacing: -0.01em; }
.lb__panelName { margin-top: calc(7 * var(--vw)); font-weight: 800; font-size: calc(58 * var(--vw)); line-height: calc(71 * var(--vw)); letter-spacing: -0.01em; }
.lb__panelNameKr { margin-top: calc(3 * var(--vw)); font-weight: 500; font-size: calc(32 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.01em; }

.lb__panel--dark::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: calc(420 * var(--vw)); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%); opacity: 0.5; }
.lb__panelBody { position: absolute; top: calc(63 * var(--vw)); left: calc(58 * var(--vw)); z-index: 1; display: flex; flex-direction: column; align-items: center; gap: calc(30 * var(--vw)); width: calc(484 * var(--vw)); text-align: center; color: #1e202c; }
.lb__panel--dark .lb__panelBody { color: #fff; }
.lb__panelTit { font-weight: 800; font-size: calc(38 * var(--vw)); line-height: calc(46 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; }
.lb__panelDesc { font-weight: 500; font-size: calc(26 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.05em; }
.lb__panelDesc em { font-size: calc(28 * var(--vw)); }
.lb__color.swiper-container { width: calc(420 * var(--vw)); height: calc(420 * var(--vw)); border-radius: calc(15 * var(--vw)); background: #fff; }
.lb__colorDots { position: absolute; left: 0; bottom: calc(40 * var(--vw)) !important; z-index: 1; display: flex; justify-content: center; gap: calc(6 * var(--vw)); width: 100%; }
.lb__colorDots .swiper-pagination-bullet { width: calc(18 * var(--vw)); height: calc(18 * var(--vw)); border: 1px solid #b5b5b5; background: #fff; opacity: 1; margin: 0 !important;}
.lb__colorDots .swiper-pagination-bullet-active { background: #b5b5b5; }
.lb__colorDim { position: relative; }
.lb__colorDim::before { content: ''; position: absolute; inset: 0; background: url('https://image.nbkorea.com/NBRB_PC/event/imc/NK2026LIGHTINGSBACKPACKTEASER/coming-soon.png') no-repeat center center / cover; }

.lb__panel--set { color: #1e202c; }
.lb__panel--set .lb__panelTit { position: absolute; top: calc(63 * var(--vw)); left: calc(58 * var(--vw)); width: calc(484 * var(--vw)); text-align: center; }
.lb__setItem { position: absolute; width: calc(200 * var(--vw)); }
.lb__setItem--keyring { top: calc(423 * var(--vw)); left: calc(31 * var(--vw)); }
.lb__setItem--bag { top: calc(149 * var(--vw)); left: calc(370 * var(--vw)); }
.lb__setItem span { display: block; font-weight: 500; font-size: calc(22 * var(--vw)); line-height: calc(42 * var(--vw)); letter-spacing: -0.05em; text-align: center; }
.lb__setItem span em { font-size: calc(24 * var(--vw)); }
.lb__gender--boy .lb__setItem--bag span { text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1.5px 1.5px #fff, -1.5px -1.5px #fff, 1.5px -1.5px #fff, -1.5px 1.5px #fff; }
/* 상품 이미지 > 구성품 뿅뿅 */
.lb__setItem { opacity: 0; transform: scale(0); }
.lb__panel--set.is-on .lb__setItem { animation: lbPopIn 0.5s ease-out forwards; }
.lb__panel--set.is-on .lb__setItem--bag { animation-delay: 0.4s; }
.lb__panel--set.is-on .lb__setItem--keyring { animation-delay: 0.7s; }

/* 상품 연출컷 > 딤드 > 내용 나오기 */
.lb__panel--buy::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); opacity: 0; transition: opacity 0.8s ease 0.6s; }
.lb__panelBuy { position: absolute; top: calc(63 * var(--vw)); left: calc(100 * var(--vw)); z-index: 1; width: calc(400 * var(--vw)); height: calc(602 * var(--vw)); text-align: center; color: #fff; opacity: 0; transform: translateY(calc(30 * var(--vw))); transition: opacity 0.8s ease 1.3s, transform 0.8s ease 1.3s; }
.lb__panel--buy.is-on::after,
.lb__panel--buy.is-on .lb__panelBuy { opacity: 1; }
.lb__panel--buy.is-on .lb__panelBuy { transform: translateY(0); }
.lb__buyName { display: inline-block; font-weight: 900; font-size: calc(40 * var(--vw)); line-height: calc(51 * var(--vw)); letter-spacing: -0.02em; }
.lb__panelBuy .lb__buyProd { position: absolute; top: calc(38 * var(--vw)); left: calc(40 * var(--vw)); width: calc(320 * var(--vw)); }
.lb__gender--boy .lb__panelBuy .lb__buyProd { left: calc(45 * var(--vw)); width: calc(310 * var(--vw)); }
.lb__buyInfo { position: absolute; top: calc(349 * var(--vw)); left: 0; width: 100%; font-weight: 500; font-size: calc(28 * var(--vw)); line-height: calc(46 * var(--vw)); letter-spacing: -0.05em; }
.lb__buyInfo em { font-size: calc(30 * var(--vw)); }
.lb__buyBtn { position: absolute; top: calc(522 * var(--vw)); left: 0; display: block; width: 100%; height: calc(80 * var(--vw)); border-radius: calc(5 * var(--vw)); font-weight: 700; font-size: calc(24 * var(--vw)); line-height: calc(80 * var(--vw)); text-align: center; letter-spacing: -0.05em; color: #151415; }
.lb__buyBtn em { font-size: calc(26 * var(--vw)); }
.lb__buyBtn--girl { background: var(--g-girl); }
.lb__buyBtn--boy { background: var(--g-boy); }

/* ===== 09. Logo ===== */
.lb__logo { display: flex; justify-content: center; padding: calc(100 * var(--vw)) 0 calc(140 * var(--vw)); background: #fff; }
.lb__logo img { width: calc(170 * var(--vw)); }

/* ===== 내가 직접 고를래요! 레이어팝업 ===== */
body.lb-popup-open { overflow: hidden; }
.lbpop { display: none; position: fixed; top: 0; left: 0; z-index: 10000; width: 100%; height: 100%; overflow-y: auto; background: #1e202c; color: #fff; }
.lbpop.is-open { display: block; }
.lbpop__close { position: fixed; top: calc(40 * var(--vw)); right: calc(40 * var(--vw)); z-index: 5; width: calc(60 * var(--vw)); height: calc(60 * var(--vw)); padding: 0; border: 0; background: none; }
.lbpop__close::before,
.lbpop__close::after { content: ''; position: absolute; top: 50%; left: 50%; width: calc(44 * var(--vw)); height: 3px; background: #fff; }
.lbpop__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.lbpop__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.lbpop__content { display: flex; flex-direction: column; align-items: center; gap: calc(120 * var(--vw)); padding: calc(160 * var(--vw)) 0; }
.lbpop__head { display: flex; flex-direction: column; align-items: center; width: calc(1010 * var(--vw)); text-align: center; }
.lbpop__title { font-weight: 900; font-size: calc(62 * var(--vw)); line-height: calc(87 * var(--vw)); letter-spacing: -0.05em; }
.lbpop__copy { margin-top: calc(15 * var(--vw)); font-weight: 400; font-size: calc(32 * var(--vw)); line-height: calc(52 * var(--vw)); letter-spacing: -0.05em; }
.lbpop__btns { display: flex; gap: calc(20 * var(--vw)); margin-top: calc(60 * var(--vw)); }
.lbpop__btn { height: calc(80 * var(--vw)); padding: 0 calc(40 * var(--vw)); border: 0; border-radius: calc(200 * var(--vw)); font-weight: 700; font-size: calc(32 * var(--vw)); line-height: calc(22 * var(--vw)); letter-spacing: -0.05em; color: #1e202c; }
.lbpop__btn--girl { background: var(--g-girl); }
.lbpop__btn--boy { background: var(--g-boy); }

.lbpop__sec { display: flex; flex-direction: column; align-items: center; gap: calc(40 * var(--vw)); width: calc(1508 * var(--vw)); text-align: center; }
.lbpop__secHead { display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--vw)); }
.lbpop__eyebrow { font-weight: 700; font-size: calc(34 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; }
.lbpop__secTitle { font-weight: 900; font-size: calc(52 * var(--vw)); line-height: calc(73 * var(--vw)); letter-spacing: -0.05em; }
.lbpop__sec--girl .lbpop__secTitle em { color: #fe80af; }
.lbpop__sec--boy .lbpop__secTitle em { color: #91b9fa; }
.lbpop__secTitle .lbpop__en { font-weight: 800; font-size: calc(56 * var(--vw)); }
.lbpop__secCopy { font-weight: 400; font-size: calc(32 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.05em; }
.lbpop__desc { font-weight: 400; font-size: calc(32 * var(--vw)); line-height: calc(52 * var(--vw)); letter-spacing: -0.05em; }
.lbpop__secCopy .lbpop__en,
.lbpop__desc .lbpop__en { font-size: calc(34 * var(--vw)); }

.lbpop__box { position: relative; display: block; width: calc(732 * var(--vw)); height: calc(913 * var(--vw)); border: 1.5px solid transparent; border-radius: calc(30 * var(--vw)); overflow: hidden; }
.lbpop__sec--girl .lbpop__curtain { background: linear-gradient(#737373, #737373) padding-box, var(--g-girl) border-box; }
.lbpop__sec--boy .lbpop__curtain { background: linear-gradient(#737373, #737373) padding-box, var(--g-boy) border-box; }
.lbpop__sec--girl .lbpop__bubble { background: linear-gradient(#fff, #fff) padding-box, var(--g-girl) border-box; }
.lbpop__sec--boy .lbpop__bubble { background: linear-gradient(#fff, #fff) padding-box, var(--g-boy) border-box; }

/* 커튼: 클릭 시 좌우 반쪽이 열리며 화보 등장 */
.lbpop__curtain { display: block; padding: 0; cursor: pointer; }
.lbpop__curtain:disabled { cursor: default; }
.lbpop__curtain img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.lbpop__curtainOpen { z-index: 1; transform: scale(1.08); transition: transform 1.6s ease-out; }
.lbpop__curtainHalf { z-index: 2; transition: transform 1.4s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.4s ease 1.2s; }
/* 소수점 너비에서 50% 경계 안티앨리어싱으로 아래 이미지가 비쳐 1px 겹침 */
.lbpop__curtainHalf--l { clip-path: inset(0 calc(50% - 1px) 0 0); }
.lbpop__curtainHalf--r { clip-path: inset(0 0 0 calc(50% - 1px)); }
.lbpop__curtain::after { content: ''; position: absolute; top: 0; left: 0; z-index: 3; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.15); pointer-events: none; transition: opacity 0.4s; }
.lbpop__curtainTxt { position: absolute; top: calc(355 * var(--vw)); left: 0; z-index: 4; display: block; width: 100%; font-weight: 700; font-size: calc(40.8 * var(--vw)); line-height: calc(62 * var(--vw)); letter-spacing: -0.05em; text-align: center; color: #fff; transition: opacity 0.4s; }
.lbpop__click { display: block; width: fit-content; margin: 0 auto calc(32 * var(--vw)); font-weight: 700; font-size: calc(76.8 * var(--vw)); line-height: calc(46 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; }
.lbpop__curtain.is-open .lbpop__curtainOpen { transform: scale(1); }
.lbpop__curtain.is-open .lbpop__curtainHalf--l { transform: translateX(-50%); opacity: 0; }
.lbpop__curtain.is-open .lbpop__curtainHalf--r { transform: translateX(50%); opacity: 0; }
.lbpop__curtain.is-open::after,
.lbpop__curtain.is-open .lbpop__curtainTxt { opacity: 0; }

.lbpop__bubbleClick,
.lbpop__friendClick { animation: flpopStarPulse 1.6s ease-in-out infinite; }

@keyframes flpopStarPulse { 0%, 100% { transform: scale(1); opacity: 0.9; } 50% { transform: scale(1.12); opacity: 1; } }

/* 비눗방울: 둥둥 → 클릭 시 터짐 → 큰 가방(계속 둥둥) + 친구 버튼 뿅뿅뿅 → 친구 등장 */
.lbpop__bubbleBtn { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.lbpop__bubbleFloat { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; animation: lbFloat 2.4s ease-in-out infinite alternate; }
.lbpop__bubbleImg { position: absolute; top: calc(111 * var(--vw)); left: calc(61 * var(--vw)); width: calc(610 * var(--vw)) !important; }
.lbpop__bubbleClick { position: absolute; z-index: 1; font-weight: 700; font-size: calc(42 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff); }
.lbpop__bubbleClick--01 { top: calc(172 * var(--vw)); left: calc(80 * var(--vw)); }
.lbpop__bubbleClick--02 { top: calc(635 * var(--vw)); left: calc(535 * var(--vw)); }
.lbpop__bubble.is-pop .lbpop__bubbleBtn { animation: lbBubblePop 0.45s ease-out forwards; pointer-events: none; }

.lbpop__bag { position: absolute; z-index: 1; display: block; opacity: 0; transform: scale(0.6); }
.lbpop__bubble--girl .lbpop__bag { top: calc(103 * var(--vw)); left: 0; width: calc(732 * var(--vw)); }
.lbpop__bubble--boy .lbpop__bag { top: calc(119 * var(--vw)); left: calc(22 * var(--vw)); width: calc(669 * var(--vw)); }
.lbpop__bubble.is-pop .lbpop__bag { opacity: 1; transform: scale(1); transition: opacity 0.4s ease 0.25s, transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.25s; }
.lbpop__bubble.is-pop .lbpop__bag img { animation: lbFloat 2.4s ease-in-out 1s infinite alternate; }

.lbpop__friendBtn { position: absolute; z-index: 3; padding: 0; border: 0; background: none; cursor: pointer; opacity: 0; transform: scale(0); pointer-events: none; }
.lbpop__bubble--girl .lbpop__friendBtn { width: calc(110 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friendBtn { width: calc(181 * var(--vw)); }
.lbpop__bubble--girl .lbpop__friendBtn--01 { top: calc(194 * var(--vw)); left: calc(156 * var(--vw)); }
.lbpop__bubble--girl .lbpop__friendBtn--02 { top: calc(414 * var(--vw)); left: calc(410 * var(--vw)); }
.lbpop__bubble--girl .lbpop__friendBtn--03 { top: calc(490 * var(--vw)); left: calc(76 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friendBtn--01 { top: calc(153 * var(--vw)); left: calc(130 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friendBtn--02 { top: calc(480 * var(--vw)); left: calc(460 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friendBtn--03 { top: calc(448 * var(--vw)); left: calc(50 * var(--vw)); }
.lbpop__friendClick { position: absolute; left: 50%; width: calc(95 * var(--vw)); margin-left: calc(-47.5 * var(--vw)); font-weight: 700; font-size: calc(32 * var(--vw)); line-height: calc(38 * var(--vw)); letter-spacing: -0.02em; text-transform: uppercase; color: #fff; }
.lbpop__bubble--girl .lbpop__friendClick { top: calc(96 * var(--vw)); text-shadow: 2px 0 #eb89ae, -2px 0 #eb89ae, 0 2px #eb89ae, 0 -2px #eb89ae, 2px 2px #eb89ae, -2px -2px #eb89ae, 2px -2px #eb89ae, -2px 2px #eb89ae; }
.lbpop__bubble--boy .lbpop__friendClick { top: calc(137 * var(--vw)); margin-left: calc(-57.5 * var(--vw)); text-shadow: 2px 0 #4883e3, -2px 0 #4883e3, 0 2px #4883e3, 0 -2px #4883e3, 2px 2px #4883e3, -2px -2px #4883e3, 2px -2px #4883e3, -2px 2px #4883e3; }
.lbpop__bubble.is-pop .lbpop__friendBtn { pointer-events: auto; animation: lbPopIn 0.5s ease-out forwards; }
.lbpop__bubble.is-pop .lbpop__friendBtn--01 { animation-delay: 0.8s; }
.lbpop__bubble.is-pop .lbpop__friendBtn--02 { animation-delay: 1s; }
.lbpop__bubble.is-pop .lbpop__friendBtn--03 { animation-delay: 1.2s; }
.lbpop__bubble.is-pop .lbpop__friendBtn.is-found { animation: lbPopOut 0.3s ease-in forwards; pointer-events: none; }

.lbpop__friend { position: absolute; z-index: 4; width: calc(220 * var(--vw)) !important; opacity: 0; transform: scale(0); pointer-events: none; }
.lbpop__friend--01 { top: calc(117 * var(--vw)); left: calc(82 * var(--vw)); }
.lbpop__bubble--girl .lbpop__friend--02 { top: calc(387 * var(--vw)); left: calc(461 * var(--vw)); }
.lbpop__bubble--girl .lbpop__friend--03 { top: calc(502 * var(--vw)); left: calc(24 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friend--02 { top: calc(460 * var(--vw)); left: calc(461 * var(--vw)); }
.lbpop__bubble--boy .lbpop__friend--03 { top: calc(475 * var(--vw)); left: calc(24 * var(--vw)); }
/* 등장(scale)은 transform, 둥둥(책가방과 동일 진폭·주기)은 translate 로 분리해 동시 적용 */
.lbpop__friend.is-show { animation: lbPopIn 0.5s ease-out 0.15s forwards, lbFloatY 2.4s ease-in-out 0.15s infinite alternate; }
@keyframes lbFloatY { from { translate: 0 calc(-12 * var(--vw)); } to { translate: 0 calc(12 * var(--vw)); } }

@keyframes lbFloat { from { transform: translateY(calc(-12 * var(--vw))); } to { transform: translateY(calc(12 * var(--vw))); } }
@keyframes lbBubblePop { 0% { opacity: 1; transform: scale(1); } 60% { opacity: 0.8; transform: scale(1.12); } 100% { opacity: 0; transform: scale(1.3); } }
@keyframes lbPopIn { 0% { opacity: 0; transform: scale(0); } 60% { opacity: 1; transform: scale(1.15); } 100% { opacity: 1; transform: scale(1); } }
@keyframes lbPopOut { to { opacity: 0; transform: scale(0); } }

@media (prefers-reduced-motion: reduce) {
    .imc *, .imc *::before, .imc *::after { animation-duration: 0.01ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; transition-delay: 0s !important; }
}