@charset "utf-8";

.br_sp {
display: none;
 }

/* =============================================================================
    お問い合わせ
   ========================================================================== */
.contact section {padding-bottom: 60px;}

.contact #con-infoSec {
	padding: 70px 0;
}
.contact #con-infoSec h2 {
	position: relative;
	margin-bottom: 60px;
}
.contact #con-infoSec h2:before {
	position: absolute;
	content: "";
	top: -134px;
	left: 50%;
	margin-left: 0.5px;
	width: 1px;
	height: 120px;
	background: #293c4a;
}
.contact #con-infoSec p {
	font-size: 16px;
	line-height: 2.2em;
	letter-spacing: 0.05em;
	margin-bottom: 60px;
}
.contact #con-infoSec p a {
	text-decoration: underline;
}
.contact #con-infoSec .tel {
	text-align: center;
	font-size: 35px;
	letter-spacing: 0.1em;
	margin-bottom: 45px;
}
.contact #con-infoSec .tel a {
	color: #293c4a;
}
.contact #con-infoSec .tel a img {
	vertical-align: baseline;
	padding-right: 20px;
}
.contact #con-infoSec .tel span {
	display: block;
	font-size: 15px;
	letter-spacing: 0;
}
.contact #con-infoSec .line {
	text-align: center;
	font-size: 26px;
	letter-spacing: 0.1em;
	margin-bottom: 70px;
}
.contact #con-infoSec .line img {
	vertical-align: middle;
	padding-right: 20px;
}
.contact #con-infoSec .line span{
	display: block;
	padding-top: 15px;
}
.progressbar {
	max-width: 420px;
    position: relative;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
	margin-bottom: 60px;
}
.progressbar li {
    position: relative;
    list-style-type: none;
    text-align: center;
    text-transform: uppercase;
    width: 33.333%;
    color: #959595;
    font-weight: bold;
}
.progressbar li:before {
    display: block;
    width: 15px;
    height: 15px;
    margin: 7px auto 20px auto;
    content: '';
    text-align: center;
    background-color: #F5F5F5;
	border: 1px solid #0a0a0a;
}
.progressbar li:after {
    position: absolute;
    z-index: -1;
    top: 15px;
    left: -50%;
    width: 100%;
    height: 1px;
    content: '';
    background-color: #293c4a;
}
.progressbar li:first-child:after {
    content: none;
}
.progressbar li.active,
.progressbar li.complete{
    color: #0a0a0a;
}
.progressbar li.active:before,
.progressbar li.complete:before {
    background-color: #f30039;
}
.progressbar li.active:after,
.progressbar li.complete:after {
    background-color: #f30039;
}
.contact #con-infoSec .address .right {display: flex;width: 60%;align-items: end;}
.contact #con-infoSec .address .right span {
		padding-bottom: 8px;
		padding-right: 15px;
	}
.contact #con-infoSec form .center input {
		-webkit-appearance: auto;
	}
.contact #con-infoSec form .center {
		text-align: center;
	}
