/***************************
 *
 * 投稿・カテゴリーページ
 * ★ページ中身用★
 *
 **************************/

@media all and (min-width: 737px) {
	.sec-news {
		margin-bottom: 100px;
	}
	/*--------------------------------
カテゴリ
---------------------------------*/

	.l-cat {
		position: relative;
		flex-wrap: wrap;
		display: flex;
		justify-content: space-between;
		max-width: 1220px;
		padding-left: 40px;
		padding-right: 40px;
		margin: 10px auto;
		box-sizing: border-box;
	}
	.l-cat .l-sidebar {
		order: 1;
		width: 280px;
		position: sticky;
		left: 0;
		top: 0;
	}
	.l-cat .l-cat-content {
		order: 2;
		width: 72%;
		width: calc(100% - 360px);
	}
	.page .cat-now {
		font-weight: bold;
		font-size: 2.4rem;
		border-left: 4px solid #2e8577;
		padding: 0;
		padding-left: 15px;
		margin: 0;
		margin-bottom: 24px;
	}
	.post-no {
		font-size: 2rem;
		letter-spacing: 0.1em;
		background: #f1f1f3;
		padding: 55px 93px;
		max-width: 990px;
		margin: 0 auto;
	}

	/*--------------------------------
シングル
---------------------------------*/

	.post-info {
		position: relative;
		padding-bottom: 22px;
		margin-bottom: 28px;
	}

	.post-info .post-time {
		display: inline-block;
		font-size: 1.4rem;
		color: #000000;
		margin-right: 10px;
	}

	.post-info .post-cat {
		display: inline-block;
	}
	.post-info .post-cat a {
		color: #2e8577;
		display: inline-block;
		font-size: 1.2rem;
		line-height: 27px;
		background: #fff;
		border-radius: 30px;
		padding: 2px 15px;
		background: #f0f5f1;
		position: relative;
		z-index: 3;
		margin-right: 3px;
		transition: 0.3s ease;
	}
	.post-info .post-cat a:hover {
		text-decoration: none;
		background: #2e8577;
		color: white;
	}
	.post-info .post-title {
		margin-top: 15px;
		font-weight: bold;
		color: #000000;
		font-size: 2.4rem;
		font-weight: bold;
		line-height: 1.5em;
	}

	.post hr {
		border: none;
		border-top: 1px solid #e7e0d3;
	}

	.post-single {
		margin-bottom: 40px;
		position: relative;
		display: block;
	}

	/*--------------------------------
ページ送り
---------------------------------*/
	.pagenavi {
		text-align: center;
		padding: 60px 0px 110px;
		width: 100%;
		margin-bottom: 0px;
		position: relative;
	}

	ul.page-numbers {
		position: relative;
		text-align: center;
		padding: 0 0px;
		margin: 0px auto 50px;
	}
	ul.page-numbers > li {
		display: inline-block;
		letter-spacing: normal;
		margin: 0 2px;
		vertical-align: top;
	}
	ul.page-numbers > li > a,
	ul.page-numbers > li > span {
		text-align: center;
		display: inline-block;
		background: #e8e8e8;
		box-sizing: border-box;
		font-size: 1.8rem;
		color: #7e7e7e;
		font-weight: normal;
		padding: 5px 13px 5px;
		border-radius: 10px;
		transition: all 0.3s ease;
		text-decoration: none;
	}
	ul.page-numbers > li:first-child > a {
	}
	ul.page-numbers > li:last-child > a {
	}
	ul.page-numbers > li > a:hover {
		cursor: default;
		z-index: 2;
		text-decoration: none;
		background: #b2cdb7;
		color: #fff;
	}
	ul.page-numbers .current {
		color: #fff;
		cursor: default;
		z-index: 2;
		background: #2e8577;
	}
	.page-numbers .next {
		display: block;
		color: #0f2f7a !important;
		font-weight: bold;
		padding: 0 0 3px;
		border: none;
		border-radius: 0;
		background: #fff;
		font-size: 1.6rem;
		width: 66px;
		border-bottom: 1px solid #0f2f7a;
		line-height: 19px;
		position: relative;
		top: 3px;
		display: none;
	}

	.page-numbers .next:hover {
		text-decoration: none;
		color: #0f2f7a !important;
		opacity: 0.7;
	}
	.page-numbers .prev {
		display: block;
		color: #0f2f7a !important;
		font-weight: bold;
		padding: 0 0 3px;
		border: none;
		border-radius: 0;
		background: #fff;
		font-size: 1.6rem;
		width: 66px;
		border-bottom: 1px solid #0f2f7a;
		line-height: 19px;
		position: relative;
		top: 3px;
		display: none;
	}

	.page-numbers .prev:hover {
		text-decoration: none;
		color: #0f2f7a !important;
		opacity: 0.7;
	}

	/*--------------------------------
前の記事・次の記事
---------------------------------*/
	.prev-next {
		position: relative;
		margin: 50px auto 5px;
		display: grid;
		grid-template-columns: repeat(2, 1fr);

		border-top: 1px solid #e4e4e4;
		border-bottom: 1px solid #e4e4e4;
	}

	.prev-next a {
		transition: 0.2s ease;
	}

	.prev-next .next {
		display: block;
		color: #606060 !important;
		border-radius: 0px;
		font-size: 1.4rem;
		line-height: 1.5em;
		box-sizing: border-box;
		text-align: right;
		position: relative;
		padding-right: 40px;
		padding-left: 22px;
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.prev-next .next:before {
		content: "";
		display: block;
		position: absolute;
		right: 5px;
		top: 50%;
		margin-top: -6.5px;
		background: url(../img/pn-next.png) 0 0 no-repeat;
		background-size: contain;
		width: 20px;
		height: 11px;
	}

	.prev-next .next:hover {
		background: #fcfbef;
		text-decoration: none;
	}

	.prev-next .prev {
		display: block;
		color: #606060 !important;
		border-radius: 0px;
		font-size: 1.4rem;
		line-height: 1.5em;
		box-sizing: border-box;
		text-align: left;
		position: relative;
		padding-left: 40px;
		padding-right: 22px;
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.prev-next .prev:before {
		content: "";
		display: block;
		position: absolute;
		left: 5px;
		top: 50%;
		margin-top: -6.5px;
		background: url(../img/pn-prev.png) 0 0 no-repeat;
		background-size: contain;
		width: 20px;
		height: 11px;
	}

	.prev-next .prev:hover {
		background: #fcfbef;
		text-decoration: none;
	}
	.prev-next .next:hover {
		text-decoration: none;
	}
	.prev-next .home {
		width: 82px;
		margin: 0px 61px;
		text-align: center;
	}
	.prev-next .home > a {
		padding-bottom: 5px;
		display: block;
		text-align: center;
		border-bottom: 1px solid #0f2f7a;
		font-size: 1.5rem;
		color: #0f2f7a !important;
		font-weight: 500;
		line-height: 21px;
	}
	.prev-next .home > a:hover {
		opacity: 0.7;
		text-decoration: none;
	}
	.btn-home {
		width: 234px;
		margin: 56px auto;
	}
	.btn-home a {
		display: block;
		text-align: left;
		border: 1px solid #2e8577;
		color: #2e8577;
		padding: 15px 25px;
		border-radius: 30px;
		color: #2e8577;
		font-size: 1.6rem;
		letter-spacing: 0.075em;
		position: relative;
	}
	.btn-home a:after {
		content: "";
		display: block;
		position: absolute;
		right: 10px;
		top: 50%;
		background: url(../img/btn-home.png) 0 0 no-repeat;
		background-size: contain;
		width: 20px;
		height: 4px;
		margin-top: -2px;
	}
	.btn-home a:hover:after {
		background: url(../img/btn-home-w.png) 0 0 no-repeat;
		background-size: contain;
	}
	.btn-home a:hover {
		text-decoration: none;
		background: #2e8577;
		color: #fff;
	}

	/*
*		
*
  POST CONTENT
*
*	
*/
	.post {
		word-break: break-all;
		font-size: 1.5rem;
		line-height: 1.75em;
		margin-bottom: 30px;
		color: black;
		letter-spacing: 0.06em;
	}
	.wp-block-image {
		margin-top: 30px;
		margin-bottom: 30px;
	}
	.post img {
		border-radius: 20px;
	}

	.post h2 {
		font-size: 2.6rem;
		line-height: 1.6em;
		margin: 62px 0 25px;
		letter-spacing: 0.05em;
		font-weight: bold;
		position: relative;
		background: #b2cdb7;
		padding: 16px 25px;
		border-radius: 10px;
		color: #fff;
	}

	.post h3 {
		font-size: 2.4rem;
		line-height: 1.6em;
		letter-spacing: 0.05em;
		margin-top: 40px;
		margin-bottom: 32px;
		font-weight: bold;
		padding: 9px 16px;
		border-top: 4px solid #b2cdb7;
		border-bottom: 1px solid #b2cdb7;
	}
	.post h4 {
		font-size: 2.2rem;
		font-weight: bold;
		line-height: 1.6em;
		margin: 43px 0 22px;
		letter-spacing: 0.05em;
		position: relative;
		padding-left: 15px;
		border-left: 3px solid #2e8577;
	}

	.post h5 {
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 1.6em;
		letter-spacing: 0.05em;
		margin: 44px 0 20px;
		color: #2e8577;
	}
	.post h6 {
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 1.6em;
		letter-spacing: 0.05em;
		margin: 44px 0 20px;
	}

	.post p {
		margin-bottom: 30px;
	}

	.post p a {
		color: #499ab9;
		text-decoration: underline;
	}

	.post ol {
		margin-bottom: 30px;
		counter-reset: number;
	}
	.post ol > li {
		font-weight: normal;
		padding: 7px 0 7px 30px;
		position: relative;
		font-size: 1.6rem;
		line-height: 1.75em;
	}
	.post ol > li:before {
		counter-increment: number;
		content: counter(number);
		position: absolute;
		left: 0px;
		top: 10px;
		border-radius: 5px;
		text-align: center;
		font-size: 1.6rem;
		font-weight: normal;
		color: white;
		border-radius: 10px;
		width: 24px;
		height: 24px;
		line-height: 22px;
		background: #2e8577;
	}
	.post hr {
	}
	.post ul {
		margin-bottom: 30px;
	}
	.post ul > li {
		font-weight: normal;
		padding: 7px 0 7px 15px;
		position: relative;
		font-size: 1.6rem;
		line-height: 1.75em;
	}
	.post ul > li:before {
		content: "●";
		color: #2e8577;
		position: absolute;
		left: 0px;
		top: 7px;
		font-size: 1rem;
	}
	blockquote {
		position: relative;
		padding: 25px;
		box-sizing: border-box;

		margin: 25px auto;
		background: #f4f2ee;
	}

	blockquote a {
		display: block;
		margin-top: 15px;
	}
	blockquote p:last-child {
		margin-bottom: 0;
	}
	.post table {
		margin: 30px auto;
		width: 100%;
	}
	.post table tr {
	}
	.post table th,
	.post table thead td {
		border: 1px solid #d9d9d9 !important;
	}
	.post table th {
		font-size: 1.6rem;
		background: #ebf1ec !important;
		font-weight: normal;
		text-align: center;
		padding: 20px;
	}
	.post table td {
		border: 1px solid #d9d9d9 !important;
		padding: 20px;
	}
	.wp-block-image :where(figcaption) {
		color: #0f2f7a;
		font-size: 1.4rem;
		font-weight: 500;
		letter-spacing: 0.06em;
		line-height: 1.5em;
	}
	.post .wp-block-image.size-full {
		margin: 10px auto;
	}
	.post .wp-block-button__link {
		display: block;
		text-align: center;
		color: #0f2f7a !important;
		font-size: 1.5rem;
		font-weight: 500;
		line-height: 1.5em;
		letter-spacing: 15%;
		padding: 15px 45px;
		text-decoration: none !important;
		position: relative;
		transition: 0.3s ease;
		background: none;
		border-radius: 30px;
		border: none;
		box-sizing: border-box;
		background: #fff;
		transition: 0.3s ease;
		width: 100%;
		position: relative;
		border: 2px solid #0f2e76;
	}
	.post .wp-block-button__link:after {
		content: "";
		display: block;
		position: absolute;
		right: 20px;
		top: 50%;
		background: url(../img/post-btn.png) 0 0 no-repeat;
		background-size: contain;
		width: 8px;
		height: 12px;
		margin-top: -6px;
	}
	.post .wp-block-buttons > .wp-block-button {
		margin-top: 27px;
		margin-bottom: 27px;
		min-width: 240px;
	}
	.post .wp-block-button__link:hover {
		opacity: 0.3;
	}
	.post .wp-block-buttons {
		justify-content: center;
	}
	.box-before-after {
		position: relative;
	}
	.box-before-after > div:nth-child(1) {
		position: relative;
	}
	.box-before-after > div:nth-child(1):before {
		content: "Before";
		color: white;
		font-size: 1.4rem;
		font-weight: 500;
		letter-spacing: 0.06em;
		position: absolute;
		left: 0;
		top: 10px;
		padding: 2px 6px;
		background: #0f2f7a;
	}
	.box-before-after > div:nth-child(1):after {
		content: "";
		background: url(../img/arrow.png) 0 0 no-repeat;
		background-size: contain;
		width: 39px;
		height: 61px;
		position: absolute;
		right: -38px;
		top: 50%;
		margin-top: -30px;
		z-index: 3;
	}
	.box-before-after > div:nth-child(2) {
		position: relative;
	}
	.box-before-after > div:nth-child(2):before {
		content: "After";
		color: white;
		font-size: 1.4rem;
		font-weight: 500;
		letter-spacing: 0.06em;
		position: absolute;
		left: 0;
		top: 10px;
		padding: 2px 6px;
		background: #d2004c;
	}
}