/* ============================================== */
/* news common */
/* ============================================== */

.news {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.news__item {
	display: flex;
	justify-content: flex-start;
	gap: 10px;
}

.news__img {
	width: 120px;
	height: 80px;
	box-sizing: border-box;

	border: 2px solid #FFF;
	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.2);

}
.news__img img {
	/* 親をボックスとする */
	width: 100%;
	height: 100%;
	
	/* 内接・外接を指定 */
	object-fit: cover;

}

.news__meta {
	height: 24px;
	
	display: flex;
	flex-direction: row;
	justify-content: left;
	align-items: center;
	gap: 10px;
}

.news__time {
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1.0;
	color: #3C465B;
}
.news__label {
	padding: 2px 8px;
	box-sizing: border-box;
	height: 100%;

	text-align: center;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1.0;

	/* 子要素にタグは無いが、これで文字が上下左右中央揃えになる */
	display: flex;
	justify-content: center;
	align-items: center;
}



.news__label__menu {
	border: 0.5px solid #4666A3;
	background-color: #CFD7E5;
	color: #4666A3;
}
.news__label__new {
	border: 0.5px solid #51903A;
	background-color: #DBE5CF;
	color:  #51903A;
}
.news__label__open {
	border: 0.5px solid  #9D4242;
	background-color: #E5CFCF;
	color:  #9D4242;
}


.news__txt {
	margin-top: 10px;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.8;
}


/* ---------- PC ---------- */
@media screen and (min-width:769px) {


	.news {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.news li {
		flex: 1;
	}

	.news__item {
		flex-direction: column;
	}

	.news__img {
		/* width: 240px;
		height: 160px; */
		width: 100%;
		height: auto;
		aspect-ratio: 240 / 160;
	}

	.news__txt {
		font-size: 2.0rem;
	}


}


/* ============================================== */
/* newsList */
/* ============================================== */

.article__newsList {
	background-image: url(../img/bg_01.jpg);
	background-repeat: repeat;
	background-position: center;
}

.article__header__newsList {
	margin-top: 80px;
	background-image: url(../img/main_image_news_list_SP.jpg);
}

.section__newsList {
	width: 100%;

	padding: 60px 20px;
}

.news__lists {
	margin-top: 0px;
}


/* pagination */

.pagination {
	margin-top: 20px;

	display: flex;
	justify-content: center;
	align-items: center;
}

.pagenation__item {
	box-sizing: border-box;
	
	width: 40px;
	height: 40px;

	text-align: center;
}

/* .pagenation__item__current {
	color: #232D42;
	border-bottom: 2px solid #232D42;
} */

/* .pagenation__item__notselected:hover {
	border-bottom: 2px solid #232D42;
} */


.pagenation__item__txt {
	color: #3C465B;

	font-size: 1.4rem;
	font-weight: 500;
	line-height: 40px;

	display: inline-block;
	width: 100%;
	height: 100%;
}

.pagenation__item__txt__current {
	color: #232D42;

	font-size: 1.4rem;
	font-weight: 700;
	line-height: 40px;
}

.pagenation__item__txt__notSelected:hover {
	color: #232D42;
}

.btn__newsList {
	margin-top: 20px;
}

/* ---------- PC ---------- */
@media screen and (min-width:769px) {

	.article__header__newsList {
		background-image: url(../img/main_image_news_list_PC.jpg);
		margin-top: 100px;
	}

	.contentsArea__newsList {
		padding: 120px 20px;
		margin: 0 auto;
		max-width: 1040px;
	}

	.section__newsList {
		padding: 0px 0px;
	}

	.news__lists {
		margin-top: 40px;
	}
	.news__lists__top {
		margin-top: 0px;
	}


	/* pagination */

	.pagination {
		margin-top: 40px;
	}
	
	/* .pagenation__item {
	}  */

	.pagenation__item__txt {
		font-size: 1.6rem;
	}

	.pagenation__item__txt__current {
		font-size: 1.6rem;
	}

	/* .pagenation__item__txt__notSelected:hover {
	} */

	.btn__newsList {
		margin: 80px 0 80px auto;
		width: 400px;
	}


}

/* ============================================== */
/* newsDetail */
/* ============================================== */


.article__newsDetail {
	margin-top: 80px;
	width: 100%;

	padding: 60px 20px;

	background-image: url(../img/bg_01.jpg);
	background-repeat: repeat;
	background-position: center;
}

.news__meta__detail {
	margin-top: 20px;
}

.newsDetail__img {
	margin-top: 20px;

	width: 100%;
	height: auto;
	box-sizing: border-box;

	border: 2px solid #FFF;
	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.2);

}
.newsDetail__img img {
	width: 100%;
	height: auto;
}

.newsDetail__txt {
	margin-top: 20px;

	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.8;
}

.btn__newsDetail {
	margin-top: 20px;
}



/* ---------- PC ---------- */
@media screen and (min-width:769px) {

	.article__newsDetail {
		margin-top: 100px;
		padding: 0px 0px;
	}

	.contentsArea__newsDetail {
		padding: 120px 20px;
		margin: 0 auto;
		max-width: 1040px;
	}

	.newsDetail__img {
		width: 80%;
		margin: 10px auto o;
	}
	
	.btn__newsDetail {
		margin: 80px auto;
		width: 400px;
	}

}