@charset "UTF-8";
:root {
  --table_bgc1:#e4fceb;
  --table_bgc2:#e6f0e9;
}

.bg_img_tl {
  position: absolute;
}

.bg_img_tr {
  position: absolute;
}

#sec1 {
  position: relative;
  z-index: 0;
  height: 100vh;
  display: flex;
  align-items: center;
}
#sec1 .title {
  text-align: center;
  width: fit-content;
  margin: 0 auto;
}
#sec1 .title h1 {
  font-size: 3rem;
}
#sec1 .title h1 span {
  font-size: 1rem;
}

form .pi_agree {
  margin-top: 10px;
  text-align: center;
}
form .confirm_btn {
  font-size: 16px;
  cursor: pointer;
  background-color: #23d0c9;
  color: white;
  padding: 10px 40px;
  border: none;
  border-radius: 30px;
  transition: background-color 0.3s;
}
form .confirm_btn:hover {
  background-color: #1dbab3; /* ホバー時の色 */
}

.btn_box {
  display: block;
  width: fit-content;
  margin: 30px auto 0;
}

.formTable {
  border-spacing: 0 15px; /* 横方向は0、縦方向は25pxの間隔 */
  border-collapse: separate; /* 必須 */
  width: 50%;
  margin: 0 auto;
}
.formTable tr:nth-child(odd) th {
  background-color: var(--table_bgc1);
}
.formTable tr:nth-child(even) th {
  background-color: var(--table_bgc2);
}
.formTable input, .formTable textarea {
  width: 90%;
}
.formTable th {
  position: relative;
  padding: 5px 10px;
  width: 30%;
}
.formTable td {
  padding-left: 15px;
  width: 70%;
}
@media (max-width: 767px) {
  .formTable th {
    padding: 5px;
    font-size: 0.8rem;
  }
  .formTable td {
    padding-left: 5px;
    font-size: 0.8rem;
  }
}
.formTable .form_require {
  color: #ED1E79;
  font-size: 12px;
  position: absolute;
  right: 2px;
}

@media (max-width: 767px) {
  .formTable {
    width: 80%;
  }
}
input, textarea {
  padding: 6.25px 12.5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -o-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #CCCCCC;
}

#confirmPage {
  display: none; /* 初期状態は非表示 */
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.95); /* 背景色 */
  max-height: 90vh; /* 画面の90%の高さ */
  overflow-y: auto; /* 縦スクロールを追加 */
}
#confirmPage .container {
  width: fit-content;
  margin: 0 auto;
  padding-top: 5%;
}
#confirmPage h2 {
  font-size: 1.5rem;
  text-align: center;
}
#confirmPage p {
  font-size: 1.3rem;
}
#confirmPage.is_active {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 1000; /* 他の要素の上に表示 */
}

@media (max-width: 767px) {
  #confirmPage .container {
    width: 80%;
    margin: 0 auto;
  }
  #confirmPage .container th, #confirmPage .container td {
    font-size: 0.8rem;
    white-space: pre-wrap;
  }
}
.submit_btn {
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color: #23d0c9;
  color: white;
  padding: 10px 40px;
  border: none;
  border-radius: 30px;
  transition: background-color 0.3s;
}
.submit_btn:hover {
  background-color: #1dbab3; /* ホバー時の色 */
}

#confirmationData tr:nth-child(odd) th {
  background-color: var(--table_bgc1);
}
#confirmationData tr:nth-child(even) th {
  background-color: var(--table_bgc2);
}
#confirmationData th {
  padding: 0 10px;
}
#confirmationData td {
  width: 200px;
  padding-left: 10px;
}
@media (max-width: 767px) {
  #confirmationData th {
    width: 30%;
  }
  #confirmationData td {
    width: 70%;
  }
}
#confirmationData .form_require {
  color: #ED1E79;
  font-size: 12px;
  position: absolute;
  right: 2px;
}

@media (min-width: 768px) {
  .min768none {
    display: none;
  }
}/*# sourceMappingURL=style_contact.css.map */