@charset "UTF-8";

.fm_note {
	width: 95%;
	max-width: 1520px;
	box-sizing: border-box;
	margin: 0 auto;
	margin-bottom: 1.2em;
	padding: 1em 1.2em;
	border: 1px solid #DCDCDC;
	border-left: 5px solid #8A8A8A;
	border-radius: 4px;
	background-color: #F7F7F7;
	color: #3A3A3A;
	font-size: 0.9em;
	line-height: 1.8em;
	text-align: left;
}
.fm_note_ttl {
	display: block;
	margin-bottom: 0.3em;
	font-weight: bold;
	font-size: 1.05em;
}
.fm_note a {
	color: #1A4E8A;
	text-decoration: underline;
}

/* 重要（解約・緊急連絡） */
.fm_note_alert {
	border-left-color: #B3000A;
	background-color: #FFF4F4;
	color: #2E2E2E;
}
.fm_note_alert .fm_note_ttl {
	color: #B3000A;
}

/* 電話番号を目立たせる */
.fm_note_tel {
	display: inline-block;
	margin: 0.2em 0;
	font-size: 1.15em;
	font-weight: bold;
	color: #B3000A;
	text-decoration: none;
}
.fm_note_tel:hover {
	color: #B3000A;
	text-decoration: underline;
}

/* ---------- 入力欄まわりの調整 ---------- */
/* form_inq.css の .inpt / .txtf は固定高さのため、
   項目数が増えるこの2ページでは可変高さに戻します。 */

.mod-box-input .list-input li,
.mod-box-input .list-input li.inpt,
.mod-box-input .list-input li.txtf {
	height: auto;
	margin-bottom: 1.6em;
}
.mod-box-input .list-input li .box-a1 {
	float: none;
	width: auto;
	line-height: 1.8em;
	margin-bottom: 0.4em;
}
/* form_inq.css の .box-a1 span は position:absolute のため、
   必須バッジと補足説明が浮いてしまう。ここでリセットする。 */
.mod-box-input .list-input li .box-a1 span {
	position: static;
	top: auto;
	right: auto;
}

/* 項目の補足説明 */
.fm_hint {
	display: block;
	margin-top: 0.1em;
	color: #767676;
	font-size: 0.82em;
	font-weight: normal;
	line-height: 1.6em;
}

/* 日付欄は幅を抑える */
.mod-box-input .list-input li .box-b1 input[type="date"] {
	float: none;
	width: auto;
	min-width: 200px;
	padding: 14px 15px;
}

/* ---------- ファイル添付 ---------- */

.fm_file {
	clear: both;
	margin-top: 0.3em;
}
.fm_file_row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	max-width: 640px;
	margin-bottom: 0.6em;
}
.fm_file_row input[type="file"] {
	-webkit-appearance: none;
	appearance: none;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	min-width: 0;
	box-sizing: border-box;
	padding: 10px;
	border: 1px solid #E5E5E5;
	background-color: #FFFFFF;
	font-size: 14px;
	line-height: 1.6em;
	cursor: pointer;
}
.fm_file_clear {
	display: none;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-webkit-appearance: none;
	appearance: none;
	margin-left: 0.5em;
	padding: 10px 12px;
	border: 1px solid #C0C0C0;
	border-radius: 4px;
	background-color: #F2F2F2;
	color: #3A3A3A;
	font-size: 13px;
	line-height: 1.6em;
	white-space: nowrap;
	cursor: pointer;
}
.fm_file_clear:hover {
	background-color: #E4E4E4;
	border-color: #9A9A9A;
}
.fm_file_row input[type="file"]:focus {
	border-color: #565656;
	outline: none;
}

