@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------
	File : layout.css
	Company : The Webstyle co.,ltd
 	Author : Ho Sung, Lee 2018-08
 	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, color/font, align, etc
--------------------------------------------------------------------------------------------------------------------------------------------*/

/* Skip Menu */
#skipMenu {position:fixed; left:0px; top:0px; z-index:9999; width:100%;}
#skipMenu a {
	display:block; 
	overflow:hidden; 
	width:0px; 
	height:0px; 
	font-size:16px; 
	line-height:30px; 
	color:#fff; 
	font-weight:bold; 
	text-align:center; 
	background:#2466a6;
}
#skipMenu a:focus, #skipNav a:active {width:100%; height:auto;}

/* Wrapper */
.wrapper {position:relative; width:100%; min-width:1280px; min-height:100%; background-color:#e7ebee;}
.dashboard {background-color:#fcfcfc;}

/* Header */
.header {
	position:fixed; 
	left:0px; 
	top:0px; 
	z-index:300; 
	width:100%; 
	height:52px; 
	background-color:#fff;
	box-shadow:0px 0 5px 2px rgba(0,0,0,0.1);
}
.header:after {content:""; display:block; clear:both;}
.header .logo-header {display:inline-table; float:left;}
.header .logo-header a {display:table-cell; width:220px; height:52px; padding-left:15px; vertical-align:middle;}

.header .gnb-wrap {float:right; position:relative; height:52px; padding:10px 62px 10px 0px;}
.header .gnb-wrap .btn_lnb_toggle {position:absolute; top:0; right:0; width:52px; height:52px; border:0; background-color:#7190b4;}
.header .gnb-wrap .btn_lnb_toggle span:before {font-size:18px; line-height:52px; color:#fff;}

.header .gnb {display:inline-block;}
.header .gnb:after {content:''; display:block; clear:both;}
.header .gnb > li {float:left; margin:0 3px;}
.header .gnb > li .btn {width:30px; height:30px; line-height:28px; border:1px solid #d0d0d0;}
.header .gnb > li .gnb-site .ui-select-val {min-width:200px; border:1px solid #d0d0d0;}

/* Container */
.container {
	overflow:hidden;
	position:relative; 
	margin-left:220px; 
	padding:52px 0px 32px 0px;	 
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

.login .container {margin-left:0;}

/* Aside */
.aside {
	position:fixed; 
	left:0px; 
	top:0px; 	
	z-index:200; 
	/*overflow:hidden;*/
	width:220px; 
	height:100%; 
	padding:52px 0 32px 0; 
	background-color:#7190b4;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.aside .aside-userInfo {position:relative; background-color:#294d84;}
.aside .aside-userInfo .aside-user {position:relative; padding-left:40px; font-size:14px; line-height:50px; color:#fff;}
.aside .aside-userInfo .aside-user:before {position:absolute; top:0px; left:17px; font-size:14px;}

.aside .lnb-wrap {display:block; position:relative; }
.aside .lnb a {display:block; position:relative; padding:0 40px;}
.aside .lnb li {position:relative;}
.aside .lnb li.node1 a.depth1 {height:56px; font-family:"NotoSans-Medium"; font-size:14px; line-height:56px; color:#fefefe;}
.aside .lnb li.node1 a.depth1:before {
	display:inline-block;
	position:absolute;
	top:0px;
	left:20px; 
	font-family:"Font Awesome 5 Free"; 
	font-size:14px;
	line-height:56px;
	font-weight:900;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;		
}
.aside .lnb li.node1.hasMenu a.depth1:after {
	content:"\f107"; 
	display:inline-block;
	position:absolute;
	top:0px;
	right:15px;
	font-family:"Font Awesome 5 Free"; 
	font-size:20px; 
	line-height:56px; 
	font-weight:900;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;		
}
.aside .lnb li.node1 a.depth1:before {left:15px; line-height:56px;}
.aside .lnb li.node1:hover a.depth1,
.aside .lnb li.node1.on a.depth1 {
	background-color:rgba(0,0,0,0.1);
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.aside .lnb li.node1.hasMenu.on a.depth1:after {content:"\f106";}
.aside .lnb li.node1 .submenu {display:none; background-color:#292c2f;}
.aside .lnb li.node1 .submenu li.node2 a.depth2 {height:44px; font-size:14px; line-height:44px; color:#fff;}
.aside .lnb li.node1 .submenu li.node2:hover a.depth2 {
	background-color:rgba(255,255,255,0.1);
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;	
}
.aside .lnb li.node1 .submenu li.node2:hover a.depth2:after {
	content:"\f0d9";
	display:inline-block;
	position:absolute;
	top:0px;
	right:0px; 
	font-family:"Font Awesome 5 Free";
	font-size:14px;
	line-height:44px;
	font-weight:900;
	color:#fff;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;		
}

.container.aside_fold {margin-left:50px;}
.aside_fold .aside {left:-170px;}
.aside_fold .aside .aside-userInfo .aside-user {right:-170px; overflow:hidden; width:50px; font-size:0px;}
.aside_fold .aside .aside-userInfo .aside-user:before {left:0px; width:100%; text-align:center;}
.aside_fold .aside .lnb li.node1 a.depth1 {display:inline-block; right:-170px; overflow:hidden; width:50px; padding:0; font-size:0px;}
.aside_fold .aside .lnb li.node1 a.depth1:before {left:0; width:100%; text-align:center;}
.aside_fold .aside .lnb li.node1 a.depth1:after {display:none;}
.aside_fold .aside .lnb li.node1 .submenu {display:none;}

.aside_fold .aside .lnb li.node1:hover a.depth1 {background-color:#292c2f;}
.aside_fold .aside .lnb li.node1:hover .submenu {display:block !important; position:absolute; top:0px; right:-220px; width:220px;}


/* Content */
.content {position:relative; padding:0 20px 50px;}

/* Breadcrumb */
.breadcrumb-wrap {position:relative; height:50px; margin:0 -20px 30px; padding-top:14px; background-color:#a1aab8;}
.breadcrumb-wrap .breadcrumb {padding-left:20px;}
.breadcrumb-wrap .breadcrumb:after {content:""; display:block; clear:both;}
.breadcrumb-wrap .breadcrumb li {position:relative; float:left; margin-left:6px; font-size:13px; line-height:20px; color:#fff;}
.breadcrumb-wrap .breadcrumb li:before {
	content:"\f105"; 
	display:inline-block;
	margin-right:6px;
	font-family:"Font Awesome 5 Free"; 
	font-size:16px; 
	line-height:20px; 
	font-weight:900; 
	vertical-align:middle;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
}
.breadcrumb-wrap .breadcrumb li:first-child {margin-left:0px;}
.breadcrumb-wrap .breadcrumb li:first-child:before {display:none;}
.breadcrumb-wrap .breadcrumb li a,
.breadcrumb-wrap .breadcrumb li span {font-size:13px; color:#fff; vertical-align:middle;}
.breadcrumb-wrap .breadcrumb li.home a {font-size:0px;}
.breadcrumb-wrap .breadcrumb li.home a:before {font-size:13px;}

.content-header {position:relative; margin-bottom:25px;}
.content-header h2 {font-family:'NotoSans-Medium'; font-size:20px; font-weight:normal; color:#333;}
.content-header h2.fa:before {margin-right:10px; font-size:22px; color:#666;}
.content-body {position:relative;}

/* Footer */
.footer {position:fixed; left:0px; bottom:0px; z-index:300; width:100%; min-height:32px; padding-left:220px; background-color:rgba(0,0,0,0.8);}
.footer .copyright {font-family:"NotoSans-Light"; font-size:12px; line-height:32px; color:#fff; text-align:center;}
.footer .btn_debug {position:absolute; top:6px; right:10px; height:15px; background:transparent;}
.footer .btn_debug>span {color:#fff;}
.footer .debug-wrap {overflow:hidden; height:0px; margin-left:-220px; 
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;	
}
.footer .debug-wrap iframe {width:100%; height:500px; background-color:#fff;}

.debug .container {padding-bottom:532px;}
.debug .footer .debug-wrap {height:500px;}

.login .footer {overflow:hidden; min-height:0px; height:0px; background-color:none;}
.login .footer .btn_debug {display:none;}
.login .footer .copyright {display:none;}