@charset "utf-8";

/* !Reseting
---------------------------------------------------------- */

body {
	font-family: Meiryo,sans-serif;
	font-size: small;
	-webkit-text-size-adjust: 100%;
	color: #000;
	line-height: 1.7;
	background: #fff;
	margin: 0 auto;
	width: 100%;
	font-size: 16px;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: #000;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

.left {
	float: left;
}

.right {
	float: right;
}

h2,h3 {
	text-align: center;
}



/* !Clearfix
---------------------------------------------------------- */

.clearfix {
	zoom: 1;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

.clear {
	clear: both;
}

/* ! Media Queries （使用の場合はIE対策にrespond.jsを入れる事）
---------------------------------------------------------- */

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

	header,
	section,
	footer,
	nav {
		max-width: 640px;
		margin: 0 auto;
	}

}


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

header {
	background: url("../img/header_bg.png");
	padding: 2% 0% 1%;
	overflow: hidden;
	position: fixed;
    top: 0;
	width: 100%;
}

header .left {
	margin: 3% 0 0 1%;
    width: 41%;
}


header .right {
	text-align: right;
	width: 41%;
	margin: 0 1% 0 0;
}

/* key_v
--------------------------------------------------*/

#key_v {
	background: url("../img/key_v_bg.png") no-repeat;
	background-size: 100%;
	margin: 16.5% auto 0.5%;
}

#key_v h1 {
	padding: 3% 0 0 1%;
}

#key_v h2 {
	padding: 2% 0 1%;
}

/* cta
-----------------------------------------------------*/

.cta {
	background: url("../img/cta_base.png");
	background-size: 100%;
	margin: 0% auto 2%;
}

.cta div {
	margin: 0 auto;
    padding: 42% 0 3%;
    text-align: center;
    width: 87%;
}

/* section1
------------------------------------------------------------*/

#section1 {
	background: #eff1f2;
}

#section1 h2 {
	padding: 1% 0 1%;
	text-align: center;
}

#section1 .base {
	background: url("../img/sec1_base.png");
	width: 98%;
	margin: 1% auto;
	box-shadow: 0 0 1px 1px #CFCFCF;
}

#section1 .base p {
	font-size: 16px;
	width: 92%;
	margin: 0% auto 0;
	padding: 3% 0 1%;
}

#section1 .base h3 {
	margin: 0 auto;
    text-align: center;
    width: 92%;
}

#section1 .base div {
	margin: 2% 0 0;
	text-align: center;
}

/* section2
------------------------------------------------------------*/

#section2 {
	background: #f6f6f6;
	padding: 0 0 2%;
}

#section2 ul {
	padding: 4% 0 0.1%;
	background: #f6f6f6;
}

#section2 ul li {
	margin: 0 auto 4%;
	width: 95%;
	border: 5px #e4e4e1 solid;
	background: #fafafa;
	overflow: hidden;
}

#section2 ul li h3 {
	width: 95%;
	margin: 0 auto;
	padding: 3% 0 0;
}

#section2 ul li p {
	padding: 3% 0 0;
	width: 95%;
	margin: 0 auto;
}

#section2 ul li div {
	padding: 3% 0;
	width: 95%;
	margin: 0 auto;
}

#section2 ul li div.right {
	width: 34%;
	margin:0 3% 0 0;
}

#section2 ul li div.left {
	width: 56%;
	margin: 0 0 0 3%;
}

#section2 .pic {
	display: none;
}

/* section3
------------------------------------------------------------*/

#section3 {
	background: url("../img/sec3_arrow_bg.png") no-repeat center top;
	background-size: 100%;
	padding: 30% 0 0;
}

#section3 h3 {
	margin: 1% 0 0;
}

/* section4
------------------------------------------------------------*/

#section4 {
	background: url("../img/sec4_bg.png");
	padding: 10% 0 4%;
	text-align: center;
	margin: 0 auto 2%;
}

#section4 h2 {
	padding: 0 0 3%;
}

#section4 p {
	width: 95%;
	margin: 0 auto;
	padding: 3% 0 0;
	text-align: left;
}

#section4 .graf {
	margin: 2% 0 0;
}

#section4 h3 {
	padding: 5% 0 0;
}

/* section5
------------------------------------------------------------*/

#section5 {
}

#section5 .bg {
	background: url("../img/sec5_bg.png");
	padding: 5% 0 80%;
}

#section5 .bg .base {
	background: url("../img/sec5_base_top_bg.png") no-repeat top #fff;
	background-size: 100%;
	width: 98%;
	margin: 0 auto;
	padding: 8% 0 3%;
}

#section5 .bg .base h2 {
	width: 96%;
	margin: 0 auto;
}

#section5 .bg .base ul {
	margin: 3% 0 0;
}

#section5 .bg .base ul li {
	background: #f6f4f0;
	border: 1px solid #ebe7dd;
	overflow: hidden;
	width: 95%;
	margin: 0 auto 4%;
	padding: 0 0 1%;
}

#section5 .bg .base ul li div {
	padding: 3% 0 0;
	text-align: center;
}

