/* BASIC css start */
#header {z-index:100;width:100%;position:relative;display:inline-block;background: #fff; margin-bottom:60px; }
#header .headerWrap{width:1020px; margin:0 auto}

/*»ó´Ü °íÁ¤½Ã*/
#header.fix { margin-top:-157px; position:fixed; top:0; left:0; right:0; z-index:200 ; background:#313131; display:none;}
#header.fix a{color:#fff}
#header.fix a i{color:#fff}
#header.fix div{color:#fff}
#header .headerGnb {position:relative;min-width:1020px;}
#header.fix .headerGnb .cateWrap .tmenu .depth2 { background:#313131 } 
#header.fix  .headerGnb .cateWrap .tmenu .depth2 li a:hover { color:#fff; text-decoration:underline }


#header .headerTop {    position: absolute;
    height: 32px;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3; background:#fafafa;}
#header .headerTop ul { float:right; margin:10px 0px 10px 40px; }
#header .headerTop ul li { position:relative; float:left; padding:0px 0 0 20px; }
#header .headerTop ul li:first-child {  }
#header .headerTop ul li a { font-size:12px; }
#header .headerTop ul li a:hover { text-decoration:none; }
#header .headerTop ul li a i{font-size:20px; vertical-align:middle }

#header .hdNotice {position: relative;width:500px;height: 27px;line-height:27px;overflow: hidden;float: left; padding: 6px 0; }
#header .hdNotice i{font-size:16px; vertical-align:middle}
#header .hdNotice dt {float: left;padding: 0 8px 0 10px;}
#header .hdNotice dt a {  }
#header .hdNotice dt .grBar {display:inline-block;margin: 0px 8px;width:1px;height: 11px;background: #828282;vertical-align: -1px;}
#header .hdNotice dd {position:relative;float: left;width: 250px;height: 27px;padding-right: 20px;}
#header .hdNotice dd ul{margin:0 !important;}
#header .hdNotice .hdNoticeBtn .prev {position: absolute;right:22px; top: 5px; background:#fff;    border: 1px solid #ddd; width: 20px; height: 14px; text-align: center;}
#header .hdNotice .hdNoticeBtn .next { position: absolute;right:0; top: 5px;background:#fff;    border: 1px solid #ddd; width: 20px; height: 14px; text-align: center;}



#header .headerMid {     position: relative;
    width: 1020px;
    height: 150px;
    margin-top: 25px;}
#header .headerMid .logoArea { position:absolute; left:0px; top:50px; z-index:10}
#header .headerMid .logoArea .logo a { font-size:40px; font-weight:bold; color:#2e2e2e; }
#header .headerMid .searchArea { position: relative;
    top: 70px;
    float:right;
    width: 340px;
    height: 40px;
    border: 2px solid #000;
    border-radius: 100px;
    overflow: hidden; }
#header .headerMid .searchArea .search { position:relative; width:340px; height:40px }
#header .headerMid .searchArea .search input { padding-left:10px; width:287px; height:39px; line-height:40px; border:none; background:#fff }
#header .headerMid .searchArea .search a { display:block; position:absolute; top:0; right:0;     width: 40px;  height: 40px;  background: #000;  line-height: 40px;  text-align: center;  }
#header .headerMid .searchArea .search a i{font-size:24px; vertical-align:middle; color:#fff;    padding-right: 40px;padding: 0 10px 0 8px;}



/* Ä«Å×°í¸® */
#header .headerGnb .cateWrap {
width: 730px;
    height: 30px;
    text-align: left;
    display: inline-block;
    float: left;
}
#header .headerGnb .cateWrap:after {content:"";display:block;clear:both;}
#header .headerGnb .cateWrap a:hover { }
#header .headerGnb .cateWrap .tmenu {position: relative;display: inline-block; padding: 0 30px 0 0;}
#header .headerGnb .cateWrap .tmenu a { font-size: 13px;
    line-height: 60px; }
#header .headerGnb .cateWrap .tmenu .depth2 { display:none;     position: absolute;
    background: #fff;
    top: 53px;
    left: 41%;
    width: 145px;
    margin-left: -80px;
    padding: 10px 0;
    z-index: 97;
    text-align: center;}
