/* header-change -> 스크롤시에 header color 변경 */
body header{position: fixed; width: 100%; top:0; left: 0;  z-index: 2000; height: 60px; border-bottom: 1px solid rgba(244, 201, 1183, .2); background: #fff; }
/*body header{position: fixed; width: 100%; top:0; left: 0;  z-index: 9000; height: 60px; border-bottom: 1px solid rgba(244, 201, 1183, .2); background: #fff; }*/
body header.main{background: transparent; }
body header.header-change{background: #ffffff; border-bottom: 1px solid #eaeaea}
body header.header-change #menu > li > a {color: #333;}
.header-change .hamburger-inner, .header-change.hamburger-inner:after, .header-change.hamburger-inner:before {
	background-color: #013076;
}
.hamburger-inner{background: #013076 !important}

body.menu-on header{position: fixed; width: 100%; top:0; left: 0; border-bottom: 1px solid #eaeaea; z-index: 9999; height: 100px; background: #fff; }
.sticky-top{top:60px;}
@media (min-width: 992px) {
	body header{height: 100px; }
	.sticky-top{top:100px;}
}

/* 메뉴 hover 시에 body 흐리게 */
#menu-overlay {opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: #000; background: rgba(0, 0, 0, .6); z-index: 499; -webkit-transition: opacity .1s,visibility .3s; transition: opacity .3s,visibility .3s; }
body.menu-on #menu-overlay {opacity:1;visibility:visible;}

.login{color: #013076; font-size: 11px;}
.header-wrapper {max-width: 1600px; height: 100%; margin: 0 auto; position: relative; }
#logo{height: auto; position: absolute; left: 20px; bottom: 15px; z-index: 2; -webkit-transition: all .3s; transition: all .3s;}
#logo img{width: 130px; height: auto; }
#sns-wrapper{height: auto; position: absolute; right: 20px; top: 55px; z-index: 2; -webkit-transition: all .3s; transition: all .3s;}

@media (min-width: 992px){
	#logo{left: 20px; z-index: 2; }
	#logo img{width: 200px; height: auto; }
}
@media (min-width: 1200px) {
	#logo{left: 40px;}
	#logo img{width: 250px; height: auto; }
	#sns-wrapper{right: 40px;}
}

.menu-container {display: block; width: 100%; position: relative;  line-height: 1; z-index: 1;}
#menu {vertical-align: top; position: relative; z-index: 500; text-align: right; }
#menu li{display: inline-block; vertical-align: top; text-align: center;}
#menu > li > a {padding: 22px 0 10px 0; position: relative; font-size: 17px; color: #AFAFAF;}
#menu li{margin-right: 30px;}
#menu li:last-child { margin-right: 0; }
@media (min-width: 992px){
	#menu > li > a {padding: 67px 0 30px 0; position: relative; font-size: 20px; color: #AFAFAF;}
	#menu li{margin-right: 50px;}
}
@media (min-width: 1200px) {
	#menu li{margin-right: 70px;}
}

/* 메뉴 마우스 오버 */
#menu > li > a span {color: #AFAFAF; position: relative; -webkit-transition: all .3s; transition: all .3s; font-family: score-m;}
#menu.main > li > a span {color: #fff;}
.header-change #menu.main > li > a span {color: #013076;}
#menu.header-change > li > a span {color: #013076;}
.main #menu > li:hover > a span {color: #00CEFF; position: relative}
#menu > li:hover > a span {color: #013076; position: relative}
#menu > li.active > a span {color: #013076; position: relative}
#menu > li > a span:after{width:0; content: ''; height: 1px;  background: #013076; position: absolute; bottom: -7px; left: 50%; -webkit-transition:all .3s; transition:all .3s; }
/* #menu > li:hover > a span:after {width: 100%; left: 0%;}
#menu > li.active > a span:after {width: 100%; left: 0%;} */
#menu a {display: block;	 -webkit-transition: all .3s; transition: all .3s;}

/* 서브메뉴 */
.sub-menu-wrapper{background: transparent; height: 0; z-index: 1; width: 100%; overflow: hidden; opacity: 0;  visibility: hidden; text-align: right; padding-right: 250px;}
.sub-menu-wrapper ul li{width:100px; margin-right: 0 !important;  padding-top: 30px;  }
.sub-menu-li.active .sub-menu-link a span {color:#fff; font-family: 'gmarket-light'; letter-spacing: 0}
.sub-menu-wrapper .sub-menu-link {margin-bottom: 15px; text-align: center; min-height: 30px}
.sub-menu-wrapper .sub-menu-link a span{font-size: 12px; color: #fff; position: relative; -webkit-transition:all .3s; transition:all .3s; letter-spacing: 0; font-family: 'gmarket-light';}
.sub-menu-wrapper .sub-menu-link a span:after{width:0; content: ''; height: 1px;  background: #fff; position: absolute; bottom: -7px; left: 0; -webkit-transition:all .3s; transition:all .3s; }
.sub-menu-wrapper .sub-menu-link a:hover span{color: #fff; text-decoration: none;  }
.sub-menu-wrapper .sub-menu-link a:hover span:after{width:0; left:0%;}
@media (min-width: 1200px) {
	.sub-menu-wrapper ul li{width:100px;}
	.sub-menu-wrapper ul li.long{width:150px;}
	.sub-menu-wrapper .sub-menu-link a span{font-size: 12px;}
}

.hidden-menu-bg{ position: fixed; top: 100px; left: 0; right: 0; bottom: 0; opacity: 1;}


/*------------------------------------
  모바일메뉴
------------------------------------*/
.mobile-nav .login{color: #013076; font-size: 14px;}
.mobile-nav-bg{visibility: hidden; opacity: 0; position: fixed; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, .8); z-index: 1000; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out }
.mobile-nav-bg.on{visibility: visible; opacity: 1; }
.mobile-nav{position: fixed; opacity: .5; top: 0; border-bottom: 0; right: -280px; background: #fff; width: 280px; height:100%; overflow: auto; z-index: 1001; }
.mobile-submenu-wrapper{background: #013076}
.mobile-nav{padding:20px 0 0 0;}
.mobile-nav > ul > li > a{color:#013076; padding: 15px 25px; background: #fff; display: block; font-size: 15px; font-weight: 500; position: relative; font-family: 'gmarket-medium'}
.mobile-nav > ul > li > a span:after{content: "\f107"; font: normal normal normal 16px/1 FontAwesome; position: absolute; top:21px; right: 25px; transition: .3s transform ease-in-out;}
.mobile-nav > ul > li > a[aria-expanded='true'] span:after{-webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);} /* 모바일 collpase 메뉴 화살표 변경*/
.mobile-submenu-wrapper .mobile-link a{color: #fff; font-size: 14px; margin: 0 25px; padding:20px 0 20px 0; display: block; border-bottom: 1px solid #fff; font-family: 'gmarket-medium'}
.mobile-submenu-wrapper .mobile-link:last-child a{border-bottom: none;}
.mobile-submenu-wrapper .mobile-link-2 a{color: #013076; font-size: 13px; margin: 0 25px 0 40px; padding:10px 0 10px 0; display: block; border-bottom: 1px solid #013076; font-family: 'gmarket-medium'}
.mobile-submenu-wrapper .mobile-link-2:last-child a{border-bottom: none;}
.close-menu{text-align:right; padding-right: 20px; padding-bottom: 10px;  }
.close-menu i {cursor: pointer;}
.close-menu i:hover{transform: rotate( 270deg );}


.btn-login{background: #101C54; padding-left: 25px; padding-right: 25px; border-radius: 15px; padding-top: 2px; padding-bottom: 3px}

.navbar-toggler{top: 20px; }
@media (min-width: 992px) {
	.navbar-toggler{top: 30px; }
}


/*------------------------------------
  Crumb
------------------------------------*/
.crumb-wrapper{
	opacity: 1;
	background: #fff;
	border-bottom: 1px solid #ebebeb;
	margin-bottom: 40px;
}

.menu-on .crumb-wrapper{
	/*visibility: hidden;*/
	/*opacity: 0;*/
}

/*메뉴 overflow 스크롤 기능*/
.scroll {
	white-space: nowrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: -ms-autohiding-scrollbar;
}

.scroll::-webkit-scrollbar {display: none; }

.crumb{position: relative;  width: 100% !important;}
.crumb .item {display: inline-block; position: relative;}
.crumb .item a{padding-top: 10px; padding-bottom: 10px; padding-right: 20px; padding-left: 20px; font-size: 12px; display: inline-block; -webkit-transition:all .3s; transition:all .3s}
.crumb .item a span{color: #A2A2A2; font-family: gmarket-medium; -webkit-transition:all .3s; transition:all .3s; position: relative;}
.crumb .item:after{content: ""; width: 0; height: 2px; background: #013076; position: absolute; bottom: 0; left:50%; -webkit-transition:all .3s; transition:all .3s}
.crumb .item.active:after{width:100%; left:0;}
.crumb .item:hover:after{width:100%; left:0;}

/*.crumb .item:hover {border-bottom: 2px solid #013076;}*/
.crumb .item:hover a span{color: #013076; }
.crumb .item.active a span{color: #013076; }

/*.crumb .item.active{border-bottom: 2px solid #013076;}*/

@media (min-width: 768px) {
	.crumb-wrapper{margin-bottom: 60px;}

	.crumb .item a{padding-top: 12px; padding-bottom: 12px; font-size: 14px; display: block}
	/*.crumb .item a{padding-top: 12px; padding-bottom: 12px; font-size: 14px; display: block}*/
	.crumb {display: inline-block !important}
}

.sticky-top{top:60px; z-index: 10;}
@media (min-width: 992px) {
	.sticky-top{top:100px;}
}



/*------------------------------------
  플로팅 메뉴
------------------------------------*/
.mfp-zoom-out-cur .float-menu-wrapper{display: none; z-index: 9999}
/*.float-menu-wrapper .menu-box{border: 1px solid #003C6F; width:95px; line-height: 1.3; }*/
.float-menu-wrapper{position: relative; }
.float-menu-wrapper img{max-width: 122px}
.float-menu{text-align: right; right:10px; position: absolute; z-index: 3000; top:60px;}
@media (min-width: 768px) {
	.float-menu-wrapper{position: relative; margin:0 auto; text-align: center;}
	.float-menu{right:10px; position: absolute; z-index: 3000; top:90px;}
}
@media (min-width: 992px) {
	/*.float-menu-wrapper{ width:992px; }*/
	.float-menu{right:40px; }
}
@media (min-width: 1200px) {
	/*.float-menu-wrapper{width: 1200px;}*/
	.float-menu{right:40px; }
}
