@charset "UTF-8";

/*------------------------------
	page_home
-----------------------------*/
#page_home{
}
#page_home .hero_area{
	margin:0 auto;
	width:100%;
	background:rgb(237,241,251);
}
#page_home .hero_area .flexslider{
	margin:0 auto;
	max-width:1200px;
	width:100%;
}

/*-- middle_area --*/
#page_home .middle_area{
	margin:0 auto;
	padding:40px 50px 50px;
	max-width:1000px;
}

/*-- banner --*/
#page_home ul.banner{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin:0 auto;
	padding:0;
	list-style:none;
	text-align:center;
}
#page_home ul.banner li{
	width:calc(50% - 10px);
	max-width:435px;
	margin:.5rem 0;
}
#page_home ul.banner li a{
	transition:opacity .2s ease-out;
}
#page_home ul.banner li a:hover{
	opacity:.5;
	vertical-align:bottom;
}
#page_home ul.banner li a img{
	width:100%;
	line-height:0;
	vertical-align:bottom;
}

/*-- whats_new --*/
#page_home .whats_new{
	width:100%;
}
#page_home .whats_new h2{
	margin:1em 0 0;
	padding-bottom:.4em;
	border-bottom:solid 1px rgb(180,180,180);
	font-size:1.68rem;
	font-weight:800;
	color:rgb(39,82,149);
	line-height:1.3;
	letter-spacing:0.1em;
}
#page_home .whats_new ul{
	margin:0;
	padding:0;
	height:250px;
	border-bottom:solid 1px rgb(180,180,180);
	overflow-y:scroll;
}
#page_home .whats_new ul li{
	list-style:none;
	padding:.9em 0;
	display:flex;
	flex-wrap:wrap;
	border-bottom:dotted 1px rgb(180,180,180);
	font-size:.937rem;
	color:inherit;
}
#page_home .whats_new ul li a{
	color:rgb(60,180,140);
	transition:opacity .2s ease-out;
}
#page_home .whats_new ul li a:hover{
	opacity:.4;
}

#page_home .whats_new ul li .date,
#page_home .whats_new ul li .title{
	margin:0;
	line-height:1.65;
}
#page_home .whats_new ul li .date{
	width:120px;
	font-weight:600;
}
#page_home .whats_new ul li .date::before{
	content:"";
	display:inline-block;
	margin:0 7px 0 3px;
	width:6px;
	height:6px;
	background:rgb(247,117,60);
	border-radius:3px;
	vertical-align:10%;
}
#page_home .whats_new ul li .title{
	width:calc(100% - 120px);
	font-weight:400;
}

/*------------------------------
	page_message
-----------------------------*/
#page_message .title{
	margin:2rem 0 0;
	padding-right:1rem;
	font-size:.937rem;
	text-align:right;
	line-height:1.4;
}
#page_message .name{
	margin:0;
	padding-right:1rem;
	font-size:1.125rem;
	line-height:1.4;
	text-align:right;
}
#page_message .date{
	margin:.5rem 0 0;
	padding-right:1rem;
	font-size:.937rem;
	line-height:1.4;
	text-align:right;
}

/*------------------------------
	page_activity
------------------------------*/
#page_activity .thumbnail{
	margin-top:.8rem;
	margin-right:1rem;
	width:140px;
	float:left;
}
#page_activity .thumbnail a{
	display:block;
	box-shadow:0 0 5px rgba(0,0,0,.3);
	transition:transform .2s ease-out;
}
#page_activity .thumbnail a:hover{
	transform:scale(1.05);
}
#page_activity .thumbnail img{
	width:100%;
	line-height:0;
	vertical-align:bottom;
}

/*------------------------------
	page_secretariat
-----------------------------*/
#page_secretariat .facility{
	margin:0 0 .3em;
	padding-bottom:.3em;
	border-bottom:dotted 1px rgb(180,180,180);
	font-size:1.25rem;
	color:rgb(60,100,120);
	line-height:1.4;
	text-indent:-.5em;
}


/*------------------------------
------------------------------
	メディアクエリ
------------------------------
-----------------------------*/
@media screen and (max-width:700px){
	.flex-direction-nav a:before{
		color:rgba(0,0,0,.15) !important;
	}
	#page_home .whats_new ul{
		padding:0;
	}
	#page_home .whats_new ul li .date{
		width:100%;
		font-weight:600;
	}
	#page_home .whats_new ul li .title{
		padding-left:16px;
		width:100%;
		font-weight:400;
	}
	#page_home ul.banner{
		justify-content:center;
	}
	#page_home ul.banner li{
		margin:.4rem 0;
		width:100%;
		max-width:400px;
	}
}

@media screen and (max-width:600px){
	#page_home .middle_area{
		margin-bottom:30px;
		padding:40px 25px 0;
	}
	#page_activity .thumbnail{
		width:100px;
	}
}
