/* ---------- 大小與定位 ---------- */
		#menu {
			/* 選單大小 */
			height:30px;
			display:inline;
			width: 900px;
		}
		#menu ul {
			/* 取消ul樣式符號 */
			list-style-type:none;
			/* 重設ul邊界與留白為零 */
			margin:0;
			padding:0;
			/* 內有浮動元件時，需設overflow才會自動調整大小 */
			overflow:auto;
		}
		* html #menu ul {
			/* 解決IE6不理overflow問題，直接指定高度 */
			height:30px;
		}
		#menu ul li {
			/* 利用float讓第一層li水平排列 */
			float:left;
		}
		/* 解決IE6條列式餘白問題*/
		* html #menu ul li {
			display:inline;
		}
		#menu ul li a {
			/* 將a改為區塊元件，以便指定寬高 */
			display:block;
			/* 這邊也要設float，否則IE6會以100%寬度顯示 */
			float:left;
			/* 固定高度 */
			height:50px;
			min-width: 120px;
			text-align: center;
			z-index:1;
		}
		#menu ul li ul {
			/* 讓第二層ul跳脫文件流以利定位 */
			position:absolute;
			/* 固定寬度 */
			min-width:85px;
			/* 避免出現捲軸 */
			overflow:visible;
			/* 讓ul與母階層li相同位置 */
			clear:left;
			margin-top: 50px;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
		}
		/* 修正IE7絕對定位差異 */
		*:first-child+html #menu ul li ul {
			margin-top:0;
		}
		/* 修正IE6絕對定位差異 */
		* html #menu ul li ul {
			margin-top:0;
		}
		#menu ul li ul li {
			/* 覆寫繼承自第一層的浮動設定 */
			float:none;
			text-align: center;
		}
		#menu ul li ul li a {
			/* 覆寫繼承自第一層的浮動設定 */
			float:none;
			width: 100%;/* 註：display、height、padding繼承第一層的設定 */
			background-color: #8E8E8D;
		}
		#menu ul li ul li ul {
			margin-top: -30px;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 100px;
			width: 100%;
		}
		/* 修正IE7絕對定位差異 */
		*:first-child+html #menu ul li ul li ul {
			margin-top:-30px;
		}
		#menu ul li ul li ul li {
		/* width、float繼承第二層，免設定 */
		}
		#menu ul li ul li ul li a {
		/* width、float繼承第二層，免設定 */
		}
		/* ---------- 隱藏與顯示階層 ---------- */
		#menu ul li ul {
			/* 預先隱藏第二層 */
			visibility:hidden;
		}
		#menu ul li:hover ul {
			/* 觸動第一層時，顯示第二層 */
			visibility:visible;
		}
		#menu ul li:hover ul li ul {
			/* 顯示第二層時，隱藏第三層，避免同時彈出 */
			visibility:hidden;
		}
		#menu ul li ul li:hover ul {
			/* 觸動第二層時，顯示第三層 */
			visibility:visible;
		}
		#menu ul li ul li:hover ul li ul {
			/* 顯示第三層時，隱藏第四層，避免同時彈出 */
			visibility:hidden;
		}
		#menu ul li ul li ul li:hover ul {
			/* 觸動第三層時，顯示第四層 */
			visibility:visible;
		}
		/* ---------- 以下為美化用，非必需 ---------- */


		/* 預設字體 */
		#menu {
			font-size:12px;
			font-family:DIN-Next-W01-Light;
		}
		/* 第一層ul背景色彩與邊框 */
		#menu ul {
			//background:#6f6f6f;
			font-size:14px;
		}
		/* 第一層a字型 */
		#menu ul li a {
			color:white;
			text-decoration:none;
			line-height: 50px;
			background-image:url("../../image/style/banner_o0.png");
			font-size: 16px;
			font-weight:bold;
		}
		/*第二層ul背景色彩與邊框  */
		#menu ul li ul {
			background:#BEDDEA;
		}
		/* 第二層a字型 */
		#menu ul li ul li a {
			color:#000;
			text-decoration:none;
			font-size:14x;
			background-color:#C7EEF3;
		}
		/* 觸動第一層li時，改變背景色 */
		#menu ul li:hover {
			//background:#efefef;
			background-image:url("../../image/style/banner_o.png");
		}

		#menu ul li a:hover {
			background-image:url("../../image/style/banner_o.png");
		}
		
		#menu ul li:hover a {
			background-image:none;
			color:#385782;
			z-index: 3;
		}
		/* 觸動第二層以上li時改變背景色 */
		#menu ul li ul li a:hover{
			background-color:#F6F8F7;
			background-image:none;
			color:#000;

		}

		#menu ul li ul li:hover {
			color:#000;
		}