@charset "UTF-8";
.lower{
	background: linear-gradient(210deg, #F5F7FA 0%, #F8DA87 70%, #FFFAA0 100%);
}

#info{
	position: relative;
	z-index: 25;
}
#info .inner{
	position: relative;
}
.filter__lists li,
.cat .tag{
	position: relative;
	border: 1px solid #707070;
}
.filter__lists li:not(.is-active):not(.current)::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--sage);
	mix-blend-mode: multiply;
	transition: opacity .3s;
}
.filter__lists li{
		display: flex;
		justify-content: center;
		align-items: center;
		border-right:none;
}
.filter__lists li:last-child{
	border: 1px solid #707070;
}
.block .cat{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

/*------------------------
基本
------------------------*/
/* PC */
@media screen and (min-width:768px) {
	.lower{
	padding-bottom: 180px;
	}
	#info{
		padding-top: 50px;
	}
	#info .inner{
		max-width: 1180px;
		margin: 0 auto;
	}
	/*カテゴリ*/
	.filter{
		position: absolute;
		left: 0;
		top: -90px;
	}
	.filter__lists{
		display: flex;
	}
	.filter__lists li{
		cursor: pointer;
		padding: 10px;
		height: 32px;
		min-width:87px;
	}
	.filter__lists li:hover::before{
			opacity: 0;
	}
}
/* SP */
@media screen and (max-width:767px) {
	.lower{
	padding-bottom:25.6vw;
	}
	#info{
		padding:10.66vw 2.56vw 0;
	}
	#info .inner{
	}
	/*カテゴリ*/
	.filter{
		display: none;
	}

}
/*------------------------
記事
------------------------*/
#info #info .block-wrap .block h2{
	transition: color .3s;
}
#info .block-wrap .block .day{
	color: var(--olive);
	font-weight: bold;
	display: block;
	letter-spacing: 0.05em;
	border-bottom: 1px solid var(--olive);
	line-height: 1.3;
}
#info .block-wrap .block .img{
	overflow: hidden;
}
#info .block-wrap .block .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
  transition: transform .3s ease 0s;
}
/* PC */
@media screen and (min-width:768px) {
	#info .block-wrap{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: clamp(20px, 4.4915%, 53px);
		row-gap: 60px;
		margin: 0 auto;
	}
	.list li {
		min-width: 0;
	}
	#info .block-wrap .block .img{
		width: 100%;
		height: 257px;
		border-radius: 45px;
		margin-bottom: 40px;
	}
	#info .block-wrap .block a:hover .img img {
	transform: scale(1.05, 1.05);
	}
	#info .block-wrap .block h2{
		font-size: 17px;
		margin-bottom: 22px;
	}
	#info .block-wrap .block a:hover h2{
		color: var(--green);
		}
	#info .block-wrap .block .day{
		font-size: 18px;
		margin-bottom: 20px;
	}
	.block .cat .tag{
		min-width:87px;
		height: 30px;
		font-size: 14px;
		padding: 0 10px	;
	}
}
/* SP */
@media screen and (max-width:767px) {
	#info .block-wrap{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 8.2vw 5.128vw;
		align-items: stretch;
	}
	#info .block-wrap .block .img{
		width: 100%;
		aspect-ratio: 175 / 130;
		border-radius:5.13vw;
		margin-bottom:5.9vw;
	}
	#info .block-wrap .block h2{
		font-size:3.33vw;
		margin-bottom:5.9vw;
	}
	#info .block-wrap .block .day{
		font-size: 3.07vw;
		margin-bottom:4.1vw;
	}
	.block .cat .tag{
		min-width:17.9vw;
		height:6.67vw;
		font-size:2.56vw;
		padding: 0 2.56vw	;
	}
}
/*------------------------
ページャー
------------------------*/
#pager-bottom{
	font-weight: bold;
	color: var(--sage);
	display: flex;
	flex-wrap: wrap;
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
	background-color: var(--bg1);
	mix-blend-mode: multiply;
}
#pager-bottom li{
	line-height: 1;
	display: flex;
	align-items: center;
}
#pager-bottom li a{
	display: flex;
	color: var(--sage);
	align-items: center;

}
#pager-bottom .current_page{
	color: var(--green);
}

#pager-bottom li.next a,
#pager-bottom li.prev a {
	position: relative;

}
#pager-bottom li a,
#pager-bottom .current_page{
		padding: 3px 0 2px;
}
#pager-bottom li.next a::after,
#pager-bottom li.prev a::before {
	content: "";
	display: block;
	width: 21px;
	height: 13px;
	background: url("/nishiogi-koukashita/img/pc/common/arrow_tri_green.svg") no-repeat center / contain;
}
#pager-bottom li.prev a::before {
	transform: scaleX(-1);
}
#pager-bottom li.prev.none span,
#pager-bottom li.next.none span {
	transition:background-color .3s ease;
	display: block;
	width: 21px;
	height: 13px;
	background-color: var(--sage);
	mask: url("/nishiogi-koukashita/img/pc/common/arrow_tri_green.svg") center / contain no-repeat;
	-webkit-mask: url("/nishiogi-koukashita/img/pc/common/arrow_tri_green.svg") center / contain no-repeat;
}
#pager-bottom li.prev span {
	transform: scaleX(-1);
}

/* PC */
@media screen and (min-width:768px) {
	#pager-bottom {
		margin-top: 95px;
		padding: 6px 13px;
		font-size: 18px;
		gap: 8px 10px;
		box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.18);
	}

	#pager-bottom li a:hover{
			color: var(--green);
	}
	#pager-bottom li.next{
		margin-left: 24px;
	}
	#pager-bottom li.prev{
		margin-right: 24px;
	}
}
/* SP */
@media screen and (max-width:767px) {
	#pager-bottom {
		max-width: 94.88vw;
		margin-top:13.8vw;
		padding: 1.53vw 13vw;
		font-size: 4.61vw;
		gap: 2vw 2.56vw;
		box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.18);
		position: relative;
	}
	#pager-bottom li a,
	#pager-bottom .current_page{
			padding: 1vw 0 .77vw;
	}
	#pager-bottom li.next,
	#pager-bottom li.prev{
		position:absolute;
		top:50%;
		transform: translateY(-50%);
	}	
	#pager-bottom li.next{
		right:3.33vw;
	}
	#pager-bottom li.prev{
		left:3.33vw;
	}
	#pager-bottom li.next a::after,
	#pager-bottom li.prev a::before,
	#pager-bottom li.prev.none span,
	#pager-bottom li.next.none span {
		width: 4.62vw;
		height: 2.82vw;
	}
}
/*------------------------
header
------------------------*/
/* PC */
@media screen and (min-width:768px) {
}
/* SP */
@media screen and (max-width:767px) {
}
/*------------------------
header
------------------------*/
/* PC */
@media screen and (min-width:768px) {
}
/* SP */
@media screen and (max-width:767px) {
}