/* -------------------------------- read */
.read {
	margin-top: 50px;
	text-align: center;
	font-size: 2rem;
}

/* -------------------------------- btn */
.btn {
	display: block;
	width: 384px;
	height: 68px;
	margin: 0 auto;
	padding: 22px 18px 0;
	line-height: 1;
	color: #FFF;
	font-size: 20px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	border-radius: 100px;
	background-color: #CF870A;
}
.btn:hover {
	opacity: 0.7;
}
.btn img {
	position: absolute;
	right: 28px;
	top: 28px;
}
@media screen and (max-width: 767px) {
	.btn {
		width: 100%;
		height: auto;
		padding: 4vw;
		margin: 0;
		position: relative;
		bottom: auto;
	}
	.btn img {
		top: 50%;
		right: 15px;
		margin-top: -5px;
	}
}

/* -------------------------------- lNav */
.lNav {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 34px;
	margin: 47px 0 74px;
	border-bottom: #CCC 1px solid;
}
.lNav a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 450px;
	height: 69px;
	border: #CCC 1px solid;
	border-bottom: none;
	font-size: 2.8rem;
	font-weight: bold;
	text-decoration: none;
}
.lNav a.news {
	color: #CF870A;
}
.lNav a.news.current {
	border-top: #CF870A 3px solid;
	pointer-events: none;
}
.lNav a.news:hover {
	background: #F5E7CE;
}
.lNav a.album {
	color: #659857;
}
.lNav a.album.current {
	border-top: #659857 3px solid;
	pointer-events: none;
}
.lNav a.album:hover {
	background: #E0EADD;
}
@media screen and (max-width: 767px) {
	.lNav {
		gap: 10px;
	}
	.lNav a {
		font-size: 5.6vw;
	}
}

/* -------------------------------- htl */
h3.h3_emergency {
	margin: 0 20px 20px;
	color: #AB1010;
	font-size: 2.4rem;
}
h3.h3_news {
	margin: 0 20px 20px;
	color: #157A49;
	font-size: 2.4rem;
}
h3.h3_album {
	text-align: left;
	text-indent: 0;
	padding: 0;
	border: none;
	color: #cf870a;
	font-size: 4rem;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.3;
	position: relative;
}
h3.h3_album::before {
	content: '';
	width: 100%;
	height: 1px;
	margin: -1px auto 0;
	background: #CF870A;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
}
h3.h3_album i {
	margin-right: 10px;
	vertical-align: 0;
}
h3.h3_album .sp_bg {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 15px 30px 15px 0;
	background: #FFF;
	text-align: center;
	position: relative;
	z-index: 1;
}



h4.h4_winter,
h4.h4_autumn,
h4.h4_summer,
h4.h4_spring {
	margin: 0 0 18px;
	line-height: 1.4;
	font-size: 2.6rem;
	color: #4974AA;
}
h4.h4_autumn {
	color: #A75B4A;
}
h4.h4_summer {
	color: #659857;
}
h4.h4_spring {
	color: #E16161;
}
h4.h4_winter mark,
h4.h4_autumn mark,
h4.h4_summer mark,
h4.h4_spring mark {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 90px;
	height: 25px;
	margin: 0 15px 0 0;
	background: #4974AA;
	color: #FFF;
	font-size: 2rem;
}
h4.h4_autumn mark {
	background: #A75B4A;
}
h4.h4_summer mark {
	background: #659857;
}
h4.h4_spring mark {
	background: #E16161;
}
@media screen and (max-width: 767px) {
	h3.h3_emergency,
	h3.h3_news {
		font-size: 4.8vw;
	}
	h3.h3_album {
		font-size: 8vw;
	}
	h3.h3_album .sp_bg {
		padding-right: 10px;
	}
	h4.h4_winter,
	h4.h4_autumn,
	h4.h4_summer,
	h4.h4_spring {
		font-size: 5.2vw;
	}
	h4.h4_winter mark,
	h4.h4_autumn mark,
	h4.h4_summer mark,
	h4.h4_spring mark {
		width: auto;
		padding: 0 5px;
		font-size: 4vw;
	}
}
/* -------------------------------- emergency */
.emergencyBox {
	margin: 0 0 80px;
	padding: 5px 27px;
	border: #AB1010 3px solid;
}
.emergencyBox .sectionNews:first-of-type {
	border: none;
}
@media screen and (max-width: 767px) {
	.emergencyBox {
		padding: 5px 12px
	}
}

