/* BASIC css start */
#mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:200 }

/* header */
#header { position:relative; width:100%; background:#fff; z-index:100;min-width:1280px; }
#header.act { margin-top:-160px; position:fixed; top:0 }
#header .hdArea { height:35px; background:#fff; border-bottom:1px solid #ddd;}
#header .hdArea .hdTop { margin:0 auto; position:relative; width:1280px; height:28px }
#header .hdArea .hdTop .hdLeft { float:left; overflow:hidden }
#header .hdArea .hdTop .hdLeft ul li { position:relative; float:left; line-height:35px;  }
#header .hdArea .hdTop .hdLeft ul li a { display:block; padding:0 9px; color:#555; line-height:35px;font-size:11px;  }
#header .hdArea .hdTop .hdRight { float:right }
#header .hdArea .hdTop .hdRight ul li { position:relative; float:left }
#header .hdArea .hdTop .hdRight ul li a { display:block; padding:0 9px; color:#555;line-height:35px; font-size:11px; }

#header .hdMidArea { height:140px }
#header .hdMidArea .hdMiddle { margin:0 auto; position:relative; width:1280px }
#header .hdMidArea .hdMiddle .topLinks { padding-top:29px; overflow:hidden; *zoom:1 ;}
#header .hdMidArea .hdMiddle .topLinks:after { display:block; clear:both; content:'' }
#header .hdMidArea .hdMiddle .topLinks ul { margin-left:-1px; float:left; border-left:1px solid #dcdcdc }
#header .hdMidArea .hdMiddle .topLinks ul.first { margin-left:-9px ;padding-top:10px;overflow-y:hidden;}
#header .hdMidArea .hdMiddle .topLinks ul li { padding:0 8px; float:left; }
#header .hdMidArea .hdMiddle .topLinks ul li a { display:block; color:#686868; text-align:center; }
#header .hdMidArea .hdMiddle .topLinks ul li a .tx { display:block; }
#header .hdMidArea .hdMiddle .tlogo { position:absolute; top:17px; left:430px; overflow-y:hidden;}
#header .hdMidArea .hdMiddle .searchArea { position:absolute; top:58px; right:0; width:238px; height:40px; text-align:right; border:2px solid #333; }
#header .hdMidArea .hdMiddle .searchArea .MS_search_word { padding:0 5px; float:left; width:195px; height:40px; line-height:40px; border:none; vertical-align:top }
#header .hdMidArea .hdMiddle .searchArea a { display:inline-block; width:33px; height:40px; text-align:left; text-indent:-9999em; background:url(/design/nature4u/dcoms_freshfarm_pc/search_btn.gif) 100% 5px no-repeat;  }

#header .headerTop { margin:0 auto; position:relative; width:1280px; height:160px; *zoom:1 }
#header .headerTop:after { display:block; clear:both; content:'' }
#header .headerTop .tlogo { margin:0 210px; padding-top:30px; text-align:center }
#header .headerTop .searchArea { position:absolute; top:35px; right:0; width:204px; height:40px; border-bottom:1px solid #ddd;}
#header .headerTop .searchArea .search { position:relative; width:204px; height:40px }
#header .headerTop .searchArea .search input { padding-left:10px; width:164px; height:39px; line-height:40px; border:none; background:#fff }
#header .headerTop .searchArea .search a { display:block; position:absolute; top:0; right:0; width:30px; height:40px; text-indent:-9999em; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/btn_search.gif) 0 0 no-repeat }

/* 카테고리 */
.gnbArea { position: relative; width:100%; margin:0 auto; text-align: center; border-top: 1px solid #333; border-bottom: 1px solid #ddd; z-index:100;}
.gnbArea .gnb {position:fixed; top:203px;  zoom: 1; width:100%; min-width:1280px;height: 45px; margin:0 auto; background-color:rgba(255,255,255,1); text-align: center;border-top:1px solid #ddd;border-bottom:1px solid #333;}
.gnbArea .gnb:after { content: ''; display: block; clear: both; }
.gnbArea .gnb > ul {width:1280px; text-align: left;}
.gnbArea .gnb > li {position: relative; display: inline-block; padding:0 30px; }
.gnbArea .gnb > li:first-child {width:50px;background:#fff;padding:0px;}
.gnbArea .gnb > li > a { display: block;overflow: hidden; line-height: 45px; height:45px; font-size:14px; font-weight:400; text-align: center; }
.gnbArea .gnb > li > a:hover {  -webkit-transition:all 0.3s ease; transition:all 0.3s ease }
.gnbArea .gnb > li:hover a.gnbTit { text-decoration: none; color: #111;  }
.gnbArea .gnb > li dl {display: none; position: absolute; top: 45px; left:10px; zoom:1; overflow:hidden; padding:0px 0px; border:1px solid #bebebe; border-top: 0; background-color:rgba(255,255,255,1); text-align:left;-webkit-transition:all 0.3s ease; transition:all 0.3s ease }
.gnbArea .gnb > li dl dd { min-width: 180px; }
.gnbArea .gnb > li dl dd a { display: block; padding: 5px 20px;color:#333; font-size:13px; line-height: 20px; }
.gnbArea .gnb > li dl dd a:hover { background: #f5f5f5; color: #333; }
.gnbArea .gnb > li .xi-bars {line-height:45px;color:#333;margin-left:0px;font-size:24px;}

/* 전체카테고리 */
.menu { position:relative;  margin-top:-5px; width:1280px; height:550px;  overflow-x:hidden; background-color:rgba(255,255,255,1); padding-bottom:20px; border:1px solid #ddd; text-align:center;margin-left: auto; margin-right: auto; z-index:120;-webkit-transition:all 0.3s ease; transition:all 0.3s ease }
.lnb { margin: 35px 0px 10px 0px; display:block;float: left; width:150px; }
.lnb .ttl{ background:#ddd; height:25px;line-height: 25px;  }
.lnb li { padding: 0px 0; display:block; float: left; width:150px; text-align:left;margin-left:50px;}
.lnb li a { font-size: 12px;line-height: 20px;  }
.lnb li a:hover { color: #333; }


.join_point {position:absolute; top:20px; right:205px;  display:inline-block; min-width:55px; height:18px; line-height:18px; border-radius:3px; background:#333; text-align:center; font-size:10px; color:#fff; animation:join_point 1s linear infinite; z-index:999;}
.join_point .arrow {position:absolute; top:-10px; left:30%; margin-left:5px; color:#333;}
@keyframes join_point {0% {top:30px;} 50% {top:35px;} 100% {top:30px;}}

/* 탑배너 */
#dcoms_top_bn    {padding-bottom: 0px; margin: 0px auto; padding-left: 0px; width: 1200px; padding-right: 0px; height: 45px; padding-top: 0px; position:relative; z-index:1}
#top_left     {position: relative; margin: 0px 0px 0px 0px; width: 2000px; float: left; height: 45px; z-index:1; margin-left:-400px;}


/* 고정 이미지 배너 */
.t_fixedBnnr { position:relative; width:100%; min-width:1280px; height:45px; background:url(/design/nabiang/dcoms_pc/top_bn.jpg) center top no-repeat }
.t_fixedBnnr .inner { margin:0 auto; position:relative; width:1100px; text-align:center }
.t_fixedBnnr .inner .tx { padding-top:100px; font-size:16px; color:#fff; letter-spacing:16px }

/* BASIC css end */