@charset "UTF-8";

/* root/index.css */

/* 共通項目*/


/* 見出し(各共通) */
h2.title {
	width: 100%;
	padding: 14px 5%;
	background-color: #039ADB;
	font-size: 1.5em;
	color: #fff;
	text-align: center;
	position: relative;
	margin-bottom: 60px;
	box-sizing:border-box;
}

h2.title:after {
    width: 0;
    bottom: -24px;
    border: solid 25px transparent;
    border-left-width: 28px;
    border-right-width: 28px;
    display: block;
    content: '';
    height: 0;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    border-top-color: #039ADB;
    border-bottom: none;
    z-index: 10;
}



/* section1 ****************************/
#sect1__s1 {
	width:100%;
	display:block;
	margin: 20px auto 35px auto;
}

#sect1__s1__catch {
	display:none;
}


#sect1__s1 img {
	width:100%;
}

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

#sect1__s2:after {
	content: "";
	display: block;
	clear: both;
}
#sect1__s3 {
	width:95%;
	font-size: 1.2em;
	text-align:center;
	margin:70px auto 0 auto;
} 
#sect1__s3 br {
	display:none;
}

#sect1__s2 li {
	width: 76%;
	text-align: center;
	margin: 0 auto 50px;
}

#sect1__s2 li:last-child {
	margin-bottom: 0;
}

#sect1__s2 li img {
	width: 100%;
	margin:0 auto 8px;
}

#sect1__s2 li span {
	font-size: 1.3em;
	font-weight: bold;
	letter-spacing: 0.07em;
	color: #039ADB;
	background: linear-gradient(transparent 60%, #ffff66 60%);
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(0.6, #fff),color-stop(0.6, #ffff66),to(#ffff66));
}

#sect1__s2 br {
	display:none;
}


/* section2 ****************************/
#sect2__s1 {
	width: 100%;
	display:block;
	margin:auto;
	padding-bottom: 20px;
	text-align: center;
}

#sect2__s1__mess-h, #step2__s1__car {
	width: 100%;
	margin-bottom: 20px;
}

#sect2__s2__mess-sp {
	width: 100%;
	margin: 10px 0 60px 0;
}

#sect2__s1__mess-w, #sect2__s2__mess {
	display:none;
}


#sect2__s2 {
	width: 100%;
	margin:auto;
	margin-bottom: 50px;
}

#sect2__s3 {
	width: 100%;
	margin: 0 auto;
	font-size: 0.9em;
}

#sect2__s3:after {
	content: "";
	display: block;
	clear: both;
}

#sect2__s3 li {
	width:45%;
	display: inline-block;
	vertical-align: top;
	margin:0 4.1% 40px 0;
}


#sect2__s3 li:nth-child(even) {
	margin:0 0 40px 4.1%;
}

#sect2__s3 li:nth-child(3),
#sect2__s3 li:nth-child(4) {
	margin-bottom:0;
}

#sect2__s3 li img {
	width: 100%;
	margin:0 auto 10px auto;
}



/* section3 ****************************/

#sect3__s1 {
	display:block;
	margin:auto;
  font-size: 0.9em;
}


#sect3__s1:after {
	content: "";
	display: block;
	clear: both;
}

#sect3__s1 li {
	width: 90%;
	margin: 0 auto 50px;
	text-align: center;
	box-sizing:border-box;
}

#sect3__s1 li p {
    padding: 0 0px;
}

#sect3__s1 li img {
	width: 100%;
	margin:0 auto 10px auto;
}

#sect3__s2 {
	color:#333;
	width:95%;
	font-size: 1.2em;
	text-align:center;
/*	font-weight: bold; */
	margin:70px auto 0 auto;

}


/* section3-1 ****************************/
#sect3-1__s1 {
	margin-bottom: 1rem;
}
#sect3-1__s1 img,
#sect3-1__s2
{
	width: 100%;
}
.sect3-1__s3 {
	font-size: 1rem;
}

/* section3-1 ****************************/
#sect3-2__s1 {
	margin-bottom: 1rem;
}
#sect3-2__s1 img,
#sect3-2__s2
{
	width: 100%;
}
.sect3-2__s3 {
	font-size: 1rem;
}
/* section4 ****************************/

.sect4__s1 {
	display:block;
	margin: 0 auto 40px auto;
	padding: 20px;
	
	box-sizing:border-box;
	background-image: url("img/sect4_s1_bg.png")
}

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

.sect4__s1 img {
	width: 100%;
	padding-bottom: 10px;
}


