@charset 'UTF-8';

ul.search li {
	float:left;
	width:31.3333%;
	margin:0 1% 50px;
}
ul.search li:nth-child(3n+1) {
	clear:left;
}
ul.search li > a:first-child {
	position: relative;
	overflow: hidden;
	min-width: 200px;
	min-height: 200px;
	background-color:#f5f5dc;
}
ul.search li > a img {
	width: 400px;
	min-height: 200px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
ul.search div {
	padding:0 0 10px;
}
ul.search div a {
	display:inline-block;
	color:#46821e;
	font-size:12px; font-size:1.2rem;
	border:1px solid #46821e;
	border-radius:5px;
	padding:0 10px;
	margin-top:10px;
	margin-right:10px;
}
ul.search div a:hover {
	text-decoration:none;
}
ul.search h3 {
	overflow:hidden;
	font-size:18px; font-size:1.8rem;
	text-overflow:ellipsis;
	white-space:nowrap;
}
ul.search p {
	overflow:hidden;
	font-size:16px; font-size:1.6rem;
	height:3em;
	margin:0.5em 0;
}
ul.search+ul+a {
	width:30%;
	margin:30px auto 0;
}

/*spot*/
div.cat {
	padding:0 0 10px;
}
div.cat a {
	display:inline;
	color:#46821e;
	font-size:12px; font-size:1.2rem;
	border:1px solid #46821e;
	border-radius:5px;
	padding:0 10px;
	margin-right:10px;
}
div.cat a:hover {
	text-decoration:none;
}
h2 {
	font-size:24px; font-size:2.4rem;
	text-align:center;
	color:#fff;
	background-color:#8fb01d;
	border-radius:5px;
	margin-bottom:30px;
	position:relative;
}
h2:before {
	content:'';
	position:absolute;
	bottom:-34px;
	left:50%;
	border:20px solid transparent;
	border-top:20px solid #8fb01d;
	margin-left:-20px;
}

div#article {
	float:right;
	width:48%;
}
div#article h3 {
	font-size:18px;
	color:#46821e;
	padding:10px 0;
}
div#article p {
	font-size:16px; font-size:1.6rem;
}

div#detail,
div#list {
	clear:both;
	padding-top:50px;
}
div.map {
	float:left;
	width:48%;
	height:500px;
}
div.map iframe {
	width:100%;
	height:100%;
}
div.map+a.btn {
	width:70%;
	margin:10px auto 0;
}
div.info {
	float:right;
	width:48%;
	font-size:16px; font-size:1.6rem;
}
h4 {
	font-size:16px; font-size:1.6rem;
	text-align:center;
	border:1px solid #8fb01d;
	border-radius:5px;
	margin-bottom:30px;
	position:relative;
}
h4:before {
	content:'';
	position:absolute;
	bottom:-32px;
	left:50%;
	border:16px solid transparent;
	border-top:16px solid #8fb01d;
	margin-left:-16px;
}
h4:after {
	content:'';
	position:absolute;
	bottom:-30px;
	left:50%;
	border:16px solid transparent;
	border-top:16px solid #fff;
	margin-left:-16px;
}
div.info dt {
	font-weight:600;
	border-left:3px solid #8fb01d;
	padding-left:5px;
}
div.info dd {
	margin-bottom:10px;
}

div#list {
	padding-bottom:50px;
}
div#list li {
	float:left;
	width:23%;
	margin:0 1%;
}
div#list li > a:first-child {
	position: relative;
	overflow: hidden;
	min-width: 200px;
	min-height: 200px;
	background-color:#f5f5dc;
}
div#list li > a img {
	width: 300px;
	min-height: 200px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
div#list div {
	padding:0 0 10px;
}
div#list div a {
	display:inline-block;
	color:#46821e;
	font-size:12px; font-size:1.2rem;
	border:1px solid #46821e;
	border-radius:5px;
	padding:0 10px;
	margin-top:10px;
	margin-right:10px;
}
div#list div a:hover {
	text-decoration:none;
}
div#list h3 {
	overflow:hidden;
	font-size:16px; font-size:1.6rem;
	text-overflow:ellipsis;
	white-space:nowrap;
}
div#list+a {
	clear:both;
	width:30%;
	margin:0 auto;
}

/*swiper*/
	#gallery {
		float:left;
        position: relative;
        width:48%;
        height: 500px;
    }
    .swiper-container {
        width: 100%;
        height: 300px;
        margin-left: auto;
        margin-right: auto;
    }
    .swiper-slide {
        background-size: cover;
        background-position: center;
    }
    .gallery-top {
        height: 80%;
        width: 100%;
    }
    .gallery-thumbs {
        height: 20%;
        box-sizing: border-box;
        padding: 10px 0;
    }
    .gallery-thumbs .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
    }
    .gallery-thumbs .swiper-slide-active {
        opacity: 1;
    }

@media (max-width: 800px) {
	ul.search {
		width:90%;
		padding:5%;
	}
	ul.search li,div#list li {
		float:none;
		width:100%;
		margin:0 0 30px 0;
	}
	ul.search li:last-child {
		margin-bottom:50px;
	}
	ul.search+ul+a,div#list+a {
		margin:0 auto 20px;
	}
	div.cat {
		width:90%;
		padding:20px 5% 10px;
	}
	h2 {
		font-size:2.0rem;
	}
	h2,h4,div#list h3 {
		width:90%;
		margin:0 auto 30px;
	}
	div#gallery,div#article,div.map,div.info {
		float:none;
		width:90%;
		padding:0 5%;
	}
	div#gallery,div.map {
		height:300px;
	}
	div#article h3 {
		padding:20px 0 0;
	}
	div#detail, div#list {
		padding-top:30px;
	}
	div.info {
		margin-top:50px;
	}
	div#list div {
		padding:0 5%
	}
}

div.detail_info{
	clear: both;
	text-align:center;
	font-size:14px; font-size:1.4rem;
	border:1px solid #8fb01d;
	border-radius:5px;
	padding:10px;
	margin-top:30px;
}
div.detail_info a.pdf {
	background:url('../images/info/ico_pdf.png') no-repeat left center;
}
div.detail_info a.site {
	background:url('../images/info/ico_site.png') no-repeat left center;
}
div.detail_info a {
	display:inline-block;
	padding-left:25px;
	margin-bottom:10px;
}