/* 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 } 
#wrap { position: relative; } 
/* header */
#header { position:relative; width:100%; background:#fff; z-index:100 } 
#header .headerTnb { margin:0 auto; position:relative; width: 95%; max-width: 1200px; height:45px; *zoom:1 } 
#header .headerTnb:after { display:block; clear:both; content:'' } 
#header .headerTnb .tnbLeft { float:left } 
#header .headerTnb .tnbLeft li { padding-right:9px; float:left } 
#header .headerTnb .tnbLeft li a { display:block; height:45px; color:#757575; line-height:45px; font-size: 12px; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px; } 
#header .headerTnb .tnbLeft li a img { margin-right:7px; vertical-align: sub; } 
#header .headerTnb .tnbLeft li.noticeLine { padding-left:23px } 
#header .headerTnb .tnbLeft li.noticeLine p { padding-left:21px; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/ico_volume.gif) 0 17px no-repeat } 
#header .headerTnb .tnbLeft li.noticeLine p a { font-size:11px; color:#7a7a7a; line-height:49px; line-height:53px \0/IE8+9 } 
#header .headerTnb .tnbRight { float:right } 
#header .headerTnb .tnbRight li { padding-left:10px; float:left } 
#header .headerTnb .tnbRight li.joinicon { position:relative; } 
#header .headerTnb .tnbRight li a { display:block; height:45px; color: #757575; line-height: 45px; font-size: 12px; font-family: 'Noto Sans KR', sans-serif; } 
#header .headerTnb .tnbRight li a span { color: #955251; } 
#header .headerTop { margin:0 auto; position:relative; width: 95%; max-width:1280px; *zoom:1 } 
#header .headerTop:after { display:block; clear:both; content:'' } 
#header .headerTop .tlogo { margin:15px auto; text-align:center } 
#header .headerBottom { border-bottom: 1px solid #f0f0f0; } 
#header .headerBottom.header-scroll { position: fixed; top:0; width: 100%; background: #fff } 
#header .headerGnb { position: relative; width: 95%; max-width:1200px; margin: 0 auto; } 
#header .headerGnb:after { display:block; clear:both; content:'' } 
#header .headerGnb > div { float:left; height: 55px; line-height: 55px; } 
#header .headerGnb .allmenu { padding: 0 20px 0 0; border-bottom: 0; color: #000; font-size: 17px; font-family: 'Noto Sans KR', sans-serif; } 
#header .headerGnb .allmenu img { margin: 0 10px 0 0; vertical-align: sub; } 
#header .headerGnb .gnbInner { margin:0 auto; position:relative; width:785px } 
#header .headerGnb .gnbInner ul { *zoom:1; padding: 0 25px; } 
#header .headerGnb .gnbInner ul:after { display:block; clear:both; content:'' } 
#header .headerGnb .gnbInner ul li { margin:0 35px; position:relative; float:left } 
#header .headerGnb .gnbInner ul li a { display:block; font-size:17px; color:#000; white-space:nowrap; font-family: 'Noto Sans KR', sans-serif; line-height: 55px; } 
#header .headerGnb .gnbInner ul li.first { padding-left:0 } 
#header .headerGnb .gnbInner ul li.last { padding:0 0 0 40px } 
#header .headerGnb .gnbInner ul li dl { display:none; background: #fff;border: 1px solid #e5e5e5;box-sizing: border-box;text-align: center;padding: 10px;position: absolute;left: 50%;transform: translateX(-50%);} 
#header .headerGnb .gnbInner ul li dl dd {cursor: pointer;} 
#header .headerGnb .gnbInner ul li dl dd a {font-size: 14px;cursor:pointer;line-height: 1.25;padding: 8px;} 
#header .headerGnb .gnbInner ul li dl dd a:hover { font-weight:bold; } 
.basket { position: relative; } 
.basket span { display: block; position: absolute; top: 9px; right: -9px; width: 18px; height: 18px; line-height: 18px; border-radius: 50%; background: #ef5859; text-align: center; color: #fff; font-family: 'Noto Sans KR', sans-serif; font-size: 10px; } 
#header .headerBottom .searchArea { position:absolute; top:8px; right:0; width:250px; height:36px; line-height: 36px; background: #f0f0f0; border-radius: 20px; } 
#header .headerBottom .searchArea .search { position:relative; width:240px; height:36px } 
#header .headerBottom .searchArea .search input { padding-left:15px; width:188px; height:34px; line-height:34px; border:none; background:none } 
#header .headerGnb .hammenu { display: none; float: unset; padding: 0; position: absolute; top: 55px; left: 0; height: 435px; background: #fff; border: 1px solid #e5e5e5; box-sizing: border-box; } 
.hammenu .depth1 { width: 194px; height: 424px; padding: 10px 0 0; overflow-y: auto; /*direction: rtl;*/ -ms-overflow-style: none; } 
.hammenu .depth1::-webkit-scrollbar { display:none; } 
.hammenu .depth1 li { margin: 4px 0; text-align: left; } 
.hammenu .depth1 li a { display: block; padding: 10px 25px; color: #424242; font-size: 16px; font-family: 'Noto Sans KR', sans-serif; } 
.hammenu .depth1 > li.depopen > a { color:#f15657; } 
.hammenu .depth2 { display: none; position: absolute; top: 0; left: 195px; background: #fff; width: 100%; height: 423px; padding: 10px 0 0; border: 1px solid #e5e5e5; border-top: 0; border-left: 0; } 
.hammenu .depth2 > div { height: 423px; line-height: 20px; overflow-y: auto; -ms-overflow-style: none; } 
.hammenu .depth2 > div::-webkit-scrollbar { display:none; } 
.hammenu .depth2 li { padding: 0 25px; margin: 0; } 
.hammenu .depth2 li a { display: inline-block; padding: 0; margin: 12px 0; color: #424242; font-size: 16px; font-family: 'Noto Sans KR', sans-serif; } 
.hammenu .depth2 li.depopen > a { border-bottom:1px solid #f15657; color:#f15657 } 
.hammenu .depth3 { display: none; position: absolute; top: 0; left: 195px; background: #fff; width: 100%; height: 423px; padding: 10px 0 0; border: 1px solid #e5e5e5; border-top: 0; border-left: 0; overflow-y: auto; -ms-overflow-style: none; } 
.hammenu .depth3::-webkit-scrollbar { display:none; } 
.hammenu .depth3 li a:hover { border-bottom:1px solid #f15657; color:#f15657 } 

/* BASIC css end */