@charset "utf-8";
/* CSS Document */

#page_title {
	background-image:url(../img/page_title_bg.png);
}


#form_body {
	width:94%;
	max-width:1000px;
	margin:0 auto;
	margin-top:5rem;
}

#form_body .tel_wrap {
	display:table;
	margin:0 auto;
	margin-bottom:10rem;
	border:4px solid #004DA0;
	padding:2rem;
}

#form_body .tel_wrap h4 {
	border:1px solid #004DA0;
	color:#004DA0;
	text-align:center;
	padding:0.5em 0;
	line-height:1;
	margin-bottom:1rem;
}

#form_body .tel_wrap p {
	font-size:1.2rem;
	padding-bottom:0.2em;
}

#form_body .tel_wrap a {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;
	align-items:center;
	line-height:1;
}

#form_body .tel_wrap .icon {
	width:5rem;
	height:5rem;
}

#form_body .tel_wrap .text {
	display:block;
	padding-left:1rem;
}

#form_body .tel_wrap .text .num {
	display:block;
	font-size:4.6rem;
	font-weight:bold;
	color:#004DA0;
}

#form_body .tel_wrap .text .caption {
	font-size:1.4rem;
}

@media screen and (max-width:800px){
	#form_body .tel_wrap .text .num {
		font-size:3.6rem;
	}
}

@media screen and (max-width:500px){
	#form_body .tel_wrap {
		margin-bottom:5rem;
		padding:1.5rem;
	}
	#form_body .tel_wrap .text .num {
		font-size:2.4rem;
	}
	#form_body .tel_wrap .icon {
		width:4rem;
		height:4rem;
	}
	#form_body .tel_wrap h4 {
		font-size:1.4rem;
	}
}

#form_body h2 {
	display:table;
	margin:0 auto;
	font-size:2rem;
	font-weight:bold;
	color:#4E4E4E;
	border-bottom:6px solid #FFF972;
	padding-bottom:0.5rem;
	margin-bottom:3rem;
}

#form_body .note {
	font-size: 1.4rem;
	margin-top: 2rem;
}

#step {
	margin:3rem 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;
	justify-content:space-between;
}

#step li {
	position:relative;
	width:33%;
	text-align:center;
	border-top:1px solid #004DA0;
	border-bottom:1px solid #004DA0;
	height:40px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
}

#step li span {
	width:100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;
	align-items:center;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	-ms-justify-content:center;
	justify-content:center;
	text-align:center;
	position:relative;
	font-size:1.4rem;
	background:#F2EFEF;
	color:#004DA0;
}

#step li:first-child {
	border-left:1px solid #004DA0;
	z-index:3;
}
#step li:nth-child(2) {
	z-index:2;
}

#step li:nth-child(3) {
	border-right:1px solid #004DA0;
	z-index:1;
}

#step li:nth-child(2):after, #step li:nth-child(2):before,
#step li:first-child:after, #step li:first-child:before,
#step li:nth-child(2) span:after, #step li:nth-child(2) span:before,
#step li:nth-child(3) span:after, #step li:nth-child(3) span:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#step li:nth-child(2):after,
#step li:first-child:after,
#step li:nth-child(2) span:after,
#step li:nth-child(3) span:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #F2EFEF;
	border-width: 19px;
	margin-top: -19px;
}
#step li:nth-child(2):before,
#step li:first-child:before,
#step li:nth-child(2) span:before,
#step li:nth-child(3) span:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #004DA0;
	border-width: 20px;
	margin-top: -20px;
}

#step li.active:nth-child(2):after,
#step li.active:first-child:after {
	border-left-color: #004DA0;
}
#step li.active span {
	background:#004DA0;
	color:#fff;
}

#step li:nth-child(2) span:after, #step li:nth-child(2) span:before,
#step li:nth-child(3) span:after, #step li:nth-child(3) span:before {
	left: 0;
}

	#step li span br {
		display:none;
	}

@media screen and (max-width:500px){
	#step li span {
		font-size:1rem;
	}
}

@media screen and (max-width:480px){
	#step li span br {
		display:block;
	}
}



#form_wrap {
	margin-top:3rem;
	border:1px solid #AFAFAF;
}

#form_wrap dl {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

#form_wrap dl + dl {
	border-top:1px solid #AFAFAF;
}

#form_wrap dl dt,
#form_wrap dl dd {
	padding:2rem;
}

#form_wrap dt {
	background:#F2EFEF;
	position:relative;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;
	align-items:center;
}

#form_wrap dl > dt {
	width:320px;
}

#form_wrap dl.address_wrap > dt {
	width:100px;
	border-right:1px solid #AFAFAF;
	-webkit-align-items:flex-start;
	-moz-align-items:flex-start;
	-ms-align-items:flex-start;
	align-items:flex-start;
}

