@charset "UTF-8";
.column_wrap {
	font-size : 16px;
	clear : both;
	width : 990px;
	margin-top : 0;
	margin-right : auto;
	margin-bottom : 60px;
	margin-left : auto;
	padding-top : 0;
	padding-right : 20px;
	padding-bottom : 0;
	padding-left : 20px;
}
.column_wrap h2 {
	font-size : x-large;
	margin-top : 0;
	margin-right : 0;
	margin-bottom : 30px;
	margin-left : 0;
	padding : 0;
}
#column p {
	line-height : 1.7;
	margin : 0.75em 0;
	padding : 0;
}
#column li {
	line-height : 1.7;
	padding : 0;
}
#column strong {
	font-weight : bold;
}
#column > .inner {
	display : grid;
	grid-template-columns : 1fr 320px;
	grid-gap : 40px;
}
#column > .inner.nothing {
	display : block;
	margin-bottom : 60px;
	padding : 40px;
	text-align : center;
	background-color : #ffffff;
}
#column .articlelist {
	margin : 0 0 60px;
	padding : 0;
}
#column .articlelist > li {
	padding : 32px;
	list-style : none;
	border-top : 3px solid #fe922e;
	background-color : #ffffff;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#column .articlelist > li:not(:last-child) {
	margin-bottom : 60px;
}
#column .article {
	background-color : #ffffff;
}
#column .article  header,
#column .articlelist > li header {
	display : grid;
	grid-template-columns : 240px 1fr;
	grid-gap : 24px;
}
#column .article  header .date,
#column .articlelist > li header .date {
	display : flex;
	grid-column : 1 / 2;
	grid-row : 1 / 2;
	justify-content : center;
	align-items : center;
	margin : 0;
	padding : 0.25em;
	color : #ffffff;
	border-radius : 4px;
	background-color : #fe922e;
}
#column .article  header .category,
#column .articlelist > li header .category {
	display : flex;
	grid-column : 2 / 3;
	grid-row : 1 / 2;
	align-items : center;
	margin : 0;
}
#column .article  header .category a,
#column .articlelist > li header .category a {
	text-decoration : underline;
	color : #fe922e;
}
#column .article  header .title,
#column .articlelist > li header .title {
	display : flex;
	grid-column : 1 / 3;
	grid-row : 2 / 3;
	font-size : 1.8em;
	font-weight : bold;
	line-height : 1.4;
	align-items : center;
	margin : 0 0 32px 0;
	padding-bottom : 1em;
	border-bottom : 1px solid #dddddd;
}
#column .article  header .title img,
#column .articlelist > li header .title img {
	margin-right : 0.5em;
}
#column ul.articlelist > li .content {
	display : grid;
	grid-template-columns : 240px 1fr;
	grid-gap : 32px;
}
#column ul.articlelist > li .content .img img {
	width : 100%;
}
#column ul.articlelist > li .content .more {
	margin-top : 24px;
}
#column ul.articlelist > li .content .more a {
	font-weight : bold;
	color : #fe922e;
}


#column .right > :not(:last-child) {
	margin-bottom : 40px;
}
#column .catlist {
	background-color : #ffffff;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#column .catlist ul {
	margin : 0;
	padding : 24px;
}
#column .catlist h3 {
	font-weight : bold;
	margin : 0;
	padding : 1em;
	text-align : center;
	color : #ffffff;
	background-color : #fe922e;
}
#column .catlist ul > li {
	list-style : none;
}
#column .catlist ul > li:not(:last-child) {
	margin-bottom : 0.5em;
}
#column .catlist ul > li a {
	text-decoration : none;
}

#column .taglist {
	background-color : #ffffff;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#column .taglist ul {
	margin : 0;
	padding : 24px;
}
#column .taglist h3 {
	font-weight : bold;
	margin : 0;
	padding : 1em;
	text-align : center;
	color : #ffffff;
	background-color : #fe922e;
}
#column .taglist ul > li {
	display : inline;
	list-style : none;
}
#column .taglist ul > li:not(:last-child) {
	margin-right : 0.5em;
}
#column .taglist ul > li a {
	text-decoration : none;
	color : #fe922e;
}


#column .article {
	margin-bottom : 60px;
	padding : 24px;
	border-top : 3px solid #fe922e;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#column .article .thumbnail {
	margin-bottom : 60px;
	text-align : center;
}
#column .article .thumbnail img {
	width : 100%;
	max-width : 400px;
}

