.member-value,
.member-list {
	width: 100%;
}
.member-value {
	font-weight: 600;
	letter-spacing: 4px;
	height: 4rem;
	font-size: 1.1rem;
	padding: 1rem;
	color: #ffffff;
	background-color: #2566f4;
	border: 3px solid transparent;
	transition: .3s ease-in-out;
	&::-webkit-input-placeholder {
		color: #ffffff;
	}
	&:hover {
		background-color: #2566f4;
		cursor: pointer;
		&::-webkit-input-placeholder {
			color: #ffffff;
		}
	}
	&:focus,
	&.open {
		box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
		outline: 0;
		color: #ffffff;
		background-color: #2566f4;
		&::-webkit-input-placeholder {
			color: #ffffff;
		}
	}
}
.member-list {
	list-style: none;
	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
	overflow: hidden;
	max-height: 0;
	transition: .3s ease-in-out;
	&.open {
		max-height: 320px;
		overflow: auto;
	}
	li {
		position: relative;
		height: 4rem;
		color: #ffffff;
		background-color: #2566f4;
		padding: 1rem;
		font-size: 1.1rem;
		display: flex;
		align-items: center;
		cursor: pointer;
		transition: background-color .3s;
		opacity: 1;
		&:hover {
			color: #2566f4;
			background-color: #ffffff;
		}	
		&.closed {
			max-height: 0;
			overflow: hidden;
			padding: 0;
			opacity: 0;
		}
	}
}