.lws-vertical-nav{
	position: fixed;
	right:0px;
	top:140px;
	bottom:0px;
	width:40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	z-index: 65000;

	.vertnav-prec, .vertnav-suiv{
		flex:0 0 30px;
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size:30px;
		color:#666;
		transition: all 0.3s ease;
		cursor: pointer;

		&:hover{
			color:#366;
		}
	}

	.vertnav-item{
		flex:0 0 30px;
		width:30px;
		background-color:#eee;
		display: flex;
		cursor: pointer;
		overflow: hidden;
		transition: all 0.5s ease;

		&.current{
			background-color:#366;
			.vertnav-icon{
				color:#fff;
			}
		}

		.vertnav-icon{
			flex:0 0 30px;
			color:#666;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size:20px;
			transition: all 0.5s ease;
		}
		.vertnav-label{
			flex:0 0 220px;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size:14px;
			text-align: center;
			transition: all 0.5s ease;
		}

		&:hover{
			width:250px;
			margin-left:-220px;

			.vertnav-icon{
				color:#fff;
				background-color: #455;
			}
			.vertnav-label{
				color:#fff;
				background-color: #366;
			}
		}

		&.rang1{
			width:230px;
			margin-left:-200px;

			.vertnav-icon{
				color:#eee;
				background-color: #677;
			}
			.vertnav-label{
				color:#eee;
				background-color: #688;
			}
		}
		&.rang2{
			width:150px;
			margin-left:-120px;

			.vertnav-icon{
				color:#eee;
				background-color: #899;
			}
			.vertnav-label{
				color:#eee;
				background-color: #9aa;
			}
		}
	}

}