@layer reset, components, utilities;
:root {
  --theme: #152C53;
  --sub: #E83E0B;
  --typo: #ffffff;
  --body: #152C53;
  --gray: #dddddd;
  --ice: #f2f2f2;
  --thin: 330;
  --regular: 500;
  --semi: 600;
  --bold: 700;
  --black: 800;
  --paragraph: 1em;
  --h1: 2.7em;
  --h2: 2.2em;
  --h3: 2em;
  --h4: 1.5em;
  --chapSize: 4.5vw;
  --tr02: all .2s ease-in-out;
  --tr04: all .4s ease-in-out;
  --trDis: transform .6s cubic-bezier(0.55, -0.15, 0.1, 0.92), opacity .8s cubic-bezier(0.6, 0, 0, 1), visibility 0s, border-radius .6s cubic-bezier(0.6, 0, 0, 1);
  --easing: cubic-bezier(0.97, 0.04, 0.58, 0.8);
  --easing2: cubic-bezier(1, 0.01, 0.2, 1);
  --easing3: cubic-bezier(0.97, -0.18, 0.41, 1);
  --bounce: cubic-bezier(0.75, -0.26, 0.58, 1.78);
  --bounce2: cubic-bezier(1, 0, 0.58, 1.78);
  --rad0: .5rem;
  --rad1: 1rem;
  --rad3: 2rem;
  --rad5: 3rem;
  --margin: .5rem;
  --navH: 3.5rem;
  --fitH: 100vh;
  --btnMenu: 3em;
  --logoMark: 5em;
  --modalClip: inset(calc(var(--navH) * .25) calc(var(--navH) * .25) round var(--rad3));
  --pad: 2rem;
  --innPad: calc(var(--pad) * 3);
  --innNarrow: calc(var(--pad) * 5);
  --innCramped: calc(var(--pad) * 7);
}
@media (768px <= width <= 1440px) {
  :root {
    --paragraph: .95em;
    --logoMark: 4em;
    --innNarrow: calc(var(--pad) * 4);
    --innCramped: calc(var(--pad) * 6);
  }
}
@media (width <= 768px) {
  :root {
    --h1: 2.2em;
    --h2: 1.5em;
    --h3: 1.3em;
    --h4: 1.1em;
    --fitH: 180vw;
    --logoMark: 3em;
    --innPad: calc(var(--pad) * .75);
    --innNarrow: var(--innPad);
    --innCramped: var(--innPad);
  }
}

.no-fouc {
  display: none;
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
}

.fouc,
.container {
  visibility: hidden;
  opacity: 0;
}

.loaded .fouc,
.swup-enabled .fouc {
  opacity: 1;
  visibility: visible;
}
.loaded .siteFrame,
.swup-enabled .siteFrame {
  opacity: 1;
  visibility: visible;
}
.loaded .globalMenu,
.swup-enabled .globalMenu {
  transform: translateX(100%);
}

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

html {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
}
html.posFix {
  overflow-y: hidden;
}

body {
  width: 100%;
  position: relative;
}
body.loaded .sectMenu,
body.loaded .siteFrame {
  transition: opacity 0.8s cubic-bezier(0.6, 0, 0, 1);
  opacity: 1;
}
body.loaded .sideNav {
  opacity: 1;
  transition-delay: 0.1s, 0.1s, 0s;
}
body.loaded .pageBg {
  opacity: 0.1;
}
body.down .headerLogo,
body.down .pcNav nav {
  transform: translateY(calc(0% - var(--navH) * 2));
}
@media (width >= 768px) {
  body.down {
    --scrollY: calc(var(--navH) * .25);
    --scrollMT: calc(calc(var(--navH) * 1.5) + 3em);
  }
}
@media (width <= 768px) {
  body.down {
    --scrollY: 0;
    --scrollMT: calc(calc(var(--navH) * 1.5) + 3em);
  }
}
@media (width >= 768px) {
  body.up {
    --scrollY: calc(var(--navH) * 1.5);
    --scrollMT: calc(calc(var(--navH) * .25) + 3em);
  }
}
@media (width <= 768px) {
  body.up {
    --scrollY: calc(var(--navH) * 1);
    --scrollMT: calc(calc(var(--navH) * .25) + 3em);
  }
}
body.running .pcNav nav {
  background: white;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
}
body.isFooter .btnMenu {
  border-radius: 50%;
  background: white;
}
@media (width <= 768px) {
  body {
    overflow: hidden;
  }
}

