@CHARSET "utf-8";


@import url(../font/Questrial-Regular.css);
@import url(../font/nanumgothic.css);

* {font-family: 'Nanum Gothic';font-weight:700;}

body.no-scrolling
{
	overflow:hidden;
}

body
{
    background: #141515;   
}

article
{
	margin:100px 15px 0 15px;
}

.text-shadow
{
    text-shadow: 0px 0px 5px rgba(43,16,7,0.5);
}

/* 상단 메뉴 */

.move-main
{
	cursor:pointer;
}

#navbar_fixed_top_background
{
	background: #141515;   
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:95px;
	z-index: 2000;
}

#navbar_fixed_top
{
	display:none;
    position: fixed;
    height: 60px;
    width: calc(100% - 30px);
    background:linear-gradient(to top, #3E3A39, #636161 );
    left: 15px;
    top: 20px;
    border-radius:10px;
	z-index: 2000;
	color: white;
	box-shadow: 0px 0px 10px rgba(34,24,20,0.5);
}

#navbar_fixed_top > #logo
{
	float:left;
	height:100%;
	width: 160px;
	line-height:55px;
	vertical-align:middle;
	text-align:center;
	padding: 0 20px;
}

#navbar_fixed_top > #logo div
{
	width:100%;
	height:60px;
	margin:0;
	background:url("../image/main_BI.png"); 
	background-size:contain;
	background-repeat:no-repeat;	
	background-position:center;
}

#nav_menu_bar
{
	display:none;
	position:fixed;
	height:60px;
	left:170px;
	top:20px;
	width:55%;
	min-width:425px;
	max-width:622px;
	z-index: 2002;
	background:linear-gradient(to top, #3E3A39, #636161 );
}

#nav_menu_bar a
{
	text-decoration: none;
    color: white;
}

#nav_menu_bar .menu_item
{
	display:block;
	position:relative;
	float:left;
	top:0;
	height:100%;	
	overflow:hidden;
}

#nav_menu_bar .menu_item.active
{
	background:url("../image/mainmenu_on_blank.png");
	background-size: 100% 100%;
	background-repeat:no-repeat;
	z-index:2;
}

#nav_menu_bar .menu_item.guide > img
{
	height: 100%;
}

#nav_menu_bar .menu_icon
{
	float:left;
	height:35px;
	margin:0;
	margin-left:2px;
	margin-top:2px;
	padding:0;
}

#nav_menu_bar .menu_title
{
	width:calc(100% - 43px);
	float:left;
	line-height:1.4em;
	text-align:center;
	margin:0;
	padding:0;
	margin-top:2px;
}

#nav_menu_bar .menu_item_content.short_title .menu_title
{
	margin-left:-6px;
}

#nav_menu_bar .menu_item_content.short_title .menu_icon
{
	margin-left:6px;
}

#nav_menu_bar .menu_item_content
{
	position:relative;
	top:8.5px;
	margin:0 auto;
	width:110px;
	padding:0;
}

#nav_menu_bar .menu_item:not(.guide)
{
	width:calc((100% - 6px) / 3);
}

#nav_menu_bar.admin .menu_item:not(.guide)
{
	width:calc((100% - 6px) / 4);
}

#nav_menu_bar .menu_item.guide
{
	z-index:1;
	margin-left:-2px;
	margin-right:-2px;
}

#nav_menu_bar .menu_item.active2
{
	z-index:2;
}

.navbar-content-right
{
    float: right;
}

.user-menu
{
    list-style: none;
    padding: 0 5px;
	margin-top:2.5px;
}

.user-menu li
{
    padding: 0 5px;
    float: left;
}

.guid-line
{
    margin-top: 7.5px;
    width: 2px;
    height: 20px;
    background: #333333;
    
    border-width: 0 1px 0 0;
    border-style: solid;
    border-color: #cccccc;
}

.user-menu .user-menu-icon
{
	position:relative;
	bottom:-10px;
	width:30px;
	cursor:pointer;
}

#warning_tab .user-menu-icon
{
	position:relative;
	bottom:-11px;
	width:35px;
}

#main_change_tab .user-menu-icon.main
{
	position:relative;
	bottom:-15px;
	margin-left:5px;
	width:30px;
	display:none;
}

#main_change_tab .user-menu-icon.list
{
	position:relative;
	bottom:-10px;
	margin-left:0px;
	width:40px;
	display:none;
}

#main_change_tab.list .user-menu-icon.list
{
	display:block;
}

#main_change_tab.main .user-menu-icon.main
{
	display:block;
}

.user-menu .badge2
{
    position: relative;
    left: 21px;
    top: -22px;
    background: #E61E19;
	padding:2px;
	padding-right:4px;
	border-radius:2px;
    font-size: 1em;
	box-shadow: 0px 0px 5px rgba(34,24,20,0.5);
	display:none;
}

#warning_tab, #user_tab, #main_change_tab
{
    width: 45px; 
	margin-right:3px;
	height:60px;
}

#warning_tab > img, #warning_tab >  .badge2 , #user_tab > img
{
	cursor:pointer;
}

#warning_list_div
{
	display:none;
	position:absolute;
	top:60px;
	width:70%; 
	max-width:250px;
	right:50px;
	background:#f5f5f5;
	color:black;
	border-radius:0 0 2px 2px;
	box-shadow: 0px 0px 10px rgba(34,24,20,0.5);
	z-index:2001;
}

#user_info_div
{
	display:none;
	position:absolute;
	top:60px;
	width:165px;
	right:10px;
	background:#f5f5f5;
	color:black;
	border-radius:0 0 2px 2px;
	box-shadow: 0px 0px 10px rgba(34,24,20,0.5);
	z-index:2001;
	padding-top:5px;
	
}

#warning_list_div > #warning_list
{
	width:100%;
	height:auto;
	overflow-y:auto;
	max-height:300px;
}

#warning_list_div:after {
    content: '';
    position: absolute;
    top: -10px;
    right: 15px;
    border-bottom: 11px solid #f5f5f5;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
}

#user_info_div:after {
    content: '';
    position: absolute;
    top: -10px;
    right: 12px;
    border-bottom: 11px solid #f5f5f5;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
}

