@charset "utf-8";

/********************

news（お知らせ）
- #topNews … トップページの最新お知らせ枠
- #news    … /news/news.php の一覧

********************/

@media print, screen {

/* 一覧 ---------------------------------------- */

.newsList {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

.newsList li {
	padding: 30px 0;
	border-bottom: 1px solid #DDD;
}

.newsList li:first-child {
	padding-top: 0;
}

.newsList li:last-child {
	border-bottom: none;
}

.newsList .date {
	margin: 0;
	color: #0A3369;
	font-size: 1.4rem;
	letter-spacing: 0.05em;
}

.newsList .title {
	margin: 5px 0 15px 0;
	padding: 0;
	color: #0A3369;
	font-size: 1.8rem;
	line-height: 1.6em;
}

.newsList .body {
	margin: 0;
}

.newsEmpty {
	text-align: center;
}

/* 記事中の画像 -------------------------------- */

.newsFigure {
	margin: 20px 0;
	text-align: center;
}

.newsFigure img {
	width: 100%;
	max-width: 600px;
	height: auto;
}

.newsFigure figcaption {
	margin-top: 8px;
	color: #666;
	font-size: 1.2rem;
	line-height: 1.6em;
}

/* トップページの最新お知らせ ------------------ */

#topNews h2 {
	padding: 0 0 25px 0;
}

#topNews {
	border-top: 1px solid #DDD;
	border-bottom: 1px solid #DDD;
	background-color: #F5F5F5;
}

#topNews .topNewsList {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

#topNews .topNewsList li {
	border-bottom: 1px dotted #CCC;
}

#topNews .topNewsList li:last-child {
	border-bottom: none;
}

#topNews .topNewsList .date {
	color: #0A3369;
	font-size: 1.4rem;
	letter-spacing: 0.05em;
}

#topNews .topNewsList a {
	color: #333;
}

#topNews .topNewsList a:hover {
	color: #0E7AC4;
}

#topNews .list {
	margin: 25px 0 0 0;
	text-align: center;
}

#topNews .list a.curtain {
	display: block;
	width: 300px;
	max-width: 100%;
	margin: 0 auto;
	color: #FFFFFF;
	background-color: #0a3369;
	border: solid 1px #0a3369;
}

#topNews .list a.curtain:hover {
	color: #0a3369 !important;
}

#topNews .list a.curtain:hover::after {
	background-color: #FFFFFF;
}

}


/********************

SP

********************/

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

#news .contentArea {
	padding: 0 20px;
}

.newsList li {
	padding: 20px 0;
}

.newsList .title {
	font-size: 1.6rem;
}

#topNews .contentArea {
	padding: 30px 20px;
}

#topNews .topNewsList li {
	padding: 15px 0;
}

#topNews .topNewsList .date {
	display: block;
	margin-bottom: 3px;
}

}


/********************

PC

********************/

@media print, screen and (min-width:737px) {

#topNews .contentArea {
	padding: 40px 0 50px 0;
}

#topNews .topNewsList li {
	padding: 18px 0;
}

#topNews .topNewsList .date {
	display: inline-block;
	width: 165px;
	vertical-align: top;
}

#topNews .topNewsList .title {
	display: inline-block;
	width: calc(100% - 170px);
	vertical-align: top;
}

}