@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&display=swap");
:root {
  --per: 1;
}

/*--------------------------------------------------------------
html, body
--------------------------------------------------------------*/
html {
  scroll-behavior: smooth;
}

/* --- for small viewport --- */
@media (max-width: 374px) {
  html {
    font-size: 2.6666666667vw;
  }
}
/* --- for small viewport / tablet --- */
@media (max-width: 768px) {
  html {
    font-size: 2.6666666667vw;
  }
}
/* --- for middle viewport --- */
@media screen and (min-width: 769px) and (max-width: 1439px) {
  html {
    font-size: 0.6944444444vw;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 1440px) {
  html {
    font-size: 62.5%;
  }
}
body {
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  position: relative;
}
body.menuon {
  overflow: hidden;
}
@media (max-width: 768px) {
  body.index::before {
    display: none;
  }
}

img {
  vertical-align: bottom;
}

/*--------------------------------------------------------------
common
--------------------------------------------------------------*/
@media (max-width: 768px) {
  ._pc {
    display: none !important;
  }
}
@media (min-width: 769px) {
  ._sp {
    display: none !important;
  }
}
.h_regular {
  font-size: 2.5rem;
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0.1em;
}
@media (max-width: 768px) {
  .h_regular {
    font-size: 2rem;
  }
}

.shiver {
  -webkit-animation: shiveranim 3s infinite ease-in-out 0.8s alternate;
          animation: shiveranim 3s infinite ease-in-out 0.8s alternate;
}

@-webkit-keyframes shiveranim {
  0% {
    transform: translate(0, 0) rotate(-3deg);
  }
  50% {
    transform: translate(0, -7px) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(3deg);
  }
}

@keyframes shiveranim {
  0% {
    transform: translate(0, 0) rotate(-3deg);
  }
  50% {
    transform: translate(0, -7px) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(3deg);
  }
}
._ib {
  display: inline-block;
}

.en {
  font-family: "Plus Jakarta Sans", sans-serif;
}

.serif {
  font-family: "Cinzel", sans-serif;
}

/*--------------------------------------------------------------
tocontact
--------------------------------------------------------------*/
.tocontact {
  bottom: calc(50% - 2.8rem);
  right: -12.5rem;
  width: 5.6rem;
  height: 5.6rem;
  background: #30759D;
  position: fixed;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  overflow: hidden;
  z-index: 100;
  border-radius: 5rem;
  overflow: hidden;
  cursor: pointer;
  transition: height 0.6s ease, right 0.8s ease;
}
.tocontact.on {
  opacity: 1;
  right: 2.5rem;
}
.tocontact .tocontact_inner {
  display: inline-flex;
  width: 100%;
  flex-direction: column;
  height: 24rem;
  justify-content: flex-end;
  align-items: center;
}
.tocontact p {
  font-size: 1.4rem;
  color: #fff;
  writing-mode: vertical-rl;
  letter-spacing: 0.15em;
  font-weight: bold;
}
.tocontact span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 5.6rem;
}
.tocontact span .icon_inner {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.tocontact span img {
  width: 2.8rem;
  height: auto;
  position: absolute;
  bottom: 1.7rem;
  left: 1.4rem;
}
.tocontact span img {
  transition: opacity 0.3s;
}
.tocontact span .open {
  opacity: 0;
}
.tocontact span .close {
  opacity: 1;
}
.tocontact:hover {
  height: 24.5rem;
}
.tocontact:hover span .open {
  opacity: 1;
}
.tocontact:hover span .close {
  opacity: 0;
}
@media (max-width: 768px) {
  .tocontact {
    bottom: calc(50% - 2.4rem);
    width: 4.8rem;
    height: 4.8rem;
    right: -12.5rem;
  }
  .tocontact.on {
    right: 2rem;
  }
  .tocontact .tocontact_inner {
    height: 100%;
  }
  .tocontact p {
    display: none;
  }
  .tocontact span {
    height: 100%;
  }
  .tocontact span img {
    width: 2.4rem;
    bottom: 1.5rem;
    left: 1.2rem;
  }
  .tocontact:hover {
    height: 4.8rem;
  }
  .tocontact:hover span .open {
    opacity: 0;
  }
  .tocontact:hover span .close {
    opacity: 1;
  }
}

/*--------------------------------------------------------------
footer
--------------------------------------------------------------*/
footer {
  background: #22262B;
  width: 100%;
  height: 5.5rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 5rem;
  color: #fff;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 10px;
}
@media (max-width: 768px) {
  footer {
    height: 4rem;
    font-size: 0.9rem;
    justify-content: center;
  }
}

/*--------------------------------------------------------------
drawer
--------------------------------------------------------------*/
.menubutton {
  transition: 0.3s;
  z-index: 200;
  background: transparent;
  transition: 0.3s ease-out;
  width: 4.8rem;
  height: 4.8rem;
  position: fixed;
  top: 2.3rem;
  right: 2rem;
  cursor: pointer;
  border: 1px solid #22262B;
  border-radius: 50%;
}
.menubutton span {
  transition: top 0.2s 0.2s ease-out, bottom 0.2s 0.2s ease-out, transform 0.2s 0s ease-out;
  display: block;
  position: absolute;
  width: 1.3rem;
  height: 2px;
  background: #000;
  left: 1.7rem;
  top: calc(50% - 6px);
}
.menubutton span:nth-child(2) {
  top: 50%;
}
.menubutton span:nth-child(3) {
  top: calc(50% + 6px);
}
body.menuon .menubutton span {
  transition: top 0.2s 0s ease-out, bottom 0.2s 0s ease-out, transform 0.2s 0.2s ease-out;
  transform: rotate(45deg);
  top: calc(50% - 0px);
}
body.menuon .menubutton span:nth-child(2) {
  top: calc(50% + 0px);
  transform: rotate(-45deg);
}

/*--------------------------------------------------------------
header
--------------------------------------------------------------*/
.sholderlogo {
  position: fixed;
  top: 3.6rem;
  left: 3rem;
  width: 7.3rem;
  z-index: 50;
}

header {
  top: 0;
  left: 0;
  position: fixed;
  z-index: 100;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 11rem;
  padding: 0 3rem 0 4rem;
}
header .sitename {
  width: 8.5rem;
}
header nav ul {
  display: flex;
}
header nav ul li + li {
  margin-left: 4rem;
}
header nav ul li a {
  font-size: 1.4rem;
  font-family: "Plus Jakarta Sans", sans-serif;
  display: flex;
  width: auto;
  height: 2.6rem;
  justify-content: center;
  align-items: center;
  transition: color 0.3s ease;
}
header nav ul li a:hover {
  color: #196785;
}
header nav ul li.contact {
  margin-left: 3rem;
}
header nav ul li.contact a {
  background: #fff;
  padding: 0 2rem;
}
@media (max-width: 768px) {
  header {
    transition: opacity 0.5s, transform 0.5s, left 0s 0s;
    background: #fff;
    top: 0;
    left: 0;
    z-index: 100;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100lvh;
    padding: 0;
  }
  header:not(.menuon) {
    transition: opacity 0.5s, transform 0.5s, left 0s 0.5s;
    opacity: 0;
    left: 100vw;
    transform: scale(1.05);
  }
  header .airplane {
    position: absolute;
    width: 9.5rem;
    top: 16rem;
    left: 23rem;
    z-index: 100;
  }
  header .sitename {
    height: 21.327014218%;
    padding-top: 10.663507109lvh;
    width: 100%;
    text-align: center;
    position: relative;
    z-index: 5;
  }
  header .sitename img {
    width: 14rem;
  }
  header nav {
    margin-top: -7rem;
    width: 100%;
    height: 78.672985782%;
    position: relative;
    z-index: 2;
    text-align: center;
  }
  header nav .windbg {
    top: 0;
    bottom: unset;
    height: 10rem;
    transform: scale(1, -1);
    transform-origin: center center;
    z-index: 1;
  }
  header nav::before {
    content: "";
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1440/577;
    background: #C9ECF7;
    z-index: -2;
  }
  header nav::after {
    content: "";
    display: block;
    width: 100%;
    height: 100vh;
    background: #C9ECF7;
  }
  header nav ul {
    margin-top: -1px;
    position: relative;
    z-index: 10;
    height: calc;
    background: #C9ECF7;
    display: flex;
    flex-direction: column;
  }
  header nav ul li {
    display: block;
    width: 20rem;
    margin: auto;
  }
  header nav ul li + li {
    margin-left: auto;
    margin-top: 2vh;
  }
  header nav ul li a {
    font-size: 2.7rem;
    display: block;
    width: auto;
    height: auto;
    text-align: left;
    letter-spacing: 0.2em;
  }
  header nav ul li:not(.contact) a::before {
    content: "･";
    display: inline-block;
    color: #293233;
    opacity: 0.5;
  }
  header nav ul li.contact {
    margin-left: auto;
  }
  header nav ul li.contact a {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.9rem;
    background: #fff;
    padding: 0 2rem;
  }
}

/*--------------------------------------------------------------
animation
--------------------------------------------------------------*/
/*========= テキストを滑らかに出現させるためのCSS ===============*/
span.smoothText {
  overflow: hidden;
  display: block;
}

/* アニメーションで傾斜がついている文字列を水平に戻す*/
span.smoothTextTrigger {
  transition: 1.2s ease-in-out;
  opacity: 0;
  transform: translate3d(0, 100%, 0) skewY(12deg);
  transform-origin: left;
  display: block;
}

span.smoothTextTrigger.on {
  opacity: 1;
  transform: translate3d(0, 0, 0) skewY(0);
}

.scrollin.scregular {
  transition: opacity 0.8s ease-in-out, transform 0.9s ease-in-out;
}
.scrollin.scregular:not(.on) {
  transform: translateY(3rem);
  opacity: 0;
}
.scrollin.scregular.onlyopacity:not(.on) {
  transform: translateY(0);
  opacity: 0;
}

.scrollin.sclist > * {
  opacity: 0;
  transform: translateY(20px);
}
.scrollin.sclist.on > * {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.scrollin.sclist.on > *:nth-child(1) {
  transition-delay: 0s;
}
.scrollin.sclist.on > *:nth-child(2) {
  transition-delay: 0.15s;
}
.scrollin.sclist.on > *:nth-child(3) {
  transition-delay: 0.3s;
}
.scrollin.sclist.on > *:nth-child(4) {
  transition-delay: 0.5s;
}
.scrollin.sclist.on > *:nth-child(5) {
  transition-delay: 0.7s;
}
.scrollin.sclist.on > *:nth-child(6) {
  transition-delay: 0.9s;
}
.scrollin.sclist.on > *:nth-child(7) {
  transition-delay: 1.1s;
}
.scrollin.sclist.on > *:nth-child(8) {
  transition-delay: 1.3s;
}
.scrollin.sclist.on > *:nth-child(9) {
  transition-delay: 1.5s;
}
.scrollin.sclist.on > *:nth-child(10) {
  transition-delay: 1.7s;
}

/*--------------------------------------------------------------
windbg
--------------------------------------------------------------*/
.windbg {
  height: 40rem;
  aspect-ratio: 100/5;
  position: absolute;
  bottom: -1px;
  left: 0;
  transform: scaleY(0.7);
  transform-origin: left bottom;
}
.windbg .windbginner {
  width: 100%;
  height: 100%;
  background: url(../image/wave.svg) left top/contain repeat-x;
  -webkit-animation: windbg 25s linear infinite;
          animation: windbg 25s linear infinite;
}
.windbg::before {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
  bottom: -1px;
  left: 0;
  position: absolute;
}

@-webkit-keyframes windbg {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes windbg {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
/*--------------------------------------------------------------
dots
--------------------------------------------------------------*/
#dots {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  padding-left: 4rem;
  pointer-events: none;
}
#dots ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
#dots ul li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
  color: #22262B;
  opacity: 0.5;
  line-height: 0;
  transition: opacity 0.3s;
}
#dots ul li::before {
  content: "●";
  font-size: 5px;
}
#dots ul li span {
  font-size: 1rem;
  font-family: "Plus Jakarta Sans", sans-serif;
  opacity: 0;
  padding-bottom: 0.31em;
  display: inline-block;
  transition: opacity 0.3s;
}
#dots ul li.current {
  opacity: 1;
}
#dots ul li.current span {
  opacity: 1;
}

