@charset "utf-8";
/* CSS Document */

.wrap-gmap{
width: 100%;
position: relative;
}
#gmap,
.wrap-gmap .map{
width: 100%;
height: 290px;
}
.wrap-gmap-in-normalpost .map{
width: 100%;
height: 290px;
}
.gmap-notice{
font-size: 11px !important;
padding-top: 5px;
}
#handle{
position: absolute;
top: 50%;
right: -1px; /*微妙な隙間（罫線）対策*/
margin-top: -45px;
z-index: 9;
width: 35px;
height: 90px;
}
#handle img{
width: 35px;
height: 90px;	
}
.wrap-gmap-ui{
margin-top: 5px;
font-size: 0px;
}
.wrap-gmap-ui a.btn{
display: inline-block;
box-sizing: border-box;
width: 49%;
height: 30px;
font-size: 11px;
line-height: 30px;
font-weight: bold;
text-align: center;
text-decoration: none;
margin-top: 2%;
margin-right: 2%;
padding: 0px;
color: #222;
background-image: none;
background-color: #f5f3ee;
border: 1px solid #eee;
letter-spacing: normal;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
}
.wrap-gmap-ui a:nth-child(even){
margin-right: 0;
}
.wrap-gmap-ui a.gmap-btn-full{
width: 100%;
}
.wrap-gmap-ui a.disabled{
background-color: #fff;
border: 1px solid #f7f7f7;
color: #ddd;
}

.modal-is-active #wrap-modal{
box-sizing: border-box;
width: 100%;
/*max-width: 100%;*/
padding: 40px;	
position: relative;
z-index: 3002;
-webkit-transform: scale(1);
transform: scale(1);
}
#wrap-modal{
-webkit-transition: -webkit-transform 0.2s ease-out, opacity 0.2s ease-out;
transition: transform 0.2s ease-out, opacity 0.2s ease-out;
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
.overlay-is-active #overlay-modal{
box-sizing: border-box;
position: fixed;
z-index: 3001;
/*top: 0; bottom: 0; left: 0; right: 0;*/
width: 100%;
height: 10000px;
top: 0; left: 0;
background-color: rgba(0, 0, 0, 0.8);
}
#overlay-modal{
height: 0px;
}
.modal-is-active a#btn-modal-close{
display: block;
width: 40px; height: 40px;
position: absolute;
top: 0; left: 0;
}
.modal-is-active a#btn-modal-close::after{
color: #fff;
content: "×";
cursor: pointer;
display: block;
width: 40px;
height: 40px;
font-family: Roboto, Arial, sans-serif !important;
font-size: 24px;
line-height: 40px;
text-align: center;
}
#btn-infobox-prev,
#btn-infobox-next{
color: #fff;
width: 40px;
height: 100px;
line-height: 100px;
text-align: center;
font-size: 24px;
font-weight: bold;
position: absolute;
margin-top: -50px;
z-index: 3003;
display: none;
}
#btn-infobox-prev{
top: 50%;
left: 0;
}
#btn-infobox-next{
top: 50%;
right: 0;
}
.modal-is-active #btn-infobox-prev,
.modal-is-active #btn-infobox-next{
display: block;
}
#btn-infobox-prev.disabled,
#btn-infobox-next.disabled{
visibility: hidden;
}

.infobox .inner{
background-color: #fff;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
outline: none;
height: auto;
padding: 20px;
}
.infobox .inner a{
color: #222;
text-decoration: none;
}
.infobox .inner a:hover{
text-decoration: underline;
}
.infobox .inner .wrap-thumb{
width: 100%;
min-height: 100px;
position: relative;
background-image: url(/plugins/colo.google.map/colomap-image-loader-line-ball-large.gif);
background-size: 32px 11px;
background-position: center center;
background-repeat: no-repeat;
margin-bottom: 15px;
}
.infobox .inner .wrap-thumb a{
display: block;
}
.infobox .inner .wrap-thumb img{
width: 100%;
height: auto;
vertical-align: bottom;
/*position: absolute;
top: 0;
right: 0;*/
}
.infobox .inner .wrap-thumb a:hover img{
opacity: 0.9;
}
.infobox .inner .cat-names{
font-size: 11px;
line-height: 1.4em;
font-weight: bold;
font-family: 'Raleway', sans-serif;
letter-spacing: 1px;
color: #1594ec;
margin-bottom: 10px;
text-align: center;
}
.infobox .inner .infobox-title{
font-size: 13px;
line-height: 1.6em;
font-weight: bold;
text-align: center;
}
.infobox .inner .infobox-desc{
font-size: 12px !important;
line-height: 1.6em;
margin-top: 10px;
color: #444;
}
.infobox .inner .wrap-btns{
text-align: center;
}
.infobox .inner a.btn-detail{
display: block;
padding: 7px 15px;
margin-top: 15px;
background-color: #eee;
color: #222;
font-size: 11px;
font-weight: bold;
font-family: 'Raleway', sans-serif;
letter-spacing: 1px;
text-align: center;
line-height: 1.4em;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-ms-border-radius: 0px;
-o-border-radius: 0px;
}
.infobox .inner a.btn-detail:hover{
background-color: #222;
color: #fff;
text-decoration: none;
}

