@charset "UTF-8";

/* ▼▼▼ トピックス
=====================================*/
.news {
	margin: 0 auto 50px;
	border-bottom: #707070 1px dotted;
	}
	.news .date {
		color: #AAAAAA;
		font-size: 18px;
	}
	.news h2{
		font-size: 24px;
		margin-bottom: 24px;
	}
	.news .txt_box{
		font-size: 16px;
		margin-bottom: 20px;
	}
	.news .more{
		margin-bottom: 40px;
	}
	.news ul.img_area{
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 20px;
	}
	.news ul.img_area li {
		flex: 0 0 210px;
		margin-right: 20px;
		margin-bottom: 20px;
	}
	.news ul.img_area li img{
		width: 100%;
	}
.pagenav {
	width: 300px;
	padding: 20px 0 0;
	margin: 0 auto;
	line-height: 50px;
	position: relative;
	overflow: hidden;
	}
.detail .pagenav {
	width: 100%;
	padding: 30px 0 0;
	}
	.pagenav ol {
		width: 170px;
		margin: 0 auto;
		overflow: hidden;
		}
		.pagenav ol li {
			float: left;
			width: 50px;
			background: #CC2F2F;
			margin-right: 10px;
			font-size: 20px;
			color: #fff;
			text-align: center;
			}
		.pagenav ol li:last-child {margin-right: 0;}
			.pagenav ol li a {
				line-height: 48px;
				display: block;
				background: #FFFFFF;
				border: 1px solid #000000;
				color: #000000;
				}
			.pagenav ol li a:hover {
				background: none;
				border: none;
				color: #fff;
				line-height: 50px;
				text-decoration: none;
				}
	.pagenav .prev,
	.pagenav .next {
		position: absolute;
		top: 20px;
		left: 0;
		}
	.pagenav .next {
		left: inherit;
		right: 0;
		}
	.pagenav .prev a:before {
		content: "<";
		margin-right: 5px;
		color: #000000;
		}
	.pagenav .next a:after {
		content: ">";
		margin-left: 5px;
		color: #000000;
		}
	.pagenav .back.btn.arrow {
		background-color: #FFFFFF;
		width: 184px;
		height: 50px;
		line-height: 50px;
		border: #000000 1px solid;
		border-radius: 25px;
		margin: 0 auto;
		padding-left: 0;
		color: #000000;
		}
		.pagenav .back.btn.arrow::after{
			background-image: url(../img/arrow_b.png);
		}
		.pagenav a{
			color: #000000;
		}

/* 詳細 */
.article {
	overflow: hidden;
	}
	.article .date {
		margin: 0;
		color: #AAAAAA;
		font-size: 18px;
		}
	.article h2 {
		border-bottom: 1px dotted #707070;
		padding-bottom: 30px;
		margin-bottom: 50px;
		font-size: 24px;
		overflow: hidden;
		}
		.article p{
			margin-bottom: 50px;
		}
		.article ul.img_area{
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			flex-wrap: wrap;
			margin-bottom: 20px;
		}
		.article ul.img_area li {
			flex: 0 0 48%;
			margin-right: 4%;
			margin-bottom: 20px;
		}
		.article ul.img_area li:nth-child(2n) {
			margin-right: 0;
		}
		.article ul.img_area li img{
			width: 100%;
		}
		.article ul.link {
			margin-bottom: 50px;
			}
			.article ul.link li {
				margin-bottom: 10px;
				}
				.article ul.link li a {
					color: #CC2F2F;
					text-decoration: underline;
					}
					.article ul.link li a:hover{
						text-decoration: none;
					}
		.pdf{
			display: inline-flex;
			align-items: center;
			height: 30px;
		}
		.pdf::before{
			content: '';
			display: inline-block;
			width: 25px;
			height: 30px;
			background: url(../img/icon_pdf.png) center center no-repeat;
			-webkit-background-size: contain;
			background-size: contain;
			margin-right: 10px;
		}

/* ▼▼▼ 480px
=====================================*/
@media screen and (max-width: 480px) {

	.news {
		margin: 0 auto 30px;
		}
	.news h2{
		font-size: 16px;
		margin-bottom: 24px;
	}
	.news ul.img_area,.article ul.img_area{
		flex-wrap: wrap;
	}
	.news ul.img_area li,.article ul.img_area li{
		flex: 0 0 100%;
		margin-right: 0;
		margin-bottom: 10px;
	}
	.news .more{
		margin-bottom: 20px;
	}

.pagenav {
	padding: 15px 0 0;
	}
.detail .pagenav {
	padding: 15px 0 0;
	}
	.pagenav ol {
		width: 140px;
		line-height: 40px;
		}
		.pagenav ol li {
			width: 40px;
			}
			.pagenav ol li a{
				line-height: 38px;
			}
			.pagenav ol li a:hover{
				line-height: 38px;
				background: #FFFFFF;
				border: 1px solid #000000;
				color: #000000;
			}

	.pagenav .prev,
	.pagenav .next {
		top: 10px;
		left: 20px;
		}
	.pagenav .next {
		left: inherit;
		right: 20px;
		}
	.pagenav .back {
		width: 210px;
		}

/* 詳細 */
.article {
	}
	.article .date {
		padding-top: 10px;;
		font-size: 16px;
		}
	.article h2 {
		padding-bottom: 10px;
		margin-bottom: 15px;
		font-size: 16px;
		}
		.article .inner {
			margin-bottom: 10px;
			}
		.article .photo,
		.article ul.link {
			float: none;
			width: 100%;
			margin-left: 0;
			}
		.article .photo {margin-bottom: 10px;}
			.article ul.link li {
				margin-bottom: 10px;
				}
				.article ul.link li a {
					background-size: 14px 14px;
					}

}