/* -------------------------------- section */
.sectionNews {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 25px 0;
	border-top: #CCC 1px solid;
}
.sectionNews:nth-last-of-type(1) {
	border-bottom: #CCC 1px solid;
}

.sectionNews .img {
	align-self: flex-start;
	width: 200px;
}
.sectionNews .text {
	flex: 1;
	margin: 0 0 0 32px;
}
.sectionNews .text a {
	color: #CF8709;
	font-size: 2.2rem;
}
@media screen and (max-width: 767px) {
	.sectionNews {
		display: block;
	}
	.sectionNews .img {
		margin: 0 auto;
	}
	.sectionNews .text  {
		margin: 0;
	}
}
/* -------------------------------- pagenation */
.pagenation {
	margin: 65px 0 50px;
	text-align: center;
}
.pagenation a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 32px;
	padding: 0 0 2px;
	text-decoration: none;
	color: #659857;
	font-size: 1.9rem;
	font-weight: bold;
	border-radius: 2px;
}

.pagenation a:first-of-type {
	/*margin-right: 15px;*/
}
.pagenation a:last-of-type {
	/*margin-left: 15px;*/
}
.pagenation .firstnav {
	margin-right: 15px;
}
.pagenation .lastnav {
	margin-left: 15px;
}
.pagenation a:hover {
	text-decoration: underline;
}
.pagenation a.current {
	background: #659857;
	color: #FFF;
	pointer-events: none;
}
.pagenation a.disabled {
	color: #CFCFCF;
	pointer-events: none;
}

/* -------------------------------- photoList */
.photoList {
	display: flex;
	flex-wrap: wrap;
	gap: 26px;
	margin: 0 0 48px;
}
.photoList > div {
	max-width: 280px;
	width: 100%;
	margin: 0 0 20px;
}

.photoList a {
	text-decoration: none;
}
.photoList a:hover {
	color: #659857;
}

.photoList a img {
	object-fit: cover;
	width: 100%;
	height: 200px;
}

@media screen and (max-width: 767px) {
	.photoList {
		justify-content: space-between;
		gap: 0;
	}
	.photoList > div {
		width: 49%;
		max-width: none;
	}
}
/* -------------------------------- modal */
.mfp-content {
	width: 90%;
	max-width: 1000px;
	padding: 40px;
	background: #FFF;
}

.albumCaption {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.albumCaption h5 {
	margin: 0 0 15px;
	font-size: 2.5rem;
	line-height: 1.4;
}
.albumCaption .img {
	max-width: 470px;
}
.albumCaption .text {
	flex: 1;
	margin: 0 0 0 27px;
}

.mfp-close {
	font-size: 4.8rem!important;
}
@media screen and (max-width: 767px) {
	.mfp-content {
		padding: 20px;
	}
	.albumCaption {
		display: block;
	}
	.albumCaption .text {
		margin: 10px 0 0;
	}
}
/* -------------------------------- backNumber */
.backNumber {
	margin: 120px 0 60px;
}
.backNumber ul li {
	display: inline-block;
	margin: 0 40px 10px 0;
}
.backNumber ul li i {
	margin: 0 10px 0 0;
	color: #CF870A;
	
}
.backNumber ul li a {
	text-decoration: none;
}
.backNumber ul li a:hover {
	color: #CF870A;
}