/*--------------------------------------------------------------
mv
--------------------------------------------------------------*/
#top {
  background: #C6C8C8;
  padding-bottom: 23rem;
  position: relative;
  z-index: 11;
  mix-blend-mode: multiply;
}
#top .airplane {
  position: absolute;
  z-index: 10;
  top: 52rem;
  left: calc(50% - 1rem);
}
#top .airplane .offsetElementInnerInner img {
  transform: translate(50%, -80%);
}
#top .airplane .stroke {
  -webkit-animation-delay: 1.2s !important;
          animation-delay: 1.2s !important;
  -webkit-animation-duration: 3s !important;
          animation-duration: 3s !important;
  transition-delay: 1.2s !important;
}
#top .inner {
  margin: auto;
  padding: 12rem 0 0;
  width: 111.5rem;
  position: relative;
}
#top .slider {
  border-radius: 3rem;
}
#top .slider .wrapper {
  text-align: center;
}
#top .slider .wrapper::before {
  width: 100%;
  height: 100%;
  background: rgba(195, 218, 231, 0.8);
  mix-blend-mode: multiply;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  border-radius: 3rem;
}
#top .slider .swiper-pagination {
  bottom: 3rem !important;
  padding: 0.3rem 1.2rem 0.3rem 1.5rem !important;
  border-radius: 20px;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  display: inline-block !important;
  background: #fff;
  width: auto;
  left: 50% !important;
  right: unset !important;
  font-size: 0;
  transform: translateX(-50%);
}
#top .slider .swiper-pagination span {
  font-size: 0.9rem;
}
#top .slider .swiper-pagination .swiper-pagination-current::after {
  content: "／";
  margin: 0 1em;
}
#top h2 {
  position: absolute;
  z-index: 2;
  left: 44.5rem;
  top: 31rem;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-direction: column;
  flex-shrink: 0;
  flex-grow: 0;
  gap: 2.5rem;
  padding: 1rem;
  -webkit-mask-image: linear-gradient(to right, black, black, transparent, transparent);
          mask-image: linear-gradient(to right, black, black, transparent, transparent);
  -webkit-mask-size: 300%;
          mask-size: 300%;
  -webkit-mask-position: 100%;
          mask-position: 100%;
}
#top h2 img {
  width: 56rem;
}
#top h2.on {
  transition: -webkit-mask-position 4s 0.5s;
  transition: mask-position 4s 0.5s;
  transition: mask-position 4s 0.5s, -webkit-mask-position 4s 0.5s;
  -webkit-mask-position: 0%;
          mask-position: 0%;
}
#top h3 {
  position: absolute;
  left: -4rem;
  bottom: -8rem;
  z-index: 2;
  letter-spacing: 0.5em;
  color: #FFFFFF;
  font-family: "Cinzel", sans-serif;
  font-size: 1.8em;
  line-height: 2;
  font-size: 200;
}
@media (max-width: 768px) {
  #top {
    padding-bottom: 10rem;
  }
  #top .inner {
    margin: auto;
    padding: 12rem 0 0;
    width: 111.5rem;
    position: relative;
    margin: auto;
    padding: 9rem 2rem 10rem;
    width: auto;
    position: relative;
    background: #C6C8C8;
  }
  #top .slider {
    border-radius: 3rem;
    overflow: visible !important;
  }
  #top .slider .wrapper {
    text-align: center;
    overflow: visible !important;
  }
  #top .slider .slide {
    border-radius: 3rem;
    overflow: hidden;
  }
  #top .slider .swiper-pagination {
    bottom: -3rem !important;
    padding: 0.3rem 1.2rem 0.3rem 1.5rem !important;
    border-radius: 20px;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    display: inline-block !important;
    background: #fff;
    width: auto;
    left: unset !important;
    right: 0 !important;
    font-size: 0;
  }
  #top .slider .swiper-pagination span {
    font-size: 0.9rem;
  }
  #top .slider .swiper-pagination .swiper-pagination-current::after {
    content: "／";
    margin: 0 1em;
  }
  #top h2 {
    position: absolute;
    z-index: 2;
    left: 4.5rem;
    top: 18rem;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    flex-direction: column;
    flex-shrink: 0;
    flex-grow: 0;
    padding: 1rem;
    -webkit-mask-image: linear-gradient(to right, black, black, transparent, transparent);
            mask-image: linear-gradient(to right, black, black, transparent, transparent);
    -webkit-mask-size: 300%;
            mask-size: 300%;
    -webkit-mask-position: 100%;
            mask-position: 100%;
  }
  #top h2 img {
    width: 25rem;
    max-width: 25rem;
  }
  #top h2.on {
    transition: -webkit-mask-position 4s 0.5s;
    transition: mask-position 4s 0.5s;
    transition: mask-position 4s 0.5s, -webkit-mask-position 4s 0.5s;
    -webkit-mask-position: 0%;
            mask-position: 0%;
  }
  #top h3 {
    left: 4rem;
    bottom: 3rem;
    z-index: 2;
    letter-spacing: 0.5em;
    font-size: 1.6em;
    line-height: 2;
    font-size: 200;
  }
}

