.term-image {
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.term-image img {
	width: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	position: relative;
	z-index: 1;
}

.term-image::before,
.term-image::after {
	content: '';
	position: absolute;
	z-index: 2;
}

.term-image::before {
	inset: 0;
	background: linear-gradient(180deg, #333 0%, rgba(255, 255, 255, 0) 100%);
}

.term-image::after {
	left: 0;
	bottom: -100%;
	width: 100%;
	height: 100%;
	background-color: #fff;
	transform: skewY(2.7deg);
	transform-origin: bottom right;
}

.archive-header {
	margin-block-start: 2rem;
	position: relative;
	z-index: 2;
}

.archive-header .archive-description {
	border-block-end: 1px solid #eee;
}

.archive-header .archive-description > * + * {
	margin-block-start: 1em;
}

.archive-header .archive-description > * iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16/9;
}

.archive-header .archive-description > * table {
	border: 1px solid #eee;
}

.archive-header .archive-description > * table th,
.archive-header .archive-description > * table td {
	border: 1px solid #eee;
	color: #111;
	font-size: 0.8125rem;
	overflow-wrap: break-word;
}

.archive-header .archive-description > * table th {
	padding: 5px;
	line-height: 2;
	background-color: #eee;
	font-weight: 700;
	text-align: center;
}

.archive-header .archive-description > * table td {
	padding: 4px 8px;
	line-height: 1.5;
	vertical-align: middle;
	min-width: 90px;
	background-color: #fff;
}

.archive-header .archive-description > * table td > *:last-child {
	margin-block-end: 0;
}

.archive-content {
	position: relative;
	z-index: 1;
}

.archive-content .archive-list {
	display: grid;
	position: relative;
	z-index: 2;
}

.archive-content .archive-list .archive-item > a {
	border: 1px solid #eee;
	display: grid;
	color: #111;
	font-weight: 700;
	text-decoration: none;
}

.archive-content .archive-list .archive-item > a .archive-item-thumbnail {
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.archive-content .archive-list .archive-item > a .archive-item-thumbnail img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.archive-content .archive-list .archive-item > a .archive-item-date {
	color: #767676;
	font-weight: 500;
}

.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::before,
.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::after {
	position: absolute;
	top: 1px;
	left: 1px;
}

.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::before {
	content: '';
	z-index: 2;
	background-color: #e22f26;
	clip-path: polygon(0 0%, 100% 0%, 0 100%);
}

.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::after {
	content: 'New';
	z-index: 3;
	display: grid;
	place-items: center;
	line-height: 1;
	color: #fff;
	font-weight: 700;
	rotate: -45deg;
}

.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a .archive-item-thumbnail .archive-item-thumbnail-inner {
	aspect-ratio: 16/9;
}

.archive-content .next-posts-link {
	display: flex;
	justify-content: center;
}

.archive-content .next-posts-link a {
	box-shadow: 0 4px 4px rgba(136, 136, 136, 0.25);
	padding: 14px;
	border: 1px solid #111;
	border-radius: 2em;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	width: 100%;
	max-width: 340px;
	color: #fff;
	background-color: #111;
	font-weight: 700;
	line-height: 1.4285714286;
	font-size: 0.875rem;
	text-decoration: none;
}

.archive-content .next-posts-link a svg {
	width: 5px;
	height: 10px;
	fill: #fff;
	transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
}

.archive-content .next-posts-link a:hover,
.archive-content .next-posts-link a:active {
	color: #111;
	background-color: #fff;
}

.archive-content .next-posts-link a:hover svg,
.archive-content .next-posts-link a:active svg {
	fill: #111;
}

.archive-content .next-posts-link + .wp-pagenavi {
	margin-block-start: 20px;
}

.archive-content .wp-pagenavi {
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	position: relative;
	z-index: 2;
}

.archive-content .wp-pagenavi .page,
.archive-content .wp-pagenavi .current {
	box-shadow: 0 4px 8px rgba(136, 136, 136, 0.25);
	margin-inline: 8px;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	line-height: 1;
	font-weight: 700;
	font-size: 1rem;
	position: relative;
	z-index: 2;
}

.archive-content .wp-pagenavi .page {
	border: 1px solid #111;
	color: #fff;
	background-color: #111;
	text-decoration: none;
	transition:
		color 0.3s,
		background-color 0.3s;
}

.archive-content .wp-pagenavi .page:hover,
.archive-content .wp-pagenavi .page:active {
	color: #111;
	background-color: #fff;
}

.archive-content .wp-pagenavi .current {
	border: 1px solid #eee;
	color: #111;
	background-color: #fff;
}

@media screen and (min-width: 980px) {

	.term-image img {
		height: 300px;
	}

	.archive-area {
		margin-inline: auto;
		padding-inline: 20px;
		max-width: 840px;
	}

	.archive-header .archive-title {
		font-size: 2.5rem;
		line-height: 1.4;
	}

	.archive-header .archive-description {
		padding-block: 36px;
		line-height: 1.5;
		font-size: 1rem;
	}

	.archive-content {
		padding-block: 80px;
	}

	.archive-content .archive-list {
		padding-inline-end: 16px;
		gap: 40px;
	}

	.archive-content .archive-list .archive-item > a {
		box-shadow: 16px 16px 0 #eee;
		grid-template-columns: 300px auto;
	}

	.archive-content .archive-list .archive-item > a .archive-item-thumbnail {
		border-inline-end: 1px solid #eee;
	}

	.archive-content .archive-list .archive-item > a .archive-item-thumbnail .archive-item-thumbnail-inner {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.archive-content .archive-list .archive-item > a .archive-item-thumbnail img {
		transition: 0.3s ease;
	}

	.archive-content .archive-list .archive-item > a .archive-item-text {
		padding-block: 32px calc(32px + 2.5rem);
		padding-inline: 32px;
		position: relative;
		z-index: 2;
	}

	.archive-content .archive-list .archive-item > a .archive-item-title {
		line-height: 1.5454545455;
		font-size: 1.375rem;
		transition: 0.3s ease;
	}

	.archive-content .archive-list .archive-item > a .archive-item-date {
		position: absolute;
		right: 32px;
		bottom: 32px;
		line-height: 1.5;
		font-size: 0.875rem;
	}

	.archive-content .archive-list .archive-item > a:hover .archive-item-thumbnail img,
	.archive-content .archive-list .archive-item > a:active .archive-item-thumbnail img {
		transform: scale(1.1);
		opacity: 0.8;
	}

	.archive-content .archive-list .archive-item > a:hover .archive-item-title,
	.archive-content .archive-list .archive-item > a:active .archive-item-title {
		color: #e22f26;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a {
		grid-template-columns: 100%;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::before {
		width: 6rem;
		height: 6rem;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::after {
		width: 4rem;
		height: 4rem;
		font-size: 1.125rem;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a .archive-item-thumbnail {
		border-inline-end: 0;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a .archive-item-thumbnail .archive-item-thumbnail-inner {
		position: static;
	}

	.archive-content .next-posts-link {
		margin-block-start: 60px;
	}

	.archive-content .wp-pagenavi {
		margin-block-start: 60px;
	}
}

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

	.term-image img {
		height: 200px;
	}

	.archive-area {
		padding-inline: 16px;
	}

	.archive-header .archive-title {
		font-size: 1.5rem;
		line-height: 1.3333333333;
	}

	.archive-header .archive-description {
		padding-block: 16px;
		line-height: 1.5;
		font-size: 0.875rem;
	}

	.archive-content {
		padding-block: 40px;
	}

	.archive-content .archive-list {
		padding-inline-end: 12px;
		gap: 24px;
	}

	.archive-content .archive-list .archive-item > a {
		box-shadow: 12px 12px 0 #eee;
		grid-template-columns: 100%;
	}

	.archive-content .archive-list .archive-item > a .archive-item-thumbnail {
		border-block-end: 1px solid #eee;
	}

	.archive-content .archive-list .archive-item > a .archive-item-thumbnail .archive-item-thumbnail-inner {
		height: 120px;
	}

	.archive-content .archive-list .archive-item > a .archive-item-text {
		padding-block: 16px;
		padding-inline: 16px;
	}

	.archive-content .archive-list .archive-item > a .archive-item-title {
		line-height: 1.5;
		font-size: 1rem;
	}

	.archive-content .archive-list .archive-item > a .archive-item-date {
		margin-block-start: 0.5em;
		line-height: 1.5;
		font-size: 0.75rem;
		text-align: right;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::before {
		width: 4rem;
		height: 4rem;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a::after {
		width: 2.4rem;
		height: 2.4rem;
		font-size: 0.875rem;
	}

	.home:not(.paged) .archive-content .archive-list .archive-item:first-child > a .archive-item-thumbnail .archive-item-thumbnail-inner {
		height: auto;
	}

	.archive-content .next-posts-link {
		margin-block-start: 40px;
	}

	.archive-content .wp-pagenavi {
		margin-block-start: 40px;
	}
}