@charset "utf-8";
/* ==========================================================================
   inc_prd_list.css — 공통 상품카드 (incPrdList). 여러 도메인 include
   ========================================================================== */

/* --------------------------------------------------------------------------
   prd_box_list — 상품카드 그리드
   -------------------------------------------------------------------------- */
.prd_box_list{position: relative;margin: 20px 0;}
.prd_box_list > ul{margin-left: -20px;}
.prd_box_list > ul > li{float: left;width: 25%;-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;}
.prd_box{position: relative;padding: 0 0 20px 20px;max-width:315px;height:648px;overflow:hidden;}
.inner_thum{/* padding: 63px 0; */background: #f7f5f5;position: relative;}
.thum_img{text-align: center;}
.thum_img img{/* max-width: 200px; */width: 100%;}
.thum_info{padding: 25px 0;}
.thum_info .thum_name{color:#000;font-size: 16px;margin-bottom: 9px;line-height:1.5;overflow: hidden;text-overflow: ellipsis;white-space: normal;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;height:45px}
.thum_info .thum_tag{font-size: 15px;color: #a0a0a0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all;height: 24px;}
.thum_info .thum_tag li{margin-right: 10px; display: inline-block;	max-width: 130px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-break: break-all;}
.thum_info .thum_color {margin:15px 0 15px;min-height: 26px}
.thum_info .thum_color li{margin-right: 14px;float: left;}
.thum_info .thum_color li:last-child{margin-right: 0;}
.thum_info .thum_color li span{display:block;border-radius: 50%;width: 26px;height: 26px;position: relative;}
.thum_info .thum_color li span.line:before{content: "";
	position: absolute;
	left: -1px;
	right: -1px;
	top: -1px;
	bottom: -1px;
	border: 1px solid #a0a0a0;
	border-radius: 50%;}
.thum_info .thum_color li.more_color{position: relative;height: 26px;padding-right: 70px;margin-right:0 !important}
.thum_info .thum_color li.more_color > span{position: absolute; margin-left: 0}
.thum_info .thum_color li.more_color span.color_01{top: 0;left: 0;z-index: 3}
.thum_info .thum_color li.more_color span.color_02{top: 0;left: 6px;z-index: 2}
.thum_info .thum_color li.more_color span.color_03{top: 0;left: 12px;z-index: 1}
.thum_info .thum_color li.more_color p.color_etc{font-size: 14px;color: #a0a0a0;position: absolute;top:3px;right:0;font-family: 'yoon';}
.thum_info .thum_color li span.disable{overflow:hidden;/* position:absolute; */}
.thum_info .thum_color li span.disable:after{content:"";position:absolute;width:1px;left:50%;right:0;top:0;bottom:0;background:#fff;transform: rotateZ(45deg);}
.thum_info .pd_pay{padding-right:66px;position:relative}
.thum_info .pd_pay li{float:left;line-height:46px;font-family:'yoonb';}
.thum_info .pay_del del:before{content:"";display:block;position:absolute;left:0;right:0;top:50%;margin-top:0;border-top:1px solid #8c7c7e;}
.thum_info .pay_del del{font-size:14px;margin-right:5px;color:#a0a0a0;text-decoration:none;position:relative;}
.thum_info .pay_del span{font-size:14px;color:#a0a0a0}
.thum_info .pay_sale{font-size:14px;margin-right:8px;color: #ff463a}
.thum_info .pay_sale span{font-size:14px;}
.thum_info .pay_won{font-size:16px;}
.thum_info .pay_won span{font-size:16px;font-family:'yoonb'}
.thum_info .pd_pay button{position:absolute;right:20px;top:0;width: 46px;height: 46px;background: url(/resources/images/shop/ico_basket.png) no-repeat 0 0;}
.thum_info .pd_pay button.on{background: url(/resources/images/shop/ico_basket_on.png) no-repeat 0 0;}
.wish_list{position: absolute;top:22px;left: 22px;z-index: 2}
.wish_list button{background: url(/resources/images/shop/ico_unlike.png) no-repeat 0 0;width: 20px;height: 18px;display: inline-block;}
.wish_list button.on{background: url(/resources/images/shop/ico_like.png) no-repeat 0 0;background-size:contain;}
.prd_box .state_mark{position: absolute;top: 20px; right: 10px;z-index: 2}
.prd_box .pd_pay{color:#000}
.state_mark li{margin-top: 2px;text-align: center;background: #fff;padding: 3px 4px;min-width: 58px;height: 24px;line-height:18px;font-family:'Marian';color:#000;letter-spacing: 0.1em;}
.state_mark li:first-child{margin-top: 0}
.state_mark li.sold_out{padding: 3px 6px;}
.catagory_mark{position: absolute;bottom: 20px;left: 20px;z-index: 2;color: #a1a1a1;font-size: 12px;}
.catagory_mark p{font-size: 12px;color: #a1a1a1}
.prd_box.full_img_one img{width: 100%;height: 627px;}
.evt_bnr_three{width: 75% !important;min-height: 647px}
.prd_box.full_img_three{width: 100%;max-width: inherit;}
.prd_box.full_img_three img{width: 100%}
.syt_bnr .prd_box{display:table;width: 100%;}
.syt_bnr .prd_box .syt_bnr_area{display:table-cell;color:#fff;position:relative;padding:35px;vertical-align:middle;background:url('/resources/images/shop/list_bg.jpg') no-repeat top right;}
.syt_bnr .prd_box .syt_bnr_area dt{font-size: 30px;margin-bottom:25px;font-family:'yoonb';}
.syt_bnr .prd_box .syt_bnr_area dt span{letter-spacing:3px;display:block;font-size: 34px;font-family:'Marian';font-weight:bold;}
.syt_bnr .prd_box .syt_bnr_area dd.syt_bnr_info{font-size: 16px;line-height:2;}
.syt_bnr .prd_box .syt_bnr_area dd.Remaining{font-size: 14px;position:absolute;left: 35px;bottom: 35px;font-family:'yoonb'}
.syt_bnr .prd_box .syt_bnr_area dd.Remaining span{font-size: 40px;font-family:'Marian'}
/* --------------------------------------------------------------------------
   responsive — ≤1024px
   -------------------------------------------------------------------------- */
@media only all and (max-width:1024px){
	.thum_info .thum_color li{margin-right: 6px;margin-bottom:3px;}
/* --------------------------------------------------------------------------
   prd_box_list 1024
   -------------------------------------------------------------------------- */
	.prd_box_list > ul > li{width: 33.33%;}
	.evt_bnr_three{width: 100% !important;padding-right:0;min-height:inherit;}
	.evt_bnr_three img{width: 100%;}
	.prd_box{max-width: inherit;padding: 0 0 10px 10px; }
	.prd_box_list > ul{margin-left: -10px;}
	.recom_ul > li{max-width:250px}
	.recom_ul > li:first-child{padding-left:20px;}
	.recom_ul .thum_img img{max-width:150px}
	.thum_info{padding: 20px 15px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤1023px
   -------------------------------------------------------------------------- */
@media only all and (max-width:1023px){
/* --------------------------------------------------------------------------
   prd_box_list 768
   -------------------------------------------------------------------------- */
	.prd_box{max-width: inherit;padding: 0 0 5px 5px;height: 570px;}
	.prd_box .state_mark{top: 15px;right: 5px;}
	.thum_info .thum_name{height:38px;font-size: 13px}
	.thum_info .thum_tag{font-size: 12px;width:100%;}
	.thum_info .thum_color {margin: 10px 0;min-height: 22px;}
	.thum_info .thum_color li span{width: 22px;height: 22px;}
	.thum_info .thum_color li.more_color p.color_etc{top: 4px;font-size: 11px;}
	.thum_info .thum_color li:last-child{margin-right: 0;}
	.thum_info .thum_color li{margin-right:7px;}
	.thum_info .thum_color li.more_color span.color_02{left: 5px;}
	.thum_info .thum_color li.more_color span.color_03{left: 10px;}
	.thum_info .thum_color li.more_color{height:22px;padding-right:60px;}
	.inner_thum{padding: 0;}
	.thum_img img{/* max-width: 140px; */}
	.prd_box.full_img_one img{height: 420px;padding-bottom:5px;}
	.catagory_mark{bottom:23px;left: 15px;font-size: 11px;}
	.state_mark li{font-size: 11px;min-width: 40px;height: 18px;padding: 0 3px;line-height:19px}
	.state_mark li.sold_out{padding: 0 5px;}
	.thum_info .pd_pay{padding-right:50px;}
	.thum_info .pd_pay li{line-height:15px;float:none;display:inline-block;}
	.thum_info .pay_del del:before{content:"";display:block;position:absolute;left:0;right:0;top:50%;margin-top:-1px;border-top:1px solid #8c7c7e;}
	.thum_info .pay_del del{font-size: 11px;margin-right: 5px;text-decoration:none}
	.thum_info .pay_del span{font-size:13px;}
	.thum_info .pay_sale{font-size:11px;}
	.thum_info .pay_sale span{font-size:13px;}
	.thum_info .pay_won{font-size:13px;float: none;}
	.thum_info .pay_won span{font-size:15px;}
	.prd_box_list .thum_info .pay_won span {display:inline-block;height:15px;line-height:15px;}
	.thum_info .pd_pay button{right:-15px;top:-4px;width: 29px;height: 29px;background: url(/resources/images/shop/ico_basket.png) no-repeat 0 0;background-size: cover}
	.thum_info .pd_pay button.on,.thum_info .pd_pay button:active{background-size: cover}
	.wish_list {top:15px;left: 15px;}
	.wish_list button{width: 15px;height: 14px;background-size: contain;}
	.wish_list button.on, .wish_list button:active{width: 15px;height: 14px;background-size: contain;}
	.state_mark {top: 15px;right: 5px;}
	.syt_bnr .prd_box .syt_bnr_area{padding: 26px;}
	.syt_bnr .prd_box .syt_bnr_area dt{font-size: 26px;}
	.syt_bnr .prd_box .syt_bnr_area dt span{font-size: 32px;letter-spacing:1px}
	.syt_bnr .prd_box .syt_bnr_area dd.syt_bnr_info{font-size: 14px;}
	.syt_bnr .prd_box .syt_bnr_area dd.Remaining{left: 25px;bottom: 25px;font-size: 12px;}
	.syt_bnr .prd_box .syt_bnr_area dd.Remaining span{font-size: 36px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤640px
   -------------------------------------------------------------------------- */
@media only all and (max-width:640px){
/* --------------------------------------------------------------------------
   prd_box_list 640
   -------------------------------------------------------------------------- */
	.prd_box_list > ul{margin-left: -5px;}
	.prd_box_list > ul > li{width: 50%;}
	.prd_box_list > .list_more{margin-top:40px;}
	.thum_info{padding:15px}
	.thum_info .thum_tag{height:15px;}
	.thum_info .thum_color li{margin-right:6px;}
	.thum_info .thum_color {margin: 10px 0;min-height: 17px;}
	.thum_info .thum_color li span{width: 17px;height: 17px;}
	.thum_info .thum_color li.more_color p.color_etc{top: 2px;font-size: 11px;}
	.thum_info .thum_color li:last-child{margin-right: 0;}
	.thum_info .thum_color li.more_color span.color_02{left: 5px;}
	.thum_info .thum_color li.more_color span.color_03{left: 10px;}
	.thum_info .thum_color li.more_color{height:17px;padding-right:50px;}
	.thum_info .pd_pay button{right:0;}
	.evt_bnr_three{margin-bottom:10px;}
	.thum_info .pd_pay{padding-right:35px;}
	.prd_box{height: 460px;}
	.thum_img img{/* max-width:192.5px; */}
	.syt_bnr .prd_box .syt_bnr_area{padding: 15px;}
	.syt_bnr .prd_box .syt_bnr_area dt{font-size: 24px;}
	.syt_bnr .prd_box .syt_bnr_area dt span{font-size: 28px;}
	.syt_bnr .prd_box .syt_bnr_area dd.syt_bnr_info{font-size: 13px;}
	.syt_bnr .prd_box .syt_bnr_area dd.Remaining{font-size: 11px;}
	.syt_bnr .prd_box .syt_bnr_area dd.Remaining span{font-size: 30px;}
	.recom_list .recom_ul {padding-left: 25px;}
	.recom_list .recom_ul > li:last-child{margin-right: 25px;}
	.recom_ul > li .prd_box{padding: 0 10px 20px 0;}
	.recom_ul > li{max-width: 260px;}
	.recom_ul > li:first-child{padding-left: 0;}
	.motb_cover .recom_ul > li:first-child{padding-left:0;}
}
/* --------------------------------------------------------------------------
   responsive — ≤360px
   -------------------------------------------------------------------------- */
@media only all and (max-width:360px){
	.thum_info{padding:10px 10px}
	.thum_info .thum_color li{margin-right:3px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤320px
   -------------------------------------------------------------------------- */
@media only all and (max-width:320px){
	.prd_box{height:410px}
}

/* --------------------------------------------------------------------------
   timedeal_box — 타임딜
   -------------------------------------------------------------------------- */
.timedeal_box {position:absolute;left:0;bottom:0;display:block;width:100%;padding:13px 0 16px;text-align:center;font-size:0;}
.timedeal_box .tit {display:inline-block;width:auto;padding:5px 6px;text-align:center;font-size:14px;color:#000;letter-spacing:-0.6px;}
.timedeal_box .deal_timer {display:inline-block;width:auto;text-align:center;}
.timedeal_box .deal_timer span {display:inline-block;width:25px;margin:0 2px;padding:3px 0;text-align:center;font-family:'Marian', sans-serif;color:#ff2525;line-height:100%;background:#fff;}
.timedeal_box .deal_timer span, .timedeal_box .deal_timer em {display:inline-block;}
.timedeal_box .deal_timer i {width:7px;margin-top:-1px;padding:2px 0 3px;font-family:'Marian', sans-serif;color:#ff2525;text-align:center;line-height:1;}
.timedeal_box .deal_timer span,
.timedeal_box .deal_timer i {font-weight:bold;font-size:24px;}
.timedeal_box .timedeal_progress {position:absolute;bottom:0;right:0;width:100%;height:3px;background:#eeecec;}
.timedeal_box .timedeal_progress .bar {position:absolute;bottom:0;right:0;display:block;height:3px;background:#ff2929;}

.timedeal_box .deal_timer i:first-of-type {margin-top:1px;text-indent:-1px;}

.timedeal_box .deal_timer .deal_day {padding-top:7px;font-size:18px;}
.timedeal_box .deal_timer span, .timedeal_box .deal_timer i {float:left;}
.timedeal_box .deal_timer span {height:30px;}

/* --------------------------------------------------------------------------
   responsive — ≤1280px
   -------------------------------------------------------------------------- */
@media all and (max-width:1280px) {
	.timedeal_box .tit {padding:5px 3px;}
	.timedeal_box .deal_timer span {width:18px;}
	.timedeal_box .deal_timer i {width:4px;}
	.timedeal_box .deal_timer span,
	.timedeal_box .deal_timer i {font-size:20px;}
	.timedeal_box .deal_timer .deal_day {font-size:15px;}
	.timedeal_box .deal_timer span {height:26px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤1024px
   -------------------------------------------------------------------------- */
@media all and (max-width:1024px) {
	.timedeal_box {padding:10px 0 13px;}
	.timedeal_box .tit {padding:5px;font-size:13px;}
	.timedeal_box .deal_timer .deal_day {padding-top:7px;font-size:15px;}
	.timedeal_box .deal_timer span {height:26px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤768px
   -------------------------------------------------------------------------- */
@media all and (max-width:768px) {
	.timedeal_box .deal_timer span {width:17px;}
	.timedeal_box .deal_timer i {width:3px;}
	.timedeal_box .deal_timer span,
	.timedeal_box .deal_timer i {font-size:16px;}
	.timedeal_box .deal_timer .deal_day {padding-top:5px;font-size:12px;}
	.timedeal_box .deal_timer span {height:22px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤640px
   -------------------------------------------------------------------------- */
@media all and (max-width:640px) {
	.timedeal_box .tit {font-size:12px;}
	.timedeal_box .deal_timer .deal_day {padding-top:5px;font-size:12px;}
	.timedeal_box .deal_timer span {height:22px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤480px
   -------------------------------------------------------------------------- */
@media all and (max-width:480px) {
	.timedeal_box {padding:6px 0 9px;}
	.timedeal_box .tit {font-size:12px;}
	.timedeal_box .deal_timer span {width:16px;margin:0 1px;font-size:15px;}
	.timedeal_box .deal_timer i {font-size:15px;}
	.timedeal_box .deal_timer .deal_day {font-size:11px;}
	.timedeal_box .deal_timer span {height:21px;}
}
/* --------------------------------------------------------------------------
   responsive — ≤360px
   -------------------------------------------------------------------------- */
@media all and (max-width:360px) {
	.timedeal_box .tit {font-size:10px;}
	.timedeal_box .deal_timer span {width:14px;margin:0 1px;}
}

/* --------------------------------------------------------------------------
   hover
   -------------------------------------------------------------------------- */
@media (hover: hover) {
.thum_info .thum_color li span.disable:hover:before{content:none}
.thum_info .pd_pay button:hover{background: url(/resources/images/shop/ico_basket_on.png) no-repeat 0 0;background-size: cover;}
.wish_list button:hover{background: url(/resources/images/shop/ico_like.png) no-repeat 0 0;background-size:contain;}
}
