#top-head-inner{ display: none;}
/*===平版型區===*/
@media (min-width: 685px) and (max-width: 998px) {
/* ***********************************************************
* #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-weight:400; font-size: 19px;}
#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 menu
* *********************************************************** */
#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: .6s; transition-delay: .7s;}
.open #global-nav ul li:nth-child(8) { -webkit-transition-delay: .8s; transition-delay: .8s;}
.open #global-nav ul li:nth-child(9) { -webkit-transition-delay: .9s; transition-delay: .9s;}
/* ***********************************************************
* #nav-bg_menu bg
* *********************************************************** */
#nav-bg { content: ""; width: 60px; height: 60px; top:20px; 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: #fa7272; -webkit-transform: scale(50); transform: scale(50); -webkit-transition: all .6s ease-out; transition: all .6s ease-out;}
/* ***********************************************************
* #nav-toggle_menu btn
* *********************************************************** */
#nav-toggle { display: block; position: fixed; z-index: 1004; top:3px; right:1%; width:57px; height:57px; cursor: pointer; padding:15px; -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: #454c67;/*left: 0; */ zoom: 1; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out; margin:3px 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: #ffffff;}
.open #nav-toggle span:nth-child(1) { top:6px; -webkit-transform: translateY(8px) rotate(-135deg); transform: translateY(8px) rotate(-135deg); zoom: 1;}
.open #nav-toggle span:nth-child(2) { width: 0; left: 50%;}
.open #nav-toggle span:nth-child(3) { top:6px; -webkit-transform: translateY(-9px) rotate(135deg); transform: translateY(-9px) 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-weight:400; font-size:18px;}
#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: 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: .6s; transition-delay: .7s;}
.open #global-nav ul li:nth-child(8) { -webkit-transition-delay: .8s; transition-delay: .8s;}
.open #global-nav ul li:nth-child(9) { -webkit-transition-delay: .9s; transition-delay: .9s;}
/* ***********************************************************
* #nav-bg_menu bg
* *********************************************************** */
#nav-bg { content: ""; width:50px; height:50px; 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: #ed6879; -webkit-transform: scale(50); transform: scale(50); -webkit-transition: all .6s ease-out; transition: all .6s ease-out;}
/* ***********************************************************
* #nav-toggle_menu btn
* *********************************************************** */
#nav-toggle { display: block; position: fixed; z-index: 1004; top:7px; right:3px; width:40px; height:30px; cursor: pointer; padding: 10px; -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: #444444;/*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;}
}