#form_wrap dl > dd {
	width:calc( 100% - 320px );
}

#form_wrap dl.address_wrap > dd {
	width:calc( 100% - 100px );
	padding:0;
}

#form_wrap dl.child_wrap {
	width:100%;
}

#form_wrap dl.child_wrap dt {
	width:220px;
	border-top:1px solid #AFAFAF;
	position:relative;
}

#form_wrap dl.child_wrap dd {
	width:calc( 100% - 220px );
	border-top:1px solid #AFAFAF;
}

#form_wrap dl.child_wrap > *:first-child,
#form_wrap dl.child_wrap > *:nth-child(2) {
	border-top:none;
}

#form_wrap .caption {
	font-size:1.4rem;
	margin-bottom:0.5rem;
}

#form_wrap dl dd label {
	display:inline-block;
	margin-right:2rem;
	cursor:pointer;
}

#form_wrap input,
#form_wrap select {
	padding:0.5rem;
}

#form_wrap textarea {
	padding:0.5rem;
	width:100%;
	height:6em;
}

#form_wrap dl dd .wl {
	width:100%;
}

#form_wrap dl dd .wm {
	width:80%;
}

#form_wrap dl dd .ws {
	width:30%;
	min-width:300px;
}

#form_wrap .required {
	display:inline-block;
	padding:0.3em 0.5em;
	font-size:1.2rem;
	color:#fff;
	line-height:1;
	background:#FF4E00;
	position:absolute;
	top:50%;
	right:2rem;
	margin-top:-1em;
}

#zip1 {
	width:4em;
}

#zip2 {
	width:8em;
}

#autoAddress {
	margin-left:1rem;
}

#send_btn_wrap {
	margin-top:6rem;
	text-align:center;
}

#honey {
	display:none;
}

#confirm,#post,#edit {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background:#FF4E00;
	color:#fff;
	border-radius:3px;
	font-weight:bold;
	font-size:2rem;
	padding:0.5em 2em;
	margin-top:3rem;
	cursor:pointer;
	box-shadow:3px 3px 0px 0px rgba(0,0,0,0.16);
}

#edit {
	background:#7E8D90;
}

.error {
	color:rgba(220,0,3,1.00);
}

dd .error {
	margin-bottom:0.5rem;
	font-size:1.4rem;
}

.errors {
	border:1px solid rgba(220,0,3,1.00);
	padding:2rem;
}

.error_title {
	text-align:center;
	padding-bottom:1rem;
	margin-bottom:1rem;
	border-bottom:2px solid #efefef;
}

@media screen and (max-width:800px){
	#form_wrap dl > dt,
	#form_wrap dl > dd,
	#form_wrap dl.child_wrap dt,
	#form_wrap dl.address_wrap > dt,
	#form_wrap dl.address_wrap > dd,
	#form_wrap dl.child_wrap dd {
		width:100%;
	}
	#form_wrap dl > dt {
		font-weight:bold;
		color:#1A1311;
	}
	#form_wrap dl.child_wrap {
		border-left:10px solid #F2EFEF;
	}
	#form_wrap dl.child_wrap dt,
	#form_wrap dl.child_wrap dd {
		border-top:none;
	}
	#form_wrap dl.child_wrap dt {
		background: #FAF9F9;
	}
	#form_wrap dl.address_wrap > dt {
		border-right:none;
	}
}

@media screen and (max-width:480px){
	.errors {
		padding:1.5rem;
	}
	.errors > * {
		font-size:1.4rem;
	}
	#form_wrap dl > dt,
	#form_wrap dl > dd,
	#form_wrap dl.child_wrap dt,
	#form_wrap dl.address_wrap > dt,
	#form_wrap dl.address_wrap > dd,
	#form_wrap dl.child_wrap dd {
		font-size:1.4rem;
		padding:1rem;
	}
	#form_wrap dl.address_wrap > dd {
		padding:0;
	}
	
	#form_wrap dl dd .wm {
		width:100%;
	}
	
	#form_wrap dl dd .ws {
		width:100%;
		min-width:auto;
	}
	#autoAddress {
		margin-left:0;
		margin-top:1rem;
	}
	
	dd .error,
	dd .caption {
		font-size:1.2rem;
	}
	#send_btn_wrap {
		margin-top:3rem;
	}
	#confirm {
		margin-bottom:4rem;
		font-size:1.8rem;
	}
	#confirm,#post,#edit {
		font-size:1.8rem;
	}
}

#thanks {
	text-align:center;
	padding:6rem 0;
}

#thanks .btn_style1 {
	margin-top:3rem;
}