@charset "UTF-8";


#top-head{z-index:999;margin: auto; height:120px;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+19,ffffff+100,ffffff+100&1+19,0+100 */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 19%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 19%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 19%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}
#top-head{top:0;position:fixed;margin-top:0;}
#top-head{width:100%;padding:0;}
#top-head.fixed .head-menu{background:rgba(255,255,255,0.8);}
#mobile-head{width:100%;height:70px;z-index:999;position:relative;}
#top-head .headlogo{position: absolute; right:10px; top:10px; height:50px;}



#global-nav{position:absolute;top:-601px;width:100%;text-align:center;padding:86px 0 5px;-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out;background:#ffffff;opacity:0.9;filter:alpha(opacity=90);-moz-opacity:0.9;}
#global-nav ul *{text-decoration: none; font-size:15px;display:block;cursor: pointer}

#global-nav ul{width:97%;list-style:none;position:static;left:0;bottom:0;margin:20px auto 0;font-size:0.9em;letter-spacing:0.1em;}
#global-nav ul li{width:90%;margin:0% 5%;}
#top-head #global-nav ul li a{width:100%;padding:15px 0;color:#222222;border-top:1px dotted #00a2e6; cursor: pointer}
#nav-toggle{display:block;position:absolute;left:10px;top:5px;width:56px;height:56px;cursor:pointer;}
#top-head.fixed .inner .head-menu #nav-toggle{background:#fff;}
#nav-toggle div{position:relative;width:60%;margin:17px 20%;}
#nav-toggle span{display:block;position:absolute;height:4px;width:100%;background:#00a2e6;left:0;-webkit-transition:.35s ease-in-out;-moz-transition:.35s ease-in-out;transition:.35s ease-in-out;}
#nav-toggle span:nth-child(1){top:0;}
#nav-toggle span:nth-child(2){top:10px;}
#nav-toggle span:nth-child(3){top:20px;}
.open #nav-toggle span:nth-child(1){top:11px;-webkit-transform:rotate(315deg);-moz-transform:rotate(315deg);transform:rotate(315deg);}
.open #nav-toggle span:nth-child(2){width:0;left:50%;}
.open #nav-toggle span:nth-child(3){top:11px;-webkit-transform:rotate(-315deg);-moz-transform:rotate(-315deg);transform:rotate(-315deg);}
.open #global-nav{-moz-transform:translateY(580px);-webkit-transform:translateY(580px);transform:translateY(580px);}


@media screen and (min-width:680px){
.toppage #top-head{display: none}	
#top-head{height:50px;background:#fff;}
#top-head .inner{position:static;left:0; right:0; margin:0 auto;box-sizing:border-box;line-height:1;z-index:999;}
#top-head .inner .head-menu{width:100%;margin:0 auto;padding:0;}
#top-head.fixed .inner{margin:0 auto;top:0;padding:0 0;position:fixed;height:auto;transition:top 0.65s ease-in;-webkit-transition:top 0.65s ease-in;-moz-transition:top 0.65s ease-in;}
#top-head.fixed .inner .head-menu{padding:0 0;background:#fff;}
#mobile-head{background:none;width:100%;height:auto;z-index:999;}

#global-nav{width:100%;top:0;opacity:1;filter:alpha(opacity=100);-moz-opacity:1;background:#00a2e6;padding:15px 0 30px;}
#global-nav ul{list-style:none;position:relative;width:auto; text-align: center}
#global-nav ul li{display: inline-block;margin:0 25px 0 0;padding:0;width:auto;}
#top-head #global-nav ul li a,
#top-head.fixed #global-nav ul li a{display: block; position: relative; font-size:1.1em;font-weight:bold;letter-spacing:0.15em;color:#ffffff;padding:0 1px 4px !important;margin:0 !important;border:none;}
#top-head #global-nav ul li span.name{padding:0 0.5px 0 0;}
#nav-toggle{display:none;}
	
#top-head #global-nav ul li a:after {
  height:1px;
  position: absolute;
  content: '';
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  background-color: rgba(255,255,255,0.6);
  width: 0;
}

#top-head #global-nav ul li a:after {
  bottom: -5px;
  left:0
}

#top-head #global-nav ul li a:hover:after
 {
  width: 100%;
}
#top-head .headlogo{display: none}
}



