@charset "utf-8";

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


  ◇◆◇ お問い合わせ・お見積り ◇◆◇
  
  
========================================================================================================================*/

.pan {
  margin-bottom:0;
}

.contactInfo {
  text-align:center;
}

.contact-tel {
  border:1px dotted #0f64b9;
  padding:1.5em 2em;
  color:#0f64b9;
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
  margin-top:2em;
  margin-bottom:2em;
}

.contact-tel .contact-tel--title {
  display:inline-block;
  background-color:#0f64b9;
  color:#fff;
  padding:0.25em 3.5em 0.25em 1em;
  vertical-align:middle;
  overflow:hidden;
  position:relative;
  margin-top:-0.85em;
  font-size:85%;
}

.contact-tel .contact-tel--title:after {
  width:0;
  height:0;
  content:"";
  display:inline-block;
  border-top:1.5em solid #fff;
  border-bottom:1.5em solid #fff;
  border-right:1.5em solid #fff;
  border-left:1.5em solid #0f64b9;
  position:absolute;
  right:0;
  top:-0.25em;
}

.contact-tel--title span:after {
  content:"お電話でのお問い合わせ";
}

.contact-tel-no {
  font-size:190%;
}

.contact-tel-no:before {
  content:"";
  background-repeat:no-repeat;
  background-position:0 0;
  background-size:100% 100%;
  width:22px;
  height:26px;
  display:inline-block;
  margin-right:10px;
  vertical-align:middle;
  margin-top:-0.25em;
}
  
.svg .contact-tel-no:before               { background-image:url(../../image/icon/blue/tel.svg); }
.no-svg .contact-tel-no:before            { background-image:url(../../image/icon/blue/tel.png); }
.no-backgroundsize .contact-tel-no:before { background:none; content:url(../../image/icon/blue/tel-s.png); }

.contact-tel small {
  display:block;
  padding-top:0.5em;
  line-height:1.6;
}

@media only screen and (max-width:767px) {
  .contact-tel {
    padding:1.5em;
  }

  .contact-tel--title span:after {
    content:"Tap to Call";
  }
  
  .contact-tel .contact-tel--title {
    margin-top:-1.15em;
    font-size:80%;
  }

  .contact-tel-no {
    font-size:200%;
  }
  
  .contact-tel small {
    text-align:left;
  }
  
  .contactInfo p {
    text-align:left;
  }
}

@media only screen and (max-width:500px) {
  .contact-tel {
    padding:1.25em;
  }
  
  .contact-tel .contact-tel--title:after {
    top:-0.4em;
  }
}

@media only screen and (max-width:440px) {
  .contact-tel .contact-tel--title {
    text-align:center;
    padding:0.25em 1em;
    overflow:inherit;
    margin-top:0;
    width:100%;
    box-sizing:border-box;
  }

  .contact-tel .contact-tel--title:after {
    border-top:10px solid #0f64b9;
    border-bottom:10px solid transparent;
    border-right:10px solid transparent;
    border-left:10px solid transparent;
    position:absolute;
    left:50%;
    top:2em;
    margin-left:-10px;
  }
  
  .contact-tel-no {
    display:block;
    z-index:1;
    position:relative;
    margin-top:0.5em;
    font-size:240%;
  }
}


/*----------------------------------------------------------------------------------------------------

  フォーム
  
----------------------------------------------------------------------------------------------------*/

.contactForm-step1 {
}
.contactForm-step1 + footer {
  border-top:0;
}

.contactForm-step1 dt .ic-required,
.contactForm-step1 dt .ic-optional {
  margin-left:1em;
  vertical-align:middle;
}

.contactForm-subHeadline {
  box-sizing:border-box;
  display:inline-block;
  padding:0.75em 1em;
  color:#0f4075;
  position:relative;
  margin-bottom:2.5em;
}

.contactForm-subHeadline:before,
.contactForm-subHeadline:after {
  content:"";
  display:inline-block;
  width:100%;
  height:1px;
  position:absolute;
  left:0;
}
.contactForm-subHeadline:before { top:0; }
.contactForm-subHeadline:after  { bottom:0; }

