/* ---------------------------------------------------
  Reset
--------------------------------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

img, video, canvas, svg {
  display: block;
  width: 100%;
  height: auto;
}

input,
button,
select,
textarea {
  font: inherit;
  text-transform: none;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

ol,
ul {
  list-style: none;
  padding: 0;
}

#root, #__next {
  isolation: isolate;
}

/* ---------------------------------------------------
  Setting
--------------------------------------------------- */
/* ---------------------------------------------------
  Mixin
--------------------------------------------------- */
/* ---------------------------------------------------
  Functions
--------------------------------------------------- */
.c-red {
  color: #f00;
}

.c-pink {
  color: #FF3E8D;
}

.mothers-day {
  max-width: none;
  padding: 7.6923076923vw 3.8461538462vw;
}
@media screen and (min-width: 768px) {
  .mothers-day {
    max-width: 930px;
    margin: 0 auto;
    padding: 60px 0;
  }
}

.mothers-day-ttl {
  margin-bottom: 5.1282051282vw;
  padding-bottom: 4.6153846154vw;
  border-bottom: 1px solid #BCBCBC;
  font-size: 5.1282051282vw;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .mothers-day-ttl {
    margin-bottom: 20px;
    padding-bottom: 24px;
    font-size: 26px;
  }
}

.mothers-day-txt {
  margin-bottom: 5.1282051282vw;
  font-size: 4.1025641026vw;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .mothers-day-txt {
    margin-bottom: 20px;
    font-size: 16px;
  }
}

.mothers-day-step {
  margin-bottom: 7.6923076923vw;
}
@media screen and (min-width: 768px) {
  .mothers-day-step {
    margin-bottom: 30px;
  }
}
.mothers-day-step dt {
  font-size: 4.6153846154vw;
  font-weight: 700;
  line-height: 1.66;
}
@media screen and (min-width: 768px) {
  .mothers-day-step dt {
    font-size: 18px;
  }
}
.mothers-day-step dd {
  font-size: 4.1025641026vw;
  line-height: 1.66;
}
@media screen and (min-width: 768px) {
  .mothers-day-step dd {
    font-size: 16px;
  }
}

.mothers-day-hd {
  background: #FF3E8D;
  text-align: center;
  color: #fff;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 7.6923076923vw;
  padding: 5.1282051282vw 0;
  font-size: 5.1282051282vw;
}
@media screen and (min-width: 768px) {
  .mothers-day-hd {
    margin-bottom: 30px;
    padding: 20px 0;
    font-size: 20px;
  }
}

.form-table {
  display: block;
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 10.2564102564vw;
}
@media screen and (min-width: 768px) {
  .form-table {
    display: table;
    margin-bottom: 60px;
  }
}
.form-table tbody {
  display: block;
}
@media screen and (min-width: 768px) {
  .form-table tbody {
    display: table-row-group;
  }
}
.form-table tr {
  display: block;
  border-top: 1px solid #c8c8c8;
  border-bottom: 1px solid #c8c8c8;
}
@media screen and (min-width: 768px) {
  .form-table tr {
    display: table-row;
    border: none;
  }
}
.form-table th {
  display: block;
  background: #ECE9E0;
  text-align: left;
  font-weight: normal;
  padding: 3.8461538462vw 5.1282051282vw;
  border: none;
  font-size: 4.1025641026vw;
}
@media screen and (min-width: 768px) {
  .form-table th {
    display: table-cell;
    width: 23.6%;
    padding: 30px 20px;
    border-bottom: 1px solid #c8c8c8;
    font-size: 16px;
  }
}
.form-table th .must {
  display: inline-block;
  margin-left: 3.8461538462vw;
  font-size: 4.1025641026vw;
  color: #A20000;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .form-table th .must {
    margin-left: 15px;
    font-size: 16px;
  }
}
.form-table td {
  display: block;
  padding: 3.0769230769vw 5.1282051282vw;
  font-size: 3.5897435897vw;
  border: none;
}
@media screen and (min-width: 768px) {
  .form-table td {
    display: table-cell;
    padding: 20px;
    border-bottom: 1px solid #c8c8c8;
    font-size: 14px;
  }
}
.form-table td input,
.form-table td select {
  width: 100%;
  height: 10.2564102564vw;
  padding: 1.0256410256vw;
  border: 1px solid #C8C8C8;
  box-sizing: border-box;
  font-size: 4.1025641026vw;
}
@media screen and (min-width: 768px) {
  .form-table td input,
  .form-table td select {
    height: 42px;
    padding: 8px;
    font-size: 16px;
  }
}
@media screen and (min-width: 768px) {
  .form-table td select {
    width: 165px;
  }
}
.form-table td .form-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 5.1282051282vw;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row {
    flex-direction: row;
    align-items: center;
    gap: 0 20px;
    margin-bottom: 20px;
  }
}
.form-table td .form-row dt {
  width: 100%;
  margin-bottom: 1.2820512821vw;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row dt {
    width: 130px;
    margin: 0;
  }
}
.form-table td .form-row dt .must {
  display: inline-block;
  font-size: 3.5897435897vw;
  color: #A20000;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row dt .must{
    font-size: 14px;
  }
}
.form-table td .form-row dd {
  width: 100%;
  margin: 0;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row dd {
    width: calc(100% - 130px);
  }
}
.form-table td .form-row.form-row-yubin {
  flex-direction: row;
  gap: 0 2.0512820513vw;
}
.form-table td .form-row.form-row-yubin dt {
  width: auto;
  text-align: center;
}
.form-table td .form-row.form-row-yubin dd {
  display: flex;
  align-items: center;
  gap: 0 2.0512820513vw;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row.form-row-yubin dd {
    gap: 0 20px;
  }
}
.form-table td .form-row.form-row-yubin dd input {
  width: 51.2820512821vw;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row.form-row-yubin dd input {
    width: 165px;
  }
}
.form-table td .form-row.form-row-yubin dd .form-yubin-btn {
  text-align: center;
  background-color: #ECE9E0;
  border: none;
  width: 21.5384615385vw;
  height: 10.2564102564vw;
  font-size: 3.5897435897vw;
  line-height: 10.2564102564vw;
}
@media screen and (min-width: 768px) {
  .form-table td .form-row.form-row-yubin dd .form-yubin-btn {
    width: 96px;
    height: 30px;
    font-size: 14px;
    line-height: 30px;
  }
}

