/* 323TAG 26FW 쇼케이스 — 섹션 스타일 (PC + 모바일 750). 게시판 고정 블록은 게시글에 둔다 */
body, html { font-family: 'Pretendard', sans-serif !important; }
:where(#wrap_ey) :where(h1, h2, h3, h4, h5, h6) { margin: 0; }

/* 비주얼 */
#visual_section { position: relative; width: 100%; overflow: hidden; }
#visual_section video { display: block; width: 100%; height: auto; }
#visual_section video.mo_ey { display: none; }
#visual_section .vd_subtext h1 { position: absolute; z-index: 2; top: 3%; left: 1%; font-size: 0.9em; font-weight: 300; color: #6c6c6d; }   /* AI 사용 표시 (추석 기획전과 동일) */
#visual_section .visual_text h1 { position: absolute; top: 38%; left: 50%; transform: translateX(-50%); font-size: 150px; font-weight: 500; color: #fff; opacity: 0; 
    animation: visualTextFade 1.2s ease forwards; }
@keyframes visualTextFade { to { opacity: 1; } }

/* 타이틀 */
.title_box { display: flex; justify-content: space-between; align-items: flex-start; gap: 80px; width: 100%; padding: 100px 300px; box-sizing: border-box; background: #151515; color: #fff; }
.title_box .title_con { flex: 0 0 520px; }
.title_box .sale_con { margin: 0 0 42px; font-size: 30px; font-weight: 600; letter-spacing: -0.4px; text-align: left; }
.title_box .typing_title { font-size: 70px; line-height: 1.2em; font-weight: 600; letter-spacing: -2px; text-align: left; word-break: keep-all; }
.title_box .typing_title .char { display: inline-block; opacity: 0; filter: blur(6px); transform: translateY(10px); }
.title_box .typing_title.play .char { animation: softReveal 1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
@keyframes softReveal { to { opacity: 1; filter: blur(0); transform: translateY(0); } }
.title_box .sub_title_con { flex: 1; max-width: 760px; align-self: stretch; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; text-align: right; }
.title_box .sub_copy { font-size: 19px; line-height: 1.7em; font-weight: 300; letter-spacing: -0.4px; word-break: keep-all; }
.title_box .lookbook_link { margin: 22px 0 0; font-size: 22px; font-weight: 600; line-height: 1; }
.title_box .lookbook_link a { display: inline-block; color: #fff; text-decoration: none; }
.title_box .sale_con, .title_box .sub_copy, .title_box .lookbook_link { opacity: 0; transform: translateY(14px); transition: opacity 0.8s ease, transform 0.8s ease; }
.title_box .show { opacity: 1; transform: none; }

/* 상단 sticky 내비 */
#sticky_section { display: flex; justify-content: center; position: sticky; top: 0; width: 100%; background: #000; z-index: 90; }
#sticky_section div { width: 12%; height: 70px; line-height: 70px; text-align: center; }
#sticky_section div a { display: block; font-size: 22px; color: #8a8a8a; text-decoration: none; transition: color .25s; }
#sticky_section div.on a { color: #fff; font-weight: 500; }

/* 이벤트 */
#event_section { width: 100%; padding: 120px 0; }
#event_section .event_inner { width: 1000px; margin: 0 auto; color: #000; text-align: left; }
#event_section .event_head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 28px; }
#event_section .event_title { font-size: 26px; font-weight: 700; letter-spacing: -0.5px; }
#event_section .event_period { font-size: 14px; color: #313131; font-weight: 400;}
#event_section .event_period span { margin: 0 8px; color: #ccc; }
#event_section .event_list::before { content: ''; display: block; height: 1px; background: #000; transform: scaleX(0); transform-origin: left; transition: transform .8s ease .1s; }
#event_section .event_list.is_in::before { transform: scaleX(1); }
#event_section .event_row { display: flex; align-items: center; gap: 32px; padding: 36px 0; border-bottom: 1px solid #e5e5e5; }
#event_section .event_vis { flex: none; width: 140px; height: 140px; border-radius: 8px; overflow: hidden; background: #f4f4f4; }
#event_section .event_vis a { display: block; height: 100%; }
#event_section .event_vis img { display: block; width: 100%; height: 100%; object-fit: cover; }
#event_section .vis_black { display: flex; align-items: center; justify-content: center; background: #000; color: #fff; font-size: 40px; font-weight: 800; letter-spacing: -2px; }
#event_section .event_txt { flex: 1; }
#event_section .event_name { margin-bottom: 10px; font-size: 26px; font-weight: 700; letter-spacing: -0.8px; }
#event_section .event_sub { font-size: 18px; line-height: 1.8em; color: #555; }
#event_section .sub_item { display: inline-block; margin-right: 28px; }
#event_section .sub_item:last-child { margin-right: 0; }
#event_section .event_tag { display: inline-block; margin-right: 8px; padding: 4px 8px; background: #000; color: #fff; font-size: 15px; font-weight: 600; letter-spacing: 0.5px; vertical-align: 1px; }
#event_section .event_tag.tag_line { background: #fff; color: #000; border: 1px solid #000; }
#event_section .event_btn { display: block; flex: none; width: 220px; height: 62px; line-height: 62px; background: #000; color: #fff !important; text-align: center; font-size: 15px; 
    font-weight: 600; border-radius: 6px; text-decoration: none; }
#event_section .event_btn.btn_two { display: flex; flex-direction: column; justify-content: center; line-height: 1.2; padding: 0; }
#event_section .event_btn.btn_two small { display: block; margin-top: 6px; font-size: 12px; font-weight: 400; font-variant-numeric: tabular-nums; }
/* 버튼 색상 */
#event_section .event_btn.btn_coupon { background: #000; color: #fff !important; }
#event_section .event_btn.btn_coupon small { color: #bbb; }
#event_section .event_btn.btn_comment { background: #393931; color: #fff !important; }
#event_section .event_btn.is_off { background: #e6e6e6; color: #999 !important; pointer-events: none; }
#event_section .event_btn.is_off small { color: #aaa; }
#event_section .event_winner { gap: 18px; padding: 22px 24px; background: #f7f7f7; border-bottom: 0; border-radius: 0 0 8px 8px; }
#event_section .winner_label { font-size: 15px; font-weight: 600; letter-spacing: 1px; }
#event_section .winner_names { font-size: 15px; }
#event_section .event_foot { margin-top: 22px; text-align: right; }
#event_section .event_notice { font-size: 16px; color: #000; text-underline-offset: 4px; cursor: pointer; }
#event_section .event_head, #event_section .event_row, #event_section .event_foot { opacity: 0; transform: translateY(14px); transition: opacity .8s ease, transform .8s ease; }
#event_section.is_in .event_head, #event_section.is_in .event_row, #event_section.is_in .event_foot { opacity: 1; transform: none; }

/* 유의사항 모달 */
.notice-layer { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.5); z-index: 999; }
.notice-layer.active { display: flex; }
.modal-content { position: relative; width: 90%; max-width: 480px; padding: 40px 30px; background: #fff; color: #000; }
.modal-content h3 { margin-bottom: 16px; font-size: 20px; font-weight: 600; text-align: center; }
.modal-content ul { list-style: none; padding-left: 0; }
.modal-content li { margin: 8px 0; font-size: 14px; line-height: 1.6; text-align: left; }
.modal-content li::before { content: "- "; margin-right: 6px; }
.close-modal { position: absolute; top: 18px; right: 18px; border: 0; background: none; font-size: 28px; color: #000; cursor: pointer; }

/* 에디토리얼 */
#editorial { overflow: hidden; width: 100%; }
#editorial ul { display: flex; flex-wrap: wrap; width: 70%; margin: 0 auto; padding: 0; list-style: none; }
#editorial ul li { width: 50%; padding: 0 5px 10px; box-sizing: border-box; opacity: 0; transition: opacity .9s ease; }
#editorial ul li.is_in { opacity: 1; }
#editorial ul li img { display: block; width: 100%; }
#editorial .photo { position: relative; overflow: hidden; }
#editorial .photo > a:not(.tip) { display: block; }
#editorial .tip { --nm: 15px; --pr: 14px; position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: block; height: auto; padding: 110px 60px 15px 16px; 
    box-sizing: border-box; text-align: left; color: #fff; text-decoration: none;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.034) 16%, rgba(0,0,0,.123) 29%, rgba(0,0,0,.246) 41%, rgba(0,0,0,.385) 53%, rgba(0,0,0,.519) 65%, rgba(0,0,0,.627) 78%, rgba(0,0,0,.7) 100%);
    opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .45s ease, transform .45s ease; }
#editorial .tip.on { opacity: 1; transform: none; pointer-events: auto; }
#editorial .tip_nm { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--nm); letter-spacing: -.02em; line-height: 1.45; }
#editorial .tip_pr { display: block; font-size: var(--pr); font-weight: 600; letter-spacing: -.01em; line-height: 1.5; }
#editorial .tip_off { margin-left: 7px; color: #FF5A5A; }
#editorial .tip.md { --nm: 13px; --pr: 12px; padding: 80px 50px 12px 12px; }
#editorial .tip.sm { --nm: 11px; --pr: 12px; padding: 58px 40px 10px 10px; }
#editorial .tip_btn { --s: 30px; --a: 16px; --t: 2px; position: absolute; right: 16px; bottom: 11px; z-index: 4; width: var(--s); height: var(--s); padding: 0; border: 0; background: none; 
    cursor: pointer;
    opacity: 0; pointer-events: none; -webkit-appearance: none; appearance: none; filter: drop-shadow(0 1px 3px rgba(0,0,0,.55)); transition: opacity .45s ease, transform .35s ease; }
#editorial .tip_btn.show { opacity: 1; pointer-events: auto; }
#editorial .tip_btn.open { transform: rotate(45deg); }
#editorial .tip_btn:before, #editorial .tip_btn:after { content: ""; position: absolute; left: 50%; top: 50%; width: var(--a); height: var(--t); margin: calc(var(--t) / -2) 0 0 calc(var(--a) / -2); 
background: #fff; }
#editorial .tip_btn:after { width: var(--t); height: var(--a); margin: calc(var(--a) / -2) 0 0 calc(var(--t) / -2); }
#editorial .tip_btn.md { --s: 26px; --a: 14px; right: 13px; bottom: 8px; }
#editorial .tip_btn.sm { --s: 22px; --a: 12px; right: 10px; bottom: 8px; }
#editorial .editorial_more { margin-top: 40px; text-align: center; }
#editorial .btn_editorial_more { display: inline-block; width: 480px; height: 70px; line-height: 68px; box-sizing: border-box; background: #fff; border: 1px solid #d9d9d9; color: #000 !important; 
    font-size: 20px; text-decoration: none; }

