@media screen and (max-width:786px){
.navbar_toggle{
 z-index:9999;
 width:20%;
 margin-top: -50px;
 margin-left:10px;
}
.navbar_toggle_icon {
 position: relative;
 display: block;
 height: 2px;
 width: 30px;
 background: #5c6b80;
 -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;
}
.menu{
  top:70px;
  width:80%;
  background: rgba(233, 233, 233, 0.9);
  overflow-y:scroll;
  position:fixed;
}
.menu li{
 padding: 20px 0 20px;
 color:#fff;
 font-size:14px;
 border-bottom: 1px dotted #CCC;
 width:90%;
 margin-left: 5%;
}
.menu li:last-child{
  border-bottom:none;
}
/*OPEN時の動き*/
.menu.open {
 -webkit-transform:translateX(0);
 transform:translateX(0);
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
 background:rgba(0,0,0,0.8);
}
}
@media screen and (min-width: 720px) {
nav{
 display: flex;
 flex-direction: row;
}
.navbar_toggle{
 display: none;
}
ul.menu {
 height: 70px;
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-end;
 align-items: center;
}
}