@charset "utf-8";

/* CSS Document */

.btn_close {
  cursor: pointer;
}
body {
  font-size: 16px;
  line-height: 1.4;
  color: #373d3f;
  background-color: #f0f0f0;
  padding: 0 16px;
}
body>section {
  max-width: 800px;
  margin: 60px auto;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  padding: 35px 50px;
}
.entry-title {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  padding-left: 10px;
  font-weight: bold;
  position: relative;
}
.entry-title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 4px;
  height: 80%;
  background-color: #0082c3;
}
.contact-box .mail-step-item {
  margin: 0 8px;
}
.contact-box .mail-step {
  flex-wrap: nowrap;
}
.contact-form-group {
  background-color: #ffffff;
  border-bottom: 1px solid #eaedef;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  padding: 14px 0;
  align-items: center;
  position: relative;
}
.valid-mark.valid{
  display: inline-block;
  float: none;
  position: absolute;
  top: 31%;
  /* transform: translateY(-50%); */
  left: 27%;
}


/* questionary */
.contact-flex-mul {
  display: block;
}
.contact-form-label.contact-form-label-questio {
  width: 100%;
  display: block;
}
.contact-form-label.contact-form-label-questio .label-required {
  margin: 8px 0;
}
.contact-form-control label {
  display: block;
}
.contact-form-control.contact-flex {
  display: flex;
  justify-content: space-between;
}
label.form-radio-questio {
  padding-top: 6px;
}
.contact-form-control.contact-flex.contact-form-questio div:last-child {
  width: 70% !important;
}
.contact-flex div:first-child {
  width: 30% !important;
}
.contact-form-control.contact-flex.contact-form-questio div label {
  margin-top: 16px;
}
td.contact-form-control.contact-form-questio div:last-child p {
  margin-bottom: 0px;
  margin-top: 8px;
}
.contact-form-control.contact-form-questio p {
  margin-bottom: 8px;
}
.valid-posi.valid-mark.valid {
  top: 56%;
  left: 22%;
}
.contact-txt {
  display: block;
}



/* entry */
.contact-form-adj {
  flex-wrap: wrap;
}
.contact-form-control label.list_arr,
.list_arr {
  display: flex;
  padding-top: 6px;
  width: fit-content;
}
.contact-form-control label .label_label_entry {
  padding-left: 32px;
}
.kome {
  padding-left: 1.3em;
  text-indent: -1.3em;
}
.kome::before {
  content: "※";
  display: inline;
  margin-right: .3em;
}



.contact-form li:first-child {
  border-top: 1px solid #eaedef;
}
.contact-box input[type=text],
.contact-box input[type=password],
.contact-box input[type=datetime],
.contact-box input[type=datetime-local],
.contact-box input[type=date],
.contact-box input[type=month],
.contact-box input[type=time],
.contact-box input[type=week],
.contact-box input[type=number],
.contact-box input[type=email],
.contact-box input[type=url],
.contact-box input[type=search],
.contact-box input[type=tel],
.contact-box textarea {
  border: 1px solid #91a1a6;
  background-color: #ffffff;
  height: 44px;
  padding: 8px;
}
.contact-box textarea {
  height: auto;
}
.label-required {
  margin: 8px 0 0 0;
  display: block;
  width: fit-content;
}
.contact-form-label {
  width: 40%;
}
.contact-form-control label {
  font-size: 0.875rem;
}
input[type=checkbox],
input[type=radio],
select {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  margin-right: 4px;
  margin-top: -4px;
}
.form-btn-box {
  margin-top: 40px;
}
.btn-attention-block-large {
  background-color: #0082c3;
}
.btn-attention-block-large:hover {
  background-color: #0082c3;
}



.col_red{color: #FF0000;}


/* レスポンシブ */
@media screen and (max-width:820px) {
  body>section {
    margin-top: clamp(1.5rem, -0.957rem + 9.18vw, 3.75rem);
    /*24-60 428-820*/
    padding: clamp(1.5rem, 0.749rem + 2.81vw, 2.188rem) clamp(0.75rem, -1.843rem + 9.69vw, 3.125rem);
    /*24-35 428-820*/
    /*12-50 428-820*/
  }
  .contact-form-group {
    display: block;
  }
  .span.acms-icon.acms-icon-checklist {
    display: contents;
  }
  .contact-form-label {
    width: 100%;
    display: flex;
    align-items: center;
  }
  .label-required {
    margin: 0 10px;
  }
  .valid-mark.valid{
    left: 95%;
    top: 50%;
  }


  /* questionary */
  .contact-form-control{
    width: 95%;
  }
  .contact-form-control.contact-flex {
    display: block;
  }
  .contact-flex div:first-child {
    width: 100%!important;
  }
  .contact-form-control.contact-flex.contact-form-questio div:last-child {
    width: 100% !important;
  }
  .valid-posi.valid-mark.valid{
    top: 40%;
    left: 95%;
  }
}


@media screen and (max-width:428px) {
  .contact-box .mail-step {
    justify-content: space-between;
  }
}