.contact {
	width: 90%;
	margin: auto;
}

.complete p {
	color: #fff;
	text-align: center!important;
	margin: 2vh auto 0;
}

.form {
	color: #009EE5;
	width: 80%;
	max-width: 1000px;
	padding: 4vw 4vw;
	margin: 2vh auto 0;
	background: #eee;
}

.form p {
	font-size: 14px;
	line-height: 1.8;
	letter-spacing: .2em;
	margin: 0 auto 1vw;
}
.form dl {
	display: flex;
	justify-content: flex-start;
	align-content: flex-start;
	flex-wrap: wrap;
}
.form dl dt {
	font-size: 14px;
	line-height: 1.8;
	text-align: left;
	vertical-align: text-top;
	font-weight: bold;
	letter-spacing: .2em;
	width: 30%;
	margin: 0 5px 4vh 0;
}
.form dl dd {
	font-size: 16px;
	line-height: 1.8;
	text-align: left;
	letter-spacing: .2em;
	word-wrap: break-word;
	width: 65%;
	margin: 0 5px 4vh 0;
}
.form .confirm  dl dd {
	color: #666;
	padding: .2em .4em;
	border-bottom: 1px solid #009EE5;
}
.form input[type='text'],
.form input[type='email'],
.form input[type='tel'],
.form input[type='url'],
.form textarea {
	color: #666;
	font-size: 16px;
	line-height: 1.8;
	text-align: left;
	width: 100%;
	padding: .2em .4em;
	transition: 0.3s;
	border: none;
	border: 1px solid #009EE5;
	background: #eee;
}
.form input:disabled {
  background: #eee;
}
.form input::placeholder,
.form textarea::placeholder {
	color: #ccc;	
}
.form input[type='text']:focus,
.form input[type='email']:focus,
.form input[type='tel']:focus,
.form input[type='url']:focus,
.form textarea:focus {
	background: #fff;
}
.form button:disabled {
	background: #ccc;
}
.form button:disabled:hover {
	background: #ccc;
	border: 4px solid #fff;

}
.form .btnArea {
	text-align: center;
}
.form .submitBtn,
.form .resetBtn {
	color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 2;
    border-radius: 0;
    padding: 10px 2em;
	margin: 10px auto;
	background: #009EE5;
	border: 2px solid #009EE5;
    display: inline-block;
    transition: all 0.5s ease;
}
.form .submitBtn:hover,
.form .resetBtn:hover {
    color: #009EE5;
    background: #fff;
	border-colo: #009EE5;
}
.form .resetBtn {
    background: #999;
	border-color: #999;
}
.form .error {
	font-size: 12px;
	color: #E05594;
	font-weight: bold;
}
.form .required {
	font-size: 80%;
	color: #E05594;
	font-weight: bold;
}
.form .optional {
	font-size: 80%;
	color: #666;
	font-weight: normal;
}


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

.form {
	width: 100%;
	padding: 4vw 4vw;
	margin: 10vh auto 0;
	background: #eee;
}


}

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

.form {
	width: 100%;
	padding: 4vw 4vw;
	margin: 10vh auto 0;
	background: #eee;
}
.form dl {
	display: flex;
	flex-direction: column;
}
.form dl dt {
	font-size: 14px;
	line-height: 1.8;
	text-align: left;
	vertical-align: text-top;
	font-weight: bold;
	letter-spacing: .2em;
	width: 100%;
	margin: 0 5px 5px 0;
}
.form dl dd {
	font-size: 14px;
	line-height: 1.8;
	text-align: left;
	letter-spacing: .2em;
	width: 100%;
	margin: 0 5px 10px 0;
}


}