body.map {
	background: #f3f3f3;
	overflow: hidden;
}

body.map .construct {
	position: absolute;
	top: 0;
	width: 100%;
	height: -webkit-calc(100% - 55px);
	height: -moz-calc(100% - 55px);
	height: calc(100% - 55px);
}

body.map #construct {
	z-index:9900;
	background-color: #f6f6f6;
}

body.map #construct_bg {
	background: url('../resources/layout/under_construct_bg.png');
	z-index: 9901;
	padding-top: 300px;
	text-align: center;
}

body.map .message-box.hidden {
	display: none !important;
}

body.map #preload-map {
	position:fixed;
	background: url('../resources/layout/map_png.png');
	width: 1px;
	height: 1px;
	left: -9999px;
}

body.map .side-btn-group {
	position: fixed;
	background: white;
	top: 25%;
	z-index: 10;
}

body.map .side-btn-group .separator {
	width: 16px;
	height: 1px;
	background: silver;
	margin: auto;
}

body.map .side-btn-group .side-btn {
	width: 28px;
	height: 28px;
	padding: 8px;
	cursor: pointer;
}
body.map .side-btn-group .side-btn.disabled img{
	opacity: 0.5;
	-moz-opacity:0.5;
}
body.map #left-btn {
	left: 0;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	display: none;
}

body.map .side-btn-caption {
  width: 0px;
  height: 20px;
  overflow: hidden;
  white-space: nowrap;
  background-color: white;
}

body.map #left-btn .side-btn-caption span{
	padding-left: 5px;
}

body.map #left-btn .side-btn-caption {
  position: relative;
  /*top: -28px;
  left: 40px;*/
  top: -28px;
  left: 35px;
}

body.map #right-btn {
	right: 0;
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

body.map #right-btn .side-btn-caption {
  position: relative;
  /*top: -28px;
  right: 12px;*/
  top: -28px;
  right: 6px;
  text-align:right;
}
body.map #right-btn .side-btn-caption span {
  position: absolute;
  top:0;
  right:0;
  padding-right: 5px;
}

body.map #right-btn .all-btn-obj.hide{
	display: none;
}

body.map #zoom-btn {
	position: fixed;
	background: white;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	width: 23px;
	height: 78px;
	padding: 5px;
	top: 37px;
	right: 8px;
	font-size: 0;
	z-index: 10;
}

body.map #zoom-btn #zoom_in {
	cursor: pointer;
	background: url('../resources/layout/map_zoom_in.png') center no-repeat;
	width: 23px;
	height: 23px;
}

body.map #zoom-btn #magnifier {
	background: url('../resources/layout/map_mag.png') center no-repeat;
	width: 23px;
	height: 32px;
}

body.map #zoom-btn #zoom_out {
	cursor: pointer;
	background: url('../resources/layout/map_zoom_out.png') center no-repeat;
	width: 23px;
	height: 23px;
}

body.map #mode-btn-group {
	display: none;
	position: fixed;
	right: 20px;
	bottom: 80px;
	z-index: 10;
}

body.map #mode-btn-group #mode-icons {
	opacity: 0;
}

body.map #mode-btn-group:hover #mode-icons {
	opacity: 1;
}

body.map #mode-btn-bg {
	background: url('../resources/layout/slide_bg.png') center no-repeat;
	width: 97px;
	height: 25px;
	padding: 3px 4px 1px 2px;
}

body.map #mode-btn {
	background: url('../resources/layout/slide_btn.png') center no-repeat;
	width: 49px;
	height: 25px;
}

body.map #mode-icons {
	margin-top: 5px;
	height: 31px;
}

body.en.map #mode-icons #map-icon {
	display: inline-block;
	background: url('../resources/layout/map_icon_en.png') center no-repeat;
	width: 52px;
	height: 31px;
}

body.en.map #mode-icons #grid-icon {
	display: inline-block;
	background: url('../resources/layout/grid_icon_en.png') center no-repeat;
	width: 51px;
	height: 31px;
}

body.map #map-wrapper {
	margin: 0 auto;
	height: 100%;
}
body.map #content{
	padding-bottom: 55px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body.map #map-canvas{
	height: 100%;

}
body.map #map-wrapper #map {
	position: absolute;
}
body.map .labels{
  background-color: black;
  color:white;
  padding: 3px 6px;
}
/*body.map #map-wrapper, body.map #map-wrapper #map.map-small {
	width: 806px;
	height: 646px;
}*/

