@charset "utf-8";

/*==============================================

	blog

==============================================*/

.page_wrap {
	display: flex;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto 120px;
}

.blog_cat_list {
	background-color: #F7F4E9;
	padding: 100px 0 90px;
}
.blog_cat_list ul {
	display: flex;
	flex-wrap: wrap;
	max-width: 1120px;
	align-items: flex-start;
	justify-content: flex-start;
	margin: 0 auto;
}
.blog_cat_list ul >li {
	width: calc(20% - 10px);
	margin: 0 5px 10px;
	margin-bottom: 10px;
}
.blog_cat_list ul >li a {
	display: block;
	text-align: center;
	font-size: 12px;
	border: 1px solid #BCB9AE;
	padding: 9px 0;
}
.blog_cat_list ul >li a.active {
	background-color: #A76752;
	border: 1px solid #A76752;
	color: #fff;
}

.blog_main_list {
	width: 730px;
	/* border-top: 1px solid #6a665f7d; */
	margin-top: 29px;
}
.blog_main_list > h2 {
	max-width: 1100px;
	margin: 0 auto 40px;
	font-size: 16px;
	letter-spacing: 1px;
}
.blog_entry_list {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.blog_entry_list .blog_entry {
	width: 30.138%;
	margin-right: 4.793%;
	margin-bottom: 40px;
}

.blog_entry_list .blog_entry:nth-child(3n) {
	margin-right: 0;
}
.blog_entry a {
	display: block;
	transition: all .2s ease-in;
	position: relative;
	/* padding: 25px 0 25px; */
	/* padding-right: 35px; */
}
.blog_entry a:hover {
	opacity: .7;
	/* padding-left: 4px; */
	/* padding-right: 26px; */
}

.blog_entry a > picture {
	background-color: #DDDDDD;
	margin-bottom: 10px;
	/* display: block; */
	min-height: 220px;
	display: flex;
	align-items: center;
	position: relative;
	padding-top: 100%;
}
.blog_entry a > picture img {
	object-fit: cover;
	/* width: 100%; */
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
}
.blog_entry .date {
	color: #907416;
	/* margin-right: 20px; */
	font-size: 1.3rem;
	white-space: nowrap;
	min-width: 7em;
	/* margin-left: 10px; */
}
.blog_entry .date_cat {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	/* margin-right: 25px; */
	/* justify-content: space-between; */
}
.blog_entry .cats {
	/* border: 1px solid #907416; */
	color: #907416;
	/* padding: 1px 16px 0px; */
	border-radius: 30px;
	font-size: 1.3rem;
	margin-right: 10px;
}
.blog_entry .cats span {
	font-size: 12px;
	margin: 0 1px;
	color: inherit;
	font-size: inherit;
}
.blog_entry .meta {
	/* margin-top: 15px; */
	/* display: flex; */
	/* align-items: flex-start; */
}
.blog_entry .title {
	font-size: 1.3rem;
	letter-spacing: .5px;
	text-align: left;
	margin-top: 1px;
	line-height: 2em;
	margin-top: 10px;
}


.sidebar_area {
	width: calc(100% - 730px);
	padding-left: 70px;
}
.sidebar_area .box {
	margin-bottom: 50px;
}
.page_wrap .sidebar h2 {
	font-size: 1.3rem;
	padding-bottom: 8px;
	margin-bottom: 15px;
	border-bottom: 1px solid #bcc1b36e;
	/* margin-top: 30px; */
	color: #907416;
}
.page_wrap .sidebar ul li a {
	font-size: 12px;
	display: inline-block;
}
.page_wrap .sidebar ul li{
	margin-bottom: 10px;
}
.page_wrap .sidebar ul li.selected a {
	color: #907416;
}

.page_wrap .sidebar .box select{
	width: 100%;
	border: 1px solid #6a665f7d;
	border-radius: 3px;
	padding: 12px 12px;
}

.page_nav {
	width: 100%;
}
.page_nav {
	display: flex;
	justify-content: space-between;
	margin: 40px 0 0;
	padding-top: 30px;
	border-top: 1px solid #bcc1b36e;
	flex-wrap: wrap;
}
.page_nav a {
	color: #B2987B;
	font-size: 1.6rem;
	/* min-width: 5em; */
	letter-spacing: 1.5px;
}

/* 詳細ページ */
.single .blog_main_list {
	border-top: none;
	margin-top: -20px;
}
.blog_entry_detail .title {
	font-size: 1.5rem;
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-bottom: 1px solid #bcc1b36e;
}

.content_detail {
	margin-top: 30px;
}
.content_detail h2 {
	font-size: 1.5rem;
	margin: 30px 0 15px;
	line-height: 2em;
	letter-spacing: 1.5px;
}
.content_detail .img {
	margin: 20px 0 20px;
	display: block;
}
.content_detail p {
	font-size: 1.3rem;
	margin: 15px 0 20px;
	line-height: 2em;
}
.content_detail .code_etc {
	margin: 15px 0 15px;
}
.content_detail p a {
	text-decoration: underline;
	color: #907416;
	font-size: inherit;
}
.single .page_nav {
	border-top: 1px solid #bcc1b36e;
	padding-top: 40px;
	margin-top: 80px;
}
.single .page_nav > div{
	min-width: 45px;
}
.single .page_nav .btn_back {
	position: relative;
	order: 2;
	width: 100%;
	margin-top: 30px;
}
.single .page_nav .btn_back a {
	position: relative;
	display: block;
	padding-left: 40px;
	padding-left: 60px;
	padding-right: 0;
}
.single .page_nav .btn_back a:before {
	background-color: #555555;
    left: 12px;
    right: auto;
}
.single .page_nav .btn_back a:after {
	background-color: #555555;
    left: 0;
    right: auto;
}
/*---------------------------------------------------------------*\
	$736px
\*---------------------------------------------------------------*/
@media screen and (max-width: 736px) {

	.page_wrap {
		flex-direction: column;
		padding: 0 20px;
		margin-bottom: 60px;
	}
	.blog_main_list {
		width: 100%;
		margin-top: 0;
	}
	.blog_entry_list .blog_entry {
		width: 47%;
		margin: 0 auto 30px;
		margin-right: 6%;
		margin-left: 0;
	}
	.blog_entry_list .blog_entry:nth-child(3n) {
		margin-right: 6%;
	}
	.blog_entry_list .blog_entry picture {
		min-height: unset;
	}
	.blog_entry_list .blog_entry:nth-child(2n) {
		margin-right: 0;
	}
	.sidebar_area {
		width: 100%;
		padding-left: 0;
		padding: 0 20px;
		margin-top: 50px;
	}
	.blog_entry a .meta {
		flex-direction: column;
	}
	.blog_entry a .meta .title {
		margin-top: 10px;
	}
	.blog_entry .date {
		width: auto;
		min-width: unset;
	}
	.single .page_nav .btn_back a {
	width: calc(100% - 40px);
	margin: 0px auto 0;
	border: 1px solid #B2987B;
	color: #B2987B;
	text-align: center;
	padding: 12px 20px;
	}
	.single .page_nav .btn_back a:before {
		left: 28px;
	}
	.single .page_nav .btn_back a:after {
		left: 15px;
	}
}