.form-btn-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 5.1282051282vw 0;
  margin-top: 10.2564102564vw;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap {
    flex-direction: row;
    gap: 0 30px;
    margin-top: 60px;
  }
}
.form-btn-wrap--complete {
  margin-top: 20.5128205128vw;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap--complete {
    margin-top: 200px;
  }
}
.form-btn-wrap .form-btn {
  position: relative;
  width: 100%;
  height: 15.8974358974vw;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap .form-btn {
    width: 260px;
    height: 62px;
  }
}
@media screen and (min-width: 768px) {
  .form-btn-wrap .form-btn--wide {
    width: 350px;
  }
}
.form-btn-wrap .form-btn::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 2.8205128205vw);
  right: 6.6666666667vw;
  width: 3.0769230769vw;
  height: 5.641025641vw;
  background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2012%2022%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20%23fff%3B%20stroke-width%3A%200px%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22cls-1%22%20points%3D%220%200%2012%2011.54%20.06%2022%207.02%2011.54%200%200%22%2F%3E%3C%2Fsvg%3E");
  background-position: 0 0;
  background-size: cover;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap .form-btn::after {
    top: calc(50% - 11px);
    right: 26px;
    width: 12px;
    height: 22px;
  }
}
.form-btn-wrap input {
  width: 100%;
  margin: 0;
  border: none;
  height: 15.8974358974vw;
  background: linear-gradient(to bottom, #cea669 0%, #cea669 50%, #ba8c45 50%, #ba8c45 100%);
  box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.15);
  font-size: 5.1282051282vw;
  line-height: 15.8974358974vw;
  letter-spacing: 0.5128205128vw;
  text-align: center;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap input {
    width: 260px;
    height: 62px;
    font-size: 20px;
    line-height: 62px;
    letter-spacing: 2px;
  }
}
@media screen and (min-width: 768px) {
  .form-btn-wrap input.form-btn-confirm {
    width: 350px;
    margin: 0 auto;
  }
}
.form-btn-wrap input.form-btn-submit {
  background: linear-gradient(to bottom, #ff3f8c 0%, #ff3f8c 50%, #ea1b6e 50%, #ea1b6e 100%);
}
.form-btn-wrap .form-btn-back {
  display: block;
  position: relative;
  width: 100%;
  border: none;
  height: 15.8974358974vw;
  text-decoration: none;
  background: linear-gradient(to bottom, #cea669 0%, #cea669 50%, #ba8c45 50%, #ba8c45 100%);
  box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.15);
  font-size: 5.1282051282vw;
  line-height: 15.8974358974vw;
  letter-spacing: 0.5128205128vw;
  text-align: center;
  color: #fff;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .form-btn-wrap .form-btn-back {
    width: 260px;
    height: 62px;
    font-size: 20px;
    line-height: 62px;
    letter-spacing: 2px;
  }
}
/*# sourceMappingURL=map/style.css.map */