#warning_list_div  ul, #user_info_div ul
{
	width:100%;
	list-style:none;
	padding:0;
	margin:0;
}

#warning_list_div ul li, #user_info_div ul li
{
	width:100%;
	position:relative;
}

#warning_list_div > #warning_list > ul > li
{
	padding:10px 0;
}

#warning_list_div #warning_list > ul > li:hover
{
	cursor:pointer;
	background:#FFFDEB;
}

#warning_list_div p
{
	margin:0;
	padding:0;
}

#warning_list_div .title
{
	text-align:center;
	font-size:1.3em;
	font-weight:800;
	color:#E61E19;
	margin:0;
	padding:0;
}

#warning_list_div .time
{
	padding-top:2.5px;
}

#warning_list_div .time, #warning_list_div .content
{
	text-align:center;
	font-size:1em;
}

.user-menu .guideline
{
	margin: 0 10px;
	width:calc(100% - 20px);
	height:2px;
	position:absolute;
	bottom:0px;
	left:0;
	background:#838383;
	border:none;
	border-radius:2px;
}

#warning_list_div li:last-child .guideline
{
	background:transparent;
}

#user_info li
{
	padding:2.5px 20px;
}

#user_info li:nth-child(2)
{
	padding-bottom:10px;
}

#user_info #btn_logout
{
	width:100px;
	height:45px;
	background:url("../image/btn_logout.png");
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	margin:10px auto;
	cursor:pointer;
}

#user_info #btn_logout:active
{
	background:url("../image/btn_logout_over.png");
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
}