body.map #map-wrapper #map.map-small {
	/*background: url('../resources/layout/map_small_png.png') center no-repeat;*/
}

body.map #map-wrapper #map.map-full {
	width: 3248px;
	height: 2433px;
	left: -1310px;
	top: -900px;
	/*background: url('../resources/layout/map_png.png') center no-repeat;*/
}

body.map #map-small-img, body.map #map-full-img {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

body.map #map-small-img {
	-webkit-transform: scale(3.78);
	-webkit-transform-origin: -8.5% -0.0%;
	-ms-transform: scale(3.78);
	-ms-transform-origin: -8.5% -0.0%;
	transform: scale(3.78);
	transform-origin: -8.5% -0.0%;
}

body.map #map-full-img {
	display: none;
}

body.map .map-small #overlay {
	transform: scale(0.265, 0.265);
	-ms-transform: scale(0.265, 0.265);
	-webkit-transform: scale(0.265, 0.265);
	transform-origin: -2.17% -0.04%;
	-ms-transform-origin: -2.18% -0.00%;
	-webkit-transform-origin: -2.18% -0.00%;
	z-index:2;
}

body.map #overlay {
	position: relative;
	width: 3248px;
	height: 2433px;
}

body.map #overlay a:link,
body.map #overlay a:hover,
body.map #overlay a:visited,
body.map #overlay a:active {
	cursor: default;
}

body.map #overlay .bullet {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 20;
	cursor: pointer;
}

body.map #overlay .bullet.on {
	z-index:101;
}

body.map .map-small #overlay .bullet {
	margin-top: -37.25px;
	margin-left: -37.25px;
}

body.map .map-full #overlay .bullet {
	margin-top: -10px;
	margin-left: -10px;
}

body.map .map-small #overlay .overlay > img {
	/*opacity: 0;
	-moz-opacity: 0;*/
}

body.map #overlay_alley .overlay,
body.map #overlay_street .overlay,
body.map #overlay_park .overlay,
body.map #overlay_pocket .overlay,
body.map #overlay_infra .overlay,
body.map #overlay_project .overlay,
body.map #overlay_envision .overlay,
body.map #overlay_video .overlay {
	position: absolute;
}
body.map #overlay_infra .overlay{
	/*display: none;*/
}
body.map #overlay_project,
body.map #overlay_envision,
body.map #overlay_video {
	/*display:none;*/
}

body.map #overlay_project img{
	display:none;
}

body.map .message-box {
	display: none;
	position: relative;
	width: 120px;
	padding: 6px;
	background: #353c3e;
	color:white;
	z-index: 100;
	margin: 0 auto;
	bottom: 100%;
}
body.map #overlay #msgbox{
	background-color: #353c3e;
	color:white;
	padding: 5px;
	z-index: 21;
}
body.map #overlay #msgbox.hidden{
	display: none !important;

}
body.map .map-small .message-box {
	transform: scale(2.9, 2.9);
	-ms-transform: scale(2.9, 2.9);
	-webkit-transform: scale(2.9, 2.9);
	margin-top: -60px;
}

body.map .map-full .message-box {
	/*top:-35px;*/
  /*top: -40px;
  left: 40%;*/
  margin-left: -45px;
  margin-top: -45px;
}

body.map .bullet {
	width: 20px;
	height: 20px;
	z-index: 100;
}

body.map .map-full .bullet {
	width: 40px;
	height: 40px;
	margin-left: -20px;
	margin-top: -20px;
}

body.map .map-small .bullet {
	background-size: cover;
	width: 75.6px;
	height: 75.6px;

	/*transform: scale(3.78, 3.78);
	-ms-transform: scale(3.78, 3.78);
	-webkit-transform: scale(3.78, 3.78) translate3d(0, 0, 0);*/
}

