@charset "UTF-8";
/*  메인 페이지 스타일 파일입니다. */
.main {
  position: relative;
  min-width: 1200px;
}
.main > .main__row--full:not(:has(img)) {
  display: none;
}
.main__row {
  display: flex;
  justify-content: center;
  align-items: start;
  flex-direction: row;
  max-width: 1200px;
  width: 100%;
  height: 100%;
  margin: auto;
}
.main__row-display {
  width: 100%;
}
.main__row--full {
  min-width: 1200px;
  max-width: 100%;
  display: block;
  margin-block-end: 120px;
}
.main__row--full .swiper {
  min-width: 1200px;
}
.main__row--full .skin-banner__skeleton {
  height: 500px;
}
.main__row--banner-grid:not(:has(img)) {
  display: none;
}
.main__row--banner-grid {
  display: grid;
  align-items: start;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 440px 200px;
  gap: 20px 24px;
  margin-block-end: 120px;
}
.main__row--banner-single:not(:has(img)) {
  display: none;
}
.main__row--banner-single {
  width: 100%;
  display: block;
  margin-block-end: 120px;
}

.skin-banner--main-left ~ .main__row-display {
  flex: 1;
  min-width: calc(816px - 24px);
}

figure[class^=skin-banner--]:not(:has(img)) {
  display: 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) } 
}
[class*="__trans"] { opacity:0; }
.motion .__transXL { opacity:0; animation:TransXL .8s forwards; }
.motion .__transXR { opacity:0; animation:TransXR .8s forwards; }
.motion .__transYS { opacity:0; animation:TransYS .8s 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; 
}


/*========================================================================
메인 레이아웃
========================================================================*/
/* 메인 상단 고정 */
.shopby-header { min-height:0; }
#header:not(.fixed) .header-wrap { position:absolute; top:0; left:0; width:100%; border-bottom:0; z-index:100; }
.header__bottom-line { background:none; }

.main-wrap { padding:0 0 100px; }
.main-inner { position:relative; width:1200px; padding:0 0; margin:0 auto; }


/*========================================================================
메인 비주얼
========================================================================*/
.main-visual { overflow:hidden; margin:0; }
.main-visual .swiper { max-width:1440px; width:100%; overflow:visible; }
.main-visual .swiper .skin-banner__slider-nav-warp { width:100%; }
.main-visual .swiper-slide { position:relative; width:1440px !important; padding:0 20px; }
.main-visual .swiper-slide.swiper-slide-next + .swiper-slide:not(.swiper-slide-prev) { left:-300%; }
.main-visual .swiper-slide.swiper-slide-next:first-child { left:300%; }

