@charset "utf-8";

/*-------------------------------------------------------
1_フォームの基本設定
-------------------------------------------------------*/

/* 1-1_フォームのデフォルトスタイルを削除 ---------- */
*:focus {
	outline: none;
}
input, button, textarea {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding: 0;
	border-radius: 0;
	border: 0;
	margin: 0;
	background: none transparent;
	vertical-align: middle;
	font-size: inherit;
	color: inherit;
	box-sizing: content-box;
}

/*-------------------------------------------------------
2_フォームのレイアウト・テキスト
-------------------------------------------------------*/

/* 2-1_レイアウト ---------- */
.formBox {
	padding: 0 10%;
}
.formBox dl { /*1項目*/
	margin-bottom: 40px;
}
.formBox dt { /*項目名*/
	margin-bottom: 5px;
}
.formBox dd { /*入力欄*/
	font-size: 16px;
	margin-bottom: 10px;
}

/* 2-2_テキスト ---------- */
.formTtl {
	font-size: 34px;
	margin-bottom: 10px;
	text-align: center;
}
.formCaption {
	text-align: center;
	margin-bottom: 30px;
}
.alert {
	color: #4FBFD2;
}

/*-------------------------------------------------------
3_フォームの独自要素
-------------------------------------------------------*/

/* 3-1_入力フォームのスタイル ---------- */
input[type="text"],
input[type="email"],
textarea {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	resize: none;
	padding: 15px 20px;
	border-radius: 3px;
	background: #FFFEFE;
}
/* 入力中のスタイル */
input:focus,
textarea:focus {}
/* 指カーソル */
input[type="submit"],
input[type="button"] {
	cursor: pointer;
}

/* 3-2_送信ボタン ---------- */
input[type="submit"] {
	background: #4FBFD2;
	font-size: 20px;
	text-align: center;
	line-height: 3.5em;
	display: block;
	border-radius: 3px;
	width: 100%;
	margin-top: 25px;
	transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;
}
input[type="submit"]:hover,
input[type="submit"].hover {
	color: #2B2B2E;
	background: #00B2C4;
}

/*-------------------------------------------------------
4_確認・エラーページ
-------------------------------------------------------*/

/* 4-1_共通 ---------- */
.formBox table {
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.5em;
	width: 100%;
	margin: 40px 0 35px;
	table-layout: fixed; /*スマホサイズにした際にはみ出る対応*/
}
.formBox th,
.formBox td {
	background: #FFFEFE;
	padding: 15px 20px;
	border-bottom: solid 5px #E5E5E5;
}
.formBox th {
	width: 40%;
	border-right: solid 2px #E5E5E5;
}
.msg {
	color: #EB6D8E;
}

/* 4-2_前ページへ戻るボタン ---------------------------------- */

/* ベースのスタイル */
.pageBtn input[type="button"] {display: none;}
.button {cursor: pointer;} /*指カーソル*/

.pageBtn {
	position: relative;
	font-size: 12px;
	padding-bottom: 5px;
	margin-left: 20px;
	background: linear-gradient(transparent 90%, #585858 0%);
}

/* 前ページへ戻る */
.prev:before {
	content: "";
	position: absolute;
	top: 0.2em;
	left: -20px;
	width: 10px;
	height: 10px;
	border-left: 4px solid #2B2B2E;
	border-top: 4px solid #2B2B2E;
	transform: rotate(-45deg);-webkit-transform: rotate(-45deg);
}


/*-------------------------------------------------------
	デスクトップのスタイル
-------------------------------------------------------*/

/*-------------------------------------------------------
	タブレットのスタイル
-------------------------------------------------------*/
@media all and (max-width: 768px) {

.formTtl {font-size: 30px;}

}

/*-------------------------------------------------------
	モバイルのスタイル
-------------------------------------------------------*/
@media all and (max-width: 480px) {

.formCaption {
	text-align: left;
}

}

/* END */
