#top-head-inner{ display: none;}
/*===平版型區===*/
@media (min-width: 685px) and (max-width: 1200px) {
/* ***********************************************************
* #global-nav
* *********************************************************** */
#top-head-inner{ display:block;}
.open #global-nav { visibility: visible;}
#global-nav { visibility: hidden; position: fixed; z-index:1003; display:table; vertical-align:middle; top: 0; height: 100%; width: 100%; text-align: center; font-size:18px;}
#global-nav ul { display: table-cell; vertical-align: middle; list-style: none; padding: 30px;}
#global-nav a { color: #fff; text-decoration: none; display: block; padding: 10px 0;}
/* ***********************************************************
* nav-list
* *********************************************************** */
#global-nav ul li { opacity:0; -webkit-transform: scaleX(0) translateX(-260px); transform: scaleX(0) translateX(-260px); -webkit-transition: none; transition: none;}
.open #global-nav ul li { opacity:1; -webkit-transform: scaleX(1) translateX(0); transform: scaleX(1) translateX(0); -webkit-transition: all .3s ease-out; transition: all .3s ease-out; -webkit-transition-delay:.1s; transition-delay: .1s;}
.open #global-nav ul li:nth-child(2) { -webkit-transition-delay: .2s; transition-delay: .2s;}
.open #global-nav ul li:nth-child(3) { -webkit-transition-delay: .3s; transition-delay: .3s;}
.open #global-nav ul li:nth-child(4) { -webkit-transition-delay: .4s; transition-delay: .4s;}
.open #global-nav ul li:nth-child(5) { -webkit-transition-delay: .5s; transition-delay: .5s;}
.open #global-nav ul li:nth-child(6) { -webkit-transition-delay: .6s; transition-delay: .6s;}
.open #global-nav ul li:nth-child(7) { -webkit-transition-delay: .7s; transition-delay: .7s;}
/* ***********************************************************
* #nav-bg
* *********************************************************** */
#nav-bg { content: ""; width: 60px; height: 60px; top:22px; right:20px; z-index:1000; display: block; position: fixed; -webkit-border-radius: 50%; border-radius: 50%;-webkit-transition: all .3s ease-out; transition: all .3s ease-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: scale(1); transform: scale(1);}
.open #nav-bg {	background: #20ac9e; -webkit-transform: scale(50); transform: scale(50); -webkit-transition: all .6s ease-out; transition: all .6s ease-out;}
/* ***********************************************************
* #nav-toggle
* *********************************************************** */
#nav-toggle { display: block; position: fixed; z-index: 1004; top:0px; right:0px; width:60px; height:60px; cursor: pointer; padding:15px; background:#505050; -webkit-tap-highlight-color:rgba(0,0,0,0);}
#nav-toggle div { position: relative; display: flex; flex-direction: column;}
#nav-toggle span {/*display: block; */ height: 2px; width: 100%; background: #ffffff;/*left: 0; */ zoom: 1; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out; margin: 4px 0;}
#nav-toggle span:nth-child(1) { top: 0;}
#nav-toggle span:nth-child(2) { top: 8px;}
#nav-toggle span:nth-child(3) { top: 16px;}
.open #nav-toggle { background: transparent;}
.open #nav-toggle span { background: #fff;}
.open #nav-toggle span:nth-child(1) { top: 9px; -webkit-transform: translateY(10px) rotate(-135deg); transform: translateY(10px) rotate(-135deg); zoom: 1;}
.open #nav-toggle span:nth-child(2) { width: 0; left: 50%;}
.open #nav-toggle span:nth-child(3) { top: 9px; -webkit-transform: translateY(-10px) rotate(135deg); transform: translateY(-10px) rotate(135deg); zoom: 1;}
}

/*===手機版型區===*/
@media screen and (max-width: 686px) {
/* ***********************************************************
* #global-nav
* *********************************************************** */
#top-head-inner{ display:block;}
.open #global-nav { visibility: visible;}
#global-nav { visibility: hidden; position: fixed; z-index:1003; display:table; vertical-align:middle; top: 0; height: 100%; width: 100%; text-align: center; font-size:16px;}
#global-nav ul { display: table-cell; vertical-align: middle; list-style: none; padding:20px;}
#global-nav a { color: #fff; text-decoration: none; display: block; padding:8px 0;}
/* ***********************************************************
* nav-list
* *********************************************************** */
#global-nav ul li { opacity:0; -webkit-transform: scaleX(0) translateX(-260px); transform: scaleX(0) translateX(-260px); -webkit-transition: none; transition: none;}
.open #global-nav ul li { opacity:1; -webkit-transform: scaleX(1) translateX(0); transform: scaleX(1) translateX(0); -webkit-transition: all .3s ease-out; transition: all .3s ease-out; -webkit-transition-delay:.1s; transition-delay: .1s;}
.open #global-nav ul li:nth-child(2) { -webkit-transition-delay: .2s; transition-delay: .2s;}
.open #global-nav ul li:nth-child(3) { -webkit-transition-delay: .3s; transition-delay: .3s;}
.open #global-nav ul li:nth-child(4) { -webkit-transition-delay: .4s; transition-delay: .4s;}
.open #global-nav ul li:nth-child(5) { -webkit-transition-delay: .5s; transition-delay: .5s;}
.open #global-nav ul li:nth-child(6) { -webkit-transition-delay: .6s; transition-delay: .6s;}
.open #global-nav ul li:nth-child(7) { -webkit-transition-delay: .7s; transition-delay: .7s;}
/* ***********************************************************
* #nav-bg
* *********************************************************** */
#nav-bg { content: ""; width: 60px; height: 60px; top:22px; right:20px; z-index:1000; display: block; position: fixed; -webkit-border-radius: 50%; border-radius: 50%;-webkit-transition: all .3s ease-out; transition: all .3s ease-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: scale(1); transform: scale(1);}
.open #nav-bg {	background: #20ac9e; -webkit-transform: scale(50); transform: scale(50); -webkit-transition: all .6s ease-out; transition: all .6s ease-out;}
/* ***********************************************************
* #nav-toggle
* *********************************************************** */
#nav-toggle { display: block; position: fixed; z-index: 1004; top:0px; right:0px; width:50px; height:50px; cursor: pointer; padding:15px; background:#505050; -webkit-tap-highlight-color:rgba(0,0,0,0);}
#nav-toggle div { position: relative; display: flex; flex-direction: column;}
#nav-toggle span {/*display: block; */ height: 2px; width: 100%; background: #ffffff;/*left: 0; */ zoom: 1; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out; margin: 2px 0;}
#nav-toggle span:nth-child(1) { top: 0;}
#nav-toggle span:nth-child(2) { top: 4px;}
#nav-toggle span:nth-child(3) { top: 8px;}
.open #nav-toggle { background: transparent;}
.open #nav-toggle span { background: #fff;}
.open #nav-toggle span:nth-child(1) { top: 4px; -webkit-transform: translateY(6px) rotate(-135deg); transform: translateY(6px) rotate(-135deg); zoom: 1;}
.open #nav-toggle span:nth-child(2) { width: 0; left: 50%;}
.open #nav-toggle span:nth-child(3) { top: 4px; -webkit-transform: translateY(-6px) rotate(135deg); transform: translateY(-6px) rotate(135deg); zoom: 1;}
}