@charset "UTF-8";

/* =========================================================
   Base / Reset
========================================================= */
html {
  scroll-behavior: smooth;
}
html,
body {
  margin: 0;
  padding: 0;
}
body {
  font-family: "Noto Sans JP", sans-serif;
  font-feature-settings: "palt";
}
h1 {
  margin: 0;
}
img {
  display: block;
  margin: auto;
}

/* box-sizing */
div,
section,
img {
  box-sizing: border-box;
}

/* =========================================================
   Utilities
========================================================= */
.ls-02 { letter-spacing: -0.2px; }

.text_center { text-align: center; }
.bold { font-weight: bold; }
.light { font-weight: 200; }

.sans { font-family: "Noto Sans JP", sans-serif; }
.serif { font-family: "Noto Serif JP", serif; }

.font22 { font-size: 22px; }
.font23 { font-size: 23px; }
.font24 { font-size: 24px; }
.font25 { font-size: 25px; }
.font26 { font-size: 26px; }
.font27 { font-size: 27px; }
.font28 { font-size: 28px; }

.color_FFF { color: #fff; }

.relative {
  position: relative;
  z-index: 5;
}

.sp { display: none; }
.br_w1000 { display: none; }

.red { color: #ff3200; }

/* =========================================================
   Layout
========================================================= */
.inner {
  width: 1200px;
  margin: auto;
  position: relative;
  z-index: 5;
}

section {
  padding-bottom: 30px;
}

/* =========================================================
   Header / Hero
========================================================= */
.header {
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
}

.header_inner {
  max-width: 1920px;
  width: 100%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px;
}

.hero_wrap {
  background-image: url(../img/pc/nami_key_1.png), url(../img/pc/nami_key_2.png);
  background-repeat: repeat-x, repeat-x;
  background-position: center -14%, 40% 145%;
  background-size: 4000px, 4000px;
  margin-top: 120px;
}
.hero img { max-width: 100%; }

.hero_wrap .title {
  padding: 0 0 0 93px;
  margin-top: -17px;
}

.hero_inner {
  background-image: url(../img/pc/sakura_key_1.png), url(../img/pc/sakura_key_2.png);
  background-repeat: no-repeat;
  background-position: center 110%, 41% 0%;
  background-size: 1920px, 524px;
  padding-bottom: 50px;
}

/* 花 */
.flower {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}
.flower img { max-width: 100%; }

/* =========================================================
   First message / Alumni blocks
========================================================= */
.first_message {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin-top: -5%;
}

.first_message .left,
.first_message .right {
  width: 259px;
}

.first_message .center {
  padding: 25px 35px 35px;
  font-family: "Noto Serif JP", serif;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.first_message .center p {
  font-size: 26px;
  line-height: 1.8;
  padding-top: 25px;
  margin: 0;
}

.alumni {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  writing-mode: vertical-rl;
  text-orientation: upright;
  flex-direction: column-reverse;
  background-color: #fffcc7;
  margin-bottom: 10px;
  font-size: 20px;
}
.first_message .right .alumni { flex-direction: column; }
.alumni.even { background-color: #fadeeb; }

.year,
.name {
  height: 100%;
  padding: 10px 5px;
  box-sizing: border-box;
  line-height: 1.3;
}
.first_message .name {
    text-align: end;
}
.company_name {
  display: block;
  text-align: right;
}
.company_name .bold { padding-bottom: 10px; }

/* =========================================================
   CTA / Title / Nami
========================================================= */
.cta {
  margin-top: -20px;
  position: relative;
  z-index: 5;
}
.title { padding-top: 40px; }

.sec01 .nami,
.sec02 .nami,
.sec04 .nami,
.sec05 .nami,
.sec06 .nami {
  background-repeat: repeat-x;
  height: 18px;
}
.sec01 .nami { background-image: url(../img/pc/nami_1.png); }
.sec02 .nami { background-image: url(../img/pc/nami_2.png); }
.sec04 .nami { background-image: url(../img/pc/nami_1.png); }
.sec05 .nami { background-image: url(../img/pc/nami_2.png); }
.sec06 .nami { background-image: url(../img/pc/nami_3.png); }

.sec01 .cta { margin-top: 23px; }
.sec02 .cta { margin-top: 10px; }
.sec02 .title { padding-top: 23px; }
.sec03 .title { padding-top: 5px; }
.sec04 .title { padding-top: 23px; }
.sec05 .title { padding-top: 18px; }

/* =========================================================
   Comments
========================================================= */
.comment_wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  max-width: 1200px;
  margin: auto;
  gap: 80px;
  padding-top: 10px;
}

.comment {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 28px;
  padding: 20px 30px;
  border: 2px solid #b3b3b3;
  gap: 30px;
  margin-left: 27px;
  position: relative;
  background-color: #fffde5;
}
.comment::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: -5px;
  right: -5px;
  background-color: #666;
  z-index: -1;
}
.comment.pink { background-color: #fff5fd; }

.comment .name {
  padding: 10px 10px 10px 55px;
  margin-left: -60px;
  font-size: 22px;
  background-color: #f7931e;
  color: #fff;
}
.comment .name.pink { background-color: #f14972; }

.comment .comment_detail {
  padding: 10px 0;
  font-size: 19px;
  line-height: 1.85;
}
.comment_rigth .comment { margin-left: -33px; }

/* =========================================================
   Methods / Underline
========================================================= */
.method_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  max-width: 956px;
  margin: auto;
  padding-top: 21px;
}

.method {
  border: 2px solid #f14972;
  background-color: #fff;
  margin-bottom: 30px;
  position: relative;
  padding: 24px 50px 25px 70px;
  transform: translateX(37px);
}
.method .number {
  position: absolute;
  left: -8%;
  top: 40px;
}
.method .heading {
  font-size: 28px;
  font-weight: bold;
  margin: 0;
  position: relative;
  padding-bottom: 19px;
}
.method .heading::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #f14972;
  position: absolute;
  bottom: 0;
}
.method .text {
  font-size: 19px;
  margin: 0;
  padding: 30px 0 0;
  line-height: 1.7;
}

.under_line {
  position: relative;
  display: inline-block;
}
.under_line::before {
  content: "";
  width: 100%;
  height: 8px;
  display: block;
  background-color: #fdf55b;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}

/* sec03 variation */
.sec03 .method_wrap { max-width: 1026px; }
.sec03 .method {
  padding: 24px 30px 30px 140px;
  transform: none;
  margin-bottom: 15px;
  background-color: #ffffeb;
}
.sec03 .method .number { left: 28px; top: 23px; }
.sec03 .heading { color: #f14972; padding-bottom: 10px; }
.sec03 .method .heading::after { display: none; }
.sec03 .method .text { padding: 0; }
.sec03 .arrow { padding-bottom: 10px; }

.goukaku {
  margin-top: -64px;
  padding-bottom: 71px;
}

/* =========================================================
   Youkou
========================================================= */
.youkou { padding-top: 18px; }

.youkou_detail {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border: 2px solid #f14972;
  box-sizing: border-box;
  font-size: 24px;
  border-radius: 10px;
  max-width: 1028px;
  margin: 0 auto 14px;
  background-color: #ffffeb;
}
.youkou_detail .left {
  width: 272px;
  padding: 12px 23px;
  box-sizing: border-box;
}
.youkou_detail .right {
  padding: 12px 23px;
  box-sizing: border-box;
  flex: 1;
  border-left: 2px dashed #f14972;
}

section.sec04 { padding-bottom: 50px; }

/* =========================================================
   QA
========================================================= */
.qa_wrap {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 40px;
  row-gap: 35px;
  padding-top: 18px;
  padding-bottom: 110px;
}
.qa_wrap .heading {
  font-size: 26px;
  margin: 0;
  position: relative;
  padding-bottom: 9px;
  color: #f14972;
}
.qa_wrap .heading::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #f14972;
  position: absolute;
  bottom: 0;
}
.qa_wrap .text {
  font-size: 19px;
  margin: 0;
  padding: 10px 0 0;
  line-height: 1.7;
}
.qa {
  width: 48%;
  border: 1px solid #f14972;
  padding: 15px 37px 26px;
  box-sizing: border-box;
  border-radius: 5px;
  background-color: #fff;
  min-height: 200px;
  background-image: url(../img/pc/qa_icon.png);
  background-repeat: no-repeat;
  background-position: 95% 80%;
}

/* =========================================================
   Sec backgrounds
========================================================= */
.sec02-3 { background-color: #fcecf7; }
.sec04 { background-color: #fff; }
.sec05 { background-color: #fcecf7; }

.sec01 {
  background-image: url(../img/pc/sakura_sec_1.png);
  background-repeat: no-repeat;
  background-position: center 70%;
  background-size: 1860px;
}
.sec02-3 {
  background-image: url(../img/pc/sakura_sec_2.png);
  background-repeat: no-repeat;
  background-position: center 60%;
  background-size: 1860px;
}
.sec04 {
  background-image: url(../img/pc/sakura_sec_4.png);
  background-repeat: no-repeat;
  background-position: center 40%;
  background-size: 1920px;
}
.sec05 {
  background-image: url(../img/pc/sakura_sec_5.png);
  background-repeat: no-repeat;
  background-position: center 48%;
  background-size: 1920px;
}
.sec06 {
  background-color: #ff96b8;
  padding-bottom: 130px;
  background-image: url(../img/pc/sakura_sec_6.png);
  background-repeat: no-repeat;
  background-position: center 80%;
  background-size: 1860px;
}
.sec06 img { max-width: 100%; }

@media screen and (min-width: 1458px) {
  .sec06 .title {
    margin-top: 24px;
    padding-top: 0;
    background-image: url(../img/pc/title_6_waku.png);
    background-repeat: repeat-x;
  }
}

/* =========================================================
   Form
========================================================= */
.form_wrap {
  max-width: 1030px;
  margin: auto;
  border: 20px solid #f14972;
  background-color: #f14972;
  box-sizing: border-box;
  border-radius: 10px;
}
.form_wrap p {
  margin: 0;
  padding: 10px 16px;
}

.caution {
  display: block;
  font-size: clamp(11px, 2vw, 13px);
}

.form {
  background-color: #fff;
  border-radius: 10px;
  padding: 34px;
  font-size: 22px;
}
.input_Wrap { padding: 11px 15px; }

.input_date_wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* inputs common */
input[type="date"],
input[type="time"],
input[type="text"],
input[type="tel"],
input[type="mail"],
select,
textarea {
  font-family: "Noto Sans JP", sans-serif;
  color: #000;
  text-align: left;
}

input[type="date"],
input[type="time"],
input[type="text"],
input[type="tel"],
input[type="mail"] {
  font-size: 22px;
  background-color: #fff1fc;
  border: none;
  margin-right: 10px;
  padding: 18px;
  box-sizing: border-box;
  border-radius: 5px;
  position: relative;
}

input[type="text"],
input[type="tel"],
input[type="mail"] {
  width: 100%;
}

/* date input overlay */
input[type="date"] { min-width: 185px; }
input[type="text"].date,
.date {
  width: 185px;
}
input[type="date"]::-webkit-date-and-time-value,
.date {
  font-family: "Noto Sans JP", sans-serif;
  color: #000;
  text-align: left;
}
input[type="date"]::-webkit-calendar-picker-indicator,
.date {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  width: auto;
  height: auto;
  background: transparent;
  z-index: 1;
}
.date::placeholder { color: #000; }

/* calendar icon wrapper */
.input_date_item_wrap { position: relative; }
.input_date_item_wrap::after {
  content: "";
  width: 18px;
  height: 18px;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  background-image: url(../img/pc/calendar_icon.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0 0;
  z-index: 2;
  pointer-events: none;
}

/* select */
select {
  font-size: 22px;
  background-color: #fff1fc;
  border: none;
  padding: 18px;
  border-radius: 5px;
  -webkit-appearance: none;
  appearance: none;
  width: calc(7.5em + 36px);
  height: 34px;
  margin: 0;
  box-sizing: content-box;
}

.select_wrap {
  position: relative;
  display: inline-block;
  background-color: #fff1fc;
  border-radius: 5px;
  width: calc(9em + 36px);
  margin: 0;
}
.select_wrap::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  margin: auto;
  right: 12px;
  height: 0;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 16px solid #555;
  border-bottom: 0;
  pointer-events: none;
}

/* textarea */
textarea {
  width: 100%;
  font-size: 22px;
  background-color: #fff1fc;
  border: none;
  padding: 18px;
  box-sizing: border-box;
  border-radius: 10px;
}

/* privacy */
.form_wrap .privacy_policy {
  font-size: 16px;
  background-color: #fff1fc;
  padding: 18px;
  box-sizing: border-box;
  border-radius: 10px;
  height: 200px;
  overflow: auto;
}
.privacypolicy_item { padding-bottom: 1em; }
.form_wrap .privacy_policy p { padding-top: 0; }

/* submit button */
.submit {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #ffff6e;
  border: 2px solid #f14972;
  color: #000;
  padding: 20px 40px;
  font-size: 22px;
  border-radius: 100px;
  font-weight: bold;
  display: block;
  margin: auto;
  width: fit-content;
}

/* checkbox (doui) */
.doui_wrap { position: relative; }

div.doui_wrap input {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
div.doui_wrap label { padding-left: 62px; }

div.doui_wrap label::before {
  content: "";
  display: block;
  box-sizing: border-box;
  height: 40px;
  width: 40px;
  position: absolute;
  background-color: #fff1fc;
  top: 25%;
  margin-top: -10px;
  transition: 0.3s;
  border-radius: 5px;
}
div.doui_wrap label::after {
  content: "";
  display: block;
  box-sizing: border-box;
  height: 19px;
  width: 12px;
  position: absolute;
  top: 37%;
  left: 16px;
  margin-top: -6px;
  transition: 0.3s;
  opacity: 0;
  border-bottom: 2px solid #9a9797;
  border-right: 2px solid #9a9797;
  transform: rotate(45deg);
}
div.doui_wrap input[type="checkbox"]:checked + label::after { opacity: 1; }

/* =========================================================
   Footer
========================================================= */
.footer {
  background-color: #fff;
  padding: 38px 22px;
}
.footer_inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1920px;
  margin: auto;
}
.footer .left {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
}
.footer p {
  margin: 0;
  padding: 5px;
}
.footer img { max-width: 100%; }
.footer_url a{
  color: #000;
  text-decoration: none;
}

/* =========================================================
   Honeypot（BOT対策）※現状維持
========================================================= */
.id,
.address,
.phone,
.other,
.fax {
  height: 0;
  overflow: hidden;
  opacity: 0;
}

/* =========================================================
   Confirm / Thanks view
========================================================= */
.confirm_wrap {
  padding: 120px 20px;
  text-align: center;
}
.confirm_wrap h2,
.confirm_wrap h3 {
  text-align: center;
  color: #29b58a;
  font-size: 2.4rem;
}

.confirm_wrap table { text-align: left; }

.confirm_wrap table {
  max-width: 800px;
  margin: 30px auto;
  border-collapse: collapse;
  border: 1px solid #808080;
}
.confirm_wrap table th {
  border-bottom: 1px solid #808080;
  text-align: left;
  width: 25%;
  background-color: #f5f5f5;
  padding: 20px;
  font-weight: 700;
  font-size: 14px;
}
.confirm_wrap table td {
  border-bottom: 1px solid #808080;
  width: 75%;
  padding: 20px;
  font-size: 14px;
}

.button_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

.back {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #e3e3e3;
  border: 2px solid #bebebe;
  color: #000;
  padding: 20px 40px;
  font-size: 22px;
  border-radius: 100px;
  font-weight: bold;
  display: block;
  margin: auto;
  width: fit-content;
  margin-right: 20px;
}
.confirm_check .confirm_inner li {
    list-style-type: none;
}
.confirm_check .confirm_inner .back_button {
    margin: auto;
}

/* =========================================================
   Responsive (<=1200px)
========================================================= */
@media screen and (max-width: 1200px) {
  .header_inner { width: 100%; }

  .first_message .left,
  .first_message .right { width: 35%; }
  .first_message .center { width: 25%; }
  .first_message { width: 100%; }

  .first_message .center picture,
  .first_message .center img { max-width: 100%; }

  .first_message .alumni { width: 100%; }
  .first_message .photo { width: 70%; }
  .first_message .photo img { width: 100%; }

  #spText {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 50px;
    font-size: 25px;
  }

  .inner { width: 100%; }

  .title { padding: 20px; }
  .title img { max-width: 100%; }

  .comment_wrap { padding: 20px 20px 20px 0; }
  .font25 { font-size: 23px; }

  .sec06 img { width: 100%; }
  .sec06 .title { background: none; padding: 20px 0; }

  .footer { padding: 30px 20px 30px; }
  .footer_inner { width: 100%; }
  .footer img { max-width: 100%; }
  .footer .left { width: 50%; }
  .footer .right { width: 40%; }

  .method_wrap { padding-left: 8vw; padding-right: 20px; }
  .br_w1000 { display: block; }

  .hero_wrap {
    background-position: 50% clamp(-220px, -34vw, 0px), 34% 100%;
    margin-top: clamp(85px, 13vw, 105px);
  }

  .comment_wrap { flex-direction: column; gap: 0; }
  .comment_rigth .comment { margin-left: 27px; }

  .method { transform: none; }

  .sec03 .method_wrap { padding: 20px; }

  .youkou { padding: 0 20px; }

  .qa_wrap {
    gap: 20px;
    row-gap: 20px;
    padding: 18px 20px 110px;
    width: 100%;
    justify-content: space-between;
  }

  .header_cta { width: 45%; }
  .header_inner .h1 { width: 30%; }

  .header_cta img,
  .header_inner .h1 img { max-width: 100%; }

  .first_message .photo { height: 100%; width: 60%; }
  .alumni { font-size: 2.2vw; }

  .hero_inner {
    background-image: url(../img/pc/sakura_key_1.png);
    background-repeat: repeat-y;
    background-position: center 0%;
    background-size: 1450px;
  }

  .sec01 {
    background-image: url(../img/pc/sakura_sec_1.png);
    background-repeat: no-repeat;
    background-position: center 9%;
    background-size: 1500px;
  }
  .sec02-3 {
    background-image: url(../img/pc/sakura_sec_2.png);
    background-repeat: no-repeat;
    background-position: center 00%;
    background-size: 1500px;
  }
  .sec04 {
    background-image: url(../img/pc/sakura_sec_4.png);
    background-repeat: no-repeat;
    background-position: center 60%;
    background-size: 1500px;
  }
  .sec05 {
    background-image: url(../img/pc/sakura_sec_5.png);
    background-repeat: no-repeat;
    background-position: center 50%;
    background-size: 1500px;
  }
  .sec06 {
    background-image: url(../img/pc/sakura_sec_6.png);
    background-repeat: no-repeat;
    background-position: center 0%;
    background-size: 1500px;
  }
}

/* =========================================================
   Responsive (<=600px)
========================================================= */
@media screen and (max-width: 600px) {
  .sp { display: block; }

  img {
    max-width: initial;
    width: 100%;
  }
  picture { width: 100%; }

  .header_inner {
    min-width: initial;
    padding: 7px 10px 10px;
  }
  .header_inner .h1 { width: 43%; }
  .header_cta { width: 54%; }

  .hero_wrap {
    margin-top: 0;
    background: none;
  }
  .hero_wrap .title {
    padding: 0;
    margin-top: 0;
  }
  .hero img {
    max-width: initial;
    width: 100%;
  }

  .hero_wrap .left,
  .hero_wrap .right { width: 36%; }

  .alumni { font-size: 10px; }

  .year { padding: 10px 5px 7px; }
  .name { padding: 10px 5px 7px; }
  .company_name .bold { padding-bottom: 2px; }

  .ios .half_width { font-family: sans-serif; }

  .first_message .center {
    width: 21.4%;
    padding: 7px;
    padding-top: 6px;
  }
  .first_message {
    justify-content: center;
    margin-top: -7%;
  }
  .first_message .alumni {
    margin-bottom: 5px;
    line-height: 1.2;
  }
  .hero_wrap .photo { width: 21.5vw; }

  .inner,
  .footer_inner { width: 100%; }

  #spText p { margin: 0; }
  #spText {
    display: flex;
    justify-content: center;
    font-size: 3.5vw;
    padding-bottom: 3px;
    margin-top: -9px;
    line-height: 1.55;
  }

  .cta {
    max-width: 75vw;
    margin: auto;
  }

  .hero_wrap {
    background-image: url(../img/sp/nami_key_2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom center;
    padding-bottom: 11px;
  }

  .content_description {
    margin-top: 8px;
    letter-spacing: -1.5px;
  }

  .sec01 .cta { margin-top: -3px; }
  .sec01 .nami { display: none; }

  .title { padding: 0; }
  .font25 { font-size: 15px; }

  .comment_wrap {
    flex-direction: column-reverse;
    padding: 3px 20px 3px 0;
    gap: 0;
    padding-right: 15px;
  }
  .comment_rigth .comment { margin-left: 15px; }

  .comment .name {
    padding: 7px 0 5px 40px;
    margin-left: -42px;
    font-size: 14px;
  }
  .comment .comment_detail {
    font-size: 12px;
    padding: 8px 0;
    line-height: 1.73;
  }
  .comment {
    gap: 16px;
    padding: 12px 15px 10px 20px;
    margin-bottom: 20px;
    margin-left: 15px;
  }
  .comment .left { flex: 1; }
  .comment .right { width: 39%; }

  .sec02 .nami { display: none; }
  .sec02 .title { padding-top: 0; }
  .sec02 { padding-bottom: 10px; }

  .method_wrap { padding: 18px; }
  .sec02 .method_wrap {
    padding-left: 47px;
    padding-top: 7px;
  }
  .sec02 .method_detail { width: 100%; }
  .sec02 .method .text { padding-top: 15px; }
  .sec02 .method_wrap .method:last-child { margin-bottom: -7px; }

  .method { padding: 15px 15px 15px 42px; transform: none; }
  .method .number { left: -12%; top: -11px; }
  .method .heading {
    font-size: 17px;
    padding-bottom: 14px;
    letter-spacing: -0.5px;
  }
  .method .text { font-size: 12px; }

  .under_line { z-index: 1; }
  .under_line::before { z-index: -1; }

  .sec03 { padding-bottom: 18px; }
  .sec03 .method_wrap { padding: 0 18px 8px; }
  .sec03 .method {
    padding: 15px 15px 13px 9px;
    margin-bottom: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sec03 .method .number {
    left: 0;
    top: 0;
    position: relative;
    padding-right: 20px;
    width: 24%;
    padding-right: 12px;
    padding-bottom: 10px;
  }
  .sec03 .method .heading { padding-bottom: 3px; }
  .method_detail { width: 80%; }
  .sec03 .arrow {
    width: 50px;
    padding-bottom: 7px;
  }

  .goukaku {
    margin-top: -45px;
    padding-bottom: 10px;
  }

  .sec04 .nami { display: none; }
  .sec04 .title { padding-top: 0; }

  .youkou { padding: 0 17px 17px; }
  .youkou_detail {
    font-size: 15px;
    margin-bottom: 8px;
    letter-spacing: -0.5px;
    position: relative;
  }
  .youkou_detail .left {
    width: 110px;
    padding: 7px 9px;
  }
  .youkou_detail .right {
    padding: 7px 9px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border: none;
  }
  .youkou_detail::after {
    content: "";
    display: block;
    position: absolute;
    height: 100%;
    width: 110px;
    border-right: 2px dashed #f14972;
  }

  .qa_wrap {
    flex-direction: column;
    row-gap: 14px;
    padding: 0 18px 0;
  }
  .qa {
    width: 100%;
    margin: auto;
    padding: 14px 16px;
    min-height: initial;
    background-size: 14%;
  }
  .qa_wrap .heading {
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 5px;
  }
  .qa_wrap .text {
    padding-top: 7px;
    font-size: 13px;
  }

  .sec06 {
    background-color: #f14872;
    padding-bottom: 80px;
  }
  .sec06 .content_description {
    letter-spacing: 0;
    margin-bottom: 0;
  }
  .sec06 .nami { display: none; }
  .sec06 .title { margin-top: 0; background: none; }
  .sec06 .font22 {
    font-size: 16px;
    text-align: left;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .form_wrap {
    border: 15px solid transparent;
    background: none;
  }
  .form { font-size: 14px; padding: 10px 6px; }

  .date,
  input[type="date"],
  input[type="time"],
  input[type="text"],
  input[type="tel"],
  input[type="mail"],
  select,
  textarea {
    font-size: 16px;
    padding: 12px;
  }

  select {
    height: 22px;
    box-sizing: content-box;
    width: 110px;
  }
  .select_wrap { width: auto; }
  .select_wrap::after {
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-top: 10px solid #555;
  }

  input[type="date"],
  .date {
    -webkit-appearance: none;
    appearance: none;
    min-width: 144px;
    height: 46px;
    box-sizing: border-box;
  }
  input[type="text"].date,
  .date {
    width: 120px;
    height: 46px;
  }

  .form_wrap p { padding: 8px 16px 0; }
  .form_wrap .form_text {
    font-size: 13px;
    line-height: 1.3;
    display: inline-block;
  }
  .form_wrap .privacy_policy {
    font-size: 11px;
    padding: 11px;
    font-feature-settings: "palt";
  }

  .submit {
    padding: 12px 24px;
    font-size: 15px;
    margin: 20px auto 10px;
  }

  div.doui_wrap label::before {
    height: 28px;
    width: 28px;
  }
  div.doui_wrap label::after {
    height: 15px;
    width: 9px;
    top: 26%;
    left: 10px;
  }
  div.doui_wrap label { padding-left: 34px; }

  .footer_inner {
    flex-direction: column;
    padding-top: 20px;
    background-color: #fff;
  }
  .footer .left {
    flex-direction: column;
    text-align: center;
    gap: 0;
    width: 100%;
  }

  .footer {
    font-size: 14px;
    margin-top: -15px;
    background: none;
    padding: 0;
  }
  .footer p {
    margin: 0;
    padding: 4px;
    font-size: 12px;
  }
  .footer .left img { max-width: 56vw; }

  .sec05 .nami { display: none; }
  .sec05 .title { padding-top: 0; }
  section.sec04 { padding-bottom: 6px; }

  .footer .nami {
    background-image: url(../img/sp/nami_4.png);
    background-repeat: repeat-x;
    height: 18px;
  }
  .footer .right {
    padding: 5px 20px 20px;
    width: 92%;
  }

  .sec01{
    background-image: url(../img/sp/sakura_sec_1_u.png), url(../img/sp/sakura_sec_1_r.png);
    background-repeat: no-repeat, no-repeat;
    background-position: 155% 2%, 144% 99.5%;
    background-size: 50%, 50%;
    padding-bottom: 16px;
  }
  .sec02{
    background-image: url(../img/sp/sakura_sec_2_u.png), url(../img/sp/sakura_sec_2_r.png);
    background-repeat: no-repeat;
    background-position: -26% 42%, 122% 106%;
    background-size: 50%, 50%;
  }
  .sec04{
    background-image: url(../img/sp/sakura_sec_4_u.png);
    background-repeat: no-repeat;
    background-position: 160% 20%;
    background-size: 50%;
  }
  .sec05{
    background-image: url(../img/sp/sakura_sec_5_u.png), url(../img/sp/sakura_sec_5_r.png);
    background-repeat: no-repeat;
    background-position: -29% 14%, 123% 107.5%;
    background-size: 50%, 50%;
  }
  .sec06{
    background-image: url(../img/sp/sakura_sec_6_r.png);
    background-repeat: no-repeat;
    background-position: 565% 104%;
    background-size: 90%;
  }

  .flower { display: none; }

  /* confirm table sp */
  .confirm_wrap table th,
  .confirm_wrap table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .confirm_wrap table { width: 100%; }
  .confirm_wrap h3 { font-size: 20px; }
  .back {
    padding: 12px 24px;
    font-size: 15px;
    margin: 20px 20px 10px 0;
  }
}