@charset "UTF-8";
/* CSS Document */
/* -------------------------------------------------

Reset.css

------------------------------------------------- */
@media print {
  html,
  body {
    zoom: 0.8;
  }
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none;
}

html {
  font-size: 62.5%;
}

body {
  color: #222;
  font-size: clamp(14px, 1.5vw, 18px);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-style: normal;
  line-height: 2;
}
body * {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  line-height: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
}

img {
  width: 100%;
  vertical-align: middle;
}

a {
  color: #222;
  outline: none;
  text-decoration: none;
  transition: 0.3s;
  display: inline-block;
}
a:hover {
  transform: translateY(-5px);
}
a img {
  border-style: none;
  transition: 0.3s;
}

#wrapper header {
  background-color: #FE6FA5;
  color: #fff;
  position: relative;
  padding: 50px 0 0;
}
#wrapper header .keisei {
  font-size: 3rem;
  margin: 0 clamp(25px, 5.2vw, 100px);
}
@media screen and (max-width: 960px) {
  #wrapper header .keisei {
    font-size: 2.3rem;
  }
}
#wrapper header h1 {
  font-size: 4rem;
  margin: 0 clamp(25px, 5.2vw, 100px) 40px;
  line-height: 100%;
}
@media screen and (max-width: 960px) {
  #wrapper header h1 {
    font-size: 3rem;
    line-height: 120%;
  }
}
#wrapper main {
  max-width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  #wrapper main {
    max-width: 100%;
    margin-left: 30px;
    margin-right: 30px;
  }
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main {
    max-width: 100%;
    margin-left: 25px;
    margin-right: 25px;
  }
}
#wrapper main {
  margin-bottom: 80px;
}
@media screen and (max-width: 960px) {
  #wrapper main {
    margin-bottom: 40px;
    padding-top: 20px;
  }
}
#wrapper main p.requiredText {
  font-size: 1.6rem;
  font-weight: 500;
  text-align: right;
}
@media screen and (max-width: 960px) {
  #wrapper main p.requiredText {
    font-size: 1.4rem;
  }
}
#wrapper main p.requiredText span {
  color: red;
}
#wrapper main .formTable {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 40px;
}
#wrapper main .formTable > tbody > tr > th, #wrapper main .formTable > tbody > tr > td {
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #ddd;
  padding: 20px 10px;
  font-weight: 500;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .formTable > tbody > tr > th, #wrapper main .formTable > tbody > tr > td {
    display: block;
  }
}
#wrapper main .formTable > tbody > tr > th {
  width: 270px;
}
@media screen and (max-width: 960px) {
  #wrapper main .formTable > tbody > tr > th {
    width: 200px;
  }
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .formTable > tbody > tr > th {
    width: 100%;
    padding: 15px 0 5px;
    border-bottom: 0;
  }
}
#wrapper main .formTable > tbody > tr > th p {
  position: relative;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .formTable > tbody > tr > th p {
    font-weight: 700;
  }
}
#wrapper main .formTable > tbody > tr > th p small {
  font-size: 0.9em;
}
#wrapper main .formTable > tbody > tr > th p.required::after {
  content: "※";
  position: absolute;
  right: 0;
  top: 0;
  color: red;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .formTable > tbody > tr > td {
    padding: 0 0 15px;
  }
}
#wrapper main .formTable > tbody > tr > td small {
  display: block;
  font-size: 0.9em;
  margin-bottom: 10px;
  line-height: 140%;
}
#wrapper main .formTable > tbody > tr > td table.sub {
  width: 100%;
}
#wrapper main .formTable > tbody > tr > td table.sub tr:not(:last-child) th, #wrapper main .formTable > tbody > tr > td table.sub tr:not(:last-child) td {
  padding-bottom: 10px;
}
#wrapper main .formTable > tbody > tr > td table.sub tr th {
  width: 150px;
}
@media screen and (max-width: 960px) {
  #wrapper main .formTable > tbody > tr > td table.sub tr th {
    width: 110px;
  }
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .formTable > tbody > tr > td table.sub tr th {
    width: 95px;
  }
}
#wrapper main .aisyo h2 {
  font-size: 2.3rem;
  margin-bottom: 10px;
}
#wrapper main .aisyo h2::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border: 5px solid #FE6FA5;
  border-radius: 50%;
  line-height: 100%;
  vertical-align: middle;
  margin: 0 8px 4px 0;
}
#wrapper main .policyArea {
  padding-top: 20px;
  margin-bottom: 50px;
  text-align: center;
}
@media screen and (max-width: 960px) {
  #wrapper main .policyArea {
    margin-bottom: 30px;
  }
}
#wrapper main .policyArea h3 {
  font-size: 2.5rem;
  margin-bottom: 20px;
}
@media screen and (max-width: 960px) {
  #wrapper main .policyArea h3 {
    font-size: 2.2rem;
  }
}
#wrapper main .policyArea p {
  font-weight: 500;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .policyArea p {
    text-align: left;
  }
}
#wrapper main .submit {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 20px;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .submit {
    gap: 10px;
  }
}
#wrapper main .submit p {
  width: 400px;
}
@media screen and (max-width: 960px) {
  #wrapper main .submit p {
    width: 320px;
  }
}
@media screen and (max-width: 668px) {
  #wrapper main .submit p {
    width: 280px;
  }
}
#wrapper main .submit p small {
  font-size: 1.6rem;
  font-weight: 500;
  display: block;
  text-align: center;
  margin-bottom: 5px;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .submit p small {
    font-size: 1.2rem;
  }
}
#wrapper main .submit p input[type=submit] {
  width: 100%;
  max-width: 100%;
}
@media screen and (max-width: 960px) {
  #wrapper main .submit p input[type=submit] {
    max-width: 100%;
  }
}
@media screen and (max-width: 668px) {
  #wrapper main .submit p input[type=submit] {
    max-width: 100%;
  }
}
#wrapper main .okArea {
  text-align: center;
}
#wrapper main .okArea h2 {
  font-size: 3rem;
  margin: 20px 0 0;
  padding-bottom: 15px;
}
@media screen and (max-width: 960px) {
  #wrapper main .okArea h2 {
    font-size: 2rem;
  }
}
#wrapper main .okArea p {
  margin-top: 20px;
}
@media screen and (max-width: 668px) and (orientation: portrait) {
  #wrapper main .okArea p {
    text-align: left;
  }
}
#wrapper main .okArea p.btn {
  margin-top: 40px;
}