@-webkit-keyframes scrollanim {
  0% {
    height: 100px;
  }
  100% {
    height: 0;
  }
}

@keyframes scrollanim {
  0% {
    height: 100px;
  }
  100% {
    height: 0;
  }
}
@-webkit-keyframes scrollanimsp {
  0% {
    height: 5.1282051282vw;
  }
  100% {
    height: 0;
  }
}
@keyframes scrollanimsp {
  0% {
    height: 5.1282051282vw;
  }
  100% {
    height: 0;
  }
}
/*--------------------------------------------------------------
section
--------------------------------------------------------------*/
main {
  min-height: calc(100vh - 15.5rem);
  overflow: hidden;
}
main section:not(#top) {
  position: relative;
  margin-top: 10rem;
  padding-top: 10rem;
}
main section:not(#top) .inner {
  width: 106rem;
  margin: auto;
  position: relative;
}
main section:not(#top) hgroup {
  position: relative;
  z-index: 5;
  text-align: center;
  margin-bottom: 10rem;
}
main section:not(#top) hgroup .en {
  font-size: 4.4rem;
  font-weight: 300;
  letter-spacing: 0.2em;
}
main section:not(#top) hgroup h2 {
  font-size: 1.5rem;
  font-weight: bold;
}
@media (max-width: 768px) {
  main {
    min-height: 100vw;
  }
  main section:not(#top) {
    margin-top: 10rem;
    padding-top: 10rem;
  }
  main section:not(#top) .inner {
    width: auto;
    margin: auto;
    padding: 0 2rem;
  }
  main section:not(#top) hgroup {
    position: relative;
    z-index: 5;
    text-align: center;
    margin-bottom: 7rem;
  }
  main section:not(#top) hgroup .en {
    font-size: 3.3rem;
  }
  main section:not(#top) hgroup h2 {
    font-size: 1.3rem;
  }
}

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

