.detail { cursor:pointer; }
.detail:hover { text-decoration: underline; font-weight: bold; }


.contents {  
    background-color:white;
    padding:20px 30px 40px;
    overflow:auto;
    max-width:1200px;
}

#buytab .buytab__wrap {
    max-width:1200px;
}

@media (max-width:767px) { 
    .contents { background-color: white; padding: 20px 15px 40px; overflow: auto; max-width: none; }   
}

.pagetitle__wrap {position: relative;height: 43px;}
.title {
    font-size:20px; 
    margin-bottom:10px; 
    font-weight: bold;
    float:left;
}

/*search box*/
@media (min-width:768px) {
.search__result {width:100%;margin:0 auto;display:inline-block;padding:0px;margin-bottom:10px;border-top: 3px solid #5e5e5e;}
.search__result__wrap {}
.search__wordbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;}
.search__brandbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;}
.search__detailbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;}
.search__oribox, .search__checklist {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;}
.search__conditbox {display:flex; border-bottom: 2px solid #aaa;padding:5px 5px;background:#edfdf0;}
.search__checklist input[type=checkbox] { vertical-align:text-top; }
.search__checklist label {margin-left:5px;}


.listbox__item {float:left; width:150px; font-size:14px;font-weight:600;}
.listbox__cont {width:calc(100% - 150px);float:none;font-size:14px;} 
.listbox__cont span {width: 25%;display: block;float: left;font-size: 14px;line-height: 2; cursor:pointer; } 
.listbox__cont span.active { font-weight:bold; }

.cont__word {}
.cont__word span {}
.cont__brand {}
.cont__brand span {}
.cont__detail {}
.cont__detail  span{}
.cont__ori{}
.cont__ori span {}
.cont__condit{}
.cont__condit span{}
.listbox__cont cont__condit {border:1px solid #222; border-radius:5px;}

.cont__condit > span {font-size:13px; border:0px solid #5f6b7d;border-radius:5px;padding:0px 5px;background:#5f6b7d;color:#fff;width:auto; margin-right:15px;}
.cont__condit span > span {font-size:13px; border:0px solid #5f6b7d;border-radius:5px;padding:0px 5px;background:#5f6b7d;color:#fff;width:auto; margin-right:0px;}
/* .cont__condit span:after {content:'X'; font-weight:400;padding:0 5px 0 15px;} */

.cont__condit > span > i {
    float:right;
    margin-bottom: 7px;
    margin-right: 3px;
    margin-top: 7px;
    }

}

@media (max-width:767px) {
.search__result {width:100%;margin:0 auto;display:inline-block;padding:0px;margin-bottom:20px;border-top: 3px solid #5e5e5e;}
.search__result__wrap {}
.search__wordbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;flex-direction:column;}
.search__brandbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;flex-direction:column;}
.search__detailbox {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;flex-direction:column;}
.search__oribox,.search__checklist {display:flex; border-bottom: 1px solid #d2d2d2;padding:5px 5px;flex-direction:column;}
.search__conditbox {display:flex; border-bottom: 2px solid #aaa;padding:5px 5px;background:#edfdf0;flex-direction:column;}


.listbox__item {float:none;width:100%;font-size:15px;font-weight:800;margin-bottom:0px}
.listbox__cont {width:100%;float:none;font-size:14px;} 
.listbox__cont span {float: left;font-size: 14px; line-height: 1.7;margin: 0px 10px;} 

.cont__word {}
.cont__word span {}
.cont__brand {}
.cont__brand span {}
.cont__detail {}
.cont__detail  span{}
.cont__ori{}
.cont__ori span {}
.cont__condit{}
.cont__condit span{font-size:13px; border:0px solid #5f6b7d;border-radius:5px;padding:2px 5px;background:#5f6b7d;color:#fff;}
.cont__condit span:after {content:'X'; font-weight:400;padding:0 5px 0 15px;}
}

/*search box END*/

.nolistinfo{
    padding-left: 0px!important;
    text-align: center!important;
    background: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #d2d2d2;
    clear:both;
}


/* select */

.selectbox {
width: 132px;
padding: 1px 5px;
border: 1px solid #999;
font-family: NanumGothic;
font-weight:400;
font-size:12px;
background: url('/images/arrow.png') no-repeat 95% 50%;
border-radius: 5px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
float:right;
}

select#listSize::-ms-expand, select.selectbox::-ms-expand  {
    display: none;
}
.hitsbox{font-size:14px;float:left;margin-top:10px; margin-bottom:5px;}
.listsizewrap {float:right;margin-top:10px; margin-bottom:5px;}
.btn_align_wrap {float:right;margin-top:10px; margin-bottom:5px;padding:0 5px;}
#hits{font-size:16px;font-weight:800;}


.sortbtn {padding:1px 5px;color:#707070;font-size:12px;font-weight:800;background:#fff;border:0px solid #aaa;border-radius:5px;}
.sortbtn.active { background-color:#ccc; }


/* select END */

#prodpage{margin:0 auto;text-align:center;margin:15px 0;}
#prodpage ul{text-align:center;font-size:14px;letter-spacing:2px;}
#prodpage ul strong {padding:5px 10px 6px 12px;border:0px solid #707070; background:#04bf71;color:#fff;margin:0 3px;border-radius:5px;}
#prodpage ul a {padding:5px 10px 6px 12px;border:0px solid #707070;color:#757575;margin:0 3px;}


input.qtyminus {width:25px;height:25px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyminus[type='button']:hover{background:#777;color:#fff;}
input.qtyminus[type='button'] {color:#707070;width:25px;font-size:20px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}
input.qtyplus {width:25px;height:25px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyplus[type='button']:hover{background:#777;color:#fff;}
input.qtyplus[type='button'] {color:#707070;width:25px;font-size:20px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}


 /*******************************************************************/
 
#prodpage{margin:0 auto;text-align:center;margin:15px 0;}
#prodpage ul{text-align:center;font-size:14px;letter-spacing:2px;}
#prodpage ul strong {padding:5px 10px 6px 12px;border:0px solid #707070; background:#04bf71;color:#fff;margin:0 3px;border-radius:5px;}
#prodpage ul a {padding:5px 10px 6px 12px;border:0px solid #707070;color:#757575;margin:0 3px;}

input[type=checkbox] {width:15px; height:15px;}
input.qtyminus {width:20px;height:20px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyminus[type='button']:hover{background:#777;color:#fff;}
input.qtyminus[type='button'] {color:#707070;width:20px;font-size:18px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}
input.qtyplus {width:20px;height:20px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyplus[type='button']:hover{background:#777;color:#fff;}
input.qtyplus[type='button'] {color:#707070;width:20px;font-size:18px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}

.qtyvalue {
    width:40px;
    height:20px;
    border:1px solid #d2d2d2;
    text-align: center;
    font-weight:700;
    margin:0px 2px;
}
.qtyvalue:focus{outline:2px solid #318c26;background:#edfdf0;}

.itemname {font-weight:700;font-size:13px;color:
               ;letter-spacing:-1px;}
.qtyprice {font-size:13px;font-weight:700;color:#343a40;}

.vtc {display: flex; align-content: center; align-items: center;}

.prodlist_container > div, .prodlist_head_container > div { border-right:1px solid #d0d0d0; border-bottom:1px solid #d0d0d0; }
.prodlist_container > div.vtli11, .prodlist_head_container > div.vtli11 { border-right:none; }

@media (min-width:1100px) {
.prodlist_container {border-bottom:1px solid #bccbff; padding:0px 0;}
#prod_list .prodlist_container:last-child { border-bottom-color:#1f6d3a; }
.prodlist_head_container {border-top:2px solid #1f6d3a; border-bottom:1px solid #1f6d3a;text-align:center!important; justify-content: center;}
.prodlist_head_container > div { background:#f3fff7;/*border:0px solid #bccbff;*/font-weight:700;text-align:center!important; justify-content: center;}

.prodlist_container > div {padding:3px 5px;width: 100%;letter-spacing:-0.5px;margin-top:0px;margin-left:0px;}

.prodlist_container {display:grid;display:-ms-grid; -ms-grid-columns:40px 60px 1fr 1fr 85px 70px 80px 75px 100px 110px 40px;  grid-template-columns:40px 60px 1fr 1fr 85px 70px 80px 75px 100px 110px 40px; width: 100%;border-collapse:collapse; min-width: 828px;}
.prodlist_container:hover {background:#fef3ed;}
.prodlist_container:nth-of-type(2n+2) {background:#edfdf0;}
.prodlist_container:nth-of-type(2n+2):hover {background:#fef3ed;}

.vtli1 {grid-row:span 2; -ms-grid-row-span:2; padding:0!important;  justify-content: center; -ms-grid-row:1; -ms-grid-column: 1;}
.vtli2 {grid-row:span 2; -ms-grid-row-span:2; text-align:center;padding:0!important;  justify-content: center; -ms-grid-row:1; -ms-grid-column: 2;}
.vtli3 {-ms-grid-row:1; -ms-grid-column: 3;}
.vtli4 {-ms-grid-row:1; -ms-grid-column: 4; }
.vtli5{ justify-content: center;-ms-grid-row:1; -ms-grid-column: 5;}
.vtli6{ justify-content: center;-ms-grid-row:1; -ms-grid-column: 6;}
.vtli7{ justify-content: center;-ms-grid-row:1; -ms-grid-column: 7;}
.vtli8{justify-content: flex-end;-ms-grid-row:1; -ms-grid-column: 8;}
.vtli9{justify-content: flex-end;-ms-grid-row:1; -ms-grid-column: 9;}
.vtli10{justify-content: center;-ms-grid-row:1; -ms-grid-column: 10;}
.vtli11{grid-row:span 2; -ms-grid-row-span:2; padding:0!important;  justify-content: center;-ms-grid-row:1; -ms-grid-column: 11;}
.vtli12{-ms-grid-row:2; -ms-grid-column: 3;}
.vtli13{-ms-grid-row:2; -ms-grid-column: 4;}
.vtli14{ justify-content: center;-ms-grid-row:2; -ms-grid-column: 5;}
.vtli15{ justify-content: center;-ms-grid-row:2; -ms-grid-column: 6;}
.vtli16{ justify-content: center;-ms-grid-row:2; -ms-grid-column: 7;}
.vtli17{justify-content: flex-end;-ms-grid-row:2; -ms-grid-column: 8;}
.vtli18{justify-content: flex-end;-ms-grid-row:2; -ms-grid-column: 9;}
.vtli19{-ms-grid-row:2; -ms-grid-column: 10;}

.itemchk + label {display:none;}
}

@media (min-width:768px) and (max-width:1099px) {
.prodlist_container {border-bottom:1px solid #d2d2d2;padding:0px 0;}
.prodlist_head_container {border-top:2px solid #1f6d3a; border-bottom:1px solid #1f6d3a;text-align:center!important; justify-content: center;}
.prodlist_head_container > div { background:#f3fff7;font-weight:700;text-align:center!important; justify-content: center;}

.prodlist_container > div {padding:3px 5px;width: 100%;letter-spacing:-0.5px;margin-top:0px;margin-left:0px;}

.prodlist_container {display:grid;
                     display:-ms-grid;
                     -ms-grid-columns:40px 50px 1fr 1fr 1fr 1fr 40px;
                     grid-template-columns:40px 50px 1fr 1fr 1fr 1fr 40px; width: 100%;border-collapse:collapse;}
.prodlist_container:hover {background:#fef3ed;}
.prod1list_container:nth-of-type(2n+2) {background:#edfdf0;}
.prodlist_container:nth-of-type(2n+2):hover {background:#fef3ed;}


.vtli1 {grid-row:span 4;-ms-grid-row-span:4; padding:0!important;  justify-content: center;-ms-grid-row:1; -ms-grid-column: 1; order:1;}
.vtli2 {grid-row:span 4;-ms-grid-row-span:4; text-align:center;padding:0!important;justify-content: center;-ms-grid-row: 1; -ms-grid-column: 2;order:2;}
.vtli3 { -ms-grid-row: 1;-ms-grid-column: 3;order:3;}
.vtli4 { -ms-grid-row: 2; -ms-grid-column: 3; order:8;}
.vtli5{ justify-content: center; -ms-grid-row: 1; -ms-grid-column: 4;order:4;}
.vtli6{ justify-content: center; -ms-grid-row: 1; -ms-grid-column: 6; order:6;}
.vtli7{ justify-content: center; -ms-grid-row: 2; -ms-grid-column: 4; order:9;}
.vtli8{justify-content: flex-end; -ms-grid-row: 2; -ms-grid-column: 5; order:10;}
.vtli9{justify-content: flex-end; -ms-grid-row: 1; -ms-grid-column: 5; order:5;}
.vtli10{justify-content: center; -ms-grid-row: 3; -ms-grid-column: 6; order:15;}
.vtli11{grid-row:span 4;-ms-grid-row-span:4; padding:0!important;  justify-content: center; -ms-grid-row: 1; -ms-grid-column: 7; order:7;}
.vtli12{-ms-grid-row: 3; -ms-grid-column: 3; order:12;}
.vtli13{-ms-grid-row: 4; -ms-grid-column: 3; order:16;}
.vtli14{ justify-content: center; -ms-grid-row: 4; -ms-grid-column: 4; order:17;}
.vtli15{ justify-content: center; -ms-grid-row: 2; -ms-grid-column: 6; order:11;}
.vtli16{ justify-content: center; -ms-grid-row: 3; -ms-grid-column: 4; order:13;}
.vtli17{justify-content: flex-end; -ms-grid-row: 3; -ms-grid-column: 5; order:14;}
.vtli18{justify-content: flex-end; -ms-grid-row: 4; -ms-grid-column: 5; order:18;}
.vtli19{ -ms-grid-row: 4; -ms-grid-column: 6; order:19;}


.itemchk + label {display:none;}
}


/* list mobile */
@media (max-width:767px) {
    .contents { background-color: white; padding: 20px 15px 40px; overflow: auto; /* min-width: 640px; */ max-width: none; }

.prodlist_container {border-bottom:1px solid #d2d2d2;padding:0px 0;}
.prodlist_head_container {display:none!important;}
.prodlist_head_container > div { background:#d1deff;border:1px solid #bccbff;font-weight:700;text-align:center!important; justify-content: center;}

.prodlist_container > div {padding:3px 5px;width: 100%;letter-spacing:-0.5px;margin-top:0px;margin-left:0px;}
.prodlist_container > div, .prodlist_head_container > div { border-right:0px; border-bottom:0px; }
.prodlist_container {display:grid; display:-ms-grid; -ms-grid-columns:1fr 1fr; grid-template-columns:1fr 1fr; width: 100%;border-collapse:collapse; border-top: 2px solid #1f6d3a; }
.prodlist_container:hover {background:#fef3ed;}
.prodlist_container:nth-of-type(2n+2) {background:#edfdf0;}
.prodlist_container:nth-of-type(2n+2):hover {background:#fef3ed;}

.vtli1 {display:none;} /* 순번 */
.vtli2 {grid-row:span 2; -ms-grid-row-span:2; order:1;-ms-grid-row:1; -ms-grid-column: 1;} /* 이미지 */
.vtli3 {order:2; margin-left:calc(90px - 100%)!important;-ms-grid-row:1; -ms-grid-column: 2;} /* 상품명 */
.vtli4 {order:4;-ms-grid-row:3; -ms-grid-column: 1; } /* 상품코드 */
.vtli5 {order:8; grid-column:span 2; -ms-grid-column-span:2;-ms-grid-row:6; -ms-grid-column: 1; }  /* 브랜드 */
.vtli6 {order:9;-ms-grid-row:7; -ms-grid-column: 1;} /* in/out */
.vtli7 {order:11;-ms-grid-row:8; -ms-grid-column: 1;} /* 재고 */
.vtli8 {order:13;-ms-grid-row:9; -ms-grid-column: 1;} /* 기준가격 */
.vtli9 {order:15;-ms-grid-row:10; -ms-grid-column: 1;} /* 공급단가 */
.vtli10 {order:18;-ms-grid-row:11; -ms-grid-column: 2;} /* 입력수량 */
.vtli11{ order:17;-ms-grid-row:11; -ms-grid-column: 1;} /* check */
.vtli12 {order:6; grid-column:span 2;-ms-grid-column-span:2;-ms-grid-row:4; -ms-grid-column: 1; } /* 품번 */
.vtli13 {order:7; grid-column:span 2;-ms-grid-column-span:2;-ms-grid-row:5; -ms-grid-column: 1;} /* 규격 */
.vtli14 {order:3; margin-left:calc(90px - 100%)!important;-ms-grid-row:2; -ms-grid-column: 2;} /* e-book */
.vtli15 {order:10;-ms-grid-row:7; -ms-grid-column:2;} /* 주문단위 */
.vtli16 {order:12;-ms-grid-row:8; -ms-grid-column: 2;} /* 납기 */
.vtli17 {order:14;-ms-grid-row:9; -ms-grid-column: 2;} /* 적용률 */
.vtli18 {order:16;-ms-grid-row:10; -ms-grid-column: 2;} /* 금액 */
.vtli19 {order:5;-ms-grid-row:3; -ms-grid-column: 2;} /* 행사구분 */

.vtli4:before {content:"상품코드 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli5:before {content:"브랜드 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli6:before {content:"IN/OUT "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli7:before {content:"가용재고 ";  width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli8:before {content:"기준가격 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli9:before {content:"공급단가 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli12:before {content:"품번 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli13:before {content:"규격 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli15:before {content:"주문단위 ";  width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli16:before {content:"납기 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli17:before {content:"적용률 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400;text-align:left;}
.vtli18:before {content:"금액 "; width: 60px; color: #212121; font-size: 12px;font-weight: 400; text-align:left;}

.vtli11 input[type=checkbox] {display:none;}
.vtli11 label {text-align:center;font-size:12px;margin-top:5px;}
.vtli11 input[type=checkbox] + label {width:100px;height:25px;background:#fff;color:#0a2558; border:1px solid #0a2558;border-radius:5px;text-align:center;padding:0px 0px;font-weight:400;}
.vtli11 input[type=checkbox]:checked +label {color:#fff;background:#0a2558;}


input.qtyminus {width:25px;height:25px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyminus[type='button']:hover{background:#777;color:#fff;}
input.qtyminus[type='button'] {color:#707070;width:25px;font-size:18px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}
input.qtyplus {width:25px;height:25px;line-height:0;box-sizing:border-box;vertical-align:top;}
input.qtyplus[type='button']:hover{background:#777;color:#fff;}
input.qtyplus[type='button'] {color:#707070;width:25px;font-size:18px;font-family:fantasy;background:#f2f2f2;border:1px solid #d2d2d2;}

.qtyvalue {
    width:40px;
    height:25px;
    border:1px solid #d2d2d2;
    text-align: center;
    font-weight:700;
    margin:0px 2px;
}

.hitsbox{font-size:14px;float:none;;margin-top:10px; margin-bottom:5px;}
.listsizewrap {float:left;margin-top:10px; margin-bottom:5px;}
.btn_align_wrap {float:left;margin-top:10px; margin-bottom:5px;padding:0 5px;}

.nolistinfo {border-top:2px solid #d2d2d2;}
}