/* gnb */

#container{
  padding: 0!important;
}
#header.bunyang{
  position: fixed;
  left: 0;
  top: 0;
  z-index: 2;
}

/* @media (min-width: 1280px) { */
@media (min-width: 768px) {
  #header .header-inner{
    max-width: 100%;
  }
  /* #wrapper #header.bunyang:not(.gnb-open) #nav .gnb-area .gnb-menu{
    background: rgba(0, 0, 0, 0.3);

  } */
  #wrapper.main #header.bunyang.scroll:not(.gnb-open):not(.gnb-reserve) {
    backdrop-filter:blur(0px)
  }
  #wrapper #header.bunyang.gnb-open::after {
    display: none;
  }
  #wrapper #header.bunyang.gnb-reserve::after {
    /* display: none !important; */
  }
  #wrapper #header.bunyang.gnb-reserve.gnb-open::after {
    display: block !important;
  }
  #wrapper #header.bunyang #nav #nav .util-menu:after {
    display: none !important;
  }

  #nav .util-menu .util-menu-group:last-of-type{
    display: none;
  }

  #wrapper #header.bunyang.gnb-open #nav .nav-inner {
    height: 10.8rem;
  }
  #wrapper #header.bunyang .util-menu-group.reservation::before{
    background: url(/assets/image/sale/logo_calendar.webp) 50% 50% / 100% no-repeat !important;
  }
  #wrapper #header.bunyang #nav .util-menu .util-menu-group .menu-btn {
    display: none;
  }

  #wrapper #header.bunyang #nav .gnb-area .gnb-menu {
    gap: 0 1.6rem;
    display: flex;
    padding: 0 30.4rem 0 30.3rem;
  }
  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 .narrow >a{
    width: 80%;
    margin: 0 auto;
  }
  #wrapper #header.bunyang.gnb-open .mypage {
    display: none;
  }
  #wrapper #header.bunyang.gnb-open .gnb-menu .util-menu-group .lang-container span a {
    font-size: 1.4rem;
    color: #fff;
    opacity: 1;
    font-weight: 500;
  }
  #wrapper #header.bunyang.gnb-open{
    height: 38.6rem!important;
  }
  #wrapper #header.bunyang.scroll.gnb-open {
    height: 38.6rem!important;
  }
  #wrapper #header .main-reser-wrap.type3 .main-reser-box.type3 .ui-close{
    right: 2.7rem;
  }
  #wrapper #header.bunyang.gnb-open #nav .gnb-area::after{
	  position: absolute;
	  top: 8rem;
	  width: 100%;
	  height: 1px;
	  background-color: rgba(255,255,255,0.2);
  }
  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li {
    width: 14rem;
    align-items: center;
    height: auto;
    text-align: center;
    padding: 0 0.4rem;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link > a{
    position: relative;
    font-size: 1.4rem;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link > a:before{
    content: "";
    display: block;
    width: 1px;
    height: 1rem;
    position: absolute;
    left: -1.2rem;
    top: 50%;
    transform: translateY(-50%);
    background-color: #444;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link >a:first-child::before{
    display: none;
  }
  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li>a {
    height: 4.8rem;
    margin: 3rem 0;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li>a>span {
    font-size: 1.8rem;
    line-height: 4.8rem;
    height: inherit;
    display: block;
    font-weight: 500;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li::before {
    display: none;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li .depth2 {
    display: none;
  }
  #wrapper #header.bunyang.gnb-open #nav .gnb-area>.gnb-menu.gnb-renewal>li .depth2 {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 2.7rem;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2>li {
    height: auto;
    width: 100%;
    display: block;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 li>a {
    display: block;
    width: 100%;
    height: auto;
    padding: 0.8rem 0;
    word-wrap: break-word;
    word-break: keep-all;
    line-height: 2.8rem;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 li a span {
    color: #888;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 li:hover a span {
    color: #fff !important;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 li>a span {
    font-size: 1.6rem;
    line-height: 1.5;
  }
  #wrapper #header.bunyang .gnb-menu .util-menu-group.top .menu.resort{
    display: block;
    position: relative;
    width: 18.3rem !important;
    height: 2.4rem !important;
  }
  #wrapper #header.bunyang .gnb-menu .util-menu-group.top .menu.resort:before{
    content: "";
    display: block;
    width: 18.3rem !important;
    height: 2.4rem !important;
    background: url(/assets/image/sale/logo_korean.webp) no-repeat center center /contain !important;
  }
  #wrapper #header.bunyang .gnb-menu .util-menu-group.top .menu.sky{
    width: 15.2rem !important;
    height: 2.4rem !important;
  }
  #wrapper #header.bunyang .gnb-menu .util-menu-group.top .menu.sky:before{
    width: 15.2rem !important;
    height: 2.4rem !important;
    position: relative;
    display: block;
    background: url(/assets/image/sale/logo_skyhill_ko.webp) no-repeat center center /contain !important;
  }
  #wrapper #header.bunyang #nav .util-menu {
    display: flex!important;
    flex-direction: row;
    gap: 0 2.4rem;
    justify-content: flex-end;
  }

  #wrapper #header.bunyang .login::before {
    display: none !important;
    background: url(/assets/image/sale/logo_member.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang #nav .util-menu .util-menu-group.top.btn-round {
    margin-right: 0;
  }

  #wrapper #header.bunyang.gnb-open #nav .gnb-area>.gnb-menu .util-menu-group {
    display: flex;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu .util-menu-group {
    margin: 0;
    display: none;
  }

  #wrapper #header.bunyang #nav .util-menu+.gnb-menu.gnb-menu-mobile {
    margin-top: 7.2rem;
  }

  /* // 스크롤시 */
  .main #header.scroll:not(.gnb-open):not(.gnb-reserve) {
    /* background: none; */
    background-color: #111111;
  }
  /* #wrapper #header.bunyang.scroll:not(.gnb-open):not(.gnb-reserve) {
    background-color: #fff;
  }
  #wrapper #header.bunyang.scroll #nav .gnb-area>.gnb-menu.gnb-renewal>li>a>span {
    color: #111 !important;
  }

  #wrapper #header.bunyang.scroll .header-inner .logo a {
    background: url(/assets/image/sale/logo_color.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang.scroll #nav .util-menu .util-menu-group.top {
    color: #111;
  }

  #wrapper #header.bunyang.scroll .login::before {
    background: url(/assets/image/sale/logo_member_black.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang.scroll #nav .util-menu .login span:nth-child(2):after {
    border: solid #111;
    border-width: 0 1px 1px 0;
  }

  #wrapper #header.bunyang.scroll #nav .util-menu .util-menu-group.top.btn-round a {
    color: #fff;
  } */

  /* 열려있을때 스크롤 내려질떄  */
  /* #wrapper #header.bunyang.scroll.gnb-open #nav .gnb-area>.gnb-menu.gnb-renewal>li>a>span {
    color: #fff !important;
  }

  #wrapper #header.bunyang.scroll.gnb-open .header-inner .logo a {
    background: url(/assets/image/sale/logo_white.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang.scroll.gnb-open .login::before {
    background: url(/assets/image/sale/logo_member.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang.gnb-open #nav .util-menu .login span:nth-child(2):after {
    border: solid #fff;
    border-width: 0 1px 1px 0;
  } */
}

