[railbro]

<div class="footer-columns">
	<ul class="footer_1">
		<li class="footer-item item_hover"><a href="#" class="footer-item">Продукты</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Документооборот</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Архив</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Электронная подпись HoReCa</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Маркировка</a></li>
		<li class="footer-item"><a href="#" class="footer-link">GLN</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Аутстаффинг</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Меркурий</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Факторинг</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Склад</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Территория</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Транспорт</a></li>
	</ul>
	<ul class="footer_2">
		<li class="footer-item item_hover"><a href="#" class="footer-item">Пресс-центр</a></li>
		<li class="footer-item item_hover"><a href="#" class="footer-item">Контакты</a></li>
		<li class="footer-item item_hover"><a href="#" class="footer-item">Вопрос-Ответ</a></li>
		<li class="footer-item item_hover"><a href="#" class="footer-item">Техподдержка</a></li>
		<li class="footer-item item_hover"><a href="#" class="footer-item">Полезные статьи</a></li>
	</ul>
	<ul class="footer_3">
		<li class="footer-item item_hover"><a href="#" class="footer-item">Способы оплаты</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Web-интерфейс</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Интеграция 1С</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Интеграция через API</a></li>
	</ul>
	<ul class="footer_4">
		<li class="footer-item item_hover"><a href="#" class="footer-item">Компания</a></li>
		<li class="footer-item"><a href="#" class="footer-link">О компании</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Партнеры</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Отзывы</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Лицензии</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Кейсы</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Акции</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Платформа</a></li>
		<li class="footer-item"><a href="#" class="footer-link">LERADATA</a></li>
		<li class="footer-item"><a href="#" class="footer-link">Лицензионный договор</a></li>
	</ul>
</div>

.footer-columns {
	display: flex;
}
.footer_1{
	order: 1;
}
.footer_2{
	order: 4;
}
.footer_3{
	order: 2;
}
.footer_4{
	order: 3;
}
@media (max-width:1000px) {
	.footer-columns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}
	ul, li{
		//width: auto;
		width: max-content;
	}
@media (max-width:1000px) {
	.footer-columns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}
	ul, li{
		//width: auto;
		width: max-content;
	}
	.footer_2{
		order: 3;
	}
	.footer_4{
		order: 3;
	}
}
}