#navToggle{
	z-index:120
}
#iconMenu{
	vertical-align:middle
}
#navToggle .line{
	background:#fff;
	left:22%;
	width:56%;
	height:2px;
	opacity:1
}
.line-1{
	top:10px
}
.isActive .line-1{
	transform:translateY(7px) translateX(0) rotate(225deg)
}
.line-2{
	top:50%;
	margin-top:-1px
}
#navToggle.isActive .line-2{
	opacity:0;
	left:45%;
	width:10%
}
.line-3{bottom:10px}
.isActive .line-3{transform:translateY(-7px) translateX(0) rotate(-225deg)}

/** #gNavWrap **/
#glovalNav,
#glovalNav .sub-menu,
#glovalNav .menu-item{padding:0}
#gNavWrap{
	height:100%;
	border-right:1px solid #dbdbdb;
	width:calc(100% - 54px);
	max-width:100%;
	left:0;
	z-index:120;
	overflow-y:auto;
	visibility:hidden;
	transition:all .6s ease-in-out,padding .4s ease-in-out;
	transform:translateX(-100%);
	-webkit-overflow-scrolling:touch
}
#gNavWrap.isVisible{
	visibility:visible;
	transform:translateX(0)
}
#glovalNav .sub-menu{
	padding:0;
	margin:0
}

/** .menu-item **/
#glovalNav .menu-item,
#glovalNav .menu-item a{display:block}
#glovalNav .menu-item{width:100%;display:block}
#glovalNav .menu-item a{
	display:flex;
	align-items:center;
	padding:0 .8em
}
#glovalNav a::before{content:"\f0da";padding-right:.4em}
#glovalNav .menu-item-has-children{cursor:pointer}
#glovalNav .menu-item-has-children::after{content:"\f0d7";position:absolute;z-index:2;top:0;right:0}
#glovalNav .menu-item-has-children.isActive::after{content:"\f0d8"}
#glovalNav .menu-item .sub-menu a{
	height:0;
	line-height:0;
	opacity:0;
}
/* 1st */
#glovalNav>.menu-item>a::before{content:"";padding:none}
#glovalNav>.menu-item>a,
#glovalNav>.menu-item-has-children::after{
	height:56px;
	line-height:1;
}
#glovalNav>.menu-item>a{
	border-bottom:1px solid #ffffff;
	padding:0 .4em;
}
#glovalNav>.menu-item>a i{
	margin-right:.4em;
	font-size:1.2em;
	line-height:1
	-webkit-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
}
#glovalNav>.menu-item-has-children>a{padding-right:56px}
#glovalNav>.menu-item-has-children::after{
	width:56px;
	height:55px;
	border-left:1px solid #ffffff;
	font-size:1.2em
}

/* 2nd */
#glovalNav .sub-menu a{
}

#glovalNav .sub-menu a:hover,
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children:hover::after,
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children.isActive::after{
	color:#565656;
}

#glovalNav>.menu-item>.sub-menu>a,
#glovalNav>.menu-item>.sub-menu>.menu-item-has-children::after{
	height:0;
	line-height:0;
	opacity:0;
}
#glovalNav>.menu-item>.sub-menu>a{border-bottom:0 solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item>a,
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children::after{
	line-height:1;
	opacity:1;
}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item>a{
	height:40px;
	border-bottom:1px solid #d1d1d1
}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children::after{
	width:40px;
	height:40px;
	border-left:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children.isActive::after{
	height:39px
}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item>a{border-bottom:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item:last-child>a{border-bottom:1px solid #ffffff}
#glovalNav>.menu-item:last-child>.sub-menu.isVisible>.menu-item:last-child>a{border-bottom:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children.isActive>a{border-bottom:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu>.menu-item-has-children>a{
	padding-right:40px
}
#glovalNav>.menu-item>.sub-menu>.menu-item-has-children::after{
	width:40px;
	font-size:1.1em
}

/* 3rd */
#glovalNav .sub-menu .sub-menu a{
	height:0;
	line-height:0;
	opacity:0;
	padding-left:1.6em;
}
#glovalNav .sub-menu.isVisible .sub-menu.isVisible a{
	height:36px;
	line-height:1;
	opacity:1;
	border-bottom:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item>.sub-menu.isVisible>.menu-item>a{border-bottom:1px solid #d1d1d1}
#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item>.sub-menu.isVisible>.menu-item:last-child>a{border-bottom:1px solid #ffffff}
#glovalNav>.menu-item:last-child>.sub-menu.isVisible>.menu-item>.sub-menu.isVisible>.menu-item:last-child>a{border-bottom:1px solid #d1d1d1}

@media(min-width:576px),print{
	#gNavWrap{max-width:360px}
}

@media(min-width:992px),print{
	#glovalNav,
	#glovalNav>.menu-item,
	#glovalNav>.menu-item>a,
	#glovalNav>.menu-item-has-children::after,
	#glovalNav>.menu-item>.sub-menu>.menu-item-has-children::after,
	#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children::after{
		height:100%;
		padding:0;
		border:none;
	}
/** #gNavWrap **/
	#gNavWrap,#gNavWrap.isVisible{
		border:none;
		width:100%;
		height:56px;
		max-width:1002px;
		margin:0 auto;
		visibility:visible;
		transform:translateX(0);
		overflow-y:visible;
		transition:all .4s ease-in-out;
	}
	.scroll #gNavWrap,
	.scroll #gNavWrap.isVisible{
		height:40px;
		visibility:visible;
		transform:translateX(0);
	}
