/* ====================================================================================================
	MINIMAL CSS3 MENU
==================================================================================================== */

.main-menu {display:block; margin:0; padding:0; }
.main-menu a {-webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
.main-menu ul,
.main-menu ul li,
.main-menu ul li a {margin:0; padding:0; }
.main-menu ul{display:flex;}
/* Submenu styles */
.main-menu ul li a {display:block; padding:2px 0; }
			
/*First level styles */			
.main-menu > ul > li > a {padding:20px 10px 20px 10px; font-size:18px; margin:0; font-weight:600; text-align:center; color:#666666}
.main-menu > ul > li:hover > a {/*color:#ed5434; */color:#666666; }

/*sticky styles */	
header.sticky .main-menu > ul > li > a{color:#000; }
header.sticky .main-menu > ul > li:hover > a{color:#1764D9; }
header.sticky ul#lang_top li a {color:#000; }

/*over styles */	
header.overmenu .main-menu > ul > li > a{color:#000; }
header.overmenu .main-menu > ul > li:hover > a{color:#1764D9; }
header.overmenu ul#lang_top li a {color:#000; }

/* Opacity mask when left open */
.layer {display:none; position:fixed; top:0; left:0; width:100%; min-width:100%; z-index:100; min-height:100%; background-color:#000; opacity:0; z-index:9; }
.layer-is-visible {display:block; -webkit-animation:fade-in-layer .3s; -moz-animation:fade-in-layer .3s; -ms-animation:fade-in-layer .3s; -o-animation:fade-in-layer .3s; animation:fade-in-layer .3s; opacity:0.5; }

#close_in,#header_menu, .cmn-toggle-switch{display:none; }	

a.dropdown-toggle.icon-search{display:inline-block; }	

/* IE9 fix that affect the pages with parallax header (ex.single_hotel.html); Issue:submenu disappear when move the cursor to the submenu (only if you did not scroll the page) */
.ie9 a.show-submenu, .ie9 a.show-submenu-mega{ background:url(../img/fix_ie_9_menu.png); }

/* 모바일 m_gnb */
.m_gnb_wrap {
	display: none; 
    position: fixed; 
    left: 0; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    background-color: rgba(0, 0, 0, 0.8); 
    z-index: 8100; 
    opacity: 0; 
    visibility: hidden; 
    transition-duration: 0.3s; 
}

.m_gnb_wrap:before {
    content: ""; 
    position: fixed; 
    top: 0; 
    right: 0; 
    left: 0; 
    bottom: 0; 
    opacity: 0; 
    visibility: hidden; 
    transition-duration: 0.3s; 
}

.m_gnb_wrap .gnb-mobile-element {
    display: flex; 
    flex-direction: column; 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    background-color: #f3f3f3; 
    max-width: 414px; 
    transform: translateX(-414px); 
    transition-duration: 0.3s; 	
}

.m_gnb_wrap .top-bar {
    height: 35px; 
    padding: 5px; 
    background: #428cf0; 
}

.m_gnb_wrap {
    opacity: 1; 
    visibility: visible; 
}

.m_gnb_wrap:before {
    opacity: 1; 
    visibility: visible; 
}

.m_gnb_wrap .gnb-mobile-element {
    transform: translateX(0); 
}

/* gnb-header */
.m_gnb_wrap .gnb-mobile-element .gnb-header {
	position: relative;
    display: flex; 
	align-items: center;
    z-index: 2; 
    height:70px; 
    background-color: #fff; 
}
.m_gnb_wrap .gnb-mobile-element .gnb-header .mlogo{width:160px; margin-left:20px;}
.m_gnb_wrap .gnb-mobile-element .gnb-header .gnb-btn-login {
	display: block;
    position: absolute;
    right: 40px;
    top: 50%;
    z-index: 1;
    padding: 24px 20px; 
    line-height: 23px; 
    border-radius: 5px; 
    font-size: 18px; 
    color: #000; 
	font-weight: 600;
	transform: translate(0, -50%);
}

.m_gnb_wrap .gnb-mobile-element .gnb-header .gnb-btn-login.join {
    margin-left: -5px; 
}
.m_gnb_wrap .gnb-mobile-element .gnb-header .m_close_btn {
    display: block; 
    position: absolute; 
    right: 10px; 
    top: 0; 
    z-index: 1; 
    width:24px; 
    height:24px; 
    background-image: url(/img/m_close.png); 
    background-repeat: no-repeat; 
    background-position: 50% 50%; 
}
.m_gnb_wrap .gnb-mobile-element .gnb-header .m_close_btn {
    top: 50%;
	transform: translate(0, -50%);
    background-size: 20px auto; 
}
.hd-element {
    position: absolute; 
    width: 0; 
    height: 0; 
    overflow: hidden; 
    font-size: 1px; 
    line-height: 0; 
}

.m_gnb_wrap .gnb-mobile-element .gnb-area{margin-top:10px; border-top:1px solid #c9d6dd;}
.m_gnb_wrap .gnb-mobile-element .gnb-area:after{content:''; display:block; clear:both; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li.active > a{color:#006ae2; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li.active > a > span{display:block; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li.etc-menu .lb_new {display: inline-flex; justify-content: center; align-items: center; padding: 0 3px 0 2px; width:auto; height:12px; font-size: 10px; font-weight: bold; color: #fff; background-color: #ed193a; border-radius: 3px; vertical-align: super; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > a > span{display:none; width:100%; height:5px; background-color:#0e72e4; margin-top:16px; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2{display:none; position:absolute; width:100%; top:70px; left:0px; z-index:3; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li.active > div.depth-2{display:block}
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 > li{position:relative; float:none; width:25%; margin-top:10px; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 > li > a{position:relative; display:block; margin-left:70px; padding:11px 15px 11px 10px; border-bottom:2px solid #797979; font-size:20px; font-weight:bold; text-decoration:none}
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 > li > a > span{position:absolute; right:10px; top:50%; width:9px; height:16px; z-index:1; margin-top:-8px; background-position:-165px -64px; background-repeat:no-repeat; background-image:url(../image/ico-myset.png); }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu{float:none; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu > ul{float:none; width:195px; margin-right:45px; padding-top:30px; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu > ul.has-gnb-other {overflow:hidden; width:auto; margin:0; padding-top:0; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu > ul.has-gnb-other > li {float:none; width:195px; margin-right:0px; padding-top:0px; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu > ul.has-gnb-other .mo-state {display: none; }
.m_gnb_wrap .gnb-mobile-element .gnb-area > li > div.depth-2 .gnb-menu ul > li > a:hover{color:#006ae2; }

.m_gnb_wrap .gnb-mobile-element.active {display:block; position:fixed; left:0; top:0; right:0; bottom:0; z-index:999; width:100%; height:100%; background:#fff; overflow-y:scroll; }
.m_gnb_wrap .gnb-mobile-element.active:before { content:""; display:block; position:absolute; left:0; top:110px; bottom:0; width:35%; background-color:rgba(23, 100, 217, 0.05); border-right:1px solid #c9d6dd; box-sizing:border-box; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area{display:block; position:absolute; top:110px; left:0; right:0; bottom:0; width:100%; margin:0px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li{display:block; float:none; padding:0px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > a {display:block; width:35%; padding:15px 0; font-size:16px; color:#000; font-weight:500; text-align:center; text-decoration:none; box-sizing:border-box; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > a {color:#fff; background-color:#1764D9; border-right:0; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > a > span{display:none; width:100%; height:5px; background-color:#0e72e4; margin-top:16px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > a > span{display:none; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2{display:none; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 {display:block; position:absolute; overflow-y:auto; top:0; left:35%; right:0; bottom:0; padding:0 28px; background:#fff; width:auto; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 > li{display:block; position:relative; float:none; width:auto; margin-top:0px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 > li > a{position:relative; display:block; padding:14px 15px 14px 15px; border-bottom:1px solid #c9d6dd; color:#000; font-size:16px; font-weight:normal; text-decoration:none; margin-left:0px; }	
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 > li > ul.depth-3 > li{}
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 {display:block; position:absolute; overflow-y:auto; position:absolute; top:0; left:35%; right:0; bottom:0; padding:0 28px; background:#fff; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu li{display:block; position:relative; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu li a{position:relative; display:block; padding:14px 10px 14px 10px; border-bottom:1px solid #c9d6dd; color:#000; font-size:16px; font-weight:450; text-decoration:none; word-break:keep-all; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li > a > span {display:none; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li > a > span {display:block; overflow:hidden; position:absolute; right:0; top:50%; margin-top:-14px; width:28px; height:28px; background-image:url(../image/main-mobile/icon-gnb-plus.svg); background-repeat:no-repeat; background-position:50% 50%; background-size:100% auto; font-size:0; text-indent:-99999999999999px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li.active > a > span {background-image:url(../image/main-mobile/icon-gnb-minus.svg); }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li > ul.depth-3 {display:none; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li.active > ul.depth-3 {display:block; padding:15px 0px; border-bottom: 1px solid #c9d6dd; margin:0}
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li.active > div.depth-2 .gnb-menu ul > li.active > ul.depth-3 > li > a{display:block; font-size:14px; font-weight:normal; color:#666; padding:5px 20px; text-decoration:none; border-bottom:0px; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 .gnb-menu > ul.has-gnb-other { float:none; width:100%; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 .gnb-menu .gnb-other {height:auto; line-height:inherit; margin-bottom:0; background-color:transparent; border-radius:0; font-size:16px; text-align:left; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 .gnb-menu .gnb-other {height:auto; line-height:inherit; margin-bottom:0; background-color:transparent; border-radius:0; font-size:16px; text-align:left; }
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 .gnb-menu .gnb-other .icon-angle-down { 
	display: block; 
    position: absolute; 
    top: 20px; 
    right: 10px; 
    width: 10px; 
    height: 7px; 
}
.m_gnb_wrap .gnb-mobile-element.active .gnb-area > li > div.depth-2 .gnb-menu .gnb-other .icon-angle-up { 
	display: block; 
    position: absolute; 
    top: 20px; 
    right: 10px; 
    width: 10px; 
    height: 7px; 
}

/* All styles for screen size over 992px
================================================== */
@media only screen and (min-width:1024.23px) {	
	.main-menu {/*width:auto; */}
	.main-menu a {white-space:nowrap; }	
	.main-menu ul li {width:12.5%; }
			
	/* Submenu */
	.sub_gnb {
		position: absolute; 
		z-index: 100;
		width: 100%; 
		top: 142px; 
		right: 0; 
		display: none; 
		text-align: left; 
		border-top: 1px solid #d9d9d9; 
		/*border-bottom: 1px solid #d9d9d9; */
		background-color:#fff; 
		box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.2); 
	}

	.main-menu ul li:hover > ul {display:block; padding:0; }
	.submenu {display:flex; background-color:#fff !important; overflow: hidden; transition: 0.5s; width:100%; height:420px; padding:20px 0; background:none; color:#fff;  }
	.submenu ul {display:block; width:12.5%; border-left:1px solid #E4E4E4; overflow: hidden; padding:0 16px; vertical-align:top; margin:0;}
	.submenu .submenu_cloud {width:20%; margin-top:30px; }
	.submenu ul li {display:block; height:auto; padding:6px 0; width:100%; font-weight:500; letter-spacing:-1.5px}		
	.submenu ul li a {font-size:14px; color:#565656; display:block; text-align:left; font-weight:500; }
	.submenu ul li:hover > a {color:#00687f; }

	.submenu ul li ul {display:block; width:100%; border:none; padding-left:10px; margin:0; margin-top:5px;}		
	.submenu ul li ul li{display:block; height:auto; padding:6px 0; width:100%; font-weight:500; letter-spacing:-1.5px}		
	.submenu ul li ul li a {font-size:13px; color:#565656; display:block; text-align:left; font-weight:500; }

	a#search_bt span{ display:none; }
	
}


@media only screen and (max-width:1024px) {
	
	#header_menu{text-align:center; padding:25px 15px 25px 15px; position:relative; display:block; background-color:#333; }
	.m_logo_wrap {position:absolute; width:70%; left:30px; top:20px; }
	.m_logo_wrap img{width:auto; height:auto; }
	/*.m_gnb_wrap {width:320px; }*/

	.main-menu ul li a:hover,
	a.show-submenu:hover,
	a.show-submenu:focus,
	a.show-submenu-mega:hover,
	a.show-submenu-mega:focus{color:#ed5434 !important; background-color:#f9f9f9; }	
		
	.main-menu ul li  {border-top:none; border-bottom:1px solid #ededed; color:#fff; }

	/* Menu mobile first level */	
	.main-menu ul li a  {padding:10px 15px !important; }

	.main-menu h3 {font-size:12px; line-height:14px; margin:10px 0 0 0; padding:0 0 15px 15px; color:#333; text-transform:uppercase; }
	.megamenu .menu-wrapper > div {padding:0; }	
		
	.main-menu li,
	.main-menu a {display:block; color:#555 !important; }
	.main-menu li {position:relative; }
		
	.main-menu a:hover {color:#ed5434 !important; }
		
	.main-menu ul > li {padding-bottom:0; }
	.main-menu ul > li i{float:right; }

	/* Menu mobile second level */	
	.main-menu ul li.submenu ul{font-size:13px; border-left:1px solid #ededed; margin:0 0 15px 25px; }
	.main-menu ul li.submenu ul li{font-size:13px; border:0; }


	/* Menu mobile left panel */	
	.main-menu {overflow:auto; left:-100%; bottom:0; width:45%; height:100%; opacity:0; position:fixed; background-color:#fff; 
	-webkit-transition:	left 0.8s, opacity 0.5s; 
	-moz-transition:	left 0.8s, opacity 0.5s; 
	transition:left 0.8s, opacity 0.5s; z-index:9999; 
	-webkit-box-shadow:1px 0px 5px 0px rgba(50, 50, 50, 0.55); 
	-moz-box-shadow:  1px 0px 5px 0px rgba(50, 50, 50, 0.55); 
	box-shadow:       1px 0px 5px 0px rgba(50, 50, 50, 0.55); }

	.main-menu.show {visibility:visible; left:0; opacity:1; }
	.main-menu .show-submenu + ul,
	a.show-submenu-mega + .menu-wrapper{display:none; visibility:hidden; }
	a.show-submenu-mega + .menu-wrapper.show_mega,
	.main-menu a.show-submenu + ul.show_normal  {display:block; visibility:visible; }
		
	/* Hamburger menu button*/
	.cmn-toggle-switch {
	  position:relative; 
	  display:block; 
	  overflow:visible; 
	  position:absolute; 
	  top:25px; 
	  right:15px; 
	  margin:0; 
	  padding:0; 
	  width:30px; 
	  height:30px; 
	  font-size:0; 
	  text-indent:-9999px; 
	  -webkit-appearance:none; 
	  -moz-appearance:none; 
	  appearance:none; 
	  box-shadow:none; 
	  border:none; 
	  cursor:pointer; 
	}

	.cmn-toggle-switch:focus {outline:none; }
	.cmn-toggle-switch span {display:block; position:absolute; top:10px; left:0; right:0; height:2px; background:#333; }

	.cmn-toggle-switch span::before,
	.cmn-toggle-switch span::after {position:absolute; display:block; left:0; width:100%; height:2px; background-color:#333; content:""; }

	.cmn-toggle-switch span::before {top:-10px; }
	.cmn-toggle-switch span::after {bottom:-10px; }

	.cmn-toggle-switch__htx span::before,
	.cmn-toggle-switch__htx span::after { -webkit-transition-duration:0.3s, 0.3s; transition-duration:0.3s, 0.3s; -webkit-transition-delay:0.3s, 0; transition-delay:0.3s, 0; }
	.cmn-toggle-switch__htx span::before { -webkit-transition-property:top, -webkit-transform; transition-property:top, transform; }
	.cmn-toggle-switch__htx span::after {-webkit-transition-property:bottom, -webkit-transform; transition-property:bottom, transform; }

	/* active state, i.e. menu open */
	.cmn-toggle-switch__htx.active span{background:none !important; }
	.cmn-toggle-switch__htx.active span::before {top:0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); }
	.cmn-toggle-switch__htx.active span::after {bottom:0; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); }
	.cmn-toggle-switch__htx.active span::before,
	.cmn-toggle-switch__htx.active span::after {-webkit-transition-delay:0, 0.3s; transition-delay:0, 0.3s; }


	 .btnWrap {
		border-top:1px solid #c9d6dd;
	}
	.btnWrap ul {
		display:flex; 
		justify-content:flex-start;
		margin:0;
	}
	.btnWrap ul li {position:relative; width:50%; height:40px; text-align: center;}
	.btnWrap ul li:last-child:before {content:""; position:absolute; top:10px; left:0; width:2px; height:20px; background-color:#e4e5e7; }
	.btnWrap a.join {position:relative; display:inline-block; margin:0 auto; padding:0 0 0 30px; height:40px; font-size:15px; font-weight:400; line-height:40px; color:#222;}
	.btnWrap a.join:before {content:""; position:absolute; top:10.9px; left:0; width:22.4px; height:18.2px; background-image:url("/img/gnb_icon08.png"); background-size:100%;}
	.btnWrap a.login {position:relative; display:inline-block; margin:0 auto; padding:0 0 0 28px; height:40px; font-size:15px; font-weight:400; line-height:40px; color:#222;}
	.btnWrap a.login:before {content:""; position:absolute; top:9.5px; left:0; width:21px; height:21px; background-image:url("/img/gnb_icon09.png"); background-size:100%;}
	.btnWrap a.mypage {position:relative; display:inline-block; margin:0 auto; padding:0 0 0 30px; height:40px; font-size:15px; font-weight:400; line-height:40px; color:#222;}
	.btnWrap a.mypage:before {content:""; position:absolute; top:9.5px; left:0; width:22.4px; height:19.6px; background-image:url("/img/gnb_icon10.png"); background-size:100%;}
	.btnWrap a.logout {position:relative; display:inline-block; margin:0 auto; padding:0 0 0 28px; height:40px; font-size:15px; font-weight:400; line-height:40px; color:#222;}
	.btnWrap a.logout:before {content:""; position:absolute; top:9.5px; left:0; width:21px; height:21px; background-image:url("/img/gnb_icon09.png"); background-size:100%;}

}

@media only screen and (max-width:767px) {
	
}	
@media only screen and (max-width:600px) {
	.main-menu {width:100%; }
	a#close_in {display:block; position:absolute; right:15px; top:10px; width:20px; height:20px; }
	#close_in i{color:#fff !important; font-size:18px; } 
}