--------------------------------------------------------------*/
.offsetElement {
  position: absolute;
  opacity: 0;
}
.offsetElement img {
  transform: translate(10px, -3px) rotate(-5deg);
}
.on .offsetElement {
  transition: opacity 0.1s 0.1s;
  opacity: 1;
  offset-path: path("M834.56 292.97C787.49 205.84 648.09 187.22 560.27 179.61C497.58 174.2 434.89 181.21 372.1 180.81C321.03 180.51 272.56 179.81 223.89 162.48C137.25 131.64 63.4501 65.24 0.360107 0.349976");
  offset-rotate: auto 140deg;
  -webkit-animation: move 4s ease-in-out forwards;
          animation: move 4s ease-in-out forwards;
}

.on .offsetElement.offsetElement2 {
  offset-path: path("M0.449951 550.98C49.22 526.69 98.6 501.61 138.57 464.53C213.83 394.77 255.51 294.52 339.16 233.16C416.32 176.59 512.56 157.2 600.12 122.72C633 109.73 665.68 95.43 695.47 76.05C710.46 66.36 724.65 55.76 737.35 42.17C750.04 28.58 763.04 14.39 780.73 7.18999C788.33 4.08999 796.32 2.48999 804.32 0.98999");
  offset-rotate: auto 40deg;
}

