.ka-view {
	width: 100%;
	height: 100%;
}

.ka-nav {
	width: 100%;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;

	.title {
		display: flex;
		align-items: center;
		flex-direction: row;

		img {
			width: 30px;
			height: 30px;
		}

		.title-content {
			margin: 0 0.5rem;
		}
	}
}

.ka-menu {
	top: 0;
	left: 0;
	width: 300px;
	height: 100%;
	position: fixed;
	transform: translateX(-100%);
	background-color: var(--nav-color);
	transition: transform 0.3s ease-in-out;

	&.open {
		transform: translateX(0);
	}

	@media (max-width: 640px) {
		width: 100%;
	}
}