@charset "UTF-8";
html {
  overflow-x: hidden !important;
}

body {
  overflow-x: hidden;
}

h3 {
  text-align: center;
  color: #3d5eb9;
}

.main-title {
  background-image: url("../img/midashi-contact.jpg");
}
.main-title::before {
  content: "contact";
}
.main-title h1::after {
  content: "contact";
}

.contact {
  width: 100%;
  text-align: center;
}
.contact p {
  text-align: center;
  margin-bottom: 2rem;
  width: 90%;
  max-width: 1000px;
}
.contact form {
  width: 80%;
  max-width: 800px;
  margin: 0 auto;
  background-color: #f7f7fa;
  padding: 2rem;
  box-sizing: border-box;
  text-align: left;
}
.contact form dl {
  flex-direction: column;
  margin: 1rem 0;
}
.contact form dl:first-child {
  margin-top: 0;
}
.contact form dt {
  font-size: 120%;
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.contact form dt .required::before {
  content: "【必須】";
  color: #f15a24;
  display: inline-block;
  font-size: 70%;
}
.contact form dt .not-required::before {
  content: "【任意】";
  color: #777;
  display: inline-block;
  font-size: 70%;
}
.contact form dd {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.contact form dd input[type=checkbox] {
  display: none;
}
.contact form dd .check-box::after {
  position: absolute;
  content: "";
  display: block;
  top: 50%;
  left: 15px;
  margin: -10px 0 0 -2px;
  width: 17px;
  height: 17px;
  border: 2px solid #a4c0f5;
  border-radius: 50%;
  transition: 0.2s;
}
.contact form dd .check-box {
  position: relative;
  padding: 0 0 0 40px;
}
.contact form dd .check-box:hover::after {
  border-color: #0171bd;
}
.contact form dd .check-box::after,
.contact form dd .check-box::before {
  position: absolute;
  content: "";
  display: block;
  top: 50%;
}
.contact form dd .check-box::before {
  left: 21px;
  margin-top: -7px;
  width: 5px;
  height: 9px;
  border-right: 2px solid red;
  border-bottom: 2px solid red;
  transform: rotate(45deg);
  opacity: 0;
}
.contact form dd input[type=checkbox]:checked + .check-box::before {
  opacity: 1;
}
.contact input[type=text], .contact input[type=email], .contact input[type=tel], .contact textarea {
  font-size: 110%;
  border: 2px solid #a4c0f5;
  transition: 0.2s;
  border-radius: 0.5rem;
  width: 100%;
  padding: 0.5rem;
  box-sizing: border-box;
}
.contact input[type=text]:focus, .contact input[type=email]:focus, .contact input[type=tel]:focus, .contact textarea:focus {
  border: 2px solid #fbd63b;
  outline: 0;
}

button {
  width: 100%;
}

input[type=submit],
.back-button,
.ca_back {
  display: inline-block;
  height: auto;
  border: none;
  text-decoration: none;
  color: #fff;
  font-size: 2rem;
  font-weight: 800;
  border-radius: 8px;
  text-align: center;
  padding: 0.5rem 2rem;
  margin: 1rem 0 0 0;
  box-shadow: 0 6px 0 0 #a4c0f5;
  transform: translateY(-6px);
  transition: 0.3s all;
  background: #3d5eb9;
  background: linear-gradient(to bottom, #a4c0f5 0%, #242a6d 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0ba500", endColorstr="#008000", GradientType=0);
  box-sizing: border-box;
}

.back-button {
  box-shadow: 0 6px 0 0 #333;
  background: #aaa;
  background: linear-gradient(to bottom, #bbb 0%, #777 100%);
}

input[type=submit]:hover,
.ca_back:hover {
  box-shadow: 0 2px 0 0 #a4c0f5;
  transform: translateY(-2px);
}

.back-button:hover {
  box-shadow: 0 2px 0 0 #333;
  transform: translateY(-2px);
}

input[type=button] {
  margin: 0;
}

.ca_back {
  margin: 1rem 0 0 0;
}

.formTable {
  width: 100%;
  margin: 0 auto;
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.formTable th {
  width: 40%;
  background-color: #dde7fc;
  text-align: left;
  padding: 1rem;
}

.formTable tr {
  line-height: 1.5rem;
}

.formTable td {
  width: 60%;
  text-align: left;
  background-color: #fff;
  padding: 1rem;
  word-break: break-word;
}

/*--thanks--*/
.contact p {
  margin: 0 auto;
  margin-bottom: 2rem;
}

.bg-gray {
  background: #f7f7fa;
  padding: 1rem;
}

footer .footer_contact .contact-button button {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.a-index {
  font-size: 120%;
}

.error_messe {
  margin: 0 auto;
}

@media screen and (max-width: 600px) {
  .contact form {
    width: 100%;
    padding: 1rem;
  }
  p.cen {
    display: flex;
    flex-direction: column;
  }
  input.submit-button.dark {
    margin: 0;
  }
}/*# sourceMappingURL=contact.css.map */