@charset "UTF-8";
@import url(./common/common.css);
@import url(./common/base.css);


/*----- 駐車場検索ページ 設定 ----------------------------------------------------*/

div.telop_wrap { width:100%; }

.telop_rl { width:100%; padding:0.5em 0; margin:0 auto; font-size:1.1em; font-weight:bold; color:#ff0000; text-align:left; border-top:2px solid #ff0000; border-bottom:2px solid #ff0000; background-color:rgba(255,255,255,1); position:relative; overflow:hidden; }
.telop_rl p:after { content:""; white-space:nowrap; }
.telop_rl p { margin:0; padding-left:100%; display:inline-block; white-space:nowrap; }
.telop_rl p {
	-webkit-animation-name:marqueeRL;
	-webkit-animation-timing-function:linear;
	-webkit-animation-duration:12s;
	-webkit-animation-iteration-count:infinite;
	-moz-animation-name:marqueeRL;
	-moz-animation-timing-function:linear;
	-moz-animation-duration:12s;
	-moz-animation-iteration-count:infinite;
	-ms-animation-name:marqueeRL;
	-ms-animation-timing-function:linear;
	-ms-animation-duration:12s;
	-ms-animation-iteration-count:infinite;
	-o-animation-name:marqueeRL;
	-o-animation-timing-function:linear;
	-o-animation-duration:12s;
	-o-animation-iteration-count:infinite;
	animation-name:marqueeRL;
	animation-timing-function:linear;
	animation-duration:12s;
	animation-iteration-count:infinite;
}

@-webkit-keyframes marqueeRL {
	from {-webkit-transform:translate(0);} to {-webkit-transform:translate(-100%);}
}
@-moz-keyframes marqueeRL {
	from {-moz-transform:translate(0);} to {-moz-transform:translate(-100%);}
}
@-ms-keyframes marqueeRL {
	from {-ms-transform:translate(0);} to {-ms-transform:translate(-100%);}
}
@-o-keyframes marqueeRL {
	from {-o-transform:translate(0);} to {-o-transform:translate(-100%);}
}
@keyframes marqueeRL {
	from {transform:translate(0);} to {transform:translate(-100%);}
}

div.area_search { width:96%; max-width:1000px; padding:20px 1%; margin:20px auto 0 auto; /* background-color:#e5eff6; */ border:solid 5px #ddd; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; overflow:hidden; }

div.as_wrap { width:50%; padding-top:5px; float:left; }
div.area_search h3{ width:100%; padding:5px 0 0 0; margin-bottom:5px; font-size:1.1em; font-weight:bold; color:#888; text-align:left; border-bottom:dotted 1px #888; float:left; }

ul.type_list, ul.area_list, ul.area_list2 { width:100%; overflow:hidden; }
ul.type_list2 { width:50%; margin:0 auto; overflow:hidden; }
ul.type_list li, ul.type_list2 li{ width:30%; padding:5px 0; margin-bottom:5px; font-size:0.8em; text-align:center; float:left; }
ul.type_list li img, ul.type_list2 li img { width:75px; }
ul.area_list li{ width:25%; padding:5px 0; margin-bottom:5px; text-align:left; float:left; }
ul.area_list2 li{ width:20%; padding:5px 0; margin-bottom:5px; text-align:left; float:left; }
ul.type_list li a, ul.type_list2 li a, ul.area_list li a, ul.area_list2 li a{ width:100%; color:#333; display:block; }
ul.type_list li a:hover, ul.type_list2 li a:hover, ul.area_list li a:hover, ul.area_list2 li a:hover{ color:#108ccf; }

h3.tit02 { margin:30px auto 10px auto; }

div#map_canvas { width:67%; height:600px; margin:30px 0 30px 3%; overflow:hidden; float:left; }

div#map_canvas a{ color:#333; }
div#map_canvas a:hover{ text-decoration:underline; }

section#parking_wrap { width:27%; height:600px; margin:30px 3% 30px 0; overflow:auto; float:right; }

article.parking_bloc { width:100%; height:80px; border-bottom:solid 1px #ccc; overflow:hidden; }
article.parking_bloc:first-child { border-top:solid 1px #ccc; }

article.parking_bloc a{ width:100%; display:block; }
article.parking_bloc a:hover{ background-color:#c6ebff; }

div.p_left { width:38%; padding:20px 1%; float:left; }
div.p_right { width:60%; padding:15px 0; text-align:left; float:left; }

img.pb01 { width:40px; margin:0 0 0 5px; float:left; }
img.pb02 { width:30px; margin:5px 0 5px 3px; float:left; }

article.parking_bloc a h4{ width:100%; color:#108ccf; overflow:hidden; white-space:nowrap; -o-text-overflow:ellipsis; text-overflow:ellipsis; }
article.parking_bloc a p{ width:100%; font-size:0.8em; color:#555; overflow:hidden; white-space:nowrap; -o-text-overflow:ellipsis; text-overflow:ellipsis; }

div.data_none { width:96%; max-width:1000px; padding:20px 0; margin:0 auto; text-align:center; overflow:hidden; }

div.attention_txt { width:94%; padding:5px 3%; font-size:0.9em; text-align:right; }


/*----- 1200px以下の画面設定 ----------------------------------------------------*/

@media screen and (max-width:1200px) {

	div#map_canvas { width:90%; height:600px; margin:30px 5%; }

	section#parking_wrap { width:100%; height:auto; margin:10px 0 30px 0; overflow:auto; float:left; }
	article.parking_bloc { width:50%; float:left; }
	article.parking_bloc:nth-child(2) { border-top:solid 1px #ccc; }

}


/*----- 650px以下の画面設定 ----------------------------------------------------*/

@media screen and (max-width:650px) {

	div.area_search h3{ width:100%; }

	div.as_wrap { width:100%; }

	ul.type_list2 { width:100%; margin:0; }
	ul.type_list li, ul.type_list2 li{ width:33.3%; line-height:1.2em; }
	ul.type_list li img, ul.type_list2 li img { width:50%; margin-bottom:5px; }

	ul.area_list { width:100%; float:left; }
	ul.area_list li, ul.area_list2 li { width:33.3%; }

	div#map_canvas { width:80%; height:600px; margin:30px 10%; }

	section#parking_wrap { width:100%; height:auto; margin:10px 0 30px 0; overflow:auto; float:left; }
	article.parking_bloc { width:100%; float:left; }
	article.parking_bloc:nth-child(2) { border-top:none; }
	article.parking_bloc a:hover{ background-color:#fff; }

	div.attention_txt { display:none; }

}