@charset "utf-8";

.sidenav { position:fixed; top:60px; width:0px; /*min-height:calc(100% + 60px);*/ height:calc(100% + 60px); border-right:1px solid #ccc; background:#f4f4f4; /* overflow-x:hidden; overflow-y:auto;*/ display:block; z-index:300; margin-top:-60px; }
.sidenav .sidenav_top { width:230px; height:60px; padding-top:10px; border-right:1px solid #2a386f; background:#35478c; text-align:center; /*display:none;*/ }
.sidenav .sidenav_topBottom { display:none; }

.sidenav .sidenav_top h1 { position:absolute; left:30px; width:160px; height:41px; line-height:43px; padding-left:51px; background:url(/images/common/mark.png) no-repeat; background-size:auto 40px; color:#fff; font-family:esamanru-Medium, "이사만루 미디엄"; font-size:140%; text-align:left; display:block;}

@media (max-width:768px){
	.sidenav {
		position: fixed; /* Stay in place */
		top:60px;
		width: 0; /* 0 width - change this with JavaScript */
		overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 0px; /* Place content 60px from the top */
		transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
		background:#f4f4f4;
		display:block;		
	}
	
	.sidenav .sidenav_top {  }
	.sidenav .sidenav_top h1 { padding-right:10px;}
	.sidenav .sidenav_top a.closebtn { position:absolute; right:10px; top:5px;    transition: 0.3s; }
	.sidenav .sidenav_top a.closebtn:link,
	.sidenav .sidenav_top a.closebtn:visited { color:#888; font-size:36px; }
	.sidenav .sidenav_top a.closebtn:active,
	.sidenav .sidenav_top a.closebtn:focus,
	.sidenav .sidenav_top a.closebtn:hover { color:#fff; }
}