#indexlist {
	margin-bottom : 60px;
	padding : 32px;
	border-radius : 12px;
	background-color : #f7f3ba;
}
#indexlist ul {
	margin : 0;
	padding : 0;
	list-style : none;
}
#indexlist ul > li {
	margin : 0;
	padding : 0;
	list-style : none;
}
#indexlist h4 {
	position : relative;
	font-size : 1.6em;
	font-weight : bold;
	margin : 0 0 1em;
}
#indexlist h4 span {
	z-index : 1;
	position : relative;
	padding-right : 1em;
	background-color : #f7f3ba;
}
#indexlist h4::before {
	display : block;
	z-index : 0;
	position : absolute;
	top : 50%;
	left : 0;
	width : 100%;
	height : 2px;
	content : "";
	background-color : #f8c600;
}
#column .article #indexlist a {
	color : inherit;
}

#indexlist .__third {
	font-weight : bold;
	margin-bottom : 0.75em;
}
#indexlist .__third::before {
	display : inline-block;
	width : 1em;
	content : "・";
}
#indexlist .__fourth {
	margin-bottom : 0.75em;
	padding-left : 1em;
}

#pagenav {
	display : grid;
	grid-template-columns : 1fr 8em 1fr;
	grid-gap : 12px;
	margin-top : 60px;
}
#pagenav .prev,
#pagenav .back,
#pagenav .next {
	display : flex;
	border-top : 5px solid #fe922e;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#pagenav .back {
	line-height : 1.7;
	text-align : center;
}
#pagenav .back a {
	display : flex;
	font-weight : bold;
	line-height : 1.45;
	flex-direction : column;
	flex-grow : 1;
	justify-content : center;
	align-items : center;
	padding : 24px;
	text-decoration : none;
	color : inherit;
	background-color : #ffffff;
}
#pagenav .notfound {
	display : flex;
	font-weight : bold;
	line-height : 1.45;
	flex-direction : column;
	flex-grow : 1;
	justify-content : center;
	align-items : center;
	padding : 24px;
	text-decoration : none;
	color : inherit;
	background-color : #ffffff;
}

#pagenav .prev a,
#pagenav .next a {
	display : flex;
	position : relative;
	flex-direction : column;
	flex-grow : 1;
	justify-content : center;
	align-items : flex-start;
	width : 100%;
	padding : 24px;
	text-decoration : none;
	color : inherit;
	background-color : #ffffff;
}

#pagenav .prev a::before,
#pagenav .prev a::after,
#pagenav .next a::before,
#pagenav .next a::after {
	position : absolute;
	top : calc(50% - 1.5px);
	right : 20px;
	width : 20.1px;
	height : 3px;
	content : "";
	transform-origin : calc(100% - 1.5px) 50%;
	border-radius : 9999px;
	background-color : #fe922e;
}

#pagenav .prev a::before,
#pagenav .next a::before {
	transform : rotate(60.25deg);
}
#pagenav .prev a::after,
#pagenav .next a::after {
	transform : rotate(-60.25deg);
}

#pagenav .title {
	font-weight : bold;
}
#pagenav .date {
	font-size : 0.875em;
	margin-right : 0.5em;
}
#pagenav .category {
	font-size : 0.875em;
	text-decoration : underline;
	color : #fe922e;
}


.pagenation {
	display : flex;
	justify-content : center;
	align-items : center;
	margin-top : 32px;
}
.pagenation a,
.pagenation .current span {
	display : block;
	padding : 8px;
	border : 1px solid #dddddd;
	border-radius : 3px;
	background-color : #ffffff;
}
.pagenation a:hover {
	color : #999999;
	background-color : #f3f3f3;
}
.pagenation .pagenation__body {
	display : flex;
	justify-content : center;
	align-items : center;
	margin : 0;
	margin : 0 1em;
	padding : 0;
}
.pagenation .pagenation__body li {
	margin : 0;
	padding : 0;
	list-style : none;
}
.pagenation .pagenation__body li:not(:last-child) {
	margin-right : 0.5em;
}
.pagenation .pagenation__body li.current span {
	color : #ffffff;
	border : 1px solid #535353;
	background-color : #535353;
}

@media screen and (max-width: 767px) {
	.column_wrap {
		width : auto;
	}
	#column > .inner {
		grid-template-columns : 1fr;
	}
	#column .article header,
	#column .articlelist > li header {
		grid-template-columns : auto 1fr;
	}
	#column .article header .title,
	#column .articlelist > li header .title {
		font-size : 1.4em;
	}
	#column .article header .date,
	#column .articlelist > li header .date {
		font-size : 0.725em;
		padding : 0.25em 1em;
	}
	#column .article header .title img,
	#column .articlelist > li header .title img {
		display : none;
	}

	#column .article header .category,
	#column .articlelist > li header .category {
		font-size : 0.725em;
	}
	#column ul.articlelist > li .content {
		grid-template-columns : 1fr;
	}
	#indexlist {
		font-size : 0.725em;
		margin-bottom : 40px;
		padding : 24px;
	}
	#pagenav {
		grid-template-columns : 1fr;
	}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.column_wrap {
		width : auto;
	}
	#column > .inner {
		grid-template-columns : 1fr;
	}
}
