.pushbar.opened{
display: block;
}




html.pushbar_locked{
    overflow: hidden;
    -ms-touch-action: none;
    touch-action: none;
}


.pushbar_locked .pushbar_main_content.pushbar_blur{
	filter:blur(15px);
}
.pushbar{
	position: fixed;
	will-change: transform;
	transition:transform 0.5s ease;
	will-change: transform;
	background:rgba(0,0,0,0.93);
    padding:50px 100px;
}
.pushbar_overlay{
	z-index: -999;
	position: fixed;
	width: 100%;
	max-width: 100%;
	height: 100%;
	min-height: 100vh;
	top: 0;
	left: 0;
    will-change: opacity;
    transition:opacity 0.5s ease;
    opacity:0;
    will-change: opacity;
	background: #000;
}
html.pushbar_locked .pushbar_overlay{
	opacity:0.8;
	z-index: 999;
    transition:opacity 0.5s ease;
}


.pushbar.from_left{
	top: 0;
	left: 0;
	width: 80%;
	max-width: 100%;
	height: 100%;
	min-height: 100vh;
	transform: translateZ(0) translateX(-100%);
	z-index:9999999999;
}

.pushbar.from_right{
	top: 0;
	right: 0!important;
	width: 80%;
	max-width: 100%;
	height: 100%;
	min-height: 100vh;
	transform: translateZ(0) translateX(100%);
	z-index:9999999999;
}

@media(max-width:800px){
.pushbar.from_left{
	width: 100%;
}

.pushbar.from_right{
	width: 100%;
}

.pushbar.from_right img{width:90%; margin:0 auto;}

}



.pushbar.from_top{
	top: 0;
	left: 0;
	width: 100%;
	max-width: 100%;
	min-height: 150px;
	transform: translateZ(0) translateY(-100%);
}
.pushbar.from_bottom{
	bottom: 0;
	left: 0;
	width: 100%;
	max-width: 100%;
	min-height: 150px;
	transform: translateZ(0) translateY(100%);
}

.pushbar.opened{
   transform: translateX(0px) translateY(0px);
}



/*푸쉬바메뉴*/
.pushbar ul {display:block;  margin:0 auto; text-align:center; }
.pushbar li {overflow:hidden; font-size:110%;}


.pushbar ul.depth1{}
.pushbar li.depth1{ border-bottom:1px dashed #d0cece; padding:40px 10px; display:inline-block; width:100%; text-align:left; float:left;}
.pushbar li.depth1 a{ color:#fff;}
.pushbar li.depth1 a.depth1{font-size:180%; font-weight:900;}
.pushbar li.depth1:nth-child(1){border-top:0;}
.pushbar li.depth1:nth-child(2){}
.pushbar li.depth1:nth-child(3){}
.pushbar li.depth1:nth-child(4){}
.pushbar li.depth1:nth-child(5){}
.pushbar li.depth1:nth-child(6){}
.pushbar li.depth1:nth-child(7){}
.pushbar li.depth1:first-child {border-top:0; padding-top:0;}
.pushbar li.depth1:last-child {padding-bottom:0; border-bottom:0;}


.pushbar ul.depth2{display:block; width: 260px; float: right;}
.pushbar li.depth2{display:block; padding:5px 0px;}
.pushbar li.depth2:hover a{color:#222;}
.pushbar li.depth2 a{display:block; color:#fff; text-align:left;}


.pushbar ul.depth3{padding-top:10px;}
.pushbar li.depth3{display:block; padding:0; font-size:80%;}
.pushbar li.depth3:hover a{color:#222; font-weight:500;}
.pushbar li.depth3 a{display:block; border:0; border-bottom:1px solid #ddd; padding:0; border-radius:0;}


.pushbar li a {display:inline-block; overflow:hidden; position:relative; padding-bottom: 0px; margin-bottom: 0px;}
.pushbar li:last-child a {padding-bottom: 0; margin-bottom: 0;}
.pushbar li a span {display:block; overflow:hidden;  }
.pushbar li a span:before {background-color:#f30; content:""; opacity:0; position:absolute; right:0; left:0; bottom:0; transition-duration:0.5s; -webkit-transition-duration:0.5s; margin:0 auto; height:2px; width:1px;}

.pushbar li a span b{display:none;}

.pushbar a:hover span {color: #ff0; font-weight: 400;}
.pushbar a:hover span:before {opacity:1; width:100%;}


@media(max-width:1200px){
.pushbar ul.depth1{padding-top:50px;}
.pushbar li.depth1{ width:100%; }
.pushbar ul.depth2{width:50%;}
}