/* -------------------------------------------------

    base

------------------------------------------------- */
:root {
  --header-height: 74px;
  --zIndex-header: 99;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  color: var(--c-black-90);
  font-family: var(--font-notosans);
  font-weight: 400;
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}

.contents {
  margin-top: calc(8px * 20);
}

.container {
  margin: 0 auto;
  max-width: 1080px;
  width: 100%;
}

.container-inner {
  margin: 0 auto;
  max-width: 755px;
  width: 100%;
}

.bg-white {
  background: #fff;
}

.title {
  font-size: 28px;
  font-weight: bold;
}

.title.is-center {
  text-align: center;
}

.for-sp {
  display: none;
}

@media screen and (max-width: 1080px) {
  .contents {
    margin-top: calc(8px * 10);
  }

  .container {
    padding: 0 20px;
    width: auto;
  }

  .container-inner {
    padding: 0 20px;
    width: auto;
  }

  .title {
    font-size: 22px;
  }

  .for-sp {
    display: block;
  }
}

/* -------------------------------------------------
  
      button
  
  ------------------------------------------------- */
.buttonPrimary {
  align-items: center;
  background: linear-gradient(
  90deg,
  rgba(0, 128, 204, 1) 0%,
  rgba(107, 187, 234, 1) 100%
  );
  border: none;
  border-radius: 100vmax;
  box-shadow: 0 0 10px rgba(0, 71, 113, 0.16);
  color: #fff;
  column-gap: 18px;
  cursor: pointer;
  display: flex;
  font-family: var(--font-notosans);
  font-size: 16px;
  font-weight: 500;
  height: 70px;
  justify-content: space-between;
  letter-spacing: 0.1em;
  padding-inline: 42px 20px;
  padding-left: calc(8px * 5);
  text-align: left;
  transition: background 0.2s;
  width: 260px;
}

@media screen and (max-width: 767px) {
  .buttonPrimary {
    height: 55px;
  }
}

.buttonPrimary::after {
  align-self: center;
  content: url("../../images/lp/icon_button_arrow.svg");
}

.buttonPrimary--lg {
  max-width: 100%;
  width: fit-content;
}

@media (any-hover: hover) {
  .buttonPrimary:hover {
    background: #fff;
    color: #0080cc;
    transition: background 0.2s;
  }

  .buttonPrimary:hover::after {
    content: url("../../images/lp/icon_button_arrow_hover.svg");
  }
}

.buttonSecondary {
  align-items: center;
  background: linear-gradient(90deg, rgba(107, 222, 50) 0%, rgba(185, 233, 49, 1) 100%);
  border: none;
  border-radius: 100vmax;
  color: #fff;
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 70px;
  justify-content: space-between;
  letter-spacing: 0.1em;
  padding-inline: 42px 20px;
  width: 260px;
}

@media screen and (max-width: 767px) {
  .buttonSecondary {
    height: 55px;
  }
}

.buttonSecondary::after {
  content: url("../../images/lp/icon_button_arrow_secondary.svg");
}

@media (any-hover: hover) {
  .buttonSecondary:hover {
    background: #fff;
    border: 1px solid #fff;
    color: #6bde32;
    transition: background 0.2s;
  }

  .buttonSecondary:hover::after {
    content: url("../../images/lp/icon_arrow_secondary_hover.svg");
  }
}

.buttonSend {
  background: linear-gradient(
  90deg,
  rgba(0, 128, 204, 1) 0%,
  rgba(107, 187, 234, 1) 100%
  );
  border: none;
  border-radius: 100vmax;
  box-shadow: 0 0 10px rgba(0, 71, 113, 0.16);
  color: #fff;
  cursor: pointer;
  font-family: var(--font-notosans);
  font-size: 16px;
  font-weight: 500;
  height: 70px;
  padding-left: calc(8px * 5);
  text-align: left;
  transition: background 0.2s;
  width: 260px;
}

@media (any-hover: hover) {
  .buttonSend:hover {
    background: #fff;
    color: #0080cc;
    transition: background 0.2s;
  }

  .buttonSend:hover::after {
    content: url("../../images/lp/icon_button_arrow_hover.svg");
  }
}

@media screen and (max-width: 767px) {
  .buttonSend {
    height: 55px;
  }
}

