body { margin: 0; line-height: 160%; font-family: arial,sans-serif; }
html, body, #map_canvas { width: 100%; height: 100%; }

#map_canvas { width: 100%; height: 500px;  }
#map_window{z-index: 99;
width: 340px;
height: 433px;
position: absolute;
top: 22px;
left: 578px;
border-style: solid;
border-width: 10px 0px 0px;
-moz-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-webkit-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-o-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 fill repeat;
		background: #222 url(../images/bg_pattern_location.jpg) ;
		background-image: -Webkit-image-set(url(../images/bg_pattern_location.jpg) 1x, url(../images/bg_pattern_black@2x.jpg) 2x);  /* Image for Retina */
	
	box-shadow: 0 0 20px #d7d7d7;
	-moz-box-shadow: 0 0 20px #d7d7d7;
		-webkit-box-shadow: 0 0 20px #d7d7d7;	
	-o-box-shadow: 0 0 20px #d7d7d7;	
	}
	#map_window h3{ line-height: 1.4em;
margin: 10px 0 0 13px;
}
	
#mapAdress{margin:0 10px;
position:relative;
border-bottom:1px #d0cfbe solid; 
padding-left:  15%;
height:80px;
background: url(../images/mapAdress.png) no-repeat 5% 50%;
}




#mapAdress h5{
position: absolute;
top: 46%;
margin-top: -1em;
}
		
		

#mapTell{ margin:0 10px;
position:relative;
border-bottom:1px #d0cfbe solid; 
padding-left:  15%;
height:60px;
background: url(../images/mapPhone.png) no-repeat 5% 50%;
 }
 
 #mapTell h5{
  line-height: 60px;
}
 
#mapHours{position: relative;
margin:0 10px;
padding-left: 15%;
height: 130px;
border-bottom:1px #d0cfbe solid; 
background: url(../images/mapHours.png) no-repeat 5% 50%;}

#mapHours dl{ 
padding-top: 10px;

width: 100%;
line-height: 1.8em;
}
#mapHours dt{ clear: left;
	float: left;
	width: 50%;}
#mapHours dd{ 

	margin-left: 50%;}
#mapHours p{ white-space: nowrap;font-family: 'novecentolight_wide', Arial, Helvetica, sans-serif; text-transform:uppercase; margin:0 40px 0 0;}

#mapBYO{ margin:0 10px;
position:relative;
padding-left:  15%;
height:60px;
background: url(../images/mapBYO.png) no-repeat 5% 50%;
 }
 #mapBYO p{ white-space: nowrap;font-family: 'novecentolight_wide', Arial, Helvetica, sans-serif; text-transform:uppercase; margin:0 40px 0 0;}

 #mapBYO h5{
line-height: 22px;
margin-top: 10px;
padding-top: 10px;
}

.relativePos{ position:relative;}

#infoWindow {
  width: 250px;
}
#infoWindow h1 {
  margin: 0 0 10px;
  font-size: 16px;
}
#infoWindow p {
  margin: 0;
  font-size: 12px;
  line-height: 160%;
}
#infoWindow p span {
  font-size: 80%;
}
#infoWindow a {
  padding-right: 12px;
  border-bottom: 1px #593869 dotted;
  color: #593869;
  background: url(http://lopan.jp/wp/wp-content/themes/lopan2/img/external.gif) right center no-repeat;
  text-decoration: none;
}
#infoWindow a:hover {
  border: 0;
  color: #862682;
  background: url(http://lopan.jp/wp/wp-content/themes/lopan2/img/external_o.gif) right center no-repeat;
}

@media only screen and (min-width: 768px) and (max-width: 1150px) {

	#map_window{z-index: 99;
width: 340px;
height: 433px;
position: absolute;
top: 22px;
left: 388px;

border-style: solid;
border-width: 10px 0px 0px;
-moz-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-webkit-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-o-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 fill repeat;
		background: #222 url(../images/bg_pattern_location.jpg) ;
		background-image: -Webkit-image-set(url(../images/bg_pattern_location.jpg) 1x, url(../images/bg_pattern_black@2x.jpg) 2x);  /* Image for Retina */
	
	box-shadow: 0 0 20px #d7d7d7;
	-moz-box-shadow: 0 0 20px #d7d7d7;
		-webkit-box-shadow: 0 0 20px #d7d7d7;	
	-o-box-shadow: 0 0 20px #d7d7d7;	
	}
}


/* styles for mobile */
@media screen and (max-width: 767px) {
	#map_window{z-index: 99;
width: auto;
height: auto;
position:static;
margin-bottom:30px;
padding-bottom:30px;
border-style: solid;
border-width: 10px 0px 0px;
-moz-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-webkit-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
-o-border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 repeat;
border-image: url(../images/bg_pattern_obi.jpg) 10 0 0 fill repeat;
		background: #222 url(../images/bg_pattern_location.jpg) ;
		background-image: -Webkit-image-set(url(../images/bg_pattern_location.jpg) 1x, url(../images/bg_pattern_black@2x.jpg) 2x);  /* Image for Retina */
	
	box-shadow: 0 0 20px #d7d7d7;
	-moz-box-shadow: 0 0 20px #d7d7d7;
		-webkit-box-shadow: 0 0 20px #d7d7d7;	
	-o-box-shadow: 0 0 20px #d7d7d7;	
	}
	
	}