@charset "UTF-8";


/* ================================================================================
KV
================================================================================ */
@media print, screen
{

#KV{	position: relative;	}

#KV picture
{
	position: absolute;
	top: 0;	left: 0;
	width: 100%;	height: 100%;
}
#KV > .inner
{
	display: flex;	justify-content: center;	align-items: center;
	height: calc(240 * var(--v));
}

#KV h1
{
	font-size: var(--fzv40);
	font-family: var(--NotoSerif);
	font-weight: 600;
	text-align: center;
	letter-spacing: 0.1em;

	text-shadow:
		0 0 1.0em white,
		0 0 1.0em white,
		0 0 1.0em white,
		0 0 1.0em white,
		0 0 1.0em white
		;
}

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

#KV h1{	font-size: var(--fzv30);	}

}


/* ================================================================================
reien jiin
================================================================================ */
@media print, screen
{

#reien > .inner
{
	/* padding: calc(40 * var(--v)) 0 0; */
	padding: 0;
}

#reien h2,
#jiin h2
{
	padding: 0.5em 1em;
	background: var(--Cgreen2);

	color: white;
	font-size: var(--fzv20);
	font-weight: 600;
	letter-spacing: 0.1em;
}
#jiin h2{	background: var(--Cpurple2);	}

#reien .postList,
#jiin .postList
{
	display: flex;	flex-wrap: wrap;
	gap: var(--pageP);
}
#reien .postItem,
#jiin .postItem
{
	width: calc((100% - 2 * var(--pageP))/3);

	/* border: 1px solid var(--Cgreen3); */
	border-radius: calc(10 * var(--v));
	box-shadow: var(--shadow0);
	overflow: hidden;
}
/* #jiin .postItem{	border: 1px solid var(--Cpurple1);	} */

#reien a,
#jiin a
{
	display: block;
	width: 100%;
}

#reien picture,
#jiin picture
{
	width: 100%;	aspect-ratio: 200/100;
}

#reien .textArea,
#jiin .textArea
{	padding: calc(10 * var(--v));	}

#reien .area,
#jiin .area
{
	margin-bottom: calc(5 * var(--v));
	font-size: var(--fzv14);
	font-weight: 600;
}

#reien .area span,
#jiin .area span
{
	display: inline-block;
	padding: 0.2em 0.4em 0.3em;
	background: red;
	border-radius: calc(4 * var(--v));
	
	color: yellow;
	font-size: var(--fzv12);
	font-weight: 500;
}


#reien h3,
#jiin h3
{
	margin-bottom: calc(10 * var(--v));
	color: var(--Cgreen2);
	font-size: var(--fzv18);
	font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1.3;
}
#jiin h3{		color: var(--Cpurple1);}

#reien ul,
#jiin ul
{
	display: flex;	flex-wrap: wrap;
	gap: calc(5 * var(--v));

}
#reien li,
#jiin li
{
	padding: 0.3em 1em 0.4em;

	background: var(--Cgray2);
	border-radius: calc(30 * var(--v));

	color: white;
	font-size: var(--fzv12);
	font-weight: 600;
}
#reien li[active]{	background: var(--Cgreen2);	}
#jiin li[active]{	background: var(--Cpurple1);	}




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

}



/* ======================================== end ======================================== */