diff --git a/assets/javascripts/app.js b/assets/javascripts/app.js
index 2cab8e2..be3e903 100644
--- a/assets/javascripts/app.js
+++ b/assets/javascripts/app.js
@@ -49,6 +49,31 @@
     }
     window.already_fix_first_element = true;
   }
+  function open_kenjoh(flag){
+    if(flag){
+      if (parseInt($('.layout-content').css('margin-top'))==0 && $('.layout-content.topcontent').length != 0 && $('.layout-content.topcontent').offset().top<400){
+        $('.layout-content').css('margin-top',$('.kenjohn').height()-$('#orbit-bar').height());
+      }
+      $('.kenjohn').addClass('navFixed').removeClass('navRel');   /* 幫選單加上固定效果 */
+    }else{
+      if ($('.header-banner').html().trim() == "") {
+        $('.kenjohn').removeClass('navFixed').addClass('navRel');
+      }else{
+        $('.kenjohn').removeClass('navRel').removeClass('navFixed'); /* 移除選單固定效果 */
+      }
+      $('.layout-content').css('margin-top','');
+    }
+  }
+  function recalc_kenjohn_header(){
+    $('.layout-header').css('height', '');
+    var scrollTop = $(window).scrollTop();
+    var scrollBottom = $('html').height() - $(window).height() - $('.kenjohn').height();
+    if (scrollTop>5 && scrollBottom>0)  {          /* 要滑動到選單的距離 */
+      open_kenjoh(true);
+    } else {
+      open_kenjoh(false);
+    }
+  }
   function initdata1 () {
     window.temp_scrollY = window.pageYOffset;
     window.temp_scrollX = window.pageXOffset;
@@ -61,22 +86,7 @@
     }
     // if (location.href.search('editmode') == -1 && document.getElementsByClassName('asideright').length != 0) {
     if ( $('.header-banner').length != 0) {
-      $('.layout-header').css('height', '');
-      var scrollTop = $(window).scrollTop();
-      var scrollBottom = $('html').height() - $(window).height() - $('.kenjohn').height();
-      if (scrollTop>5 && scrollBottom>0)  {          /* 要滑動到選單的距離 */
-        if (parseInt($('.layout-content').css('margin-top'))==0 && $('.layout-content.topcontent').length != 0 && $('.layout-content.topcontent').offset().top<400){
-          $('.layout-content').css('margin-top',$('.kenjohn').height()-$('#orbit-bar').height());
-        }
-        $('.kenjohn').addClass('navFixed').removeClass('navRel');   /* 幫選單加上固定效果 */
-      } else {
-        if ($('.header-banner').html().trim() == "") {
-          $('.kenjohn').removeClass('navFixed').addClass('navRel');
-        }else{
-          $('.kenjohn').removeClass('navRel').removeClass('navFixed'); /* 移除選單固定效果 */
-        }
-        $('.layout-content').css('margin-top','');
-      }
+      recalc_kenjohn_header();
     }
     var navFixed = $('.kenjohn.navFixed');
     window.top_barrier_height = (navFixed.length ? navFixed.height() : 0) + $('#orbit-bar').height();
