.common-pagination {
	margin-top: 38px;
}

.common-pagination .pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;

	margin: 0;
	padding: 0;

	list-style: none;
}

.common-pagination .pagination li {
	margin: 0;
	padding: 0;
}

.common-pagination .pagination button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--c-txt-1);
	font-size: var(--fs-05);
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}

/* 當前頁 */
.common-pagination .pagination li.active button {
	background: var(--c-04);
	color: var(--c-09);
}

/* 一般頁碼 hover */
.common-pagination .pagination li:not(.active) button:hover {
	color: var(--c-04);
}

/* 箭頭 */
.common-pagination .pagination .page-arrow button {
	min-width: 28px;
	padding: 0;
	border-radius: 0;
	color: var(--c-txt-3);
	font-size: 20px;
}

/* 箭頭 hover */
.common-pagination .pagination .page-arrow button:hover {
	background: transparent;
	color: var(--c-04);
}

/* 第一頁 / 最後一頁隱藏箭頭，但保留位置 */
.common-pagination .pagination .is-hidden {
	visibility: hidden;
}

@media (max-width: 767px) {
	.common-pagination {
		margin-top: 28px;
	}

	.common-pagination .pagination {
		gap: 2px;
	}

	.common-pagination .pagination button {
		min-width: 34px;
		height: 34px;
		padding: 0 8px;
		font-size: var(--fs-06);
	}

	.common-pagination .pagination .page-arrow button {
		min-width: 26px;
		font-size: 18px;
	}
}