@charset "UTF-8";

.confirm .nodisp_confirm {
	display : none;
}

#contact form > section:not(:last-child) {
	margin-bottom : 60px;
}

#contact .necessary {
	color : #cc0000;
}

#contact .flow {
	display : flex;
	margin-bottom : 32px;
}
#contact .flow > li {
	display : flex;
	line-height : 1.45;
	flex-direction : column;
	flex-grow : 1;
	justify-content : center;
	align-items : center;
	padding : 16px;
	background-color : #cccccc;
}
#contact .flow > li.current {
	background-color : #ff9900;
}
#contact .flow > li:not(:last-child) {
	position : relative;
	margin-right : 40px;
}
#contact .flow > li:not(:last-child)::after {
	position : absolute;
	top : 50%;
	right : -25px;
	content : ">";
	transform : translateX(-50%) translateY(-50%);
}
#contact .flow > li span {
	font-weight : bold;
	margin-bottom : 0.5em;
}

#contact .attention {
	line-height : 1.45;
	margin-bottom : 40px;
	padding : 24px;
	border : 5px solid #eeeeee;
}
#contact .attention > li:not(:last-child) {
	margin-bottom : 1em;
}

#contact table td > p:not(:last-child) {
	margin-bottom : 0.75em;
}
#contact table td .caption {
	font-size : 0.785em;
	color : #777777;
}

#formNav {
	display : flex;
	justify-content : center;
	align-items : center;
}
#formNav > * {
	min-width : 13em;
	margin : 0 16px;
}
#formNav button {
	cursor : pointer;
}
#formNav button[disabled="disabled"] {
	background-color : #cccccc;
}
#formNav .attention {
	line-height : 1.45;
	margin-bottom : 40px;
	padding : 24px;
	border : 5px solid #eeeeee;
}
#formNav .attention > li:not(:last-child) {
	margin-bottom : 1em;
}


#complete {
	margin-bottom : 40px;
	padding : 40px;
	border : 4px solid #eeeeee;
}
#complete h4 {
	font-size : 1.125em;
	font-weight : bold;
	margin-bottom : 1em;
}
#complete > p:not(:last-child) {
	margin-bottom : 1em;
}

@media screen and (max-width: 767px) {
	#contact .flow {
		flex-direction : column;
	}
	#contact .flow > li {
		display : block;
		padding : 0.725em;
		text-align : center;
	}
	#contact .flow > li br {
		display : none;
	}
	#contact .flow > li span {
		margin : 0 1em 0 0;
	}
	#contact .flow > li:not(:last-child) {
		margin : 0 0 40px 0;
	}
	#contact .flow > li:not(:last-child)::after {
		position : absolute;
		top : auto;
		right : auto;
		bottom : -45px;
		left : 50%;
		content : "▼";
		transform : translateX(-50%) translateY(-50%);
	}

	#formNav {
		display : grid;
		grid-template-columns : 1fr;
		grid-gap : 16px;
	}
	#formNav > * {
		margin : 0;
	}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
}
@media screen and (min-width: 1025px) and (max-width: 1439px) {
}
@media screen and (min-width: 1440px) and (max-width: 1919px) {
}
@media screen and (min-width: 1920px) {
}
