@charset "UTF-8";

*:where(:not(iframe, canvas, img, video, svg, svg *, symbol *)) {
  all: unset;
  display: revert
}

*, *:before, *:after {
  box-sizing: border-box
}

a, button {
  cursor: revert
}

b {
  font-weight: 600
}

ol, ul, menu {
  list-style: none;
  padding: 0;
  margin: 0
}

img {
  max-width: 100%
}

table {
  border-collapse: collapse
}

textarea {
  white-space: revert
}

meter {
  -webkit-appearance: revert;
  -moz-appearance: revert;
  appearance: revert
}

::-moz-placeholder {
  color: unset
}

::placeholder {
  color: unset
}

:where([hidden]) {
  display: none
}

:where([contenteditable]) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  line-break: after-white-space
}

:where([draggable=true]) {
  -webkit-user-drag: element
}

:root {
  --clr-prime: #0067B6;
  --clr-second: #2a73ac;
  --clr-linkBlue: #004CE3;
  --clr-white: #fff;
  --clr-black: #333333;
  --clr-gray-text: #575757;
  --fs-sm: .75em;
  --fs-md: 1em;
  --fs-lg: 1.5em;
  --ff-default: sans-serif;
  --ff-en: sans-serif;
  --ff-ja: sans-serif
}

html {
  font-family: var(--ff-default);
  font-size: var(--fs-md)
}

body {
  font-family: Noto Sans JP, sans-serif;
  background-color: var(--clr-bg);
  color: var(--clr-text);
  line-height: 1.6
}

a {
  text-decoration: none;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-all
}

img {
  height: auto;
  -o-object-fit: contain;
  object-fit: contain
}

@keyframes scale {
  0% {
    transform: scale(0)
  }

  50% {
    transform: scale(1.2)
  }

  to {
    transform: scale(1)
  }
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 100;
  src: url(../fonts/notosansjp/NotoSansJP-Thin.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 200;
  src: url(../fonts/notosansjp/NotoSansJP-Light.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/notosansjp/NotoSansJP-DemiLight.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/notosansjp/NotoSansJP-Regular.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 500;
  src: url(../fonts/notosansjp/NotoSansJP-Medium.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/notosansjp/NotoSansJP-Bold.woff2) format("woff2")
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 900;
  src: url(../fonts/notosansjp/NotoSansJP-Black.woff2) format("woff2")
}

.footer {
  position: relative;
  color: var(--clr-white);
  font-family: Noto Sans JP, sans-serif;
  background-image: url(../img/img_footer-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  overflow: hidden
}

.footer:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, #051b37f2 24.08%, #0a1726b3 50.18%, #051b3700 87.46%, #051b37f2 98.65%);
  pointer-events: none
}

.footer__inner {
  position: relative;
  max-width: 100vw;
  margin-inline: auto;
  padding: 2.7777777778vw 8.3333333333vw 1.1111111111vw
}

.footer__content {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 5.5555555556vw
}

.footer__address-main {
  font-size: .9722222222vw;
  font-weight: 500;
  line-height: 1.6
}

.footer__address-sub {
  margin-top: .5555555556vw;
  font-size: .7638888889vw;
  font-weight: 400;
  line-height: 1.6
}

.footer__nav-area {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  flex: 1;
  min-height: 8.8888888889vw;
  justify-content: space-between
}

.footer__nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.6666666667vw
}

.footer__nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-bottom: .1388888889vw;
  color: var(--clr-white);
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 1;
  transition: all .3s ease;
  position: relative
}

.footer__nav-link:after {
  content: "";
  position: absolute;
  bottom: -.1388888889vw;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--clr-white);
  opacity: 0;
  transition: all .3s ease
}

.footer__nav-link:hover:after {
  opacity: 1
}

.footer__contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .2777777778vw;
  min-width: 10.6944444444vw;
  min-height: 3.0555555556vw;
  margin-left: .5555555556vw;
  padding: .6944444444vw 1.1111111111vw;
  border: 1px solid var(--clr-white);
  border-radius: 999px;
  color: var(--clr-white);
  transition: all .3s ease
}

.footer__contact span {
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .02em
}

