* {
	margin: 0;
	padding: 0;
}

body {
	background: #ccc;
	padding: 20px;	
}

#signup {
	background:#fff;
	border:1px solid #222;
	border-radius: 5px;
	padding: 20px;
	width: 400px;	
	margin:30px auto;
}
		
#signup fieldset {
	border: 1px solid #ccc;
	margin-bottom: 30px;
}
		
#signup legend {
	font-size: 16px;
	font-weight: bold;
	padding-left:5px;
	padding-bottom: 10px;	
}

#signup ul li {
	line-height: 30px;
	list-style: none;
	padding: 5px 10px;
	margin-bottom: 2px;
}
			
#signup button {	
	border: 1px solid #222;
	border-radius: 20px;
	display: block;
	font-size: 16px;
	letter-spacing: 1px;
	margin: auto;
	padding: 7px 25px;
}

#signup label {
	float: left;  /* 왼쪽으로 배치 */
	font-size: 13px;  /* 글자 크기 - 13px */
	width: 110px;  /* 너비 - 110px */
}

#signup input:not([type=radio]) {  /* 가상 선택자를 사용해 간단히 줄일 수 있음 */
	border: 1px solid #ccc;  /* 텍스트 필드 테두리 지정 */
	border-radius: 3px;  /* 텍스트 필드 모서리를 둥글게 지정 */
	font-size: 13px;  /* 텍스트 필드 안의 글자 크기 지정 */
	padding: 5px;  /* 텍스트 필드와 내용 사이의 패딩 지정 */
	width: 200px;  /* 텍스트 필드 너비 지정 */
}					

#signup input[required] {  /* 필수 입력 필드의 스타일 */
	border:1px red solid;
}

#signup input[readonly] {  /* 읽기 전용 필드의 스타일 */
	border:none;
}

#signup fieldset:last-of-type {  /* 마지막 fieldset의 스타일 */
  border:none;  /* 테두리 없앰 */
  margin-bottom:0;  /* 아래쪽 마진 없앰 */
}

#signup button:hover {  /* #singup 하위에 있는 버튼에 마우스 올렸을 때 스타일 */
  background-color:#222;  /* 배경색 - 검정 계열색 */
  color:#fff;  /* 글자색 - 흰색 */
}