/*sp*/
@media screen and (max-width: 600px) {
	
}


/*tablet以上*/
@media screen and (min-width: 601px) {
	.modal-is-active div#wrap-modal{
	padding: 25%;	
	}
}


/*pc*/
@media screen and (min-width: 769px) {
		#gmap,
		.wrap-gmap .map{
		width: 100%;
		height: 500px;
		}
		.wrap-gmap-in-normalpost .map{
		width: 100%;
		height: 290px;
		}
		.wrap-gmap-ui{
		position: relative;
		box-sizing: border-box;
		width: 100%;
		text-align: center;
		padding: 15px 0px;
		background-color: #fff;
		}
		.wrap-gmap-ui a:hover{
		background-color: #444 !important;
		}
		.wrap-gmap-ui a.disabled:hover{
		background-color: #eee !important;
		}
		.wrap-gmap-ui a.btn{
		margin-top: 0;
		width: 250px;
		height: 30px;
		line-height: 30px;
		font-size: 12px;
		color: #fff !important;
		text-decoration: none !important;
		text-align: center;
		background-color: #222;
		border: none;
		margin-right: 10px;
		}
		.wrap-gmap-ui a:nth-child(even){
		margin-right: 10px;
		}
		.wrap-gmap-ui a.btn:last-child{
		margin-right: 0px;	
		}
		.wrap-gmap-ui a.disabled{
		background-color: #eee;
		cursor: default;
		}
		.wrap-gmap-ui-4btns a.btn{
		width: 150px;
		}
		.modal-is-active div#wrap-modal{
		padding: 40px 25%;	
		}
		.wrap-infobox{
		position: relative;
		}
		.infobox .inner{
		padding: 20px;
		box-shadow: #ccc 0px 0px 3px;
		-webkit-box-shadow: #ccc 0px 0px 3px;
		-moz-box-shadow: #ccc 0px 0px 3px;
		-ms-box-shadow: #ccc 0px 0px 3px;
		-o-box-shadow: #ccc 0px 0px 3px;
		}
		.btn-infobox-close{
		display: block;
		width: 30px; height: 30px;
		background-color: #222;
		border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		}
		.btn-infobox-close:hover{
		/*background-color: rgba(0, 0, 0, 0.7);*/
		background-color: #444;
		}
		.btn-infobox-close::after{
		color: #fff;
		content: "×";
		cursor: pointer;
		display: block;
		width: 30px;
		height: 30px;
		font-family: Roboto, Arial, sans-serif !important;
		font-size: 20px;
		line-height: 30px;
		text-align: center;
		}
		/*::だとIE8が解釈できない*/
		.btn-infobox-close:after{
		color: #fff;
		content: "×";
		cursor: pointer;
		display: block;
		width: 30px;
		height: 30px;
		font-family: Roboto, Arial, sans-serif !important;
		font-size: 20px;
		line-height: 30px;
		text-align: center;
		}
		.infobox .inner .wrap-thumb{
		background-image: url(/plugins/colo.google.map/colomap-image-loader-line-ball-medium.gif);
		}
		.infobox .inner .wrap-thumb:hover{
		background-image: none;
		}
		.infobox .inner .wrap-thumb a:hover img{
		opacity: 0.8 !important;
		}
		.infobox .inner .infobox-title{
		font-size: 13px;
		line-height: 1.6em;
		font-weight: normal;
		text-align: left;
		}
		.infobox .inner .cat-names{
		font-size: 12px;
		text-align: left;
		}
		.infobox .inner a.btn-detail{
		border-top: 1px solid #eee;
		height: auto;
		padding: 15px 15px 0;
		background-color: #fff;
		color: #222;
		font-size: 12px;
		}
		.infobox .inner a.btn-detail:hover{
		background-color: #fff;
		color: #222;
		text-decoration: underline;
		}
}