flex-direction으로 헤더 세로 정렬하기

display: flex; 로 정렬하고

flex-direction: column; 을 써서 세로로 떨어지게 만들어 줍니다.

마지막 nav-goto를 하단으로 정렬하려면

margin-top: auto; 를 넣어 밑으로 내려줍니다.

<header>
  <h1 class="logo">
  	<a href="#">The Shilla Hotel & Resotrs</a>
  </h1>
  <nav id="gnb" class="menu">
    <h2 class="blind">주메뉴</h2>
    <ul class="nav-depth1">
      <li><a href="#">호텔찾기</a></li>
      <li><a href="#">호텔예약</a></li>
      <li><a href="#">호텔신라 소개</a></li>
      <li><a href="#">고객문의</a></li>
      <li><a href="#">신라리워즈</a></li>
    </ul>
  </nav>
  <div class="nav-goto">
    <h2 class="blind">중요 메뉴</h2>
    <ul class="link-goto">
      <li><a href="#">about</a></li>
      <li><a href="#">contact</a></li>
    </ul>
    <h2 class="blind">sns 바로가기</h2>
      <ul class="link-sns">
        <li><a href="#">facebook</a></li>
        <li><a href="#">twitter</a></li>
        <li><a href="#">instargram</a></li>
      </ul>
  </div>
</header>

---

header {
    position: fixed; top: 0; bottom: 0; left:0;
    width: $w;
    background: $bg;
    display: flex;
    flex-direction: column;
} 
.nav-goto {
    margin-top: auto;
}