@charset "UTF-8";
/*  메인 페이지 스타일 파일입니다. */

/*========================================================================
메인 상단
========================================================================*/
/* 상단 */
.header { position:absolute; top:0; left:0; width:100%; background:none; }


/*========================================================================
메인 모션
========================================================================*/
@keyframes TransXL { 
	0% { opacity:0; transform:translateX(60px) } 
	100% { opacity:1; transform:translateX(0) } 
}
@keyframes TransXR { 
	0% { opacity:0; transform:translateX(-60px) } 
	100% { opacity:1; transform:translateX(0) } 
}
@keyframes TransYS { 
	0% { opacity:0; transform:translateY(40px) } 
	100% { opacity:1; transform:translateY(0) } 
}
@keyframes FadeIn { 
	from{ opacity:0 } 
	to{ opacity:1 } 
}
.motion ._transXL { opacity:0; animation:TransXL 1s forwards; }
.motion ._transXR { opacity:0; animation:TransXR 1s forwards; }
.motion ._transYS { opacity:0; animation:TransYS 1s forwards; }
.fadeIn { opacity:0; }
.motion .fadeIn { animation:FadeIn 1s forwards; }

[class*="path-motion"] { transition-duration: 1s; transition-property: all; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-timing-function: cubic-bezier(.76,0,.24,1); }
.path-motion_ltr { clip-path:inset(0 100% 0 0); }
.path-motion_rtl { clip-path:inset(0 0 0 100%); }
.path-motion_ttb { clip-path:inset(0 0 100% 0); }
.path-motion_btt { clip-path:inset(100% 0 0 0); }

.motion [class*="path-motion"] { clip-path: inset(0 0 0 0) !important; }

/* 마스크 */
.mask-item { 
	mask-image:linear-gradient(90deg,#fff 33.333%,transparent 66.666%); 
	mask-position:100% 0; 
	mask-size:300% 100%; 
	mask-repeat:no-repeat; 
	transition:mask-position 1.5s ease; 
	transition-delay:.2s;
}
.motion .mask-item { 
	mask-position:0 0; 
}

/*========================================================================
메인 비주얼
========================================================================*/
.skin-banner { margin:0; }

.main-visual .swiper-slide { position:relative; }
.main-visual .swiper-slide > a { display:block; position:relative; width:100%; height:100%; overflow:hidden; }
.main-visual .swiper-slide > a::after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; z-index:61; }
.main-visual .swiper-slide > a img { transform:scale(1.2) rotate(0.002deg); }
.main-visual .swiper-slide.swiper-slide-active > a img { transform:scale(1) rotate(0.002deg); transition:transform 6s linear; }