.chgWrap {
  background: var(--body);
  color: var(--typo);
  transition: background-color 0.4s linear, color 0.4s ease-in-out;
}

.inner {
  --padding: var(--innPad);
  position: relative;
  margin: 0 auto;
  padding-left: var(--padding);
  padding-right: var(--padding);
}
.inner.narrow {
  --padding: var(--innNarrow);
}
.inner.cramped {
  --padding: var(--innCramped);
}
@media (width <= 768px) {
  .inner {
    max-width: 32em;
  }
}

.siteFrame {
  opacity: 0;
}
.siteFrame .headerLogo {
  order: 1;
  z-index: 99;
}
.siteFrame .btnMenu {
  z-index: 106;
}
.siteFrame .globalMenu {
  z-index: 105;
}
.siteFrame .outerWrap {
  order: 2;
}
.siteFrame .copyRight {
  order: 4;
}

.outerWrap {
  width: 100%;
  position: relative;
  z-index: 1;
  margin: 0 auto;
}

.drawered .siteFrame .menuLayer {
  border-radius: 0;
}
.drawered.navOpen .siteFrame .menuLayer {
  width: 100%;
  height: 100%;
  transition: 0.6s all cubic-bezier(0.55, -0.15, 0.1, 0.92) 0.1s, 0s right;
}
.drawered.navOpen .siteFrame .menuLayer span {
  border-radius: 0;
  transition: 0.6s all cubic-bezier(0.55, -0.15, 0.1, 0.92) 0.1s;
}

.gLogo {
  --wdt: 300;
  --hgt: 280;
  position: relative;
  width: var(--logoMark);
  aspect-ratio: var(--wdt)/var(--hgt);
}
.gLogo a {
  display: block;
  width: 100%;
  height: 100%;
}
.gLogo a:hover svg rect, .gLogo a:hover svg polygon, .gLogo a:hover svg path {
  fill: var(--sub);
}
.gLogo svg,
.gLogo img {
  width: 100%;
  height: 100%;
}
.gLogo svg rect, .gLogo svg polygon, .gLogo svg path,
.gLogo img rect,
.gLogo img polygon,
.gLogo img path {
  transition: var(--tr04);
}

.headerLogo {
  position: absolute;
}
.headerLogo svg rect, .headerLogo svg polygon, .headerLogo svg path {
  fill: var(--typo);
}
@media (width >= 768px) {
  .headerLogo {
    top: var(--pad);
    left: var(--pad);
  }
}
@media (width <= 768px) {
  .headerLogo {
    top: calc(var(--pad) * 0.5);
    left: calc(var(--pad) * 0.5);
  }
}

.btnMenu {
  --barWidth: 1.25em;
  position: fixed;
  top: var(--navTop);
  width: var(--btnMenu);
  height: var(--btnMenu);
  padding: 0;
  cursor: pointer;
  border: 0;
  outline: 0;
  align-items: center;
  align-content: center;
  justify-content: center;
  background: none;
  color: currentColor;
  transition: var(--trDis);
}
@media (width >= 768px) {
  .btnMenu {
    right: 0;
    margin-right: var(--pad);
  }
}
@media (width <= 768px) {
  .btnMenu {
    top: 0;
    right: 0;
  }
}
.btnMenu div {
  width: var(--barWidth);
  height: var(--barWidth);
  align-items: center;
  align-content: center;
  justify-content: center;
  transition: all 0.2s cubic-bezier(0.84, 0.17, 0, 0.71);
  transform: translate3d(0, 0, 0);
}
.btnMenu div span {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 40%;
}
.btnMenu div span:before, .btnMenu div span:after {
  content: "";
  height: 2px;
  display: block;
  background: currentColor;
  position: absolute;
  left: 0;
  transition: all 0.2s cubic-bezier(0.84, 0.17, 0, 0.71) 0.1s;
}
.btnMenu div span:before {
  top: 0;
  width: 100%;
}
.btnMenu div span:after {
  top: 100%;
  width: 75%;
}
.btnMenu div em {
  line-height: 1;
  font-size: 0.7em;
  text-align: center;
  width: calc(100% + 0.75em);
  color: var(--typo);
  font-weight: var(--regular);
  margin: 0.75em 0 -0.75em;
  display: none;
}
.btnMenu.opened {
  border-radius: 50%;
  background: white;
}
.btnMenu.opened div span:before, .btnMenu.opened div span:after {
  width: 100%;
  top: 50%;
  left: 0;
  transition-delay: 0.4s;
}
.btnMenu.opened div span:before {
  rotate: 45deg;
}
.btnMenu.opened div span:after {
  rotate: -45deg;
}

