#Contents.listWrap{max-width:1220px;padding-bottom:50px;margin:0 auto}


.mcodeListWrap{padding:0 10px;margin-bottom:30px}

.mcodeList{border-top:1px solid #DFDFDF}
.mcodeList::after{content:"";display:block;clear:both}

.mcodeList a{display:block;float:left;background-color:#fff;font-size:14px;height:40px;line-height:39px;text-align:center;border-bottom:1px solid #DFDFDF;border-right:1px solid #DFDFDF}
.mcodeList a.first{border-left:1px solid #DFDFDF}
.mcodeList a.active{background-color:#D42F2F;font-weight:700;color:#fff}


.listTop{position:relative;padding:0 10px;margin-bottom:30px}
.listTop::after{content:"";display:block;clear:both}

.listTop .goodsCount{font-size:14px;height:35px;line-height:35px;padding:0 5px;border-bottom:1px solid #DFDFDF}


.listBody{position:relative}
.listBody::after{content:"";display:block;clear:both}

.blankGoods{margin:50px 0;text-align:center}

.listBody .colsWrap{width:100%;max-width:1220px;margin:0 auto}
.listBody .colsWrap::after{content:"";display:block;clear:both}
.listBody .colsWrap .cols{float:left;width:25%;padding:0 10px;margin-bottom:50px}

.listBody .colsWrap .cols a.linkCover{display:block;position:relative;width:100%;opacity:1;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;

	-webkit-transition:opacity .5s ease-in-out;
	transition:opacity .5s ease-in-out;

	-moz-box-shadow:0px 20px 20px -20px rgba(0, 0, 0, 0.7);
	-ms-box-shadow:0px 20px 20px -20px rgba(0, 0, 0, 0.7);
	-o-box-shadow:0px 20px 20px -20px rgba(0, 0, 0, 0.7);
	-webkit-box-shadow:0px 20px 20px -20px rgba(0, 0, 0, 0.7);
	box-shadow:0px 20px 20px -20px rgba(0, 0, 0, 0.7);
}

.listBody .colsWrap .cols a.linkCover .photo{margin-bottom:20px;border:1px solid #e4e4e4;overflow:hidden}
.listBody .colsWrap .cols a.linkCover .photo img{width:100%;
     -webkit-transition-duration:.6s;
     transition-duration:.6s;

}
.listBody .colsWrap .cols a.linkCover .photo > span{display:block;position:absolute;left:0;top:0;background:rgba(0,0,0,.6) no-repeat center center;width:100%;height:100%;opacity:0;
	-webkit-transition-duration:.3s;
	transition-duration:.3s;
}
.listBody .colsWrap .cols a.linkCover .photo > span:before,
.listBody .colsWrap .cols a.linkCover .photo > span:after{content:'';display:block;position:absolute;left:50%;top:50%;background:#fff;
	-webkit-transition-duration:.5s;
	transition-duration:.5s;
}
.listBody .colsWrap .cols a.linkCover .photo > span:before{width:0;height:1px;margin-left:-0}
.listBody .colsWrap .cols a.linkCover .photo > span:after{width:1px;height:0;margin-top:-0}

.listBody .colsWrap .cols a.linkCover:hover .photo img{
	-webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
	-ms-transform:scale(1.1,1.1);
	transform:scale(1.1,1.1);
}
.listBody .colsWrap .cols a.linkCover:hover .photo span{opacity:1}
.listBody .colsWrap .cols a.linkCover:hover .photo span:before{width:90px;margin-left:-45px}
.listBody .colsWrap .cols a.linkCover:hover .photo span:after{height:90px;margin-top:-45px}
.listBody .colsWrap .cols a.linkCover:hover p{opacity:0.4}
.listBody .colsWrap .cols a.linkCover:hover .catName{opacity:0}
.listBody .colsWrap .cols a.linkCover:hover .bx-caption{opacity:0}


/*  제품상세보기 페이지 */
.viewMain{position:relative;border-bottom:1px solid #DFDFDF}

.viewMainIn{position:relative;text-align:left;max-width:1220px;padding:50px 10px;margin:0 auto}
.viewMainIn::after{content:"";display:block;clear:both}


.viewMain .goodsName{position:relative;border-bottom:1px solid #d4d4d4;padding-bottom:30px;margin-bottom:50px}
.viewMain .goodsName h3{font-size:36px;font-weight:100;letter-spacing:-2px;line-height:1em !important;margin-right:20px}
.viewMain .goodsName .summury{font-size:14px;margin-top:10px}

.viewMain .goodsName .otherGoods{position:absolute;right:0;top:0;height:36px}
.viewMain .goodsName .otherGoods .btnList,
.viewMain .goodsName .otherGoods .prevArrow,
.viewMain .goodsName .otherGoods .nextArrow,
.viewMain .goodsName .otherGoods .prevEndArrow,
.viewMain .goodsName .otherGoods .nextEndArrow{display:block;float:left;background:#fff;font-size:24px;width:36px;height:36px;text-align:center;line-height:32px;border:1px solid #ddd}

.viewMain .goodsName .otherGoods .prevArrow,
.viewMain .goodsName .otherGoods .prevEndArrow{margin-right:-1px}
.viewMain .goodsName .otherGoods .prevArrow:hover{background:#eee}

.viewMain .goodsName .otherGoods .nextArrow,
.viewMain .goodsName .otherGoods .nextEndArrow{}
.viewMain .goodsName .otherGoods .nextArrow:hover{background:#eee}

.viewMain .goodsName .otherGoods .prevEndArrow,
.viewMain .goodsName .otherGoods .nextEndArrow{color:#ccc}

.viewMain .goodsName .otherGoods .btnList{margin-left:10px}

.viewMain .goodsName .otherGoods .prevArrow span,
.viewMain .goodsName .otherGoods .nextArrow span,
.viewMain .goodsName .otherGoods .prevEndArrow span,
.viewMain .goodsName .otherGoods .nextEndArrow span{display:block;width:100%px;height:100%;text-indent:-9000px}


.viewMain .goodsPhoto{float:left;position:relative;;width:-webkit-calc(100% - 400px);width:calc(100% - 400px)}
.viewMain .goodsPhoto img{width:100%}
.viewMain .goodsPhoto .bx-wrapper{margin:0 auto 30px auto;
	-moz-box-shadow:0 24px 65px 0 rgba(16,16,17,.13);
	-ms-box-shadow0 24px 65px 0 rgba(16,16,17,.13);
	-o-box-shadow:0 24px 65px 0 rgba(16,16,17,.13);
	-webkit-box-shadow:0 24px 65px 0 rgba(16,16,17,.13);
	box-shadow:0 24px 65px 0 rgba(16,16,17,.13);
}
.viewMain .goodsPhoto .bx-wrapper .bx-viewport{background:#fff}

#bx-pager{text-align:center;margin:10px 0 0 0}
#bx-pager a{display:inline-block;width:100px;border:1px solid #d4d4d4;margin:0 5px}
#bx-pager a.active{border:1px solid #ff0000}
#bx-pager a img{width:100%}


.viewMain .goodsInfo{float:left;position:relative;width:400px;padding-left:30px}
.viewMain .goodsInfo .colsWrap{position:relative;border-top:1px solid #ddd}
.viewMain .goodsInfo .colsWrap::after{content:"";display:block;clear:both}
.viewMain .goodsInfo .colsWrap .cols{background:#F8F6F4 none repeat scroll 0% 0%;border-bottom:1px solid #ddd}
.viewMain .goodsInfo .colsWrap .cols::after{content:"";display:block;clear:both}
.viewMain .goodsInfo .colsWrap .cols > div{float:left}
.viewMain .goodsInfo .colsWrap .cols .inputTitle{width:100px;text-align:left;line-height:40px;padding-left:10px}
.viewMain .goodsInfo .colsWrap .cols .inputBox{background:#fff none repeat scroll 0% 0%;position:relative;width:-webkit-calc(100% - 100px);width:calc(100% - 100px);height:40px;line-height:40px;padding:0px 10px}

.viewMain .goodsInfo .btnBox{height:40px;margin:30px 0}
.viewMain .goodsInfo .btnBox a{font-size:18px;color:#fff;width:100%;text-align:center;padding:10px 0}

.viewMain .goodsInfo .contactBox{position:relative;text-align:center;margin-bottom:50px}
.viewMain .goodsInfo .contactBox h4{margin-bottom:10px}
.viewMain .goodsInfo .contactBox h2{font-weight:100;}

.viewMain .goodsInfo .snsBox{position:relative;height:40px}
.viewMain .goodsInfo .snsBox ul{position:absolute;right:0;top:0}
.viewMain .goodsInfo .snsBox li{float:left;margin-left:5px}
.viewMain .goodsInfo .snsBox li a{display:block;width:40px;height:40px;border-radius:50%;overflow:hidden}
.viewMain .goodsInfo .snsBox li a img{width:100%}