.rgba .contactForm-subHeadline:before,
.rgba .contactForm-subHeadline:after { background-color:rgba(15,64,117,0.5); }
.no-rgba .contactForm-subHeadline:before,
.no-rgba .contactForm-subHeadline:after { background-color:#0f4075; }


/* 入力画面 ----------------------------------------*/

.contactForm-step1--warp {
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  width:100%;
  max-width:1100px;
}

.contactForm-step1 dl {
  float:left;
  width:48%;
}

.contactForm-step1--warp dl:last-child {
  float:right;
  margin-left:4%;
}

.contactForm-step1 dt {
  font-size:118.8%; /* 19px; */
  font-weight:bold;
}

.contactForm-step1 dd {
  padding-top:0.5em;
  padding-bottom:1.5em;
}

.contactForm-step1 .checkbox-gp,
.contactForm-step1 .radio-gp {
  display:inline-block;
}

.contactForm-step1 .checkbox-gp label {
  display:inline-block;
  margin-top:0.35em;
}

.contactForm-step1 .checkbox-gp label:first-child {
  margin-top:0;
}

.contactForm-step1 .radio-gp label {
  display:inline-block;
  margin-right:2em;
}

.contactForm-step1 textarea {
  height:295px;
}

.privacypolicy {
  text-align:center;
  padding-top:2em;
}

.privacypolicy br {
  display:none;
}

@media only screen and (min-width:641px) and (max-width:700px) {
  .contactForm-step1 dt {
    font-size:106.3%;
  }
}

@media only screen and (max-width:640px) {
  .contactForm-step1 dl {
    float:none;
    width:100%;
    margin-left:0;
  }
}

@media only screen and (max-width:500px) {
  .privacypolicy br {
    display:inherit;
  }
  
  .privacypolicy .fspace--side {
    margin-left:0;
  }
}


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

.contactForm-step2 {
  text-align:center;
}

.contactForm-step2 dl {
  border-left:1px solid #d2d2d2;
  border-right:1px solid #d2d2d2;
  border-bottom:1px solid #d2d2d2;
  background-color:#f2f2f2;
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  width:100%;
  max-width:1100px;
}

.contactForm-step2 dt {
  width:25%;
  float:left;
  margin-right:-270px;
  padding-top:0.65em;
  padding-bottom:1.5em;
  padding-left:1em;
  padding-right:1em;
  box-sizing:border-box;
  border-top:1px solid #d2d2d2;
}
  
.contactForm-step2 dd {
  margin-left:25%;
  padding-left:1em;
  padding-right:1em;
  padding-top:0.5em;
  padding-bottom:1.5em;
  border-left:1px solid #d2d2d2;
  border-top:1px solid #d2d2d2;
  background-color:#fff;
}
  
.contactForm-step2 dt,
.contactForm-step2 dd {
  padding-top:1em;
  padding-bottom:1em;
}

@media only screen and (max-width:767px) {
  .contactForm-step2 dt {
    width:35%;
  }
  
  .contactForm-step2 dd {
    margin-left:35%;
  }
}


/* 完了画面 ----------------------------------------*/

.contactForm-step3 {
  text-align:center;
}

@media only screen and (max-width:767px) {
  .contactForm-step3 p:not(.contactForm-subHeadline) {
    text-align:left;
  }
}


/*-----------------------------------------------------------------------------------
  ボタン
-----------------------------------------------------------------------------------*/

.contactForm .fm-btn {
  clear:both;
  text-align:center;
}

.contactForm .fm-btn .btn {
  min-width:325px;
}

.contactForm-step2 .fm-btn {
  padding-top:2.5em;
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
}

.contactForm-step2 .btn--next {
  float:right;
  margin-left:0.5em;
}

.contactForm-step2 .btn--prev {
  float:left;
  margin-right:0.5em;
}

@media only screen and (max-width:767px) {
  .contactForm-step2 .fm-btn {
    display:block;
  }
  
  .contactForm-step2 .fm-btn .btn {
    min-width:inherit;
    width:48%;
  }

  .contactForm-step2 .btn--next {
    margin-left:2%;
  }
  
  .contactForm-step2 .btn--prev {
    margin-right:2%;
  }
}

@media only screen and (max-width:500px) {
  .contactForm .fm-btn .btn {
    min-width:inherit;
    width:100%;
    margin-left:0;
    margin-right:0;
  }
  
  .contactForm-step2 .btn--prev {
    margin-top:1.5em;
  }
}