#section5 .bg .base ul li p {
	width: 94%;
	margin: 3% auto 0;
}

#section5 .bg .base ul li p span {
	float: right;
	font-size: 15px;
}

#section5 .pic {
	margin: -85% auto 0;
	text-align: center;
}

/* section6
------------------------------------------------------------*/

#section6 {
	background: url("../img/sec6_bg.png");
	padding: 0 0 5%;
}

#section6 .subti {
	width: 100%;
}

#section6 div {
	width: 71%;
	margin: 3% auto 0;
}

#section6 p {
	margin: 3% auto 0;
	width: 90%
}

#section6 h3 {
	margin: 5% 0 0;
}

/* section7
------------------------------------------------------------*/

#section7 {
	background: #fff;
	padding: 5% 0 0;
}

#section7 div {
	text-align: center;
}

#section7 h2 {
	margin: 3% 0 0;
}

#section7 h3 {
	margin: 3% 0 0;
}

#section7 .base {
	background: #0b344d;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #0b344d;
	width: 97%;
	margin: 3% auto 0;
	padding: 5% 0 3%;
}

#section7 .base h4 {
	width: 95%;
	margin: 0 auto;
}

#section7 .base form table {
	width: 95%;
	background: #fff;
	margin: 2% auto 0;
	padding: 0 0 3%;
}

#mailformpro {
	width: 100%;
	margin: 5% auto 0;
}

.must-tip {
	margin: 1% 0px;
	color: #fff;
}

#mailformpro table th {
	font-weight: normal;
	text-align: left;
	vertical-align: middle;
	border: 1px solid #ccc;
	padding: 2% 2%;
	font-size: 12px;
}

#mailformpro table ul li {
	margin: 0 1% 0 0;
}

#mailformpro table th.hissu {
	border-left: #fb5c0a 8px solid;
}

#mailformpro table th.nini {
	border-left: #fb5c0a 8px solid;
}

#mailformpro table th.must span {
	background: none repeat scroll 0 0 #b90104;
    border-radius: 5px;
    color: #fff;
    margin: 0 0 0 5%;
    padding: 0.5% 2%;
    text-align: center;
}

#mailformpro table th.nini span {
	background: none repeat scroll 0 0 #132f68;
    border-radius: 5px;
    color: #fff;
    margin: 0 0 0 5%;
    padding: 0.5% 2%;
    text-align: center;
}

#mailformpro table td {
	padding: 3% 2%;
	text-align: left;
}

#mailformpro table tr:hover {
	background: #f6f6f6;
}

#mailformpro table td p {
	color: #aaa;
	font-size: 15px;
}

#mailformpro table tr:hover p {
	color: #888;
}

#mailformpro table td input,
#mailformpro table td textarea {
	border: 1px solid #aaa;
	padding: 1%;
}

#mailformpro table td textarea {
	width: 90%;
}

#mailformpro .zip {
	border: 1px solid #aaa;
	background: #fff;
}

#mailformpro .zip:hover {
	cursor: pointer;
	background: #def;
}

#mailformpro .submit {
	text-align: center;
}

#mailformpro .submit button {
	display: block;
	background: url("../img/form_button.png") no-repeat;
	width: 100%;
	margin: 3% auto 0 ;
	border: none;
	padding: 0 0 9%;
	text-indent: -9999px;
	background-size: 100%;
}

/* section8
------------------------------------------------------------*/

#section8 {
	margin: 3% auto 0;
}

/* section9
------------------------------------------------------------*/

#section9 {
	margin: 0% auto 2%;
}

#section9 table {
	width: 97%;
	margin: 3% auto ;
	border: 1px solid #bdb8aa;
	font-size: 13px;
}

#section9 table th {
	text-align: left;
	font-weight: normal;
	padding: 1% 0 1% 1%;
	border: 1px solid #bdb8aa;
	background: #f2f1ed;
	vertical-align: middle;
}

#section9 table td {
	text-align: left;
	padding: 2% 0 2% 1%;
	vertical-align: middle;
}

/* !footer
---------------------------------------------------------- */

footer {
	text-align: center;
	padding: 0.3% 0;
	background: url("../img/header_bg.png");
	color: #fff;
	margin: 3% auto 0;
}

/* thanks
-------------------------------------------------------------------*/

#thanks {
	text-align: center;
	padding: 22% 0 3%;
	background: url(img/sec6_bg.png);
}

#thanks h1 {
	margin: 3% 0;
}

#thanks div {
	margin: 12% 0 0;
}

#thanks p {
	margin: 4% auto;
	text-align: left;
	width: 96%;
	font-size: 15px;
}

#thanks h2 {
	width: 97%;
	margin: 0 auto;
}

p#thanks_btn {
	height: 2%;
	margin: 3% auto 2%;
}

#thanks .button {
	display: inline-block;
	width: 95%;
	height: 2%;
	border-bottom: 5px solid #207502;
	background: #319f0b;
	margin: 2px auto 0;
}

#thanks .button:hover {
	border-bottom: none;
	background: #319f0b;
	margin: 7px auto 0;
}