view {
		box-sizing: border-box;
	}
 
 
	.container {
 
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		bottom: 0;
		padding: 0 20px;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
 
		.title {
			width: 100%;
			height: 12%;
			font-size: 20px;
			font-weight: bold;
			padding-top: 20px;
 
			text:nth-child(2) {
				display: block;
				font-size: 14px;
				font-weight: normal;
				margin-top: 5px;
			}
		}
 
		.choose-avatar-row,
		.choose-nickname-row {
			width: 100%;
			height: 9%;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			padding: 10px 2px;
			font-size: 14px;
			border-top: 1px solid #ccc;
			border-bottom: 1px solid #ccc;
 
			.avatar-wrapper {
				width: 40px;
				height: 40px;
				margin: 0;
				padding: 0;
				margin-right: 10px;
 
				.avatar {
					width: 100%;
					height: 100%;
				}
			}
		}
 
		.choose-nickname-row {
			border-top: none;
 
			text {
				width: 45px;
				margin-right: 10px;
			}
		}
 
		.login-row {
			width: 100%;
			height: 30%;
			padding-top: 20px;
			display: flex;
 
			button {
				font-size: 14px;
				width: 30%;
				height: 40px;
				display: flex;
				align-items: center;
				justify-content: center;
				border-color: transparent;
				color: #07c160;
			}
 
			.inactive {
				color: #ccc;
			}
		}
	}