.footer__contact:after {
  content: "";
  width: 1.1111111111vw;
  height: 1.1111111111vw;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3csvg%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cmask%20id='mask0_307_172'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='32'%20height='32'%3e%3crect%20width='32'%20height='32'%20fill='%23D9D9D9'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_307_172)'%3e%3cpath%20d='M16.801%2016.0007L11.601%2010.8007C11.3566%2010.5563%2011.2344%2010.2452%2011.2344%209.86738C11.2344%209.48961%2011.3566%209.17849%2011.601%208.93405C11.8455%208.68961%2012.1566%208.56738%2012.5344%208.56738C12.9122%208.56738%2013.2233%208.68961%2013.4677%208.93405L19.601%2015.0674C19.7344%2015.2007%2019.8288%2015.3452%2019.8844%2015.5007C19.9399%2015.6563%2019.9677%2015.8229%2019.9677%2016.0007C19.9677%2016.1785%2019.9399%2016.3452%2019.8844%2016.5007C19.8288%2016.6563%2019.7344%2016.8007%2019.601%2016.934L13.4677%2023.0674C13.2233%2023.3118%2012.9122%2023.4341%2012.5344%2023.4341C12.1566%2023.4341%2011.8455%2023.3118%2011.601%2023.0674C11.3566%2022.8229%2011.2344%2022.5118%2011.2344%2022.1341C11.2344%2021.7563%2011.3566%2021.4452%2011.601%2021.2007L16.801%2016.0007Z'%20fill='white'/%3e%3c/g%3e%3c/svg%3e") no-repeat center/contain;
  transition: all .3s ease
}

.footer__contact:hover {
  background: var(--clr-white);
  border-color: var(--clr-prime);
  color: var(--clr-prime)
}

.footer__contact:hover:after {
  background-image: url("data:image/svg+xml,%3csvg%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cmask%20id='mask0_22_1557'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='32'%20height='32'%3e%3crect%20width='32'%20height='32'%20fill='%23D9D9D9'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_22_1557)'%3e%3cpath%20d='M16.801%2016.0011L11.601%2010.8011C11.3566%2010.5566%2011.2344%2010.2455%2011.2344%209.86775C11.2344%209.48997%2011.3566%209.17886%2011.601%208.93442C11.8455%208.68997%2012.1566%208.56775%2012.5344%208.56775C12.9122%208.56775%2013.2233%208.68997%2013.4677%208.93442L19.601%2015.0677C19.7344%2015.2011%2019.8288%2015.3455%2019.8844%2015.5011C19.9399%2015.6566%2019.9677%2015.8233%2019.9677%2016.0011C19.9677%2016.1789%2019.9399%2016.3455%2019.8844%2016.5011C19.8288%2016.6566%2019.7344%2016.8011%2019.601%2016.9344L13.4677%2023.0677C13.2233%2023.3122%2012.9122%2023.4344%2012.5344%2023.4344C12.1566%2023.4344%2011.8455%2023.3122%2011.601%2023.0677C11.3566%2022.8233%2011.2344%2022.5122%2011.2344%2022.1344C11.2344%2021.7566%2011.3566%2021.4455%2011.601%2021.2011L16.801%2016.0011Z'%20fill='%230067B6'/%3e%3c/g%3e%3c/svg%3e");
  transform: translate(.5555555556vw)
}

.footer__policy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-bottom: .1388888889vw;
  color: var(--clr-white);
  font-size: .8333333333vw;
  font-weight: 700;
  line-height: 1.33;
  transition: all .3s ease;
  position: relative
}

.footer__policy:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--clr-white);
  opacity: 0;
  transition: all .3s ease
}

.footer__policy:hover:after {
  opacity: 1
}

.footer__copyright {
  margin-top: 1.6666666667vw;
  text-align: center;
  font-size: .6944444444vw;
  line-height: 1.5;
  color: var(--clr-white)
}

@media (max-width: 768px) {
  .footer__inner {
    padding: 10.6666666667vw 5.3333333333vw 5.3333333333vw
  }

  .footer__content {
    flex-direction: column;
    gap: 10.6666666667vw
  }

  .footer__address-main {
    font-size: 3.7333333333vw;
    font-weight: 500;
    line-height: 160%
  }

  .footer__address-sub {
    margin-top: 2.1333333333vw;
    font-size: 2.9333333333vw;
    font-weight: 400;
    line-height: 160%
  }

  .footer__nav-area {
    width: 100%;
    min-height: 0;
    align-items: flex-start;
    gap: 10.6666666667vw
  }

  .footer__nav {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6.4vw;
    justify-items: start
  }

  .footer__nav-link {
    font-size: 4.2666666667vw;
    font-weight: 700;
    line-height: 160%
  }

  .footer__contact {
    display: none
  }

  .footer__policy {
    font-size: 3.2vw
  }

  .footer__copyright {
    font-size: 2.6666666667vw;
    line-height: 150%;
    font-weight: 400;
    margin-top: 5.3333333333vw
  }
}

.header {
  position: relative;
  font-family: Noto Sans JP, sans-serif;
  z-index: 10
}

