/* =================================================================
<2000-bandabi/current.css>
- 2000-bandabi 현재 스타일
- 순서 및 분류에 따라 그룹화
- SCSS 중첩 구조로 재작성
================================================================= */

@charset "UTF-8";

/* ========== 1. 전역 변수 ========== */
:root {
  /* Colors */
  --sp: 20px;
  --main2: #db471d;

  /* Layout */
}

@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/quicksand/v37/6xKtdSZaM9iE8KbpRA_hJFQNYuDyP7bh.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/quicksand/v37/6xKtdSZaM9iE8KbpRA_hJVQNYuDyP7bh.woff2) format('woff2');
  unicode-range:
    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
    U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/quicksand/v37/6xKtdSZaM9iE8KbpRA_hK1QNYuDyPw.woff2) format('woff2');
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Isamanru';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: 'Isamanru';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Isamanru';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicBold.woff') format('woff');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'AliceDigitalLearning';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_elice@1.0/EliceDigitalBaeum.woff2') format('woff2');
  font-weight: normal;
  font-display: swap;
}

@font-face {
  font-family: 'AliceDigitalLearning';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_elice@1.0/EliceDigitalBaeum-Bd.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}
body,
input,
textarea,
table,
button,
select,
optgroup,
option {
  letter-spacing: -0.05em;
  font-family: 'Quicksand', 'AliceDigitalLearning', sans-serif;
  line-height: 1.3;
}
h1,
h2 {
  letter-spacing: -0.07em;
}
.material-symbols-sharp {
  font-family: 'Material Symbols Rounded';
}

html,
body {
  margin: 0;
  padding: 0;
  letter-spacing: -0.05em;
}

.time-clock-set.time1 {
  margin-top: 10px;
  .time-clock {
    display: flex;
    flex-direction: column;
    .season {
      margin-top: 0.3em;
      .time {
        font-size: 1.3em;
        display: flex;
        gap: 5px;
      }

      display: grid;
      width: fit-content;
      column-gap: 2em;
      row-gap: 0.2em;
      grid-template-columns: 1fr 1fr 1fr;
    }
    @media (max-width: 812px) {
      > div {
        flex-direction: column;
        width: 100%;
        .infos {
          flex-direction: row;
          gap: 10px;
          h3 {
            font-size: 1.3em;
            width: 50px;
          }
        }
        .season {
          margin-top: 0;
          grid-template-columns: 1fr 1fr;
        }
      }
    }
  }
}
.gnb {
  transition: border-radius 0.3s;
  .menu .logo {
    font-family: 'AliceDigitalLearning';
    img {
      max-height: 30px;
    }
    &::after {
      content: '코리아풋볼파크 아레나';
      opacity: 0.8;
    }
  }

  .menu .menu-n {
    --menu-space: 40px;
  }
}