.pcNav {
  --barWidth: 1.25em;
  right: 0;
  margin-right: calc(var(--btnMenu) + var(--pad) * 1.5);
  z-index: 2;
  height: var(--btnMenu);
  align-items: center;
  position: fixed;
}
@media (width >= 768px) {
  .pcNav {
    top: var(--navTop);
    gap: 2em;
  }
}
@media (width <= 768px) {
  .pcNav {
    bottom: 0;
    background: white;
    padding: 0.5em;
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.2);
    width: 100%;
  }
  .pcNav .inqBtn {
    width: 100%;
    display: flex;
    gap: 0.5em;
  }
  .pcNav .inqBtn a {
    flex: 1;
  }
}
.pcNav nav {
  transition: var(--tr04);
  padding: 0 calc(var(--pad) * 0.75);
  border-radius: var(--rad5);
}
@media (width >= 768px) {
  .pcNav nav:hover {
    background: white;
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  }
}
@media (width <= 768px) {
  .pcNav nav {
    display: none;
  }
}
.pcNav nav > ul {
  gap: calc(var(--pad) * 0.5);
}
.pcNav nav > ul > li {
  position: relative;
}
.pcNav nav > ul > li > a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: calc(var(--pad) * 0.25);
  color: var(--typo);
}
.pcNav nav > ul > li > a:after {
  --afterH: 1px;
  content: "";
  display: block;
  width: calc(100% - var(--pad) * 0.5);
  height: var(--afterH);
  background: currentColor;
  position: absolute;
  top: calc(100% - var(--afterH) * 2);
  left: calc(var(--pad) * 0.25);
  clip-path: inset(0 50%);
  transition: var(--tr04);
}
.pcNav nav > ul > li > a:hover:after {
  clip-path: inset(0 0);
}
.pcNav nav > ul > li.menu-item-has-children:hover > a + .sub-menu {
  opacity: 1;
  clip-path: polygon(-1em -1em, calc(100% + 1em) -1em, calc(100% + 1em) calc(100% + 1em), -1em calc(100% + 1em));
  transition-delay: 0.3s;
}
.pcNav nav > ul > li.menu-item-has-children .sub-menu {
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  transition: var(--tr04);
  opacity: 0;
  clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  display: flex;
  flex-direction: column;
  padding: 0.5em;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  border-radius: var(--rad0);
  background: white;
  min-width: 200%;
}
.pcNav nav > ul > li.menu-item-has-children .sub-menu li a {
  position: relative;
  padding: 0.5em;
  display: block;
  transition: var(--tr04);
  color: var(--typo);
}
.pcNav nav > ul > li.menu-item-has-children .sub-menu li a:hover {
  background: var(--typo);
  border-radius: var(--rad0);
}
.pcNav .inqBtn a {
  background: var(--typo);
  color: white;
}
.pcNav .inqBtn a:hover {
  background: var(--sub);
}

.inqBtn {
  line-height: 1.5;
  gap: var(--wrapGap);
}
@media (width >= 768px) {
  .inqBtn {
    --wrapGap: 1em;
    --btnPad: calc(var(--pad) * 0.25) calc(var(--pad) * 0.5) calc(var(--pad) * 0.25) calc(var(--pad) * 0.33);
    --btnGap: 1em;
    --btnH: 100%;
  }
}
@media (width <= 768px) {
  .inqBtn {
    --wrapGap: 1em;
    --btnPad: 1em 1em;
    --btnGap: .5em;
    --btnH: auto;
  }
}
.inqBtn a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--btnH);
  padding: var(--btnPad);
  gap: var(--btnGap);
  border-radius: var(--rad0);
  transition: var(--tr04);
}

.serviceCard .serviceCardItem {
  flex: 1;
}
.serviceCard .serviceCardItem a {
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  text-align: center;
  font-weight: 700;
  transition: var(--tr04);
}
.serviceCard .serviceCardItem a figure {
  position: relative;
  z-index: 1;
  aspect-ratio: 500/367;
}
.serviceCard .serviceCardItem a figure:after {
  content: "";
  display: block;
  width: 73.4%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  background: white;
  z-index: 0;
  border-radius: 50%;
  transition: var(--tr04);
}
.serviceCard .serviceCardItem a figure img {
  z-index: 1;
}
.serviceCard .serviceCardItem a span {
  display: block;
  line-height: 1.5;
}

