#me_contents {
	flex      : 1;
	min-width : 1024px;
	height    : 100%;
}
.me_display_none {
	display : none !important;
}
.me_visibility_off {
	visibility : hidden;
}
#me_header {
	width               : 100%;
	min-width           : 1024px;
	height              : 40px;
	min-height          : 40px;
	background          : linear-gradient(180deg, #F2F2F2 0%, #FFFFFF 57%);
	border-bottom-style : solid;
	border-bottom-width : 2px;
	border-bottom-color : #1FB8DF;
	box-shadow          : 0px 1px 5px rgba(0,0,0,0.3);
	user-select         : none;
}
#me_header_update {
	color        : #a6a6a6;
	font-size    : 12px;
	display      : flex;
	line-height  : 42px;
	margin-right : auto;
}
.me_ihighway_logo_img1 {
	width  : 108px;
	height : 40px;
}
.me_ihighway_logo_box {
	margin-left  : 5px;
	margin-right : 10px;
}
.me_ihighway_logo_img2 {
	width  : 400px;
	height : 40px;
}
.me_nexco_logo_img {
	width  : 59px;
	height : 40px;
}
.me_nexco_logo_box {
	width        : 59px;
	margin-right : 10px;
}
article#me_main_area {
	display  : flex;
	position : relative;
	height   : 100%;
}

#me_map_area {
	position         : relative;
	overflow         : hidden;
	float            : left;
	top              : 0px;
	min-width        : 1023px;
	min-height       : 625px;
	background-color : rgba(245,245,245,1);
	margin-left      : 0px;
	display          : flex;
	width            : 100%;
}

#me_map {
	width    : 100%;
	height   : 100%;
	position : relative;
	display  : block;
}

/*
* map zoom panel box
*/
#me_map_zoom_box {
	position      : absolute;
	box-sizing    : border-box;
	bottom        : 100px;
	right         : 15px;
	width         : 44px;
	height        : 154px;
	padding       : 4px;
	border-radius : 4px;
}

#me_map_zoom_box .zoom_ctrl {
	position         :relative;
	box-sizing       : border-box;
	width            : 44px;
	background-color : rgba(255,255,255,0.85);
	line-height      : 1em;
	text-align       : center;
	padding-top      : 3px;
	padding-bottom   : 3px;
	border-radius    : 22px 22px 22px 22px;
}

#me_map_zoom_box .zoom_ctrl .btn {
	cursor           : pointer;
	position         : relative;
	width            : 24px;
	height           : 24px;
	background-color : #67B0E6;
	margin-top       : 5px;
	margin-bottom    : 5px;
	margin-left      : auto;
	margin-right     : auto;
	border-style     : solid;
	border-width     : 2px;
	border-color     : #67B0E6;
	border-radius    : 14px;
}

#me_map_zoom_box .zoom_ctrl .btn:hover {
	background-color : #FF9500;
	border-color     : #FF9500;
	box-shadow       : 0px 1px 2px rgba(0,0,0,0.3);
}

#me_map_zoom_box .zoom_ctrl .bar {
	position         : relative;
	width            : 30px;
	background-color : #67B0E6;
	border-radius    : 15px;
	padding-top      : 1px;
	padding-bottom   : 1px;
	margin-left      : auto;
	margin-right     : auto;
}

#me_map_zoom_box .zoom_ctrl .lv {
	cursor              : pointer;
	position            :relative;
	overflow            : hidden;
	width               : 16px;
	height              : 16px;
	background-color    : #FFFFFF;
	color               : rgba(0,0,0,0);
	user-select         : none;
	-webkit-user-select : none;
	-moz-user-select    : none;
	margin              : 7px;
	border-radius       : 8px;
	opacity             : 0.35;
}

#me_map_zoom_box .zoom_ctrl .zoomlvselect {
	opacity : 1.0;
}

/* 
* buttn box 
*/
#me_map_btn_box {
	position   : absolute;
	box-sizing : border-box;
	top        : 22px;
	left       : 9px;
}

.me_map_btn_box_div {
	cursor        : pointer;
	position      : relative;
	box-sizing    : border-box;
	width         : 60px;
	height        : 60px;
	background    : linear-gradient(0deg, #2C9FD9 0%, #0087CC 100%);
	border-style  : solid;
	border-width  : 1px;
	border-color  : #FFFFFF;
	border-radius : 4px;
	box-shadow    : 0px 1px 4px rgba(0,0,0,0.25);
}

.me_map_btn_box_div:hover {
	border-color : #0087CC;
	box-shadow   : 0px 2px 4px rgba(0,0,0,0.4);
}
.me_map_btn_box_img {
	width  : 58px;
	height : 58px;
}
/*
* map key box
*/
#me_map_key_box {
	position            : absolute;
	box-sizing          : border-box;
	overflow            : hidden;
	bottom              : 12px;
	min-width           : 1010px;
	background-color    : #FFFFFF;
	font-size           : 12px;
	line-height         : 1em;
	border-style        : solid;
	border-width        : 2px;
	border-color        : rgba(0,119,204,0.35);
	transition-duration : 0.25s;
	cursor              : pointer;
	height              : 28px;
}

.me_key_note_boxselected{
	height : 145px !important;
}

#me_map_key_note {
	position            : relative;
	transition-duration : 0.25s;
}
.me_display_traffic {
	top : -18px;
}
.me_key_note_selected {
	top : 0px !important;
}
#me_map_key_box .btn {
	cursor           : pointer;
	position         : absolute;
	bottom           : 1px;
	right            : 1px;
	width            : 22px;
	height           : 22px;
	background-color : rgba(0,119,204,0.6);
}

