@charset "UTF-8";

/* ▼▼▼ お問い合わせ
=====================================*/
.title_box{background: url(../img/contact/title_bg.jpg)no-repeat top center/cover;}
.title_box h1{font-size: 70px;}

.read{
	text-align: center;
	margin-bottom: 50px;
	}
ul.step{
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 500px;
	margin: 0 auto 90px;
	}
	ul.step li{
		width: 27%;
		color: #989898;
		text-align: center;
		font-weight: bold;
		position: relative;
		}
	ul.step li.now{color: #333;}
	ul.step li:not(:last-child):after{
		content: "";
		width: 60px;
		height: 1px;
		background: #989898;
		margin: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		right: -50px;
	}
	ul.step li.now::before{
		content: "";
		width: 85px;
		height: 3px;
		background: -moz-linear-gradient(-45deg,  #255190 0%, #7ab5dc 100%);
		background: -webkit-linear-gradient(-45deg,  #255190 0%,#7ab5dc 100%);
		background: linear-gradient(135deg,  #255190 0%,#7ab5dc 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#255190', endColorstr='#7ab5dc',GradientType=1 );
		margin: auto;
		position: absolute;
		bottom: -3px;
		left: 0;
		right: 0;
	}
	/* ul.step li:last-child:after{content: "";} */


.form_bg{
	background: #E1E7EF;
	padding: 6.5% 7.5%;
}
table.info{
	width: 100%;
	margin-bottom: 40px;
	font-size: 16px;
	overflow: hidden;
	}
	table.info th,
	table.info td{
		border-bottom: 1px solid #ccc;
		padding: 30px 0;
		vertical-align: top;
		overflow: hidden;
		}
	table.info tr:last-child th,
	table.info tr:last-child td{
		border-bottom: none;
	}
	table.info th{
		width: 210px;
		position: relative;
		vertical-align: middle;
		font-size: 14px;
		}
	table.info th:after{
		content: "必須";
		border: 1px solid #C33636;
		padding: 1px 2px;
		color: #C33636;
		font-size: 12px;
		line-height: 1;
		font-weight: bold;
		position: absolute;
		top: 44%;
		right: 20px;
		}
		table.info th.top:after{
			top: 35px;
			bottom: inherit;
		}
	table.info th.no:after{content: none;}
	table.info th.top{vertical-align: top;}
		table.info td input,table.info td textarea{
			height: auto;
			background: #FAFAFA;
			border: none;
			padding: 15px;
			font-size: 16px;
			border-radius: 5px;
			}
			table.info td input::placeholder,table.info td textarea::placeholder{
				color: #B1B1B1;
				font-family: 'Noto Serif JP', serif;
				}
		table.info td input.w01{width: 100%;}
		table.info td input.w02{
			width: 64%;
			margin: 0 10px 0 0;
			}
		table.info td input.w03{width: 36%;}

		table.info td textarea{width: 100%;}
/* ▼ プライバシー */
.privacy_read{
	margin-bottom: 20px;
	font-size: 14px;
	text-align: center;
	}
#privacy{
	height: 210px;
	background: #fff;
	padding: 5% 4%;
	margin-bottom: 50px;
	overflow-y: scroll;
	}
	#privacy .title{
		font-size: 20px;
	}
	#privacy dl.privacy{margin-bottom: 15px;}
	#privacy ol.privacy{
		margin-bottom: 20px;
		overflow: hidden;
		counter-reset: number;
		}
		#privacy ol.privacy > li{
			margin-bottom: 15px;
			counter-increment: number;
			padding-left: 2.5em;
			text-indent: -2.5em;
			font-size: 14px;
			}
		#privacy ol.privacy > li:before{
			content: counter(number, decimal) ".";
			margin-right: 0.5em;
			}
		#privacy ol.privacy > li:last-child{margin: 0;}
		#privacy ol.privacy li .privacy_care{margin: 5px 0 0 1em;}


	.btn_box ul.btn{
			text-align: center;
			position: relative;
		}
		.btn_box ul.btn li{
			display: inline-block;
			width: 49%;
			margin-right: 10px;
			position: relative;
			}
		.btn_box ul.btn li:last-child{margin-right: 0;}
		.btn_box ul.btn li a{
			border: none;
			background: -moz-linear-gradient(-45deg,  #255190 0%, #7ab5dc 100%);
			background: -webkit-linear-gradient(-45deg,  #255190 0%,#7ab5dc 100%);
			background: linear-gradient(135deg,  #255190 0%,#7ab5dc 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#255190', endColorstr='#7ab5dc',GradientType=1 );
			margin: auto;
			color: #fff;
			font-size: 16px;
			font-weight: bold;
			position: relative;
		}
		.btn_box ul.btn li a::after{
			content: "";
			width: 8px;
			height: 8px;
			border-top: 2px solid #fff;
			border-left: 2px solid #fff;
			-webkit-transform: rotate(135deg);
			transform: rotate(135deg);
			position: absolute;
			top: 43%;
			right: 25px;
		}
		.btn_box ul.btn li a:hover{
			opacity: .6;
		}
		.btn_box ul.btn li.back a{
			background: #999;
		}




/* ▼▼▼ 768px
=====================================*/
@media screen and (max-width: 768px){
.title_box h1{font-size: 26px;}
.read{
	margin-bottom: 30px;
}
ul.step{
	max-width: 330px;
	margin: 0 auto 60px;
	}
	ul.step li:not(:last-child):after{
		width: 25px;
		right: -28px;
	}
	ul.step li.now::before{
		width: 75px;
	}

.form_bg{
	padding: 20px 15px 40px;
}
table.info{
	max-width: 100%;
	margin-bottom: 0px;
	}
	table.info th,
	table.info td{
		display: block;
		padding: 20px 0;
		}
	table.info th{
		width: 100%;
		border: none;
		padding-bottom: 10px;
		}
	table.info td{padding: 0 0 30px;}
	table.info th:after{
		position: static;
		margin-left: 10px;
		}
		table.info td span{
			margin-right: 0;
			}
		table.info td input, table.info td textarea{
			padding: 15px 10px;
		}
		table.info td textarea{
			max-height: 180px;
		}
		table.info td input.w01{width: 100%;}
		table.info td input.w02{
			width: 100%;
			margin: 0 0 0 0;
			}
		table.info td input.w03{width: 100%;}
		table.info td input.w04{width: 100%;}


/* ▼ プライバシー */
#privacy{
	height: 150px;
	padding: 15px;
	margin-bottom: 40px;
	}
	#privacy .title{
		font-size: 18px;
	}
	#privacy dl.privacy{
		margin-bottom: 10px;
	}
	.btn_box ul.btn li{
		width: 100%;
		margin: 0 0 10px;
	}
	.btn_box ul.btn li a::after{
		width: 7px;
		height: 7px;
	}

}
