/* BASIC css start */
.menu_on {height:100%; overflow:hidden;}
.menu_off {height:auto; overflow:initial;}
*:focus{outline:none !important;}

#header{width:100%;  z-index:10;}
#header .headerbg { display:none; position:fixed; width:100%; height:60px; text-align:center; z-index:1; }
#header .gnb { display:block; position:relative; width:100%; height:60px; text-align:center; z-index:2;  }
#header .gnb .inner_wrap{display:block; position:relative; width:100%; height:60px; text-align:center; background:rgba(255,255,255,0); -webkit-background:rgba(255,255,255,0);  z-index:2; }
#header .gnb .inner_wrap.headerfixed { position:fixed !important; top:0; background:rgba(255,255,255,1); -webkit-background:rgba(255,255,255,0.5);  z-index:2; }

#header .headerTop a .fa { background:none}
#header #btn_allcategory { }
#header #btn_allcategory img{ }

#header #logo {display:table; position:relative; width:50%; height:60px; margin:0 auto; text-align:center; vertical-align:middle; z-index:0;}
#header #logo h1.logo { display:table-cell; width:100%; height:60px; line-height:60px; margin:0 auto; text-align:center; vertical-align:middle; }
#header #logo h1:before { content: ''; display: block; clear: both; vertical-align: middle; }
#header #logo h1.logo a { display:block;padding:0; text-align:center; vertical-align:middle; content:'';}
#header #logo h1.logo img { display: block; max-width:80%; max-height:50px; margin: 0 auto; padding:0px; text-align:center; vertical-align: middle; }

#header .headerLeft { position:absolute; left:0; top:0;}
#header .headerLeft a{display:block; margin:18px;}
#header .headerLeft img{display:block;width:24px;}
#header .headerRight { position:absolute; right:0; top:0;}
#header .headerRight a{display:inline-block; margin:18px 5px;}
#header .headerRight img{width:24px;}
#header .headerRight .cart {position:relative;}
#header .headerRight .cart span { display:block; position:absolute; top:-7px; right:-12px; width:20px; height:20px; line-height:20px;
								  background-color:rgba(0,0,0,.5); color:#fff; border-radius:10px; text-align: center; }

#header .search { position:absolute; top:100%; left:0; right:0; width:100%; height:40px; background:rgba(0,0,0,0.9); text-align:center; display:none; z-index:10;}
#header .search .searchBox { display:block; float:left; width:100%; height:40px; }
#header .search .searchBox input {width:80%; float:left; height:40px; line-height:40px; font-size:16px; border:0px none; margin-top: 0; padding:0 0 0 5px; background-color:transparent; color:#FFFFFF;}
#header .search .searchBox #keyword:focus{ border:0; background-color:transparent; }
#header .search .btn_search { line-height:20px; padding:10px; float:right; color:#fff; font-size:1.2em; text-align:center; color:#FFFFFF;}

#header .headerfixed{ position: fixed !important; top: 0; *left: 0; z-index: 9999;}


.main-link-wrap {width:100%;background:rgba(175,23,24,1);display:table;  }
.main-link-wrap span {display:table-cell;width:25%;text-align:center;line-height:30px;height:30px;font-size:11px;font-weight:normal;}
.main-link-wrap span a {color:#fff;}

#navi { display: block; position:relative; width: 100%; text-align: center; z-index:0; /*background:#FFFFFF;*/ clear:both; }
#navi:after, #navi li:after, #navi li a:after {content:''; display:block; clear:both;}
#navi nav{display:block; position:relative; width:100%; text-align:center; }
#navi nav ul { display:block; position:relative; float:left; width:100%; padding-top:1px; text-align:center; overflow:hidden;  }
#navi nav ul li { display: inline-block; float: left; position:relative; width: 25%; padding: 0; margin: -1px -1px 0 0;  border: 1px solid #e4e2e2; border-left-width:0; }
#navi nav ul li a { display:block; height: 35px; line-height: 35px;  color: #414141; font-size:1em; white-space:nowrap;  margin:0 0px;}


/* Ä«Å×°í¸® */
#mask { width: 100%; height: 100%; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #3c3c3c; z-index: 1000; display: none; opacity: 0.8; }
#aside { display:block; position:fixed; left:-80%; top:0; bottom:0; width:80%; background-color:#fff; overflow-y:auto; 
		-webkit-overflow-scrolling: touch; z-index:1001; }
#aside.active{ display:block;  left:0;}
#aside .btnclose{ display:none; position:fixed; top:20px; left: 80%; margin-left:10px;}

#aside .side_header{display:block; float:left; width:100%; }
#aside .side_header .logo{display:inline-block; float:left; width:40%; margin:10px; }
#aside .side_header .logo a{display:block; width:100%; }
#aside .side_header .logo img{display:block; height:20px; }

#aside .side_header .link{display:inline-block; float:right; margin:10px; } 
#aside .side_header .link li{display:inline-block; position:relative; float:left; margin-left:10px; }
#aside .side_header .link li span{display:block; font-size:1.5em; color:#000000; line-height:20px;}
#aside .side_header .link li span.user_basket_quantity{ position:absolute; left:-10px; top:-5px; width:14px; height:14px; line-height:14px; text-align:center;
														color:#ffffff; font-size:0.7em; background:#222222; border-radius:100%; }