body.map .bullet_alley {
	background:url('../resources/layout/bullet/bullet_alley.png') center no-repeat;
	display: none;
}
body.map .bullet_envision {
	background:url('../resources/layout/bullet/bullet_envision.png') center no-repeat;
}
body.map .bullet_infra {
	background:url('../resources/layout/bullet/bullet_infra.png') center no-repeat;
	display: none;
}
body.map .bullet_infra.mtr {
	background:url('../resources/layout/bullet/bullet_mtr.png') center no-repeat;
	background-size: cover;
	display: block;
}
body.map .bullet_park {
	background:url('../resources/layout/bullet/bullet_park.png') center no-repeat;
	display: none;
}
body.map .bullet_pocket {
	background:url('../resources/layout/bullet/bullet_pocket.png') center no-repeat;
	display: none;
}
body.map .bullet_project {
	background:url('../resources/layout/bullet/bullet_project.png') center no-repeat;
}
body.map .bullet_street {
	background:url('../resources/layout/bullet/bullet_street.png') center no-repeat;
	display: none;
}
body.map .bullet_video {
	background:url('../resources/layout/bullet/bullet_video.png') center no-repeat;
}

body.map .map-full .bullet_alley {
	background:url('../resources/layout/bullet/bullet_alley_l.png') center no-repeat;
	display: none;
}
body.map .map-full .bullet_envision {
	background:url('../resources/layout/bullet/bullet_envision_l.png') center no-repeat;
}
body.map .map-full .bullet_infra {
	background:url('../resources/layout/bullet/bullet_infra_l.png') center no-repeat;
	display: none;
}
body.map .map-full .bullet_infra.mtr {
	background:url('../resources/layout/bullet/bullet_mtr_l.png') center no-repeat;
	display: block;
}
body.map .map-full .bullet_park {
	background:url('../resources/layout/bullet/bullet_park_l.png') center no-repeat;
	display: none;
}
body.map .map-full .bullet_pocket {
	background:url('../resources/layout/bullet/bullet_pocket_l.png') center no-repeat;
	display: none;
}
body.map .map-full .bullet_project {
	background:url('../resources/layout/bullet/bullet_project_l.png') center no-repeat;
}
body.map .map-full .bullet_street {
	background:url('../resources/layout/bullet/bullet_street_l.png') center no-repeat;
	display: none;
}
body.map .map-full .bullet_video {
	background:url('../resources/layout/bullet/bullet_video_l.png') center no-repeat;
}


/*body.map #overlay #overlay_alley > div, body.map #overlay #overlay_alley > a > div {
  border:1px solid darkred;
  background-color: rgba(255, 128, 128, 0.3) !important;
}

body.map #overlay #overlay_alley > div:hover, body.map #overlay #overlay_alley > a > div:hover {
  background-color: rgba(255, 255, 128, 0.3) !important;
}*/

/* bullet position adjust */

