@charset "utf-8";
/* page-product-list — 이 화면에서만 쓰는 규칙.

   읽는 차례: theme.css -> base.css -> site.css -> page-*.css -> (손으로 쓴 페이지 CSS)
   색·글자 크기·간격 값은 전부 theme.css 의 변수를 쓴다. */
.product{padding:7rem 0 14.1rem;}
.product .category-list{border-bottom:1px solid var(--lightGray);}
.product .category-list__wrap{max-width:93rem;margin:0 auto;grid-template-columns:21.9fr 73.8fr;}
.product .category-list .category-list__select{position: relative;}
.product .category-list .category-list__select > a{display:block;padding:2rem 4rem;height:100%;border-left:1px solid var(--lightGray);border-right:1px solid var(--lightGray);cursor: pointer;text-transform: uppercase;font-size:1.8rem;font-weight:500;position: relative;}
.product .category-list .category-list__select > a::after{display:block;content: "";width:1.6rem;height:1.6rem;position:absolute;background-image: url("../img/common/arrow_down.svg");background-size:contain;background-repeat: no-repeat;background-position:center;top:50%;right:3rem;transform: translateY(-50%);}
.product .category-list .category-list__select .list{position:absolute;top:100%;left:0;z-index:50;width:100%;background-color: var(--white);border:1px solid var(--lightGray);display: none;}
.product .category-list .category-list__select .list li a{display:block;padding:1.5rem 4rem;text-transform: uppercase;}
.product .category-list .category-list__select .list.on{display:block;}
.product .category-list .menuCategory{display:flex;align-items:center;}
.product .category-list .menuCategory ul{display:flex;padding:2rem 3rem;gap:3.2rem;}
.product .category-list .menuCategory ul > li a{color: var(--black40);font-size:1.5rem;white-space: nowrap;}
.product .category-list .menuCategory ul > li.selected a{color: var(--black);}
.product .category-list .menuCategory > li:not(:has(.selected)){display: none;}
.product .product__image{width:100%;height:100%;overflow: hidden;}
.product .product__image div{opacity:0;}
.product .product__image img{width:100%;}
.product .product-list{padding-top:8.2rem;}
.product .function .function__count{font-size:1.5rem;}
.product .function .function__sort{position: relative;}
.product .function .function__sort--fake{padding:1rem 4.9rem 1rem 2rem;color: var(--white);}
.product .function .function__sort--real{position:absolute;top:0;left:0;width:100%;border: solid 1px var(--lightGray);background-color: var(--white);z-index:90;}
.product .function .function__sort--real a{padding:1rem 2rem;display:block;font-size:1.5rem;font-weight: normal !important;letter-spacing: -0.06rem;cursor: pointer;user-select: none;}
.product .function .function__sort .function__sort--selected::after{display:block;content: "";width:1.6rem;height:1.6rem;position:absolute;background-image: url("../img/common/arrow_down.svg");background-size:contain;background-repeat: no-repeat;background-position:center;top:50%;right:2rem;transform: translateY(-50%);}
.product .function .function__sort.on .function__sort--selected::after{transform-origin:50% 50%;transform: translateY(-55%) rotate(-180deg);}
.product .function .function__sort .function__sort--list{visibility: hidden;height:0;}
.product .function .function__sort.on .function__sort--list{visibility: visible;height:100%;}
.product .product-list .product-list__container{margin-top:3rem;}
.product .pagination{padding-top:10rem;gap:3rem;}
.product .pagination ol{gap:2.4rem;}
.product .pagination ol a{color: var(--black20);}
.product .pagination ol a.this{color: var(--black);}
.product .pagination .pagination__prev .pagination--inactive{display: none;}
.product .pagination .pagination__prev.on,.product .pagination .pagination__next.on{cursor :default;}
.product .pagination .pagination__prev.on .pagination--inactive{display:block;}
.product .pagination .pagination__prev.on .pagination--active{display: none;}
.product .pagination .pagination__next .pagination--inactive{display: none;cursor : no-drop;pointer-events : none;}
.product .pagination .pagination__next.on .pagination--inactive{display:block;}
.product .pagination .pagination__next.on .pagination--active{display: none;}
.product .pagination ol a{font-size:1.4rem;}
.search-form{padding:14.2rem 0 3rem;}
.search-form form{width:60.5rem;margin:0 auto;}
.search-form .search-form__input{position: relative;}
.search-form .search-form__input input.keyword{border:0;border-bottom:1px solid var(--black);padding:0 0.6rem 1.1rem;width:100%;height:3.6rem;font-size:2.4rem;letter-spacing:0;}
.search-form .search-form__input .keyword::placeholder{color: var(--black20);font-size:2.4rem;font-family: poppins;}
.search-form .search-form__input input#searchSubmit{position:absolute;top: -1rem;right:0.5rem;}
.search-form .search-form__keyword{padding:4rem 0.5rem 10.2rem;}
.search-form .search-form__keyword .heading{font-size:1.5rem;font-weight:500;}
.search-form .search-form__keyword .list{margin-top:2rem;column-gap:3.8rem;row-gap:1rem;flex-wrap: wrap;}
.search-form .search-form__keyword .list a{font-size:1.4rem;font-weight:500;letter-spacing: -0.056rem;color: var(--black40);white-space: nowrap;}
.prd-type--1 .product__item{border:1px solid var(--lightGray);}
.prd-type--1 .product__item + .product__item{border-left:0;}
.prd-type--1 .product__item .thumbnail{position: relative;overflow: hidden;height:clamp(40rem,30.8vw,53rem);}
.prd-type--1 .product__item .thumbnail .product__image > a{vertical-align: text-top;}
.prd-type--1 .product__item .thumbnail .best{position:absolute;top:1rem;left:1rem;background-color:#2f2f2f;font-size:1.2rem;font-weight:600;color: var(--white);padding:0.7rem 0.85rem;border-radius:0.5rem;line-height:1;z-index:10;}
.prd-type--1 .product__item .thumbnail:hover .cart{bottom:1rem;}
.prd-type--1 .product__item .thumbnail .cart{position:absolute;bottom: -7rem;left:50%;transform: translateX(-50%);width:calc(100% - 2rem);background-color:#333333;border-radius:0.5rem;transition:all .3s;z-index:100;}
.prd-type--1 .product__item .thumbnail .cart:hover{background-color: var(--mainColor);}
.prd-type--1 .product__item .cart-button{color: var(--white);text-align:center;padding:1.5rem 0;letter-spacing: -0.020rem;cursor: pointer;font-weight:600;}
.prd-type--1 .product__item .thumbnail .product__image--item{opacity:1;position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);z-index:5;transition:all .2s;}
.prd-type--1 .product__item .thumbnail .product__image{width:100%;height:100%;}
.prd-type--1 .product__item .thumbnail:hover .product__image--item{opacity:0;}
.prd-type--1 .product__item .thumbnail .product__image--hover{opacity:0;width:100%;height:100%;object-fit:cover;transition:all .2s;}
.prd-type--1 .product__item .thumbnail:hover .product__image--hover{opacity:1;}
.prd-type--1 .product__item .product__image .wish{position:absolute;top:1rem;right:1rem;z-index:10;cursor: pointer;}
.prd-type--1 .product__item .description{text-align:center;padding:3rem;}
.prd-type--1 .product__item .product-info .name span{font-size:1.8rem !important;font-weight:600;color:#000 !important;letter-spacing: -0.072rem;}
.prd-type--1 .product__item .product-info .desc{margin-top:1rem;}
.prd-type--1 .product__item .product-price{margin-top:2rem;}
.prd-type--1 .swiper-button-next::after{content: none;}
.prd-type--1 .swiper-button-prev::after{content: none;}
.prd-type--2 .product__item:nth-child(4n + 1){border:1px solid var(--lightGray);border-collapse:collapse;box-sizing:border-box;}
.prd-type--2 .product__item{border-top:1px solid var(--lightGray);border-right:1px solid var(--lightGray);border-bottom:1px solid var(--lightGray);}
.prd-type--2 .product__item:nth-child(n+5):nth-child(-n+20){border-top:0;}
.prd-type--2 .product__item .thumbnail{position: relative;overflow: hidden;width:100%;height:clamp(30rem,28.05vw,47.6rem);}
.prd-type--2 .product__item .thumbnail.on::after{content: "";display:block;position:absolute;top:0;left:0;width:100%;height:100%;background-color: var(--white);opacity:0.6;z-index:10;pointer-events: none;}
.prd-type--2 .product__item .thumbnail .product__image .wish{position:absolute;top:2rem;right:2rem;z-index:20;}
.prd-type--2 .product__item .thumbnail .product__image .wish img{width:2.2rem;height:2.2rem;}
.prd-type--2 .product__item .thumbnail .product__image--item{opacity:1;position:absolute;top:0;left:0;z-index:5;transition:all .2s;}
.prd-type--2 .product__item .thumbnail:hover .product__image--item{opacity:0;}
.prd-type--2 .product__item .thumbnail .product__image--hover{opacity:0;transition:all .2s;}
.prd-type--2 .product__item .thumbnail:hover .product__image--hover{opacity:1;}
.prd-type--2 .product__item .thumbnail .icon{position:absolute;height:2.4rem;top:2rem;left:2rem;z-index:20;display:flex;gap:0.5rem;}
.prd-type--2 .product__item .thumbnail .soldout img{height:2.4rem;}
.prd-type--2 .product__item .thumbnail .soldout:not(:has(img)){display: none;}
.prd-type--2 .product__item .description{padding:3rem 2rem;position: relative;}
.prd-type--2 .product__item .description .name{padding-right:2.5rem;}
.prd-type--2 .product__item .description .desc{margin-top:1rem;}
.prd-type--2 .product__item .description .product-price{margin-top:2rem;}
.prd-type--2 .product__item .description .price{letter-spacing: normal;}
.prd-type--2 .product__item .description .cart-button{position:absolute;top:3rem;right:2rem;cursor: pointer;}
.dl-page input[type="text"],.dl-page input[type="password"],.dl-page select{width:100%;height:5.4rem;padding:0 2rem;border-radius: .2rem;border: solid 1px var(--black10);background-color: var(--white);}
.dl-page select{width:100%;height:4.3rem;padding:0 1.8rem;font-size:1.6rem;font-weight: normal;letter-spacing: -0.064rem;color: var(--black);border:0.1rem solid #f0f0f0;border-radius:0.2rem;background: var(--white);}
.dl-page select{background: var(--white) url("../img/common/arr_selectbox.svg")no-repeat center right 1.4rem / 2rem auto;padding-right:4rem;}
.dl-page input[type="radio"],.dl-page input[type="checkbox"]{width:2.4rem;height:2.4rem;margin:0;padding:0;border:0;vertical-align: middle;background: url("../img/common/chk_off.svg") no-repeat center / contain;}
.dl-page input:not(:disabled)[type="radio"]:checked,.dl-page input:not(:disabled)[type="checkbox"]:checked{background: url("../img/common/chk_on.svg")no-repeat center /contain;}
.dl-page textarea{width:100%;border:1px solid var(--border);min-height:10rem;}
.dl-paginate{display:flex;justify-content:center;align-items:center;gap:1.8rem;padding-top:10rem;}
.dl-paginate .last{display: none;}
.dl-paginate ol{display:flex;}
.dl-paginate ol li a{font-size:1.4rem;line-height:1.14;font-family: "Pretendard";opacity:0.2;padding:0 1.2rem;}
.dl-paginate ol li a.this{opacity:1;}
.dl-page .dl-paginate .pagination__prev .pagination--inactive,.dl-page .dl-paginate .pagination__prev.on .pagination--active,.dl-page .dl-paginate .pagination__next.on .pagination--active{display: none;}
.dl-page .dl-paginate .pagination__prev.on,.dl-page .dl-paginate .pagination__next.on{cursor :default;}
.dl-page .dl-paginate .pagination__prev.on .pagination--inactive,.dl-page .dl-paginate .pagination__next.on .pagination--inactive{display:block;}
.dl-page .dl-paginate .pagination__next .pagination--inactive{display: none;cursor : no-drop;pointer-events : none;}
