@charset "UTF-8";


#inquiry-nav .inquiry-chat, #inquiry-nav .inquiry-line { margin-bottom: 15px; }
#inquiry-nav .inquiry-chat a, #inquiry-nav .inquiry-line a { color: #fff; display: inline-block; width: 18em; padding: 17px 15px 15px 25px; font-weight: bold; box-sizing: border-box; }
#inquiry-nav .inquiry-chat a { background: #4575c1 url(/pg/user/chat/images/tmn_index-j_01.png) no-repeat 10px center; }
#inquiry-nav .inquiry-line a { background: #00b900 url(/pg/user/chat/images/tmn_index-j_01.png) no-repeat 10px center; }
#inquiry-nav  a+span { padding: 15px; }

.inquiry-chat-lead, .inquiry-line-lead { min-height: 64px; vertical-align: middle; margin: 15px 0; text-align: center; }
span.lead-mark { min-height: 64px; min-width: 64px; display: inline-block; margin: 0 15px -25px 0; }
.inquiry-chat-lead span.lead-mark { background: url(/pg/user/chat/images/img_index-j_01.png) no-repeat left top; }
.inquiry-line-lead span.lead-mark { background: url(/pg/user/chat/images/img_index-j_03.png) no-repeat left top; }

table.inquiry-reception { border-collapse: collapse; margin: 15px 0 20px; width: 100%; }
table.inquiry-reception th, table.inquiry-reception td { padding: 15px 30px 15px 30px; vertical-align: middle; }
table.inquiry-reception th { background: #4575c1; color: #fff; border-bottom: 5px solid #fff; }
table.inquiry-reception td { border-bottom: 1px solid #eee; border-top: 1px solid #eee; }

.box-gray { background: #eeeeee; }

.line-attach { margin: 0 auto; position: relative; width: 645px; height: 310px; }
.line-attach .attach-image { position: absolute; left: 30px; top: 0; }
.line-attach .attach-link { position: absolute; left: 205px; top: 100px; width: 480px; text-align: center; font-size: 150%; }

.inquiry-line-step .step-wrapper { position: relative; width: auto; height: auto; }
.inquiry-line-step .step-wrapper::before { content: ""; display: block; padding-top: 0;}
.inquiry-line-step .step-wrapper .step-number { border: 2px solid #4575c1; padding: 10px 15px; width: 5.5em; font-size: 142.9%; font-weight: bold; position: absolute; left: 0; top: 0; box-sizing: border-box; }
.inquiry-line-step .step-wrapper .step-description { padding-left: 9em; padding-top: 5px; }
.inquiry-line-step .step-wrapper .step-description::before {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.inquiry-line-step .step-wrapper .step-description .step-description-figure { margin: 0 40px; vertical-align: middle; display: inline-block; padding: 0; text-align: center; }

@media screen and (max-width: 767px) {
  #inquiry-nav .inquiry-chat a, #inquiry-nav .inquiry-line a { display: block; width: 100%; padding: 11px 10px 10px 20px; font-weight: bold; box-sizing: border-box; }
  #inquiry-nav .inquiry-chat a, #inquiry-nav .inquiry-line a { /*background-size: 8px 12px;*/ background-position-x: 5px; }
  #inquiry-nav  a+span { padding: 0; }

  .inquiry-chat-lead, .inquiry-line-lead { min-height: 10px; vertical-align: top; margin: 15px 0; text-align: left; position: relative; margin-left: 3%; }
  span.lead-mark { display: block; margin: 0; position: absolute; left: 0; top: 0; }
  .inquiry-chat-lead span.lead-mark, .inquiry-line-lead span.lead-mark { background-size: 48px; background-position-y: center; }

  table.inquiry-reception th, table.inquiry-reception td { padding: 5px 10px; }

  .line-attach { margin: 0 auto; width: 100%; height: auto; }
  .line-attach .attach-image { position: relative; text-align: center; left: 0; }
  .line-attach .attach-image img { width: 50%; height: auto; }
  .line-attach .attach-link { position: relative; width: 100%; top: 0; left: 0; }

  .inquiry-line-step .step-wrapper .step-number { padding: 5px 10px; }
  .inquiry-line-step .step-wrapper .step-description { padding-top: 0; }
  .inquiry-line-step .step-wrapper .step-description .step-description-figure { margin: 0 20px; }
}

@media screen and (max-width: 415px) {
  .inquiry-line-step .step-wrapper .step-wrapper { position: relative; width: auto; height: auto;  }
  .inquiry-line-step .step-wrapper .step-number { padding: 7px 12px; width: 100%; position: relative; left: 0; top: 0; }
  .inquiry-line-step .step-wrapper .step-description { padding: 10px 0 0; }
  .inquiry-line-step .step-wrapper .step-description .step-description-figure { margin: 0 auto; width: auto; height :auto; display: block;s }

}
