@charset "utf-8";

/* ******************* bootstrap modify ******************* */
ul,ol,li,dl,dt,dd {list-style:none; padding:0; margin:0;}


/* ******************** °ø¿ë ******************** */
/* table style */
.tableMode {display:table; clear:both; float:none; width:100%; max-width:100%; padding:0; margin:0; border-bottom:0;}
.tableMode>* {display:table-cell; float:none; padding:10px;}
.tableMode>*:first-child {border-left:0;}
.tableMode .middle {vertical-align:middle;}

/* °ÝÀÚÇü ±¸Á¶ - Å×ÀÌºí ½ºÅ¸ÀÏ */
.typeCube {clear:both;}
.typeCube .tableWrap {display:table; width:100%; margin:0; padding:0;}
.typeCube .tableWrap > * {display:table-cell; float:none; margin:0; padding:0;}

.c_acc {color:#00cccc !important;} /* °­Á¶»ö»ó */
.c_sub1 {color:#ee8e00 !important;} /* º¸Á¶»ö»ó1 */
.c_sub2 {color:#ee8e00 !important;} /* º¸Á¶»ö»ó2 */
.c_sub3 {color:#ee8e00 !important;} /* º¸Á¶»ö»ó2 */

table.typeA {width:100%; margin:0 auto; font-size:14px; border:1px solid #e5e5e5; border-left:0; border-right:0;}
table.typeA * {font-weight:300; line-height:1.6;}
table.typeA th {width:30%; padding:20px; color:#000; font-weight:400; border:1px solid #e5e5e5; border-left:0; background:#f7f7f7; text-align:center !important;}
table.typeA th:last-child {border-right:1px solid #e5e5e5;}
table.typeA td {padding:20px; border:1px solid #e5e5e5; border-top:0; border-right:0;}

/* ******************** PC (991~) ******************** */
@media screen and (min-width: 991px), print{
	
	/* »óÇ°»ó´Ü */
	.product-top {border-bottom:1px solid #e1e1e1; padding-bottom:20px;}
	.product-top>div {}
	.product-top-title {float:left;}
	.product-top-title p {letter-spacing:-1px; padding:6px 0;}
	.product-top-title span {font-weight:400; color:#000;}
	.product-top-title b {color:#ff6600;}
	
	.product-top-sort {float:right;}
	.product-top-sort p {float:left; padding:6px 10px; color:#000; font-weight:400; letter-spacing:-1px;}
	.product-top-sort ul {float:left; border-left:1px solid #1e2533; border-top:1px solid #1e2533;}
	.product-top-sort ul li {float:left; border-right:1px solid #1e2533; border-bottom:1px solid #1e2533;}
	.product-top-sort ul li a {display:block; padding:5px 30px;}
	.product-top-sort ul li a:hover {background-color:#f3f3f3;}
	.product-top-sort ul li.on a {background:#1e2533 url(../images/shop/sort_arrow-top.png)10px 50% no-repeat; color:#fff;}
	.product-top-sort ul li.on.bot a {background-image:url(../images/shop/sort_arrow-bot.png)}
	
	
	/* »óÇ°¸®½ºÆ® */
	.product-list {}
	.product-list>ul {padding:0 20px}
	.product-list>ul:after {clear:both; content:''; display:block;}
	.product-list>ul>li {float:left; width:calc((100% - 120px)/4); margin-top:40px; transition:box-shadow .3s;}
	.product-list>ul>li+li {margin-left:40px;}
	.product-list>ul>li:nth-child(4n+1) {margin-left:0}
	.product-list>ul>li:hover {box-shadow:10px 10px 10px rgba(0, 0, 0, .1);}
	.product-list>ul>li a {background:#fff;}
	.product-list .product-text {padding:30px; border:1px solid #e5e5e5; border-top:none;}
	.product-list .product-text dl dt {font-weight:400;}
	.product-list .product-text ul {margin-top:10px;}
	.product-list .product-text ul:after {clear:both; content:''; display:block;}
	.product-list .product-text ul li {float:left; margin-right:10px;}
	.product-list .product-text ul .point {float:right; margin-right:0; font-size:12px; color:#666}




}

/* ******************** ÅÂºí¸´ (~991) ******************** */
@media screen and (max-width: 991px), print{
	
	
	/* »óÇ°»ó´Ü */
	.product-top {border-bottom:1px solid #e1e1e1; padding-bottom:20px;}
	.product-top>div {}
	.product-top-title {}
	.product-top-title p {letter-spacing:-1px; padding-bottom:10px;}
	.product-top-title span {font-weight:400; color:#000;}
	.product-top-title b {color:#ff6600;}
	
	.product-top-sort {}
	.product-top-sort p {float:left; padding:6px 10px 6px 0; color:#000; font-weight:400; letter-spacing:-1px;}
	.product-top-sort ul {float:left; border-left:1px solid #1e2533; border-top:1px solid #1e2533;}
	.product-top-sort ul li {float:left; border-right:1px solid #1e2533; border-bottom:1px solid #1e2533;}
	.product-top-sort ul li a {display:block; padding:5px 30px;}
	.product-top-sort ul li a:hover {background-color:#f3f3f3;}
	.product-top-sort ul li.on a {background:#1e2533 url(../images/shop/sort_arrow-top.png)10px 50% no-repeat; color:#fff;}
	.product-top-sort ul li.on.bot a {background-image:url(../images/shop/sort_arrow-bot.png)}
	
	/* »óÇ°¸®½ºÆ® */
	.product-list {}
	.product-list>ul {}
	.product-list>ul:after {clear:both; content:''; display:block;}
	.product-list>ul>li {float:left; width:calc((100% - 20px)/2); margin-top:20px; transition:box-shadow .3s;}
	.product-list>ul>li+li {margin-left:20px;}
	.product-list>ul>li:nth-child(2n+1) {margin-left:0; clear:both;}
	.product-list>ul>li:hover {box-shadow:5px 5px 5px rgba(0, 0, 0, .1);}
	.product-list>ul>li a {background:#fff;}
	.product-list>ul>li a img {width:100%;}
	.product-list .product-text {padding:20px; border:1px solid #e5e5e5; border-top:none;}
	.product-list .product-text dl dt {font-weight:400;}
	.product-list .product-text ul {margin-top:10px;}
	.product-list .product-text ul:after {clear:both; content:''; display:block;}
	.product-list .product-text ul li {float:left; margin-right:10px;}
	.product-list .product-text ul .point {float:right; margin-right:0; font-size:12px; color:#666}


	
}


/* ******************** ¸ð¹ÙÀÏ (~768) ******************** */
@media screen and (max-width: 768px), print{
	
	/* »óÇ°»ó´Ü */
	.product-top-title p {padding:0;}
	.product-top-sort p {float:none; }
	.product-top-sort ul {width:100%;}
	.product-top-sort ul li {width:50%;}
	.product-top-sort ul li a {padding:5px 40px; }
	.product-top-sort ul li.on a {background-position:20px 50%;}
	
	
	/* »óÇ°¸®½ºÆ® */
	.product-list>ul>li {width:calc((100% - 10px)/2); margin-top:10px;}
	.product-list>ul>li+li {margin-left:10px}
	.product-list .product-text {padding:10px;}
	.product-list .product-text ul {height:43px;}
	.product-list .product-text ul .point {float:left; width:100%; margin-top:5px}
	.product-list .product-text dl dt {text-overflow:ellipsis; overflow:none; white-space:nowrap}
	
	
	
	
	
}


/* ******************** ¸ð¹ÙÀÏ (~500) ******************** */
@media screen and (max-width: 500px), print{
	
	/* »óÇ°¸®½ºÆ® */
	.product-list>ul>li {width:100%; margin-top:10px; margin-left:0 !important;}
	
}















