@charset "UTF-8";
/* CSS Document */
.fixnav {
	display: block;
    padding-top: 0px;
    max-width: 1000px;
    margin: 0 auto;
}
.fixnav .qlink {float:left; text-decoration:none;}
#top-bar {
	z-index:99;
	width:100%;
	display:block;
	float:left;
	background-color: #ffe33b;
}

.fixlogo {
	display:block;
}
.fixlogo img{
	max-height:35px;
	float:left;
	padding:5px 5px 0px 30px;
}
ul.navigation{
	
}
ul.navigation, ul.navigation li, ul.navigation ul, ul.navigation a:link{
	margin: 0 auto;
    text-decoration: none;
}
ul.navigation,ul.navigation li {
    list-style: none;
}
ul.navigation > li {
    position: relative;
    float: left;
}
ul.navigation li:last-child{ 
    position: relative;
    float: left;
	border-right: 0px solid #fff;
}
/* 選單 li 裡面連結之樣式 */
ul.navigation li a{
    display: table;
    padding: 1em 2.09em 1em;
    color: #000;
	text-align:left;
}
/* 特定在第一層，以左邊灰線分隔 */
ul.navigation > li > a{
    border-bottom: 0px solid #CCC;    
    border-right: 0px solid #fff;
}
ul.navigation > li > li:last-child a{
	border-right: 0px solid #fff;
}
ul.navigation > li > a:hover{
    color: #000;
	background-color:#f4b52e;
}
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
ul.navigation li ul{
    display: none;
    float: left;
    position: absolute;
    left: 0;    
	z-index:1;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
ul.navigation li:hover > ul, 
ul.navigation li:focus > ul,
ul.navigation li:active > ul,
ul.navigation .show {
    display: block;
    left: -2.5em;
}
/* 特定在第二層或之後下拉部分 li 之樣式 */
ul.navigation ul li a{
	background: #f4b52e;
    padding: 0.5em 1.3em;
    border-bottom: 1px solid #FFF;
    width: 194px;
    box-sizing: border-box;
}
/* 特定在第二層或之後下拉部分 li （最後一項不要底線）之樣式 */
ul.navigation ul li:last-child a{
    border-bottom: none;
}
/* 第二層或之後 選單 li 之樣式 */
ul.navigation ul a {
    width: 7em;
    color: #FFF;        
}
ul.navigation ul a:hover,
ul.navigation ul a:focus,
ul.navigation ul a:active {        
    background: #e96b00;    
}
/* 第三層之後，上一層的選單觸發則顯示出來（皆為橫向拓展） */
ul.navigation ul li:hover > ul,
ul.navigation ul li:focus > ul,
ul.navigation ul li:active > ul {
    display: block;
    position: absolute;
    margin-top: -2.4em;
    left: 12.1em;
}
ul.navigation ul li:hover:last-child > ul, 
ul.navigation ul li:focus:last-child > ul,
ul.navigation ul li:active:last-child > ul {
    display: block;
    position: absolute;
    margin-top: -2.3em;
    left: 9.6em;
}
ul.navigation ul li:hover > ul li a:link,
ul.navigation ul li:focus > ul li a:link,
ul.navigation ul li:active > ul li a:link {
	background: #e96b00; 
	border-bottom:1px solid #FFF;
}
ul.navigation ul li:hover > ul li:last-child a:link,
ul.navigation ul li:focus > ul li:last-child a:link,
ul.navigation ul li:active > ul li:last-child a:link {
	border-bottom:0px solid #FFF;
}
ul.navigation ul li:hover > ul li a:hover,
ul.navigation ul li:focus > ul li a:focus,
ul.navigation ul li:active > ul li a:active {
	background: #e96b00; 
}
ul.navigation > li:last-child > ul li:hover ul,
ul.navigation > li:last-child > ul li:focus ul,
ul.navigation > li:last-child > ul li:active ul {
    display: block;
    position: absolute;
    margin-top: -2.2em;
	left:-9.5em;
}
ul.navigation > li:last-child > ul li:last-child ul{
	left:-12em;
}



/* 箭頭向下 */
.arrow-bottom {
}
/* 箭頭向右 */
.arrow-right {
    display: inline-block;
    margin-left: 10px;    
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #FFF;        
    width: 1px;
    height: 1px;
}
/* 箭頭向左 */
.arrow-left {
    display: inline-block;
    margin-right: 10px;    
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-right: 3px solid #FFF;        
    width: 1px;
    height: 1px;
}


#fix-bar {
	z-index: 99;
    width: 100%;
    display: block;
    float: left;
    background-color: #ffe33b;
	position:fixed;
	top:0px;
}
/* 選單 li 裡面連結之樣式 */
#fix-bar ul.navigation li a{
    display: table;
    padding: 1em 2.1em 1em;
    color: #000;
	text-align:left;
	background-color:#ffe33b;
}
/* 特定在第一層，以左邊灰線分隔 */
#fix-bar ul.navigation > li > a{
    border-bottom: 0px solid #CCC;    
    border-right: 0px solid #fff;
}
#fix-bar ul.navigation > li > li:last-child a{
	border-right: 0px solid #fff;
}
#fix-bar ul.navigation > li > a:hover,
#fix-bar ul.navigation > li > a:focus,
#fix-bar ul.navigation > li > a:active {
    color: #000;
	background-color:#f4b52e;
}
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
#fix-bar ul.navigation li ul{
    display: none;
    float: left;
    position: absolute;
    left: 0;    
	z-index:1;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
