/* paging */
.paging {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	text-align: center;
    gap: 20px;
}
.paging a {
	display: flex;
	justify-content: center;
	align-items: center;
    position: relative;
	width: 40px;
    height: 40px;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
	background-color: rgb(255, 255, 255);
	font-weight: 900;
	font-size: 14px;
	color: rgb(40, 40, 40);
}
.paging > a {
	border: 1px solid rgb(40, 40, 40);
	background-position: center center;
	background-repeat: no-repeat;
}
.paging .paging-num {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.paging .paging-num a.on,
.paging .paging-num a:hover {border: 2px solid rgb(40, 40, 40);}
.paging a.prev__btn {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18.414' height='14.828' viewBox='0 0 18.414 14.828'%3E%3Cline id='선_5' data-name='선 5' x1='16' transform='translate(1.414 7.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='선_6' data-name='선 6' x1='6' y2='6' transform='translate(1.414 1.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='선_7' data-name='선 7' x1='6' y1='6' transform='translate(1.414 7.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3C/svg%3E%0A");}
.paging a.next__btn {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18.414' height='14.828' viewBox='0 0 18.414 14.828'%3E%3Cline id='선_5' data-name='선 5' x2='16' transform='translate(1 7.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='선_6' data-name='선 6' x2='6' y2='6' transform='translate(11 1.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='선_7' data-name='선 7' y1='6' x2='6' transform='translate(11 7.414)' fill='none' stroke='%23282828' stroke-linecap='round' stroke-width='2'/%3E%3C/svg%3E%0A");}

/* //paging */

/* LIST */
#contents {/*margin: 165px auto 0;*/}
.list__contents .head-box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 100%;
	height: 400px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.list__contents .head-box h2 {
	font-weight: 700;
	font-family: 'Zurich-Bold', sans-serif;
	font-size: 60px;
	color: rgb(255, 255, 255);
}
.list__contents .head-box .pg-cate {
	position: absolute;
	top: 20px;
	left: 30px;
}
.list__contents .head-box .pg-cate a {
	position: relative;
	font-size: 12px;
	color: rgb(255, 255, 255);
}
.list__contents .head-box .pg-cate a + a {
	margin-left: 12px;
	padding-left: 5px;
}
.list__contents .head-box .pg-cate a + a:before {
	content: '';
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
    left: -9px;
    width: 9px;
    height: 1px;
    background-color: rgb(255, 255, 255);
}

.list__contents .con-box {
	max-width: 1600px;
	margin: 40px auto 0;
	padding: 0 40px;
}

.list__contents .cate-tab-box {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-bottom: 13px;
	border-bottom: 1px solid rgb(227, 227, 227);
}
.list__contents .cate-tab-box button {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 40px;
	padding: 0 20px;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
	font-family: 'Pretendard', sans-serif;
	font-weight: 700;
	font-size: 14px;
	color: rgb(40, 40, 40);

	transition: all .2s;
}
.list__contents .cate-tab-box button:hover,
.list__contents .cate-tab-box button.on {
	border-color: rgb(40, 40, 40);
	background-color: rgb(40, 40, 40);
	color: rgb(255, 255, 255);
}
.list__contents .filter-box {
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid rgb(227, 227, 227);
}
.list__contents .filter-box .filter-wrap {
	display: flex;
	position: relative;
}
.list__contents .filter-box ._type_cate {gap: 43px}
.list__contents .filter-box ._type_order {gap: 30px}
.list__contents .filter-box button {
	padding: 12px 0;
	font-family: 'Zurich-Regular', 'Pretendard', sans-serif;
	font-weight: 400;
	font-size: 14px;
}
.list__contents .filter-box button.on {
	font-family: 'Zurich-Bold', 'Pretendard', sans-serif;
	font-weight: 700;
}
.list__contents .filter-box .slide-bar {
	position: absolute;
	left: 0;
    bottom: 0; 
    height: 2px;
	background-color: rgb(40, 40, 40);
	
	transition: all .3s ease-out;
}
.list__contents .list-box {padding-top: 60px;}

.pd__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 60px 32px;
	width: 100%;
}
.pd__list img {width: 100%;}
.pd__list .thumb {background-color: rgb(255, 255, 255);}
.pd__list .thumb > a {
	position: relative;
}
.pd__list .thumb ._after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	transition: all .2s;
}
.pd__list .thumb:hover ._after {
	opacity: 1;
}
.pd__list .thumb:hover ._after._disable {
	opacity: 0;
}
.pd__list .tag {
	position: absolute;
	top: 5px;
	left: 9px;
	z-index: 2;
}
.pd__list .tag p {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 19px;
    padding: 0 5px;
	font-weight: 700;
	font-family: 'Zurich-Bold', 'Pretendard', sans-serif;
	font-size: 12px;
	line-height: 15px;
}
.pd__list .tag ._soldout {
	background-color: rgb(204, 204, 204);
	color: rgb(40, 40, 40);
}
.pd__list .info {
	margin-top: 20px;
	text-align: center;
	line-height: 19px;
}
.pd__list .info .name {
	font-size: 16px;
	color: rgb(40, 40, 40);
}
.pd__list .info .price {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 10px;
	font-size: 16px;
}
.pd__list .info .price .sale {color: rgb(40, 40, 40);}
.pd__list .info .price .ori {
	color: rgb(154, 154, 154);
}
.pd__list .pd-thumb-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.pd__list .pd-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.2s ease;
    transform: translateX(-5%); 
}
.pd__list .pd-thumb.active {
    opacity: 1;
    transform: translateX(0); 
}
.pd__list .pd-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pd__list .colorchips {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 20px;
}
.pd__list .colorchips > button {
	position: relative;
	width: 20px;
	height: 20px;
	border-radius: 50%;
}
.pd__list .colorchips > button img {
	display: block;
	width: 100%;
	border-radius: 50%;
}
/*.pd__list .colorchips > button:after {	
	content: '';
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    transform: scale(1.3);
    border-radius: 50%;
    border: 1px solid rgb(0, 0, 0);
    background-color: transparent;
}
.pd__list .colorchips > button.active:after {display: block;}*/

.list__contents .wide-banner-box {margin-top: 80px;}
.wide-banner-box .bnr-box {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	width: 100%;
	height: 600px;
	padding: 0 160px;
	box-sizing: border-box;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.wide-banner-box .bnr-box .txt-box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: 50%;
	max-width: 800px;
}
.wide-banner-box .bnr-box .txt-box p {
	font-size: 16px;
	line-height: 26px;
	color: rgb(255, 255, 255);
}
.wide-banner-box .bnr-box .txt-box .small {
	font-family: 'Zurich-Bold', sans-serif;
	font-size: 14px;
	font-weight: 700;
}
.wide-banner-box .bnr-box .txt-box .tit {
	margin-top: 21px;
	font-weight: 700;
	font-size: 48px;
	line-height: 56px;
	white-space: nowrap;
}
.wide-banner-box .bnr-box .txt-box .txt {margin-top: 41px;}
.wide-banner-box .bnr-box .txt-box a {margin-top: 60px;}
/* //LIST */

/* VIEW */
#contents.view__contents {
	/*margin: 165px auto 0;*/
	margin: 0 auto;
}
.head-box .pg-cate a {
	position: relative;
	font-size: 12px;
}
.head-box .pg-cate a + a {
	margin-left: 12px;
	padding-left: 5px;
}
.head-box .pg-cate a + a:before {
	content: '';
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
    left: -9px;
    width: 9px;
    height: 1px;
    background-color: rgb(40, 40, 40);
}
.view__contents .head-box .pg-cate {
	max-width: 1890px;
	margin: 20px auto 0;
	padding-left: 30px;
    box-sizing: border-box;
}
.view__contents .con-box {
	margin: 40px auto 100px;
	max-width: 1600px;
    padding: 0 40px;
}

.pd-view-box {
	display: flex;
	justify-content: space-between;
}
.pd-view-box img {
	display: block;
	width: 100%;
}
.pd-view-box .pd-slide-box {
	display: flex;
	justify-content: flex-end;
	position: relative;
	width: calc(800 / 1600 * 100%);
	/*max-height: 710px;*/
	height: fit-content;
}
.pd-view-box .pd-slide-box .pd-nav__slider {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(80 / 800 * 100%);
	height: 100%;
	margin: 0;
	z-index: 1;
}
.pd-view-box .pd-slide-box .pd-nav__slider .swiper-slide:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 2px solid rgb(40, 40, 40);
	box-sizing: border-box;
	background: transparent;
	opacity: 0;

	transition: all .3s;
}
.pd-view-box .pd-slide-box .pd-nav__slider .swiper-slide-thumb-active:after {opacity: 1;}
.pd-view-box .pd-slide-box .pd-thumb__slider {
	width: calc(710 / 800 * 100%);
	margin: 0;
	height: unset;
	aspect-ratio: 1 / 1;
}
.pd-view-box .pd-slide-box .pd-thumb__slider .swiper-slide {
	height: unset;
	aspect-ratio: 1 / 1;
}
.pd-view-box .pd-slide-box .zoom-box {
	position: absolute;
	bottom: 10px;
	right: 10px;
	z-index: 1;
}
.pd-view-box .pd-slide-box .zoom-box button {
	width: 40px;
	height: 40px;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
	font-size: 0;
	background: url(/pc/resource/images/common/ico_zoom_bk_19x19.png) 10px center / 19px no-repeat;
}
.pd-view-box .pd-info-box {
	width: calc(740 / 1600 * 100%);
}
.pd-view-box .pd-info .name {
	font-weight: 900;
	font-size: 36px;
	line-height: 40px;
}
.pd-view-box .pd-info .price {
	display: flex;
	align-items: flex-end;
	gap: 9px;
	margin-top: 21px;
}
.pd-view-box .pd-info .price .sale {
	font-weight: 700;
	font-size: 22px;
	line-height: 26px;
}
.pd-view-box .pd-info .price .ori {
	font-size: 16px;
	line-height: 19px;
	color: rgb(154, 154, 154);
}

.pd-view-box .pd-option-box {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid rgb(204, 204, 204);
}
.pd-view-box .pd-option-box .desc {
	font-size: 16px;
	line-height: 26px;
}
.pd-view-box .pd-option-box .option {
	margin-top: 30px;
}
.pd-view-box .pd-option-box .option._size,
.pd-view-box .pd-option-box .option._price {margin-top: 20px;}
.pd-view-box .pd-option-box .option .tit {
	padding-bottom: 15px;
	font-weight: 700;
	font-size: 16px;
	line-height: 19px;
}
.pd-view-box .pd-option-box .option ul li input{
    position: absolute;
    z-index: -9999;
    opacity: 0;
}
.pd-view-box .pd-option-box .option ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.pd-view-box .pd-option-box .option ul li {
	position: relative;
}
.pd-view-box .pd-option-box .option._size label {
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 141px;
	height: 39px;
	padding: 0 17px;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
	font-size: 16px;
}
.pd-view-box .pd-option-box .option._size label:hover,
.pd-view-box .pd-option-box .option._size input:checked + label {border: 2px solid rgb(25, 123, 189);}
.pd-view-box .pd-option-box .option._color a {
	position: relative;
	display: block;
	max-width: 65px;
	box-sizing: border-box;
}
.pd-view-box .pd-option-box .option._color a:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
}
.pd-view-box .pd-option-box .option._color li:hover a:before,
.pd-view-box .pd-option-box .option._color li.on a:before {border: 2px solid rgb(25, 123, 189);}
.pd-view-box .pd-option-box .option._qty .qty-box {
	display: flex;
	align-items: center;
	width: 140px;
	height: 39px;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
}
.pd-view-box .pd-option-box .option._qty .qty-box button {
	width: 32px;
	height: 100%;
	font-size: 0;
	background-position: center;
	background-size: 12px;
	background-repeat: no-repeat;
}
.pd-view-box .pd-option-box .option._qty .qty-box input {
	width: calc(100% - 64px);
	height: calc(100% - 2px);
	border: none;
	text-align: center;
	font-size: 16px;
}
.pd-view-box .pd-option-box .option._qty .qty-box .minus__btn {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='1' viewBox='0 0 12 1'%3E%3Cline id='선_4' data-name='선 4' x2='12' transform='translate(0 0.5)' fill='none' stroke='%23282828' stroke-width='1'/%3E%3C/svg%3E%0A");
}
.pd-view-box .pd-option-box .option._qty .qty-box .plus__btn {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cline id='선_5' data-name='선 5' x2='12' transform='translate(0 6)' fill='none' stroke='%23282828' stroke-width='1'/%3E%3Cline id='선_6' data-name='선 6' y2='12' transform='translate(6)' fill='none' stroke='%23282828' stroke-width='1'/%3E%3C/svg%3E%0A");
}
.pd-view-box .pd-option-box .option._price {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.pd-view-box .pd-option-box .option._price .tit {
	padding: 0;
}
.pd-view-box .pd-option-box .option._price .total {
	font-weight: 700;
	font-size: 24px;
	line-height: 29px;
}
.pd-view-box .pd-btn-box {
	display: flex;
	margin-top: 20px;
}
.pd-view-box .pd-btn-box button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 50px;
	box-sizing: border-box;
	font-size: 14px;
	color: rgb(255, 255, 255);
	transition: all .3s;
}
.pd-view-box .pd-btn-box .wish__btn {
	flex-shrink: 0;
	width: 50px;
	height: 50px;
	border: 1px solid rgb(204, 204, 204);
	font-size: 0;
	background-size: 20px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(/pc/resource/images/common/ico_wish_wt_20x20.png);
}
.pd-view-box .pd-btn-box .wish__btn.on {background-image: url(/pc/resource/images/common/ico_wish_bk_20x20.png);}
.pd-view-box .pd-btn-box .cart__btn {background-color: rgb(40, 40, 40);}
.pd-view-box .pd-btn-box .buy__btn {background-color: rgb(25, 123, 189)}
.pd-view-box .pd-info-box .pd-code {
	margin-top: 20px;
	font-size: 14px;
}
.pd-detail-box {margin-top: 76px;}
.pd-detail-box .pd-tab-box {
	height: 34px;
	box-sizing: border-box;
	border-bottom: 1px solid rgb(227, 227, 227);
}
.pd-detail-box .pd-tab-box .tab-wrap {
	display: flex;
	position: relative;
	gap: 60px;
}
.pd-detail-box .pd-tab-box button {
	padding-bottom: 12px;
	font-family: 'Zurich-Bold', 'Pretendard', sans-serif;
	font-weight: 700;
	font-size: 14px;
}
.pd-detail-box .pd-tab-box .slide-bar {
	position: absolute;
	left: 0;
    bottom: 0; 
    height: 2px;
	background-color: rgb(40, 40, 40);
	
	transition: all .3s ease-out;
}
.pd-detail-box .pd-detail-con {margin-top: 40px;}
.pd-detail-box .pd-detail-con > div {display: none;}
.pd-detail-box .pd-detail-con > div.on {display: block;}
.pd-relate-box {
	margin-top: 80px;
}
.pd-relate-box .relate-txt-box {
	text-align: center;
}
.pd-relate-box .relate-txt-box p {
	font-family: 'Zurich-Bold', 'Pretendard', sans-serif;
	font-size: 14px;
	line-height: 16px;
}
.pd-relate-box .relate-txt-box .tit {
	margin-top: 19px;
	font-family: 'Zurich-Extended', 'Pretendard', sans-serif;
	font-size: 48px;
	line-height: 57px;
}
.pd-relate-box .pd__list {margin-top: 60px;}