input[type=text],
input[type=email],
input[type=date],
input[type=tel],
textarea,
select {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1em;
  appearance: none;
  outline: none;
  border: 0;
  background-color: #f5f5f5;
  border-radius: 30px;
  color: #333;
  padding: 10px 20px;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=date]:focus,
input[type=tel]:focus,
textarea:focus,
select:focus {
  outline: none;
}

input[type=submit],
input[type=button] {
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 2px;
  appearance: none;
  outline: none;
  border: 0;
  transition: 0.5s;
  cursor: pointer;
  background-color: #FE6FA5;
  color: #fff;
  display: block;
  width: 100%;
  max-width: 400px;
  border-radius: 50px;
  font-size: 2.3rem;
  padding: 30px 10px;
  box-shadow: 5px 5px 0px 0px rgba(51, 51, 51, 0.1);
}
@media screen and (max-width: 960px) {
  input[type=submit],
  input[type=button] {
    font-size: 2rem;
    padding: 25px 10px;
    max-width: 320px;
  }
}
@media screen and (max-width: 668px) {
  input[type=submit],
  input[type=button] {
    font-size: 1.6rem;
    padding: 20px 0;
    max-width: 280px;
  }
}
input[type=submit]:focus,
input[type=button]:focus {
  outline: none;
}
input[type=submit]:hover,
input[type=button]:hover {
  transform: translateY(-5px);
}

::placeholder {
  color: #ccc;
}

.sizeXS {
  width: 30%;
  max-width: 130px;
}

.sizeS {
  width: 45%;
  max-width: 130px;
}

.sizeM {
  width: 65%;
}
@media screen and (max-width: 960px) {
  .sizeM {
    width: 100%;
  }
}

.sizeL {
  width: 100%;
}

/* エラーメッセージ
-------------------------------------------------*/
.formLayout .errmsg,
.formLayout #errorMessage {
  box-sizing: border-box;
  width: 100%;
  border: 3px solid #f00;
  padding: 10px;
  margin: 0 auto 10px;
  color: #f00;
}
.formLayout .errmsg a,
.formLayout #errorMessage a {
  color: #f00;
}

/* 画面別表示/非表示
-------------------------------------------------*/
.formLayout.input_now .display_check,
.formLayout.check_now .display_input {
  display: none !important;
}