@charset "utf-8";

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


  ◇◆◇ お問い合わせ ◇◆◇
  
  
========================================================================================================================*/

/*-----------------------------------------------------------------------------------
  ページ見出し
-----------------------------------------------------------------------------------*/

#headline-warp { background-image:url(../image/headline.jpg); }


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

  入力・確認画面
  
----------------------------------------------------------------------------------------------------*/

.sub-headline {
  box-sizing:border-box;
  margin-left:auto;
  margin-right:auto;
  display:inline-block;
  padding:0.75em 1.5em;
  position:relative;
  margin-bottom:40px;
}

.sub-headline:before,
.sub-headline:after {
  content:"";
  display:inline-block;
  width:100%;
  height:1px;
  position:absolute;
  left:0;
  background-color:#333538;
}
.sub-headline:before { top:0; }
.sub-headline:after  { bottom:0; }

@media only screen and (max-width:767px) {
  .sub-headline { margin-bottom:1.5rem; padding-left:1em; padding-right:1em; }
}


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

.fmBtn {
  text-align:center;
  margin-top:40px;
}

@media only screen and (max-width:767px) {
  .fmBtn { margin-top:1.5rem; }
}


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

.step1 { text-align:center; }
.step1-fm { text-align:left; }

.step1-fm dl {
  width:48.18181%;
  float:left;
  text-align:left;
}

.step1-fm dl:first-child {
  margin-right:3.63636%;
}

.step1-fm dt {
  font-weight:bold;
  font-size:112.5%;
}

.step1-fm dt small {
  display:inline-block;
  margin-right:1em;
  font-weight:normal;
}

.step1-fm dt {
  padding-top:1.5em;
  padding-bottom:0.5em;
}

.step1-fm dl dt:first-child {
  padding-top:0;
}

.step1-fm dl .rkibo { display:inline-block; }
.step1-fm dt.rkibo { margin-right:2em; }

.step1-fm textarea { height:272px; }

.step1-fm .error { padding-top:0.25rem; color:#e60012; }


/* エラー
=====================================================================================*/

.fm-check .km-error input[type=text], 
.fm-check .km-error textarea,
.fm-check .km-error select {
  border-color:#eb3442;
  background-color:#fdedee;
}

.ua-pc .fm-check .km-error input[type="text"]:focus,
.ua-pc .fm-check .km-error select:focus,
.ua-pc .fm-check .km-error textarea:focus {
  border-color:#eb3442;
}

.fm-check .km-error label {
  color:#e60012;
}

.fm-check p.error {
  padding-top:0.3rem;
  color:#e60012;
}


@media only screen and (max-width:767px) {
  .step1-fm dt {
    padding-top:1rem;
    padding-bottom:0.3rem;
  }
  
  .step1-fm dt.rkibo { margin-right:1em; }
  
  .step1-fm textarea { height:235px; }
}

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

  .step1-fm dl:last-child dt:first-child {
    padding-top:1rem;
  }
  
  .step1-fm textarea { height:200px; }
}



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

.step2 { text-align:center; }

.step2 dl {
  border-left:1px solid #bebfc0;
  border-right:1px solid #bebfc0;
  border-bottom:1px solid #bebfc0;
  background-color:#e6e6e7;
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  min-width:800px;
  max-width:1100px;
}

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

.step2 .fmBtn .js__submit { margin-left:0.3em; }
.step2 .fmBtn .js__back { margin-right:0.3em; }

@media (max-width:767px) {
  .step2 dl {
    min-width:100%;
    max-width:100%;
  }

  .step2 dt { width:35%; }
  .step2 dd { margin-left:35%; }
}

@media only screen and (max-width:767px) {
  .step2 dt,
  .step2 dd {
    padding:0.75rem;
  }
}

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

@media only screen and (max-width:500px) {
  .step2 dt,
  .step2 dd {
    padding:0.5rem;
  }
}


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

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

.step3 {
  text-align:center;
}

.step3 .sub-headline b { font-size:137.5%; line-height:1.3; }

@media only screen and (max-width:767px) {
  .step3 :not(.sub-headline) {
    text-align:left;
  }
  
  .step3 .sub-headline b { font-size:125.0%; }
}

@media only screen and (max-width:500px) {
  .step3 .sub-headline b { font-size:118.8%; }
}