@charset "UTF-8";

/* ----------
one-col-layout
---------- */
.one-col-layout {
	background:#f9f8f4;
}
.one-col-layout > .inner{
	width:100%;
	max-width:1200px;
	margin:0 auto;

	display:flex;
	flex-wrap:wrap;
	gap:30px 4%;
}

.one-col-layout .main-content {
	width:100%;
	display:flex;
	flex-direction:column;
	gap:50px;

}

/* Wide Breakpoint */
@media screen and (max-width: 1200px) {
	.one-col-layout > .inner{
		width: calc(100% - 30px);
	}
}

/* SP */
@media screen and (max-width: 767px) {
	.one-col-layout .main-content {
		width:100%;
	}
}

/* ----------
two-col-layout
---------- */
.two-col-layout {
	background:#f9f8f4;
}
.two-col-layout > .inner{
	width:100%;
	max-width:1200px;
	margin:0 auto;

	display:flex;
	flex-wrap:wrap;
	gap:30px 4%;
}

/* ---- */
.two-col-layout .main-content {
	width:calc( 100% - (240px + 4%));
	min-height:100px;

	display:flex;
	flex-direction:column;
	gap:50px;

}

.two-col-layout .sidebar {
	width:240px;
	min-height:100px;

	display:flex;
	flex-direction:column;
	gap:50px;
}
.two-col-layout .sidebar .tit01{
	font-size:17px;
	border:none;
	padding-bottom:0;
	margin-bottom:0;
	font-weight:bold;
}


/* Wide Breakpoint */
@media screen and (max-width: 1200px) {
	.two-col-layout > .inner{
		width: calc(100% - 30px);
	}
}

/* SP */
@media screen and (max-width: 767px) {
	.two-col-layout .main-content {
		width:100%;
	}

	.two-col-layout .sidebar {
		width:100%;
	}
}

/* ----------
.blogLstSec
---------- */
.blogLstSec{
	display:flex;
	flex-direction:column;
	gap:50px;

}

/* ----------
.newsLstSec
---------- */

.newsLstSec{
	display:flex;
	flex-direction:column;
	gap:50px;

}

/* ---- */
.newsDetailBlock {
	background:#fff;
	padding:25px;
	border-radius:10px;

	display:flex;
	flex-direction:column;
	gap:30px;
}


/* ----------
blogList
---------- */
.blogList {
	display:flex;
	flex-wrap:wrap;
	gap:30px 3.5%;
}

/* ---- */
.blogList__item {
	width:calc( (100% - 7%) / 3);
	background:#fff;
	border-radius:10px;
	overflow:hidden;



}

/* 最初の2つだけ2列に */
.blogList__item:nth-child(1),
.blogList__item:nth-child(2) {
  width: calc((100% - 3.5%) / 2);
}

.blogList__item .blogList__thumb {
	position:relative;
}

.blogList__item .blogList__thumb img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;      /* 元画像比率でリサイズ */
    /* aspect-ratio: 16 / 9; 削除 */
    vertical-align: bottom;
}


.blogList__item .blogList__label {
	position:absolute;
	top:10px;
	right:10px;
	z-index:10;

	background:#AA9850;
	border-radius:4px;
	color:#fff;
	font-size:16px;
	padding:3px 10px;
}

/* ---- */
.blogList__item .blogList__body {
	padding:20px 25px;
	display:flex;
	gap:10px;
	flex-direction:column;
}

.blogList__item .blogList__body .blogList__date {
	font-family: "Jost", sans-serif;
	font-size: 0.9375rem; /* 15px */
	color:#153E0E;
}

.blogList__item .blogList__body .blogList__title {
	color:#153E0E;
	font-weight:bold;
	line-height:1.5;
}

.blogList__item .blogList__body .blogList__category {
}
.blogList__item .blogList__body .blogList__category span{
	display:inline-block;
	font-size: 0.875rem; /* 14px */
	color:#fff;
	background:#399D27;
	border-radius:100px;
	padding:2px 0.5em;
}