.stroke {
  stroke-dashoffset: 0px;
  stroke-dasharray: 850px;
  opacity: 0;
}
.on .stroke {
  transition: opacity 0.5s 0.8s;
  opacity: 1;
  -webkit-animation: stroke 3.7s ease-in-out forwards;
          animation: stroke 3.7s ease-in-out forwards;
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.offsetElementInner {
  -webkit-animation: shiveranim 3s -1.5s infinite linear alternate;
          animation: shiveranim 3s -1.5s infinite linear alternate;
  transform-origin: center center;
}

@keyframes shiveranim {
  0% {
    transform: rotate(-16deg);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
  50% {
    transform: rotate(-5deg);
    -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
            animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); /* ease out sine */
  }
  100% {
    transform: rotate(6deg);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
}
.offsetElementInnerInner {
  -webkit-animation: shiveranim2 3s 0s infinite alternate;
          animation: shiveranim2 3s 0s infinite alternate;
}

@-webkit-keyframes shiveranim2 {
  0% {
    transform: translate(0, 2rem);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
  50% {
    transform: translate(0, 1rem);
    -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
            animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); /* ease out sine */
  }
  100% {
    transform: translate(0, rem);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
}

@keyframes shiveranim2 {
  0% {
    transform: translate(0, 2rem);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
  50% {
    transform: translate(0, 1rem);
    -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
            animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); /* ease out sine */
  }
  100% {
    transform: translate(0, rem);
    -webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
            animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); /* ease in sine */
  }
}
@-webkit-keyframes move {
  to {
    offset-distance: 100%;
  }
}
@keyframes move {
  to {
    offset-distance: 100%;
  }
}
@-webkit-keyframes stroke {
  0% {
    stroke-dashoffset: 850px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
@keyframes stroke {
  0% {
    stroke-dashoffset: 850px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
.on .offsetElement.offsetElementtop {
  offset-path: path("M0.900635 131C26.8081 116.2 54.316 111 83.3243 105.7C118.935 99.2 155.345 96.8 190.455 87.4C219.063 79.8 247.672 70.8 274.079 57C287.483 50 300.387 41.7 311.39 31.2C323.493 19.7 332.996 7.7 348.901 1");
  offset-rotate: auto 40deg;
}

.stroke.stroketop {
  stroke-dashoffset: 0px;
  stroke-dasharray: 500px;
  opacity: 0;
}
.on .stroke.stroketop {
  opacity: 1;
  transition: opacity 0.5s 0.99s;
  -webkit-animation: stroketop 2.7s linear forwards;
          animation: stroketop 2.7s linear forwards;
  -webkit-animation-delay: 0.99s;
          animation-delay: 0.99s;
}

@-webkit-keyframes stroketop {
  0% {
    stroke-dashoffset: 500px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}

@keyframes stroketop {
  0% {
    stroke-dashoffset: 500px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
.on .offsetElement.offsetElement2 {
  offset-path: path("M0.449951 544.98C49.22 520.69 98.6 495.61 138.57 458.53C213.83 388.77 255.51 288.52 339.16 227.16C416.32 170.59 512.56 151.2 600.12 116.72C633 103.73 665.68 89.4299 695.47 70.0499C710.46 60.36 724.65 49.7599 737.35 36.1699C750.04 22.5799 763.04 8.38994 780.73 1.18994");
  offset-rotate: auto 40deg;
}

.stroke.stroke2 {
  stroke-dashoffset: 0px;
  stroke-dasharray: 900px;
  opacity: 0;
}
.on .stroke.stroke2 {
  transition: opacity 0.5s 1s;
  opacity: 1;
  -webkit-animation: stroke2 2.7s linear forwards;
          animation: stroke2 2.7s linear forwards;
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

@-webkit-keyframes stroke2 {
  0% {
    stroke-dashoffset: 900px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}

@keyframes stroke2 {
  0% {
    stroke-dashoffset: 900px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
.offsetElement.offsetElement3 img {
  transform: scale(0.8, -0.8) translate(40px, -50px) rotate(-10deg);
}
.on .offsetElement.offsetElement3 {
  offset-path: path("M478.04 288.42C434.18 273.14 393.99 247.12 362.46 212.89C334.1 182.14 311.93 144.68 276.87 121.94C232.53 93.1898 176.3 93.3899 124.07 85.9799C71.8499 78.5699 19.0199 50.1198 0.939941 0.339844");
  offset-rotate: auto 300deg;
}

.stroke.stroke3 {
  stroke-dashoffset: 0px;
  stroke-dasharray: 600px;
  opacity: 0;
}
.on .stroke.stroke3 {
  transition: opacity 0.5s 0.7s;
  opacity: 1;
  -webkit-animation: stroke3 2.9s linear forwards;
          animation: stroke3 2.9s linear forwards;
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}

@-webkit-keyframes stroke3 {
  0% {
    stroke-dashoffset: 600px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}

@keyframes stroke3 {
  0% {
    stroke-dashoffset: 600px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}
/*--------------------------------------------------------------
about
--------------------------------------------------------------*/
#about {
  margin-top: -12rem !important;
  padding-top: 10rem;
  z-index: 10;
}
#about .body {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 12rem;
}
#about .body h3 {
  width: 28.5rem;
}
#about .body p {
  margin-top: 11rem;
  font-size: 1.5rem;
  line-height: 3.3333333333;
}
#about .ilst {
  margin-top: 20rem;
  text-align: center;
}
#about .ilst img {
  width: 57rem;
}
#about .airplane {
  position: absolute;
  top: 50rem;
  left: 17rem;
}
@media (max-width: 768px) {
  #about {
    margin-top: 0rem !important;
    padding-top: 10rem;
  }
  #about .body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  #about .body h3 {
    width: aut0;
    width: 100%;
    text-align: center;
  }
  #about .body h3 img {
    width: 18rem;
  }
  #about .body p {
    display: inline-block;
    margin-top: 7rem;
    font-size: 1.5rem;
    line-height: 3.3333333333;
  }
  #about .ilst {
    margin-top: 5rem;
    text-align: center;
  }
  #about .ilst img {
    width: 33rem;
  }
  #about .airplane {
    position: absolute;
    top: -15rem;
    left: 5rem;
    transform: scale(0.5) rotate(5deg);
    transform-origin: left top;
  }
}

/*--------------------------------------------------------------
service
--------------------------------------------------------------*/
#service {
  margin-top: 5rem !important;
  background: #C9ECF7;
  overflow: visible;
}
#service::before {
  content: "";
  display: block;
  position: absolute;
  top: -10rem;
  width: 100%;
  left: 0;
  height: 10rem;
  background: #C9ECF7;
}
#service .airplane {
  position: absolute;
  top: -25rem;
  right: -3rem;
  filter: sepia(100%) hue-rotate(162deg) invert(9%) saturate(400%);
  mix-blend-mode: multiply;
}
#service .airplane svg {
  max-width: 10000px;
}
#service .airplane_bg {
  z-index: -1;
}
#service .windbg1 {
  position: absolute;
  top: calc(-10rem - 1px);
  top: -10rem;
  bottom: unset;
  left: 0;
  height: 35rem;
  transform: none;
  transform: scale(1, -1);
  transform-origin: left 50%;
  background: transparent;
}
#service .windbg1 .windbginner {
  top: 0;
}
#service .wind {
  position: relative;
  z-index: 2;
}
#service .wind .windbg {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
#service ul.regular {
  display: flex;
  flex-wrap: wrap;
  gap: 9rem 4rem;
  position: relative;
}
#service ul.regular li:not(.circle) {
  width: 32.4rem;
  min-height: 47rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  border-radius: 4rem;
  border: 1px solid #22262B;
  overflow: hidden;
  position: relative;
  background: #fff;
  position: relative;
  z-index: 2;
}
#service ul.regular li:not(.circle):nth-of-type(3n - 1) {
  top: 9rem;
}
#service ul.regular li:not(.circle) h3 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1rem;
}
#service ul.regular li:not(.circle) h3 span {
  display: inline-block;
  background: #000;
  background: #C6E5F6;
  line-height: 3rem;
  font-size: 1.8rem;
  padding: 0 2rem;
  font-weight: bold;
}
#service ul.regular li:not(.circle) p {
  padding: 1.5rem 2rem 2.5rem;
  font-size: 1.4rem;
  line-height: 1.7142857143;
}
#service ul.regular .circle {
  position: absolute;
  z-index: 1;
  bottom: -15rem;
  right: -12rem;
}
@media (min-width: 769px) {
  #service ul.regular .circle {
    transform: scale(1.2);
  }
}
#service ul.regular .circle img {
  -webkit-animation: 20s linear infinite rotation;
          animation: 20s linear infinite rotation;
}
#service .lower {
  background: #fff;
}
@media (min-width: 769px) {
  #service .lower {
    padding-top: 8rem;
  }
}
#service ul.sub {
  width: 100rem;
  padding-top: 12rem;
}
#service ul.sub li {
  margin-top: 4rem;
  height: 22.5rem;
  border-radius: 4rem;
  border: 1px solid #22262B;
}
#service ul.sub li a {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 5rem;
  display: flex;
  width: 100%;
  height: 100%;
}
#service ul.sub li figure {
  position: absolute;
  bottom: 0;
  right: 0;
}
#service ul.sub li p {
  font-size: 2.4rem;
  line-height: 1.6666666667;
  margin-top: 1.5rem;
}
#service ul.sub li .arrow {
  position: absolute;
  width: 5.2rem;
  height: 5.2rem;
  border: 1px solid #000;
  background: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 2.5rem;
  transition: background-color 0.3s ease;
}
#service ul.sub li .arrow img {
  transform: filter 0.3s ease;
}
#service ul.sub li:hover .arrow {
  background: #000;
}
#service ul.sub li:hover .arrow img {
  filter: invert(100%);
}
#service ul.sub li.signage .txt h3 {
  font-family: "Cinzel", sans-serif;
  font-size: 4.24em;
  letter-spacing: 0.15em;
}
#service ul.sub li.signage .txt p {
  margin-left: 2em;
}
#service ul.sub li.signage figure {
  width: 28rem;
  right: 12rem;
  bottom: 2rem;
}
#service ul.sub li.ants {
  overflow: hidden;
}
#service ul.sub li.ants figure {
  width: 52rem;
  height: 100%;
  -webkit-clip-path: polygon(6rem 0%, 100% 0%, 100% 100%, 0% 100%);
          clip-path: polygon(6rem 0%, 100% 0%, 100% 100%, 0% 100%);
}
#service ul.sub li.ants figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#service ul.sub li.ants .txt {
  display: flex;
  gap: 4rem;
}
#service ul.sub li.ants .txt .mark {
  width: 11.2rem;
}
#service ul.sub li.ants .txt .main h4 {
  font-size: 1.5rem;
}
#service ul.sub li.ants .txt .main h3 {
  font-size: 2.2rem;
}
@media (max-width: 768px) {
  #service {
    margin-top: 15rem !important;
  }
  #service::before {
    top: -20rem;
    height: 25rem;
  }
  #service .windbg1 {
    top: calc(-20rem - 1px);
    height: 25rem;
  }
  #service .airplane {
    position: absolute;
    top: -32rem;
    right: 7rem;
    transform: scale(0.6);
    transform-origin: right top;
  }
  #service ul.regular {
    display: flex;
    flex-wrap: wrap;
    padding: 0 1rem;
    gap: 5rem;
    position: relative;
    padding-bottom: 12rem;
  }
  #service ul.regular li:not(.circle) {
    width: auto;
    min-height: 47rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    border-radius: 4rem;
    border: 1px solid #22262B;
  }
  #service ul.regular li:not(.circle):nth-of-type(3n - 1) {
    top: 0;
  }
  #service ul.regular li:not(.circle) h3 {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1rem;
  }
  #service ul.regular li:not(.circle) h3 span {
    display: inline-block;
    background: #000;
    background: #C6E5F6;
    line-height: 2.4rem;
    font-size: 1.4rem;
    padding: 0.2rem 2rem 0;
    font-weight: bold;
  }
  #service ul.regular li:not(.circle) p {
    padding: 1.5rem 2rem 2.5rem;
    font-size: 1.4rem;
    line-height: 1.7142857143;
  }
  #service ul.regular .circle {
    position: static;
    margin-bottom: -8rem;
    width: 100%;
  }
  #service ul.regular .circle img {
    width: 100%;
  }
  #service ul.sub {
    width: auto;
    margin-top: 0rem;
  }
  #service ul.sub li {
    margin-top: 4rem;
    height: 20.5rem;
    border-radius: 4rem;
    border: 1px solid #22262B;
  }
  #service ul.sub li a {
    position: relative;
    display: block;
    width: 100%;
    justify-content: flex-start;
    align-items: flex-end;
    padding: 2.5rem 2.5rem 1rem;
    display: flex;
    width: 100%;
    height: 100%;
  }
  #service ul.sub li figure {
    position: absolute;
    bottom: 0;
    right: 0;
  }
  #service ul.sub li p {
    font-size: 1.4rem;
    line-height: 1.6666666667;
    margin-top: 1.5rem;
  }
  #service ul.sub li .arrow {
    width: 4rem;
    height: 4rem;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
  }
  #service ul.sub li.signage .txt h3 {
    font-size: 2.2em;
    letter-spacing: 0.15em;
  }
  #service ul.sub li.signage .txt p {
    margin-left: 0;
  }
  #service ul.sub li.signage figure {
    width: 21rem;
    right: 6rem;
    bottom: 12rem;
  }
  #service ul.sub li.ants {
    overflow: hidden;
    z-index: 5;
  }
  #service ul.sub li.ants figure {
    width: 22rem;
    height: 100%;
    -webkit-clip-path: polygon(6rem 0%, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(6rem 0%, 100% 0%, 100% 100%, 0% 100%);
    z-index: -1;
  }
  #service ul.sub li.ants figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  #service ul.sub li.ants figure::after {
    width: 100%;
    height: 10rem;
    content: "";
    background: linear-gradient(to top, white, rgba(255, 255, 255, 0));
    position: absolute;
    bottom: 0;
    right: 0;
  }
  #service ul.sub li.ants .txt {
    width: 100%;
    display: block;
    gap: 1rem;
    flex-direction: column;
  }
  #service ul.sub li.ants .txt .mark {
    width: 7rem;
    margin-left: 2rem;
  }
  #service ul.sub li.ants .txt .main h4 {
    font-size: 1.2rem;
    margin-top: 1rem;
  }
  #service ul.sub li.ants .txt .main h3 {
    font-size: 1.6rem;
  }
  #service ul.sub li.ants .txt .main p {
    margin-top: 0;
  }
}