#me_map_key_box .btn:hover {
	background-color : rgba(0,119,204,1);
}

#me_map_key_box .me_key_box_title {
	position     : relative;
	box-sizing   : border-box;
	width        : 90%;
	height       : 18px;
	background   : linear-gradient(90deg, rgba(0,119,204,0.2) 0%, rgba(0,119,204,0) 100%);
	color        : #001F80;
	font-size    : 12px;
	line-height  : 1em;
	padding-top  : 3px;
	padding-left : 4px;
}

#me_map_key_box ul {
	position       : relative;
	list-style     : none;
	width          : 100%;
	height         : 24px;
	font-size      : 12px;
	line-height    : 1em;
	padding-top    : 2px;
	padding-bottom : 2px;
	padding-left   : 4px;
	margin-bottom  : 4px;
}

#me_map_key_box li {
	position    : relative;
	float       : left;
	font-size   : 12px;
	line-height : 1em;
}

#me_map_key_box li span {
	position     : relative;
	display      : inline-block;
	box-sizing   : border-box;
	top          : -6px;
	color        : #4D4D4D;
	font-size    : 12px;
	line-height  : 1em;
	margin-right : 8px;
}

#me_map_key_box B {
	font-weight : 400;
}

/* section me_popArea*/

#me_pop_area {
	position : absolute;
	overflow : hidden;
	width    : 100%;
	height   : 100%;
	top      : 0px;
	left     : 0px;
}

#me_pop_select_area {
	position         : absolute;
	box-sizing       : border-box;
	width            : 100%;
	height           : 100%;
	background-color : rgba(0,0,0,0.8);
	justify-content  : center;
	align-items      : center;
	display          : flex;
}

#me_pop_select_area .noteBox {
	position         : relative;
	box-sizing       : border-box;
	width            : 800px;
	height           : 600px;
	background-color : #F9F9F9;
	flex-direction   : column;
	box-shadow       : 0px 2px 8px rgba(0,0,0,1);
}

#me_pop_select_area .listBox {
	position   : relative;
	box-sizing : border-box;
	overflow   : hidden;
	float      : left;
	width      : 240px;
	height     : 100%;
}

#me_pop_select_area .listBox .title {
	position         : relative;
	box-sizing       : border-box;
	width            : 100%;
	height           : 40px;
	background-color : #0087CC;
	color            : #FFFFFF;
	font-size        : 22px;
	font-weight      : 500;
	line-height      : 40px;
	text-align       : center;
}

#me_pop_select_area .listBox ul {
	list-style : none;
	position   : relative;
	box-sizing : border-box;
}

#me_pop_select_area .listBox .areaBtn {
	cursor           : pointer;
	position         : relative;
	width            : 240px;
	height           : 50px;
	background-color : rgba(0,0,0,0.65);
	color            : #FFFFFF;
	font-size        : 16px;
	line-height      : 50px;
	text-align       : center;
	margin-top       : 1px;
}

#me_pop_select_area .listBox .areaBtnOn {
	cursor           : pointer;
	position         : relative;
	width            : 240px;
	height           : 50px;
	background-color : #2C9FD9;
	color            : #FFFFFF;
	font-size        : 16px;
	line-height      : 50px;
	text-align       : center;
	text-shadow      : 0px 1px 4px #2C9FD9;
	margin-top       : 1px;
}

#me_pop_select_area .mapBox {
	position   : relative;
	box-sizing : border-box;
	float      : left;
	width      : 560px;
	height     : 600px;
}

#me_pop_select_area .mapBox .areaShape {
	cursor       : pointer;
	fill         : #00B4FF;
	fill-opacity : 0.1;
	stroke       : #88D3F2;
}

#me_pop_select_area .mapBox .areaShapeOn {
	cursor       : pointer;
	fill         : #00B4FF;
	fill-opacity : 0.5;
	stroke       : #88D3F2;
}

#me_pop_select_area .mapBox .mapDot {
	fill   : #0087CC;
	cursor : pointer;
}

#me_pop_select_area .mapBox .mapName {
	fill      : #0070C4;
	font-size : 12px;
	cursor    : pointer;
}

.me_btn_close {
	cursor           : pointer;
	position         : absolute;
	box-sizing       : border-box;
	top              : -8px;
	right            : -8px;
	width            : 32px;
	height           : 32px;
	background-color : #0087CC;
	border-style     : solid;
	border-width     : 1px;
	border-color     : #0087CC;
	border-radius    : 32px;
	box-shadow       : 0px 2px 4px rgba(0,0,0,0.4);
}

.me_btn_close:hover {
	transform : scale(1.25);
}

div#me_ic_name_popup {
	position         : absolute;
	background-color : #0087CC;
	color            : #FFFFFF;
	font-weight      : bold;
	min-width        : 180px;
	height           : 40px;
	line-height      : 40px;
	max-width        : 300px;
	padding          : 0px 10px;
	border           : 2px solid #0087CC;
	border-radius    : 15px;
	text-align       : center;
	word-break       : keep-all;
	box-shadow       : 2px 2px rgba(0, 127, 204, 0.5);
}
div#me_map_icname_popup {
	position : absolute;
	left     : 0px;
	top      : 0px;
}
.unselectable {
	webkit-touch-callout : none; /* iOS Safari */
	-webkit-user-select  : none; /* Safari */
	-khtml-user-select   : none; /* Konqueror HTML */
	-moz-user-select     : none; /* Firefox */
	-ms-user-select      : none; /* Internet Explorer/Edge */
	user-select          : none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

