.topimg {
	background-image:url(../img/contact/top.JPG);
}

article {
	margin: 0 auto;
	
}

#main {
	width: 960px;
	margin: 0 auto;
}

article #main h1 {
	margin: 0;
	padding: 0;
	border: none;
	margin:24px 0;
	text-align: center;
}

#mailform {
	margin: 32px auto;
	width: 640px;
	text-align: center;
}

#mailform .field {
	margin: 4px;
	padding: 0 8px;
	width: 214px;
	height: 32px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}

#mailform .mail{
	width: 456px;
}

#mailform textarea {
	width: 458px;
	height: 160px;
	padding: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}

#mailform #button {
	width: 192px;
	height: 32px;
	background:black;
	color: white;
	font-weight: bold;
	margin-top: 16px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
	transition: opacity linear 0.1s;
}

#button:hover {
	opacity: 0.6;
}

#box {
	margin: 16px auto;
	padding: 16px;
	padding-top: 8px;
	width: 446px;
	border: solid 1px #AAA;
	background:#FFF;
	border-radius:8px;
}

#box h2{
	margin: 0;
	margin-top: 8px;
	margin-bottom: 12px;
	padding: 0;
	text-align: center;
	border: none
}

#box table {
	width: 360px;
	margin: 0 auto;
}

#box p {
	margin: 24px auto;
	text-align: center;
}

#box .item {
	float: left;
	width: 88px;
	margin: 0 10px 16px -30px;/*0 16px 16px 0; アドレス変更により右に飛び出たのでずらした*/
	padding: 0;
	font-size: 20px;
	font-weight: bold;
	text-align: right;
}

#box .num {
	float:left;
	width: 256px;
	margin: 0 0 16px 0;
	padding: 0;
	font-size: 20px;
	font-weight: bold;
}

/*--------------------------------------------------------------------------------------------*/


@media only screen and (min-width: 437px) and (max-width: 960px) {
/*タブレット用スタイル*/

	article {
		margin: 0 auto;
		
	}

	#main {
		width: 100%;
		margin: 0 auto;
	}

	article #main h1 {
		margin: 0;
		paddin: 0;
		margin-top:24px;
		text-align: center;
		font-size: 28px;
	}

	#mailform {
		margin: 32px auto;
		width: 80%;
		text-align: center;
	}

	#mailform .field {
		margin: 0 3%;
		padding: 0 1%;
		width: 40%;
		height: 32px;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
	}
	#mailform .mail{
		width: 88%;
	}

	#mailform textarea {
		width: 88%;
		height: 160px;
		padding: 8px;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
	}

	#mailform #button {
		width: 30%;
		height: 32px;
		background:black;
		color: white;
		font-weight: bold;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
		transition: opacity linear 0.1s;
	}

	#button:hover {
		opacity: 0.6;
	}

	#box {
		margin: 16px auto;
		margin-bottom: 56px;
		padding: 1%;
		width: 70%;
		height: 320px;
		background:#EEE;
		border-radius:8px;
	}

	#box h2{
		text-align: center;
		font-size: 18px;
	}

	#box table {
		width: 80%;
		margin: 0 auto;
	}

	#box p {
		margin: 24px 1%;
		text-align: center;
	}

	#box .item {
		float: left;
		width: 24%;
		margin: 0 2% 16px 0;
		padding: 0;
		font-size: 18px;
		font-weight: bold;
		text-align: right;
	}

	#box .num {
		float:left;
		width: 60%;
		margin: 0 0 16px 0;
		padding: 0;
		font-size: 18px;
		font-weight: bold;
	}

}

/*--------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 436px) {
/*スマホ用スタイル*/

	article {
		margin: 0 auto;
		
	}

	#main {
		width: 100%;
		margin: 0 auto;
	}

	article #main h1 {
		margin: 0;
		paddin: 0;
		margin-top:24px;
		text-align: center;
		font-size: 22px;
	}

	#mailform {
		margin: 32px auto;
		width: 98%;
		text-align: center;
	}

	#mailform .field {
		margin: 0 1%;
		padding: 0 1%;
		width: 44%;
		font-size: 12px;
		height: 24px;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
	}
	#mailform .mail{
		width: 94%;
	}

	#mailform textarea {
		font-size: 12px;
		width: 96%;
		height: 160px;
		padding: 1%;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
	}

	#mailform #button {
		width: 30%;
		height: 30px;
		font-size: 16px;
		background:black;
		color: white;
		font-weight: bold;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
		transition: opacity linear 0.1s;
	}

	#button:hover {
		opacity: 0.6;
	}

	#box {
		margin: 12px auto;
		margin-bottom: 40px;
		padding: 2%;
		width: 92%;
		height: 240px;
		background:#EEE;
		border-radius:8px;
	}

	#box h2{
		margin-top: 8px;
		text-align: center;
		font-size: 16px;
	}

	#box table {
		margin-top: 8px;
		width: 100%;
		margin: 0 auto;
	}

	#box p {
		margin-top: 8px;
		text-align: center;
		font-size: 12px;
	}

	#box .item {
		float: left;
		width: 25%;
		margin: 0 2% 8px 0;
		padding: 0;
		font-size: 14px;
		font-weight: bold;
		text-align: right;
	}

	#box .num {
		float:left;
		width: 60%;
		margin: 0 0 8px 0;
		padding: 0;
		font-size: 14px;
		font-weight: bold;
	}


}