@charset "UTF-8";

/*======================================
	イベント
=======================================*/
h2 img{
	margin-bottom:20px;
}

#main_wrap{
	padding:3%;
}

#intro{
	margin-bottom:20px;
	overflow:hidden;
}
#intro_txt #intro_top{
	color: #3b3a3a;
	font-weight: bold;
	font-size: 150%;
	margin-bottom:10px;
}
#intro_txt{
	width:48%;
	float:left;
	margin-right:2%;
}
#intro_img{
	width:50%;
	float:left;
}

.event_wrap{
	clear:both;
}
.event_wrap h3{
	margin-bottom:20px;
}
.event{
	width:30%;
	margin:0 1% 20px 1%;
	display: inline-block;
	vertical-align: top;
}
.event_detail{
	margin-bottom:10px;
}
#spring .event .event_date{
	background-color:#fadeeb;
}
#spring .event .event_date:before {
	border-top: 10px solid #fadeeb;
}
#summer .event .event_date{
	background-color:#ddedd4;
}
#summer .event .event_date:before {
	border-top: 10px solid #ddedd4;
}
#autumn .event .event_date{
	background-color:#fde1b4;
}
#autumn .event .event_date:before {
	border-top: 10px solid #fde1b4;
}
#winter .event .event_date{
	background-color:#cae6f6;
}
#winter .event .event_date:before {
	border-top: 10px solid #cae6f6;
}

.event .event_date{
	text-align:center;
	padding:5px 0;
	margin: 0 auto;
	border-radius:5px;
	margin-bottom:10px;
	position: relative;
}
.event .event_date:before {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -7px;
	width: 0;
	height: 0;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
}
.event_detail img,
.event_detail h4,
.event_txt{
	margin-bottom:0.5em;
}

.event_place{
	font-size:85%;
}

.event_place .place_mk{
	width:2.5em;
	float:left;
	text-align:center;
	background-color:#b81c22;
	color:#fff;
	padding:0 0.5em;
	border-radius:5px;
}
.event_place .place_detail{
	padding-left:4em;
}


/* ボタン */
.more_wrap,
.btn_more div{
	width: 160px;
	margin:0 auto;
}
.btn_more p{
	background-position: 25px center;
	padding-left:20px;
}

@media screen and (max-width: 799px) {
	
	/* 2列表示 */
	.event{
		width:48%;
		margin:0 auto;
		margin-bottom:20px;
	}
	.event .event_detail,
	.event .more_wrap{
		max-width:330px;
		margin:0 auto;
		margin-bottom:1.0em;
	}
}

@media screen and (max-width: 979px) {
	#intro_img {
		display: none;
	}
	#intro_txt{
		width:100%;
		float:none;
		margin:0 auto;
		margin-bottom:20px;
	}
}

/*======================================
	タブレット
=======================================*/
@media screen and (max-width: 599px) {

	.event{
		width:100%;
		margin:0 auto;
		margin-bottom:20px;
	}
	.event .event_detail,
	.event .more_wrap{
		max-width:330px;
		margin:0 auto;
		margin-bottom:1.0em;
	}

}