.header__inner {
  width: 100%;
  max-width: 100vw;
  margin-inline: auto;
  padding: 1.6666666667vw 1.6666666667vw 1.6666666667vw 2.7777777778vw
}

.header__nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.6666666667vw
}

.header__nav-list {
  display: flex;
  align-items: center;
  gap: 1.6666666667vw
}

.header__nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 1;
  color: var(--clr-black);
  letter-spacing: .01em;
  transition: all .3s ease;
  position: relative
}

.header__nav-link:after {
  content: "";
  position: absolute;
  bottom: -.1388888889vw;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--clr-linkBlue);
  opacity: 0;
  transition: all .3s ease
}

.header__nav-link:hover {
  color: var(--clr-linkBlue)
}

.header__nav-link:hover:after {
  opacity: 1
}

.header__cta {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .2777777778vw;
  min-height: 3.1944444444vw;
  min-width: 10.6944444444vw;
  padding: .6944444444vw 1.1111111111vw;
  border: 1px solid transparent;
  border-radius: 999px;
  background: linear-gradient(98deg, #00115a, #0076d2 106.17%);
  transition: border-color .3s ease;
  overflow: hidden
}

.header__cta:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--clr-white);
  z-index: -1;
  opacity: 0;
  transition: opacity .3s ease
}

.header__cta span {
  color: var(--clr-white);
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .01em;
  transition: all .3s ease;
  position: relative;
  z-index: 2
}

.header__cta:after {
  content: "";
  width: 1.3888888889vw;
  height: 1.3888888889vw;
  background: url("data:image/svg+xml,%3csvg%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cmask%20id='mask0_307_172'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='32'%20height='32'%3e%3crect%20width='32'%20height='32'%20fill='%23D9D9D9'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_307_172)'%3e%3cpath%20d='M16.801%2016.0007L11.601%2010.8007C11.3566%2010.5563%2011.2344%2010.2452%2011.2344%209.86738C11.2344%209.48961%2011.3566%209.17849%2011.601%208.93405C11.8455%208.68961%2012.1566%208.56738%2012.5344%208.56738C12.9122%208.56738%2013.2233%208.68961%2013.4677%208.93405L19.601%2015.0674C19.7344%2015.2007%2019.8288%2015.3452%2019.8844%2015.5007C19.9399%2015.6563%2019.9677%2015.8229%2019.9677%2016.0007C19.9677%2016.1785%2019.9399%2016.3452%2019.8844%2016.5007C19.8288%2016.6563%2019.7344%2016.8007%2019.601%2016.934L13.4677%2023.0674C13.2233%2023.3118%2012.9122%2023.4341%2012.5344%2023.4341C12.1566%2023.4341%2011.8455%2023.3118%2011.601%2023.0674C11.3566%2022.8229%2011.2344%2022.5118%2011.2344%2022.1341C11.2344%2021.7563%2011.3566%2021.4452%2011.601%2021.2007L16.801%2016.0007Z'%20fill='white'/%3e%3c/g%3e%3c/svg%3e") no-repeat center/contain;
  transition: all .3s ease;
  position: relative;
  z-index: 2
}

.header__cta:hover {
  border-color: var(--clr-prime)
}

.header__cta:hover:before {
  opacity: 1
}

.header__cta:hover span {
  color: var(--clr-prime)
}

.header__cta:hover:after {
  background-image: url("data:image/svg+xml,%3csvg%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cmask%20id='mask0_22_1557'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='32'%20height='32'%3e%3crect%20width='32'%20height='32'%20fill='%23D9D9D9'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_22_1557)'%3e%3cpath%20d='M16.801%2016.0011L11.601%2010.8011C11.3566%2010.5566%2011.2344%2010.2455%2011.2344%209.86775C11.2344%209.48997%2011.3566%209.17886%2011.601%208.93442C11.8455%208.68997%2012.1566%208.56775%2012.5344%208.56775C12.9122%208.56775%2013.2233%208.68997%2013.4677%208.93442L19.601%2015.0677C19.7344%2015.2011%2019.8288%2015.3455%2019.8844%2015.5011C19.9399%2015.6566%2019.9677%2015.8233%2019.9677%2016.0011C19.9677%2016.1789%2019.9399%2016.3455%2019.8844%2016.5011C19.8288%2016.6566%2019.7344%2016.8011%2019.601%2016.9344L13.4677%2023.0677C13.2233%2023.3122%2012.9122%2023.4344%2012.5344%2023.4344C12.1566%2023.4344%2011.8455%2023.3122%2011.601%2023.0677C11.3566%2022.8233%2011.2344%2022.5122%2011.2344%2022.1344C11.2344%2021.7566%2011.3566%2021.4455%2011.601%2021.2011L16.801%2016.0011Z'%20fill='%230067B6'/%3e%3c/g%3e%3c/svg%3e");
  transform: translate(.5555555556vw)
}