.pd-detail-con .pd-desc > div > * {margin-top: 40px;}
.pd-detail-con .pd-desc p {
	font-size: 16px;
	line-height: 26px;
}
.pd-detail-con .pd-desc img {width: 100%;}
.pd-detail-con .pd-desc .detail-cut {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.pd-detail-con .pd-desc .pd-name {
	font-weight: 900;
	font-size: 36px;
	line-height: 40px;
}
.pd-detail-box .pd-detail-con .detail-info-box + .detail-info-box {margin-top: 40px;}
.pd-detail-box .detail-info-box .tit {
	font-weight: 700;
	font-size: 18px;
}
.pd-detail-box .detail-info-box .tit + .info {margin-top: 13px;}
.pd-detail-box .detail-info-box .info {
	padding: 30px;
	background-color: rgb(245, 245, 245);
}
.pd-detail-box .detail-info-box .info dl div {
	display: flex;
	gap: 60px;
}
.pd-detail-box .detail-info-box .info dl div + div {
	margin-top: 52px;
}
.pd-detail-box .detail-info-box .info dl dt {
	font-weight: 700;
	font-size: 16px;
}
.pd-detail-box  .pd-spec .detail-info-box .info dl dt {min-width: 115px;}
.pd-detail-box  .pd-guide .detail-info-box:nth-child(1) .info dl dt {min-width: 56px;}
.pd-detail-box  .pd-guide .detail-info-box:nth-child(2) .info dl dt {min-width: 232px;}
.pd-detail-box .detail-info-box .info dl dd {
	font-size: 16px;
	line-height: 26px;
}

/* zoom layer */
.open--zoom .pswp .pswp__bg {
	background: rgb(255, 255, 255) !important; 
	opacity: 1 !important;
}
.open--zoom .pswp .pswp__counter {display: none;}
.open--zoom .pswp .pswp__button {
	position: absolute;
	width: 56px;
	height: 56px;
	margin: 0;
	border: 1px solid rgb(204, 204, 204);
	box-sizing: border-box;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 1;
}
.open--zoom .pswp .pswp__button--close {
	top: 40px;
	right: 40px;
	background-size: 14px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' focusable='false' width='14' height='14' class='icon icon--close ' viewBox='0 0 14 14'%3E%3Cpath d='M13 13L1 1M13 1L1 13' stroke='currentColor' stroke-width='2' fill='none'%3E%3C/path%3E%3C/svg%3E");
}
.open--zoom .pswp .pswp__button--arrow {
	top: 50%;
	transform: translateY(-50%);
	background-size: 17px;
}
.open--zoom .pswp .pswp__button--arrow--prev {
	left: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' focusable='false' width='17' height='14' class='icon icon--nav-arrow-left icon--direction-aware ' viewBox='0 0 17 14'%3E%3Cpath d='M17 7H2M8 1L2 7l6 6' stroke='currentColor' stroke-width='2' fill='none'%3E%3C/path%3E%3C/svg%3E");
}
.open--zoom .pswp .pswp__button--arrow--next {
	right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' focusable='false' width='17' height='14' class='icon icon--nav-arrow-right icon--direction-aware ' viewBox='0 0 17 14'%3E%3Cpath d='M0 7h15M9 1l6 6-6 6' stroke='currentColor' stroke-width='2' fill='none'%3E%3C/path%3E%3C/svg%3E");
}
.open--zoom .pswp .pswp__button--close svg,
.open--zoom .pswp .pswp__button--arrow svg {display: none;}
/* //zoom layer */

/* //VIEW */