.main-visual .swiper-slide > a { display:block; position:relative; width:100%; height:100%;  border-radius:0 0 120px 0; 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; left:auto; right:100px;  width:auto; padding:11px 17px; color:#fff; font-size:14px; font-weight:700; line-height:1; border-radius:50px; background:rgba(98, 98, 98, 0.54); }
.main-visual .swiper .swiper-pagination > strong { position:relative; padding:0 0 0 8px; margin:0 0 0 8px; color:rgba(255, 255, 255, 0.5); }
.main-visual .swiper .swiper-pagination > strong::before { content:""; position:absolute; top:4px; left:0; width:1px; height:10px; background:rgba(255, 255, 255, 0.5); }

/* 제어 버튼 */
.main-visual .swiper .swiper-button-prev::after, 
.main-visual .swiper .swiper-button-next::after { display:none; }
.main-visual .swiper .swiper-button-next, 
.main-visual .swiper .swiper-button-prev { width:17px; height:36px; margin-top:-18px; background:no-repeat; background-size:100% auto; }
.main-visual .swiper .swiper-button-prev { left:120px; background-image:url("/assets/images/main_prev.png"); }
.main-visual .swiper .swiper-button-next { right:120px; background-image:url("/assets/images/main_next.png"); }

/* 비주얼 타이틀 */
.visual-title { position:absolute; top:50%; left:50%; width:920px; transform:translate(-50%,-50%); }
.visual-title em { display:block; font-size:20px; font-weight:400; }
.visual-title h3 { font-size:48px; margin:0 0 20px; font-weight:600; line-height:1.3; letter-spacing:-1px;}
.visual-title span { margin:20px 0 0; display:inline-flex; align-items:center; height:49px; padding:0 32px; color:#424242; font-size:16px; font-weight:400; border:1px solid #fff; border-radius:50px; }

.main-visual [data-swiper-slide-index="4"] .visual-title > * ,
.main-visual [data-swiper-slide-index="0"] .visual-title > *,
.main-visual [data-swiper-slide-index="1"] .visual-title > * { color:#000; },
.main-visual [data-swiper-slide-index="1"] .visual-title span {border-color: #000 !important;}



/* 비주얼 타이틀 모션 */
.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-quick-menu { margin:60px 0 0;  }
.main-quick-menu ul { display:flex; justify-content:space-between; }
.main-quick-menu ul li img { border-radius:999px; }
.main-quick-menu p { margin:12px 0 0; color:#424242; font-size:16px; line-height:1; text-align:center; word-break:break-all; }


/*========================================================================
메인 컨텐츠 영역
========================================================================*/
/* box 간격 */
.main-box { margin:100px 0 0; }
.main-box2 { margin:80px 0 0; }
.main-box3 { margin:100px 0 0; }
.main-box4 { margin:100px 0 0; }
.main-box5 { margin:100px 0 0; }
.main-box6 { margin:100px 0 0; }
.main-box7 { margin:100px 0 0; }
.main-box8 { margin:100px 0 0; }
.main-box9 { margin:100px 0 0; }

/* 메인 타이틀 */
.product-section__title-wrap,
.main-title { position:relative; margin:0 0 40px; line-height:1; text-align:center; }
.product-section__title-wrap h2,
.main-title h3 { display:inline-flex; padding:0; color:var(--basic-color); font-size:32px; font-weight:600; line-height:1; }
.product-section__title-wrap p,
.main-title p { margin:19px 0 0; color:#757575; font-size:14px; font-weight:400; line-height:1.36; }

/* 타이틀 더보기 */
.display-product__more,
.main-title a { position:absolute; top:10px; right:0; padding:0 14px 0 0; color:#424242; font-size:16px; font-weight:300; background:url("/assets/images/main_more.png") no-repeat 100% 50%; background-size:7px auto; }
.display-product__more .ico { display:none; }

/* 상품 공통 */
.display-product__contents { margin:0; }

/* 배너 + 상품 진열 */
.new-prd > div { display:flex; gap:40px; } 
.new-prd .prd { width:480px; }
.new-prd .product-section__title-wrap { margin:0; text-align:left; }
.new-prd .display-product { display:flex; flex-direction:column; }
.new-prd .display-product__contents { margin:40px 0 0; }
.new-prd .display-product__contents > div:nth-child(n+3) { display:none; }
.new-prd .display-product__contents { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:0 20px; }

/* 스페셜 상품 */
.special-prd { width:100%; max-width:100%; overflow:hidden; }
.special-prd .main-inner { max-width:1718px; width:100%; min-height:610px; height:var(--main-prd-slide-height); margin:0 auto; overflow:hidden; }
.special-prd .thumb-PRODUCT_MOVE .swiper-wrapper { display:flex; align-items:flex-start; width:100%; margin:0; }
.special-prd .thumb-PRODUCT_MOVE .swiper-slide { position:relative; width:auto; margin:0; }
.special-prd .thumb-item { min-width:302px; width:302px; margin:64px auto 0; padding:0; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; overflow:visible; transition:all 0.4s ease 0s; }
.special-prd .thumb-item .thumb-item__media { position:relative; width:302px; height:302px; margin:0; overflow:hidden; transition:all 0.4s ease 0s; }
.special-prd .thumb-item .thumb-item__info { width:100%; transition:all 0.4s ease 0s; }
.special-prd .swiper { overflow:visible; }
.special-prd .swiper .swiper-slide-active { position:relative; z-index:1; }
.special-prd .swiper .swiper-slide .thumb-item { transform:translateX(-104px); }
.special-prd .swiper .swiper-slide-prev .thumb-item { transform:translateX(-84px); }
.special-prd .swiper .swiper-slide-active .thumb-item { margin-top:0; transform:translateX(0); }
.special-prd .swiper .swiper-slide-next .thumb-item { transform:translateX(84px); }
.special-prd .swiper .swiper-slide-next ~ .swiper-slide .thumb-item { transform:translateX(104px); }
.special-prd .swiper .swiper-slide-active .thumb-item {}
.special-prd .swiper .swiper-slide-active .thumb-item .thumb-item__media { width:430px; height:430px; margin-top:0; }
.special-prd .swiper .swiper-slide-active .thumb-item .thumb-item__info { width:430px; }
.special-prd .display-product :is(.swiper-button-prev, .swiper-button-next) { display:none; }
/* 할인율 */
.special-prd .product-thumb__immediately-percent { position:absolute; top:20px; left:20px; width:54px; line-height:54px; margin:0; color:#fff; font-size:16px; font-weight:700; border-radius:50%; background:var(--point-color); text-align:center; transition:all 0.4s ease 0s; }
.special-prd .swiper-slide-active .product-thumb__immediately-percent { width:72px; line-height:72px; font-size:20px; }

/* 동영상 배너 */
.main-video { width:100%; overflow:hidden; }
.main-video .main-inner { max-width:1718px; width:100%; margin:0 auto; }
.main-video .bn { display:block; overflow:hidden; }
.main-video .bn img { transition:all 1s cubic-bezier(.32,.94,.6,1); }
.main-video .bn img:hover { transform:scale(1.1);}
.main-video .bn a::before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; }
.main-video .swiper-container { overflow:visible; }
.main-video .swiper-slide { display:flex; align-items:center; position:relative; width:1410px; }
.main-video .swiper-slide .title-box { padding:0 0 0 36px; }
.main-video .swiper-slide .title-box h3 { color:var(--basic-color); font-size:30px; font-weight:600; line-height:1.36; }
.main-video .swiper-slide .title-box p { margin:20px 0 0; color:#757575; font-size:14px; font-weight:300; line-height:1.4; }
.main-video .swiper-slide .title-box em { display:inline-flex; margin:25px 0 0; padding:15px 32px; color:#424242; font-size:16px; font-weight:400; line-height:1; border:1px solid #9E9E9E; border-radius:999px; }
/* 타이틀 모션 */
.main-video .swiper-slide .title-box > * { overflow:hidden; }
.main-video .swiper-slide .title-box span { display:block; opacity:0; transition:all 1s; }
.main-video .swiper-slide.swiper-slide-active .title-box span { backface-visibility:hidden; animation:TransYS 0.6s ease-out both; opacity:1; }
.main-video .swiper-slide.swiper-slide-active .title-box > *:first-child > span { animation-delay:0.3s; }
.main-video .swiper-slide.swiper-slide-active .title-box > *:nth-child(2) > span { animation-delay:0.6s; }
.main-video .swiper-slide .title-box > *:nth-child(3) { opacity:0; transition:all 1s; }
.main-video .swiper-slide.swiper-slide-active .title-box > *:nth-child(3) { opacity:1; transition-delay:0.7s; }
/* 유튜브 */
#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:1200px; height:532px; top:50%; left:50%; margin-left:-600px; margin-top:-266px; z-index:401;}

/* 베스트 */
.best-prd .thumb-GALLERY { gap:100px 20px; }

/*  리뷰 */
.main-review { position:relative; }
.main-review .review-list > ul { display:flex; gap:22.5px; }
.main-review .review-list > ul > li { width:calc((100% - 45px)/ 3); box-sizing:border-box; transition:all .3s ease;}
.main-review .review-list > ul > li:hover { transform:translateY(-10px); }
.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:13px 0 0; }
.main-review .board-reviews-item__content-text { display:-webkit-box; color:#757575; font-size:16px; font-weight:300; line-height:1.3; 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:26px; left:17px; right:17px; padding:10px 18px; background:rgba(255, 255, 255, 0.6); border-radius:10px; }
.main-review .board-reviews-item__product-info img { width:80px; height:80px; }
.main-review .board-reviews-item__product-review-info { width:calc(100% - 80px); padding:0 0 0 18px; color:var(--basic-color); font-size:16px; font-weight:300; line-height:1.3; box-sizing:border-box; }
.main-review .product-review-info__product-name { color:var(--basic-color); font-size:16px; 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:91px; height:27px; margin:0 auto 10px; padding:0; background:url("/assets/images/review_star_bg.png") no-repeat 0 0; text-indent:-9999px; }
.main-review .board-reviews-rate span { display:block; height:27px; background:url("/assets/images/review_star5.png") no-repeat 0 0; }
/* 작성자 감춤 */
.main-review .board-reviews-item__write { display:none; }

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

