@charset "utf-8";

@media only screen and (max-width:769px){
.global_wrap nav{
position:fixed;
top:0;
right:-300px;
width:300px;
height:100%;
padding-top:30px;
background:#333;
font-size:16px;
box-sizing:border-box;
z-index:2;
}

.global_wrap nav ul{
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}

.global_wrap nav ul li{display:block;padding:10px 28px;}
.global_wrap nav ul li:last-child{margin-bottom:20px;}
.global_wrap nav ul li a{text-decoration:none;color:#ddd;}
.global_wrap .btn-gnavi {
position:fixed;
top:20px;
right:20px;
width:30px;
height:24px;
z-index: 3;
box-sizing:border-box;
cursor: pointer;
-webkit-transition:all 400ms;
transition:all 400ms;
}

.global_wrap .btn-gnavi span {
position:absolute;
width:30px;
height:4px;
background:#666;
border-radius:10px;
-webkit-transition:all 400ms;
transition:all 400ms
}

.global_wrap .btn-gnavi span:nth-child(1){top:0;}
.global_wrap .btn-gnavi span:nth-child(2){top:10px;}
.global_wrap .btn-gnavi span:nth-child(3){top:20px;}

.global_wrap .btn-gnavi.open {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}

.global_wrap .btn-gnavi.open span{background:#666;}
.global_wrap .btn-gnavi.open span{width:24px;}
.global_wrap .contents section p {
position: absolute;
top:50%;
width:30%;
line-height:1.0;
font-size:20px;
color: #fff;
text-shadow: 0 0 6px #666;
}

.global_wrap .contents section:nth-child(odd) p {left:10%;}
.global_wrap .contents section:nth-child(even) p {right:10%;}

}
