/* Map style */
#container {width: 100%; height: 100%; position: relative; display: flex; flex-direction: row;}
#mapWrapper {width: 100%;height: 100%;}
#rvWrapper {width:50%; height:100%; top:0; right:0; position:absolute; z-index:0; display: none;}
.show{display: block !important;}
#container.view_roadview #mapWrapper {width: 50%;}
#close {position: absolute;padding: 4px;top: 5px;right: 5px;cursor: pointer;background: #fff;border-radius: 4px;border: 1px solid #c8c8c8;box-shadow: 0px 1px #888;}
#close .img {display: block; background: url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/rv_close.png) no-repeat;width: 14px;height: 14px;}
#resetControl {position: absolute; top: 237px; right: 2px; background: url(//t1.daumcdn.net/localimg/localimages/07/2018/pc/common/img_search.png) no-repeat -151px -450px;
	z-index: 100; cursor: pointer; overflow: hidden; width: 35px; height: 36px; font-size: 14px; line-height: 20px; color: #000; text-align: center;}
/* Index marker */
.RouteIndexMarker {display: block; position: relative; width: 20px; height: 20px; background: url(//t1.daumcdn.net/localimg/localimages/07/2018/pc/checkpointItem/ico_number_list_map.png) no-repeat 0 -90px; cursor: pointer;}
.RouteIndexMarker .count {display: block; width: 20px; height: 16px; padding-top: 4px; font: 11px/1.2 Arial, sans-serif; color: #616161; text-align: center;}

/* Road view */
.map_wrap {overflow:hidden;height:330px}

/* Map walker */
.MapWalker {position:absolute;margin:-26px 0 0 -51px}
.MapWalker .figure {position:absolute;width:25px;left:38px;top:-2px;
	height:39px;background:url(https://t1.daumcdn.net/localimg/localimages/07/2018/pc/roadview_minimap_wk_2018.png) -298px -114px no-repeat}
.MapWalker .angleBack {width:102px;height:52px;background: url(https://t1.daumcdn.net/localimg/localimages/07/2018/pc/roadview_minimap_wk_2018.png) -834px -2px no-repeat;}
.MapWalker.m0 .figure {background-position: -298px -114px;}
.MapWalker.m1 .figure {background-position: -335px -114px;}
.MapWalker.m2 .figure {background-position: -372px -114px;}
.MapWalker.m3 .figure {background-position: -409px -114px;}
.MapWalker.m4 .figure {background-position: -446px -114px;}
.MapWalker.m5 .figure {background-position: -483px -114px;}
.MapWalker.m6 .figure {background-position: -520px -114px;}
.MapWalker.m7 .figure {background-position: -557px -114px;}
.MapWalker.m8 .figure {background-position: -2px -114px;}
.MapWalker.m9 .figure {background-position: -39px -114px;}
.MapWalker.m10 .figure {background-position: -76px -114px;}
.MapWalker.m11 .figure {background-position: -113px -114px;}
.MapWalker.m12 .figure {background-position: -150px -114px;}
.MapWalker.m13 .figure {background-position: -187px -114px;}
.MapWalker.m14 .figure {background-position: -224px -114px;}
.MapWalker.m15 .figure {background-position: -261px -114px;}
.MapWalker.m0 .angleBack {background-position: -834px -2px;}
.MapWalker.m1 .angleBack {background-position: -938px -2px;}
.MapWalker.m2 .angleBack {background-position: -1042px -2px;}
.MapWalker.m3 .angleBack {background-position: -1146px -2px;}
.MapWalker.m4 .angleBack {background-position: -1250px -2px;}
.MapWalker.m5 .angleBack {background-position: -1354px -2px;}
.MapWalker.m6 .angleBack {background-position: -1458px -2px;}
.MapWalker.m7 .angleBack {background-position: -1562px -2px;}
.MapWalker.m8 .angleBack {background-position: -2px -2px;}
.MapWalker.m9 .angleBack {background-position: -106px -2px;}
.MapWalker.m10 .angleBack {background-position: -210px -2px;}
.MapWalker.m11 .angleBack {background-position: -314px -2px;}
.MapWalker.m12 .angleBack {background-position: -418px -2px;}
.MapWalker.m13 .angleBack {background-position: -522px -2px;}
.MapWalker.m14 .angleBack {background-position: -626px -2px;}
.MapWalker.m15 .angleBack {background-position: -730px -2px;}

@media screen and (max-width: 1240px) {
	#resetControl {
		top: 5px;
	}
}

@media screen and (max-width: 768px) {
	#container{
		flex-direction: column;
		justify-content : flex-end;
	}
	
	#container.view_roadview #mapWrapper {
		width: 100%;
		height: 50%;
	}
	
	#rvWrapper{
		width: 100%;
		height: 50%;
	}
}