:root{ --color1:#f7c656; --color2:#4c3212; --titlefont:700 46px/1.2 'Noto Serif TC';--titlecolor: #FFF;}

@media screen and (max-width:800px) {
:root{--titlefont:900 36px/1.2 'Noto Serif TC';}
}



/*舊的選單*/    
.globalMenu {flex-wrap: nowrap;display: flex;justify-content: center;width: 100%;background: #f7c656f0;position: sticky;top: 0;bottom: 0;z-index: 100;height:fit-content;}
.globalMenu.sticky{position: fixed;top: 0;}
.globalMenu a {font:600 24px/1.2 'Noto Serif TC'; color: var(--color2);padding: 10px 20px;  }
.globalMenu a.on,.globalMenu a.on:hover{color: var(--color2);background: #f0e8b5;font:700 24px/1.2 'Noto Serif TC';}
.globalMenu a:hover{background: #f8df54;}


@media screen and (max-width:1024px) {
/* .globalMenu{position: static;} */
}

@media screen and (max-width:860px) {
.globalMenu a{padding: 10px 16px;}
}
@media screen and (max-width:800px) {
/* .globalMenu{height: 48px;}  */
.globalMenu a {font:400 18px/1.2 'Noto Serif TC';padding: 10px;}
.globalMenu a.on,.globalMenu a.on:hover{font:400 18px/1.2 'Noto Serif TC';}
}

@media screen and (max-width:700px) {
.globalMenu {justify-content: left;overflow-x: scroll; white-space: nowrap; -webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
}


/*選單第二層*/
.poiMenu { position: sticky;  width: 100%;  top: 49px;  left: 0;  background: #f0e8b5;  text-align: center;  height: auto;  z-index: 99;  padding: 10px 0;display: flex;flex-wrap: nowrap;justify-content: center;box-shadow: 0px 0px 10px rgba(31, 114, 93, 0.2);}
.poiMenu li {  font:400 20px/1.2 'Noto Serif TC'; margin: 0px 5px;   position: relative;padding: 5px 10px;color: #4c3212;cursor: pointer;}
.poiMenu li:hover { background: #ffe;}


@media screen and (max-width:800px) {
.poiMenu{top: 40px;padding: 5px 0;}
.poiMenu li{font:400 16px/1.2 'Noto Serif TC';}
}

@media screen and (max-width:500px) {
.poiMenu { white-space: nowrap;  -webkit-overflow-scrolling: touch; overflow-scrolling: touch; overflow-x: scroll;justify-content: left;}
.poiMenu li{flex-grow: 1;}
}