/** .menu-item **/
	#glovalNav .menu-item-has-children::after,
	#glovalNav>.menu-item-has-children.isActive::after{background:none;width:auto;font-size:.9em;padding:0 .6em}

/* 1st */
	#gNavWrap #glovalNav>.menu-item>a,
	#gNavWrap #glovalNav>.menu-item-has-children>a{padding:0 .8em}
	#glovalNav>.menu-item>a::before{content:none;padding:0}
	#glovalNav>.menu-item>a{
		-ms-flex-direction:column!important;
		flex-direction:column!important;
		-ms-flex-pack:center!important;
		justify-content:center!important;
		border-left:1px solid #ffffff;
	}
	#glovalNav>.menu-item>a{
		font-size:.9em;
	}
	#glovalNav>.menu-item>a i{
		margin:.2em 0 .2em 0;
		font-size:1.4em;
	}
	.scroll #glovalNav>.menu-item>a i{
		font-size:1em;
	}

/* 2nd */
	#glovalNav > .menu-item > .sub-menu,
	#glovalNav > .menu-item > .sub-menu.isVisible{
		position:absolute;
		z-index:1;
		top:100%;
		left:0;
		width:236px;
		min-width:calc(100% + 1px);
		font-size:.9em
	}
	#glovalNav > .menu-item-has-children:hover > .sub-menu > .menu-item > a,
	#glovalNav > .menu-item-has-children > .sub-menu.isVisible > .menu-item > a,
	#glovalNav > .menu-item-has-children:hover > .sub-menu.isVisible > .menu-item > a,
	#glovalNav > .menu-item > .sub-menu.isVisible > .menu-item-has-children::after,
	#glovalNav > .menu-item > .sub-menu.isVisible > .menu-item-has-children.isActive::after,
	#glovalNav > .menu-item:hover > .sub-menu > .menu-item-has-children::after{
		height:32px
	}
	#glovalNav .menu-item-has-children .sub-menu .menu-item>a{
		border-right:1px solid #d1d1d1;
		border-left:1px solid #d1d1d1;
		border-bottom:1px solid #d1d1d1!important;
	}
	#glovalNav > .menu-item-has-children:hover > .sub-menu > .menu-item > a,
	#glovalNav > .menu-item-has-children > .sub-menu.isVisible > .menu-item > a,
	#glovalNav > .menu-item-has-children:hover > .sub-menu.isVisible > .menu-item > a{
		opacity:1;
		visibility:visible;
		margin-top:0;
		line-height:1;
	}
	#glovalNav>.menu-item>.sub-menu.isVisible>.menu-item-has-children::after,
	#glovalNav>.menu-item>a:hover.sub-menu.isVisible>.menu-item-has-children::after,
	#glovalNav .menu-item .sub-menu .menu-item-has-children::after{
		content:"\f0da";
		width:auto;
		padding:0 .6em 0 0;
	}
	#glovalNav > .menu-item > .sub-menu.isVisible > .menu-item-has-children::after,
	#glovalNav > .menu-item:hover > .sub-menu > .menu-item-has-children::after{
		opacity:1;
		visibility:visible
	}
	#glovalNav > .menu-item > .sub-menu.isVisible > .menu-item-has-children.isActive::after{
		background:none
	}

/** 3rd **/
	#glovalNav > .menu-item > .sub-menu > .menu-item:first-child > a{border-top:none}
	#glovalNav .menu-item .sub-menu .menu-item:last-child a{border-bottom:1px solid #c1c1c1}
	#glovalNav .sub-menu .sub-menu{
		position:absolute;
		z-index:1;
		top:-1px;
		left:calc(100% - 1px);
		width:200px;
		visibility:hidden
	}
	#glovalNav .sub-menu .menu-item:hover .sub-menu,
	#glovalNav .sub-menu.isVisible .sub-menu{
		opacity:1;
		visibility:visible
	}
	#glovalNav .sub-menu .sub-menu .menu-item a{
		height:0;
		line-height:0;
		opacity:0;
		padding:0 .8em
	}
	#glovalNav .sub-menu .menu-item:hover .sub-menu a,
	#glovalNav .sub-menu.isVisible .menu-item .sub-menu.isVisible a{
		height:32px;
		line-height:1;
		opacity:1;
	}
	#glovalNav .sub-menu .menu-item:hover .sub-menu .menu-item:first-child a,
		#glovalNav .sub-menu.isVisible .menu-item .sub-menu.isVisible .menu-item:first-child a{
		height:33px;
		border-top:1px solid #d1d1d1!important;
	}
}

@media (min-width:1200px),print{
	#glovalNav{
		border-right:1px solid #ffffff;
	}
}