/* 상품 */
#pd_section { width: 100%; }
#pd_section .section_title { margin: 130px 0 0; font-size: 34px; font-weight: 700; color: #000; text-align: center; opacity: 0; transform: translateY(14px); 
    transition: opacity 0.8s ease, transform 0.8s ease; }
#pd_section .section_title.show { opacity: 1; transform: none; }
#pd_section .pd_box { overflow: hidden; width: 100%; padding: 100px 100px 40px; box-sizing: border-box; }
#pd_section .pd_box ul { display: flex; flex-wrap: wrap; margin: 0 -12px; padding: 0; list-style: none; }
#pd_section .pd_box li { width: 25%; padding: 0 12px 48px; box-sizing: border-box; }
#pd_section .item_link { display: block; color: #222; text-decoration: none; }
#pd_section .thumb_box { overflow: hidden; background: #f3f3f3; }
#pd_section .thumb_box img { display: block; width: 100%; }
#pd_section .thumb_box img.is-loading { min-height: 300px; }
#pd_section .is_soldout .thumb_box img { filter: grayscale(1); }
#pd_section .is_soldout .prd_price { color: #999; letter-spacing: 1px; }
#editorial .tip.is_soldout .tip_pr { color: #bbb; letter-spacing: 1px; }
#pd_section .info_box { display: block; margin-top: 22px; padding-top: 18px; border-top: 1px solid #bdbdbd; text-align: left; }   /* display 명시 = 몰 .info_box(flex) 되돌리기 */
#pd_section .title_row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
#pd_section .prd_name { flex: 1; font-size: 16px; line-height: 1.35em; font-weight: 500; color: #4a4a4a; text-transform: uppercase; word-break: keep-all; letter-spacing: -0.2px; }
#pd_section .prd_color { flex: none; font-size: 17px; font-weight: 500; color: #4a4a4a; white-space: nowrap; letter-spacing: -0.2px; }
#pd_section .prd_price { font-size: 16px; font-weight: 500; color: #111; letter-spacing: -0.2px; }
#pd_section .prd_price del { margin-left: 8px; font-weight: 400; color: #a6a6a6; }
#pd_section .prd_price em { margin-left: 6px; font-style: normal; font-weight: 600; color: #d23b2f; }

