@charset "UTF-8";

.p-contactPageHeading {
  /* TODO: 仮 */
  background:
    linear-gradient(0deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)),
    url(../../img/contact/cover.jpg) center / 120%,
    #333;
}

.p-contactSection {
  padding: 40px 20px;
}

@media screen and (min-width: 900px) {
  .p-contactSection {
    padding: 140px 20px;
  }
}

.p-contactSection__inner {
  max-width: 614px;
  margin: 0 auto;
}

.p-contactInfo {
  text-align: center;
  font-weight: 600;
  font-size: 16px;
  font-feature-settings: "palt";
  letter-spacing: .1em;
}

@media screen and (min-width: 900px) {
  .p-contactInfo {
    font-size: 20px;
  }
}

.p-contactError {
  color: #B70000;
}

.p-contactCaution {
  text-align: center;
}

form {
  margin-top: 40px;
}

form dl {
  margin: 25px auto 0;
  position: relative;
  color: #808080;
  font-family: Poppins, "Noto Sans JP", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
  position: relative;
}

@media screen and (min-width: 900px) {
  form dl {
    margin-top: 30px;
  }
}

form dl:first-child {
  margin-top: 0;
}

form dl dt {
  /* display: none; */
  /* position: absolute; */
  /* top: 10px; */
  /* right: 50%; */
  /* margin-right: 265px; */
  font-size: 14px;
  /* line-height: 1.714; */
  /* font-weight: 600; */
}

form dl dt p {
  margin: 0;
}

form dl dd {
  width: 100%;
  margin: 0 auto;
  background-color: #f3f2f1;
  border-radius: 4px;
}

form dl dd.bg-fff {
  background-color: #FFF;
}

form dl dd input[type="text"] {
  width: 100%;
  height: 42px;
  box-sizing: border-box;
  padding: 20px;
  border: none;
}

form dl dd .customSelect {
  width: 100%;
  height: 42px;
  box-sizing: border-box;
  padding: 10px 20px;
  border: none;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

form dl dd .customSelect:before {
  content: "";
  position: absolute;
  width: 40px;
  height: 36px;
  right: 2px;
  top: 7px;
  /*top: 2px;*/
  background-image: url(../../img/contact/dot.svg);
  background-position: left;
  background-repeat: no-repeat;
}

form dl dd .customSelect:after {
  content: "";
  position: absolute;
  /* width: 36px; */
  /* height: 36px; */
  right: 18px;
  top: 18px;
  margin-right: -4px;
  margin-top: -1px;
  border-top: 8px solid #f3f2f1;
  border-bottom: 8px solid transparent;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}

form dl dd .customSelect select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  margin: 0;
  padding: 0;
  color: #808080;
  width: 120%;
}

form dl dd textarea {
  width: 100%;
  height: 337px;
  box-sizing: border-box;
  padding: 20px;
  border: none;
}

form dl dd .attention {
  font-size: 12px;
  line-height: 1.666;
  text-indent: -1rem;
  padding-left: 1rem;
  text-align: left;
}

form dl dd span {
  width: 100%;
  height: 42px;
  box-sizing: border-box;
  padding: 0;
  border: 1px solid #fff;
  text-align: left;
  display: block;
}

/**
 * error message
 */
.mw_wp_form .error {
  font-size: 93%;
  color: #B70000;
  display: block;
}

/**
 * error message of akismet
 */
.mw_wp_form .akismet_error {
  display: block;
}

/**
 * vertical style of radio and checkbox
 */
.mw_wp_form .vertical-item {
  display: block;
}

.mw_wp_form .vertical-item+.vertical-item {
  margin-top: 5px;
}

/**
 * horizontal style of radio and checkbox
 */
.mw_wp_form .horizontal-item+.horizontal-item {
  margin-left: 10px;
}

/**
 * radio and checkbox
 */
.mwform-checkbox-field label,
.mwform-radio-field label {
  font-weight: normal;
  margin-bottom: 0;
}

.mwform-checkbox-field input,
.mwform-radio-field input {
  margin-right: 5px;
}

/**
 * datepicker
 */
.mw_wp_form .ui-datepicker .ui-datepicker-title select.ui-datepicker-month,
.mw_wp_form .ui-datepicker .ui-datepicker-title select.ui-datepicker-year {
  width: 40%;
  margin: 0 5px;
}

/**
 * deprecated message
 */
.mw-wp-form-deprecated-message {
  background: #fdeeee;
  border: 1px solid #f7bdb8;
  border-radius: 5px;
  color: #af4040;
  font-size: 13px;
  line-height: 1.6;
  margin: 0 0 10px;
  padding: 1em;
}

/**
 * file
 */
.mw_wp_form input[type="file"] {
  display: inline-block;
}

/**
 * file delete button
 */
.mwform-file-delete {
  cursor: pointer;
  visibility: hidden;
}

/**
 * tel and zip
 */
.mwform-tel-field input[type="text"],
.mwform-zip-field input[type="text"] {
  display: inline-block;
  width: auto;
}

.mwform-tel-field input[type="text"] {
  width: 31.5% !important;
}

form dl dd span.mwform-tel-field {
  background-color: #f3f2f1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 644px) {
  .mwform-tel-field input[type="text"] {
    width: 30% !important;
  }
}