@-webkit-keyframes rotation {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotation {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*--------------------------------------------------------------
company
--------------------------------------------------------------*/
#company {
  z-index: 10;
}
#company .inner {
  width: 80rem;
}
#company .inner dl {
  display: flex;
  flex-wrap: wrap;
}
#company .inner dl dt, #company .inner dl dd {
  font-size: 1.5rem;
  line-height: 2;
  width: 14rem;
  padding: 2rem 0;
}
#company .inner dl dt:nth-of-type(n + 2), #company .inner dl dd:nth-of-type(n + 2) {
  border-top: 1px solid #000;
}
#company .inner dl dt {
  padding-left: 2rem;
}
#company .inner dl dd {
  width: calc(100% - 14rem);
}
#company .inner dl ul li {
  padding-left: 1em;
}
#company .inner dl ul li + li {
  margin-top: 0.5rem;
}
#company .inner dl ul li::before {
  content: "・";
  width: 1em;
  display: inline-block;
  margin-left: -1em;
}
#company .inner dl ul li.attention:nth-of-type(n + 2) {
  margin-top: 1.5em;
}
#company .inner dl ul li.attention::before {
  content: "■";
  color: #C6E5F6;
}
@media (max-width: 768px) {
  #company {
    margin-top: 5rem !important;
  }
  #company .inner {
    width: auto;
  }
  #company .inner hgroup {
    margin-bottom: 4rem;
  }
  #company .inner dl {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
  #company .inner dl dt, #company .inner dl dd {
    font-size: 1.5rem;
    line-height: 1.8666666667;
    width: auto;
    padding: 0 0;
  }
  #company .inner dl dt:nth-of-type(n + 2), #company .inner dl dd:nth-of-type(n + 2) {
    border-top: none;
  }
  #company .inner dl dt {
    padding-left: 0;
    padding-top: 1.5rem;
  }
  #company .inner dl dd {
    padding-top: 0.5rem;
    padding-bottom: 1.5rem;
    width: auto;
  }
  #company .inner dl dd:not(:last-of-type) {
    border-bottom: 1px solid #000;
  }
  #company .inner dl ul li {
    padding-left: 1em;
  }
  #company .inner dl ul li + li {
    margin-top: 0.5rem;
  }
  #company .inner dl ul li::before {
    content: "・";
    width: 1em;
    display: inline-block;
    margin-left: -1em;
  }
  #company .inner dl ul li.attention:nth-of-type(n + 2) {
    margin-top: 1.5em;
  }
  #company .inner dl ul li.attention::before {
    content: "■";
    color: #C6E5F6;
  }
}

