.JDpagination {
	display: flex;
	justify-content: inherit;

	// ⭐ Modifiers ️
	&-wrap {
		&--text-large {
			font-size: $typho-huge;
		}

		&--align-center {
			justify-content: center;
		}

		&--prev-hidden {
			.JDpagination__btn-prev {
				display: none;
			}
		}
	}

	&>li {
		margin: 0 $pagination-li-margin;
		border-radius: $pagination-li-radius;

		//  👍 a태그 눌러야 페이지 리턴이 발동함
		a {
			display: inline-block;
			height: $pagination-li-height;
			line-height: $pagination-li-height;
			padding: 0 $pagination-li-padding;
			background-color: $grey-level1;
			color: $html-color;
			border-radius: $standard-border-radius;

			&:hover {
				background-color: $pagination-li-bg;
				color: white;
			}
		}

		&:hover {
			cursor: pointer;
			background-color: $pagination-li-bg-hover;
		}
	}

	&__li {
		&--active {
			a {
				background-color: $pagination-active-bg !important;
				color: $primary-color-on !important;
			}
		}
	}

	&__a {
		color: $html-color;

		&--active {
			opacity: 1;
		}
	}

	&>&__btn {
		&--disabled {
			display: none;

			&+li {
				margin-left: 0;
			}
		}

		&-prev {
			margin-left: 0;

			&__a {
				color: $html-color;
				opacity: 1;
			}
		}

		&-next {
			margin-right: 0;

			&__a {
				color: $html-color;
				opacity: 1;
			}
		}
	}

	// next && prev Btn
	&>li:first-child,
	li:last-child {
		opacity: 1;
	}
}