.buttonEntry {
  align-items: center;
  background: #fff;
  border-radius: 100vmax;
  box-shadow: 0 0 10px rgba(0, 71, 113, 0.16);
  color: var(--c-black-90);
  display: inline-grid;
  font-size: 16px;
  font-weight: 500;
  grid-template-columns: 1fr auto 1fr;
  height: 70px;
  line-height: 1.875;
  max-width: 480px;
  padding-right: 20px;
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 1;
}

.buttonEntry::before {
  content: "";
}

.buttonEntry::after {
  content: url("../../images/lp/icon_arrow_green.svg");
  height: 22px;
  justify-self: end;
  width: 22px;
}

@media (any-hover: hover) {
  .buttonEntry:hover {
    background: #6bde32;
    box-shadow: 0 0 4px rgba(255, 255, 255, 0.6);
    color: #fff;
    transition: background 0.4s;
  }

  .buttonEntry:hover::after {
    content: url("../../images/lp/icon_button_arrow_secondary.svg");
  }
}

/* -------------------------------------------------
  
      header
  
  ------------------------------------------------- */
.header {
  height: var(--header-height);
  position: relative;
  z-index: var(--zIndex-header);
}

.header__inner {
  align-items: center;
  background: transparent;
  display: flex;
  height: var(--header-height);
  justify-content: space-between;
  margin: 0 2.8vw;
}

.headerLogo a {
  align-items: center;
  column-gap: calc(8px * 2);
  display: flex;
  padding-top: 2.3vw;
}

.headerLogo__img img {
  height: 66px;
  width: auto;
}

.headerLogo__lead {
  color: var(--c-blue);
  font-size: 16px;
  font-weight: 500;
}

.headerNav__list {
  align-items: center;
  display: flex;
}

.headerNav__list li {
  padding: 0 calc(8px * 7);
  position: relative;
  text-align: center;
}

.headerNav__list li:nth-child(n + 2)::before {
  border-left: 1px dashed var(--c-blue--500);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 1px;
}

.headerNav__list--word {
  color: var(--c-blue);
  font-family: var(--font-robot);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.1em;
}

.headerNav__list--lead {
  color: var(--c-black-90);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  margin-top: calc(8px * 1);
}

.headerLogo a:hover {
  opacity: 0.8;
}

@media (any-hover: hover) {
  .headerNav__link:hover {
    opacity: 0.8;
  }
}

.headerToggle {
  display: none;
}

.toggleMenu {
  display: none;
}

.toggleMenu.is-active {
  display: block;
}

@media screen and (max-width: 1200px) {
  .headerNav__list li {
    padding: 0 32px;
  }
}

@media screen and (max-width: 1080px) {
  .header {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1100;
  }

  .header__inner {
    height: var(--header-height);
    margin: 0;
    padding: 0 16px;
  }

  .headerLogo a {
    display: grid;
    grid-template-columns: 100%;
    padding-block: 6px 10px;
    text-align: center;
  }

  .headerLogo__img img {
    height: 44px;
  }

  .headerLogo__lead {
    font-size: 12px;
  }

  .headerNav__list li {
    padding: 0 calc(8px * 5);
  }

  .headerNav {
    display: none;
  }

  .headerToggle {
    background: var(--c-blue--500);
    border-radius: 50%;
    cursor: pointer;
    display: block;
    height: 45px;
    position: relative;
    width: 45px;
  }

  .headerToggle span {
    background: #fff;
    height: 1px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 37%;
    transition: 0.4s;
    width: 25px;
  }

  .headerToggle span:nth-of-type(2) {
    top: 50%;
  }

  .headerToggle span:nth-of-type(3) {
    top: 63%;
  }

  .is-active.headerToggle {
    background: #fff;
  }

  .is-active.headerToggle span {
    background: var(--c-blue--500);
    top: 50%;
    transform: rotate(-45deg);
  }

  .is-active.headerToggle span:nth-of-type(2) {
    display: none;
  }

  .is-active.headerToggle span:nth-of-type(3) {
    top: 50%;
    transform: rotate(45deg);
  }

  .toggleMenu {
    background: var(--c-blue--500);
    display: none;
    height: 100svh;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
  }

  .toggleMenu__inner {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
  }

  .toggleMenuList li {
    text-align: center;
  }

  .toggleMenuList li:nth-child(n + 2) {
    margin-top: calc(8px * 4);
  }

  .toggleMenuList__word {
    color: var(--c-blue);
    font-size: 15px;
  }

  .toggleMenuList__lead {
    color: #fff;
    font-size: 18px;
    margin-top: calc(8px * 1);
  }
}

