@charset "UTF-8";
/*drawerMenu.css */

#spNav { display:none; }
#navToggle { display:none; }

/*--------------------------------------------------------------
	SP　表示領域が1076px以下
--------------------------------------------------------------*/
@media (max-width:1076px) {

			/* 三 */
			#navToggle {
				display:block;
				position:fixed;
				right:0px;
				top:0px;
				width:60px;
				height:60px;
				padding:0px;
				cursor:pointer;
				z-index:2000003; /*3*/
				background:#0546a0;
			}

			#navToggle span {
				display:block;
				position:absolute;
				width:40%;
				left:0;
				right:0;
				margin:0 auto;
				border-bottom:solid 2px rgba(255,255,255,1);
				-webkit-transition: .35s ease-in-out;
				-moz-transition: .35s ease-in-out;
				transition: .35s ease-in-out
			}

			#navToggle span:nth-child(1) { top:22px; }
			#navToggle span:nth-child(2) { top:30px; }
			#navToggle span:nth-child(3) { top:38px; }

			/* header */
			header { position:fixed; top:0; left:0; width:100%; z-index:200002; /*2*/ }

			/* nav */
			nav { 
				position:fixed;
				visibility:hidden;
				clear:both;
				left:0;
				top:-1000px;
				width:100%;
				height:100%;
				padding:0;
				-webkit-transition:.5s ease-in-out;
				-moz-transition:.5s ease-in-out;
				-o-transition:.5s ease-in-out;
				transition:.5s ease-in-out;
				z-index:100000; /*0*/
				overflow:auto;
				-webkit-overflow-scrolling: touch;
			}
			
			#spNav { display:block; }
			
			/* ====================  Click時  ==================== */
			/* 三 */
			.openNav #navToggle {
				background:#0546a0;
			}
			
			.openNav #navToggle span:nth-child(1) {
				top:30px;
				-webkit-transform:rotate(-45deg);
				-moz-transform:rotate(-45deg);
				transform:rotate(-45deg)}

			.openNav #navToggle span:nth-child(2),
			.openNav #navToggle span:nth-child(3) {
				top:30px;
				-webkit-transform:rotate(45deg);
				-moz-transform:rotate(45deg);
				transform:rotate(45deg)}

			/* 下固定 */
			html.openNav { height:100%; overflow:hidden; }
			
			/* header */
			.openNav header { background:none; border:none; }
			.openNav header h1 { display:none; }
			
			/* nav */
			.openNav nav {
				visibility:visible;
				-moz-transform: translateY(1000px);
				-webkit-transform: translateY(1000px);
				transform: translateY(1000px);
				height:100%;
				overflow:auto;
				-webkit-overflow-scrolling: touch;
				/*background:rgba(255,255,255,1);*/
			}
			
}
