@charset "UTF-8";

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

#archive{	padding-inline: var(--siteP);	}

.postListArea > .postList
{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 4rem 1.5rem;
}
.postList > li
{
	transition: 1s ease-in-out 0.1s;
	transition-property: opacity, filter;
}
.postList > li.ready
{
	opacity: 0;
	filter: blur(0.2rem);
}

.postList > li.noItem,
.postList > li.noMoreItem,
.postList > li.loadMoreItem
{	color: transparent;	}

.postList > li > a
{
	container-type: inline-size;
	display: flex;	flex-direction: column;
	gap: 1rem;

	height: 100%;

	padding-block: 0.5rem 1rem;
	background: var(--Cgray0);
	border-radius: 0.5rem;

	box-shadow: var(--shadow0);
}
.postList picture,
.postList .noImage
{
	display: block;
	width: 100%;	aspect-ratio: 1.4;
	background: white;

	overflow: hidden;
}
.postList picture img{	transition: 0.2s ease-in-out 0s;	}
.postList picture img:hover{	transform: scale(105%);	}

.postList .noImage{	background: var(--Cgray2);	}

.postList > li > a .box:nth-child(2){	padding-inline: 1rem;	}

.postList .date
{
	color: var(--Cgray2);
	font-size: 0.8rem;
}
.postList .title
{
	margin-top: 0.5rem;

	color: #cfca99;
	font-size: 1rem;
	line-height: 1.3;
}
.postList .category
{
	display: flex;	flex-wrap: wrap;	align-items: center;
	gap: 1rem;
	margin-top: 0.5rem;
}
.postList .category > li
{	
	color: #cfca99;
	font-size: 0.8rem;
}
.postList .category > li::before
{
	content: "# ";
	display: inline;
}


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

.postListArea > .postList
{
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(60 * var(--v)) calc(20 * var(--v));
}


}

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