.sect4__s1 div {
	font-weight: bold;
	color: #fff;
	text-align:center;
	font-size:1.2em;
	padding-bottom: 10px;
	
	position:relative;
	margin:0 -8px 20px -30px;
	padding: 10px 20px;
	background:#039ADB;
}
 
.sect4__s1 div:before{
	content:" ";
	position:absolute;
	top:100%;
	left:0;
	width:0;
	height:0;
	border-width:0 10px 10px 0;
	border-style:solid;
	border-color:transparent;
	border-right-color:#026D9B;
}

/* section5 ****************************/
#sect5__s1 img {
	width: 100%;
	margin: 0 auto 40px auto;
}

#sect5__s1 dl {

}

#sect5__s1 dt {
	font-weight: bold;
	padding: 2px 2px 2px 4px;
	margin-bottom: 6px;
}

/*
#sect5__s1 dl dt {
	color: #039ADB;
	background-color: #DEF3FE;
}
*/

#sect5__s1 dl dt {
	color:#428538;
	background-color:#F0F8F0;
}


#sect5__s1 dl dt:last-of-type {
	background-color:transparent;
}

#sect5__s1 dd {
	margin-bottom: 30px;
}

#sect5__s1 dd:last-child {
	margin-bottom: 0;
}

#sect5__s2 {
	width:90%;
	margin:1.3em auto 1.3em auto;
}

#sect5__s3 {
	width:80%;
	text-align:center;
}

/* section6 ****************************/
#sect6__s2 {
	width: 100%;
	margin: 0 auto 2em auto;
}

#sect6__s3 caption {
	padding: 4px;
	background:#F3F4F6;
}

.sect6__midashi {
	font-size: 1.3em;
	font-weight: bold;
	padding-right: .5em;
}

#sect6__s3 {
	width: 100%;
	margin: 0 auto 10px auto;
	text-align: center;
}

#sect6__s3 td {
	padding: 4px;
}

#sect6__s3 tr:nth-child(odd) {
	background: #fff;
}
 
#sect6__s3 tr:nth-child(even) {
	background:#F3F4F6;
}

.sect6__s4 {
	margin-left:0em;
}

.sect6__s4 li {
	margin-bottom: 0.3em;
}
	
.sect6__s4 li:before {
	content:"※";
	margin-left:-1em;
}


/* section7 ****************************/

/* chrome auto-filling background colour */
input::-webkit-autofill {
	-webkit-box-shadow: 0 0 0px 1000px white inset;
}

input:-ms-input-placeholder
{
    color: #bbb;
    font-weight: normal;
}

input::-webkit-input-placeholder {
    color: #bbb;
    font-weight: normal;
}

input::-moz-placeholder {
    color: #bbb;
    font-weight: normal;
}

.sect7__form input {
    font-size:0.9em;
    width: 100%;
    height: 35px;
		border: solid 1px #ffcc80;
    cursor: pointer;
}

.sect7__form__input__hissu {
	background: #fff5e5;
}

.sect7__form {
	border-collapse: collapse;
}

.sect7__form th {
	margin-bottom: 4px;
}

.sect7__form td {
	margin-bottom: 18px;
}

.sect7__form th, .sect7__form td {
	width: 100%;
	display: block;
	text-align:left;
}


.psect7__form__hissu:after {
    content: "必須";
    display: inline-block;
    background: #FF9900;
    color: #ffffff;
    font-size: 0.6em;
    font-weight: 700;
    line-height: 100%;
    border-radius: 2px;
    padding: 0.3em 0.4em;
    position: relative;
    top: -2px;
	margin-left: 6px;
	font: 10px Arial;
}


.sect7__form input:focus {
	background-color: #fff;
}



.sect7__form input {
  font-size: 0.8em;
	font-weight: normal;
}



.sect7__btn {
	display:block;
	width: 60%;
	border: none;
	background: #FA960C;
	color: #FFF;
	margin: 20px auto 40px auto;
	padding: 10px;
	text-align:center;
	font-size: 1em;
	cursor:pointer;
}

.sect7_btn_return {
	background: #ccc;
	color: #FFF;
}

::-webkit-input-placeholder {
	font-weight: normal;
}




