/* Scroll Animation */
@media (prefers-reduced-motion: no-preference) {
  section:has(
      :where([data-se*="-left"], [data-se*="-right"], [data-se="flip-Y"])
    ) {
    overflow: clip visible;
  }
  span[data-se] {
    display: inline-block;
  }
  .seActive [data-se]:not([data-se*="parallax"], [data-se^="clip-"]),
  .seActive[data-se]:not([data-se*="parallax"], [data-se^="clip-"]) {
    transition-duration: 0.6s;
  }
  [data-se="blur"] {
    filter: blur(20rem);
  }
  [data-se="radius"] {
    border-radius: 100%;
  }
  [data-se="clip-centerline"] {
    clip-path: inset(0 50%);
  }
  [data-se="clip-midline"] {
    clip-path: inset(50% 0);
  }
  [data-se="clip-right"] {
    clip-path: inset(0 100% 0 0);
  }
  [data-se="clip-left"] {
    clip-path: inset(0 0 0 100%);
  }
  [data-se="clip-down"] {
    clip-path: inset(0 0 100% 0);
  }
  [data-se*="flip-"] {
    backface-visibility: hidden;
  }
  [data-se="flip-up"] {
    transform: perspective(2500rem) rotateX(-100deg);
  }
  [data-se="flip-Y"] {
    opacity: 0;
  }
  [data-se="hidden-up"] {
    transform: translateY(30rem);
    clip-path: inset(0 0 100%);
  }
  [data-se="hidden-right"] {
    transform: translateX(-30rem);
    clip-path: inset(0 100% 0 0);
  }
  [data-se="hidden-left"] {
    transform: translateX(30rem);
    clip-path: inset(0 0 0 100%);
  }
  [data-se*="slide-"]:not(.seActive) {
    opacity: 0;
  }
  [data-se="slide-up"] {
    transform: translateY(40rem);
  }
  [data-se="slide-left"] {
    transform: translateX(40rem);
  }
  [data-se="slide-right"] {
    transform: translateX(-40rem);
  }
  [data-se="swaying-top"] {
    transform: perspective(400px) rotateX(90deg);
    transform-origin: top;
    backface-visibility: hidden;
  }
  .seActive[data-se="blur"] {
    filter: blur(0);
  }
  .seActive[data-se="radius"] {
    border-radius: 0;
  }
  .seActive[data-se*="clip-"] {
    clip-path: inset(0);
  }
  .seActive[data-se*="flip-"] {
    transform: perspective(2500rem) rotateX(0deg);
  }
  .seActive[data-se="flip-Y"] {
    animation: flip-Y 1s both;
  }
  .seActive[data-se*="hidden-"] {
    transform: translate(0);
    clip-path: inset(0);
  }
  .seActive[data-se*="slide-"] {
    transform: translate(0);
  }
  @keyframes flip-Y {
    0% {
      transform: perspective(400rem) rotateY(0deg);
      opacity: 0;
    }
    20% {
      transform: perspective(400rem) rotateY(-30deg);
    }
    50% {
      transform: perspective(400rem) rotateY(20deg);
    }
    75% {
      transform: perspective(400rem) rotateY(-10deg);
    }
    100% {
      transform: perspective(400rem) rotateY(0deg);
      opacity: 1;
    }
  }
  .seActive[data-se="swaying-top"] {
    animation: swaying-top 1s both;
  }
  @keyframes swaying-top {
    0% {
      transform: perspective(400px) rotateX(90deg);
    }
    20% {
      transform: perspective(400px) rotateX(-60deg);
    }
    40% {
      transform: perspective(400px) rotateX(20deg);
    }
    60% {
      transform: perspective(400px) rotateX(-10deg);
    }
    80% {
      transform: perspective(400px) rotateX(5deg);
    }
    100% {
      transform: perspective(400px) rotateX(0deg);
    }
  }
  .seActive [data-se-delay="50"],
  .seActive[data-se-delay="50"] {
    transition-delay: 0.05s;
  }
  .seActive [data-se-delay="100"],
  .seActive[data-se-delay="100"] {
    transition-delay: 0.1s;
  }
  .seActive [data-se-delay="150"],
  .seActive[data-se-delay="150"] {
    transition-delay: 0.15s;
  }
  .seActive [data-se-delay="200"],
  .seActive[data-se-delay="200"] {
    transition-delay: 0.2s;
  }
  .seActive [data-se-delay="250"],
  .seActive[data-se-delay="250"] {
    transition-delay: 0.25s;
  }
  .seActive [data-se-delay="300"],
  .seActive[data-se-delay="300"] {
    transition-delay: 0.3s;
  }
  .seActive [data-se-delay="350"],
  .seActive[data-se-delay="350"] {
    transition-delay: 0.35s;
  }
  .seActive [data-se-delay="400"],
  .seActive[data-se-delay="400"] {
    transition-delay: 0.4s;
  }
  .seActive [data-se-delay="450"],
  .seActive[data-se-delay="450"] {
    transition-delay: 0.45s;
  }
  .seActive [data-se-delay="500"],
  .seActive[data-se-delay="500"] {
    transition-delay: 0.5s;
  }
  .seActive [data-se-delay="600"],
  .seActive[data-se-delay="600"] {
    transition-delay: 0.6s;
  }
  .seActive [data-se-delay="700"],
  .seActive[data-se-delay="700"] {
    transition-delay: 0.7s;
  }
  @media (min-width: 768px) {
    [data-se] [data-se="clip-right"] {
      clip-path: inset(0 100% 0 0);
    }
    [data-se] [data-se="clip-left"] {
      clip-path: inset(0 0 0 100%);
    }
    [data-se] [data-se="clip-down"] {
      clip-path: inset(0 0 100% 0);
    }
    [data-se] [data-se="slide-up"] {
      transform: translateY(40rem);
      opacity: 0;
    }
    [data-se] [data-se="slide-left"] {
      transform: translateX(40rem);
      opacity: 0;
    }
    [data-se] [data-se="slide-right"] {
      transform: translateX(-40rem);
      opacity: 0;
    }
    .seActive[data-se] [data-se*="clip-"] {
      clip-path: inset(0);
    }
    .seActive[data-se] [data-se*="hidden-"] {
      transform: translate(0);
      clip-path: inset(0);
    }
    .seActive[data-se] [data-se*="flip-"] {
      transform: perspective(2500rem) rotateX(0deg);
    }
    .seActive[data-se] [data-se*="slide-"] {
      transform: translate(0);
      opacity: 1;
    }
    .seActive[data-se]:not([data-se-offset]) [data-se] {
      transform: translate(0);
      opacity: 1;
    }
    [data-se-column] [data-se].seActive {
      transition-delay: calc(var(--index) * calc(var(--delay) * 1ms));
      animation-delay: calc(var(--index) * calc(var(--delay) * 1ms));
    }
  }
  @media (min-width: 1280px) {
    .seActive[data-se^="clip-"] {
      transition-duration: 1s;
    }
    [data-se-column="2"] > *:nth-child(2n + 1) [data-se].seActive,
    [data-se-column="2"] [data-se].seActive:nth-child(2n + 1) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    [data-se-column="2"] > *:nth-child(2n + 2) [data-se].seActive,
    [data-se-column="2"] [data-se].seActive:nth-child(2n + 2) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    [data-se-column="2"] > *:nth-child(3n + 1) [data-se].seActive,
    [data-se-column="3"] [data-se].seActive:nth-child(3n + 1) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    [data-se-column="3"] > *:nth-child(3n + 2) [data-se].seActive,
    [data-se-column="3"] [data-se].seActive:nth-child(3n + 2) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    [data-se-column="3"] > *:nth-child(3n + 3) [data-se].seActive,
    [data-se-column="3"] [data-se].seActive:nth-child(3n + 3) {
      transition-delay: calc(2 * calc(var(--delay) * 1ms));
    }
    [data-se-column="4"] > *:nth-child(4n + 1) [data-se].seActive,
    [data-se-column="4"] [data-se].seActive:nth-child(4n + 1) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    [data-se-column="4"] > *:nth-child(4n + 2) [data-se].seActive,
    [data-se-column="4"] [data-se].seActive:nth-child(4n + 2) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    [data-se-column="4"] > *:nth-child(4n + 3) [data-se].seActive,
    [data-se-column="4"] [data-se].seActive:nth-child(4n + 3) {
      transition-delay: calc(2 * calc(var(--delay) * 1ms));
    }
    [data-se-column="4"] > *:nth-child(4n + 4) [data-se].seActive,
    [data-se-column="4"] [data-se].seActive:nth-child(4n + 4) {
      transition-delay: calc(3 * calc(var(--delay) * 1ms));
    }
    [data-se-column="5"] > *:nth-child(5n + 1) [data-se].seActive,
    [data-se-column="5"] [data-se].seActive:nth-child(5n + 1) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    [data-se-column="5"] > *:nth-child(5n + 2) [data-se].seActive,
    [data-se-column="5"] [data-se].seActive:nth-child(5n + 2) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    [data-se-column="5"] > *:nth-child(5n + 3) [data-se].seActive,
    [data-se-column="5"] [data-se].seActive:nth-child(5n + 3) {
      transition-delay: calc(2 * calc(var(--delay) * 1ms));
    }
    [data-se-column="5"] > *:nth-child(5n + 4) [data-se].seActive,
    [data-se-column="5"] [data-se].seActive:nth-child(5n + 4) {
      transition-delay: calc(3 * calc(var(--delay) * 1ms));
    }
    [data-se-column="5"] > *:nth-child(5n + 5) [data-se].seActive,
    [data-se-column="5"] [data-se].seActive:nth-child(5n + 5) {
      transition-delay: calc(4 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 1) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 1) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 2) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 2) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 3) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 3) {
      transition-delay: calc(2 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 4) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 4) {
      transition-delay: calc(3 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 5) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 5) {
      transition-delay: calc(4 * calc(var(--delay) * 1ms));
    }
    [data-se-column="6"] > *:nth-child(6n + 6) [data-se].seActive,
    [data-se-column="6"] [data-se].seActive:nth-child(6n + 6) {
      transition-delay: calc(5 * calc(var(--delay) * 1ms));
    }
  }
  @media (max-width: 1279px) {
    .seActive[data-se^="clip-"] {
      transition-duration: 0.6s;
    }
    [data-se-column] [data-se*="slide-"] {
      transform: translateY(40rem);
    }
    [data-se-column] [data-se*="slide-"].seActive {
      transform: translate(0);
    }
  }
  @media (max-width: 1279px) and (min-width: 768px) {
    /* :is([data-se-column="3"], [data-se-column="4"]) > [data-se].seActive:nth-child(odd){ transition-delay: 0s; }
		:is([data-se-column="3"], [data-se-column="4"]) > [data-se].seActive:nth-child(even){ transition-delay: calc(var(--delay) * 1ms); } */
    :is([data-se-column="5"], [data-se-column="6"])
      > [data-se].seActive:is(:nth-child(6n + 1), :nth-child(6n + 4)) {
      transition-delay: calc(0 * calc(var(--delay) * 1ms));
    }
    :is([data-se-column="5"], [data-se-column="6"])
      > [data-se].seActive:is(:nth-child(6n + 2), :nth-child(6n + 5)) {
      transition-delay: calc(1 * calc(var(--delay) * 1ms));
    }
    :is([data-se-column="5"], [data-se-column="6"])
      > [data-se].seActive:is(:nth-child(6n + 3), :nth-child(6n + 6)) {
      transition-delay: calc(2 * calc(var(--delay) * 1ms));
    }
  }
  @media (max-width: 767px) {
    /* #wrap [data-se-delay]{ transition-delay: 0s; } */
    [data-se-column] > *:nth-child(odd) {
      transition-delay: 0s;
    }
    [data-se-column] > *:nth-child(even) {
      transition-delay: calc(var(--delay) * 1ms);
    }
  }
  @keyframes svgAni {
    0% {
      stroke-dasharray: var(--totalLength);
      stroke-dashoffset: var(--totalLength);
    }
    100% {
      stroke-dasharray: var(--totalLength);
      stroke-dashoffset: 0;
    }
  }
  svg.se {
    opacity: 1;
    transform: translate(0);
  }
  svg.active {
    animation: svgAni 1s linear both;
  }

  /* stroke-dasharray 최대값 */
  /* svg *{ stroke-dasharray: var(--totalLength); stroke-dashoffset: var(--totalLength); opacity: 1; transform: translate(0); }
	svg.seActive *{ animation: svgAni 1s linear both; } */
}