/* 페이지네이션 */
.main-visual .swiper .swiper-pagination { bottom:30px; font-size:0; }
.main-visual .swiper .swiper-pagination > span { width:12px; height:2px; padding:0; margin:0 4px; background:#fff; border-radius:0; opacity:1; transition:width .3s ease; }
.main-visual .swiper .swiper-pagination .swiper-pagination-bullet-active { width:26px; background:#000; }

/* 비주얼 타이틀 */
.visual-title { position:absolute; bottom:69px; left:0; width:100%; min-height:148px; padding:0 15px; text-align:left; box-sizing:border-box; }
.visual-title em { display:block; color:#000; font-size:16px; font-weight:400; }
.visual-title h3 { margin:15px 0 0; color:var(--basic-color); font-size:26px; font-weight:600; line-height:1.2; letter-spacing:-0.7px; }
.visual-title span { position:relative; display:inline-block; height:38px; line-height:36px; margin:15px 0 0; padding:0 24px; color:#424242; font-size:14px; font-weight:400; border:1px solid #BDBDBD; border-radius:50px; box-sizing:border-box; }

.main-visual [data-swiper-slide-index="0"] .visual-title > * { color:#000; },
.main-visual [data-swiper-slide-index="1"] .visual-title > * { color:#fff; },
.main-visual [data-swiper-slide-index="2"] .visual-title > * { color:#000; },
.main-visual [data-swiper-slide-index="3"] .visual-title > * { color:#000; }

/* 비주얼 타이틀 모션 */
.main-visual .swiper-slide .visual-title > * { opacity:0; transition:all 1s; }
.main-visual .swiper-slide.swiper-slide-active .visual-title > * { backface-visibility:hidden; animation:TransYS 1s ease-out both; opacity:1; }
.main-visual .swiper-slide.swiper-slide-active .visual-title > *:first-child { animation-delay:0.1s; }
.main-visual .swiper-slide.swiper-slide-active .visual-title > *:nth-child(2) { animation-delay:0.4s; }
.main-visual .swiper-slide.swiper-slide-active .visual-title > *:nth-child(3) { animation-delay:0.7s; }


/*========================================================================
메인 컨텐츠
========================================================================*/
.main-wrap { padding:0 0 80px; }

/* 타이틀 공통 */
.product-section__title,
.main-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; padding:0 15px; text-align:left; color:var(--basic-color); font-size:21px; font-weight:600; line-height:1; }
.main-title > strong { color:var(--point-color); } 
/* 타이틀 더보기 */
.product-section { position:relative; }
.product-section__more { position:absolute; top:1px; right:15px; gap:0; }
.product-section__more,
.main-title > a { float:right; padding:3px 10px 3px 0; margin:0; color:#424242; font-size:14px; font-weight:300; line-height:1; background:url("/assets/images/main_more.png") no-repeat 100% 5px; background-size:5px auto; border:0; }

/* 메인 간격 */
.main-box { margin:38px 0 0; }
.main-box2 { margin:53px 0 0; }
.main-box3 { margin:53px 0 0; }
.main-box4 { margin:53px 0 0; }
.main-box5 { margin:53px 0 0; }
.main-box6 { margin:53px 0 0; }
.main-box7 { margin:53px 0 0; }
.main-box8 { margin:53px 0 0; }

/* 카테고리 배너 슬라이드 */
.main-category-slider { }
.main-category-slider .swiper img { width:100%; max-width:84px; border-radius:999px; }
.main-category-slider p { margin:14px 0 0; color:#424242; font-size:11px; line-height:1; word-break:break-all; text-align:center; }

/* 배너 + 상품진열 */
.new-prd [slot="displaySectionProducts"] > section { display:flex; justify-content:flex-end; align-items:flex-end; }
.new-prd :is(.thumb-GALLERY) { display:flex; width:calc(100% - 70px); padding:0; }
.new-prd .thumb-item__img img { opacity:.001; transform:scale(1.1); transition:all 1s cubic-bezier(.32,.94,.6,1); transition-delay:.2s;}
.new-prd .btm-box.motion .thumb-item__img img { opacity:1; transform:scale(1);}
.new-prd .thumb-fab,
.new-prd .thumb-item__info,
.new-prd .product-section__title,
.new-prd .product-section__more { display:none; }
.new-prd .btm-box { padding:38px 15px 34px; background:var(--basic-color); }
.new-prd .btm-box h4 { color:#fff; font-size:23px; font-weight:600; line-height:1; }
.new-prd .btm-box p { margin:12px 0 30px; color:#E0E0E0; font-size:12px; font-weight:200; line-height:1.37; }
.new-prd .swiper-pagination { position:absolute; bottom:38px; left:14px; width:auto; color:#757575; font-size:17px; font-weight:600; line-height:1; }
.new-prd .swiper-pagination .current { position:relative; display:inline-block; min-width:21px; color:#fff; }
.new-prd .swiper-pagination .total::before { content:""; display:inline-block; margin:0 0 0 6px; padding:0 0 0 6px; height:11px; border-left:1px solid #757575; }
.new-prd .swiper-container-fade .swiper-slide { transition-property:opacity; }
.new-prd .swiper-container-fade .swiper-slide.swiper-slide-active { z-index:1; }
.new-prd .bn img { width:100%; }

/* 스페셜 상품  */
.special-prd .swiper-slide .thumb-item__img { transition:transform .3s; }
.special-prd .swiper-slide-active .thumb-item__img { transform:scale(1); }
.special-prd .swiper-slide-next .thumb-item__img { transform:scale(0.85) translateX(-8%); }
.special-prd .swiper-slide-prev .thumb-item__img { transform:scale(0.85) translateX(8%); }
.special-prd .swiper-slide .thumb-item__info { margin-top:-8%; }
.special-prd .swiper-slide-active .thumb-item__info { min-height:110px; margin-top:0; }

/* 중앙 띠 배너 */
.wide-bn { margin:0; }
.wide-bn img { width:100%; }
.wide-bn.line-bn { margin:0 15px; }
.wide-bn.line-bn img { border-radius:11px; }

/* 동영상 배너 */
.main-video { padding:0 35px; }
.main-video > ul > li { position:relative; }
.main-video .bn { display:block; overflow:hidden; }
.main-video .bn img { width:100%; }
.main-video .bn a::before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; }
.main-video .title-box { padding:14px 0 0; }
.main-video .title-box h3 { color:var(--basic-color); font-size:21px; font-weight:600; line-height:1.36; }
.main-video .title-box p { margin:11px 0 0; color:#757575; font-size:12px; font-weight:300; line-height:1.4; }
/* 유튜브 */
#moviePlayer { position:relative; }
#moviePlayer .movieBox {position: fixed; top:0; left:0; width:100%; height:100%; z-index:400; display:none; background:#000; opacity:0.8; filter:alpha(opacity=80);}
#moviePlayer iframe {display:none; position:fixed; width:100%; height:200px; top:50%; left:50%; transform:translate(-50%, -50%); z-index:401;}

/* 리뷰 */
.main-review { position:relative; overflow:hidden; }
.main-review .review-list > ul { display:flex; }
.main-review .review-list > ul > li { width:calc(100% / 3); box-sizing:border-box; }
.main-review .review-list > ul > li .board-reviews-item__top { position:relative; }
.main-review .review-list > ul > li .board-reviews-item__top-img { position:relative; height:0; padding-top:100%; }
.main-review .review-list > ul > li .board-reviews-item__top-img img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }
.main-review .review-list > ul > li:nth-child(n+4){ display:none; }
/* 내용 */
.main-review .board-reviews-item__content { position:relative; padding:10px 0 0; }
.main-review .board-reviews-item__content-text { display:-webkit-box; color:#757575; font-size:11px; font-weight:300; line-height:1.5; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; }
/* 상품 */
.main-review .board-reviews-item__product-info { display:flex; align-items:center; position:absolute; bottom:17px; left:8px; right:8px; padding:8px 15px; background:rgba(255, 255, 255, 0.6); border-radius:10px; }
.main-review .board-reviews-item__product-info img { width:43px; height:43px; }
.main-review .board-reviews-item__product-review-info { width:calc(100% - 43px); padding:0 0 0 8px; line-height:1.3; box-sizing:border-box; }
.main-review .product-review-info__product-name { color:var(--basic-color); font-size:11px; font-weight:300; line-height:1.3; display:-webkit-box; width:100%; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word; }
/* 별점 */
.main-review .board-reviews-rate { display:inline-block; vertical-align:middle; width:68px; height:14px; margin:0 0 5px; padding:0; background:url("/assets/images/review_star_bg.png") no-repeat 0 0; background-size: auto 100%; text-indent:-9999px; }
.main-review .board-reviews-rate span { display:block; height:14px; background:url("/assets/images/review_star5.png") no-repeat 0 0; background-size: auto 100%; }
/* 작성자 감춤 */
.main-review .board-reviews-item__write { display:none; }


/* 인스타그램 */
.insta { margin:53px 0 0; }
.insta .instagram-feed__heading { display:none; }
.insta .instagram-feed__contents > figure:nth-child(n+5) { display:none; }
.insta .instagram-feed__contents { grid-template-columns: repeat(2, 1fr); gap:5px; margin:0; padding:0 15px; }
.insta .instagram-feed__contents > figure:nth-child(n+5) { display:none; }
.insta .instagram-feed__contents .instagram-feed__media { aspect-ratio: auto; }
.insta .instagram-feed__contents .instagram-feed__media img { width:100%; height:auto; aspect-ratio: auto; border-radius:0; }