#nav{
	list-style:none;
	height: 45px;
	padding: 6px 7px;
	margin-top: 50px;
	background: #7d7d7d;
	border-radius: 10px;
	text-align: center;
}

#nav li{
	float:left;
	position: relative;
	margin: 5px 10px;
	padding: 0;
	width: 200px;
}

/* padding: 15px 20px; 간격에서 10으로 할경우 간견이 생겨서 오버시 잘못 하면 오버 메뉴가 사라진다. 그래서 padding값 간격을 붙여놓아야 한다*/
#nav li a{
	display:block;
	font-size: 1em;
	font-weight: bold;
	padding: 10px 20px 15px 20px ;
	color: #e7e5e5;
	text-decoration: none;
	margin: 0;
	border-radius: 4em;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}

#nav li:hover a{
	background: #ebebeb;
	color: #444444;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.2);
	box-shadow: 0px 1px 1px rgba(0,0,0,0.2);
}

/* 오버시 나타나는 메뉴 설정 */
/* display:none; 아닌 opacity:0; 설정을 하면 오버시 나타나는 메뉴 공간만 가도 메뉴가 나타난다   */
#nav ul{
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 45px;
	left: 0px;
	width: 200px;
	background: #ddd;
	border: 1px solid #b4b4b4;
	border-radius: 8px;
	box-shadow: 0px 1px 1px rgba(0,0,0,0.3);
	display:none;
}

/* display:block; 아닌 opacity:1; 설정을 하면 오버시 나타나는 메뉴 공간만 가도 메뉴가 나타난다   */
#nav li:hover ul{
	display:block;
}

/* 오버시 메뉴의 정렬이 틀어진걸 잡아주는 태그 */
#nav ul li{
	float:none;
	margin: 0;
	padding: 0;
}

/*위에 있는 nav li a / 사용된 보더 라디어스 4em 상속된 속성을  border-radius: 0; 상속을 풀어준다.*/
#nav ul a{
	font-weight: normal;
	text-shadow: 0px 1px 0px #ffffff;
	color: #333333;
	border-radius: 0;
}

#nav ul li:hover a{
	background: #cfffbf;
	color: #0036d9;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.1);
	border-radius: 0;
}

/* 오버시 나타나는 메뉴 뒷배경 상단을 둥그렇게 바꾼는 태그 */
#nav ul li:first-child>a{
	border-top-right-radius: 9px;
	border-top-left-radius: 9px;
}

/* 오버시 나타나는 메뉴 뒷배경 하단을 둥그렇게 바꾼는 태그 */
#nav ul li:last-child>a{
	border-bottom-right-radius: 9px;
	border-bottom-left-radius: 9px;
}