@charset "UTF-8";
/*
 * contact.css
 *
 */

/* !お問い合わせ
---------------------------------------------------------- */
.contact {
	width:100%;
	padding:100px 50px 120px 50px;
	position: relative;
}

.contact__inner {
	max-width:1100px;
}
		
.contact__step {
	width:100%;
	display: flex;
	justify-content: space-between;
	margin:50px auto 0 auto;
}

.contact__step-item {
	display:block;
	width:30%;
	height:60px;
	line-height:60px;
	font-size:20px;
	font-weight: var(--font-weight-bold);
	color:#FFF;
	text-align:center;
	position:relative;
}

.contact__step-item--normal {
	background: var(--second-color);
}
	.contact__step-item--normal:after {
		position:absolute;
		content:"";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 30px 0 30px 30px;
		border-color: transparent transparent transparent var(--second-color);
		top:0;
		right:-30px;
	}
		.contact__step-item--normal:last-child:after {
			display:none;
		}
.contact__step-item--current {
	background: var(--main-color);
}
	.contact__step-item--current:after {
		position:absolute;
		content:"";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 30px 0 30px 30px;
		border-color: transparent transparent transparent var(--main-color);
		top:0;
		right:-30px;
	}
		.contact__step-item--current:last-child:after {
			display:none;
		}

.contact__lead {
	margin-top: 50px;
}

.contact__tel-box {
	max-width:700px;
	background:#F4FDFF;
	padding:30px;
	margin:60px auto 0 auto;
}

.contact__tel-box-title {
	text-align:center;
	font-size:18px;
	vertical-align:middle;
}
	.contact__tel-box-title i {
		margin-left:1em;
		margin-right:0.5em;
		color: var(--main-color);
	}
.contact__tel-box-number {
	font-family:var(--font-family-en);
	font-size:36px;
	color: var(--main-color);
}
.contact__tel-box-title br {
	display:none;
}
.contact__tel-box-number a {
	color: var(--main-color);
}

.contact__table {
	margin: 20px 0 0;
}

.contact__item {
	width:280px;
}

.contact__value {
	width:calc(100% - 280px);
}

.contact__privacy {
	width:100%;
	background-color: #f3f4f5;
	padding:30px 40px;
}

/* 非活性時のボタン（disabled属性がある時） */
.btn_submit:disabled,
.btn_submit.is-disabled {
    background-color: #ccc !important; /* グレーアウト */
    border-color: #ccc !important;
    cursor: not-allowed;               /* 禁止マークのカーソル */
}

@media screen and (max-width:1039px){
.contact {
	padding:70px 30px 100px 30px;
}
		
.contact__step {
	margin:45px auto 0 auto;
}

.contact__step-item {
	font-size:18px;
}

.contact__tel-box {
	padding:25px;
	margin:50px auto 0 auto;
}

.contact__tel-box-title {
	font-size:17px;
}
.contact__tel-box-number {
	font-size:32px;
}

.contact__item {
	width:240px;
}

.contact__value {
	width:calc(100% - 240px);
}

.contact__privacy {
	padding:30px 30px;
}
}

@media screen and (max-width:767px){
.contact {
	padding:70px 25px 80px 25px;
}

.contact__step-item {
	width:28%;
	height:46px;
	line-height:46px;
	font-size:16px;
}
	.contact__step-item--normal:after {
		border-width: 23px 0 23px 23px;
		right:-23px;
	}
	.contact__step-item--current:after {
		border-width: 23px 0 23px 23px;
		right:-23px;
	}

.contact__lead {
	margin-top: 40px;
}

.contact__tel-box {
	padding:20px;
	margin:50px auto 0 auto;
}

.contact__tel-box-title {
	font-size:15px;
}
.contact__tel-box-number {
	font-size:26px;
}
.contact__tel-box-title br {
	display:block;
}
	
.contact__privacy {
	padding:20px 15px;
}
}