#aside .membership { display:block; float:left; width:100%; padding:0; background:#f9f9f9; border-top:1px solid #efefef; border-bottom:1px solid #efefef;  }
#aside .membership .member-btn {display: table; width:90%; margin:0 auto; padding:20px 0 15px; text-align:center; background-color:transparent;}
#aside .membership .member-btn .btnbox { display:table; width:100%; text-align:center;}
#aside .membership .member-btn-in{display: table-cell; width:50%; vertical-align: middle;padding: 0 5px;}
#aside .membership .member-btn .msg { display:block; padding:5px 15px; font-size:0.7em; color:#808080; }
#aside .membership .member-btn .msg .state { display:block; color:#000; font-weight:normal;}
		   
#aside .membership .member-btn-in:first-child{padding: 0 5px 0 0;}
#aside .membership .member-btn-in+.member-btn-in{padding: 0 0 0 5px;}
#aside .membership .member-btn-in a{display: block; font-size: 14px; background: #242424; color: #fff; text-align: center; height: 39px; line-height: 39px; }
#aside .membership .subbtn a { background: #242424; }

#aside .side_lnb { display:block; float:left; width:100%; padding:10px 0 0; }
#aside .side_lnb :after{content:''; display:block; clear:both;}

#aside .side_lnb ul{ display:block; width:90%; margin:0 auto 10px; text-align:center;}
#aside .side_lnb ul li{display:inline; float:left; position:relative; width:25%; height:50%; text-align:center;}
#aside .side_lnb a { display:block; width:52px; height:52px; margin:2px auto;  border:1px solid  #cccccc;}
#aside .side_lnb a span{ display:block; padding:5px 0; text-align:center; white-space:nowrap; font-size:1.8em; color:#444444; }
#aside .side_lnb span.ico{ width:20px; margin:0 auto; padding:10px; vertical-align:middle; -webkit-border-radius:20px; border-radius:20px; background:#FFF;}
#aside .side_lnb img { display:block; width:auto; height:20px; margin:0 auto; vertical-align:middle;}

.categorywrap { display:block; width:90%; margin:0 auto; text-align:center;}

aside .asideTop { display:table; width:100%; margin:0 auto; text-align:center;}
aside .asideTop a { display:table-cell; position:relative; background:#f9f9f9;}
aside .asideTop a.act { background:#FFFFFF;}
aside .asideTop a span { display:block; height:38px; line-height:38px; margin-left:-1px; color:#cccccc; border:1px solid #dddddd; }
aside .asideTop a.act span {   height:36px; line-height:36px; color:#222222; border-top:3px solid #222222; border-bottom:0; }
aside nav{ display:block; padding:5px;}
aside nav li { position:relative;}
aside nav li a {display: block; height: 35px; line-height:35px; padding:0 0 0 10px; margin-right: 40px; overflow: hidden; text-align:left; text-overflow: ellipsis; white-space: nowrap;}
aside nav li .fa {position: absolute; top:0; right: 0; width: 40px; text-align: center; height: 35px; line-height:35px;}
aside nav li > ul { display:none;  /*border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;*/ background-color:#f4f4f4; }
aside nav li > ul > li { }
aside nav li > ul > li:first-child {}
aside nav li > ul > li a {padding:0 40px 0 20px; margin: 0;}
aside nav li > ul > li > ul { /*border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;*/ background-color:#f9f9f9; }
aside nav li > ul > li > ul > li {}
aside nav li > ul > li > ul > li a {padding:0 0 0 30px; margin: 0; }
aside .navCategory{}
aside .navCommunity {display:none;}
aside .navMypage {display:none;}
aside .navCategory:after,
aside .navCommunity:after,
aside .navMypage:after{ content:''; display:block; clear:both; }
aside .navCategory,
aside .navCommunity,
aside .navMypage {border:1px solid #dddddd; border-top:0; margin-top:-1px;}



/**°í°´¼¾ÅÍ**/
#aside .cscenter { display:block; float:left; width:100%; margin:10px auto; text-align:left; vertical-align:top;}
#aside .cscenter:after { content:''; display:block; clear:both;}
#aside .cscenter h3 { display:block; width:100%; text-align:left; padding:0 0 10px; font-size:12px; }
#aside .cscenter .inbox{ display:block; padding:10px 20px; border:1px solid #eeeeee;}
#aside .cscenter .inbox:after{content:''; display:block; clear:both;}

#aside .callcenter { display:block; margin:10px;  vertical-align:top; }
#aside .callcenter dd.phone a{ font-size:1.5em; font-weight:bold; }
#aside .callnumber{ display:block; clear:both; margin:10px 10px 0; padding:10px; color:#000000; text-align:center; border:1px solid #000000; }
#aside .callnumber span{display:inline-block; width:14px; margin-right:10px;}
#aside .callnumber span img{display:block; width:100%; vertical-align:middle;}
#aside .cscenter dl,
#aside .cscenter dd,
#aside .cscenter dt { display:block; width:100%; text-align:left; font-size:0.9em; line-height:1.5em; }
#aside .cscenter dt {font-weight:bold; }
#aside .cscenter dl {}
#aside .bankinfo { display:block; margin:10px; vertical-align:top; }
#aside .cscenter .bank{margin-right:5px;}
#aside .cscenter .bank, 
#aside .bankinfo .account { display:inline-block; border:0;}

#aside .bankinfo > a, #aside .callcenter > a{display:block; width:100%; margin:10px auto 0; padding:10px 0;  text-align:left; color:#FFF; }

/* BASIC css end */