.category-chapter-card {
	width: 100%;
	background-color: var(--white);
	border-radius: var(--rounded-2xl);
	box-shadow: var(--shadow);
}

.inner-cc {
	margin-top: 24px;
}

.lists-category-chapter {
	--col: 3;
	--gap-x: 32px;
	--gap-y: 10px;
	width: auto;
	min-width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: stretch;
	margin: 0 calc(var(--gap-x) / -2) calc(var(--gap-y) * -1);
}

.lists-category-chapter .item-category-chapter {
	width: calc(100% / var(--col));
	padding: 0 calc(var(--gap-x) / 2);
	margin-bottom: var(--gap-y);
}

.inner-category-chapter {
	width: 100%;
	height: 100%;
	padding: 11px 16px;
	display: flex;
	align-items: center;
	font-size: var(--text-md);
	border: 2px solid var(--gray);
	border-radius: var(--rounded-md);
	background-color: var(--transparent);
}

.inner-category-chapter:hover {
	border-color: var(--orange);
	font-weight: 700;
	color: var(--orange);
	background-color: var(--orange-25);
}

.inner-category-chapter .label-category-chapter {
	width: calc(100% - 32px);
	padding-left: 12px;
	line-height: var(--lineheight-s);
}

.inner-category-chapter .icon-category-chapter {
	width: 32px;
	height: 32px;
	margin-top: -2px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.inner-category-chapter .icon-category-chapter img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media all and (min-width: 601px) {
	.category-chapter-card {
		padding: 40px;
	}
}

@media all and (max-width: 1199px) {
	.lists-category-chapter {
		--gap-x: 8px;
		--gap-y: 8px;
	}
}

@media all and (max-width: 900px) {
	.lists-category-chapter {
		--col: 2;
	}
}

@media all and (max-width: 600px) {
	.category-chapter-card {
		padding: 26px;
	}

	.lists-category-chapter {
		--col: 1;
	}
}