@font-face {
    font-family: 'Giants-Inline';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-1@1.1/Giants-Inline.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* Header */
header  * {transition: all 0.1s ease-out;}

 header#header {
	position: fixed;
	z-index: 9999999999999999999999999999999999999;
	width: 100%; height:90px;
	padding: 0;	margin: 0px auto;
	
    
	box-sizing: border-box;
 
}
header#header .in  {max-width:100%; position:relative; display:flex; align-items:center; height:100%}
header#header h1 {
	text-align: right;
	display:flex; align-items:center;  font-size:1.6rem;
	  font-weight:400; color:#fff;  height:100%; line-height:0; padding-left:4%;
	  font-family: 'Giants-Inline';
	 
}
header#header h1 b {  font-family: 'Giants-Inline';}
header#header h1 img{
    background: #fff;
    padding: 5px;
    box-sizing: border-box;
    width: 50px;
    border-radius: 11px;
	margin-right:7px;	
}
header#header div.last_div {margin-left:auto; line-height:0; padding-right:4%;  height:100%; display:flex; align-items:center; justify-content:flex-end; width:150px;    } 
header#header div.last_div a {display:flex}
header#header div.last_div i {font-size:21px; color:#fff; margin-left:15px;margin-top:-3px;}
header#header div.last_div   {font-size:22px; color:#fff;   font-weight:600; }
 

header#header nav#gnb {margin-left:50px}
header#header nav#gnb > ul { overflow: hidden; display:flex; }
header#header nav#gnb > ul > li { display:inline-block;  box-sizing:border-box;  text-align:center;  }
  
header#header nav#gnb > ul > li > a {
	display: inline-block;
	white-space:nowrap; 
	font-size: 1.3rem;
	line-height:90px;
	  padding:0 35px;
	 font-weight:500; 
	color: #fff;
	letter-spacing:-.5px;
	position:relative
}

  header#header nav#gnb > ul > li > a:after {content:''; width:5px; height:5px; background-color:#999; display:inline-block; position:absolute; right:0; top:50%; margin-top:-2px }
 
header#header nav#gnb > ul > li.last > a:after  {display:none }
 
header#header nav#gnb > ul > li > a.active {
	color: var(--main_c);
	font-weight:500;
 }
 header#header nav#gnb > ul > li > ul {
	display:none;
	border-top:1px solid #ddd;
 	padding-top:30px;
	width:20%;  
	height:320px; 
	box-sizing:border-box; 
	left:0; position:absolute;
	text-align:left; padding-left:30px;
	border-right:1px solid #ddd;
	background-color:#fff;
	 
 	 
}

header#header nav#gnb > ul > li:last-child > ul  {border-right:none}
header#header nav#gnb > ul > li:nth-child(1) > ul {border-left:1px solid #ddd}
header#header nav#gnb > ul > li:nth-child(2) > ul {left:20%}
header#header nav#gnb > ul > li:nth-child(3) > ul {left:calc(20% * 2)}
header#header nav#gnb > ul > li:nth-child(4) > ul {left:calc(20% * 3)}
header#header nav#gnb > ul > li:nth-child(5) > ul {left:calc(20% * 4)}
header#header nav#gnb > ul > li:nth-child(6) > ul {left:calc(20% * 5)}
header#header nav#gnb > ul > li  > ul:before {content:'회사소개'; font-size:1.3em; font-weight:600; width:100%; display:inline-block; padding-bottom:20px}
header#header nav#gnb > ul > li:nth-child(2) > ul:before {content:'배달서비스';  }
header#header nav#gnb > ul > li:nth-child(3) > ul:before {content:'배달가능지역';  }
header#header nav#gnb > ul > li:nth-child(4) > ul:before {content:'쿠팡안전매뉴얼';  }
header#header nav#gnb > ul > li:nth-child(5) > ul:before {content:'고객지원';  }

header#header nav#gnb > ul > li:hover ul  {background-color:var(--main_c)}


header#header nav#gnb > ul > li > ul > li {
  background:none;   width:100%; padding:3px 0;
}
header#header nav#gnb > ul > li > ul > li > a {
	position: relative;
	color: #333;
	line-height:1.3;
	font-size:1em;
	 padding:0; 
	font-weight: 400;
}

 

header#header nav#gnb > ul > li:hover > ul:before {  color:#fff}
header#header nav#gnb > ul > li:hover > ul > li > a {  color:#fff}
header#header nav#gnb > ul > li > ul > li > a:hover {text-decoration:underline;  }
 
header#header:hover {background-color:#fff}
header#header:hover nav#gnb > ul > li > a  {color:#111}
header#header:hover h1 {color:#111}
header#header:hover div.last_div  { color:#8f5027; }
header#header:hover div.last_div b:nth-child(1) {color:#ea512f}
header#header:hover div.last_div b:nth-child(2) {color:#f5b314}
header#header:hover div.last_div b:nth-child(3) {color:#83c037}
header#header:hover div.last_div b:nth-child(4) {color:#2caad2}
header#header:hover div.last_div i { color:#111; }
header#header:hover h1 b {color:var(--main_c); }
header#header:hover h1 img{	margin-right:-3px;}

header#header.scroll {background-color:#fff}
header#header.scroll nav#gnb > ul > li > a  {color:#111}
header#header.scroll h1 {color:#111}
header#header.scroll div.last_div  { color:#8f5027; }
header#header.scroll div.last_div b:nth-child(1) {color:#ea512f}
header#header.scroll div.last_div b:nth-child(2) {color:#f5b314}
header#header.scroll div.last_div b:nth-child(3) {color:#83c037}
header#header.scroll div.last_div b:nth-child(4) {color:#2caad2}
header#header.scroll div.last_div i { color:#111;}
header#header.scroll h1 b {color:var(--main_c); }
header#header.scroll h1 img{	margin-right:-3px;}

 
 
.menu-fixed {
      
	  position: fixed;
     width:100%; display:inline-block; 
	  top: 0px; width:100%;  height:54px;
     text-align:center;
	  left:0px;  background-color:#fff; border-bottom:1px solid #ddd;
    z-index:9999999999999999999999999999999999999999
	}

.menu-fixed li {font-size:19px; color:#555;  font-weight:500; display:inline-block; padding:0 50px; line-height:54px; }

.main-menu {display:none}
.menu-fixed  { display:inline}


#m_top {width:100%; height:60px; display:flex; justify-content:space-between; align-items:center; background:rgba(255,255,255,1); position:fixed; top:0; left:0; z-index:99999999999;  padding:0 4%; box-sizing:border-box}
#m_top h1 {font-size:20px;   font-family: 'Giants-Inline';  color:#111;  height:100%; display:flex; align-items:center;  font-weight:400 }
#m_top h1 b {font-size:20px;   font-family: 'Giants-Inline';  color:var(--main_c);   }
#m_top h1 img{width:30px;margin-right:3px;}
 
#m_top.nav-up {top:-80px; }

 
@media all and (min-width:1000px) {
   #m_top {display:none} 
}

 @media all and (max-width:1000px) {
   header {display:none}
}