.header__mobile-bar, .header__mobile-panel {
  display: none
}

@media (max-width: 768px) {
  .header__inner {
    padding: 2.1333333333vw 5.3333333333vw
  }

  .header__nav {
    display: none
  }

  .header__mobile-bar {
    display: flex;
    justify-content: flex-end;
    position: relative;
    z-index: 2
  }

  .header__mobile-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333333b3;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
    z-index: 0
  }

  .header__menu-toggle, .header__menu-close {
    position: relative;
    width: 8.5333333333vw;
    height: 8.5333333333vw;
    display: inline-flex;
    align-items: center;
    justify-content: center
  }

  .header__menu-toggle-line, .header__menu-close-line {
    position: relative;
    width: 6.4vw;
    height: 4.8vw;
    display: block
  }

  .header__menu-toggle-line:before, .header__menu-toggle-line:after, .header__menu-close-line:before, .header__menu-close-line:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: .5066666667vw;
    background: #222;
    transition: transform .2s ease, top .2s ease, opacity .2s ease
  }

  .header__menu-toggle-line {
    background: #222;
    height: .5066666667vw;
    transition: opacity .2s ease
  }

  .header__menu-toggle-line:before {
    top: -2.1333333333vw
  }

  .header__menu-toggle-line:after {
    top: 2.1333333333vw
  }

  .header.is-open .header__menu-toggle-line {
    opacity: 0
  }

  .header.is-open .header__menu-toggle-line:before {
    top: 0;
    transform: rotate(45deg)
  }

  .header.is-open .header__menu-toggle-line:after {
    top: 0;
    transform: rotate(-45deg)
  }

  .header__menu-close-line {
    height: .5066666667vw
  }

  .header__menu-close-line:before {
    top: 0;
    transform: rotate(45deg);
    transform-origin: center
  }

  .header__menu-close-line:after {
    top: 0;
    transform: rotate(-45deg);
    transform-origin: center
  }

  .header__mobile-panel {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 2.1333333333vw 5.3333333333vw 10.6666666667vw;
    background: var(--clr-white);
    border-bottom-left-radius: 6.4vw;
    border-bottom-right-radius: 6.4vw;
    box-shadow: 2.1333333333vw .8vw 7.4666666667vw #00000014;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
    z-index: 1
  }

  .header.is-open .header__mobile-backdrop, .header.is-open .header__mobile-panel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto
  }

  .header__mobile-panel-head {
    display: flex;
    justify-content: flex-end
  }

  .header__mobile-nav {
    margin-top: 10.6666666667vw
  }

  .header__mobile-nav-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6.4vw
  }

  .header__mobile-nav-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 4.2666666667vw;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .01em;
    color: var(--clr-black)
  }

  .header__mobile-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4.2666666667vw;
    margin-top: 6.4vw;
    width: 100%;
    padding: 4.2666666667vw 6.4vw 4.2666666667vw 8.5333333333vw;
    border-radius: 999px;
    background: linear-gradient(98deg, #00115a, #0076d2 106.17%);
    color: var(--clr-white)
  }

  .header__mobile-cta-label {
    font-size: 4.8vw;
    font-weight: 700;
    line-height: 6.4vw;
    letter-spacing: .02em
  }

  .header__mobile-cta-arrow {
    width: 8.5333333333vw;
    height: 8.5333333333vw
  }
}

.layout {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column
}

.layout__header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 100
}

.layout__main {
  display: flex;
  flex-direction: column;
  min-height: 100vh
}

.layout__footer {
  margin-top: auto
}

.layout__pagetop {
  position: fixed;
  right: 1.3888888889vw;
  bottom: 1.3888888889vw;
  z-index: 10;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: .5555555556vw;
  padding: .8333333333vw .5555555556vw;
  line-height: 1;
  font-family: Poppins, sans-serif;
  font-size: 1.1111111111vw;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: .32px;
  color: var(--clr-white);
  background: transparent;
  border: 0;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease
}

.layout__pagetop.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto
}

@media (max-width: 768px) {
  .layout__pagetop {
    right: 2.6666666667vw;
    bottom: 5.3333333333vw;
    gap: 0;
    padding: 0;
    font-size: 3.7333333333vw
  }
}

.layout__pagetop-icon {
  width: 2.7777777778vw;
  height: 2.7777777778vw
}

@media (max-width: 768px) {
  .layout__pagetop-icon {
    width: 10.6666666667vw;
    height: 10.6666666667vw
  }
}

.layout__pagetop-text {
  line-height: 1.3
}
