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

header{
	margin: 10px auto;
}
header img{
	width: 20%;
    text-align: left;
    display: block;
}
#sp_nav{
	display: none;
}
td.table_left{
		padding: 10px;
		box-sizing: border-box;
		vertical-align: top;
	}
p.necessary{
		font-size: .8rem;
	}
input.mail{
	margin-bottom: 10px;
}
button,
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}
input[type="submit"],
input[type="button"]{
	width: 40%;
    padding: 5px;
    box-sizing: border-box;
    font-size: 16px;
    border: 1px solid #aaa;
}
input[type="submit"]:hover,
input[type="button"]:hover{
	background: #03408a;
	color: #fff;
}
footer{
	padding-top:  20px;
	text-align: center;
}
footer img{
	width: 46%;
}
footer p{
	font-size: 12px;
}



@media only screen and (max-width: 767px) {
	body,
	#all{
		width: 100%;
	}
	header img{
		width: 24%;
	}
	/* ナビ */
	#sp_nav{
		display: block;
	}
	nav.NavMenu{
	 position: fixed; 
	 z-index: 2;
	 top: 0;
	 left: 0;
	 background: #fff;
	 color: #000;
	 text-align: center;
	 width: 100%;
	 transform: translateY(-100%);
	 transition: all 0.6s;
	}

	nav.NavMenu ul{
	 background: #EFEFEF; 
	 width: 100%;
	 margin: 0 auto;
	 padding: 0;
	}

	nav.NavMenu ul li{
	 font-size: 1.1em;
	 list-style-type: none;
	 padding: 0;
	 width: 100%;
	 border-bottom: 1px dotted #333;
	}

	nav.NavMenu ul li:last-child{
	 padding-bottom: 0;
	 border-bottom: none;
	}

	nav.NavMenu ul li a{
	 display: block;
	 color: #000;
	 padding: 1em 0;
	 text-decoration: none;
	}
	nav.NavMenu ul li:hover{
	background: #03408a;
	}
	nav.NavMenu ul li:hover a{
	color: #fff;
	}
	nav.NavMenu.active{
	 transform: translateY(0%);
	}
	.Toggle {
		display: block;
		position: absolute;
		right: 13px;
		top: 12px;
		width: 42px;
		height: 42px;
		cursor: pointer;
		z-index: 3;
	}

	.Toggle span {
		display: block;
		position: absolute;
		width: 30px;
		border-bottom: solid 3px #000;
		-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
		-moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
		transition: .35s ease-in-out;			/*変化の速度を指定*/
		left: 6px;
	}

	.Toggle span:nth-child(1) {
		top: 9px;
	}

	.Toggle span:nth-child(2) {
		top: 18px;
	}

	.Toggle span:nth-child(3) {
		top: 27px;
	}

	/* 最初のspanをマイナス45度に */
	.Toggle.active span:nth-child(1) {
		top: 18px;
		left: 6px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	/* 2番目と3番目のspanを45度に */
	.Toggle.active span:nth-child(2),
	.Toggle.active span:nth-child(3) {
		top: 18px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	/* form */	
	select{
		font-size:18px;
		display:block;
		height: 2em;
		margin-bottom:1em;
		width:100%;
		box-sizing:border-box;
	}
	input{
		width:100%;
		height: 2em;
		font-size:18px;
		margin-bottom:1em;
		box-sizing:border-box;
	}
	input[type="submit"],
	input[type="button"]{
		height: 3em;
	}
	input.tel{
		width: 5rem;
	}
	input.mail{
		margin-bottom:1em;
	}
	table .area{
		margin:0 0 20px 0;
	}
	td.table_left{
		padding: 10px 5px;
	}
	
	
	
	footer img{
		width: 50%;
	}



}/*END*/