@@ -406,9 +416,67 @@
       },
 
       ClickMenuHandler: function() {
+        $('.orbit-bar-search-sign-language .logout-btn:eq(-1), #loginbutton').on('focusout', function(){
+          if(window.is_press_tab){
+            open_kenjoh(true);
+            $('#accesskey_top').focus();
+          }
+        })
+        $('#gotocenter').on('focusout', function(){
+          recalc_kenjohn_header();
+        })
+        $('.kenjohn .navbar-toggle').on('focusout', function(){
+          if(window.is_press_tab){
+            recalc_kenjohn_header();
+          }
+        })
+        $('#accesskey_top').on('focusout', function(){
+          if(window.is_press_shift_tab){
+            recalc_kenjohn_header();
+          }
+        })
+        var focusable_items = $('.mobile-menu').find('a, button');
+        var focusout_func1 = function(){
+          if(window.is_press_tab){
+            focusable_items.eq(0).focus();
+          }
+        }
+        var focusout_func2 = function(){
+          if(window.is_press_shift_tab){
+            focusable_items.eq(-1).focus();
+          }
+        }
+        var fix_menu_focus = function(enable){
+          if(enable){
+            focusable_items.focus();
+            focusable_items.eq(-1).on('focusout', focusout_func1);
+            focusable_items.eq(0).on('focusout', focusout_func2);
+          }else{
+            focusable_items.eq(-1).off('focusout', focusout_func1);
+            focusable_items.eq(0).off('focusout', focusout_func2);
+          }
+        }
+        $('#accesskey_menu').click(function(e){
+          e.preventDefault();
+          if(!$('body').hasClass('noscroll')){
+            $('body').data('org-scrollY', window.temp_scrollY);
+            $('body').css('top', '-' +  window.temp_scrollY.toString() + 'px');
+            $('body').addClass('noscroll');
+            $('.mobile-menu').addClass('active');
+            fix_menu_focus(true);
+            $('.mobile-menu .navbar-toggle').removeClass('collapsed');
+            // $menu.slideToggle();
+            $('.mobile-menu1 > ul').slideUp(500);
+            $('.mobile-menu1 > .menu-drop').removeClass('opened');
+            $('.mobile-menu2 > ul').slideUp(500);
+            $('.mobile-menu2 > .menu-drop').removeClass('opened');
+            $('#layout-navigation').addClass('in');
+          }
+        })
         $('.navbar-toggle').click(function(e){
           e.preventDefault();
           if($('body').hasClass('noscroll')){
+            fix_menu_focus(false);
             $('.mobile-menu').removeClass('active');
             window.setTimeout(function(){
               $('body').removeClass('noscroll');
@@ -420,6 +488,7 @@
             $('body').css('top', '-' +  window.temp_scrollY.toString() + 'px');
             $('body').addClass('noscroll');
             $('.mobile-menu').addClass('active');
+            fix_menu_focus(true);
           }
 
           $('.mobile-menu .navbar-toggle').removeClass('collapsed');
@@ -733,6 +802,10 @@ function transdate(){
         if(_this.is('body')){
           return;
         }
+        if(_this.is('#gotocenter')){
+          open_kenjoh(true);
+          return;
+        }
         if($('body').css('position') != 'fixed' && !_this.hasClass('close-screen-btn') && !_this.hasClass('navbar-toggle')){
           var ele_offset = _this[0].getBoundingClientRect().top;
           if(_this.parents('.kenjohn.navFixed').length == 0)
@@ -750,7 +823,6 @@ function transdate(){
           }, 800);
           if ($('header>.kenjohn').attr('class') == "kenjohn" && _this.is('a.orbit-bar-logo')){
             $('header>.kenjohn').addClass('navRel');
-            $('#gotocenter').focus();
           }
         }
       });
diff --git a/assets/stylesheets/template/base/_global.scss b/assets/stylesheets/template/base/_global.scss
index 6129e3b..0e33ae8 100644
--- a/assets/stylesheets/template/base/_global.scss
+++ b/assets/stylesheets/template/base/_global.scss
@@ -11,7 +11,6 @@ body {
   font-family: $sub-font;
   font-size: inherit;
   margin-top: 2.5em;
-  overflow: hidden scroll;
   background-color: #F8F8F8;
 }
 
diff --git a/assets/stylesheets/template/layout/content.scss b/assets/stylesheets/template/layout/content.scss
index 7e700f0..fcdab5c 100644
--- a/assets/stylesheets/template/layout/content.scss
+++ b/assets/stylesheets/template/layout/content.scss
@@ -1,7 +1,11 @@
 @charset "utf-8";
 
 @import "../initial";
+html{
+  overflow: hidden auto;
+}
 body{
+  overflow: hidden;
   @media (min-width: 1150px){
     .black-screen-social-window.reactable{
       .content-social .social_wrap i, .content-social .social_wrap img {
@@ -35,7 +39,7 @@ body{
     box-sizing: border-box;
   }
 
-  a:hover span {
+  a:focus span, a:hover span {
     width: 60px;
     height: 60px;
     margin-left: -30px;
diff --git a/assets/stylesheets/template/layout/header.scss b/assets/stylesheets/template/layout/header.scss
index 20bee95..4c1e6d3 100644
--- a/assets/stylesheets/template/layout/header.scss
+++ b/assets/stylesheets/template/layout/header.scss
@@ -26,7 +26,7 @@
           display: flex;
           justify-content: center;
   }
-  & > * {
+  & > *:not(style, script) {
     display: inline-block;
     margin-top: 0;
     margin-bottom: 0;
@@ -157,7 +157,7 @@ a#content{
       @media screen and (min-width: 769px){
         height: 100vh!important;
       }
-      @media screen and(min-width:$screen-xs) and (max-width:768px){
+      @media screen and (min-width:$screen-xs) and (max-width:768px){
         height: 1000px!important;
       }
       @media screen and (max-width: $screen-xs){
@@ -198,102 +198,90 @@ a#content{
 }
 
 .layout-header {
-  position: relative;
-  margin-bottom: 0;
-  border: none;
-  border-radius: 0;
-  border-bottom: 1px solid #e8e8e8;
-  color: #fff;
-  height: auto;
+    position: relative;
+    margin-bottom: 0;
+    border: none;
+    border-radius: 0;
+    border-bottom: 1px solid #e8e8e8;
+    color: #fff;
+    height: auto;
 
-  .container {
-    @extend .response-container;
-  }
-  .header-banner { overflow: hidden; }
-.jp-audio, .jp-audio-stream, .jp-video{
-  border: 0px;
-}
-
-  .navbar-header {
-    padding: 0;
-    margin: 0;
-    height: 75px;
-
-    @media (max-width: 768px) {
-      position:relative!important;
+    .container {
+        @extend .response-container;
     }
-    @media (min-width: $screen-sm) {
-      height: 150px;
-      margin:0;
-      padding: 0;
-      line-height: 3.75em;
-      font-size: 1em;
-      display: flex;
+
+    .header-banner {
+        overflow: hidden;
     }
-    .navbar-brand {
-      margin: 0;
-      padding-bottom: 0;
-      line-height: 2.125em;
-      color: $theme-color-main;
-      font-size: 0.6em;
-      font-family: $main-font;
-      @media (max-width: $screen-sm) {
-        height: 5em;
-        display: none;
-      }
-      @media (min-width: 769px){
-              display: none;
-      }
-      @media (max-width: 480px) {
+
+    .jp-audio, .jp-audio-stream, .jp-video {
+        border: 0px;
+    }
+
+    .navbar-header {
+        padding: 0;
         margin: 0;
-      }
-      .default_site_h1{
-        width:100%!important;
-      }
-      .site-logo{
-        width:100%!important;
-      }
-             @media(min-width:1900px){
-                width: 225px;
-                margin-top: -12px;
-             }
-            @media screen and (min-width:1025px) and (max-width:1899px){
-              width: 181px;
-              margin-top: -3px;
-            }
-            @media screen and (min-width:769px) and (max-width:1025px){
-              width: 150px;
-              margin-top: -5px;
-            }
-            @media screen and (min-width:$screen-xs) and (max-width:769px){
-              width: 146px !important;
-            }
-            @media screen and (max-width:$screen-xs){
-                width: 110px !important;
-                margin-top: 3px;
+        height: 75px;
+
+        @media (max-width: 768px) {
+            position: relative !important;
+        }
+
+        @media (min-width: $screen-sm) {
+            height: 150px;
+            margin: 0;
+            padding: 0;
+            line-height: 3.75em;
+            font-size: 1em;
+            display: flex;
+        }
+
+        .navbar-brand {
+            margin: 0;
+            padding: 0;
+            line-height: 2.125em;
+            color: $theme-color-main;
+            font-size: 0.6em;
+            font-family: $main-font;
+            height: auto;
+            @media (max-width: $screen-sm) {
+                height: 5em;
+                display: none;
             }
 
-    }
-        .navbar-brand:nth-child(2){
-                 @media(min-width:1900px){
-                    width: 330px!important;
-                    margin-top: -14px;
-                 }
-                 @media screen and (min-width:1025px) and (max-width:1899px){
-                   width: 261px!important;
-                   margin-top: -5px;
-                 }
-                @media screen and (min-width:769px) and (max-width:1025px){
-                  width: 200px!important;
-                }
-                @media screen and (min-width:$screen-xs) and (max-width:769px){
-                  width: 200px!important;
-                }
-                @media screen and (max-width:$screen-xs){
-                    width: 150px !important;
-                }
+            @media (min-width: 769px) {
+                display: none;
+            }
+
+            @media (max-width: 480px) {
+                margin: 0;
+            }
+
+            .default_site_h1 {
+                width: 100% !important;
+            }
+
+            .site-logo {
+                width: 100% !important;
+            }
+
+            @media(min-width:1900px) {
+                width: 330px;
+            }
+
+            @media screen and (min-width:1025px) and (max-width:1899px) {
+                width: 261px;
+            }
+
+            @media screen and (min-width:$screen-xs) and (max-width:1025px) {
+                width: 200px;
+            }
+
+            @media screen and (max-width:$screen-xs) {
+                width: 150px;
+            }
         }
-  }
+    }
 }
 
 .navbar-toggle {
diff --git a/home/header.html.erb b/home/header.html.erb
index 9bdc9cd..f3578c7 100644
--- a/home/header.html.erb
+++ b/home/header.html.erb
@@ -26,17 +26,17 @@
     <div class="outdropdowns">
       <div class="container dropdowns">
         <div class="navbar-header">
+          <a title="{{site_title_1}}" class="navbar-brand" href="{{home_link_1}}"><img class="site-logo" src="{{logo_url_1}}" alt="site-logo"></a>
+          <script>$(document).ready(function(){var url =$('.site-logo').eq(0).attr('src');if(url == "/assets/default-site-logo.png"){$('.navbar-brand').eq(0).remove();};if($('.navbar-brand').length == 2){$('.site-logo').css('height','auto')};$('.site-logo').eq(0).css('margin-right',0);$('.navbar-brand').css('padding-right',0)})</script>
+          <a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
           <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#layout-navigation">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar icon-bar-top"></span>
             <span class="icon-bar icon-bar-middle"></span>
             <span class="icon-bar icon-bar-bottom"></span>
             <span class="site-trigger__text">
-					MENU	</span>
+          MENU  </span>
           </button>
-          <a title="{{site_title_1}}" class="navbar-brand" href="{{home_link_1}}"><img class="site-logo" src="{{logo_url_1}}" alt="site-logo"></a>
-          <script>$(document).ready(function(){var url =$('.site-logo').eq(0).attr('src');if(url == "/assets/default-site-logo.png"){$('.navbar-brand').eq(0).remove();};if($('.navbar-brand').length == 2){$('.site-logo').css('height','auto')};$('.site-logo').eq(0).css('margin-right',0);$('.navbar-brand').css('padding-right',0)})</script>
-          <a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
         </div>
         <div class="collapse navbar-collapse modules-menu modules-menus" id="layout-navigation">
           <a id="accesskey_menu" title="accesskey menu" accesskey="M" href="#" title="Main menu">:::</a>