#fix-bar ul.navigation li:hover > ul,
#fix-bar ul.navigation li:focus > ul,
#fix-bar ul.navigation li:active > ul,
#fix-bar ul.navigation .show {
    display: block;
    left: -2.5em;
}
/* 特定在第二層或之後下拉部分 li 之樣式 */
#fix-bar ul.navigation ul li a{
	background: #f4b52e;
    padding: 0.5em 1.3em;
    border-bottom: 1px solid #FFF;
    width: 194px;
    box-sizing: border-box;
}
/* 特定在第二層或之後下拉部分 li （最後一項不要底線）之樣式 */
#fix-bar ul.navigation ul li:last-child a{
    border-bottom: none;
}
/* 第二層或之後 選單 li 之樣式 */
#fix-bar ul.navigation ul a {
    width: 7em;
    color: #FFF;        
}
#fix-bar ul.navigation ul a:hover,
#fix-bar ul.navigation ul a:focus,
#fix-bar ul.navigation ul a:active {        
    background: #e96b00;    
}
/* 第三層之後，上一層的選單觸發則顯示出來（皆為橫向拓展） */
#fix-bar ul.navigation ul li:hover ul,
#fix-bar ul.navigation ul li:focus ul,
#fix-bar ul.navigation ul li:active ul {
    display: block;
    position: absolute;
    margin-top: -2.2em;
	left:9.5em;
}
#fix-bar ul.navigation ul li:hover:last-child ul,
#fix-bar ul.navigation ul li:focus:last-child ul,
#fix-bar ul.navigation ul li:active:last-child ul {
    display: block;
    position: absolute;
    margin-top: -2.2em;
	left:7em;
}
#fix-bar ul.navigation ul li:hover > ul li a:link,
#fix-bar ul.navigation ul li:focus > ul li a:link,
#fix-bar ul.navigation ul li:active > ul li a:link {
	background: #e96b00; 
	border-bottom:1px solid #FFF;
}
#fix-bar ul.navigation ul li:hover > ul li:last-child a:link,
#fix-bar ul.navigation ul li:focus > ul li:last-child a:link,
#fix-bar ul.navigation ul li:active > ul li:last-child a:link {
	border-bottom:0px solid #FFF;
}
#fix-bar ul.navigation ul li:hover > ul li a:hover,
#fix-bar ul.navigation ul li:hover > ul li a:focus,
#fix-bar ul.navigation ul li:hover > ul li a:active {
	background: #858466; 
}
#fix-bar ul.navigation > li:last-child > ul li:hover ul,
#fix-bar ul.navigation > li:last-child > ul li:focus ul,
#fix-bar ul.navigation > li:last-child > ul li:active ul {
    display: block;
    position: absolute;
    margin-top: -2.2em;
	left:-9.5em;
}
#fix-bar ul.navigation > li:last-child > ul li:last-child ul{
	left:-12em;
}







@media screen and (max-width: 900px) {
.logo {
}
.fixnav {
	display:none;
}
	#fix-bar {display:none;}
#top-bar {
	display:none;
}
}