/* -------------------------------------------------

      footer

  ------------------------------------------------- */

.footerEntry {
  background: url("../../images/lp/bg_footer_entry.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: 222px;
  overflow: hidden;
  padding: calc(8px * 7) 0;
  position: relative;
}

.footerEntry__decoration {
  position: absolute;
}

.footerEntry__decoration--1 {
  left: 0.6vw;
  top: 0.8vw;
  width: 29vw;
}

.footerEntry__decoration--2 {
  right: 0.6vw;
  top: 0.8vw;
  width: 23vw;
}

.footerEntry .container {
  position: relative;
}

.footerEntry .container::before {
  background: url("../../images/lp/footer_entry_deco1.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  bottom: -64px;
  content: "";
  height: 20vw;
  left: -8vw;
  position: absolute;
  width: 29vw;
}

.footerEntry .container::after {
  background: url("../../images/lp/illust_footer_right.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  bottom: -56px;
  content: "";
  height: 16vw;
  position: absolute;
  right: -8vw;
  width: 29vw;
}

.footerEntry__title {
  color: #fff;
  font-family: var(--font-playwrite);
  font-size: 88px;
  font-weight: 400;
  text-align: center;
  transform: rotate(-5deg);
}

.footerEntry__word {
  font-size: 21px;
  font-weight: bold;
  margin-top: calc(8px * 10);
  text-align: center;
}

.footerEntry__text {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
  margin-top: calc(8px * 3);
  text-align: center;
}

.footerEntry__button {
  margin-top: calc(8px * 8);
  text-align: center;
}

.footerArea {
  padding: calc(8px * 8) 0 calc(8px * 6);
}

.footerAreaNav {
  align-items: center;
  display: grid;
  grid-template-columns: 380px auto;
}

.footerArea a:hover {
  opacity: 0.8;
  text-decoration: underline;
}

.footerAreaNav__logo img {
  height: 62px;
  width: auto;
}

.footerAreaNav__list {
  align-items: center;
  column-gap: calc(8px * 4);
  display: flex;
}

.footerAreaNav__list li {
  font-size: 13px;
  font-weight: 500;
}

.footerAreaNav__list li a {
  color: var(--c-black-90);
}

.footerAreaNotes {
  align-items: center;
  display: grid;
  grid-template-columns: 380px auto;
  margin-top: calc(8px * 2);
}

.footerAreaNotes a {
  color: #3a3a3a;
}

.footerAreaNotes__insta {
  align-items: center;
  column-gap: calc(8px * 1);
  display: flex;
}

.footerAreaNotes__insta--img img {
  height: 24px;
  width: auto;
}

.footerAreaNotes__insta--word {
  font-size: 13px;
  font-weight: 500;
}

.footerAreaNotes__insta--word a {
  color: var(--c-black-90);
}

.footerAreaNotes__nav {
  align-items: center;
  column-gap: calc(8px * 4);
  display: flex;
  font-size: 13px;
  font-weight: 500;
}

.footerAreaNotes__nav li a {
  color: var(--c-black-90);
}

.footerAreaNotes__nav--disabled {
  color: var(--c-gray-300);
}

.footerCopyright {
  background: var(--c-black-90);
  color: #fff;
  font-size: 11px;
  padding: calc(8px * 3) 0;
  text-align: center;
}

.footerCopyright p {
  letter-spacing: 0.1em;
}

@media screen and (max-width: 1080px) {
  .footerEntry {
    padding: calc(8px * 7) 0;
  }

  .footerEntry .container::before {
    display: none;
  }

  .footerEntry .container::after {
    display: none;
  }

  .footerEntry__title {
    font-size: 48px;
  }

  .footerEntry__word {
    font-size: 18px;
    line-height: 1.8;
    margin-top: calc(8px * 6);
  }

  .footerEntry__text {
    font-size: 14px;
    margin-top: calc(8px * 3);
  }

  .footerEntry__button {
    margin-top: calc(8px * 5);
    text-align: center;
  }

  .footerArea {
    padding: calc(8px * 6) 0;
  }

  .footerAreaNav {
    grid-template-columns: 100%;
  }

  .footerAreaNav__logo {
    text-align: center;
  }

  .footerAreaNav__logo img {
    height: 50px;
  }

  .footerAreaNav__list {
    display: grid;
    grid-template-columns: 100%;
    margin-top: calc(8px * 3);
    row-gap: calc(8px * 3);
    text-align: center;
  }

  .footerAreaNotes {
    display: grid;
    grid-template-columns: 100%;
    margin-top: calc(8px * 5);
    row-gap: calc(8px * 4);
  }

  .footerAreaNotes__insta {
    display: flex;
    justify-content: center;
  }

  .footerAreaNotes__nav {
    justify-content: center;
  }

  .footerCopyright {
    padding: calc(8px * 2) 0;
  }
}
@media screen and (max-width: 767px) {
  .footerEntry {
    margin-top: 182px;
    padding: calc(8px * 7) 0;
  }
}
/* -------------------------------------------------
  
      Page heading
  
  ------------------------------------------------- */
.headingPage {
  align-items: start;
  display: grid;
  height: 374px;
  justify-content: start;
  margin-block: 80px 70px;
  margin-left: auto;
  max-width: 89%;
  padding-top: 20px;
  position: relative;
}

@media screen and (max-width: 1024px) {
  .headingPage {
    height: 300px;
    max-width: 100%;
  }
}

@media screen and (max-width: 576px) {
  .headingPage {
    margin-block: 48px 35px;
    padding-top: 60px;
  }
}

.headingPage__img {
  bottom: 0;
  height: 75.6%;
  object-fit: cover;
  position: absolute;
  right: 0;
  width: 93%;
}

@media screen and (max-width: 576px) {
  .headingPage__img {
    width: 69%;
  }
}

.headingPage__illust {
  bottom: 0;
  max-width: 260px;
  min-width: 260px;
  position: absolute;
  right: 10vw;
  top: 35%;
  width: 30vw;
  z-index: 1;
}

@media screen and (max-width: 1024px) {
  .headingPage__illust {
    min-width: unset;
    right: 4vw;
    width: 22vw;
  }
}

@media screen and (max-width: 767px) {
  .headingPage__illust {
    max-width: 220px;
    min-width: 150px;
    right: 4vw;
    top: 80%;
    width: 22vw;
  }
}

.headingPage__inner {
  margin-inline: auto;
  max-width: 1080px;
  padding-inline: 15px;
  position: relative;
  z-index: 1;
}

.headingPage__title--en {
  background: -webkit-linear-gradient(
  0deg,
  rgba(107, 187, 234, 1) 0%,
  rgba(202, 230, 247) 100%
  );
  -webkit-background-clip: text;
          background-clip: text;
  font-family: var(--font-playwrite);
  font-size: 90px;
  font-weight: 400;
  line-height: 1.2;
  padding: 0 5px;
  -webkit-text-fill-color: transparent;
  transform: rotate(-5deg);
  width: fit-content;
}

@media screen and (max-width: 1024px) {
  .headingPage__title--en {
    font-size: 72px;
  }
}

@media screen and (max-width: 576px) {
  .headingPage__title--en {
    font-size: 46px;
  }
}

.headingPage__title--jp {
  font-size: 35px;
  font-weight: 700;
  letter-spacing: 0.2em;
  margin-top: 46px;
}

@media screen and (max-width: 1024px) {
  .headingPage__title--jp {
    font-size: 26px;
  }
}

@media screen and (max-width: 576px) {
  .headingPage__title--jp {
    font-size: 18px;
    margin-top: 30px;
  }
}

.headingPage__title--jp span {
  color: #0080cc;
  font-weight: 700;
}

.headingPage__title--jp::after {
  background: #6bbbea;
  content: "";
  display: block;
  height: 4px;
  margin-top: 30px;
  padding-left: 0;
  width: 88px;
}

@media screen and (max-width: 767px) {
  .headingPage__title--jp::after {
    margin-top: 16px;
  }
}