﻿#header{background:url('../images/blue/bg_top.gif') repeat-x 0 0; height:110px;}
#header_con{min-width:960px; max-width:95%;margin:0 auto; position:relative; height:110px;}
#header_con h1{padding-top:20px; float:left;}

#utilmenu{color:#b6b6b6; float:right; font-family:Verdana; font-size:12px;}
#utilmenu:after{content:''; clear:both; display:none;}
#utilmenu .topmenu{float:left; margin-right:30px; padding-top:18px; color:#b7b7b7;}
#utilmenu .topmenu span{color:#05a7fa;padding-right:5px;}
#utilmenu .menu{float:left;}
#utilmenu .menu .btn_menu{display:block; width:100px; height:55px; background:url('../images/btn_menu_off.png') no-repeat 0 0; text-indent:-3000px;}
#utilmenu .menu.over .btn_menu{display:block; width:100px; height:55px; background:url('../images/btn_menu_on.gif') no-repeat 0 0;}
#utilmenu .menu.over #nav{display:block;}


ul.top-menu {position: absolute; right: 66px; top: 64px;}
ul.top-menu > li {float: left; margin-left: 5px;}
ul.top-menu > li.has-submenu {position: relative; }
ul.top-menu > li > a {color: white; padding: 6px 25px; border: 1px solid white; border-radius:5px;}
ul.top-menu > li > a:hover {background-color: darkcyan; }
ul.top-menu > li.has-submenu > ul.submenu {display: none; list-style-type: none; position: absolute; padding: 0; width: max-content; right: 0; background-color: darkcyan; border: solid 1px #f0f0f0; z-index: 100;top: 20px;}
ul.top-menu > li.has-submenu:hover > ul.submenu {display: block;}
ul.top-menu > li.has-submenu > ul.submenu> li {float:none;min-width: 110px;}
ul.top-menu > li.has-submenu > ul.submenu> li:hover {background-color: dodgerblue;}
ul.top-menu > li.has-submenu > ul.submenu> li > a { color: white;font-weight: normal;font-size: 13px;padding: 3px 10px;line-height: 30px;width: 200px; display: block;}

/* nav menu */
#nav{display:none; width:371px; height:45px; padding:4px 8px 7px 4px; border: 3px solid black; background-color: white; position:absolute; top:54px; right:-4px;}
#nav:after{content:''; display:block; clear:both;}
#nav li{float:left; height:35px; background:url('../images/bg_nline.gif') no-repeat right 0; text-align:center;}
#nav li.call{width:79px;}
#nav li.call a{width:78px;}
#nav li.monitor{width:95px;}
#nav li.monitor a{width:94px;}
#nav li.report{width:96px;}
#nav li.report a{width:95px;}
#nav li.admin{width:95px;}
#nav li.admin a{width:94px;}
#nav li.aboutus{width:105px; background:none;}
#nav li.aboutus a{width:104px;}
#nav li a{display:block; height:35px; padding-top:12px; text-decoration:none; font-weight:bold;}
#nav li a:hover {background:#f5f3eb; color:#b96026;}

#container{min-width:960px; max-width:95%; margin:0 auto; padding-bottom:10px; position:relative;}
#container2{min-width:1377px; max-width:95%; margin:0 auto; padding-bottom:100px; position:relative;}
.location{position:absolute; top:11px; right:0; font-size:11px; color:#8b8b8b;}
.location .on{color:#373737;}
.title{height:36px; padding-top:6px; margin-bottom:30px; background:url('../images/bg_contop.gif') repeat-x 0 bottom;}
.title h2{font-size:22px;color:#333;}
.home {position:relative;top:-1px;}

/* footer */
#footer{height:135px; padding-top:30px; border-top:1px solid #f1f1f1;}
#footer p{min-width:960px; max-width:95%; margin:0 auto;  text-align:center; color:#8c8c8c; font-family:Verdana;  font-size:11px;}

#footer2{height:135px; padding-top:30px; border-top:1px solid #f1f1f1;}
#footer2 p{min-width:1377px; max-width:95%; margin:0 auto;  text-align:center; color:#8c8c8c; font-family:Verdana;  font-size:11px;}

* html #nav ul { margin: 0 0 0 -2px; }

/** @group clearfix **/
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
 
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }


/* con_type_new */
.con_type_new:after{content: ""; display: block; clear: both;}

/*.left_area_out{float:left; width:69%; border-right:1px solid #ddd;}
.right_area{float:left;width:30%;}*/
.left_area_out{margin-right:320px; border-right:1px solid #ddd; overflow:auto;}
.right_area{float:right; width:320px;}

#main-top{ position:relative; overflow:hidden; vertical-align:top;}
#main-top:after{ content:" "; display:block; clear:both; }
#main-top.type1 .main-top{float:left; width:100%; position:relative;}
#main-top.type1 .main-top .main-top01 {margin-right:320px; border-right:1px solid #ddd; overflow:hidden;}
#main-top.type1 .main-top .main-top02 {float:right; width:320px;}

.super_number {min-width: 23px;height: 15px;border-radius: 50px;padding: 0;background: #0098e6;text-align: center;line-height: 15px;color: #fff;font-size: 12px;display: inline-block;margin-left: -20px;top: 10px;position: absolute;}

/* by Hee Shin */
.solo_link_list:before { content: "\f054"; font-family: FontAwesome; padding-right: 5px; }
.solo_link_list > a{line-height:18px; font-size:13px; color:#333;}
.solo_link_list > a:hover{color:#0060be;}

.Company {display: none;}
.UserType {display: none;}

.ex-drop-active {background-color:aquamarine;}
.ex-drop-hover {background-color:darkseagreen;}

table.type4{width:100%; margin-bottom:10px; border-top:3px solid #222933; border-bottom:1px solid #222933;}
table.type4 > thead > tr > th{padding:0; background:#d3d4d6; border-bottom:1px solid #222933;  font-size:15px; color:#222933; font-family:roboto_bo,arial,sans-serif;}
table.type4 > tbody > tr{height: 30px;}
table.type4 > tbody > tr > th{padding:0 10px; background:#fafafa; border-top:1px solid #d3d4d6; font-size:13px; color:#444; white-space: nowrap;}
table.type4 > tbody > tr:first-child > th, table.type4 > tbody > tr:first-child > td{border-top:0 none;}
table.type4 > tbody > tr > th:first-child{border-left:0 none;}
table.type4 > tbody > tr > td{padding:3px 10px; border-top:1px solid #d3d4d6;}
table.type4 > tbody > tr > td p{color:#000000;}
table.type4 > tbody > tr > td p .bold{font-family:roboto_bo,arial,sans-serif; color:#000000;}


.loading {z-index:10000;position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.modal_loading {background: #000; position: fixed; left: 0; top: 0; z-index: 8999; width: 100%; height: 100%; opacity: .40; z-index:10000;}
.notification_inactive { padding: 3px 15px; background-color: gray; color: white; border-radius: 5px; border: 1px solid #f0f0f0;}

.Callback {color: pink; font-size: 25px; margin-right: 10px; display: inline-block; cursor: pointer; position: relative;}
.Callback > div {border: 1px solid white; background-color: darkcyan; position: absolute; top: 20px; left: 0px; font-size: 14px; z-index: 100; display: none;}
.Callback:hover > div {display: block; }
.Callback > div > a {white-space: nowrap; padding: 3px 10px;line-height: 24px; color: white; display: block;}
.Callback:hover > div > a:hover {background-color: dodgerblue; }