/* 전 상품 보기 */
.btn_box_ey { margin: 50px 0; text-align: center; }
.brand_direct { display: inline-block; width: 480px; height: 70px; line-height: 70px; background: #151515; color: #fff !important; font-size: 20px; }

@media(max-width: 750px){
/* 비주얼 */
#visual_section .vd_subtext h1 { top: 3%; left: 4%; font-size: 1.4em; }
#visual_section video.pc_ey { display: none; }
#visual_section video.mo_ey { display: block; }

/* 타이틀 */
.title_box { flex-direction: column; gap: 50px; padding: 100px 45px; }
.title_box .title_con { flex: none; width: 100%; }
.title_box .sale_con { margin-bottom: 20px; line-height: 1.2em; }
.title_box .typing_title { font-size: 100px; line-height: 1.14; letter-spacing: -1.5px; }
.title_box .sub_title_con { width: 100%; max-width: none; }
.title_box .sub_copy { font-size: 24px; line-height: 1.8em; }
.title_box .lookbook_link { margin-top: 26px; font-size: 34px; }

/* 상단 sticky 내비 */
#sticky_section { top: 100px; }
#sticky_section div { width: 33.33%; }
#sticky_section div a { font-size: 25px; }

/* 이벤트 */
#event_section .event_inner { width: 100%; padding: 0 30px; box-sizing: border-box; }
#event_section .event_head { flex-direction: column; align-items: center; gap: 20px; margin-bottom: 60px; text-align: center; }
#event_section .event_title { font-size: 44px; }
#event_section .event_period { font-size: 26px; }
#event_section .event_row { display: block; padding: 40px 0; }
#event_section .event_vis { display: none; }
#event_section .event_row:nth-child(2) .event_vis { display: block; width: 100%; height: 400px; margin-bottom: 26px; border-radius: 12px; }
#event_section .event_row:nth-child(2) .event_vis img { object-fit: contain; }
#event_section .event_name { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; font-size: 42px; }
#event_section .event_row:first-child .event_name::before,
#event_section .event_tag { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 130px; height: 52px; padding: 0 18px; margin-right: 10px; box-sizing: border-box; font-size: 25px; font-weight: 600; letter-spacing: 0; border-radius: 6px; vertical-align: middle; }
#event_section .event_row:first-child .event_name::before { content: attr(data-rate); background: #000; color: #fff; font-weight: 800; }
#event_section .event_sub { font-size: 28px; line-height: 1.6; }
#event_section .sub_item { display: flex; align-items: center; margin: 0 0 20px; }
#event_section .event_btn { width: 100%; height: 108px; line-height: 108px; margin-top: 24px; font-size: 30px; border-radius: 10px; }
#event_section .event_btn.btn_two { line-height: 1.2; }
#event_section .event_btn.btn_two small { margin-top: 8px; font-size: 22px; }
#event_section .event_winner { display: flex; align-items: center; gap: 16px; padding: 26px 30px; }
#event_section .winner_label { font-size: 25px; }
#event_section .winner_names { font-size: 26px; line-height: 1.5; }
#event_section .event_foot { margin-top: 30px; }
#event_section .event_notice { font-size: 26px; }

/* 유의사항 */
.notice-layer { z-index: 9999; }
.modal-content { width: 100%; max-width: 600px; padding: 35px 40px; }
.modal-content h3 { margin-bottom: 20px; font-size: 28px; }
.modal-content li { margin: 7px 0; font-size: 24px; word-break: auto-phrase; }
.close-modal { top: 22px; right: 24px; font-size: 60px; }

/* 에디토리얼 */
#editorial ul { width: 100%; }
#editorial ul li.one { width: 100%; }
#editorial .tip { --nm: 26px; --pr: 25px; padding: 150px 90px 22px 22px; }
#editorial .tip.md { --nm: 25px; --pr: 25px; padding: 120px 70px 18px 18px; }
#editorial .tip.sm { --nm: 25px; --pr: 25px; padding: 90px 56px 14px 14px; }
#editorial .tip_btn { --s: 46px; --a: 26px; --t: 3px; right: 22px; bottom: 18px; }
#editorial .tip_btn.md { --s: 40px; --a: 22px; right: 16px; bottom: 14px; }
#editorial .tip_btn.sm { --s: 34px; --a: 18px; right: 12px; bottom: 12px; }
#editorial .editorial_more { margin-top: 30px; }
#editorial .btn_editorial_more { width: 690px; height: 85px; line-height: 83px; font-size: 26px; }

/* 상품 */
#pd_section .section_title { margin-top: 100px; font-size: 52px; }
#pd_section .pd_box { padding: 100px 20px; }
#pd_section .pd_box ul { margin: 0 -8px; }
#pd_section .pd_box li { width: 50%; padding: 0 8px 28px; }
#pd_section .info_box { display: flex; flex-direction: column; align-items: flex-start; margin-top: 14px; padding-top: 12px; }
#pd_section .title_row { flex-direction: column; gap: 8px; margin-bottom: 10px; }
#pd_section .prd_name, #pd_section .prd_color { font-size: 24px; }
#pd_section .prd_price { font-size: 26px; }
#pd_section .prd_price del, #pd_section { font-size: 22px; }
#pd_section .prd_price del, #pd_section .prd_price em { font-size: 26px; }

/* 전 상품 보기 */
.btn_box_ey { margin: 0; }
.brand_direct { width: 690px; height: 85px; line-height: 85px; font-size: 26px; }
}
