/* BASIC css start */
/***** common *****/
div#wrap { padding-top: 100px; }
div#wrap #contentWrapper { max-width: none; }
#contentWrapper section { width: 100%; margin: 0 auto; padding: 80px 0; box-sizing: border-box; }
#contentWrapper section .contentWrap { max-width: 1440px; margin: 0 auto; position: relative; top: 0; left: 0; }
#header .cateHeader { display: none; }
#header.scroll .lineBanner { margin-top: 0 !important; }

/* titleWrap */
#contentWrapper .titleWrap { margin-bottom: 32px; }
#contentWrapper .titleWrap h3 { max-width: 1440px; margin: 0 auto; font-size: 28px; font-weight: 600; line-height: 31px; }
#contentWrapper .titleWrap .sub { display: block; margin-top: 4px; color: #7a7a7a; font-size: 14px; font-weight: 500; font-family: 'SUIT', sans-serif; }

/* prdList */
#contentWrapper .tabBtn > ul { display: flex; align-items: center; justify-content: center; gap: 10px; }
#contentWrapper .tabBtn a { font-size: 20px; }
#contentWrapper .tabContents { width: 100%; position: relative; top: 0; left: 0; }
#contentWrapper .tabContents .cont { width: 100%; position: absolute; top: 0; left: 0; opacity: 0; z-index: -1; }
#contentWrapper .tabContents .cont.active { height: auto; position: static; opacity: 1; z-index: 1; }
#contentWrapper .moreBtn { display: block; width: 600px; height: 64px; margin: 32px auto 0; border-radius: 18px; border: 1.5px solid #ddd; box-sizing: border-box; background-color: #fff; color: #616161; font-size: 16px; font-family: 'SUIT', sans-serif; font-weight: 700; text-align: center; line-height: 62px; }

/***** 메인 탑 배너 *****/
#contentWrapper section.topBanner { max-width: none; padding: 0; }
#contentWrapper section.topBanner .swiper-pagination-fraction { display: inline-block; width: fit-content; height: 28px; margin-right: 8%; padding: 0 12.5px; box-sizing: border-box; border-radius: 300px; bottom: 0; right: 0; left: auto; transform: translate(0, -24px); background-color: rgba(31, 31, 31, 0.4); color: var(--white); font-size: 13px; font-weight: 600; text-align: center; line-height: 28px; }
#contentWrapper section.topBanner span svg { width: 100%; height: 100%; }
#contentWrapper section.topBanner .swiper-button-prev,
#contentWrapper section.topBanner .swiper-button-next { top: 50%; background: none; }
#contentWrapper section.topBanner .swiper-button-prev { left: 10px; transform: rotate(90deg) translateX(-50%); }
#contentWrapper section.topBanner .swiper-button-next { right: 10px; transform: rotate(-90deg) translateX(50%); }

/***** 카테고리 배너 *****/
#contentWrapper .cateBanner { max-width: 1440px; }
#contentWrapper .cateBanner .titleWrap { margin-bottom: 24px; }
.cateBanner .wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 170px; padding: 0 32px; gap: 16px; border-radius: 10px; background-color: #f4f4f4; }
.cateBanner .wrap::-webkit-scrollbar { display: none; }
.cateBanner .wrap ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 16px; }
.cateBanner .wrap ul li,
.cateBanner .wrap ul li a { width: fit-content; }
.cateBanner .wrap ul li:hover a { border: 1.5px solid var(--pink); }
.cateBanner .wrap ul li a { display: flex; align-items: center; height: 56px; padding: 0 8px; gap: 0 4px; border: 1.5px solid var(--white); box-sizing: border-box; border-radius: 100px; transition: 0.2s all ease-in; background-color: var(--white); line-height: 54px; }
.cateBanner .wrap li span { display: block; font-size: 18px; font-family: 'SUIT', sans-serif; text-wrap: nowrap; }
.cateBanner .wrap ul li span.imgWrap { width: 40px; height: 40px; margin: 0 auto; border-radius: 50%; overflow: hidden; }
@media screen and (max-width: 1450px) {
    .cateBanner .wrap ul { flex-wrap: nowrap; }
}

/***** 중간 배너 *****/
#contentWrapper section .banner1,
#contentWrapper section .banner2 { display: flex; align-items: center; justify-content: center; max-width: 1440px; margin: 0 auto; gap: 0 16px; }
#contentWrapper section .banner1 img,
#contentWrapper section .banner2 img {width:100%;}
#contentWrapper section .banner1 {max-width:none; width:100%;}
/***** 롤링 상품 진열 *****/
#contentWrapper .prdSwiper .item-cont { width: 100%; overflow: hidden; }
#contentWrapper .prdSwiper .prdBox { flex-wrap: nowrap; gap: 0; }
#contentWrapper .prdSwiper .swiper-pagination { top: auto; bottom: 0; }
#contentWrapper .prdSwiper .swiper-pagination-progressbar { height: 3px; padding: 0; background-color: #d1d1d1; }
#contentWrapper .prdSwiper .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: var(--pink); }

#contentWrapper .specialPrd .swiper-pagination { top: auto; bottom: 0;}
#contentWrapper .specialPrd .swiper-pagination-progressbar { height: 3px; padding: 0; background-color: #d1d1d1; }
#contentWrapper .specialPrd .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: var(--pink); }

