.box-button {
	--arrow-width:  16px;
	--arrow-height: calc(var(--arrow-width) / 16 * 12);
	display: flex;
	justify-content: center;
	flex-shrink: 0;
	align-items: center;
	width: 48px;
	height: 48px;
	border: none;
	border-radius: 8px;
	background: white;
	transition: all 0.25s;
}
.box-button::after {
	content: '';
	display: block;
	width: var(--arrow-width);
	height: var(--arrow-height);
	background: url(/local/templates/2mebel/images/ims/icons/black_arrow.svg) no-repeat;
	background-size: var(--arrow-width) var(--arrow-height);
	filter: var(--filter-lred);
}

.box-button_rt {
	--arrow-width: 20px;
}
.box-button_rt::after {
	transform: rotateZ(-45deg);
}

.box-button-hover:hover .box-button,
.box-button:hover {
	background: var(--ims-lred);
}
.box-button-hover:hover .box-button::after,
.box-button:hover::after {
	filter: var(--filter-white);
}

@media (min-width: 476px) and (max-width: 767px) {
	.box-button {width: 40px; height: 40px;}
}



.box-button_fold {}
.box-button_fold::after {
	width: 12px;
	height: 8px;
	background: url(/local/templates/2mebel/images/ims/icons/black_angle.svg) no-repeat;
	background-size: 12px 8px;
}
.box-button_fold.active,
.accordion-open .box-button_fold {
	transform: rotateZ(-180deg);
}
@media (min-width: 476px) and (max-width: 767px) {
	.box-button_fold {width: 48px; height: 48px;}
}