/* 添付ファイルに関するメッセージ */
.fm_file_msg {
	display: none;
	margin-top: 0.6em;
	padding: 0.8em 1em;
	max-width: 520px;
	box-sizing: border-box;
	border: 1px solid #DCDCDC;
	border-radius: 4px;
	background-color: #F7F7F7;
	font-size: 0.85em;
	font-weight: normal;
	line-height: 1.7em;
	text-align: left;
}
.fm_file_msg span {
	display: block;
}
.fm_file_msg span + span {
	margin-top: 0.3em;
}
.fm_file_msg_ok {
	border-color: #BFD8C4;
	background-color: #F2F9F3;
}
.fm_file_msg_ng {
	border-color: #E7B9B9;
	background-color: #FFF4F4;
}
.fm_file_msg .fm_ok { color: #1F6B33; }
.fm_file_msg .fm_ng { color: #B3000A; }

/* 入力チェックのエラー表示 */
.fm_err {
	display: none;
	margin: 0 auto 1.5em;
	padding: 1em 1.2em;
	border: 1px solid #E7B9B9;
	border-left: 5px solid #B3000A;
	border-radius: 4px;
	background-color: #FFF4F4;
	color: #B3000A;
	font-size: 13px;
	line-height: 1.9em;
	text-align: left;
}
.fm_err_ttl {
	display: block;
	margin-bottom: 0.2em;
	font-weight: bold;
	font-size: 1.05em;
}

/* ---------- 確認画面 ---------- */

/* 「まだ送信されていません」の点滅表示 */
@-webkit-keyframes hp_blink {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.3; }
}
@keyframes hp_blink {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.3; }
}
.cfm_alert {
	margin-bottom: 1em;
	padding: 0.9em 1em;
	border-radius: 4px;
	background-color: #B3000A;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.6em;
	text-align: center;
	-webkit-animation: hp_blink 1.1s ease-in-out infinite;
	animation: hp_blink 1.1s ease-in-out infinite;
}
/* 動きを抑える設定の環境では点滅させない */
@media (prefers-reduced-motion: reduce) {
	.cfm_alert {
		-webkit-animation: none;
		animation: none;
	}
}

.cfm_lead {
	margin-bottom: 1.2em;
	padding: 1em 1.2em;
	border: 1px solid #DCDCDC;
	border-left: 5px solid #8A8A8A;
	border-radius: 4px;
	background-color: #F7F7F7;
	color: #3A3A3A;
	font-size: 15px;
	line-height: 1.9em;
	text-align: left;
}
.cfm_ttl {
	display: block;
	margin-bottom: 0.3em;
	font-size: 1.1em;
	font-weight: bold;
}

.cfm_tbl {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	line-height: 1.9em;
}
.cfm_tbl th,
.cfm_tbl td {
	display: block;
	width: auto;
	box-sizing: border-box;
	text-align: left;
}
.cfm_tbl th {
	padding: 0.5em 0.8em;
	border: none;
	background-color: #EFEFEF;
	color: #3A3A3A;
	font-size: 1em;
	font-weight: bold;
}
.cfm_tbl td {
	padding: 0.9em 0.8em 1.4em;
	border: none;
	background-color: transparent;
	color: #121212;
	word-break: break-all;
}
.cfm_empty {
	color: #909090;
}
.cfm_note {
	margin-top: 0.6em;
	padding: 0.6em 0.8em;
	border-radius: 4px;
	background-color: #F2F9F3;
	color: #1F6B33;
	font-size: 0.9em;
	line-height: 1.7em;
}

.cfm_btns {
	margin-top: 2em;
	text-align: center;
}
.cfm_btns .mod-btn {
	margin: 0.5em;
}
.cfm_back {
	border-color: #8A8A8A;
	color: #3A3A3A;
}

@media print, screen and (min-width: 1024px) {
.fm_err {
	font-size: 15px;
}
.cfm_alert {
	font-size: 19px;
}
.cfm_lead,
.cfm_tbl {
	font-size: 17px;
}
}

@media only screen and (min-width: 768px) {
.cfm_tbl th,
.cfm_tbl td {
	display: table-cell;
	vertical-align: top;
	border-bottom: 1px solid #E5E5E5;
}
.cfm_tbl th {
	width: 240px;
	padding: 1em;
	background-color: #F7F7F7;
	white-space: nowrap;
}
.cfm_tbl td {
	padding: 1em 1.2em;
}
}

/* ---------- 送信ボタン ---------- */

.mod-box-input .mod-btn[disabled] {
	opacity: 0.4;
	cursor: default;
}