@charset "UTF-8";
/* ============================================================
   inquiry.css - お問い合わせページ リキッド対応（最小限）
   mailformpro 既定スタイルを尊重し、リキッド対応のみ追加
   ============================================================ */

/* メインビジュアルをリキッド化 */
#b-inquiry #low_mi { width: 100%; overflow: hidden; }
#b-inquiry #low_mi img { display: block; width: 100%; height: auto; max-width: 100%; }

/* PC: 項目名（th）は右寄せ、必須バッジは左寄せ（float） */
@media only screen and (min-width: 769px) {
  #b-inquiry .mailform > tbody > tr > th,
  #b-inquiry table.mailform > tbody > tr > th {
    text-align: left;
    vertical-align: middle;
  }
  #b-inquiry .mailform > tbody > tr > th .must,
  #b-inquiry table.mailform > tbody > tr > th .must {
    float: left;
  }
  #b-inquiry .mailform > tbody > tr > th::after,
  #b-inquiry table.mailform > tbody > tr > th::after {
    content: "";
    display: block;
    clear: both;
  }
}

/* 必須バッジ（mailformpro 既定では非表示なので赤バッジ化） */
#b-inquiry .mailform .must,
#b-inquiry table.mailform tr th span.must {
  display: inline-block;
  width: fit-content;
  background: #c3504b;
  color: #fff !important;
  font-size: 12px;
  line-height: 1;
  padding: 4px 7px;
  margin-right: 8px;
  border-radius: 3px;
  vertical-align: middle;
  font-weight: bold;
}

/* ラジオボタンラベルを fit-content に */
#b-inquiry .mailform label.mfp {
  display: inline-block;
  width: fit-content;
  width: -moz-fit-content;
}

/* SP: 1カラム表示・テーブルセル縦並び */
@media only screen and (max-width: 768px) {
  body#b-inquiry #left_column { display: none !important; }
  body#b-inquiry #right_column { width: 100% !important; float: none !important; }

  /* #b-inquiry .mailform,
  #b-inquiry .mailform tbody,
  #b-inquiry .mailform tr,
  #b-inquiry .mailform th,
  #b-inquiry .mailform td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  } */
/*   #b-inquiry .mailform tr.mfptr { margin-bottom: 12px; }
  #b-inquiry .mailform td,
  #b-inquiry .mailform .table_in td,
  #b-inquiry .mailform .table_day td,
  #b-inquiry .mailform .table_day th { background: #fff !important; }
  #b-inquiry .mailform th { text-align: left !important; } */

  /* 希望日テーブルのセルを縦並び・100% に */
  #b-inquiry .mailform .table_day,
  #b-inquiry .mailform .table_day tbody,
  #b-inquiry .mailform .table_day tr,
  #b-inquiry .mailform .table_day th,
  #b-inquiry .mailform .table_day td {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
    white-space: normal !important;
  }
  #b-inquiry .mailform input[type="text"],
  #b-inquiry .mailform input[type="email"],
  #b-inquiry .mailform input[type="tel"],
  #b-inquiry .mailform select,
  #b-inquiry .mailform textarea {
    max-width: 100%;
    box-sizing: border-box;
  }
  #b-inquiry .mailform label.mfp {
    width: auto;
    width: -moz-fit-content;
    width: fit-content;
  }

  /* フォーム下の float 画像を解除して幅100%に */
  /* #b-inquiry .fimg_l,
  #b-inquiry .fimg_r,
  #b-inquiry #inquiry img,
  #b-inquiry .field_in img {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 1em 0 !important;
    display: block;
  } */
}

@media only screen and (max-width: 768px) {
  #left_column {
    display: none !important;
  }
  #content {
    margin-top: 90px !important;
  }
}

.intro {
text-align: center;
 white-space: pre-wrap;
 word-break: keep-all;
}
.intro.red {
  font-weight: bold;
  color: red;
}
*{
  
  max-width: 100%;
  box-sizing: border-box;
  color: #523d38;
  font-family: "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", "Yu Mincho", "游明朝", serif;
}

#right_column {
  font-size: 15px;
}

input[type="radio"],
input[type="checkbox"] {
width: 1em;
}

#b-inquiry .mailform .table_in td:has(>label) {
display: grid;
width: 100%;
grid-template: auto / repeat(3,1fr);
gap: .5em 1em;
}
@media only screen and (max-width: 640px) {
#b-inquiry .mailform .table_in td:has(>label) {
grid-template: auto / repeat(2,1fr);
}
}
@media only screen and (max-width: 480px) {
#b-inquiry .mailform .table_in td:has(>label) {
grid-template: auto / repeat(1,1fr);
}
}
#b-inquiry .mailform .table_in td:has(>label) label {
  width: 100%;
}

.implant-note {
  width: calc(100% - 2em);
  text-align: center;
  padding: 1em;
  border: 1px solid #523d38;
  margin: 1em;
}
.implant-note *:is(span,strong) {
  display: inline-block;
}
strong {
  color: inherit !important;
  font-weight: bold !important;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
textarea {
  width: 100%;
  border: solid 1px #CCC;
    border-radius: 3px;
    box-shadow: 0px 0px 5px #CCC inset;
    padding: 3px 8px;
    margin: 2px;
    vertical-align: middle;
}

@media only screen and (max-width: 768px) {
.cont_in {
margin-bottom:0;
}
}