@charset "UTF-8";

header{border-bottom: 1px solid #1f2c5c;}
footer{border-top: 1px solid #1f2c5c;}

.wrapper.contact{
	width: 980px;
	display: block;
	margin: 0 auto;
	font-family: "Noto Sans JP", sans-serif;
}
.wrapper.contact .contents{
	margin-bottom: 0;
	border: none;
}

.pageKeyvisual.contact h1{
	height: 0;
	padding-top: 113px;
	overflow: hidden;
	background: url(img/contact_title.png) center bottom no-repeat;
}

.contact__red{
	color: #e7380d;
}
.contact label.error {
	color: #e7380d;
	font-size: 12px;
	font-weight: bold;
	display: none;
	margin-right: 2em;
}
.contact__small{
	font-size: 12px;
	margin-bottom: 5px;
}
.contact__reqired{
	margin-left: 0.5em;
}

.contact h2 {
	text-align: center;
}
.contact .contents {
	padding: 50px 0;
	font-size: 14px;
}

/* form table -------------------------*/
.contact__table {
	margin-bottom: 45px;
}
.contact__table th,
.contact__table td {
	padding: 1em 0;
}
.contact__table th {
	width: 200px;
	font-size: 16px;
	padding-right: 3em;
	vertical-align: top;
	white-space: nowrap;
	font-weight: bold;
}


/* form 内部部品 -------------------------*/

.contact input[type="radio"] {margin-right: 0.5em;}
.contact input[type="text"],
.contact input[type="email"],
.contact input[type="tel"],
.contact textarea {
	width: 100%;
	border:0;
	border: 1px solid #cccccc;
	padding: 0.25em 1em;
	box-sizing: border-box;
	min-height: 60px;
}
.contact input[type="email"] {
	margin-bottom: 0.5em;
}
.contact .check_list li {
	display: inline-block;
	margin-right: 20px;
	position: relative;
	margin-bottom: 10px;
}

.contact__privacy{
	text-align: center;
	margin-bottom: 30px;
}
.contact__privacy a{
	color: #e7380d;
	border-bottom: 1px solid #e7380d;
}
.contact__confirm{
	text-align: center;
}
.contact__confirm button{
	width: 400px;
	line-height: 80px;
	font-weight: bold;
	color: #fff;
	background-color: #fff;
	color: #222426;
	border: 0;
	font-size: 16px;
	border: 1px solid #222426;
	transition: 0.3s;
}
.contact__confirm button:hover{
	background: #222426;
	color: #fff;
}
.contact #mail-label{
	display: block;
}

td.checkboxCol input{margin-bottom: 10px;}
td.checkboxCol p{font-size: 12px;}
td.checkboxCol p a{color: #000; text-decoration: underline;}

/* form 送信完了 -------------------------*/

.contact .contents .contact__thanks{
	text-align: center;
	margin-bottom: 150px;
}
.contact .contents .contact__thanks img{
	margin-bottom: 45px;
}
.contact .contents .contact__thanks h3{
	font-size: 32px;
	margin-bottom: 60px;
	font-weight: bold;
	color: #222426;
}
.contact .contents .contact__thanks p{
	margin-bottom: 1.5em;
}
.contact .contents .contact__thanks a{
	color: #666666;
	display: inline-block;
	transition: 0.3s;
	/*margin-top: 100px;*/
}
.contact .contents .contact__thanks a:hover{
	color: #fff;
	background: #222426;
}
.contact .back-home{
	width: 200px;
	height: 40px;
	display: block;
	margin: 100px auto 0;
}
.contact .back-home a{
	width: 100%;
	line-height: 40px;
	display: block;
	border: 1px solid #222426;
	font-size: 13px;
	text-align: center;
}


/*edit_20190820*/
.policyCheckBlock{
	margin-bottom: 20px;
}
.policyCheckBlock .innerConte{
	width: 100%;
	border:1px solid #999999;
	box-sizing: border-box;
	padding: 33px;
}
.policyCheckBlock .innerConte .paddingParts{
	height: 204px;
	overflow: scroll;
}

.policyCheckBlock .innerConte h5{
	font-size: 16px;
	font-weight: bold;
	display: block;
	margin-bottom: 20px;
}
.policyCheckBlock .innerConte ul{}
.policyCheckBlock .innerConte ul li{
	text-indent: -2em;
	padding-left: 2em;
	font-size: 13px;
	margin-bottom: 25px;
}
.policyCheckBlock .innerConte ul li strong{
	display: block;
	font-weight: bold;
}

.agreeBlock{
	background:#f3f3f3;
	padding: 14.5px 0;
	margin-bottom: 50px;
}
.agreeBlock label{
	width: 220px;
	margin: 0 auto;
	display: block;
}
.agreeBlock label span{
	font-size: 13px;
	font-weight: bold;
}

.contact__confirm button.noPolicy{
	background: #cccccc;
	pointer-events: none;
	border: none;
	color: #fff;
}

/*edit*/
#wrapper.page{}
.kv.page{
	margin-bottom: 80px;
	height: auto;
}
.kv.page h2{
	text-align: center;
	font-size: 34px;
	color: #FFF;
	height: 32px;
}

.page .main-read{
	margin-bottom: 60px;
}
.page .main-read p{
	text-align: center;
	font-size: 14px;
	line-height: 2em;
	font-family: "Noto Sans JP", sans-serif;
}
.page .main-read h4{
	font-size: 22px;
	display: block;
	text-align: center;
	line-height: 1.72727272727em;
	margin-bottom: 20px;
}

.kv.page .contact{
	/* background: url(img/kv_contact.jpg) no-repeat top center; */
	background: #151e49;
	background-size: cover;
	min-height: 200px;
}

.chart-img{}
.chart-img img{
	width: 100%;
}

.my-radio {
  position: relative;
  margin: 0.5em 0; /* 前後のスペース */
  padding-left: 28px;
  cursor: pointer;
  user-select: none;
}
/* inputは非表示にする */
.my-radio input {
  display: none;
}
/* 常に表示する枠線の円 */
.radio-mark {
  position: absolute;
  top: 0; /* 上からの位置 */
  left: 0;
  height: 22px; /* 大きさ */
  width: 22px; /* 大きさ */
  border: solid 2px #d4dae2; /* 線 */
  border-radius: 50%;
  box-sizing: border-box;
}
/* 選択時に重ねる円 */
.radio-mark:after {
	content: "";
	position: absolute;
	background: #000;
	border-radius: 50%;
	width: 12px;
	height: 12px;
	top: 3px;
	bottom: 3px;
	left: 3px;
	right: 3px;
  opacity: 0; /* 透明にしておく */
}
/* 選択時に重ねた円の透明を解除 */
.my-radio input:checked + .radio-mark:after {
  opacity: 1;
}

.my-radio label{
	padding-left: 30px;
	position: relative;
	top: -3px;
}

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


	.kv.page .contact{
		/* background: url(img/kv_contact_sp.jpg) no-repeat top center; */
		background: #151e49;
		background-size: 100%;
		min-height: 200px;
	}
	.kv.page{margin-bottom: 40px;}
	.kv.page h2{font-size: 26px;height: 136px;}

	.pageKeyvisual.contact{
		padding-top: 35px;
		height:75px;
		/*width:100%;*/
		min-width:0;
		/*background-color: #eee;*/
		padding-bottom: 3em;
	}

	.pageKeyvisual.contact h1{
		/*height: 0;*/
		padding-top: 45px;
		/*overflow: hidden;*/
		background: url(img/contact_title_sp.png) center bottom /contain no-repeat;
	}

	/*.contact__red{*/
		/*color: #e7380d;*/
	/*}*/
/*.contact label.error {*/
	/*color: #e7380d;*/
	/*font-size: 12px;*/
	/*font-weight: bold;*/
	/*display: none;*/
	/*margin-right: 2em;*/
/*}*/
	.contact__small{
		font-size: 12px;
	}
	.contact__reqired{
		margin-left: 0.5em;
	}

	.contact h2 {
		text-align: center;
		margin-bottom: 23px;
	}
	.contact .contents {
		padding: 55px 150px;
		padding: 20px 10px;
		font-size: 14px;
	}

	/* form table -------------------------*/
	.contact__table {
		/*border-bottom: 1px solid #000;*/
		margin-bottom: 45px;
	}
	.contact__table th{
		font-weight: bold;
	}
	.contact__table th,
	.contact__table td {
		padding: 1em 0 0.25em;
		/*border-top: 1px solid #000;*/
		display: block;
		width: 100%;
		margin-right: 0;
	}
	.contact__table td {
		border-top: none;
		padding-top: 0;
		padding-bottom: 1em;
		font-weight: normal;
	}
	/*.contact__table th {
		width: 200px;
		padding-right: 3em;
		white-space: nowrap;
	}
	*/

	/* form 内部部品 -------------------------*/

	.contact__table label {display: block;top: 0; padding-left: 40px;}
	/* .contact__table label {display: block;top: 0; padding-left: 0px;} */
	.contact input[type="radio"] {margin-right: 0.5em;}
	.contact input[type="text"],
	.contact input[type="email"],
	.contact input[type="tel"],
	.contact textarea {
		width: 100%;
		background-color: #fff;
		border: 0;
		border: 1px solid #cccccc;
		padding: 0.75em 1em;
		box-sizing: border-box;
		border-radius: 0;
	}
	.contact input[type="email"] {
		margin-bottom: 0.5em;
	}
	.contact input[type="radio"] {
		display: none;
	}
	.contact .check_list li {
		display: block;
		margin-right: 0;
		margin-bottom: 0.35em;
		height: 40px;
		box-sizing: border-box;
		line-height: 40px;
		border: 1px solid #ccc;
	}
	.contact .check_list li.on{
		background: #000;
		color: #fff;
	}
	.contact .check_list li.on .radio-mark{
		height: 20px;
		width: 20px;
		box-sizing: border-box;
		top: 8px;
		left: 8px;
		background: #fff;
		border: none;
	}
	.contact input[type="radio"]+label{
		border: 1px solid #999999;
		border-radius: 5px;
		padding: 0.5em 1em 0.5em 2.5em;
		position: relative;
	}
	.contact input[type="radio"]+label:after{
		content: '';
		display: block;
		background: url(img/check_sp.png) 0 0 /contain no-repeat;
		position: absolute;
		width: 16px;
		height: 16px;
		top: calc(50% - 8px);
		left: 10px;
	}
	.contact input[type="radio"]:checked+label{
		background-color: #e7380d;
		color: #fff;
	}
	.contact input[type="radio"]:checked+label:after{
		background: url(img/check_sp_on.png) 0 0 /contain no-repeat;
	}
	.contact__privacy{
		text-align: center;
		margin-bottom: 30px;
		font-size: 13px;
		letter-spacing: -0.1em;
	}
	.contact__privacy a{
		color: #e7380d;
		border-bottom: 1px solid #e7380d;
	}
	.contact__confirm{
		text-align: center;
		padding: 0 10px 20px;
	}
	.contact__confirm button{
		width: 100%;
		line-height: 1.5;
		padding: 1em;
		color: #222426;
		background-color: #fff;
		border: 1px solid #222426;
		font-size: 16px;
	}


	/* form 送信完了 -------------------------*/

	.contact .contents .contact__thanks{
		text-align: center;
		margin-top: 0px;
	}
	.contact .contents .contact__thanks img{
		width: 20%;
		margin-bottom: 20px;
	}
	.contact .contents .contact__thanks h3{
		font-size: 17px;
		margin-bottom: 1.5em;
	}
	.contact .contents .contact__thanks p{
		margin-bottom: 1.5em;
		line-height: 1.75;
		font-size: 13px;
		padding: 0 1em;
	}
	.contact .contents .contact__thanks a{
		color: #222426;
		display: inline-block;
		margin-top: 0;
		background-color: #fff;
		padding: 0;
		border-radius: 0;
		margin-bottom: 0;
	}
	.contact .contents .contact__thanks a:hover{
		color: #e7380d;
	}
	.contact .back-home {
		margin: 30px auto 0;
	}

	/*edit_20190820*/
	.policyCheckBlock .innerConte{
		padding: 20px 25px;
	}
	.policyCheckBlock .innerConte h5{
		font-size: 14px;
	}
	.policyCheckBlock .innerConte ul li{
		text-indent: -2em;
		padding-left: 2em;
		font-size: 12px;
		margin-bottom: 15px;
		line-height: 1.53846153846em;
	}
	.agreeBlock {
		background: #f3f3f3;
		padding: 14px 0px;
		margin-bottom: 50px;
		width: calc(100% - 20px);
		display: block;
		margin: 0 auto 25px;
	}

	.wrapper.contact{
		width: calc(100% - 40px);
		display: block;
		margin: 0 auto;
	}
	.radio-mark {
		height: 20px;
		width: 20px;
		box-sizing: border-box;
		top: 8px;
		left: 8px;
	}
	.radio-mark:after {
		content: "";
		position: absolute;
		background: #000;
		border-radius: 50%;
		width: 10px;
		height: 10px;
		top: 5px;
		bottom: 5px;
		left: 5px;
		right: 5px;
	}



}