.globalMenu {
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.6, 0, 0, 1), box-shadow 0.2s ease, opacity 0.2s ease, visibility linear 0s;
  transition-delay: 0s, 0s, 7s, 0.7s;
  opacity: 0;
  visibility: hidden;
}
.globalMenu .cBtn {
  transition: opacity 0.6s ease-in-out;
  transition-delay: 0s;
}
.globalMenu.visible {
  transform: translateX(0);
  transition-delay: 0.1s, 0.1s, 0.1s, 0s;
  opacity: 1;
  visibility: visible;
  box-shadow: 0 0 4em rgba(0, 0, 0, 0.4);
}
.globalMenu.visible .cBtn {
  opacity: 1;
  transition-delay: 0.8s;
}

.globalMenu {
  overflow: hidden;
  content-visibility: auto;
  contain-intrinsic-size: 1000px;
  position: fixed;
  width: calc(100% - var(--innPad));
  height: 100%;
  top: 0;
  right: 0;
  z-index: 100;
  color: var(--typo);
  transform: translate(100%, 0);
  border-radius: var(--rad5) 0 0 var(--rad5);
  background: var(--typo);
}
@media (width >= 768px) {
  .globalMenu {
    --emSize: 2em;
    --innerPad: 0 calc(var(--pad) * 2);
    --mainDir: column;
    --titleSize: 1.2em;
    --mainPad: 0;
    --topMenuPad: .75em 0 .75em 1.5em;
    --primaryDir: row;
    --innerY: center;
    --innerX: center;
    --leafX: 50vw;
    --leafY: 7vw;
    --strongY: calc(var(--navH) * 1);
    --stringX: calc(var(--navH) * 1);
    --leafOp: 1;
  }
}
@media (width <= 768px) {
  .globalMenu {
    --emSize: 2em;
    --innerPad: 0 0 var(--navH);
    --mainDir: column;
    --titleSize: 1.3em;
    --mainPad: calc(var(--navH) * .5) calc(var(--emSize) * .75) 0;
    --topMenuPad: .5em .5em .5em 1.5em;
    --primaryDir: column;
    --innerY: flex-start;
    --innerX: flex-start;
    --leafX: -40vw;
    --leafY: 100vw;
    --strongY: calc(var(--btnMenu) + 1em);
    --stringX: calc(100% - var(--btnMenu) + .75em);
    --leafOp: .2;
  }
}
.globalMenu a {
  transition: var(--tr04);
}
.globalMenu .innerWrap {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
  color: white;
}
@media (width >= 768px) {
  .globalMenu .innerWrap {
    --blobWid: 40vw;
  }
}
@media (width <= 768px) {
  .globalMenu .innerWrap {
    --blobWid: 100vw;
  }
}
.globalMenu .innerWrap:before {
  position: absolute;
  top: var(--leafY);
  right: var(--leafX);
  z-index: -1;
  opacity: var(--leafOp);
}
.globalMenu .innerWrap em.italic {
  display: block;
  font-size: var(--emSize);
  position: absolute;
  top: var(--strongY);
  left: var(--stringX);
  line-height: 0.8;
  color: white !important;
}
@media (width <= 768px) {
  .globalMenu .innerWrap em.italic {
    writing-mode: vertical-rl;
  }
}
.globalMenu .innerWrap .scrollInner {
  display: flex;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 100%;
  position: relative;
  flex-direction: column;
  justify-content: var(--innerY);
  align-items: var(--innerX);
  padding: var(--innerPad);
}
.globalMenu .innerWrap .scrollInner .mainItem {
  width: 100%;
  max-width: 60em;
  justify-content: center;
  flex-direction: var(--mainDir);
  padding: var(--mainPad);
}
@media (width >= 768px) {
  .globalMenu .innerWrap .scrollInner .mainItem .primaryMenu {
    column-count: 2;
  }
  .globalMenu .innerWrap .scrollInner .mainItem .primaryMenu li {
    font-size: var(--h4);
    page-break-inside: avoid;
    break-inside: avoid;
  }
}
@media (width <= 768px) {
  .globalMenu .innerWrap .scrollInner .mainItem .primaryMenu:not(.sub-menu):not(.secondaryMenu) li {
    font-size: var(--h4);
  }
  .globalMenu .innerWrap .scrollInner .mainItem .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu li a {
    padding: var(--topMenuPad);
    font-weight: 600;
  }
}
@media (width >= 768px) {
  .globalMenu .innerWrap .scrollInner .inqBtn {
    position: absolute;
    top: var(--strongY);
    left: calc(var(--stringX) + var(--navH));
    --btnPad: 1em 5em;
  }
}
@media (width <= 768px) {
  .globalMenu .innerWrap .scrollInner .inqBtn {
    flex-direction: column;
    max-width: calc(100% - var(--navH));
    margin-bottom: calc(var(--navH) * 0.5);
  }
  .globalMenu .innerWrap .scrollInner .inqBtn a {
    width: 100%;
  }
}
.globalMenu .innerWrap .scrollInner .inqBtn a {
  background: white;
  color: var(--typo);
}
.globalMenu .innerWrap .scrollInner .inqBtn a:hover {
  background: var(--typo);
  color: white;
}
.globalMenu .innerWrap .openClose {
  background: white;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  color: var(--typo);
  border-radius: var(--rad0);
  padding: 1em;
  margin-top: calc(var(--pad) * 2);
}
.globalMenu.close {
  cursor: url(../images/close.svg), pointer;
}