#contentWrapper .product-progress-swiper .swiper-pagination { top: auto; bottom: 0; position: relative; margin-top: 30px;}
#contentWrapper .product-progress-swiper .swiper-pagination-progressbar { height: 3px; padding: 0; background-color: #d1d1d1; }
#contentWrapper .product-progress-swiper .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: var(--pink); }
/* 눈여겨 본 상품 */
#contentWrapper .prdSwiper.recentList .f2s-item-name { display: block; margin-top: 30px; color: #383838; font-weight: 500; font-family: 'SUIT', sans-serif; line-height: 1.3; }
#contentWrapper .prdSwiper.recentList .swiper-slide img { border-radius: 10px; }
#contentWrapper .prdSwiper.recentList .swiper-button-next,
#contentWrapper .prdSwiper.recentList .swiper-button-prev { top: 38%; }
/* 실시간 BEST */
#contentWrapper .prdBox .tabContents .titleWrap { margin-bottom: 0; }
#contentWrapper .prdBox .tabContents .swiper-button-next,
#contentWrapper .prdBox .tabContents .swiper-button-prev { top: 30%; }
/* 기획전 */
#contentWrapper .specialPrd .contentWrap,
#contentWrapper .specialPrd .cont { width: 100%; }
#contentWrapper .specialPrd .cont { display: grid; gap: 60px 0; }
#contentWrapper .specialPrd .swiperWrap { width: 100%; gap: 0 16px; overflow: hidden; }
#contentWrapper .specialPrd .banner { width: 440px; }
#contentWrapper .specialPrd .rightWrap { width: calc(100% - 456px); }
#contentWrapper .specialPrd .swiper-container { width: 100%; height: 100%; padding-bottom: 64px; box-sizing: border-box; }
#contentWrapper .specialPrd li.swiper-slide:last-of-type { margin-right: 16px !important; }
#contentWrapper .specialPrd li.swiper-slide p.icon { display: none; }
#contentWrapper .specialPrd .pagingWrap { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 0 24px; position: absolute; bottom: 0; left: 0; z-index: 10; }
#contentWrapper .specialPrd .pagingWrap .moreBtn { width: 320px; margin-top: 0; flex-shrink: 0;}
#contentWrapper .specialPrd .pagingWrap .swiper-pagination-progressbar { width: 100%; position: static; }
/* BEST OF PANTS(TIMESALE) */
#contentWrapper .prdSwiper.timeSale { max-width: none; background-color: #f4f4f4; }
#contentWrapper .prdSwiper.timeSale .titleWrap { margin-bottom: 24px; }
#contentWrapper .prdSwiper.timeSale .contentWrap { max-width: 1440px; margin: 0 auto; }
#contentWrapper .prdSwiper.timeSale .list_shoppingInfo { margin-top: 20px; gap: 12px 0; }
/* ACC */
#contentWrapper .product-progress-swiper { max-width: none; margin-bottom: 0;}
#contentWrapper .product-progress-swiper .contentWrap { max-width: 1440px; margin: 0 auto; }
#contentWrapper .product-progress-swiper .swiper { width: 100%; height: 100%; padding-bottom: 32px; }
#contentWrapper .product-progress-swiper .swiper-slide figure { gap: 0 8px; }
#contentWrapper .product-progress-swiper .swiper-slide figure > a { display: none; }
#contentWrapper .product-progress-swiper .swiper-slide .thumb { width: 160px; height: fit-content; border-radius: 10px; }
#contentWrapper .product-progress-swiper .swiper-slide .infoWrap { width: calc(100% - 168px); }
#contentWrapper .product-progress-swiper .swiper-slide .infoWrap .list_shoppingInfo { margin-top: 0; gap: 4.5px 0; box-sizing: border-box; }
#contentWrapper .product-progress-swiper .swiper-slide .infoWrap .num { display: block; width: 24px; height: 24px; border-radius: 10px; background-color: #1f1f1f; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: -1px; text-align: center; line-height: 24px; }
#contentWrapper .product-progress-swiper .prdBox { flex-wrap: wrap; gap: 12px 16px; display:flex;}
#contentWrapper .product-progress-swiper .prdBox > li > a { display: none; position: static; } 
#contentWrapper .product-progress-swiper .prdBox .icon { display: none; }
#contentWrapper .product-progress-swiper.number .swiper-wrapper {counter-reset:number;}
/***** 탭 상품 진열 *****/
#contentWrapper .tabBtn { margin: 10px auto 32px; }
#contentWrapper .tabBtn li { width: fit-content; }
#contentWrapper .tabBtn li a { display: block; min-width: 72px; width: fit-content; height: 40px; padding: 0 12px; border: 1px solid #b7b7b7; border-radius: 75px; box-sizing: border-box; transition: all 0.4s ease-out; background-color: var(--white); color: #7a7a7a; font-size: 14px; font-weight: 500; font-family: 'SUIT', sans-serif; text-align: center; line-height: 38px; }
#contentWrapper .tabBtn li.active a { border: 1px solid var(--pink); color: var(--pink); }
/* best of best */
#contents .prdTab.bestPrd .prdBox > li:nth-of-type(3) { width: 100%; }
/* BASIC css end */