/* ------------------------------
　　お問い合わせ
------------------------------ */
.contact-box {
	margin: 0 0 30px 0;

	.message-group {
		margin: 0 0 35px 0;
	}

	p {
		 &.message-text {
			padding: 0 10px;
			color: theme-color("primary");
			font-weight: bold;
		}
		 &.contact-no {
			font-weight: bold;
			 font-size: 2rem;
			a {
				color: inherit;
			}
		}
		 &.error-text {
			/* エラー文 */
			margin: 5px 0 0 0;
			color: $form-feedback-invalid-color;
		}
	}
}

/* ステップ */
.contact-box {
	.mail-step {
		display: flex;
		height: 40px;
		margin: 0 0 35px 0;
		padding: 0 5px;
		font-size: $font-size-base;
		background: $gray-200;
		/* カウンターの設定 */
		counter-reset: mailStep;
	}
	.mail-step-item {
		display: flex;
		align-items: center;
		margin: 0 5px;
		color: $gray-600;
		font-weight: bold;
		list-style: none;
		border-bottom: 4px solid transparent;
		 &:before {
			content: counter(mailStep)".";
			/* カウンターの設定 */
			counter-increment: mailStep;
		}
	}
	.mail-step-item-current {
		color: $body-color;
		border-bottom: 4px solid $secondary-color;
	}
	@include media-breakpoint-up(sm) {
		.mail-step {
			height: 60px;
			padding: 0 10px;
			@include font-size(16);
		}
		.mail-step-item {
			margin: 0 10px;
		}
	}
}
/* 入力欄 */
.contact-group-wrap {
	margin: 0 0 10px 0;
}

/* 送信ボタン */
.form-btn-box {
	margin: 0 10px 50px 10px;
	text-align: center;
}
.form-btn {
	display: inline-block;
}
@include media-breakpoint-up(sm) {
	.form-btn {
	}
	.form-btn-send {
		width: 100%;
		max-width: 360px;
	}
}
/* ラベル */
.label-required {
	margin: 0 5px;
	padding: 2px 8px;
	color: $white;
	font-size: ($font-size-base * .8);
	background: theme-color("danger");
	border-radius: 3px;
}
@include media-breakpoint-up(sm) {
	.label-required {
		float: right;
	}
}
