/*////////////////////////////////////////////////////////////////////////////*/

/*! [content/blog/archive] page.css */

/*////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	本文共通

------------------------------------------------------------------------------*/


/*	本文コンテナー
------------------------------------------------------------------------------*/

.archive-container > *:first-child {
	margin-top: 0;
}

.archive-container > *:last-child {
	margin-bottom: 0;
}


/*------------------------------------------------------------------------------

	HOME表示

------------------------------------------------------------------------------*/


/*	メッセージ
------------------------------------------------------------------------------*/

.message-box {
	--message-line-height: 1.8;
	--icon-size-lines: 3;
	--icon-gap: 1.5em;
	/**/
	font-size: 75%;
}

.message-box p svg {
	vertical-align: -.12em;
	width: 1em;
	height: 1em;
	margin: 0 .125em;
	fill: rgb(var(--color-text-p-rgb));
}


/*	おすすめカテゴリー
------------------------------------------------------------------------------*/

.recommended-box {
	margin: var(--space_4_3) 0;
}

.recommended-category {
	display: flex;
	flex-wrap: wrap;
	/**/
	margin: 0;
	padding: 0;
	line-height: 1.5;
	font-size: .75em;
}

.recommended-category-title {
	position: relative;
	display: flex;
	align-items: baseline;
	width: 100%;
	white-space: nowrap;
}

.recommended-category-title::after {
	content: '';
	flex: 1;
	width: 100%;
	height: 1px;
	margin-left: .5em;
	background: rgb(var(--color-text-p-rgb) / .5);
}

.recommended-category-item {
	margin: .5em .5em 0 0;
}

.recommended-category-item .btn {
	--btn-padding-x: .75em;
	--btn-padding-y: .5em;
	--btn-icon-gap: .5em;
}

.recommended-category-item .btn::after {
	display: none;
}


/*------------------------------------------------------------------------------

	記事一覧

------------------------------------------------------------------------------*/


/*	投稿カード
------------------------------------------------------------------------------*/

.posts-box .post {
	--onhover-box-border-color: var(--color-izumi-blue);
	--text-item-lines: 2;

	/* 【★】タクソノミーの囲み枠装飾高さ分を追加(最終行) */
	--text-height: calc(
		var(--text-title-height)
		+ var(--text-item-height) * var(--text-item-lines)
		+ var(--text-padding-top)
		+ var(--text-padding-bottom)
		+ calc(calc((var(--text-line-height) - 1) / 2 * 1em) * 2)
	);
}

.post-title.has-icon svg {
	fill: var(--color-izumi-blue);
}


/*	最新マーカー
------------------------------------------------------------------------------*/

.v-split + .archive-container .post.is-latest::before,
.v-split + .archive-container .post.is-latest::after {
	font-size: 75%;
}

.post.is-latest {
	position: relative;
}

.post.is-latest::before,
.post.is-latest::after {
	--size: 4em;
	/**/
	content: '';
	position: absolute;
	z-index: 9;
	left: -1rem;
	top: -1rem;
	width: var(--size);
	height: var(--size);
}

@keyframes rotate {
	from {
		box-shadow: 0 0 1px rgb(0 0 0 / .1), 0 2px 5px rgb(0 0 0 / .07);
		transform: rotate(0deg);
	}
	to {
		box-shadow: 0 0 1px rgb(0 0 0 / .1), 0 2px 5px rgb(0 0 0 / .07);
		transform: rotate(360deg);
	}
}

.post.is-latest::before {
	--bomb_svg: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M32%2C16c0-.765-.341-1.506-.934-2.031-.461-.408-.636-1.283-.367-1.836.346-.711.376-1.523.084-2.229-.293-.707-.892-1.262-1.643-1.522-.584-.202-1.083-.943-1.047-1.558.046-.788-.237-1.551-.778-2.091-.542-.542-1.312-.837-2.1-.779-.628.031-1.367-.461-1.569-1.042-.26-.745-.813-1.341-1.52-1.634-.707-.295-1.523-.267-2.24.08-.559.27-1.441.095-1.853-.366-1.055-1.18-3.015-1.181-4.067%2C0-.414.463-1.298.636-1.854.366-.715-.345-1.533-.374-2.239-.079-.706.293-1.26.889-1.52%2C1.634-.202.581-.943%2C1.067-1.568%2C1.042-.803-.057-1.559.237-2.101.779-.541.54-.824%2C1.303-.778%2C2.092.036.613-.463%2C1.354-1.047%2C1.557-.751.261-1.35.815-1.643%2C1.522-.292.706-.262%2C1.519.084%2C2.23.269.552.094%2C1.427-.366%2C1.835-.594.525-.935%2C1.267-.935%2C2.031s.341%2C1.506.934%2C2.031c.461.408.636%2C1.283.367%2C1.836-.346.711-.376%2C1.523-.084%2C2.229.293.707.892%2C1.262%2C1.643%2C1.522.584.202%2C1.083.943%2C1.047%2C1.558-.046.788.237%2C1.551.778%2C2.091.542.542%2C1.31.835%2C2.1.779.62-.024%2C1.367.46%2C1.569%2C1.042.26.745.813%2C1.341%2C1.52%2C1.634.705.293%2C1.523.265%2C2.24-.08.561-.268%2C1.441-.094%2C1.853.366.527.59%2C1.269.929%2C2.034.929s1.507-.339%2C2.033-.928c.414-.463%2C1.297-.636%2C1.854-.366.716.344%2C1.533.373%2C2.239.079.706-.293%2C1.26-.889%2C1.52-1.634.202-.581.936-1.067%2C1.568-1.042.802.059%2C1.559-.237%2C2.101-.779.541-.54.824-1.303.778-2.092-.036-.613.463-1.354%2C1.047-1.557.751-.261%2C1.35-.815%2C1.643-1.522.292-.706.262-1.519-.084-2.23-.269-.552-.094-1.427.366-1.835.594-.525.935-1.267.935-2.031Z%22%2F%3E%3C%2Fsvg%3E");
	/**/
	background: #F00;
	-webkit-mask-image: var(--bomb_svg);
	mask-image: var(--bomb_svg);
	animation: rotate 9s linear infinite;
}

.post.is-latest::after {
	content: '最新';
	text-align: center;
	line-height: var(--size);
	font-weight: bold;
	color: #FFF;
}

@media (max-width: 1023px) {

	.post.is-latest::before,
	.post.is-latest::after {
		font-size: 75%;
	}

/**/}

@media (max-width: 720px) {

	.post.is-latest::before,
	.post.is-latest::after {
		left: -.5rem;
		top: -.5rem;
	}

/**/}


/*	ページネーション
------------------------------------------------------------------------------*/

.v-split + .archive-container .pagination {
    grid-template-columns: 1fr 1fr;
}

.v-split + .archive-container .pagination .pagination-prev {
	grid-row: 1;
    grid-column: 1;
}

.v-split + .archive-container .pagination .pagination-next {
	grid-row: 1;
    grid-column: 2;
}

.v-split + .archive-container .pagination .pagination-pages {
	grid-row: 2;
    grid-column: 1 / -1;
}


/*	検索条件クリア
------------------------------------------------------------------------------*/

.clear-search-button {
	margin: 2em 0;
}

.clear-search-button svg {
	rotate: 45deg;
}