@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+Display:ital,wght@0,100..900;1,100..900&display=swap");
.section-top-keyvisual {
  display: flex;
  align-items: flex-end;
  position: relative;
  background: #163963;
  overflow: hidden;
}
.section-top-keyvisual::before {
  position: absolute;
  content: "";
  width: 100%;
  pointer-events: none;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.section-top-keyvisual .keyvisual-thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.section-top-keyvisual .wrapper {
  position: relative;
  z-index: 1;
}
.section-top-keyvisual .keyvisual-logo {
  display: block;
}
.section-top-keyvisual .keyvisual-title {
  font-weight: 500;
  color: #fff;
}
.section-top-keyvisual .keyvisual-control {
  display: flex;
  gap: 0.2rem;
}
.section-top-keyvisual .keyvisual-btn {
  font-family: "SF-Pro", sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  color: #163963;
  background: linear-gradient(301.57deg, #3b2117 -737.8%, #bc7b53 -360.27%, #e9c9cc -206.46%, #f6d2bb -24.69%, #c0927c 199.03%, #8f5944 408.77%, #713621 576.56%, #662914 660.46%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  gap: 0.09rem;
  border-radius: 0.04rem;
  height: 0.4rem;
  padding: 0.03rem 0.25rem 0.01rem;
  transition: transform 0.3s ease, filter 0.3s ease;
}
.section-top-keyvisual .keyvisual-btn:hover {
  transform: translateY(-0.02rem);
  filter: brightness(1.05);
}
.section-top-keyvisual .keyvisual-btn::before {
  content: "";
  display: block;
  width: 0.24rem;
  height: 0.24rem;
  margin-bottom: 0.025rem;
}
.section-top-keyvisual .keyvisual-btn.is-phone::before {
  background: url(../resources/img/top/phone_icon.svg) center/contain no-repeat;
}
.section-top-keyvisual .keyvisual-btn.is-mail::before {
  background: url(../resources/img/top/mail_icon.svg) center/contain no-repeat;
}
.section-top-keyvisual .keyvisual-img p {
  font-weight: 400;text-align: center;
  text-transform: uppercase;
  color: #f5f5f5;
}
.section-top-keyvisual .img {
  margin: 0 auto;
}
.section-top-keyvisual small {
  display: block;
  text-align: center;    font-style: italic;
  font-weight: 400;
  color: #f0f0f0;
}
@media print, (min-width: 768px) {
  .section-top-keyvisual {
    min-height: 100vh;
    padding: 0.33rem 0;
  }
  .section-top-keyvisual::before {
    height: 5.17rem;
    background: linear-gradient(360deg, #163963 24.47%, rgba(22, 57, 99, 0) 100%);
    opacity: 0.5;
  }
  .section-top-keyvisual .keyvisual-thumbnail {
    background: url(../resources/img/top/section_bg.jpg) center/cover no-repeat;
  }
  .section-top-keyvisual .keyvisual-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 0.2rem;
    margin-bottom: 0.4rem;
  }
  .section-top-keyvisual .keyvisual-logo {
    width: 3.12rem;
    margin-bottom: 0.44rem;
  }
  .section-top-keyvisual .keyvisual-title {
    margin-bottom: 0.3rem;
    font-size: 0.35rem;
    line-height: 1.4285714286;
  }
  .section-top-keyvisual .keyvisual-btn {
    font-size: 0.18rem;
    line-height: 1.4444444444;
  }
  .section-top-keyvisual .keyvisual-img ul {
    display: flex;
    gap: 0.4rem;
  }
  .section-top-keyvisual .keyvisual-img p {
    font-size: 0.22rem;
    line-height: 1.4545454545;
  }
  .section-top-keyvisual .img.is-unit {
    width: 2.22rem;
  }
  .section-top-keyvisual .img.is-investor {
    width: 0.94rem;
  }
  .section-top-keyvisual small {
    font-size: 0.17rem;
    line-height: 1.4444444444;
  }
}
@media only screen and (max-width: 767.98px) {
  .section-top-keyvisual {
    min-height: 100svh;
    padding: 0.5rem 0;
  }
  .section-top-keyvisual::before {
    background: linear-gradient(180deg, rgba(22, 57, 99, 0.05) 0%, rgba(22, 57, 99, 0.18) 25%, rgba(22, 57, 99, 0.9) 45%, rgba(22, 57, 99, 0.95) 50%, rgb(22, 57, 99) 100%), linear-gradient(90deg, rgba(22, 57, 99, 0.3) 0%, rgba(22, 57, 99, 0.05) 72%, transparent 100%);
    height: 70%;
  }
  .section-top-keyvisual .keyvisual-thumbnail {
    background: url(../resources/img/top/section_bg_sp.jpg) top center/4.4rem auto no-repeat;
  }
  .section-top-keyvisual .keyvisual-wrapper {
    margin-bottom: 0.6rem;
  }
  .section-top-keyvisual .keyvisual-content {
    margin-bottom: 0.5rem;
  }
  .section-top-keyvisual .keyvisual-logo {
    width: 1.56rem;
    margin: 0 auto 0.3rem;
  }
  .section-top-keyvisual .keyvisual-title {
    margin-bottom: 0.2rem;
    font-size: 0.2rem;
    line-height: 1.4285714286; text-align: center;
  }
.section-top-keyvisual .keyvisual-control{justify-content: center;}
  .section-top-keyvisual .keyvisual-btn {
    font-size: 0.18rem;
    line-height: 1.4444444444;
  }
  .section-top-keyvisual .keyvisual-img ul {
    display: flex;
    gap: 0.4rem;
  }
  .section-top-keyvisual .keyvisual-img li {
    text-align: center;
    width: 50%;
  }
  .section-top-keyvisual .keyvisual-img p {
    margin-bottom: 0.1rem;
    font-size: 0.16rem;
    line-height: 1.4545454545;
  }
  .section-top-keyvisual .img.is-unit {
    width: 1.11rem;
  }
  .section-top-keyvisual .img.is-investor {
    width: 0.47rem;
  }
  .section-top-keyvisual small {
    font-size: 0.12rem;
    line-height: 1.4444444444;
  }
}

.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.2rem;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.popup-form {
  position: relative;
  display: flex;
  width: 100%;
  max-width: 10.05rem;
  height: 5.1rem;
  overflow: hidden;
  background: #fff;
  border: 1px solid #f6d2bb;
  border-radius: 0.1rem;
}

/* =====================
   IMAGE
===================== */
.popup-form__image {
  position: relative;
  flex: 0 0 31.2%;
  width: 31.2%;
  height: 100%;
  overflow: hidden;
}

.popup-form__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 75%, #fff 100%);
  pointer-events: none;
}

.popup-form__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

/* =====================
   CONTENT
===================== */
.popup-form__content {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.popup-form__inner {
  width: 100%;
  max-width: 5.37rem;
  padding: 0 0.2rem;
}

.popup-form__title {
  margin: 0;
  font-family: "Noto Serif Display", serif;
  font-size: 0.5rem;
  font-weight: 400;
  line-height: 1.6;
  text-align: center;
  text-transform: uppercase;
  background: linear-gradient(180deg, #143963 25.43%, #123f71 88.58%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.popup-form__desc {
  max-width: 5.67rem;
  margin: 0.06rem auto 0.24rem;
  color: #163963;
  font-family: "SF-Pro", sans-serif;
  font-size: 0.18rem;
  font-weight: 400;
  line-height: 0.26rem;
  text-align: center;
}
.popup-form__form .wpcf7-not-valid-tip{position: absolute;
    right: 0;
    top: 0.1rem;}
.wpcf7 form .wpcf7-response-output{margin-top: 0 !important}    
/* =====================
   FORM
===================== */
.popup-form__form {
  width: 100%;
}

.form-group {
  border-bottom: 1px solid #d9d9d9; margin-bottom: 0;
}
.form-group p{margin-bottom: 0}
.form-group + .form-group {
  margin-top: 0;
}

.form-group input {
  display: block;
  width: 100%;
  height: 0.49rem;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #444;
  font-family: "SF-Pro", sans-serif;
  font-size: 0.18rem;
  font-weight: 400;
  line-height: 1.4444444444;
}

.form-group input::-moz-placeholder {
  color: #444;
  opacity: 1;
}

.form-group input::placeholder {
  color: #444;
  opacity: 1;
}

/* =====================
   BUTTON
===================== */
.form-action {
  display: flex;
  justify-content: center;
  margin-top: 0.34rem;
}

.form-submit {
  width: 1.63rem;
  height: 0.4rem;
  border: 0;
  border-radius: 0.04rem;
  background: linear-gradient(135deg, #f6d2bb 0%, #e9c9cc 35%, #bc7b53 65%, #8f5944 100%);
  color: #163963;
  cursor: pointer;
  font-family: "SF-Pro", sans-serif;
  font-size: 0.18rem;
  font-weight: 500;
  line-height: 1.4444444444;
  text-transform: uppercase;
  transition: transform 0.3s ease, filter 0.3s ease;
}

.form-submit:hover {
  transform: translateY(-0.02rem);
  filter: brightness(1.05);
}

/* =====================
   CLOSE
===================== */
.popup-form__close {
  position: absolute;
  top: 0.14rem;
  right: 0.18rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.25rem;
  height: 0.25rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #000;
  cursor: pointer;
  background: url(../resources/img/top/close_icon.svg) center/cover no-repeat;
}

/* =====================
   TABLET
===================== */
@media only screen and (max-width: 1024px) {
  .popup-form {
    max-width: 90vw;
    height: 4.8rem;
  }
  .popup-form__image {
    flex-basis: 30%;
    width: 30%;
  }
  .popup-form__title {
    font-size: 0.42rem;
  }
  .popup-form__inner {
    max-width: 5rem;
  }
}
/* =====================
   MOBILE
===================== */
@media only screen and (max-width: 767px) {
  .popup-form {
    display: block;
    width: calc(100vw - 0.4rem);
    max-width: 4.4rem;
    height: auto;
    min-height: 5.8rem;
  }
  .popup-form__image {
    width: 100%;
    height: 1.7rem;
  }
  .popup-form__image::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 55%, #fff 100%);
  }
  .popup-form__content {
    display: block;
  }
  .popup-form__inner {
    max-width: none;
    padding: 0.1rem 0.25rem 0.35rem;
  }
  .popup-form__title {
    font-size: 0.36rem;
    line-height: 1.35;
  }
  .popup-form__desc {
    margin-top: 0.1rem;
    margin-bottom: 0.2rem;
    font-size: 0.15rem;
    line-height: 0.22rem;
  }
  .form-group input {
    height: 0.48rem;
    font-size: 0.16rem;
  }
  .form-action {
    margin-top: 0.28rem;
  }
  .popup-form__close {
    top: -1.6rem;
    right: 0.1rem;
    color: #fff;
  }
}