/*--------------------------------------------------------------
contact
--------------------------------------------------------------*/
main.confirm {
  background: #97D1EF;
  min-height: calc(100vh - 5.5rem);
}
@media (max-width: 768px) {
  main.confirm {
    min-height: calc(100vh - 4rem);
  }
}

#contact {
  margin-top: 15rem !important;
  padding-top: 20rem !important;
  background: #97D1EF;
}
main.confirm #contact {
  margin-top: -10rem !important;
}
@media (max-width: 768px) {
  main.confirm #contact {
    margin-top: 10rem !important;
  }
}
#contact .windbg {
  position: absolute;
  height: 30rem;
  top: 0;
  left: 0;
  transform: scale(1.5, -1);
  transform-origin: left 50%;
  background: #97D1EF;
}
main.confirm #contact .windbg {
  top: -15rem;
  height: 15rem;
}
#contact .windbg .windbginner {
  top: 0;
}
#contact .windbg::before {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1.7px;
  background: #fff;
  content: "";
  z-index: 10;
}
#contact hgroup {
  padding-top: 7rem;
}
#contact .airplane {
  position: absolute;
  top: 15rem;
  right: 0;
  z-index: 10;
  filter: sepia(100%) hue-rotate(162deg) invert(18%) saturate(600%);
  mix-blend-mode: multiply;
}
#contact .inner {
  width: 102rem;
  padding-top: 5rem;
  padding-bottom: 10rem;
}
body.confirm #contact .inner {
  width: 80rem;
}
#contact .note {
  font-size: 1.4rem;
  line-height: 1.8571428571;
}
#contact .asterisk {
  color: #DD0D23;
}
#contact .form_wrapper {
  margin-top: rem;
}
#contact dl {
  display: flex;
  flex-wrap: wrap;
}
#contact dl dt, #contact dl dd {
  margin-top: 2rem;
}
#contact dl dt {
  padding-top: 0.8rem;
  width: 24rem;
  font-size: 1.5rem;
}
#contact dl dt.privacy {
  padding-top: 0;
}
body.confirm #contact dl dt {
  padding-top: 0;
}
#contact dl dd {
  width: calc(100% - 24rem);
  font-size: 1.5rem;
}
#contact dl dd input[type=text], #contact dl dd input[type=email], #contact dl dd textarea {
  min-height: 3.5rem;
  padding: 0.5rem 1rem;
  background: #fff;
  width: 100%;
}
#contact dl dd textarea {
  min-height: 14rem;
}
#contact dl dd select {
  padding: 1.2rem 1rem;
  background: #fff;
}
#contact dl dd .select_wrapper {
  position: relative;
  display: inline-block;
}
#contact dl dd .select_wrapper::after {
  content: "";
  background: url(../image/select_arrow.svg) center center/contain no-repeat;
  width: 10px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 1.5rem;
}
#contact dl dd input[type=checkbox] {
  display: none;
}
#contact dl dd input[type=checkbox] + label {
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#contact dl dd input[type=checkbox] + label::before {
  content: "";
  display: inline-block;
  width: 2.3rem;
  aspect-ratio: 1/1;
  border-radius: 0.5rem;
  border: 1px solid #000;
  vertical-align: middle;
  margin-right: 0.8rem;
}
#contact dl dd input[type=checkbox] + label a {
  font-weight: bold;
  text-decoration: underline;
}
#contact dl dd input[type=checkbox]:checked + label::before {
  background: url(../image/icon_check.svg) center center/60% 60% no-repeat;
}
#contact .form_submit {
  margin-top: 6rem;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5rem;
}
#contact .form_submit button {
  width: 15rem;
  height: 4.5rem;
  background: #22262B;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: #fff;
  letter-spacing: 0.3em;
  transition: background-color 0.3s, color 0.3s;
  cursor: pointer;
}
#contact .form_submit button:hover {
  background: #fff;
  color: #22262B;
}
#contact .form_submit button.reverse {
  color: #22262B;
  background: #fff;
  width: 10rem;
  letter-spacing: normal;
}
#contact .thankyou {
  text-align: center;
}
#contact .thankyou h3 {
  font-size: 2rem;
  font-weight: bold;
}
#contact .thankyou p {
  margin-top: 3rem;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2;
}
#contact .thankyou .btn_wrapper {
  margin-top: 5rem;
}
#contact .thankyou .button {
  width: 15rem;
  height: 4.5rem;
  background: #22262B;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: #fff;
  letter-spacing: 0.3em;
  transition: background-color 0.3s, color 0.3s;
  cursor: pointer;
}
#contact .thankyou .button:hover {
  background: #fff;
  color: #22262B;
}
@media (max-width: 768px) {
  #contact {
    margin-top: 15rem !important;
    padding-top: 15rem !important;
  }
  #contact .windbg {
    position: absolute;
    top: -1px;
    left: 0;
    transform: scale(1, -1);
    background: transparent;
  }
  #contact .windbg .windbginner {
    top: unset;
    top: 0px;
    bottom: unset;
  }
  body.confirm #contact {
    padding-top: 0 !important;
  }
  #contact hgroup {
    padding-top: 0 !important;
    margin-bottom: 5rem !important;
  }
  body.confirm #contact hgroup {
    padding-top: 0;
  }
  #contact .airplane {
    position: absolute;
    top: 15rem;
    right: 0;
    z-index: 10;
  }
  #contact .airplane {
    position: absolute;
    top: 10rem;
    right: unset;
    left: 17rem;
    transform: scale(0.7);
    transform-origin: left top;
  }
  #contact .inner {
    width: auto;
    padding-top: 5rem;
    padding-bottom: 10rem !important;
  }
  body.confirm #contact .inner {
    width: auto;
  }
  #contact .note {
    font-size: 1.4rem;
    line-height: 1.8571428571;
    margin-bottom: 1rem;
  }
  #contact .asterisk {
    color: #DD0D23;
  }
  #contact .form_wrapper {
    margin-top: rem;
  }
  #contact dl {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
  #contact dl dt, #contact dl dd {
    margin-top: 2rem;
  }
  #contact dl dt {
    padding-top: 0;
    width: 100%;
    font-size: 1.5rem;
  }
  #contact dl dt.privacy {
    padding-top: 0;
  }
  body.confirm #contact dl dt {
    padding-top: 0;
  }
  #contact dl dd {
    width: 100%;
    font-size: 1.4rem;
    margin-top: 0.5rem;
  }
  #contact dl dd input[type=text], #contact dl dd input[type=email], #contact dl dd textarea {
    min-height: 3.5rem;
    padding: 0.5rem 1rem;
    background: #fff;
    width: 100%;
  }
  #contact dl dd textarea {
    min-height: 14rem;
  }
  #contact dl dd select {
    padding: 1.2rem 1rem;
    background: #fff;
    max-width: 100%;
  }
  #contact dl dd .select_wrapper {
    position: relative;
    display: inline-block;
    max-width: 100%;
  }
  #contact dl dd .select_wrapper::after {
    content: "";
    background: url(../image/select_arrow.svg) center center/contain no-repeat;
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 1.5rem;
  }
  #contact dl dd input[type=checkbox] {
    display: none;
  }
  #contact dl dd input[type=checkbox] + label {
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  #contact dl dd input[type=checkbox] + label::before {
    content: "";
    display: inline-block;
    width: 2.3rem;
    aspect-ratio: 1/1;
    border-radius: 0.5rem;
    border: 1px solid #000;
    vertical-align: middle;
    margin-right: 0.8rem;
  }
  #contact dl dd input[type=checkbox] + label a {
    font-weight: bold;
    text-decoration: underline;
  }
  #contact dl dd input[type=checkbox]:checked + label::before {
    background: url(../image/icon_check.svg) center center/60% 60% no-repeat;
  }
  #contact .form_submit {
    margin-top: 3rem;
    text-align: center;
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    gap: 3rem;
  }
  #contact .form_submit button {
    width: 15rem;
    height: 3.5rem;
    background: #22262B;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    color: #fff;
    letter-spacing: 0.3em;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
  }
  #contact .form_submit button:hover {
    background: #fff;
    color: #22262B;
  }
  #contact .form_submit button.reverse {
    color: #22262B;
    background: #fff;
    width: 10rem;
    letter-spacing: normal;
  }
  #contact .thankyou {
    text-align: center;
  }
  #contact .thankyou h3 {
    font-size: 2rem;
    font-weight: bold;
  }
  #contact .thankyou p {
    margin-top: 3rem;
    text-align: left;
    font-size: 1.4rem;
    line-height: 2;
  }
  #contact .thankyou .btn_wrapper {
    margin-top: 5rem;
  }
  #contact .thankyou .button {
    width: 15rem;
    height: 4.5rem;
    background: #22262B;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    color: #fff;
    letter-spacing: 0.3em;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
  }
  #contact .thankyou .button:hover {
    background: #fff;
    color: #22262B;
  }
}

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