.menu .primaryMenu a {
  width: 100%;
  display: block;
  padding: 0.5em 0 0.5em 2em;
  transition: var(--tr04);
  position: relative;
}
.menu .primaryMenu a:before {
  content: "";
  display: block;
  width: 1em;
  height: 1px;
  background: currentColor;
  position: absolute;
  top: 50%;
  transition: var(--tr04);
  left: 0;
}
.menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children {
  display: flex;
  position: relative;
  line-height: 1;
  text-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  flex: 1;
  gap: var(--gap);
}
@media (width >= 768px) {
  .menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children {
    flex-direction: column;
    --gap: 0;
  }
}
@media (width <= 768px) {
  .menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children {
    --gap: 0;
    align-items: flex-start;
    flex-direction: column;
  }
}
.menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children + .menu-item-has-children {
  margin-top: 1em;
}
.menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  padding-left: 1em;
}
@media (width <= 768px) {
  .menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu {
    flex: 1;
  }
}
.menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu li {
  position: relative;
}
.menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu li a {
  font-size: 0.8em;
}
@media (width >= 768px) {
  .menu .primaryMenu:not(.sub-menu):not(.secondaryMenu) li:not(.guide).menu-item-has-children .sub-menu li a:hover:before {
    width: 1.5em;
  }
}

.breadCrumb {
  transition: var(--trDis);
  transition-delay: 0s, 0.6s, 0s, 0s;
  top: var(--top);
  left: var(--left);
}
@media (width >= 768px) {
  .breadCrumb {
    --top: calc(var(--navH) * 1.5);
    --left: calc(100% - var(--heroPad) * .5 + 1em);
    position: absolute;
    z-index: 3;
    transform: rotate(90deg);
    transform-origin: left top;
    width: calc(var(--fitH) - var(--navH) * 1.5);
    height: 1em;
  }
}
@media (width <= 768px) {
  .breadCrumb {
    --top: calc(var(--navH) * 1);
    --left: 100%;
    position: absolute;
    overflow: hidden;
    width: 100vh;
    height: calc(var(--innPad) * 0.5);
    z-index: 2;
    transform: rotate(90deg);
    transform-origin: top left;
  }
  .breadCrumb.smallText {
    font-size: 10px;
  }
}
.breadCrumb ul {
  margin: 0;
  justify-content: flex-start;
  align-items: center;
  font-size: 0.75em;
}
@media (width <= 768px) {
  .breadCrumb ul {
    justify-content: flex-end;
    overflow-x: scroll;
    word-break: keep-all;
    white-space: nowrap;
    flex-wrap: nowrap;
    height: 100%;
    padding-right: 0.5em;
  }
  .breadCrumb ul::-webkit-scrollbar {
    display: none;
  }
}
.breadCrumb ul li {
  display: flex;
  align-items: center;
}
.breadCrumb ul li [property=itemListElement] {
  display: flex;
  align-items: center;
  padding: 0.25em 1em;
  transition: var(--tr04);
}
.breadCrumb ul li [property=itemListElement]:before {
  content: "";
  display: block;
  width: 1.5em;
  height: 1px;
  margin-right: 0.5em;
  background: currentColor;
}
.breadCrumb ul li [property=itemListElement] a, .breadCrumb ul li [property=itemListElement] span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 20em;
}
.breadCrumb ul li [property=itemListElement]:has(a):hover {
  background: var(--typo);
  color: white;
  border-radius: 3em;
}

