/* BASIC css start */
.shopbrand h2 {text-align:center; font-size: 1.25em; font-weight:bold; padding-top:10px;}
.shopbrand .MK_product_list {background-color:#f9f9f9; border-bottom:1px solid #4a4a4a; border-top: 1px solid #4a4a4a;}
.shopbrand .MK_product_list .items {padding: 10px 0;}
.shopbrand .MK_product_list .items #MK_best_product li {width:33.33%;}
.shopbrand .MK_product_list .items .paging-num {text-align: center; clear: both; margin:20px 0;}
.shopbrand .MK_product_list .items .paging-num a {background-color:#fff; border:1px solid #393939; padding:5px 10px; margin:0 10px;}
.shopbrand .list_group {padding:12px 15px;}
.shopbrand .list_group select {width:49%; height:28px;}
.shopbrand .more .more-title {color: #3b3b3b;}
.shopbrand .more .more-num {color: #aaaaaa;}
.shopbrand .shopbrandTitle img {max-width: 100%;}
.shopbrand .list_array .list_arrayRight img {width: 23px; height: auto;}


#MS_select_category {
    border: 1px solid #fff;
    background: transparent;
}

#MS_select_category2 {
    float:right;
    border: 1px solid #fff;
    background: transparent;
}

#MS_select_sort {
    border: 1px solid #fff;
    background: transparent;
}

#LIST{}

/*
#LIST .item-list{width: 49%; display: inline-block; vertical-align: top; margin-right: 2%;margin-bottom: 10%;}
*/

#LIST .item-list dd ul{width:100%; padding-top: 10px; padding-bottom: 5px;}

#LIST .item-list dd ul li {padding-left: 0px; }

#LIST .item-list dd ul li em{font-family: 'Pretendard' !important;}

#LIST .item-list dd ul .prd-brand{padding-bottom: 3px;}

#LIST .item-cont{margin-top: 1rem; padding: 0px; font-size: 0;}

/*
#LIST .item-list:nth-child(even){margin-right:0}
*/

#LIST .item-list {
    width: 32%; /* 49%에서 32%로 변경하여 3개가 들어갈 공간 확보 */
    padding: 0.666666666666666666666666%;
    display: inline-block; 
    vertical-align: top; 
    margin-right: 0%; 
    margin-bottom: 10%;
}

/* 기존 짝수번째 마진 0 속성을 덮어쓰기 위해 2%로 초기화 */
#LIST .item-list:nth-child(even) {
    margin-right: 0%; 
}

/* 3의 배수(3, 6, 9...)번째 아이템의 우측 여백을 없애서 줄바꿈 맞춤 */
#LIST .item-list:nth-child(3n) {
    margin-right: 0; 
}

#LIST .item-list dd ul li.prd-name {
    font-family: 'Pretendard';
    
    /* 1. 글자 크기 살짝 축소 (기존 크기에 맞춰 12px~13px 등으로 조절해 보세요) */
    font-size: 12px; 
    
    /* 2. 줄 간격 설정 (2줄이 되었을 때 위아래 글자가 겹치지 않게) */
    line-height: 1.4; 
    
    /* 3. 2줄 초과 시 ... 처리하는 핵심 속성 */
    display: -webkit-box;
    -webkit-line-clamp: 3;       /* 노출할 최대 줄 수 (2줄) */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    
    /* 4. 혹시 기존에 한 줄로만 나오게 하는 속성이 있다면 무력화 */
    white-space: normal; 
    word-break: break-all;       /* 긴 영어나 숫자도 영역에 맞춰 줄바꿈되도록 설정 */
    
    /* 5. 상품명 아래 약간의 여백 확보 (선택사항) */
    margin-bottom: 5px; 
}


#LIST .color{
    position: unset;
    padding-left: 9px;
    padding-top: 2px;
    display: table;
    width: 100%;}
    

.more_btn {
	text-align: center;
}
.more_btn a {
    background: url(/design/ddmnail/mochi/mimg/more_view.png) no-repeat;
    background-position: 77%;
    display: inline-block;
    color: #000000;
    font-size: 14px;
    padding: 9px 50px;
    border: 1px solid #cfced3;
    margin: 0 auto;
    text-align: center;
    border-radius: 50px;
    text-indent: -8px;
    background-size: 9px;
    letter-spacing: -2px;
}


.mainList {
	font-size: 0;
}
.mainList .item-list {
}
.box.hide {
	display: none
}
.mainList .item-list .thumb {
	position: relative;
}
.mainList .item-list .thumb .dc {
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	height: 70px;
	line-height: 70px;
	width: 70px;
	background: #6b3590;
	color: #fff;
	font-size: 24px;
}
.mainList .item-list .thumb .dc em {
	font-size: 18px !important;
}
.mainList .item-list .thumb .dc.term {
}
.mainList .item-list .thumb .dc em:nth-child(3), .mainList .item-list .thumb .dc em:nth-child(4) {
	display: none !important
}
.mainList .item-list .thumb .dc em.num {
	font-size: 24px !important;
	display: inline-block;
	overflow: hidden;
}
.mainList .item-list .thumb .dc em.percent {
	font-size: 18px !important;
	display: inline-block;
	vertical-align: top;
	margin-top: 3px;
}
.mainList .item-list dd {
}
.mainList .item-list dd ul {
	vertical-align: top;
	display: inline-block;
	padding-top: 5px;
    width: 65%;
    float: right;
}
.mainList .item-list dd ul li.prd-price {
	display: inline-block;
	color: #0d0d0d;
	font-size: 14px;
	font-family: 'Pretendard';
	font-weight: 800;
}
.mainList .item-list img {
	width: 100%;
}
.mainList .item-list dd .discount {
    vertical-align: top;
    width: 30%;    
    display: inline-block;
    background: #ff8e95;
    text-align: center;
    color: #fff;
}

.mainList .item-list dd .discount.hasreplace{display:none}
.mainList .item-list dd ul.hasreplace{width:100%}

.mainList .item-list dd .discount .dc {
    font-size: 31px;
    font-family: 'Roboto Condensed';
    font-weight: 700;
    letter-spacing: -1px;
}
.mainList .item-list dd .discount .dc em {
    margin-bottom: 3px;
    display: inline;
    font-family: 'Roboto Condensed';

}

.mainList .item-list dd .discount .dc em.num{
    margin-left: 2px;}

.mainList .item-list dd .discount .dc em.percent{
    font-size: 18px;
    font-weight: 100;}


.mainList .item-list dd ul li.prd-consumer {
	color: #888888;
	font-size: 14px;
	font-family: 'Pretendard';
	font-weight: normal;
	display: inline-block;
	padding-right: 1px;
}
.mainList .item-list dd ul li.dc {
	color: #94223e;
	display: inline-block;
	font-size: 22px;
	letter-spacing: -1px;
	font-weight: 800;
	margin-left: 5px;
}
.mainList .item-list dd ul li.dc em.num {
}
.mainList .item-list dd ul li.dc em.percent {
	font-size: 16px !important;
	font-weight: bold !important;
	margin-left: 2px;
}
.mainList .item-list dd .color {
	font-size: 0;
	position: absolute;
	right: 10px;
	top: 10px;
}
.mainList .item-list dd .color p {
	display: inline-block;
	vertical-align: top;
	margin-right: 4px;
	width: 10px;
	height: 10px;
}
.mainList .item-list dd .color p:last-child {
	margin-right: 0
}
/* BASIC css end */