--------------------------------------------------------------*/
main.privacy {
  padding-top: 20rem;
}
main.privacy section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
main.privacy section.regular_section {
  margin-bottom: 15rem !important;
}
main.privacy section.regular_section .inner {
  max-width: 80rem;
}
main.privacy section.regular_section h2 {
  font-size: 2.8rem;
  font-weight: bold;
  margin-bottom: 1.5em;
}
main.privacy section.regular_section h3 {
  font-size: 1.8rem;
  font-weight: bold;
  margin-top: 3.5rem;
  margin-bottom: 1.2em;
}
main.privacy section.regular_section h4 {
  font-size: 1.7rem;
  font-weight: bold;
  margin-top: 3.5rem;
  margin-bottom: 1.2em;
}
main.privacy section.regular_section p, main.privacy section.regular_section dl, main.privacy section.regular_section dt, main.privacy section.regular_section dd, main.privacy section.regular_section table {
  font-size: 1.6rem;
  line-height: 1.8;
}
main.privacy section.regular_section * + p {
  margin-top: 1.5em;
}
main.privacy section.regular_section dl dt {
  font-size: 110%;
  font-weight: bold;
  margin-top: 3em;
  margin-bottom: 1em;
}
main.privacy section.regular_section div.bottom {
  margin-top: 2em;
}
main.privacy section.regular_section div.bottom p {
  text-align: right;
}
main.privacy section.regular_section table {
  width: 100%;
  border-top: 1px solid #000;
}
main.privacy section.regular_section table tr {
  border-bottom: 1px solid #000;
}
main.privacy section.regular_section table tr td, main.privacy section.regular_section table tr th {
  padding: 1rem 0;
}
main.privacy section.regular_section table tr th {
  padding-right: 1rem;
  font-weight: bold;
}

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

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

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

--------------------------------------------------------------*/
/*========= レイアウトのためのCSS ===============*/
/*========= waveを描画するエリア設定 ===============*/
.wave {
  position: relative;
  height: 30rem;
}

.wave canvas {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
/*# sourceMappingURL=style.css.map */