ul.notification {
  &.vertical {
    &.cell6 {
      --cell: 6;
    }
    --cell: 5;
    &.card {
      --cell: 4;
      & > li {
        .icon {
          font-size: 2.4em;
        }
        p {
          font-size: 0.9em;
        }
      }
    }
    &.progress {
      > li {
        .icon {
          font-size: 3em;
        }
        .noti-con {
          p {
            font-size: 0.95em;
          }
        }
      }
    }
  }
}
.visual,
.images {
  .text {
    /* 밝은 멀티 컬러 그라데이션 (어두운 배경 대비, 채도 업) */
    --main-gra: linear-gradient(135deg, #ff5fb1, #ffd54f, #5ad1ff, #b18dff);
    --main-gra-rev: linear-gradient(315deg, #ff5fb1, #ffd54f, #5ad1ff, #b18dff);
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-grow: 1;
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    padding: 2em 2em 4em;
    word-break: keep-all;
    color: var(--white);
    gap: 1em;
    position: absolute;
    z-index: 2;

    h2,
    h3 {
      letter-spacing: 0;

      line-height: 1.3;
    }
    h3 {
      font-size: 1.7em;
      font-weight: 800;
    }
    h2 {
      font-size: 3.8em;

      @media (max-width: 768px) {
        font-size: 3.2em;
        line-height: 1.2;
      }
    }
    p {
      color: #fff;
      opacity: 0.85;
      font-size: 1.2em;
      line-height: 1.4;
      @media (max-width: 768px) {
        font-size: 1em;
      }
    }
    .number {
      &,
      * {
        font-family: 'Cafe24SurroundAir';
      }
    }
  }
  .feat {
    gap: 3em;
    margin: 2em 0;
    padding: 0 10px;
    > li {
      --bg: linear-gradient(135deg, var(--bg-start), var(--bg-end));
    }
    p {
      font-size: 0.9em;
    }
    .icon {
      font-size: 2em;
      font-weight: 300;
      color: #fff;
      aspect-ratio: initial;
      &.circle {
        border-radius: 50%;
        display: grid;
        place-items: center;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
        background: var(--bg);
      }
    }
    .reserve-cta {
      margin-top: 10px;
      background: var(--bg-start);
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25);
    }
    .reserve-cta:hover {
      background: var(--bg-end);
    }
    .reserve-btn {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      text-decoration: none;
      color: #fff;
      flex-shrink: 0;
      transition: 0s;
    }
    .reserve-btn .icon {
      width: 100px;
      height: 100px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      color: #fff;
      background-image: linear-gradient(140deg, #ffffff30, var(--bg-start), var(--bg-end), #ffffff35);
      background-size: 260% 260%;
      animation:
        reserve-gradient 2.2s ease-in-out infinite,
        reserve-glow 2.2s ease-in-out infinite;
      box-shadow:
        0 14px 26px rgba(0, 0, 0, 0.35),
        inset 0 3px 8px rgba(255, 255, 255, 0.3),
        inset 0 -8px 12px rgba(0, 0, 0, 0.25);
      transform: translateY(0);
      transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
    }
    .reserve-btn .icon-glyph {
      font-size: 1.4em;
      line-height: 1;
    }
    .reserve-btn .reserve-text {
      font-size: 0.64em;
      font-weight: 700;
      letter-spacing: -0.01em;
    }
    .reserve-btn:focus-visible .icon,
    .reserve-btn:hover .icon {
      transform: translateY(-2px);
      box-shadow:
        0 18px 30px rgba(0, 0, 0, 0.4),
        inset 0 3px 8px rgba(255, 255, 255, 0.25),
        inset 0 -10px 14px rgba(0, 0, 0, 0.28);
    }
    .reserve-btn:active .icon {
      transform: translateY(1px);
      box-shadow:
        0 10px 18px rgba(0, 0, 0, 0.35),
        inset 0 2px 6px rgba(255, 255, 255, 0.18),
        inset 0 -6px 10px rgba(0, 0, 0, 0.25);
    }
    > li:nth-of-type(1) {
      --bg-start: #2b8ef7;
      --bg-end: #6ac8ff;
    }
    > li:nth-of-type(2) {
      --bg-start: #f16f5c;
      --bg-end: #f8b88b;
    }
    > li:nth-of-type(3) {
      --bg-start: #16a085;
      --bg-end: #7adfbe;
    }
    > li:nth-of-type(4) {
      --bg-start: #7b5dff;
      --bg-end: #bba7ff;
    }
    > li:nth-of-type(5) {
      --bg-start: #f6a623;
      --bg-end: #ffd479;
    }
    > li:nth-of-type(6) {
      --bg-start: #ff5f6d;
      --bg-end: #ffc371;
    }
    > li:nth-of-type(7) {
      --bg-start: #00b09b;
      --bg-end: #96c93d;
    }
    > li:nth-of-type(8) {
      --bg-start: #5f2c82;
      --bg-end: #49a09d;
    }
  }
}
.visual {
  text-align: center;
  padding-top: constant(safe-area-inset-top);
  padding-top: env(safe-area-inset-top);
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
  top: 0;
  left: 0;
  /* position: absolute; */
  /* height: 100%; */
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  padding-left: 0 !important;
  padding-right: 0 !important;
  flex-grow: 1;
  overflow: hidden;
  flex: 1;
  position: relative;
  height: auto;

  .video-player {
    animation: fade 2s ease-in-out;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-top: calc(constant(safe-area-inset-top) * -1);
    margin-top: calc(env(safe-area-inset-top) * -1);
    margin-bottom: calc(constant(safe-area-inset-bottom) * -1);
    margin-bottom: calc(env(safe-area-inset-bottom) * -1);
    flex-grow: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    pointer-events: none; /* 클릭 비활성화 */
    background: #000; /* 영상 로딩 전 배경 */
    .background-video {
      object-fit: cover;
      object-position: center;
      width: 100%;
      height: 100%;
    }
  }

  .sns {
    display: flex;
    justify-content: center;
    gap: 1.5em;
    padding: 2em 1em 1em;
    li {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: left;

      a {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: 0.2s;
        width: 60px;

        border-radius: 12px;
        img {
          display: block;
          width: 100%;
        }
        &:hover {
          transform: scale(1.08);
        }
        &.youtube {
          background-color: #fff;
          img {
            width: 70%;
          }
        }
      }
    }
  }
  .tel {
    p {
      font-size: 0.9rem;
    }
    .number {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      .material-symbols-rounded {
        font-family: 'material symbols rounded';
        font-size: 1.2em;
        font-weight: 400;
      }
    }
  }
}
.visual .links .btn.tertiary {
  --color: var(--green);
}
.open-time-wrap {
  height: var(--top-h);
}
.open-time {
  list-style: none;
  padding: 0 20px;
  font-size: 14px;
  display: flex;
  white-space: nowrap;
  gap: 2em;
  row-gap: 1em;
  flex-grow: 0;
  li {
    flex-grow: 0;
    h5 {
      font-family: 'Cafe24SurroundAir';
      margin: 0 0 4px;
      color: #fff;
      display: flex;
      font-size: 1.1em;
      align-items: center;
      gap: 6px;
      .material-symbols-rounded {
        font-size: 1.1em;
        font-weight: 400;
      }
    }

    .open-time-list {
      display: flex;
      gap: 1.5em;
      flex-wrap: wrap;
      row-gap: 5px;
      p {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 1em;
      }
      .open-clock {
        font-weight: 300;
        font-family: 'Cafe24SurroundAir';
      }
    }
  }
}

.contents {
  & .static {
    > .map-picker {
      border-radius: 0;
      margin-top: 120px;
      margin-bottom: -80px;
      @media (max-width: 812px) {
        margin-top: 30px;
        margin-bottom: -30px;
      }
    }
    & .irregular {
      --sp: 24px;
      .feat {
        flex-wrap: nowrap;
      }
      .floor-label {
        display: none;
      }
      &.straight.tri {
        > div {
          --gap: 5em;
          row-gap: 2em;
        }
        .head {
          padding: 2em 0;
          padding-left: 0;
          padding-right: 0;
        }
        .col {
          .img {
            mix-blend-mode: multiply;
            aspect-ratio: initial;
            border-radius: 0;
            margin-left: -20%;
            img {
              object-fit: contain;
              border-radius: 0;
            }
          }
        }
        > div.end {
          --col: 2;
          .col {
            margin-top: 0;
            &:nth-child(n + 2) {
              margin-top: 0;
            }
          }

          @media (min-width: 813px) {
            .col {
              .img {
                aspect-ratio: 16/9;
                overflow: hidden;
              }
            }
          }
        }
      }
      &.straight.tri {
        > div.quad {
          margin-top: 100px;
          --col: 4;
          --gap: 3em;
          align-items: flex-start;
          .img {
            mix-blend-mode: multiply;
          }
          .col:nth-child(1) {
            margin-top: 0;
          }
          .col:nth-child(2) {
            margin-top: -50px;
          }
          .col:nth-child(3) {
            margin-top: 50px;
          }
          .col:nth-child(4) {
            margin-top: -100px;
          }
          .head {
            h1 {
              font-size: 2em;
            }
            h2 {
              font-size: 1.25em;
            }
          }
          .feat {
            gap: 2em;
            li {
              min-width: 0;
            }
            p {
              font-size: 0.78em;
              white-space: normal;
            }
          }
        }
        @media (min-width: 813px) and (max-width: 1180px) {
          > div.quad {
            --col: 2;
            --gap: 3em;
            .col:nth-child(n) {
              margin-top: 0;
            }
            .col:nth-child(even) {
              margin-top: 50px;
            }
          }
        }
        @media (max-width: 812px) {
          > div.quad {
            --col: 1;
            --gap: 0;
            margin-top: 20px;
            .col:nth-child(n) {
              margin-top: 0;
            }
          }
        }
      }
      &.sub {
        > div {
          gap: 24px;
          .head {
            padding: 0;
          }
        }
      }
    }
  }
  .sect {
    &.facil {
      display: flex;
      flex-direction: column;
      gap: 120px;
      .feat {
        margin-top: 40px;
      }
      .list {
        flex-direction: column;
        gap: 6px;
        .infos {
          .info {
            flex-direction: row;
            gap: 10px;
          }
        }
      }
      .col {
        .head {
          padding: 2em 0;
        }
      }
      .img {
        border-radius: 20px;
        overflow: hidden;
        aspect-ratio: 24/9;
        overflow: hidden;
        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
      @media (max-width: 812px) {
        gap: 50px;
        .img {
          border-radius: 12px;
          aspect-ratio: 16/9;
          img {
          }
        }
      }
    }
  }
}
ul.demical {
  .table + & {
    margin-top: var(--padding);
  }
}
.ui-sect {
  .ui-item {
    &.prices {
      li {
        padding: 20px;
      }
    }
  }
}

.time-clock {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));

  .weekend {
    --main-light: var(--orange);
    --main: var(--red);
    --main: var(--red);
  }
}
.images * {
  transition: none !important;
}
@keyframes fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes reserve-gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes reserve-glow {
  0%,
  100% {
    filter: brightness(1) saturate(1.05);
  }
  50% {
    filter: brightness(0.93) saturate(1.2);
  }
}
.list.swim {
  .infos .info:has(.data-time) {
    > p {
      display: none;
    }
  }
}
.list {
  &.horizon {
    &.prices.program {
      & > li {
        .thumb {
          height: 100%;
          img {
            object-fit: cover;
            height: 100%;
          }
        }
      }
    }
  }
  &.vertical {
    &.prices {
      > li {
        .thumb {
        }
      }
    }
  }
}
.sect.notion:has(.fitness-feat) {
  padding: 20px;
  .head {
    padding: 10px 10px 30px;
  }
}
.fitness-blood-note {
  margin-top: 20px;
  background-color: var(--gray-pale);
  padding: 20px;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  ul {
    li {
      list-style: disc;
      list-style-position: inside;
      line-height: 1.4;
    }
  }
}
ul.notification.cell1 {
  --cell: 1;
}
.blood-pressure {
  width: 100%;
  --cell: 1;
}
.fitness-feat {
  gap: 24px 28px;
  align-items: flex-start;
  padding: var(--padding) 30px;
  background-color: var(--white);
  border-radius: 16px;
  & + & {
    margin-top: 20px;
  }
  li {
    width: calc(25% - 21px);
    min-width: 150px;
    align-items: center;
  }
  .sub-title {
    padding: 0;
    width: 100%;
    text-align: left;
    font-size: 1.3em;
  }
  .icon {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    color: var(--type2);

    .fitness-pictogram {
      display: block;
      width: 100%;
      height: 100%;
      flex: 0 0 auto;
      object-fit: contain;
      object-position: center;
    }
  }

  .noti-con {
    width: 100%;

    h4 {
      margin-bottom: 6px;
    }

    .fitness-category {
      display: block;
      margin-bottom: 4px;
      color: var(--main);
      font-weight: 700;
      letter-spacing: -0.03em;
    }

    p {
      max-width: none;
    }
  }

  p {
    max-width: 180px;
    line-height: 1.45;
    font-size: initial;
    color: var(--gray-mid);
  }
}
@media (max-width: 812px) {
  body,
  html {
    padding: 0;
  }
  :root {
    --padding: 20px;
  }
  body:has(.main) {
    overflow: hidden;
    /* 모든 축에서 바운스 및 새로고침 방지 */
    -webkit-overflow-scrolling: auto; /* iOS Safari 탄성 스크롤 비활성화 */
  }
  .visual {
    height: 100dvh; /* 최신 브라우저 */
    height: -webkit-fill-available; /* iOS Safari */
    min-height: 0; /* min-height 충돌 방지 */
    overflow: hidden;
    flex: 1;

    .feat {
      gap: 0;
      row-gap: 2em;
      &:not(.open) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1em;
        width: 100%;
      }
      &:not(.open) li:nth-child(1),
      &:not(.open) li:nth-child(2) {
        grid-column: span 1;
      }
      li {
        width: auto;
        h4 {
          font-size: 14px;
        }
      }
    }
  }
  .gnb {
    & .menu {
      & > li.logo {
        img {
          max-height: 24px;
        }
      }
    }
  }
  .main {
    padding: 0;
    position: relative;
    width: 100%;
    height: 100%;
    .gnb {
      &.active {
        .coll {
          color: initial;
          background-color: transparent;
        }
      }
      .member-menu.gnb-member-before-coll {
        color: #fff;
      }
    }

    .footer {
      font-size: 0.9em;
      padding: var(--padding);
      padding-bottom: 20px;
      .sns {
        > li a:hover {
          color: #fff;
        }
      }
    }
    .gnb .menu .logo img {
      max-height: 30px;
    }
  }
  .construct {
    .gnb {
      .menu {
        .right-menu {
          display: block;
          width: auto;
          background-color: transparent;
          flex-grow: 0;
          .announce {
            p {
              font-size: 12px;
            }
          }
        }
      }
    }

    .visual {
      align-content: baseline;
      .text {
        z-index: 1;
      }
    }

    .visual,
    .images {
      .mask {
        height: 70vw;
      }
      .text {
        padding-top: calc(20px + var(--top-h));
        padding-bottom: 90px;
        overflow-y: auto;
        align-content: baseline;
        justify-content: flex-start;
        flex-grow: 0;
        height: 100%;
        h2 {
          font-size: 3em;
          .gradient-text {
            font-size: inherit;
          }
        }
        h3 {
          span.sm {
            display: block;
            font-size: 1rem;
          }
        }
        .head {
          margin-top: 10px;
          h3 {
            padding: 10px 20px;
            font-size: 1rem;
          }
        }
        .feat {
          padding-left: 24px;
          padding-right: 24px;
          grid-template-columns: repeat(6, minmax(0, 1fr));
          width: 100%;
          gap: 1em;
          row-gap: 10px;
          margin-top: 10px;
          & > li {
            grid-column: span 2;
            margin-top: 1em;
          }
          & > li:nth-child(1),
          & > li:nth-child(2) {
            grid-column: span 3;
            margin-top: 0;
            height: 35vh;
            .info {
              height: 100%;
              display: flex;
              flex-direction: column;
              justify-content: flex-end;
            }
          }
          li.unable {
            .icon {
              font-size: 2.4em;
            }
          }
          > li:not(.unable) {
            padding: 0;

            h4 {
              font-size: 18px;
              margin-bottom: 10px;
            }
            .icon {
              font-size: 2em;
            }
            .info {
              padding: 20px;
              & .ul {
                gap: 5px;
                > li {
                  font-size: 16px;

                  flex-wrap: wrap;
                  justify-content: center;
                }
              }
            }
            .reserve-btn {
              font-size: 0.8em;
              margin-right: -20px;
            }
            .sub & {
              text-align: center;
              .info {
                p {
                  text-align: center;
                }
              }
            }
          }
        }
      }
    }
    .images {
      .main & {
        --img-h: 100vh;
        height: 100%;
        .swiper-wrapper {
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          z-index: 1;
          .swiper-slide {
            position: relative;
            max-height: initial;
            height: calc(100% - 20px);
          }
        }
      }

      .text {
        z-index: 3;
        flex-direction: column;
        padding: var(--padding);
        position: relative;
        transform: none;
        left: 0;
        top: 0;
        height: 100%;
        font-size: 1em;
        .sub & {
          position: absolute;
          align-items: center;
          justify-content: center;
        }
        .sub-text {
          text-align: center;
          align-items: center;
          width: 100%;
          .head {
            margin: 10px;
            h3 {
              margin: auto;
              border: 1px solid rgba(255, 255, 255, 0.1);
            }
          }
        }
        .feat {
          padding: 0;
        }
      }

      .swiper-pagination {
        z-index: 1;
      }
    }
    .footer {
      padding-left: 20px;
      padding-right: 20px;
      font-size: 10px;
    }
  }
  .list.vertical {
    &.program > li {
      --cell: 2;
      .thumb {
        --ratio: 4/3;
      }
    }
  }
  .contents {
    & .static {
      & .irregular {
        & > div {
          &:nth-child(even),
          &:nth-child(odd) {
            .col {
              padding: 0 var(--sp);
              .head,
              .img {
                padding-left: 0;
                padding-right: 0;
              }
              .img {
                aspect-ratio: 1/0.81 !important;
                overflow: hidden;
                img {
                  object-fit: cover !important;
                  object-position: left center;
                }
              }
            }
          }
        }
      }
    }
  }
  .static .sect {
    & .head.copy {
      & h4 {
        font-size: 1.15em;
        br {
          display: block;
          line-height: 1.4;
        }
      }
    }
  }
}

