#navToggle {
    display: none;
    position: absolute;
    /*to body*/
    right: 20px;
    top: 15px;
    cursor: pointer;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	background: #222;
}

#navToggle div {
    position: relative;
}

#navToggle span {
    display: block;
	border-radius: 2px;
	background: #fff;
	width: 22px;
	height: 3px;
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	transition: .3s;
}

#navToggle span:nth-child(1) {
    top: 25px;
}

#navToggle span:nth-child(2) {
    top: 33px;
}

#navToggle span:nth-child(3) {
    top: 41px;
}

.sp {
    right:-100%;
}

/*Media-queries_____________________________________*/

@media screen and (max-width: 896px) {
    nav {
        display: none;
    }

    header .sp {
        bottom:-100%;
		top:auto;
		transition:.3s;
    }

    /*header menu*/
    .openNav .sp {
        /*-moz-transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);*/
		bottom:0;
    }

    #navToggle {
        display: block;
    }

    /* Click Toggle(Button) */
    .openNav #navToggle span:nth-child(1) {
        top: 32px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .openNav #navToggle span:nth-child(2),
    .openNav #navToggle span:nth-child(3) {
        top: 32px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
    }
}

@media screen and (max-width: 699px) {
	
	#navToggle{
		width: 40px;
		height: 40px;		
	}
	#navToggle span{
		width: 13px;
		height: 2px;		
	}
	#navToggle span:nth-child(1){
		top:14px;
	}
	#navToggle span:nth-child(2){
		top:18px;
	}
	#navToggle span:nth-child(3){
		top:23px;
	}
	.openNav #navToggle span:nth-child(1) ,
    .openNav #navToggle span:nth-child(2),
	.openNav #navToggle span:nth-child(3){
		top:18px;
	}	
	
}

/**
nav > ul > li > a {
    background: url(../parts/icon_arrow_04.png) no-repeat 96% 50%;
}*/