@charset "utf-8";

html, body { margin:0; padding:0; font-size:12px; height:100%; }
body { margin:10px; }
textarea#res { margin:10px 0;  width:498px;padding:0; height:100px; font-size:9px; box-sizing: border-box; }
h1, h2, h3, p { display:block; margin:10px 0; font-size:100%; }
#map_canvas { width:1024px; height:768px; margin:10px 0; }
#zoomlevel span { font-weight:bold; font-size:120%; }
#res { color:red; }
/* infowindow */
dl#infowin1 { margin:0; padding:0; }
dl#infowin1 dt { margin:0; padding:0; font-weight:bold; }
dl#infowin1 dd { margin:5px 0 0 0; padding:0; line-height:1.5; }
dl#infowin1 dd img { padding:2px; background:#fff; border:1px solid #ccc; margin-right:5px;}

dl#infowin2 { margin:0; padding:0; }
dl#infowin2 dt { margin:0; padding:0; font-weight:bold; }
dl#infowin2 dd { margin:5px 0 0 0; padding:0; line-height:1.5; }
dl#infowin2 dd img { padding:2px; background:#fff; border:1px solid #ccc; margin-right:5px;}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
#map_canvas { width:100%; height:100%; }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
#map_canvas { width:100%; height:100%; }
textarea#res { width:100%; }
}