
main {
	display: flex;
	flex-direction: column;
}

.cMenu {
	flex: 0 0 auto;
	padding: 20px 10px;
}
.cMenu > nav {
	display: flex;
	justify-content: center;
	gap: 10px;
}
.cMenu > nav > a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	max-width: 240px;
}
.cMenu > nav > a:hover { opacity: .8; }
.cMenu .nav {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(8px, 2vw, 20px);
	padding: 10px;
	background-color: #415c42;
}
.cMenu .nav:hover { background-color: #7d9264; }
.cMenu .nav .name {
	white-space: nowrap;
	color: #f4f3ee;
	font-size: clamp(8px, 2vw, 16px);
}
.cMenu .nav .arrow {
	position: relative;
	display: inline-block;
	width: clamp(32px, 10vw, 80px);
	height: 1px;
	margin: 4.4px 0;
	border-radius: 9999px;
	background-color: #f4f3ee;
}
.cMenu .nav .arrow::before,
.cMenu .nav .arrow::after {
	content: "";
	position: absolute;
	top: calc(50% - 0.5px);
	right: 0;
	width: 8px;
	height: 1px;
	border-radius: 9999px;
	background-color: #f4f3ee;
	transform-origin: calc(100% - 0.5px) 50%;
}
.cMenu .nav .arrow::before { transform: rotate(45deg); }
.cMenu .nav .arrow::after { transform: rotate(-45deg); }
