@charset "utf-8";

/* ページネーションスクリプト「wakebun」 CSS */

/* -------------------- */
/* カスタム用色変更欄 */
/* -------------------- */
.wbstyle {
	--text-color: #818181; /* メイン文字色 */
	--pale-text-color: #b8b8b8; /* ↑よりちょっと薄い文字色と枠線など */
	--white-text-color: #fefefe; /* 濃い背景に乗せる白文字 */
	--btn-bg-color: #fefefe; /* ボタンの背景色 */
	--active-color: #92d9e6; /* アクティブなボタンの背景色 */
	--anchormargin: 70px; /* スクロール用アンカーの上の余白(ページ上部に戻る位置の調整) */


/* スクロール用アンカーの上の余白 */
	scroll-margin-top: var(--anchormargin);

/* 上のページ数案内の装飾 */
.pnavi {
	margin: 1rem 2rem;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--pale-text-color);
}
.pnavinow::before {
	content: 'Page'; /* ページ数案内の先頭のテキスト */
	margin-right: 0.8rem;
}
.pnaviall::before {
	content: '/'; /* ページ数案内の仕切りの記号 */
	margin: 0 0.5rem;
}

/* 下のページリストの装飾 */
.plistarea {
	margin: 2rem 1rem;
	padding: 0;
	line-height: 1;
	display: flex;
	justify-content: center;
}

.plistul {
	margin: 0;
	padding: 0;
	width: fit-content;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

/* ページリストのそれぞれのボタンの装飾 */
.plistul li {
	display: grid;
	place-items: center;
	padding: 0.2rem 0.5rem;
	min-width: 35px;
	height: 35px;
	font-size: 0.9rem;
	color: var(--text-color);
	background-color: var(--btn-bg-color);
	border: 1px solid var(--pale-text-color);
	margin: 0 -1px -1px 0;
	cursor: pointer;
}

/* マウスオーバーとアクティブ状態の番号の装飾 */
.plistul li:hover,.plistnum.active {
	background-color: var(--active-color);
	color: var(--white-text-color);
}

/* hideクラスが追加されたときページやボタンを非表示 */
.wbpage.hide,.plistul li.hide { display: none;}

} /* wbstyleクラスの装飾の終わり */