@charset "utf-8";

.sidenav { position:relative; display:none; z-index:1000000000; }

@media (max-width:1024px){
	/* The side navigation menu */
	.sidenav {
		position:relative;
		height: 100%; /* 100% Full-height */
		width: 300px; /* 0 width - change this with JavaScript */
		position: fixed; /* Stay in place */
		z-index:10000000; /* Stay on top */
		top: 0;
		right: -310px;
		background-color: #303847; /* Black*/
		overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 0px; /* Place content 60px from the top */
		transition: right 0.5s;       
		display:block;
	}
	
	/* The navigation menu links */
	.sidenav .mdepth1 a {
		padding: 8px 8px 8px 32px;
		text-decoration: none;
		font-size: 25px;
		color: #818181;
		display: block;
		/*transition: 0.3s*/
	}
	
	/* When you mouse over the navigation links, change their color */
	.sidenav a:hover, .offcanvas a:focus{
		color: #f1f1f1;
	}
	
	/* Position and style the close button (top right corner) */
	.sidenav .closebtn {
		position: absolute;
		top: 5px;
		right: 10px;
		font-size: 36px;	   
	}
	
	/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
	#main {
		transition: margin-left .5s;
		padding: 20px;
	}
	
	.sidenav h2 { width:220px; height:70px; padding:15px 0 0 50px; background:url(/broadcast/images/common/mark.png) no-repeat 0 15px; background-size:auto 40px; color:#fff; font-weight:800; font-size:1.7rem; display:block; margin-left:16px; }
	.sidenav h2 span { display:block; }
	

	.sideAllmenu { position:relative; width:100%; padding:0 16px; z-index:1; }
	
	.sideAllmenu ul.mdepth1 { width:100%; border-top:2px solid #00578e; }
	.sideAllmenu ul.mdepth1 li { position:relative; width:100%; display:block; border-bottom:1px solid #3e4656;  }
	.sideAllmenu ul.mdepth1 li a:link,
	.sideAllmenu ul.mdepth1 li a:visited { padding:12px 0 12px 15px; background:url(/broadcast/images/common/sidemenu_depth1_bltoff.gif) no-repeat right 50%; text-decoration:none; color:#ccc; font-weight:bold; font-size:1.7rem; display:block; transition:0.3s; }
	.sideAllmenu ul.mdepth1 li a:active,
	.sideAllmenu ul.mdepth1 li a:focus,
	.sideAllmenu ul.mdepth1 li a:hover,
	.sideAllmenu ul.mdepth1 li a.select { background:url(/broadcast/images/common/sidemenu_depth1_blton.gif) no-repeat right 50%; color:#fff; }
	
	.sideAllmenu ul.mdepth1 li ul.mdepth2 { width:100%; border-top:none; background:#159ef0;  display:none;}
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li { width:100%; border-bottom:none; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a:link,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a:visited { padding:10px 0 10px 25px; text-decoration:none; color:#053450; font-weight:normal; font-size:1.5rem; display:block; transition:0.3s;  border-top:1px solid #138bd4; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a:active,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a:focus,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a:hover,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.select { color:#fff; font-weight:bold; }

	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.bltDepth:link,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.bltDepth:visited { background:url(/broadcast/images/common/sidemenu_depth2_bltoff.gif) no-repeat right 50%; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.bltDepth:active,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.bltDepth:focus,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li a.bltDepth:hover { background:url(/broadcast/images/common/sidemenu_depth2_blton.gif) no-repeat right 50%; }
	
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 { width:100%; border-top:none; background:#0c78b8; display:none; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li { width:100%; border-bottom:none; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a:link,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a:visited { padding:10px 0 10px 39px; background:url(/broadcast/images/common/sidemenu_depth3_bltoff.gif) no-repeat 25px 50%; text-decoration:none; color:#add5f7; font-weight:normal; font-size:1.5rem; display:block; transition:0.3s;  border-top:1px solid #1a80bc; }
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a:active,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a:focus,
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a:hover
	.sideAllmenu ul.mdepth1 li ul.mdepth2 li ul.mdepth3 li a.select {background:url(/broadcast/images/common/sidemenu_depth3_blton.gif) no-repeat 25px 50%; color:#fff;  }


	.sideAllmenu ul.mdepth1 li .icon { position:absolute; right:10px; top:10px; }






	.sidenav .fontSetting { position:relative; float:right; margin:0 20px 5px 0; }


	.sidenav .fontSetting .fontSizeCont { top:45px;  }

}





/* 모바일용 하위링크 */
@media (max-width:1024px){
	.mUnderLink { width:100%; padding:0 16px; display:block; margin-top:30px; }
	.mUnderLink ul { width:100%; border-top:2px solid #0d795e}
	.mUnderLink ul li { width:100%;  border-bottom:1px solid #3e4656; }
	.mUnderLink ul li:last-child { display:none; }
		
	.mUnderLink ul li a:link,
	.mUnderLink ul li a:visited { width:100%; padding:10px 0 10px 16px; color:#ccc; font-size:1.6rem; display:block; }
	.mUnderLink ul li a:active,

	.mUnderLink ul li a:hover,
	.mUnderLink ul li a.select { color:#fff; }


}