.bookingBnr {
  z-index: 100;
  transition: 0.6s transform cubic-bezier(0.55, -0.15, 0.1, 0.92) 0.1s;
  line-height: 1;
  filter: drop-shadow(0 0 1em rgba(0, 0, 0, 0.2));
  will-change: filter;
}

.bookingPane .cap {
  font-size: 1.8em;
  width: 100%;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}

.btns {
  width: 100%;
  padding: 0.5em 0;
  justify-content: center;
}
@media (width <= 768px) {
  .btns {
    justify-content: space-between;
  }
}
.btns .btn {
  padding: 0.5em;
}
@media (width <= 768px) {
  .btns .btn {
    width: 100%;
    margin-top: 0.5em;
  }
}
.btns .btn a {
  font-weight: 700;
  border-radius: 3em;
  transition: var(--tr02);
  padding: 1em 0.75em;
  background: white;
}
.btns .btn a img {
  width: 1.5em;
  height: 1.5em;
  margin-right: 0.5em;
}
.btns .btn a p {
  line-height: 1;
  font-size: 0.8em;
}
@media (width <= 768px) {
  .btns .btn a p {
    font-size: 1em;
  }
}
@media (width <= 768px) {
  .btns .btn a {
    justify-content: center;
    padding: 1em 0;
  }
  .btns .btn a:after {
    content: none;
  }
}

.btnList {
  justify-content: center;
  column-gap: 1em;
  width: 100%;
}
.btnList .btnElm {
  width: calc(50% - 1em);
  padding: 2em;
  align-items: center;
  background: var(--colorLight);
  border-radius: var(--rad1);
  margin-top: 1em;
}
@media (width <= 768px) {
  .btnList .btnElm {
    width: 100%;
    padding: 1em;
  }
}
.btnList .btnElm i {
  font-weight: 700;
}
@media (width >= 768px) {
  .btnList .btnElm i {
    margin-bottom: 1em;
  }
}
.btnList:not(:has(.btnElm:nth-of-type(2))) .btnElm {
  width: 100%;
}

.pageBg {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: -1;
  overflow: hidden;
  width: var(--width);
  height: var(--width);
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
  transition: var(--tr04);
  transition-delay: 0.4s;
  opacity: 0;
}
.pageBg svg {
  width: 100%;
  aspect-ratio: 1/1;
  transform: var(--transform);
  filter: drop-shadow(0 0 2em rgba(0, 0, 0, 0.4));
  will-change: filter;
}
.pageBg svg path, .pageBg svg rect, .pageBg svg polygon {
  fill: white;
}
@media (width >= 768px) {
  .pageBg {
    --width: 100%;
    --transform: rotate(-45deg) translate(25%, -25%);
  }
}
@media (width <= 768px) {
  .pageBg {
    --width: 200%;
    --transform: rotate(-45deg) translate(0%, -25%);
  }
}

.openClose {
  display: flex;
  flex-direction: var(--wrapDir);
}
@media (width >= 768px) {
  .openClose {
    --wrapDir: row;
  }
}
@media (width <= 768px) {
  .openClose {
    --wrapDir: column;
    width: 100%;
  }
}
.openClose dl {
  line-height: 1.25;
  display: flex;
  flex-direction: var(--elmDir);
}
@media (width >= 768px) {
  .openClose dl {
    flex: 1;
    --elmDir: column;
    --iDisp: block;
  }
}
@media (width <= 768px) {
  .openClose dl {
    width: 100%;
    --elmDir: row;
    --iDisp: inline;
  }
}
@media (width >= 768px) {
  .openClose dl:not(:last-of-type) {
    border-right: 1px solid;
  }
}
@media (width <= 768px) {
  .openClose dl:not(:last-of-type) {
    border-bottom: 1px solid;
  }
}
.openClose dl dt {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5em 0;
}
@media (width >= 768px) {
  .openClose dl dt {
    border-bottom: 1px solid;
  }
}
@media (width <= 768px) {
  .openClose dl dt {
    flex: 1;
    border-right: 1px solid;
  }
}
.openClose dl dd {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5em 0;
  height: 100%;
}
@media (width <= 768px) {
  .openClose dl dd {
    flex: 1;
  }
}
.openClose dl dd p {
  text-align: right;
}
@media (width <= 768px) {
  .openClose dl dd p br {
    display: none;
  }
}