.contact .submit {text-align: center;margin-top: 30px;}
.contact .submit input {position: relative; color: #fff;cursor: pointer; border: none;font-size: 14px; display: inline-block;text-align: center;margin: 10px; background-color: #293c4a;width: 210px; height: 61px; line-height: 61px;}
.contact .submit input:hover {background-color: #b3bfc7;transition:all .5s ease;}
.contact label.error {color: #fe0030;}

#formWrap {max-width: 800px;margin: 0 auto;}
#formWrap h3 {
	padding-top: 50px;
}
#formWrap p {margin-bottom: 2em;}
#formWrap table {width: 100%;border-top: 1px solid #ccc;margin-bottom: 2em;}
#formWrap tr {border-bottom: 1px solid #ccc;}
#formWrap th {padding: 20px 0;width: 30%;font-weight: bold;text-align: left;}
#formWrap td {padding: 10px 0;width: 70%;}
.contact .submit input.backBtn {
	background: #4f7594;
}
.contact .submit input.backBtn:hover {background-color: #b3bfc7;transition:all .5s ease;}

@media screen and (min-width: 768px) {
    .contact #con-infoSec .form {font-size: 15px; max-width: 656px;margin: 0 auto;}
	.contact #con-infoSec form dt span {
    position: absolute;
    top: 50%;
    right: 50px;
    transform: translate3d(0, -50%, 0);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    width: 46px;
    background-color: #293c4a;
    color: #fff;
    display: inline-block;
    padding: 0 5px;
}
	.contact #con-infoSec form dt .nini {
    position: absolute;
    top: 50%;
    right: -112px;
    transform: translate3d(0, -50%, 0);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    width: 46px;
    background-color: #c4ccba;
    color: #1f2b20;
    display: inline-block;
    padding: 0 5px;
}
	 .contact #con-infoSec dl {width: 100%;letter-spacing: -0.4em;margin-bottom: 40px;}
    .contact #con-infoSec dt {padding: 20px 0;width: 40%;display: inline-block;letter-spacing: normal;vertical-align: top;font-weight: bold;position: relative;}
    .contact #con-infoSec dt span {color: #fff;padding-left:10px;font-weight: normal;}
    .contact #con-infoSec dd {padding: 10px 0;width: 60%;display: inline-block;letter-spacing: normal;vertical-align: top;}
    .contact #con-infoSec dd input,.contact #con-infoSec dd textarea {
		width: 100%;
		padding: 15px 20px;
		background-color: #fff;
		border: 1px solid #959595;
		border-radius: 5px;
	}
		.contact #con-infoSec dl .postalCode input {
		width: 45%;
	}
	.contact #con-infoSec .address .left {float: left;width: 40%;}
	
	.contact #con-infoSec .address .right dd input {
		width: 93%;
	}
	
	.contact #con-infoSec form .address .left dt {
		width: 100%;
	}
	.contact #con-infoSec form .address .caution {text-align: right;letter-spacing: 0;}
	.contact #con-infoSec .address .clear {clear: both;}
	
	
	#formWrap .ttl {
		position: relative;
		font-size: 29px;
		font-weight: bold;
		text-align: center;
		padding-bottom: 50px;
		color: #575c67;
		width: 560px;
    	margin: 0 auto;}
	#formWrap .ttl:before {
	position: absolute;
		content: "";
		top: 20px;
		left: 0;
		width: 144px;
		height: 2px;
		background-image: url(../images/contact/imgMail.png);}
	#formWrap .ttl:after {
		position: absolute;
		content: "";
		top: 20px;
		right: 0;
		width: 144px;
		height: 2px;
		background-image: url(../images/contact/imgMail.png);
	}
	
	.contact #con-infoSec input[type="radio"] {
    	width: auto;
		padding: 0;
}
   
}
@media screen and (max-width: 767px) {
	.br_sp {
	display: block;
	 }
    .contact section {padding-bottom: 30px;}
	.contact #con-infoSec p {
		font-size: 14px;
	}
	.contact #con-infoSec .tel {
		font-size: 30px;
	}
	.contact #con-infoSec .line {
    font-size: 20px;
	}	
	.contact #con-infoSec .line img {
		display: block;
		margin: 0 auto;
	}
     .contact #con-infoSec dl {width: 100%;}
    .contact #con-infoSec dt {padding: 20px 0 10px;font-weight: bold; text-align: left;}
    
	.contact #con-infoSec form dt span {
		right: 0 ;
	}
	.contact #con-infoSec form dt span {
    text-align: center;
    width: 46px;
    background-color: #d01406;
    color: #fff;
    display: inline-block;
    padding: 0 5px;
	margin-left: 10px;
}
	.contact #con-infoSec form dt .nini {
    text-align: center;
    width: 46px;
    background-color: #c4ccba;
    color: #1f2b20;
    display: inline-block;
    padding: 0 5px;
		margin-left: 10px;
}
	.contact #con-infoSec input[type="radio"] {
		width: auto;
	}
    .contact #con-infoSec dd {padding: 0 0 10px;}

    .contact #con-infoSec dd input,.contact #con-infoSec dd textarea {width: 100%;padding: 10px;background: #fff;    border: 1px solid #0a0a0a; border-radius: 5px;}
	.contact #con-infoSec .postalCode input {width: 100%;}
	.contact #con-infoSec .address .right {
		width: 100%;
	}
	.contact #con-infoSec .right dd {
		width: 33%;
	}
	.contact #con-infoSec .address .right dd input {
		width: 90%;
	}
	#formWrap {
		padding-top: 20px;
	}
	#formWrap .ttl {
		position: relative;
    	font-size: 24px;
    	font-weight: bold;
    	text-align: center;
    	padding-bottom: 20px;
   		color: #575c67;
    	margin: 0 auto;
	}
	#formWrap .ttl:before {
		position: absolute;
		content: "";
		top: 20px;
		left: 0;
		width: 80px;
		height: 2px;
		background-image: url(../images/contact/imgMail.png);	
	}
	#formWrap .ttl:after {
		position: absolute;
		content: "";
		top: 20px;
		right: 0;
		width: 80px;
		height: 2px;
		background-image: url(../images/contact/imgMail.png);
	}
    #formWrap th {width: 100%;display: block;padding: 10px 0 0;}
    #formWrap td {width: 100%;display: block;padding: 0 0 10px;}
}

/* =============================================================================
    個人情報保護方針
   ========================================================================== */

.contact #policySec {
	padding: 80px 0;
	background: #f4f5f7;
}
.contact #policySec h2 {
	position: relative;
	margin-bottom: 60px;
}
.contact #policySec h2:before {
	position: absolute;
	content: "";
	top: -134px;
	left: 50%;
	margin-left: 0.5px;
	width: 1px;
	height: 120px;
	background: #293c4a;
}
#policySec .policy-cont {
	max-width: 1060px;
	margin: 0 auto;
	font-size: 18px;
}
#policySec .policy-cont dt {
	color: #293c4a;
	font-weight: bold;
	margin-bottom: 10px;
}
#policySec .policy-cont dd {
	line-height: 2.2em;
	margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
	#policySec .policy-cont {
		font-size: 16px;
		line-height: 1.8em;
	}
}
/* =============================================================================

   ========================================================================== */

@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}
/* =============================================================================

   ========================================================================== */
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}