/* decoration image from main.css */
.main {
  contain: content;
  position: relative;
  padding: var(--headerHeight) 0
    clamp(90rem, calc(135 / var(--inr) * 100vw), 135rem);
  background: var(--bg) url(/images/main/main-cloud.png) no-repeat 50% 100% /
    100% auto;
  text-align: center;
  min-height: calc(100dvh - 213.5px);
}
.main.reservation {
  position: relative;
}
.main__deco {
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: -7;
}
.d1 {
  top: 86.3%;
  left: 11.7%;
  aspect-ratio: 357/232;
  width: 357rem;
}
.d2 {
  top: 60.5%;
  left: 90.1%;
  aspect-ratio: 334/245;
  width: 334rem;
}
.d3 {
  top: 8.7%;
  left: 16.2%;
  aspect-ratio: 98/66;
  width: 98rem;
}
.d4 {
  transform: translateX(-50%);
  top: 0%;
  left: 75.5%;
  aspect-ratio: 101/52;
  width: 101rem;
}
.d5 {
  top: 33.8%;
  left: 8.5%;
  aspect-ratio: 126/126;
  width: 126rem;
}
.d6 {
  top: 21.2%;
  left: 89.4%;
  aspect-ratio: 83/69;
  width: 83rem;
}
.d7 {
  top: 52.4%;
  left: 38.6%;
  aspect-ratio: 198/32;
  width: 198rem;
}
.d8 {
  top: 95%;
  left: 28.3%;
  aspect-ratio: 164/158;
  width: 164rem;
}
.d9 {
  top: 91.5%;
  left: 90.3%;
  aspect-ratio: 249/115;
  width: 249rem;
}
.main__deco::before {
  content: "";
  position: absolute;
  inset: 0;
  background: no-repeat 50% / contain;
}
.d1::before {
  background-image: url("/images/main/main-deco1.png");
}
.d2::before {
  background-image: url("/images/main/main-deco2.png");
}
.d3::before {
  background-image: url("/images/main/main-deco3.png");
}
.d4::before {
  background-image: url("/images/main/main-deco4.png");
}
.d5::before {
  background-image: url("/images/main/main-deco5.png");
}
.d6::before {
  background-image: url("/images/main/main-deco6.png");
}
.d7::before {
  background-image: url("/images/main/main-deco7.png");
}
.d8::before {
  background-image: url("/images/main/main-deco8.png");
}
.d9::before {
  background-image: url("/images/main/main-deco9.png");
}