/* warning wnd */
.popup-warning-background
{
	position:fixed;
	top:0;
	bottom:0;
	right:0;
	left:0;
	z-index:2999;
	opacity:0.3;
	background:#151515;
	display:none;
	background:red;
	
	animation:flashVisibility 2s infinite step-end;
	-moz-animation:flashVisibility 2s infinite step-end;
	-webkit-animation:flashVisibility 2s infinite step-end;
}

.popup-warning-background.flash-stop
{
	animation-play-state:paused;
	-webkit-animation-play-state:paused;
	-moz-animation-play-state:paused;
}

@keyframes flashVisibility {
	0% { opacity:0; }
	50% { opacity:0.3}
	100% { opacity:0; }
}

@-moz-keyframes flashVisibility {
	0% { opacity:0; }
	50% { opacity:0.3;}
	100% { opacity:0; }
}

@-webkit-keyframes flashVisibility {
	0% { opacity:0; }
	50% { opacity:0.3;}
	100% { opacity:0; }
}


.popup-warning-dlg
{
	z-index:3000;
	position:fixed;
	max-width : 320px;
	width : 85%;
	height : 300px;
	top:50%;
	left:50%;
	display:none;
}

.popup-warning-dlg.disconnected
{
	height : 110px;
	margin-top:95px;
}

.popup-align-border
{
	position:relative;
	width:100%;
	height:100%;
	margin-left: -50%;
	margin-top: -50%;
	background:#CA171C;
	border-radius: 5px;
	padding:10px;
	padding-top: 5px;
	box-shadow: 0px 0px 50px rgba(0,0,0,0.5);
}

.popup-warning-dlg .title
{
	color:white;
	font-size:1.2em;
	text-align:center;
}

.popup-warning-dlg .title img
{
	height : 35px;
	margin-top:-2px;
	margin-right:-5px;
}

.popup-warning-dlg .title .dialog-close
{
	position:absolute;
	right:12px;
	top:12px;
	font-size:1.2em;
	cursor:pointer;
	background:url("../image/close.png");
	background-size:contain;
	background-repeat:no-repeat;
	width:18px;
	height:18px;
}

.popup-warning-dlg.disconnected .title .dialog-close
{
	display:none;
}

.popup-warning-dlg .title .dialog-close:hover
{
	background:url("../image/close_on.png");
	background-size:contain;
	background-repeat:no-repeat;
}

.popup-warning-dlg .content
{
	position:absolute;
	top: 45px;
	bottom:15px;
	width:calc(100% - 20px);
	background: #F5F5F5;
	border-radius:2px;
	overflow-y:auto;
}


.popup-warning-dlg.disconnected .content
{
	position:absolute;
	height:50px;
	overflow:hidden;
	line-height:50px;
}

.popup-warning-dlg .content > div
{
	display:none;
}

.popup-warning-dlg.disconnected .content > div
{
	display:block;
	width:100%;
	height;100%;
}

.popup-warning-dlg .content p
{
	margin:0;
	padding:0;
	text-align:center;
	font-size:1em;
}

.popup-warning-dlg .content p.occur_time
{
	color:#E61E19;
	font-weight:800;
	font-size:1.2em;
}

.popup-warning-dlg .content p.clear_time
{
	color:#2956A5;
	font-weight:800;
	font-size:1.2em;
}

.popup-warning-dlg .content .guideline
{
	margin: 0 10px;
	width:calc(100% - 20px);
	height:2px;
	margin-top:12.5px;
	background:#838383;
	border:none;
	border-radius:2px;
}

.popup-warning-dlg .content .guideline:nth-last-child(1)
{
	background:transparent;
}

.popup-warning-dlg .content ul
{
	list-style:none;
	padding:0;
	margin:0;
}

.popup-warning-dlg .content ul > li
{
	padding-top:12.5px;
}

@media screen and (max-width:769px)
{
	#navbar_fixed_top > #logo
	{
		width:165px; padding:0 10px;
	}
}