@media (max-width: 812px) {
  .fitness-feat {
    gap: 20px 12px;
    padding: 20px 0;
    .sub-title {
      padding: 0 20px;
    }
    li {
      width: calc(50% - 6px);
      min-width: 0;
      .icon {
        width: 72px;
        height: 72px;
      }
    }
  }
}

.calendar.oneday .pignose-calendar {
  .element {
    .district {
      .ctg-name {
        color: var(--map-color);
        &::after {
          display: block;
        }
      }
      .schedule-wrapper:only-of-type {
        .title {
          display: none;
        }
      }
    }
  }
}
.ui-item {
  &.prices {
    display: flex;
    flex-direction: row;
    @media (max-width: 812px) {
      flex-direction: column;
    }
    & li {
      & .item-name {
        & .price-multi {
          > h5 {
            width: 100%;
          }
          & .price {
            > p {
              font-size: 1.1em;
            }
          }
          & + & {
            margin-top: 24px;
          }
        }
      }
    }
  }
  .images .text {
    padding-bottom: 0;
  }
}
.reservation {
  .shop-info {
    display: none;
  }
}
.list.horizon {
  &.prices.program {
    @media (max-width: 812px) {
      & li {
        & .go-btn {
          .now:not(.soldout) & {
            &::before {
              content: '등록접수';
            }
          }
        }
      }
    }
  }
}
/* pc전용 */
@media (min-width: 813px) {
  /* GNB 메뉴에 마우스 호버 시 배경 스타일 적용 */
  .gnb:has(.menu-n li:hover) {
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
    .character {
      opacity: 1;
    }
  }
}

@media (max-width: 812px) {
  body:has(.wrap.main.type2) {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .wrap.main.type2 {
    height: auto;

    .visual {
      height: var(--h);
      min-height: 60vh;
      overflow: hidden;
      padding-top: var(--top-h) !important;

      .text {
        padding: 40px 0;

        > h2 {
          font-size: 2.2em;

          .gradient-text {
            font-size: 1.05em;
          }
        }
      }
      .links {
        gap: 0;

        max-width: 100%;

        &.circle .btn {
          width: 88px;
          height: 88px;
          font-size: 0.9em;
          border-radius: 0;
        }
      }
    }
  }
}