#map #street_1 .bullet.bullet_street{
	top:14px;
	left:611px;
}
#map #street_2 .bullet.bullet_street{
	top:17px;
	left:560px;
}
#map #street_4 .bullet.bullet_street{
	top:7px;
	left:479px;
}
#map #street_5 .bullet.bullet_street{
	top:33px;
	left:410px;
}
#map #street_6 .bullet.bullet_street{
	top:19px;
	left:377px;
}
#map #street_7 .bullet.bullet_street{
	top:81px;
	left:387px;
}
#map #street_8 .bullet.bullet_street{
	top:9px;
	left:187px;
}
#map #street_9 .bullet.bullet_street{
	top:12px;
	left:304px;
}
#map #street_10 .bullet.bullet_street{
	top:19px;
	left:462px;
}
#map #street_11 .bullet.bullet_street{
	top:37px;
	left:487px;
}
#map #street_12 .bullet.bullet_street{
	top:8px;
	left:413px;
}
#map #street_13 .bullet.bullet_street{
	top:201px;
	left:450px;
}
#map #street_14 .bullet.bullet_street{
	top:11px;
	left:386px;
}
#map #street_15 .bullet.bullet_street{
	top:8px;
	left:192px;
}
#map #street_16 .bullet.bullet_street{
	top:21px;
	left:392px;
}
#map #street_18 .bullet.bullet_street{
	top:204px;
	left:361px;
}
#map #street_19 .bullet.bullet_street{
	top:625px;
	left:44px;
}
#map #street_20 .bullet.bullet_street{
	top:679px;
	left:42px;
}
#map #street_21 .bullet.bullet_street{
	top:619px;
	left:43px;
}
#map #alley_1 .bullet.bullet_alley{
	top:27px;
	left:142px;
}
#map #alley_2 .bullet.bullet_alley{
	top:106px;
	left:148px;
}
#map #alley_3 .bullet.bullet_alley{
	top:45px;
	left:172px;
}
#map #alley_4 .bullet.bullet_alley{
	top:104px;
	left:187px;
}
#map #alley_5 .bullet.bullet_alley{
	top:35px;
	left:197px;
}
#map #alley_6 .bullet.bullet_alley{
	top:68px;
	left:153px;
}
#map #alley_7 .bullet.bullet_alley{
	top:65px;
	left:165px;
}
#map #alley_8 .bullet.bullet_alley{
	top:107px;
	left:146px;
}
#map #alley_9 .bullet.bullet_alley{
	top:52px;
	left:202px;
}
#map #alley_10 .bullet.bullet_alley{
	top:125px;
	left:283px;
}
#map #alley_11 .bullet.bullet_alley{
	top:51px;
	left:185px;
}
#map #alley_12 .bullet.bullet_alley{
	top:66px;
	left:143px;
}
#map #alley_13 .bullet.bullet_alley{
	top:63px;
	left:142px;
}
#map #alley_14 .bullet.bullet_alley{
	top:59px;
	left:199px;
}
#map #alley_15 .bullet.bullet_alley{
	top:8px;
	left:34px;
}
#map #alley_16 .bullet.bullet_alley{
	top:69px;
	left:52px;
}
#map #alley_17 .bullet.bullet_alley{
	top:10px;
	left:74px;
}
#map #alley_18 .bullet.bullet_alley{
	top:67px;
	left:95px;
}
#map #alley_19 .bullet.bullet_alley{
	top:74px;
	left:90px;
}
#map #alley_20 .bullet.bullet_alley{
	top:94px;
	left:135px;
}
#map #alley_21 .bullet.bullet_alley{
	top:13px;
	left:63px;
}
#map #alley_22 .bullet.bullet_alley{
	top:53px;
	left:76px;
}
#map #alley_23 .bullet.bullet_alley{
	top:78px;
	left:164px;
}
#map #alley_24 .bullet.bullet_alley{
	top:28px;
	left:93px;
}
#map #alley_25 .bullet.bullet_alley{
	top:6px;
	left:94px;
}
#map #park_1 .bullet.bullet_park{
	top:257px;
	left:848px;
}
#map #park_2 .bullet.bullet_park{
	top:126px;
	left:186px;
}
#map #pocket_2 .bullet.bullet_pocket{
	top:49px;
	left:34px;
}
#map #pocket_3 .bullet.bullet_pocket{
	top:12px;
	left:11px;
}
#map #pocket_4 .bullet.bullet_pocket{
	top:20px;
	left:148px;
}
#map #pocket_5 .bullet.bullet_pocket{
	top:57px;
	left:7px;
}
#map #pocket_6 .bullet.bullet_pocket{
	top:3px;
	left:4px;
}
#map #pocket_7 .bullet.bullet_pocket{
	top:13px;
	left:66px;
}
#map #infra_1 .bullet.bullet_infra{
	top:159px;
	left:0px;
}
#map #infra_2 .bullet.bullet_infra{
	top:98px;
	left:68px;
}
#map #infra_3 .bullet.bullet_infra{
	top:48px;
	left:177px;
}
#map #infra_4 .bullet.bullet_infra{
	top:76px;
	left:25px;
}
#map #infra_5 .bullet.bullet_infra{
	top:42px;
	left:47px;
}
/*
#map #project_1 .bullet.bullet_project{
	top:421px;
	left:220px;
}
#map #project_2 .bullet.bullet_project{
	top:46px;
	left:72px;
}
#map #project_3 .bullet.bullet_project{
	top:94px;
	left:157px;
}
#map #project_4 .bullet.bullet_project{
	top:109px;
	left:144px;
}
#map #project_5 .bullet.bullet_project{
	top:224px;
	left:15px;
}
#map #project_6 .bullet.bullet_project{
	top:76px;
	left:75px;
}
#map #project_7 .bullet.bullet_project{
	top:220px;
	left:90px;
}
#map #project_8 .bullet.bullet_project{
	top:302px;
	left:284px;
}
#map #video_1 .bullet.bullet_video{
	top:-4px;
	left:13px;
}
#map #video_2 .bullet.bullet_video{
	top:0px;
	left:0px;
}
#map #video_3 .bullet.bullet_video{
	top:0px;
	left:0px;
}
#map #video_4 .bullet.bullet_video{
	top:0px;
	left:0px;
}
*/