@charset "UTF-8";
/*
 * form.css
 *
 */

/* !プライバシーポリシー
---------------------------------------------------------- */
.form {
	width:100%;
	padding:0 50px 50px 50px;
}
	.form div.inner {
		width:100%;
		max-width:1100px;
		margin:0 auto;
	}

.telBox {
	max-width:700px;
	background:#eff7fc;
	padding:30px;
	border-radius: 4px;
	margin:0 auto 70px auto;
}
	.telBox p {
		text-align:center;
		font-size:18px;
		font-weight: 600;
		vertical-align:middle;
	}
		.telBox p i {
			margin-left:1em;
			margin-right:0.5em;
			color: #007EC0;
		}
		.telBox p span {
			font-size:30px;
			font-weight:600;
			color: #007EC0;
			letter-spacing: 0.04em;
		}
		.telBox p br {
			display:none;
		}
		.telBox p a {
			color:#007EC0;
		}
		
ul.contactStep {
	width:100%;
	margin:0 auto 60px auto;
}
	ul.contactStep li {
		width:30%;
		float:left;
		margin-right:5%;
	}
		ul.contactStep li:last-child {
			margin-right:0;
		}
		ul.contactStep li.norm {
			display:block;
			height:60px;
			line-height:60px;
			background:#007EC0;
			text-align:center;
			font-size:20px;
			font-weight:700;
			color:#FFF;
			position:relative;
		}
			ul.contactStep li.norm:after {
				position:absolute;
				content:"";
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 30px 0 30px 30px;
				border-color: transparent transparent transparent #007EC0;
				top:0;
				right:-30px;
			}
				ul.contactStep li:last-child.norm:after {
					display:none;
				}
		ul.contactStep li.current {
			display:block;
			height:60px;
			line-height:60px;
			background:#004E8A;
			text-align:center;
			font-size:20px;
			font-weight:700;
			color:#FFF;
			position:relative;
		}
			ul.contactStep li.current:after {
				position:absolute;
				content:"";
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 30px 0 30px 30px;
				border-color: transparent transparent transparent #004E8A;
				top:0;
				right:-30px;
			}
				ul.contactStep li:last-child.current:after {
					display:none;
				}

a.indexBtn {
	display:block;
	position: relative;
	width:180px;
	height:70px;
	line-height:68px;
	color:#22282C;
	transition:.4s;
	overflow:hidden;
	z-index:1;
}
	a.indexBtn div {
		position:relative;
		font-family: "Shippori Mincho", serif;
		font-weight:600;
		color:#22282C;
		z-index:2;
		transition:0.4s;
	}
		a.indexBtn div span {
			display: block;
			position: absolute;
			content:"";
			width:30px;
			height: 30px;
			background: #007EC0;
			border-radius: 50%;
			top:20px;
			right:5px;
			transition: .3s;
		}
			a.indexBtn div span i {
				position: absolute;
				font-size:11px;
				color: #FFF;
				text-align: center;
				transform: rotate(-45deg);
				top:10px;
				left:10px;
				transition: .3s;
			}
			a.indexBtn:hover div span {
				display: block;
				position: absolute;
				content:"";
				width:40px;
				height: 40px;
				border-radius: 50%;
				top:15px;
				right:0;
			}
				a.indexBtn:hover div span i {
					position: absolute;
					font-size:11px;
					text-align: center;
					top:15px;
					left:15px;
				}
	a.indexBtn::after {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 0;
		height: 1px;
		background: #007EC0;
		content: '';
		opacity: 1;
		-webkit-transition: width 0.3s, opacity 0.3s, -webkit-transform 0.3s;
		-moz-transition: width 0.3s, opacity 0.3s, -moz-transform 0.3s;
		transition: width 0.3s, opacity 0.3s, -moz-transform 0.3s;
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		transform: translateX(0);
		z-index:0;
	}
		a.indexBtn:hover::after {
			height: 1px;
			width:100%;
			opacity: 1;
			-webkit-transform: translateX(0px);
			-moz-transform: translateX(0px);
			transform: translateX(0px);
		}

.privacy {
	width:100%;
	background-color: #f3f4f5;
	padding:30px 40px;
	margin-bottom: 30px;
}

@media screen and (max-width:1039px){
.form {
	padding:0 30px 40px 30px;
}
	
.telBox {
	max-width:600px;
	padding:25px 15px;
	margin:0 auto 60px auto;
}
	.telBox p {
		font-size:16px;
	}
		.telBox p span {
			font-size:24px;
		}
	
ul.contactStep {
	margin:0 auto 50px auto;
}
	ul.contactStep li.norm {
			height:56px;
			line-height:56px;
			font-size:18px;
		}
			ul.contactStep li.norm:after {
				border-width: 28px 0 28px 28px;
				right:-28px;
			}
		ul.contactStep li.current {
			height:56px;
			line-height:56px;
			font-size:18px;
		}
			ul.contactStep li.current:after {
				border-width: 28px 0 28px 28px;
				right:-28px;
			}
	
a.indexBtn {
	width:170px;
	height:60px;
	line-height:58px;
}
		a.indexBtn:hover div {
			color:#22282C;
		}
		a.indexBtn div span {
			top:15px;
			right:15px;
		}
			a.indexBtn:hover div span {
				width:30px;
				height: 30px;
				background: #007EC0;
				top:15px;
				right:15px;
			}
				a.indexBtn:hover div span i {
					color: #FFF;
					top:10px;
					left:10px;
				}
	a.indexBtn::after {
		display: none;
	}
}

@media screen and (max-width:767px){
.form {
	padding:0 25px 30px 25px;
}
	
.telBox {
	padding:20px;
	margin:0 auto 50px auto;
}
	.telBox p {
		font-size:15px;
	}
		.telBox p span {
			font-size:22px;
			margin-left:0;
		}
		.telBox p br {
			display:block;
		}
		
ul.contactStep {
	margin:0 auto 40px auto;
}
	ul.contactStep li {
		width:28%;
		margin-right:8%;
	}
		ul.contactStep li.norm {
			height:46px;
			line-height:46px;
			font-size:100%;
		}
			ul.contactStep li.norm:after {
				border-width: 23px 0 23px 23px;
				right:-23px;
			}
		ul.contactStep li.current {
			height:46px;
			line-height:46px;
			font-size:100%;
		}
			ul.contactStep li.current:after {
				border-width: 23px 0 23px 23px;
				right:-23px;
			}
	
.privacy {
	padding:20px 15px;
	margin-bottom: 30px;
}
}