@media screen and (min-width: 481px) {
	
	section {
		font-size: 24px;
		margin-bottom: 110px;
	}

	h2.title {
		font-size: 1.8em;
		margin-bottom: 90px;
	}
	
	
	#sect1__s1 {
		margin:50px auto 70px auto;
	}	
	
	#sect1__s2 li {
		margin-bottom: 80px;
	}
	
	#sect1__s2 li span {
		font-size:1.4em;
	}


	#sect2__s1 {
		padding-bottom: 40px;
	}

	#sect2__s2 {
		margin-bottom: 80px;
	}

	#sect2__s2__mess-sp {
		margin-bottom: 90px;
	}

	#sect2__s3 li {
		margin:0 4.1% 70px 0;
	}
	
	
	#sect2__s3 li:nth-child(even) {
		margin:0 0 70px 4.1%;
	}
	
	#sect2__s3 li:nth-child(3),
	#sect2__s3 li:nth-child(4) {
		margin-bottom:0;
	}

	
	#sect3__s1 li {
		width: 76%;
		margin: 0 auto 80px;
		text-align: center;
		box-sizing: border-box;
	}
	

	.sect4__s1 div {
		margin-bottom: 26px;
	}
	

	#sect5__s1 img {
		margin-bottom: 40px;
	}
	
	#sect5__s1 dd {
		margin-bottom: 40px;
	}


	#sect6__s1 {
		width: 85%;
	}

	#sect7__s1 {
		width: 85%;
		
	}
	
	.sect7__form {
		margin: 20px auto 60px auto;
	}
	
	.sect7__form th {
		padding:0 0 6px 0;
	}
	
	.sect7__form td {
		width: 100%;
		padding:0 0 16px 0;
	}
	
	.sect7__form input {
		height: 1.2em;
		font-size: 1.1em;
	}

}



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

	#sect1__s1 {
		text-align:center;
	}
	
	#sect1__s1 img {
		width: 624px;
		margin: 8px 0 28px 0;
	}
	
	#sect1__s1__catch-sp {
		display:none;
	}
	
	#sect1__s1__catch {
		display:inline;
	}

	
	#sect1__s2 {
		text-align:center;
	}
	
	#sect1__s2 li {
		width: 26%;
		margin: 0 3.6%;
		float: left;
	}

	#sect1__s2 li span {
		font-size: 1.1em;
	}


	#sect2__s3 li:nth-child(-n+3) {
		margin:0 5.2% 0 0;
	}
	
	
	#sect2__s3 li:last-child {
		margin:0;
	}


	.sect7__form th {
		width: 32%;
		display: table-cell;
		text-align:left;
	}
	.sect7__form td {
		width: 68%;
		display: table-cell;
		text-align:left;
	}
	
}

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

	section {
		font-size: 19px;
		margin-bottom: 90px;
	}
	
	#sect1__s2 br {
		display: inline;
	}
	
	#sect2__s1__mess-h,
	#sect2__s2__mess-sp {
		display:none;
	}
	
	#sect2__s1__mess-w {
		width: 50%;
		display: inline;
		float:right;
	}
	
	#step2__s1__car {
		width: 48%;
		float: left;
		margin-right: 2%;
	}
	
	#sect2__s2__mess {
		display:block;
		padding: 50px 0 90px 0;
		margin: 0 auto;
	}
	
	#sect2__s3 li {
		width: 21%;
		float: left;
		margin: 0 2% 0px 2%;
		display: block;
		font-size: 0.95em;
	}
	

	#sect3__s1 li {
		width: 26%;
		margin: 0 3.6%;
		float:left;
	}
	
	/* section3-1 ****************************/
	#sect3-1__s1 {
		width: 45%;
		padding-right: 5%;
		float: left;
	}
	#sect3-1__s1 img {
		width: 100%;
	}


	#sect3-1__s2 {
		width: 50%;
		float: right;
	}

	#sect3-1__s2 p {
		margin-top: 0;
	}
	
/* section3-1 ****************************/
	#sect3-2__s1 {
		width: 45%;
		padding-left: 5%;
		float: right;
	}
	#sect3-2__s1 img {
		width: 100%;
	}


	#sect3-2__s2 {
		width: 50%;
		float: left;
	}

	#sect3-2__s2 p {
		margin-top: 0;
	}

	
	
	.sect4__s1 {
		width: 44%;
		margin: 0 3%;
		float: left;
	}
	


	#sect5__s1 img {
		width: 50%;
		display:block;
		float:left;
		margin-right: 5%;
		box-sizing:border-box;
	}

	#sect5__s1 dl {
		width: 45%;
		float:left;
		padding: 0 0 0 20px;
		box-sizing:border-box;
	}
	

	.sect7__form input {
		height: 1.4em;
		font-size: 1.2em;
	}
	
	.sect7__form th, .sect7__form td {
		border-bottom: dotted 1px #ccc;
		padding: 20px;
	}
}	

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

	#sect1__s3 br {
		display: inline;
	}
}

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

	section {
		width: 1000px;
	    margin-bottom: 100px;
	}
	
	#sect1__s2 br {
		display: none;
	}
}