/* inner */
.wrapper {
  position: relative;
  margin: 0 auto;
  max-width: calc(var(--inr) * 1rem);
  width: calc(var(--inrWidth) * 100%);
}
.inr {
  position: relative;
  margin: 0 auto;
  max-width: calc(var(--inr) * 1rem);
  width: calc(var(--inrWidth) * 100%);
}
.inr-wide {
  max-width: calc(var(--inrWide) * 1rem);
}
.inr-narrow {
  max-width: calc(var(--inrNar) * 1rem);
}

/* header */
:root {
  --headerHeight: clamp(100rem, calc(134 / var(--inr) * 100vw), 134rem);
}
header {
  position: absolute;
  inset: 30rem 0 auto;
  z-index: 10;
}
.gnb {
  position: relative;
  display: flex;
  justify-content: center;
  gap: 30rem;
}
.gnb > li {
  position: relative;
  display: inline-block;
  height: 100%;
  pointer-events: auto;
}
.gnb [data-gnb="1"] {
  display: flex;
  align-items: center;
  gap: 7rem;
  height: 100%;
  padding: 3.5rem 1.09090909em 3.5rem 1em;
  background: #fff;
  border: 3rem solid var(--primary);
  border-radius: 5em;
  font-size: clamp(16rem, calc(22 / var(--inr) * 100vw), 22rem);
  font-weight: 700;
}
.gnb [data-gnb="1"]::before {
  content: "";
  display: inline-block;
  width: 1.04545455em;
  height: 0.90909091em;
  background: no-repeat 50% / auto 100%;
}
.gnb .about[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i1.png");
}
.gnb .board_notice[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i2.png");
}
/* header - add gnb link and login btn  */
.gnb .reservation[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i3.png");
}
.gnb .membership[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i4.png");
}
.gnb .mypage[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i6.png");
}
.gnb .login[data-gnb="1"]::before {
  background-image: url("/images/common/gnb-i5.png");
}
.gnb .login[data-gnb="1"] {
  background-color: #ee7249;
  color: white;
}
/* header>.inr>.login-btn {
	position: absolute; 
	right: 0; 
	top: 0px;
	background-color: #F0815C;
    color: white;
    border-radius: 28px;
    padding: 8px 28px;
    font-weight: 700;
    font-size: 22px;
}  */
@media (max-width: 540px) {
  :root {
    --headerHeight: clamp(240rem, calc(134 / var(--inr) * 100vw), 134rem);
  }
  .gnb {
    flex-wrap: wrap;
    gap: 14px;
  }
  .gnb [data-gnb="1"] {
    padding: 8px 14px;
  }
  .gnb > li > a {
    text-wrap: nowrap;
  }
  /* header>.inr>.login-btn {
        right: 30%;
        left: 30%;
        top: 100px;
        text-wrap: nowrap;
        font-size: 12px;
    } */
}