.globalFooter {
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding-top: var(--padTop);
  padding-bottom: var(--padBottom);
  background: var(--body);
  color: var(--typo);
}
@media (width >= 768px) {
  .globalFooter {
    --padTop: 0;
    --padBottom: calc(var(--fitH) * .25);
  }
}
.globalFooter .inner {
  position: relative;
  z-index: 1;
  padding: calc(var(--pad) * 2) 0 calc(var(--pad) * 0.5);
  align-items: center;
  flex-direction: column;
  gap: var(--pad);
}
.globalFooter .inner .coInfo {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.globalFooter .inner .coInfo .footerLogo {
  --logoMark: 8em;
}
.globalFooter .inner .coInfo .footerLogo svg rect, .globalFooter .inner .coInfo .footerLogo svg polygon, .globalFooter .inner .coInfo .footerLogo svg path {
  fill: var(--typo);
}
.globalFooter .inner .coInfo strong {
  display: block;
  margin-top: 0.5em;
  font-size: var(--h4);
}
.globalFooter .inner .coInfo .address {
  display: flex;
  align-items: center;
  gap: 1em;
}
.globalFooter .inner .coInfo .social {
  width: 100%;
}
.globalFooter .inner .coInfo .social:before {
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background: currentColor;
  opacity: 0.2;
  margin: 3em 0 1em;
}
.globalFooter .inner .coInfo .social ul {
  gap: 1em;
  justify-content: center;
}
.globalFooter .inner .coInfo .social ul li {
  width: 1.25em;
}
.globalFooter .inner .coInfo .social ul li a {
  display: flex;
  align-items: center;
  gap: 0.5em;
  transition: var(--tr04);
}
.globalFooter .inner .coInfo .social ul li a:after {
  content: none;
}
.globalFooter .inner .coInfo .social ul li a svg {
  width: var(--iconSize);
}
.globalFooter .inner .coInfo .social ul li a svg path {
  fill: var(--typo);
}
.globalFooter .inner .footerNav {
  width: 100%;
}
.globalFooter .inner .footerNav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 1em;
}
.globalFooter .inner .footerNav ul li {
  display: block;
}
.globalFooter .inner .footerNav ul li a {
  font-size: 0.8em;
}
.globalFooter .copyRight {
  width: 100%;
  text-align: center;
}
.globalFooter .copyRight small {
  font-size: 0.8em;
}
.globalFooter .logoType {
  position: absolute;
  bottom: -1vw;
  left: 0;
  width: 100%;
  opacity: 0.05;
  z-index: -1;
  aspect-ratio: 200/48;
}
.globalFooter .logoType svg rect, .globalFooter .logoType svg polygon, .globalFooter .logoType svg path {
  fill: var(--typo);
}

.closeBtn {
  --barWidth: 1.25em;
  --top: calc(0% + var(--pad) * 2);
  --right: calc(0% + var(--pad) * 2);
  width: var(--btnMenu);
  height: var(--btnMenu);
  cursor: pointer;
  display: block;
  position: absolute;
  top: var(--top);
  right: var(--right);
  padding: 0;
  border: 0;
  outline: 0;
  align-items: center;
  justify-content: center;
  background: white;
  border-radius: 50%;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.2);
  transition: all 0.4s ease;
  overflow: hidden;
  z-index: 102;
}
@media (width <= 768px) {
  .closeBtn {
    --top: 1em;
    --right: 1em;
  }
}
.closeBtn i {
  width: 100%;
  height: 100%;
  background: white;
  display: block;
  transition: all 0.4s ease;
  position: relative;
}
.closeBtn i:before, .closeBtn i:after {
  content: "";
  display: block;
  width: 2px;
  height: 50%;
  transition: all 0.1s ease-in-out;
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  margin: auto;
  z-index: 2;
  background: var(--body);
}
.closeBtn i:before {
  transform: rotate(45deg);
}
.closeBtn i:after {
  transform: rotate(-45deg);
}
.closeBtn:hover {
  box-shadow: 0 0 1em rgba(0, 0, 0, 0);
  border-radius: 0;
  background: var(--typo);
  border-color: var(--typo);
}
.closeBtn:hover:before, .closeBtn:hover:after {
  background: white;
}