@media (min-width: 1280px) and (max-width: 1600px) {
  /* #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li>a>span {
    font-size: 1.6rem!important;
  }

  #wrapper #header.bunyang #nav .gnb-area>.gnb-menu>li>.depth2 li>a span {
    font-size: 1.45rem;
     word-break:keep-all;
    word-wrap: break-word;
  } */

  /* #wrapper #header.bunyang #nav .gnb-area>.gnb-menu.gnb-renewal>li {
    width: 10.8rem;
  } */
  /* #wrapper #header.bunyang .header-inner .logo a {
    width: 16.8rem;
    height: 3.1rem;
    background: url(/assets/image/sale/logo_white.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang .header-inner .logo {
    left: 1.2rem;
  }

  #wrapper #header.bunyang #nav .gnb-area .gnb-menu {
    padding-left: 21.9rem;
  }

  #header #nav .util-menu .util-menu-group.top.btn-round {
    margin-right: 0;
  }

  #wrapper #header.bunyang #nav .util-menu {
    right: 3.2rem;
  }

  #wrapper #header.bunyang #nav .gnb-area:after {
    display: none !important;
  }

  #wrapper #header.bunyang #nav #nav .util-menu:after {
    display: none !important;
  } */
}

/* @media (max-width: 1279px) { */
@media (max-width: 767px) {
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .mob-top-line {
    display: flex;
    flex-direction: row;
    gap: 0 1.2rem;
    align-items: center;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link > a{
    position: relative;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link > a:before{
    content: "";
    display: block;
    width: 1px;
    height: 1rem;
    position: absolute;
    left: -0.8rem;
    top: 50%;
    transform: translateY(-50%);
    background-color: #444;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .go-link >a:first-child::before{
    display: none;
  }

  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .mob-top-line .resort {
    display: block;
    /* width: 8.7rem;
    height: 2rem; */
    width: 12.2rem;
    height: 1.6rem;
    background: url(/assets/image/sale/logo_korean.webp) no-repeat center center /contain !important;
  }

  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .mob-top-line .sky {
    display: block!important;
    /* width: 11.5rem;
    height: 2rem; */
    width: 10.1rem;
    height: 1.6rem;
    background: url(/assets/image/sale/logo_skyhill_ko.webp) no-repeat center center /contain !important;
  }
  #wrapper #header.bunyang.gnb-open #nav .util-menu .util-menu-group.top.btn-round{
    background-color: #da291c!important;
  }
  #wrapper #header.bunyang .util-menu-group.reservation::before {
    content: '';
    position: absolute;
    display: inline-block;
    background: url(/assets/image/sale/logo_calendar.webp) 50% 50% / 100% no-repeat !important;
    width: 2rem;
    height: 2rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
  }

  #wrapper #header.bunyang .btn-gnb-close.ico-close {
    /* background: url(/assets/image/sale/btn-gnb-close.webp) no-repeat center / cover !important; */
    width: 4.8rem;
    height: 4.8rem;
    top: 1.2rem;
    /* right: 2rem; */
    right: 0;
    background: none!important;
  }
  #wrapper #header.bunyang  #nav .gnb-area .gnb-menu.gnb-menu-mobile li .lang-container span a{
    font-size: 1.3rem;
    color: #ccc;
  }
  #wrapper #header.bunyang  #nav .gnb-area .gnb-menu.gnb-menu-mobile li{
    background-color: #1A1A1A;
  }
  #wrapper #header.bunyang .login::before {
    content: '';
    position: relative;
    display: inline-block;
    background: url(/assets/image/sale/logo_member.webp) 50% 50% / 100% no-repeat;
    /* width: 2.4rem;
    height: 2.4rem; */
    width: 2rem;
    height: 2rem;
    margin-right: .4rem;
	}
  #wrapper #header.bunyang .gnb-area .main-link.home::before {
    content: '';
    position: relative;
    display: inline-block;
    background: url(/assets/image/sale/logo_home.webp) 50% 50% / 100% no-repeat;
    width: 2.4rem;
    height: 2.4rem;
    margin-right: .4rem;
  }

  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li .mob-top-line a{
    font-size: 1.3rem!important;
  }
  #wrapper #header.bunyang #nav .gnb-area .gnb-menu.gnb-menu-mobile li{
    padding: 0 2rem;
  }
  #wrapper #header.bunyang .btn-gnb-close.ico-close::before, #wrapper #header.bunyang .btn-gnb-close.ico-close::after, #wrapper #header.bunyang .btn-reser-close.ico-close:before, #wrapper #header.bunyang .btn-reser-close.ico-close:after{
    width: 2.8rem;
  }
  .main #header .btn-gnb-open:before, .main #header .btn-gnb-open > .bar, .main #header .btn-gnb-open:after{
    display: none;
  }

  #wrapper #header.bunyang .header-inner .btn-gnb-open{
    /* width: 4.8rem;
    height: 4.8rem; */
    width: 2.4rem;
    height: 2.4rem;
    background: url(/assets/image/sale/btn-gnb-open.webp) no-repeat center / contain;
  }
  #wrapper #header.bunyang.scroll .header-inner .btn-gnb-open{
    background: url(/assets/image/sale/btn-gnb-open-black.webp) no-repeat center / contain;
  }
}