main.reservation .wrapper {
  padding-top: 20px;
}

/* footer */
footer {
  padding: 60rem 0 38rem;
  background: #333 url("/images/common/footer-bg.jpg");
  color: #ccc;
}
.footer__inr {
  display: grid;
  gap: 40rem clamp(50rem, calc(98 / var(--inr) * 100vw), 98rem);
}
.footer__logo {
  width: 120rem;
}
.footerProgram {
  margin-top: 21rem;
  color: #fff;
}
.footerProgram__p1 {
  font-size: 16rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.footerProgram__b {
  font-weight: 800;
  color: var(--secondary);
}
.footerProgram__p2 {
  margin: 3rem 0 0 1rem;
  font-size: 45rem;
  letter-spacing: 0.08em;
  color: var(--secondary);
}
.footer__address {
  display: flex;
  flex-wrap: wrap;
  gap: 5rem 31rem;
  font-size: 14rem;
  letter-spacing: -0.01em;
}
.footer__copyright {
  margin-top: 22rem;
  font-size: 12rem;
  font-weight: 300;
  color: #a6a6a6;
}
@media (min-width: 1280px) {
  .footer__inr {
    grid-template-columns: auto auto 1fr;
  }
  .footer__info {
    margin: 12rem 0 0 101rem;
  }
}
@media (max-width: 1279px) {
  .footer__inr {
    grid-template-columns: auto 1fr;
  }
  .footer__info {
    grid-column: 1 / 3;
  }
}

.main.user-info {
  min-height: calc(100dvh - 213.5px);
}


@media (min-width:768px) and (max-width: 1080px) {
  .gnb {flex-wrap: wrap;height: 50rem;} 
}
.gnb { flex-wrap: wrap; }
@media (max-width: 767px) {
  :root {
    --headerHeight: clamp(240rem, calc(134 / var(--inr) * 100vw), 134rem);
  }
  .gnb {
      flex-wrap: wrap;
      gap: 14px;
  }
  
}