.modalPane,
.overlay {
  transition: visibility 0s, opacity 0.2s, transform 0s;
  transition-delay: 0.8s, 0.4s, 0.9s;
}
.modalPane .scrollable,
.overlay .scrollable {
  clip-path: inset(0 0 round 0);
  transition: clip-path 0.6s cubic-bezier(0.6, 0, 0, 1);
  transition-delay: 0s;
}
.modalPane .scrollable .scrollInner,
.overlay .scrollable .scrollInner {
  transition: opacity 0.4s cubic-bezier(0.6, 0, 0, 1);
  transition-delay: 0s;
  opacity: 0;
}
.modalPane.visible,
.overlay.visible {
  visibility: visible;
  transition-delay: 0s, 0.1s, 0s;
  opacity: 1;
  transform: translate(0, 0);
}
.modalPane.visible .scrollable,
.overlay.visible .scrollable {
  transition-delay: 0.2s, 0s;
  clip-path: var(--modalClip);
}
.modalPane.visible .scrollable .scrollInner,
.overlay.visible .scrollable .scrollInner {
  transition: opacity 0.4s cubic-bezier(0.6, 0, 0, 1);
  transition-delay: 0.6s;
  opacity: 1;
}

.modalPane {
  overflow: hidden;
  content-visibility: auto;
  contain-intrinsic-size: 1000px;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 106;
  opacity: 0;
  transform: translate(100%, 0);
}
.modalPane:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  background-image: var(--typo);
  opacity: 0.95;
}
.modalPane .scrollable {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 100%;
  padding: 1em;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  background: white;
  position: relative;
  z-index: 1;
}
.modalPane .scrollable .scrollInner {
  justify-content: center;
  align-items: center;
}
@media (width >= 768px) {
  .modalPane .scrollable .scrollInner {
    width: calc(100% + var(--scrollBar));
    margin-right: calc(0% - var(--scrollBar));
    padding: calc(var(--navH) * 1) 0;
  }
}
@media (width <= 768px) {
  .modalPane .scrollable .scrollInner .inner {
    padding: calc(var(--pad) * 2) 0;
  }
}

.overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  content-visibility: auto;
  contain-intrinsic-size: 1000px;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 106;
  opacity: 0;
  transform: translate(100%, 0);
  background: var(--typo);
}
.overlay .scrollable {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  background: white;
  position: relative;
  z-index: 1;
  display: flex;
}
.overlay figure {
  z-index: 1;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.overlay figure img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.overlay #modalImg {
  position: relative;
  top: inherit;
  left: inherit;
  max-width: 90vw;
  max-height: 90vh;
}

html.modaled .layer {
  opacity: 1;
  visibility: visible;
}

.modalImg img {
  cursor: pointer;
  transition: transform 0.4s ease-in-out 0s, filter 0.6s ease-in-out 0.4s !important;
}
.modalImg:hover img {
  transform: scale(1.05);
}

.prevNext {
  --arrow: calc(var(--btnMenu) * .25);
  --borderWid: 2px;
  position: absolute;
  top: 0;
  border: none;
  width: 33%;
  height: 100%;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.4s ease;
  z-index: 1000;
  text-indent: -999em;
  display: flex;
  align-items: center;
}
@media (width >= 768px) {
  .prevNext {
    --arrowX: calc(0% - var(--arrow) * 2);
  }
}
@media (width <= 768px) {
  .prevNext {
    --arrowX: calc(0% - var(--arrow) * .75);
  }
}
.prevNext:before {
  content: "";
  display: block;
  width: var(--arrow);
  height: var(--arrow);
  border-top: var(--borderWid) solid;
  border-right: var(--borderWid) solid;
  flex-shrink: 0;
  transform-origin: center;
}
.prevNext.nextLink {
  right: var(--arrowX);
  justify-content: flex-end;
}
.prevNext.nextLink:before {
  transform: rotate(45deg);
}
.prevNext.prevLink {
  left: var(--arrowX);
  justify-content: flex-start;
}
.prevNext.prevLink:before {
  transform: rotate(-135deg);
}
.prevNext:hover {
  color: var(--typo);
  background: rgba(255, 255, 255, 0.1);
}

/*# sourceMappingURL=layout.css.map */