@charset "utf-8";
/* CSS Document */


#sp-header { margin:0px; padding:0px}

.sph-left { float:left; width:60%}
.sph-left img { width:100%; margin:10px}

.sph-right { float:right; width:40%; text-align:right}
.sph-right img { width:30%; margin:10px}

a.menu {}



.top {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	z-index: 2;
	width:100%;

	
}





.drawer {
    display: none;
    z-index: 1000;
    -webkit-transform: translate3d(0, -400px, 0);
    -moz-transform: translate3d(0, -400px, 0);
    -o-transform: translate3d(0, -400px, 0);
    transform: translate3d(0, -400px, 0);
    -webkit-transition: -webkit-transform 0.25s linear;
    -moz-transition: -moz-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    transition: transform 0.2s linear;
}

.drawer.active {
    display: block;
    -webkit-transform: translate3d(0, 100px, 0);
    -moz-transform: translate3d(0, 100px, 0);
    -o-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
}









nav ul {
list-style:none;
}



.drawer ul { margin-bottom:-210px
}


.drawer ul li a {
display: block;
text-decoration: none;
background:#ffffff;
color:#000000;
padding:1em;
margin-bottom: 1px;
font-size:1.4rem;
border:1px #A8A8A8 solid;
font-weight:bold;
background-image:url(../img/sp-menu-arrow.png);
background-repeat:no-repeat;
background-position:right center
}



.drawer a:link { text-decoration: none; color:#000}
.drawer a:visited { text-decoration: none; color:#000}
.drawer a:hover { text-decoration: none; color:#000;opacity:0.8;
filter: alpha(opacity=80);
-ms-filter: "alpha( opacity=80 )"; text-decoration:none}
.drawer a:active { text-decoration: none; color:#000}



/* Fallbacks */

.no-csstransforms .top {
	position: static;
}

.no-csstransforms .drawer nav {
	display: none;
}

.no-csstransforms .drawer.active nav {
	display: block;
}



/* width 480以上　768px未満 */

@media screen and (min-width : 480px){	

/*header----------------------------------------*/

#sp-header { margin-bottom:-150px}
	  
	 
		 
	 
		 
	
}




/* width 768以上　1024px未満 */

@media screen and (min-width : 768px){	

#sp-header { display:none}

}


/* 他のスタイルの後に追加 */
.parent-element {
    overflow: visible; /* または適切な値に変更 */
}


