nav.sp{
    position: fixed;
    width: 100%;
    background: #fff;
    z-index: 50000;
    height: 90px;
}

.drawer{
    position: relative;
}
a.navbar_rogo img{
    z-index:9999;
    position: absolute;
    top: 20px;
    left: 20px;
    margin: 0 0 17px 0;
    height: 52px;
}
.navbar_toggle{
    z-index:9999;
    position: absolute;
    top: 30px;
    right: 20px;
}

.navbar_toggle_icon {
 position: relative;
 display: block;
 height: 2px;
 width: 30px;
 background: #222;
 -webkit-transition: ease .5s;
 transition: ease .5s;
}

.navbar_toggle_icon:nth-child(1) {
 top: 0;
}

.navbar_toggle_icon:nth-child(2) {
 margin: 8px 0;
}

.navbar_toggle_icon:nth-child(3) {
 top: 0;
}
/*OPEN時の動き*/
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
 top: 10px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}

.navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 opacity: 0;
}

.navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
 top: -10px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

.menu{
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition:ease .5s;
    transition:ease .5s;
    z-index:1000;
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    padding: 100px 20px;
}

.menu ul li{
 padding: 1em;
 border-bottom: 1px solid #CCC;
    float: none;
}
/*OPEN時の動き*/
.menu.open {
 -webkit-transform:translateX(0);
 transform:translateX(0);
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
}