/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .example {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {

	/* ---- */
	.blogList__item ,
	.blogList__item:nth-child(1),
	.blogList__item:nth-child(2) {
		width:calc( (100% - 3.5%) / 2);
	}

	.blogList__item .blogList__body {
		padding:10px 12px;
		gap:6px;
	}
}


/* SP */
@media screen and (max-width: 550px) {

	.blogList__item .blogList__body .blogList__date {
		font-size: 14px;
	}
	.blogList__item .blogList__body .blogList__category span{
		font-size: 13px;
	}
}

/* SP */
@media screen and (max-width: 400px) {

	/* ---- */
	.blogList__item ,
	.blogList__item:nth-child(1),
	.blogList__item:nth-child(2) {
		width:100%;
	}
}


/* ----------  
newsList  
---------- */
.newsList {
  display: flex;
  flex-wrap: wrap;
  flex-direction:column;
  gap: 20px;
}

/* ---- */
.newsList__item {
  width: 100%;
  background: #fff;
  border-bottom:solid 1px #ccc;
  padding-bottom:20px;
}
.newsList__item a{
  display: flex;
  flex-wrap: wrap;
  flex-direction:column;
  gap: 15px;
}
.newsList__item .newsList__item__head{
	display:flex;
	gap:10px;
}
/* ---- */
.newsList__item .newsList__date{
}
.newsList__item .newsList__categorys{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
}

/* ---- */
.newsList__item .newsList__categorys span{
	background:#258C56;
	color:#fff;
	padding:2px 10px;
	border-radius:100px;
	font-size:0.8125rem; /* 13px 相当 */
}
.newsList__item .newsList__categorys span{
}


.newsList__item .newsList__title{
}


/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .newsList {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {
	/*
	.newsList__item,
	.newsList__item:nth-child(1),
	.newsList__item:nth-child(2) {
		width: calc((100% - 3.5%) / 2);
	}
	*/
	.newsList__item .newsList__item__head{
		flex-wrap:wrap;
	}
	/* ---- */
	.newsList__item .newsList__date{
		width:100%;
	}
	.newsList__item .newsList__categorys{
		width:100%;
	}
}

/* SP */
@media screen and (max-width: 550px) {
}

/* SP */
@media screen and (max-width: 400px) {
}


/* ----------
categoryLinksSec
---------- */
.categoryLinksSec {
}

.categoryLinksSec .inner {
	background:#fff;
	border-radius:10px;
	padding:20px;

	display:flex;
	gap:10px;
	flex-direction:column;
}

/* ---- */
.categoryLinks__tit {
	font-weight:bold;
	color:#258C56;
}

.categoryLinks__lst {
	display: flex;
	flex-wrap: wrap;   
	gap: 10px;          
	flex-direction: row; 
}
.categoryLinks__lst .item a {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #ddd;
  border-radius: 6px;
  text-decoration: none;
  color: #333;
  background: #fff;
  transition: background 0.2s, color 0.2s;
}

.categoryLinks__lst .item a:hover {
  background: #f3f3f3;
}

.categoryLinks__lst .item a span {
}

.categoryLinks__lst .item.is-active a {
  background: #2ea343;
  color: #fff;
  border-color: #2ea343;
}


/* ---------- */
.categoryLinksSec {
}
.categoryLinksSec .inner {
}

/* ---- */
.categoryLinksSec .archiveSearch {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	justify-content:flex-start;
}
.categoryLinksSec .archiveSearch .cat-column {
	width:400px;

	display:flex;
	flex-wrap:wrap;
	gap:10px;
	justify-content:flex-start;
}
.categoryLinksSec .archiveSearch .cat-column .tit {
	padding-top:2px;
	width:100px;
}
.categoryLinksSec .archiveSearch .cat-column .item {
	display:block;
	width:calc(100% - ( 100px + 10px) );
}
.categoryLinksSec .archiveSearch .cat-column .item select {
	display:block;
	width:100%;
	border-radius: 6px;
	background: #fff;
	border: 1px solid #e5e5e5;
	padding: 10px 50px 10px 10px;
	-webkit-appearance: auto; /* Safari, iOS向け */
	-moz-appearance: auto; /* Firefox向け */
	appearance: auto; /* 標準 */
}

.categoryLinksSec .archiveSearch .cat-column .item select:before {
  position: absolute;
  top: 12px;/*矢印の上からの位置*/
  right: 12px;/*矢印の右からの位置*/
  content: '';
  width: 7px;/*矢印の横幅*/
  height: 7px;/*矢印の縦幅*/
  border-top: 2px solid #4e7654;/*矢印の線の太さと色*/
  border-left: 2px solid #4e7654;/*矢印の線の太さと色*/
  transform: rotate(-135deg);/*矢印を回転*/
  pointer-events: none;/*矢印部分をクリックできるようにする*/
}


.categoryLinksSec .archiveSearch .btn-column .item button {
	display: inline-block;
	cursor: pointer;
	background: #fff;
	border: 1px solid #e5e5e5;
	padding: 9px 20px;
	border-radius: 5px;
}




/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .example {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {

	.categoryLinksSec .inner {
		padding:10px;
	}
	.categoryLinks__lst {
	  gap: 5px;              /* 要素間の間隔 */
	}
	.categoryLinks__lst .item a {
	  padding: 5px 6px;
	  border-radius: 6px;
	  font-size:14px;
	}

	.categoryLinksSec .archiveSearch .cat-column {
		width:calc( 100% - ( 80px + 10px)  );
	}
	.categoryLinksSec .archiveSearch .btn-column {
		width:80px;
	}
}

@media screen and (max-width: 550px) {
	.categoryLinksSec .archiveSearch .cat-column .tit {
		display:none;
	}
	.categoryLinksSec .archiveSearch .cat-column .item {
		width:100%;
	}
}

/* ----------
sidebarBlogList
---------- */
.sidebarBlogListBox{
	background:#fff;
	padding:15px;
	border-radius:10p;

	display: flex;
	gap: 10px;   
	flex-direction: column;
}
.sidebarBlogList {
	border-top:solid 1px #D9D9D9;
	padding-top:10px;
  
	display: flex;
	gap: 10px;          
	flex-direction: column;
}

/* ---- */
.sidebarBlogList__item {
	border-bottom:solid 1px #D9D9D9;
	padding-bottom:10px;
}
.sidebarBlogList__item:last-child {
	border-bottom:none;
	padding-bottom:0px;
}

.sidebarBlogList__item a {
	display:flex;
	flex-wrap:wrap;
	gap:30px 6%;
}

.sidebarBlogList__thumb {
	width:30%;
}

.sidebarBlogList__thumb img {
	width:100%;
	vertical-align:bottom;
}


.sidebarBlogList__body {
	width:64%;
	display: flex;
	gap: 10px;
	flex-direction:column;
}

.sidebarBlogList__body .sidebarBlogList__title {
	line-height:1.2;
	font-size:14px;
}

.sidebarBlogList__body .sidebarBlogList__category {
}

.sidebarBlogList__body .sidebarBlogList__category span {
	font-family: "Jost", sans-serif;
	display:inline-block;
	font-size: 0.72rem;
	color:#fff;
	background:#399D27;
	border-radius:100px;
	padding:2px 0.5em;
}


/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .example {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {
	.sidebarBlogList {
		padding:10px;
	}
}

/* ----------
rankList
---------- */
.sidebarBlogList.rankList{
}
.sidebarBlogList.rankList .sidebarBlogList__item{
	position:relative;
}
.sidebarBlogList.rankList .sidebarBlogList__item:before{
	content:"";
	display:block;
	width:18px;
	height:18px;
	background:#AA9850;
	color:#fff;
	border-radius:100px;
	position:absolute;
	top:-6px;
	left:-5px;
	font-size:12px;
	text-align:center;
	font-weight:bold;
	vertical-align:bottom;

	display: flex;
	gap: 0px;          
	justify-content:center;
	align-items:center;
}
.sidebarBlogList.rankList .sidebarBlogList__item:nth-child(1):before{ content:"1"; }
.sidebarBlogList.rankList .sidebarBlogList__item:nth-child(2):before{ content:"2"; }
.sidebarBlogList.rankList .sidebarBlogList__item:nth-child(3):before{ content:"3"; }
.sidebarBlogList.rankList .sidebarBlogList__item:nth-child(4):before{ content:"4"; }
.sidebarBlogList.rankList .sidebarBlogList__item:nth-child(5):before{ content:"5"; }

@media screen and (max-width: 767px) {
		width:25px;
		height:26px;
		top:-6px;
		left:-5px;
		font-size:17px;
	}
}


/* ----------
sidebarCategoryLinks
---------- */

.sidebarCategoryLinks{
	background:#fff;
	padding:15px;
	border-radius:10p;

	display: flex;
	gap: 10px;          
	flex-direction: column;
}


/* ---- */
.sidebarCategoryLinks__lst {
	border-top:solid 1px #D9D9D9;
	padding-top:10px;
	display: flex;
	gap: 10px;          
	flex-direction: column;
}

.sidebarCategoryLinks__lst .item {
	padding-bottom:10px;
	border-bottom:solid 1px #D9D9D9;
	font-size: 0.9rem;
}

.sidebarCategoryLinks__lst .item:last-child {
	padding-bottom:0px;
	border-bottom:none;
}

.sidebarCategoryLinks__lst .item a {
	display:block;
	font-weight:bold;
}

.sidebarCategoryLinks__lst .item a span {
	font-family: "Jost", sans-serif;
}

/* ---- */
.sidebarCategoryLinks__lst .item.is-active a {
}


/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .example {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {


}


/* ----------
blogDetailSec
---------- */
.blogDetailSec {
}

/* ---- */
.blogDetailBlock {
	background:#fff;
	padding:25px;
	border-radius:10px;

	display:flex;
	flex-direction:column;
	gap:30px;
}

/* ---- */
.blogDetailBlock__header {

	display:flex;
	flex-direction:column;
	gap:20px;
}

.blogDetailBlock__header .blogDetailBlock__category {
}

.blogDetailBlock__header .blogDetailBlock__category a{
	display: inline-block;
    font-size: 0.875rem;
    color: #fff;
    background: #399D27;
    border-radius: 100px;
    padding: 2px 0.5em;
}

/* ---  */
.blogDetailBlock__header .tit01 {
}

.blogDetailBlock__header .blogDetail--date {
	text-align:right;
}

/* ---- */
.blogDetailBlock__content {
	display:flex;
	flex-direction:column;
	gap:40px;
}

.blogDetailBlock__content p {
}

.blogDetailBlock__content h2 {
	font-weight:bold;
	font-size:32px;
	color:#258C56;
}

.blogDetailBlock__content h3 {
  position: relative;
  background: #f9f8f4; /* 背景色 */
  border-radius: 10px;
  padding: 12px 16px 12px 28px;
  font-weight: bold;
  font-size: 1.1rem;
  color: #333;
  font-size:20px;
  color:#444444;
}

.blogDetailBlock__content h3::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 24px;
  background: #2ea343; /* 緑バー */
  border-radius: 3px;
}


.blogDetailBlock__content h4 {
	font-weight:bold;
}


.blogDetailBlock__content ul:not(.cmsPrevNext) {
	list-style:disc;
	margin-left:2em;
}

.blogDetailBlock__content ul li {
}

.blogDetailBlock__content ol {
	list-style:decimal;
	margin-left:2em;
}

.blogDetailBlock__content ol li {
}

.blogDetailBlock__content img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}
.blogDetailBlock__content a {
	text-decoration:underline;
	color:#0000ee;
}

/* ---- */
.blogDetailBlock__content .cmsPrevNext {
}

.blogDetailBlock__content .cmsPrevNext li {
}

.blogDetailBlock__content .cmsPrevNext li a {
}


/* Wide Breakpoint */
@media screen and (max-width: 1100px) {
  .example {
    width: calc(100% - 30px);
  }
}

/* SP */
@media screen and (max-width: 767px) {
	/* ---- */
	.blogDetailBlock {
		padding:10px;
	}

	.blogDetailBlock__content {
		gap:25px;
	}


	.blogDetailBlock__content h2 {
		font-size:23px;
	}

	.blogDetailBlock__content h3 {
	  font-size:18px;
	}

}
/* SP */
@media screen and (max-width: 500px) {
	/* ---  */
	.blogDetailBlock__header .tit01 {
		font-size:20px;
		font-weight:bold;
	}
}


/* ----------
blogDetail-index
---------- */
#blogDetail-index{
	background:#F9F8F4;
	padding:25px;
	border-radius:5px;
}
.table-of-contents-title{
	color:#153E0E !important;
	font-size:1rem !important;
	margin-bottom:17px;
}

.table-of-contents ol {
	list-style: decimal;
	font-size:1rem;
	margin-left:1rem;
}

.table-of-contents ul {
	list-style: square;
	padding-left: 1em;
	font-size:1rem;
}

.table-of-contents ol >li {
	padding-bottom:17px;
	margin-bottom:17px;
	border-bottom:solid 1px #D9D9D9;

}
.table-of-contents ol >li:last-child {
	padding-bottom:0;
	margin-bottom:0;
	border:none;
}


.table-of-contents ul a,
.table-of-contents ol a{
	color:#153E0E !important;
}
.table-of-contents .toc-h2 {
  font-weight: bold;
  color: #1a7738;
}

.table-of-contents .toc-h3 {
  color: #1a7738;
}

.table-of-contents .toc-h4 {
  color: #444;
}


/* ----------
blogDetailSec
---------- */
.cmsPrevNext {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	padding: 0;
	list-style: none;
	padding:20px 0;
	border-top:solid 1px #DDDDDD; 
	border-bottom:solid 1px #DDDDDD; 

	margin-top:50px;
}
.cmsPrevNext ul {
	list-style:none;
	margin-left:0 !important;
}

.cmsPrevNext li::marker {
  content: none;            /* モダンな書き方 */
}

/* 左・右ボタンに最小幅を与えて、非表示時も空間を確保 */
.cmsPrevNext--prev,
.cmsPrevNext--next {
  min-width: 100px; /* アイコン＋テキストの想定幅に応じて調整 */
}

/* 中央リンクを中央に保つ */
.cmsPrevNext--list {
  flex: 1;
  text-align: center;
}

/* 中央リンクのa */
.cmsPrevNext--list a {
  display: inline-block;
  font-weight: 500;
  text-align: center;
  padding: 0 12px;
  color: #2ea343;
  text-decoration: none;
}

.cmsPrevNext--prev a span ,
.cmsPrevNext--next a span {
	padding:4px 0;
	display:inline-block;
}
.cmsPrevNext--prev a span {
	background:url(../img/cmsPrevNext--prev.png) no-repeat left center;
	background-size:auto 100%;
	padding-left:40px
}
.cmsPrevNext--next a span {
	background:url(../img/cmsPrevNext--next.png) no-repeat right center;
	background-size:auto 100%;
	padding-right:40px
}


/* SP */
@media screen and (max-width: 767px) {
	.cmsPrevNext ul {
		margin-left:0 !important;
	}

	/* 左・右ボタンに最小幅を与えて、非表示時も空間を確保 */
	.cmsPrevNext--prev,
	.cmsPrevNext--next {
	  min-width: 100px; /* アイコン＋テキストの想定幅に応じて調整 */
	}

	/* 中央リンクを中央に保つ */
	.cmsPrevNext--list {
	  flex: 1;
	  text-align: center;
	}

	/* 中央リンクのa */
	.cmsPrevNext--list a {
	  padding: 0 12px;
	  font-size:14px;
	}

	.cmsPrevNext--prev a span ,
	.cmsPrevNext--next a span {
		padding:4px 0;
	}
	.cmsPrevNext--prev a span {
		background-size:auto 30px;
		padding-left:40px
	}
	.cmsPrevNext--next a span {
		background-size:auto 30px;
		padding-right:40px
	}



}
@media screen and (max-width: 600px) {

	/* 左・右ボタンに最小幅を与えて、非表示時も空間を確保 */
	.cmsPrevNext--prev,
	.cmsPrevNext--next ,
	.cmsPrevNext--list {
		font-size:13px;
	}
	.cmsPrevNext--prev a span {
		background-size:auto 90%;
		padding-left:30px
	}
	.cmsPrevNext--next a span {
		background-size:auto 90%;
		padding-right:30px
	}

}



.pagination{
}
.pagination ul{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:10px;
}
 .pagination ul li{
}
 .pagination ul li > span,
 .pagination ul li > a{
	font-family: "Jost", sans-serif;
	font-size:22px;
	background:#fff;
	border:solid 1px #ccc;
	border-radius:100px;
	width:50px;
	height:50px;

	display:flex;
	justify-content:center;
	align-items:center;
}
 .pagination ul li.active > span{
	 background:#399D27;
	 border-color:#399D27;
	 color:#fff;
 }
 .pagination ul li.page-right > a{
	 background:none;
	 border:none;
 }

 /* スマホ用調整 */
@media screen and (max-width: 767px) {
    .pagination ul {
        /* gap を少し狭めるのもアリ */
        gap: 8px;
    }
    .pagination ul li {
        flex: 0 0 auto;    /* 固定サイズで折り返しさせる */
        margin-bottom: 10px;
    }
    .pagination ul li > span,
    .pagination ul li > a {
        /* 必要であれば固定 width を解除して padding に */
        width: auto;
        height: auto;
        min-width: 40px;
        min-height: 40px;
        padding: 0 12px;
        font-size: 20px;
    }
}
