@charset "utf-8";


/************************************************
	 Basic
************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0; padding:0; font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;}
div,dl,dt,dd,ul,ol,li,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button { font-size:12px; font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;}
fieldset,img {border:0 none;}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
input::-ms-clear {display:none}
button {border:0 none;background-color:transparent;cursor:pointer}
.clear {clear:both;}
*html .clear6 {_clear:both;}
table { border-collapse:collapse;}
html {height: 100%; color: #262424}
body {height: 100%; background: #ebebeb; color: #262424}
.fl { float: left}
.fr { float: right}

/* Form */
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; background: url( ../images/ico_dropdown.png) no-repeat right #fff; background-size: 17px 30px; padding: 4px 25px 5px 5px; height: 30px; border: 1px solid #969696; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
select::-ms-expand { display: none; }
.input_wrap {display: inline-block}
.input_basic {border: 1px solid #969696; padding: 0 8px; height: 28px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.input_basic:hover {border: 1px solid #e8437b; transition-property: border-color, color; transition-duration: 0.3s; transition-timing-function: ease-out;}
.input_basic:focus {border: 1px solid #e8437b;}
.input_basic_search {border: 1px solid #969696; padding: 0 8px; height: 28px; border-radius: 3px 0px 0px 3px; -webkit-border-radius: 3px 0px 0px 3px; -moz-border-radius: 3px 0px 0px 3px;}
.input_basic[disabled], .input_basic[readonly], fieldset[disabled] .input_basic { cursor: pointer; background-color: #eee; opacity: 1;}
.safezone_map_wrap {width: 100%; height: 100%; position: relative; overflow: hidden;}
.safezone_save {position: absolute; bottom:10px; left: 10px; z-index: 1000}
.btn_search {background: url(../images/ico_search.png) no-repeat; border-radius: 0px 3px 3px 0px; -webkit-border-radius: 0px 3px 3px 0px; -moz-border-radius: 0px 3px 3px 0px; background-size: 30px; width: 30px; height: 30px;}
.btn_download {background: url(../images/ico_download.png) no-repeat;}
.btn_refresh {background: url(../images/ico_refresh.png) no-repeat;}
.btn_more {background: url(../images/ico_list_more.png) no-repeat;}
.btn_close01 {background: url(../images/ico_closewindow.png) no-repeat;}
.btn_expand {background: url(../images/ico_increase_window.png) no-repeat; background-size: 62px; width: 62px; height: 24px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px}
.btn_funtion {background-size: 30px; width: 30px; height: 30px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px}
.btn_saveset_sub {text-align: center; margin-top: 10px;}
.btn_saveset_mid {text-align: center; margin-top: 10px;}
.btn_positive {border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; height: 30px; padding: 0 10px; min-width: 50px; background: #e8437b; color: #fff}
.btn_positive:hover { background: #fe4382;}
.btn_positive:visited { color: #fe4382;}
.btn_negative {border-radius: 3px; border: 1px solid #969696; -webkit-border-radius: 3px; -moz-border-radius: 3px; height: 30px; padding: 0 10px; min-width: 50px; background: #dcdcdc; color: #262424;}
.btn_negative:hover { background: #eaeaea;}
.btn_negative:visited { color: #ff0000;}
.search_field {margin-bottom: 10px; display: inline-block}
.funtion_field {margin-bottom: 10px; display: inline-block}
.btn_basic01 {padding:2px 5px; display:inline-block; background: #fff; border:1px solid #b7abae; border-radius:3px; margin:1px 2px; color: #462c35;}
.map_funtion_wrap input {width: 150px; border: none; text-align: center;}
.map_view {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

#location_info {margin-top:5px;}
#layout_safety_zone div div {margin-bottom: 5px;}

.login_wrap {background: #34292d;}
.login_tit {width: 100%; max-height: 240px; padding: 40px 0; background: #fff; text-align: center}
.login_tit h2 {width: 240px; text-align: center; margin: 0 auto;}

.login_input {width: 320px; margin: 0 auto}
.login_input dl {padding-top: 30px;}
.login_input dd {margin-bottom: 15px;}
.login_input dd a {margin-top: 15px; margin-right: 37px}
.login_input .input_infor {width: 300px; height: 45px; background: #efe8e8; font-size: 16px; border-radius: 3px; border: none; padding: 0 10px}
.login_input .button_confirm {width: 320px; height: 45px; background: #e8437b; font-size: 16px; border-radius: 3px; border: none; color: #fff}
.login_input .button_cancel {width: 320px; background: none; font-size: 16px; border-radius: 3px; border: none; color: #aeabac}
.login_input .checkbox {color: #fff}
.login_input li {width: 158px; padding: 12px 0; border: 1px solid #716a6d; text-align: center; float: left; color: #fff; cursor: pointer; font-size: 14px}
.login_input li:hover {text-decoration: underline}

header .profile_area {margin: 18px 20px; color: #fff}
.profile_area h1 {font-size: 18px; padding-left: 35px; padding-top: 2px; font-weight: normal; margin-bottom: 15px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;  width: 135px; height: 30px; position: relative}
.profile_area h1 span {border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; overflow: hidden; display: block; width: 30px; height: 30px; position: absolute; top: 0px; left: 0px;}
.profile_area h2 {background: url(../images/ico_clientgroup.png) no-repeat 10px 14px; background-size: 14px; font-size: 14px; font-weight: normal; padding: 10px  25px 10px 27px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;  width: 70%; height: 20px; position: relative}
.profile_area .profile_wrap {width: 100%; border: 1px solid #5d5457;}
.profile_area h2 a {position: absolute; top: 6px; right: 3px; padding: 5px; display: block}
.profile_area ul {/*border: 1px solid #5d5457;*/ border-top: 0px; text-align: center; width: 100%; padding-top: 7px}
.profile_area ul li {text-align: center; font-size: 12px; display: inline; }
.profile_area ul li a {display: inline-block; margin: 0 10px; border: 1px solid #5d5457; border-radius: 36px; -webkit-border-radius: 36px; -moz-border-radius: 36px; width: 36px; height: 18px; padding: 9px 0;}
.profile_area ul li a:link {text-decoration: none; color: #9b8f94;}
.profile_area ul li a:hover { background: #821744; border: 1px solid #821744;}
.profile_area ul li a:visited {text-decoration: none; color: #9b8f94;}

#layout_html_group_inout_list button, #layout_html_group_asset_list button, #pay_grid_v_m, #pay_grid_v_3m, #pay_grid_p_m, #pay_grid_p_3m {margin-bottom: 3px;}

.map_funtion li {width: 50px; height: 52px; cursor: pointer;}
.map_funtion .refresh {background: url(../images/ico_maprefresh.png) no-repeat; background-size: 50px 52px;}
.map_funtion .satellite {background: url(../images/ico_satellite.png) no-repeat; background-size: 50px 52px;}
.map_funtion .roadview {background: url(../images/ico_roadview.png) no-repeat; background-size: 50px 52px;}
.map_funtion .transport {background: url(../images/ico_transport.png) no-repeat; background-size: 50px 52px;}
.map_funtion .search {background: url(../images/ico_search_map.png) no-repeat; background-size: 50px 52px;}
.map_funtion .chat {background: url(../images/ico_chat_onmap.png) no-repeat; background-size: 50px 52px;}

.map_funtion .satellite_on {background: url(../images/ico_satellite_on.png) no-repeat; background-size: 50px 52px;}
.map_funtion .roadview_on {background: url(../images/ico_roadview_on.png) no-repeat; background-size: 50px 52px;}
.map_funtion .transport_on {background: url(../images/ico_transport_on.png) no-repeat; background-size: 50px 52px;}
.map_funtion .chat_on {background: url(../images/ico_chat_onmap_on.png) no-repeat; background-size: 50px 52px;}

@media screen and (min-width:800px){
/* GNB */
header {width: 220px; background: #34292d; height: 100%; position: fixed; overflow-y: auto; color: #fff; z-index: 1000}

.gnb {margin-bottom:20px}
.gnb h3 {font-size: 14px; font-weight: normal; padding-left: 20px; margin: 5px 20px 15px 20px;}
.gnb h3 a:link {color: #ffffff; text-decoration: none}
.gnb h3 a:hover {color: #ffffff; text-decoration: underline}
.gnb h3 a:visited {color: #ffffff; text-decoration: none}
.gnb .catchloc {background: url(../images/ico_catchloc.png) no-repeat 0 3px; background-size: 14px;}
.gnb .saas {background: url(../images/ico_saas.png) no-repeat 0 3px; background-size: 14px;}
.gnb .dashboard {background: url(../images/ico_dashboard.png) no-repeat 0 3px; background-size: 14px;}
.gnb .sys_manage {background: url(../images/ico_system_manage.png) no-repeat 0 3px; background-size: 14px;}
.gnb .manual {background: url(../images/ico_manual.png) no-repeat 0 4px; background-size: 14px;}
.gnb .api {background: url(../images/ico_api.png) no-repeat 0 4px; background-size: 14px;}
.gnb ul {margin-bottom:15px}
.gnb .on a {border-left: 5px solid #e8437b!important;}
.gnb .on a:link {color:#fff!important; background-color:#821744;}
.gnb .on a:visited {color:#fff!important;}
.gnb ul li a {display: block; font-size: 14px; padding: 8px 10px 8px 35px;}
.gnb ul li a:link{color:#c0b5b9; text-decoration: none; border-left: 5px solid #34292d; transition-property: background-color, color; transition-duration: 0.3s; transition-timing-function: ease-out;}
.gnb ul li a:hover{color:#fff; background-color:#821744; border-left: 5px solid #e8437b; transition-property: background-color, color; transition-duration: 0.3s; transition-timing-function: ease-out;}
.gnb ul li a:visited{color:#c0b5b9; background-color:#821744; border-left: 5px solid #34292d;}
.gnb_close {position: fixed; top:10px; left: 220px; z-index: 1000; display: none}

footer {border-top: 1px solid #5d5457; margin: 30px 20px; padding: 30px 0px; font-size: 11px; color: #9b8f94}
footer p {margin-bottom: 3px; font-size: 11px; font-weight: 100}
footer a:link {color: #9b8f94; text-decoration: none;}
footer a:hover {color: #fff; text-decoration: underline;}
footer a:visited {color: #9b8f94; text-decoration: none;}
footer .language_option {margin-bottom: 10px; position: relative}
footer .language_option select {background: #34292d; color: #cfc4c7; border: 1px solid #5d5457; width: 123px; height: 30px;}
footer .language_option button {position: absolute; top: 0px; right: 0px; background: #5d5457; color: #cfc4c7; border: 1px solid #5d5457; width: 60px;  height: 30px;}

.device_situation {float: left; width: 50%; }
.device_situation .statics {position: relative; text-align: center; margin:25px 0 25px 0}
.device_situation .statics li {text-align: center; width: 20%; padding: 5px 0 0 0; font-size: 48px; float: left}
.device_situation .statics li span {display: block; text-align: center; font-size: 12px; margin-top: -7px; line-height: 1.3em; color: #858585}
.device_situation .statics li span a {color: #e8437b}
.statics .btn_positive {margin-bottom: 15px}
.device_situation .map {height: 300px; border: 1px solid #ccc; position: relative}
.device_situation .map button {position: absolute; top: 60px; left: 10px; z-index: 100}
.table_dashboard {}
.table_dashboard th{padding: 8px 0; text-align: left; width: 90px}
.table_dashboard td{}
.client_logo {width: 150px; height: 100%; background: #fff; border-right: 1px solid #ccc; position: absolute; top: 0px; left: 1px}
.client_logo h3 {text-align: center; height: 150px; line-height:150px;}
.client_logo img {max-width:100%; max-height:100%; vertical-align: middle}
.client_logo p {text-align: center; font-size: 14px; margin-top: 10px}
.client_infor {margin-left: 150px;}

section {margin-left: 240px; margin-right: 20px; padding-bottom: 50px}
.map_wrap {margin-left: 0px; margin-right:0px; padding-bottom: 0px}
.map_wrap h2 {position: absolute; top:0px; left: 240px; z-index: 100}
section h2 {padding-top: 18px; margin-bottom: 10px; font-size: 20px; font-weight: normal}
section h2 .hamburger_menu {margin-right: 5px; margin-left: -5px; padding: 5px; display: none;}
.btn_saveset {text-align: center; margin-top: 10px; position: fixed; bottom: 0px; left: 180; background: #ebebeb; padding: 10px 0px; width: 100%; margin-left: -130px; z-index: 10; border-top: 1px solid #ccc;}

/* Option */
.option_wrap {background: url(../images/bg_dot_gray.gif) repeat-y 50% 0 #f5f5f5; border: 1px solid #cccccc; width: 100%;}
.option_section {width: 50%; float: left}

.option_inside {padding: 10px 20px}
.input_field {width: 100%; margin: 10px 0;}
.input_field dt {width: 25%; float: left; padding-top: 5px}
.input_field dd {width: 75%; float: left;}


/* Table */
.table_basic {}
.table_basic td {border-collapse: collapse; border: 1px solid #cccccc; padding: 3px; text-align: center; word-break: break-all}
.table_basic th {border-collapse: collapse; border: 1px solid #cccccc; border-bottom: 2px solid #cccccc; background: #fff; padding: 7px 3px;}
.table_basic tr:nth-child(even)  { background-color: #ffffff; }
.table_basic tr:nth-child(odd)   { background-color: #f5f5f5; }
.table_basic tr:hover {background-color:#eedde3;}
tr {display: table-row; vertical-align: inherit; border-color: inherit;}
.table_wrap {overflow-x:auto; overflow-y: none; box-sizing:border-box; margin-bottom: 10px; width: 100%}
.table_header_wrap {padding-right: 17px}
.table_data_wrap {overflow-y: scroll; overflow-x: hidden; box-sizing:border-box; float: left; width: 100%}
.table_data {overflow-x:auto; overflow-y:auto; box-sizing:border-box;}
.width_64px {width: 64px;}
.width_100px {width: 100px;}
.width_150px {width: 150px;}
.width_180px {width: 180px;}
.width_200px {width: 200px;}
.width_100per {width: 100%;}
.width_95per {width: 95%;}
.width_50per {width: 50%;}
.height_100per {height: 100%;}
.height_350px {height: 350px;}
.height_300px {height: 300px;}
.height_200px {height: 200px;}
.height_150px {height: 150px;}

/* iœ?i¹?i??i™ⓒ Window */
.location_current {width:180px; background:#fafafa; border-right:1px solid #CCC; position:fixed; left:220px; top:0px; height:100%; z-index:100; padding:0px 10px;}
.location_current .window_close {position: absolute; top: 20px; right:-30px; cursor: pointer}
.location_current .window_expand {position: absolute; top:50%; right: -24px; margin-top: -50px; cursor: pointer}
.current_sub {left:421px;}
.location_current .search_box {margin: 5px 0}
.location_current input, .location_current button {display:inline}
.location_current .search_box input {width:64px;}
.location_current td, .location_current th {text-align:center; cursor:pointer; font-size:12px;}
.location_current .situation_none {color:#F00;}
.location_current .situation_going {color:#faa725;}
.location_current .situation_stop {color:#41ca7b;}
.location_current .search {width:173px;margin-top:7px}
.location_current .select_option {margin:10px 0 10px 0; height:32px;}
.location_current select {width:100%; display:inline}
.location_current a {float:right}

.map_funtion {position: absolute; top: 50px; right: 0px; width: 50px; z-index:100;}

.map_funtion_wrap {width: 340px; position: absolute; top:17px; left:50%; margin-left: -50px; margin-top: 0px; z-index: 1000; text-align: center}
.map_funtion_wrap .search_wrap {width: 200px; margin: 0 auto; margin-bottom: 5px}

.map_layer_modal {width: 840px; border: 1px solid #cccccc; background:#fafafa; position: absolute; bottom: 0px; left: 50%; margin-left: -290px; z-index: 999}
.map_layer_modal .tit {border-bottom: 1px solid #cccccc; padding: 10px 10px 2px 10px;}

/*Chat*/
.group_chat {background:#c5dee8; z-index:500; height:200px; width:800px; position:absolute; bottom:0px; left:50%; margin-left:-300px; margin-bottom:10px; border:1px solid #8bacb9;}
.group_chat .chat_contents {height:155px; overflow:auto;}
.group_chat .emoticon {width: 35px ; height: 35px;}
.chat_contents .view_others {margin:20px 10px 0px 10px;}
.chat_contents .view_others .nickname {text-align:left; padding-top:0px;}
.chat_contents .view_others .message_wrap {max-width:75%; margin-top:7px; float:left}
.chat_contents .view_others .message {border-radius:7px; background:#fff; padding:10px;}

.chat_contents .view_me {margin:20px 10px 0px 10px; text-align:right;}
.chat_contents .view_me .nickname {margin-left:10px; padding-top:0px; text-align:right}
.chat_contents .view_me .message_wrap {max-width:75%; margin-top:7px; float:right}
.chat_contents .view_me .message {border-radius:7px; background:#e0fbf4; padding:10px; text-align:left;}
.chat_contents .view_me img, .chat_contents .view_others img {margin-top:-11px;}
.chat_contents .time {margin-top:5px; margin-bottom:0px; font-size:11px;}

.group_chat .chat_input {position:absolute; bottom:0px; width:100%; height:45px; background:#FFF;}
.chat_input .nickname_form {padding:0 7px; height:44px; width:65px; border:none; background:#8bacb9; font-size:12px; color:#fff; text-align:center; float:left}
.chat_input input::-webkit-input-placeholder {color:#fff;}
.chat_input input::-moz-placeholder {color:#fff; opacity:1;}
.chat_input .input_form {padding:15px 5px 0 10px; height:29px; width:620px; border:none; float:left}
.chat_input button { position:absolute; bottom:4px; right:6px;}

.group_chat .windowsize {position:absolute; top:-42px; right:-1px;}
.group_chat .push_onoff {position:absolute; top:-42px; right:45px; color:#FFF; border-radius:3px 3px 0px 0px; background:#8bacb9; height:22px; padding:10px;}
.group_chat .push_onoff input {margin-top:4px;}
.group_chat .notice_onoff {position:absolute; top:-42px; right:129px; color:#FFF; border-radius:3px 3px 0px 0px; background:#8bacb9; height:22px; padding:10px;}
}



@media screen and (max-width:800px){
/* GNB */
header {width: 220px; background: #34292d; height: 100%; position: fixed; overflow-y: auto; color: #fff;  display: none; z-index: 1000}

/*Chat*/
.group_chat {background:#c5dee8; z-index:500; height:200px; width:100%; position:absolute; bottom:0px; left:0px; margin-left:0px; margin-bottom:0px; border:1px solid #8bacb9;}
.group_chat .chat_contents {height:155px; overflow:auto;}
.group_chat .emoticon {width: 35px ; height: 35px;}
.chat_contents .view_others {margin:20px 10px 0px 10px;}
.chat_contents .view_others .nickname {text-align:left; padding-top:0px;}
.chat_contents .view_others .message_wrap {max-width:75%; margin-top:7px; float:left}
.chat_contents .view_others .message {border-radius:7px; background:#fff; padding:10px;}

.chat_contents .view_me {margin:20px 10px 0px 10px; text-align:right;}
.chat_contents .view_me .nickname {margin-left:10px; padding-top:0px; text-align:right}
.chat_contents .view_me .message_wrap {max-width:75%; margin-top:7px; float:right}
.chat_contents .view_me .message {border-radius:7px; background:#e0fbf4; padding:10px; text-align:left;}
.chat_contents .view_me img, .chat_contents .view_others img {margin-top:-11px;}
.chat_contents .time {margin-top:5px; margin-bottom:0px; font-size:11px;}

.group_chat .chat_input {position:absolute; bottom:0px; width:100%; height:45px; background:#FFF;}
.chat_input .nickname_form {padding:0 7px; height:44px; min-width:60px; width:15%; border:none; background:#8bacb9; font-size:12px; color:#fff; text-align:center; float:left}
.chat_input input::-webkit-input-placeholder {color:#fff;}
.chat_input input::-moz-placeholder {color:#fff; opacity:1;}
.chat_input .input_form {padding:15px 5px 0 10px; height:29px; width:58%; border:none; float:left}
.chat_input button { position:absolute; bottom:4px; right:6px;}

.group_chat .windowsize {position:absolute; top:-42px; right:5px;}
.group_chat .push_onoff {position:absolute; top:-42px; right:51px; color:#FFF; border-radius:3px 3px 0px 0px; background:#8bacb9; height:22px; padding:10px;}
.group_chat .push_onoff input, .group_chat .notice_onoff input {margin-top:4px;}
.group_chat .notice_onoff {position:absolute; top:-42px; right:135px; color:#FFF; border-radius:3px 3px 0px 0px; background:#8bacb9; height:22px; padding:10px;}


/*GNB*/
.gnb {margin-bottom:20px;}
.gnb h3 {font-size: 14px; font-weight: normal; padding-left: 20px; margin: 5px 20px 15px 20px;}
.gnb h3 a:link {color: #ffffff; text-decoration: none}
.gnb h3 a:hover {color: #ffffff; text-decoration: underline}
.gnb h3 a:visited {color: #ffffff; text-decoration: none}
.gnb .saas {background: url(../images/ico_saas.png) no-repeat 0 5px; background-size: 14px;}
.gnb .dashboard {background: url(../images/ico_dashboard.png) no-repeat 0 5px; background-size: 14px;}
.gnb .sys_manage {background: url(../images/ico_system_manage.png) no-repeat 0 5px; background-size: 14px;}
.gnb .catchloc {background: url(../images/ico_catchloc.png) no-repeat 0 5px; background-size: 14px;}
.gnb .manual {background: url(../images/ico_manual.png) no-repeat 0 5px; background-size: 14px;}
.gnb .api {background: url(../images/ico_api.png) no-repeat 0 5px; background-size: 14px;}
.gnb ul {margin-bottom:15px}
.gnb .on a {border-left: 5px solid #e8437b!important;}
.gnb .on a:link {color:#fff!important; background-color:#821744;}
.gnb .on a:visited {color:#fff!important;}
.gnb ul li a {display: block; font-size: 14px; padding: 8px 10px 8px 35px;}
.gnb ul li a:link{color:#c0b5b9; text-decoration: none; border-left: 5px solid #34292d; transition-property: background-color, color; transition-duration: 0.3s; transition-timing-function: ease-out;}
.gnb ul li a:hover{color:#fff; background-color:#821744; border-left: 5px solid #e8437b; transition-property: background-color, color; transition-duration: 0.3s; transition-timing-function: ease-out;}
.gnb ul li a:visited{color:#c0b5b9; background-color:#821744; border-left: 5px solid #34292d;}
.gnb_close {position: fixed; top:10px; left: 220px; z-index: 1000;}

footer {border-top: 1px solid #5d5457; margin: 30px 20px; padding: 30px 0px; font-size: 11px; color: #9b8f94}
footer p {margin-bottom: 3px; font-size: 11px; font-weight: 100}
footer a:link {color: #9b8f94; text-decoration: none;}
footer a:hover {color: #fff; text-decoration: underline;}
footer a:visited {color: #9b8f94; text-decoration: none;}
footer .language_option {margin-bottom: 10px; position: relative}
footer .language_option select {background: #34292d; color: #cfc4c7; border: 1px solid #5d5457; width: 123px; height: 30px;}
footer .language_option button {position: absolute; top: 0px; right: 0px; background: #5d5457; color: #cfc4c7; border: 1px solid #5d5457; width: 60px;  height: 30px;}

.device_situation {margin-bottom: 20px; padding-top: 28px;}
.device_situation .statics {background: #fff; text-align: center; border: 1px solid #ccc; border-bottom: none; position: relative}
.device_situation .statics li {text-align: center; width: 50%; padding: 15px 0; font-size: 36px; float: left; letter-spacing: -1px}
.device_situation .statics li span {display: block; text-align: center; font-size: 10px; margin-top: -5px; line-height: 1.3em; color: #858585}
.device_situation .statics li span a {color: #e8437b}
.device_situation .statics .btn_positive {display: inline-block; margin-top: 35px; margin-bottom: 15px;}
.device_situation .map {height: 300px; border: 1px solid #ccc; position: relative}
.device_situation .map button {position: absolute; bottom: 10px; left: 50%; margin-left: -37px; z-index: 100}
.table_dashboard {}
.table_dashboard th{padding: 8px 0; text-align: left; width: 90px}
.table_dashboard td{}
.client_logo {width: 100%; padding: 0; background: #fff; border: 1px solid #ccc; text-align: center; height: 150px; line-height:150px;}
.client_logo h3 {float: left; width: 50%; text-align: center;}
.client_logo img {max-width:100%; max-height:100%; vertical-align: middle}
.client_logo p {float: right; width: 50%; text-align: center; font-size: 14px; max-width:100%; max-height:100%; vertical-align: middle}
.client_infor {margin: 10px 0 0 0px;}

section {margin-left:10px; margin-right:10px; padding-bottom: 50px}
.map_wrap {margin:0px;}
section h2 {padding-top: 18px; margin-bottom: 10px; font-size: 20px; font-weight: normal; width: 100%}
.map_wrap h2 {position: absolute; top:0px; left: 20px; z-index: 103}
section h2 .hamburger_menu {position: absolute; top:10px; right: 3px; height: 30px; width: 40px; text-align:center; display: block; background: #edf1f4; border: 1px solid #ccc; z-index: 500}
.btn_saveset {text-align: center; margin-top: 10px; position: fixed; bottom: 0px; left: 0px; background: #ebebeb; padding: 10px 0px; width: 100%; margin-left: 0px; z-index: 10; border-top: 1px solid #ccc;}

/* iœ?i¹?i??i™ⓒ Window */
.location_current {width:180px; background:#fafafa; border-right:1px solid #CCC; position:fixed; left:0px; top:60px; height:100%; z-index:100; padding:0px 10px; font-size:12px;}
.location_current .window_close {position: absolute; top: 20px; right:-30px; cursor: pointer}
.location_current .window_expand {position: absolute; top:50%; right: -24px; margin-top: -50px; cursor: pointer;}
.current_sub {left:5px; box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 3px 3px;}

.map_funtion {position: absolute; top: 62px; right: 0px; width: 50px; z-index:100;}

.map_funtion_wrap {width: 240px; position: absolute; top:17px; left:50%; margin-left: -120px; margin-top: 0px; z-index: 99; text-align: center}
.map_funtion_wrap .search_wrap {width: 200px; margin: 0 auto; margin-bottom: 5px}

.map_layer_modal {width: 360px; border: 1px solid #cccccc; background:#fafafa; position: absolute; top:20%; left: 50%; margin-left: -180px; z-index: 999}
.map_layer_modal .tit {border-bottom: 1px solid #cccccc; padding: 10px 10px 2px 10px;}
.map_layer_modal .tit .fr {float: none; clear: both;}


/* Option */
.option_wrap {background:#f5f5f5; border: 1px solid #cccccc; width: 100%;}
.option_section {width: 100%; float: none}
.option_inside {padding: 10px 15px 10px 10px}
.input_field {width: 100%; margin: 0;}
.input_field dt {width: 100%; padding-top: 5px; margin-bottom: 3px;}
.input_field dd {width: 100%;}
.search_field select {margin-bottom: 5px;}
.safezone_save select, .safezone_save input, .safezone_save button {margin-bottom: 5px;}

/* Table */
.table_basic {}
.table_basic td {border-collapse: collapse; border: 1px solid #cccccc; padding: 3px; text-align: center; word-break: break-all;}
.table_basic th {border-collapse: collapse; border: 1px solid #cccccc; border-bottom: 2px solid #cccccc; background: #fff; padding: 7px 3px;}
.table_basic tr:nth-child(even)  { background-color: #ffffff; }
.table_basic tr:nth-child(odd)   { background-color: #f5f5f5; }
.table_wrap {overflow-x:auto; overflow-y: none; box-sizing:border-box; margin-bottom: 10px; width: 100%}
.table_header_wrap {padding-right: 0px}
.table_data_wrap {overflow-y: scroll; overflow-x: hidden; box-sizing:border-box; float: left; width: 100%; padding-right: 17px; -webkit-overflow-scrolling: touch;}
.table_data {overflow-x:auto; overflow-y:auto; box-sizing:border-box;}
.width_64px {width: 64px;}
.width_100px {width: 100px;}
.width_150px {width: 150px;}
.width_180px {width: 180px;}
.width_200px {width: 200px;}
.width_100per {width: 100%;}
.width_95per {width: 95%;}
.width_50per {width: 100%;}
.height_100per {height: 100%;}
.height_350px {height: 350px}
.height_200px {height: 200px}
.iframe-wrap{overflow: auto; -webkit-overflow-scrolling: touch;}
.iframe-wrap iframe{width: 100%; height: 100%;}

#layout_safety_zone_on select {margin-bottom: 5px}
}
table td #button_gper_location_monitor, table #query_ble_sn {margin-bottom: 5px}
.option_inside #map_view {margin-bottom: 5px}
#logo_name_file {border:none; padding-left: 0px}
#req_container {margin-top: 5px!important;}