#header .headerGnb .cateWrap .tmenu .depth2 li a {font-size: 14px; line-height: 26px; }
#header .headerGnb .cateWrap .tmenu .depth2 li a:hover { color:#2d2d2d; text-decoration:underline }

#header .headerGnb .menuAllBtn { position:absolute; top:12px; right:0px; width:100px; height:50px;  text-align:center; cursor:pointer; font-size:30px;line-height: 30px;}
#header .headerGnb .menuAllBtn em{font-size:10px !important; vertical-align:top}
#header .headerGnb .menuAllBtn i{ font-size:30px; }
#header .headerGnb .menuUser{position:absolute; top:11px; right:120px;width:50px; height:50px; font-size:30px; text-align:center; cursor:pointer  }
#header .headerGnb .menuUser a i{ font-size:30px; }
#header .headerGnb .cartCount {
position: absolute;
    top: 15px;
    right: 170px;
    width: 50px;
    height: 50px;
    font-size: 30px;
    text-align: center;
    cursor: pointer;
}
#header .headerGnb .cartCount a { text-decoration:none;  color: #2e2e2e; display:block;}
#header .headerGnb .cartCount a:hover { }
#header .headerGnb .cartCount a i { font-size:30px; }
#header .headerGnb .cartCount a span { background: #b77c5a; color: #fff; width: 20px; height: 20px; position: absolute; right: 3px; line-height: 20px; text-align: center;  border-radius: 10px;}

/* À§·Î°¡±â ¹öÆ° */
.topBtn { position:fixed;bottom: 20px;right:23px; z-index:200; display:block; width:48px; height:48px; background-color:#2a2a2a; text-align:center; }
.topBtn i { vertical-align:top; margin-top:10px;color:#8b8b8b; font-size:28px }
.topBtn:hover {background-color:rgb(197,197,197,0.8); color:#000; }

/* ÀüÃ¼¸Þ´º ·¹ÀÌ¾î */
.allMenu {display:none;background:#fff;position: fixed;left: 0;right: 0;top: 0;bottom: 0;width: 100%;height: 100%;z-index: 201;}
.allMenu .allMenuWrap {width: 75%;margin: 0 auto;}
.allMenu .allMenuWrap a:hover {text-decoration: underline; }
.allMenu .allMenuWrap h3 {font-size: 16px;font-weight: bold;padding: 1% 0 0.5% 1%;}
.allMenu .allMenuWrap .closeBtn {display: block;margin: 4% 0 3%;font-size: 40px; text-align:center }
.allMenu .allMenuWrap .allMenuRow{position:relative; width:100%}
.allMenu .allMenuWrap .allMenuRow:after { display:block; clear:both; content:'' }
.allMenu .allMenuWrap .allMenuList { *zoom:1; margin-left: 200px;}
.allMenu .allMenuWrap .allMenuList:after { display:block; clear:both; content:'' }
.allMenu .allMenuWrap .allMenuList dl {padding: 0 1% 3%;float:left;width: 17.6%;}
.allMenu .allMenuWrap .allMenuList dl dt {border-bottom: 1px solid #ddd;margin-bottom: 4px;}
.allMenu .allMenuWrap .allMenuList dl dt a {padding-left:7px;font-size:14px;height:30px;line-height:30px;}
.allMenu .allMenuWrap .allMenuList dl dd a {display: block;padding: 6px 0 3px 7px;color: #777; font-size:13px;}
.allMenu .allMenuWrap .allMenuList dl dd a:hover {color:#111;}
.allMenu .allMenuWrap .boardList:after { display:block; clear:both; content:''}
.allMenu .allMenuWrap .boardList li { float: left; padding: 0 1%; }
.allMenu .allMenuWrap .csInfo {padding: 2% 0 0 1%; text-align:center; font-size:13px;} 
.allMenu .allMenuWrap .csInfo span { padding: 0 0.5% } 


.allTitmenu{font-size: 16px; font-weight: bold;  color: #fff; background: #444; width: 168px; text-align: center;  padding: 10px 0px;  display: block;  vertical-align: top;  float: left;}
/* BASIC css end */

