@charset "UTF-8";

/* scss 버튼 */
.btn {
  cursor: pointer;
  font-family: "Pretendard", sans-serif;
}

.btn-wrap {
  cursor: pointer;
}

.btn-wrap .btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

/* scss 버튼 */
/* scss 해더 */
header {
  position: relative;
  z-index: 1001;
}

header .layout {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 10rem;
  transition: max-width 0.3s;
}

header .layout.ani-open {
  max-width: 100vw;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(1):last-of-type)::before {
  height: 17rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(1):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 4rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(2):last-of-type)::before {
  height: 21rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(2):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 8rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(3):last-of-type)::before {
  height: 25rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(3):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 12rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(4):last-of-type)::before {
  height: 29rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(4):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 16rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(5):last-of-type)::before {
  height: 33rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(5):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 20rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(6):last-of-type)::before {
  height: 37rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(6):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 24rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(7):last-of-type)::before {
  height: 41rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(7):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 28rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(8):last-of-type)::before {
  height: 45rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(8):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 32rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(9):last-of-type)::before {
  height: 49rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(9):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 36rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(10):last-of-type)::before {
  height: 53rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(10):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 40rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(11):last-of-type)::before {
  height: 57rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(11):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 44rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(12):last-of-type)::before {
  height: 61rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(12):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 48rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(13):last-of-type)::before {
  height: 65rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(13):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 52rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(14):last-of-type)::before {
  height: 69rem;
}

header .layout.ani-open:has([data-level="2"] > .menu-plate:nth-of-type(14):last-of-type) [data-level="2"]>.menu-plate::before {
  height: 56rem;
}

header .layout.ani-open::after {
  height: 1px;
}

header .layout.ani-open>nav.nav {
  max-width: calc(100% - 625px);
}

@media only screen and (max-width: 1660px) {
  header .layout.ani-open>nav.nav {
    max-width: calc(100% - 545px);
  }
}

header .layout.ani-open .logo-wrap {
  left: 4rem;
}

header .layout.ani-open .menu {
  padding: 0 1rem;
}

header .layout.ani-open .menu-list[data-level="1"] {
  gap: 0rem;
}

header .layout.ani-open .menu-list[data-level="1"]>.menu-plate {
  flex: 1;
}

header .layout.ani-open .more-menu {
  right: 2.2rem;
}

header .layout::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  display: block;
  width: 100vw;
  height: 0;
  background-color: #fff;
  transition: height 0.6s;
  z-index: -1;
}

header .layout::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 10rem;
  display: block;
  width: 100vw;
  height: 0px;
  background-color: rgba(34, 34, 34, 0.2);
  overflow: hidden;
  transition: height 0.3s;
  z-index: 0;
}

header .layout>nav.nav {
  flex: 1;
  max-width: calc(100% - 785px);
  transition: max-width 0.3s;
}

@media only screen and (max-width: 1660px) {
  header .layout>nav.nav {
    max-width: calc(100% - 625px);
  }
}

@media only screen and (max-width: 1280px) {
  header .layout>nav.nav {
    display: none;
  }
}

header .logo {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  height: 100%;
  font-family: "NanumMyeongjo", "GyeonggiBatang", sans-serif;
  font-weight: 800;
  font-size: 25px;
  letter-spacing: -2.5px;
  color: #707070;
}

header .logo img {
  max-width: 200px;
  max-height: 50px;
  width: auto;
  height: auto;
}

header .logo .txt {
  margin-top: 1rem;
}

header .logo-wrap {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  height: 100%;
  transition: left 0.3s;
}

header .more-menu {
  position: absolute;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  transition: right 0.3s;
}

@media only screen and (max-width: 530px) {
  header .more-menu .btn-wrap:not(.btn-fullmenu-wrap) {
    display: none;
  }
}

header .more-menu .btn-fullmenu-wrap {
  margin-left: 0.5rem;
}

header .menu {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3.6rem;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 0.54px;
  color: #333;
  pointer-events: all;
}

header .menu .txt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

header .menu-list[data-level="1"] {
  align-items: flex-start;
  justify-content: center;
  gap: 3rem;
  width: 100%;
  transition: gap 0.6s;
  pointer-events: none;
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(1):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 1);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(1):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(2):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 2);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(2):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(3):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 3);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(3):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(4):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 4);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(4):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(5):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 5);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(5):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(6):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 6);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(6):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(7):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 7);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(7):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(8):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 8);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(8):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(9):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 9);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(9):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(10):last-of-type)>.menu-plate .menu {
  max-width: calc((100% - 785px) / 10);
  max-width: 100%;
}

@media only screen and (max-width: 1660px) {
  header .menu-list[data-level="1"].ani-open:has(> li:nth-of-type(10):last-of-type)>.menu-plate .menu {
    max-width: 100%;
  }
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(1):last-of-type) .menu-list {
  height: 3.6rem;
  max-height: 3.6rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(1):last-of-type) .menu-list::before {
  height: 4.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(2):last-of-type) .menu-list {
  height: 7.2rem;
  max-height: 7.2rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(2):last-of-type) .menu-list::before {
  height: 8.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(3):last-of-type) .menu-list {
  height: 10.8rem;
  max-height: 10.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(3):last-of-type) .menu-list::before {
  height: 12rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(4):last-of-type) .menu-list {
  height: 14.4rem;
  max-height: 14.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(4):last-of-type) .menu-list::before {
  height: 15.6rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(5):last-of-type) .menu-list {
  height: 18rem;
  max-height: 18rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(5):last-of-type) .menu-list::before {
  height: 19.2rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(6):last-of-type) .menu-list {
  height: 21.6rem;
  max-height: 21.6rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(6):last-of-type) .menu-list::before {
  height: 22.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(7):last-of-type) .menu-list {
  height: 25.2rem;
  max-height: 25.2rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(7):last-of-type) .menu-list::before {
  height: 26.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(8):last-of-type) .menu-list {
  height: 28.8rem;
  max-height: 28.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(8):last-of-type) .menu-list::before {
  height: 30rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(9):last-of-type) .menu-list {
  height: 32.4rem;
  max-height: 32.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(9):last-of-type) .menu-list::before {
  height: 33.6rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(10):last-of-type) .menu-list {
  height: 36rem;
  max-height: 36rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(10):last-of-type) .menu-list::before {
  height: 37.2rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(11):last-of-type) .menu-list {
  height: 39.6rem;
  max-height: 39.6rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(11):last-of-type) .menu-list::before {
  height: 40.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(12):last-of-type) .menu-list {
  height: 43.2rem;
  max-height: 43.2rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(12):last-of-type) .menu-list::before {
  height: 44.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(13):last-of-type) .menu-list {
  height: 46.8rem;
  max-height: 46.8rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(13):last-of-type) .menu-list::before {
  height: 48rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(14):last-of-type) .menu-list {
  height: 50.4rem;
  max-height: 50.4rem;
}

header .menu-list[data-level="1"].ani-open:has([data-level="2"] > li:nth-of-type(14):last-of-type) .menu-list::before {
  height: 51.6rem;
}

header .menu-list[data-level="1"].ani-open>.menu-plate:hover>.menu-wrap>.menu::before {
  width: 100%;
}

header .menu-list[data-level="1"].ani-open>.menu-plate>.menu-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

header .menu-list[data-level="1"].ani-open>.menu-plate>.menu-wrap>.menu {
  flex: 0 0 auto;
  overflow: hidden;
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(1):last-of-type)>.menu-plate {
  max-width: calc(100% / 1);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(2):last-of-type)>.menu-plate {
  max-width: calc(100% / 2);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(3):last-of-type)>.menu-plate {
  max-width: calc(100% / 3);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(4):last-of-type)>.menu-plate {
  max-width: calc(100% / 4);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(5):last-of-type)>.menu-plate {
  max-width: calc(100% / 5);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(6):last-of-type)>.menu-plate {
  max-width: calc(100% / 6);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(7):last-of-type)>.menu-plate {
  max-width: calc(100% / 7);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(8):last-of-type)>.menu-plate {
  max-width: calc(100% / 8);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(9):last-of-type)>.menu-plate {
  max-width: calc(100% / 9);
}

header .menu-list[data-level="1"]:has(> li:nth-of-type(10):last-of-type)>.menu-plate {
  max-width: calc(100% / 10);
}

header .menu-list[data-level="1"]>.menu-plate {
  flex: 0 0 auto;
  min-width: 0;
  transition: flex-grow 0.3s, flex-basis 0.3s;
}

header .menu-list[data-level="1"]>.menu-plate>.menu-wrap {
  height: 10rem;
}

header .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu {
  height: 100%;
  font-weight: 700;
}

header .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, -50%);
  display: block;
  width: 0%;
  height: 3px;
  background-color: #E5002B;
  transition: width 0.3s;
}

header .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu .txt {
  position: relative;
}

header .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu .icon {
  display: none;
}

header .menu-list[data-level="1"] .menu-list {
  display: none;
}

header .menu-list[data-level="1"] .menu-list[data-level="2"] {
  flex: 0 0 auto;
  position: absolute;
  left: 50%;
  top: calc(100% + 3rem);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s, flex-grow 0.3s, flex-basis 0.3s;
}

header .menu-list[data-level="1"] .menu-list[data-level="2"]::before {
  content: "";
  position: absolute;
  right: 0;
  top: 0rem;
  display: block;
  width: 1px;
  height: 0;
  background-color: #E8E8E8;
  transition: height 0.3s;
}

header .menu-wrap {
  text-align: center;
}

/* //scss 해더 */
/* nav 공통 */
.menu {
  position: relative;
}

.menu-wrap {
  position: relative;
}

.menu-list {
  position: relative;
  display: flex;
}

/* //nav 공통 */
/* scss 모달 공통 */
.modal {
  position: relative;
  background: transparent;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  pointer-events: all;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 99;
}

.modal.close {
  opacity: 0;
}

.modal .btn-wrap:has(.btn-close) {
  position: absolute;
  right: 0;
  bottom: -40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  width: 78px;
  aspect-ratio: 1/1;
  z-index: 99;
}

@media only screen and (max-width: 767px) {
  .modal .btn-wrap:has(.btn-close) {
    width: 40px;
    right: 27px;
    bottom: 5px;
    bottom: -7px;
    background-color: transparent;
  }
}

@media only screen and (max-height: 425px) {
  .modal .btn-wrap:has(.btn-close) {
    width: 50px;
  }
}

.modal .btn-close {
  position: relative;
  width: 100%;
  height: 100%;
}

.modal .btn-close .icon {
  width: 28px;
  aspect-ratio: 1/1;
}

@media only screen and (max-width: 767px) {
  .modal .btn-close .icon {
    width: 24px;
    width: 18px;
  }
}

@media only screen and (max-height: 425px) {
  .modal .btn-close .icon {
    width: 24px;
    width: 18px;
  }
}

.modal .btn-close .icon img {
  width: 100%;
  aspect-ratio: 1/1;
}

.modal .btn-close .txt {
  display: none;
}

.modal .layout {
  flex-direction: column;
  padding-bottom: 30px;
}

.modal-wrap {
  position: fixed;
  left: 0;
  top: 0;
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  z-index: 1010;
  transition: all 0.3s;
  overflow: hidden;
}

@media only screen and (max-width: 1280px) {
  .modal-wrap {
    overflow: auto;
  }
}

.modal-wrap::before {
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: #000000B3;
  transition: all 0.3s;
  pointer-events: none;
}

.modal-wrap.move-to-up {
  left: 0;
  top: calc(var(--vh, 1vh) * 100);
}

.modal-wrap.move-to-up.active {
  top: 0;
}

.modal-wrap.move-to-right {
  left: -110dvw;
  top: 0;
  opacity: 0;
}

.modal-wrap.move-to-right.active {
  left: 0;
  opacity: 1;
}

.modal-wrap.active::before {
  opacity: 1;
}

.modal-top {
  position: relative;
  z-index: 99;
}

.modal-controller {
  position: relative;
}

@media only screen and (max-width: 767px) {
  .modal-controller {
    margin-bottom: 10px;
  }
}

.modal-main {
  flex: 1;
  width: 100%;
  height: 0;
  position: relative;
}

.modal-bottom {
  position: relative;
}

.modal-layout {
  position: relative;
  display: flex;
  flex-direction: column;
  max-width: 1400px;
  overflow-y: auto;
  scrollbar-color: transparent transparent;
  scrollbar-width: none;
}

.modal-layout::-webkit-scrollbar {
  display: none;
}

@media only screen and (max-width: 1660px) {
  .modal-layout {
    max-width: 100%;
  }
}

.modal-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
  padding: 4px 30px 0;
  font-size: 20px;
  line-height: 1;
  word-break: keep-all;
}

@media only screen and (max-width: 1280px) {
  .modal-tab {
    height: 48px;
    padding: 0 14px;
    font-size: 18px;
  }
}

@media only screen and (max-width: 767px) {
  .modal-tab {
    height: 40px;
    padding: 0 22px;
    font-size: 16px;
    font-weight: 700;
  }
}

@media only screen and (max-width: 425px) {
  .modal-tab {
    height: 32px;
    padding: 0 14px;
    padding: 1px 16px 0 14px;
    font-weight: 700;
    font-size: 14px;
  }
}

@media only screen and (max-height: 767px) {
  .modal-tab {
    height: 40px;
    padding: 0 22px;
    font-size: 16px;
    font-weight: 700;
  }
}

@media only screen and (max-height: 767px) and (max-width: 425px) {
  .modal-tab {
    height: 32px;
    padding: 0 14px;
    padding: 1px 16px 0 14px;
    font-weight: 700;
    font-size: 14px;
  }
}

.modal-tabs {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media only screen and (max-width: 767px) {
  .modal-tabs {
    gap: 5px;
  }
}

.modal-tab-wrap {
  border-radius: 800px;
  border: 2px solid #333333;
  color: #333333;
  transition: all 0.3s;
}

.modal-tab-wrap.active {
  color: #fff;
}

.modal-tab-wrap.active .modal-tab {
  color: #fff;
}

/* //scss 모달 공통 */
/* scss 메뉴창 */
.modal-menu {
  display: grid;
  grid-template-columns: 1fr 80px;
  grid-template-rows: 90px auto;
  background-color: #fff;
}

.modal-menu .btn-wrap:has(.btn-close) {
  position: sticky;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  border-radius: unset;
}

.modal-menu .btn-close {
  width: 40px;
  height: 40px;
}

.modal-menu .btn-close .icon {
  width: 100%;
  height: 100%;
}

.modal-menu .btn-close img {
  width: 100%;
  height: 100%;
}

.modal-menu .modal-top {
  grid-column: 1/3;
  grid-row: 1/2;
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-bottom: 1px solid rgba(34, 34, 34, 0.1);
  z-index: 1;
}

.modal-menu .modal-side {
  grid-column: 2/3;
  grid-row: 1/3;
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  background-color: #004A9C;
  z-index: 2;
}

.modal-menu .modal-side .btns-wrap {
  padding-bottom: 25px;
}

.modal-menu .modal-side .btns-wrap .btn {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.modal-menu .modal-side .btns-wrap .btn .txt {
  font-weight: 600;
  font-size: 15px;
  color: #fff;
}

.modal-menu .modal-side .btns-wrap .btn .icon:last-child {
  display: none;
}

.modal-menu .modal-side .btns-wrap .btns {
  display: flex;
  flex-direction: column;
  gap: 36px;
}

.modal-menu .modal-side .btns-wrap .btn-wrap+.btn-wrap {
  position: relative;
}

.modal-menu .modal-side .btns-wrap .btn-wrap+.btn-wrap::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -15px;
  display: block;
  width: 80%;
  height: 1px;
  background-color: #ffffff30;
}

.modal-menu .modal-main {
  grid-column: 1/2;
  grid-row: 2/3;
  width: 100%;
  height: 100%;
  padding: 60px 135px 165px;
  overflow-y: auto;
}

@media only screen and (max-width: 1280px) {
  .modal-menu .modal-main {
    padding: 60px 80px 165px;
  }
}

@media only screen and (max-width: 767px) {
  .modal-menu .modal-main {
    padding: 30px 30px 165px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .modal-main {
    padding: 0;
  }
}

.modal-menu .menu {
  word-break: keep-all;
}

.modal-menu .menu-list {
  width: 100%;
  overflow: hidden;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list {
    flex-direction: column;
  }
}

.modal-menu .menu-list[data-level] {
  flex-direction: column;
  gap: 15px;
}

.modal-menu .menu-list[data-level="1"] {
  flex-direction: column;
  gap: 0px;
}

.modal-menu .menu-list[data-level="1"]>.menu-plate {
  position: relative;
}

.modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child) {
  padding-top: 109px;
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child) {
    padding-top: 71px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child) {
    padding-top: 0;
  }
}

.modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child)::before {
  content: "";
  position: absolute;
  left: 0;
  top: 55px;
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(34, 34, 34, 0.1);
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child)::before {
    top: 36px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate:not(:first-child)::before {
    display: none;
  }
}

.modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap {
  display: grid;
  grid-template-columns: minmax(auto, 380px) 1fr;
  transition: grid-template-rows 0.3s;
}

@media only screen and (max-width: 1280px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap {
    grid-template-columns: 1fr;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap {
    cursor: pointer;
    grid-template-rows: auto 0fr;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap:has(.menu-list[data-isopen=true]) {
    grid-template-rows: auto 1fr;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap:has(.menu-list[data-isopen=true])>.menu {
    border-bottom: 1px solid #004A9C;
  }
}

.modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap:has(.menu-list[data-isopen=true])>.menu .icon {
  transform: rotate(180deg);
}

.modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap:has(.menu-list[data-isopen=true])>.menu .icon img {
  filter: invert(21%) sepia(23%) saturate(6869%) hue-rotate(199deg) brightness(95%) contrast(103%);
}

.modal-menu .menu-list[data-level="2"] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 50px 10px;
}

@media only screen and (max-width: 1660px) {
  .modal-menu .menu-list[data-level="2"] {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media only screen and (max-width: 1280px) {
  .modal-menu .menu-list[data-level="2"] {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media only screen and (max-width: 662px) {
  .modal-menu .menu-list[data-level="2"] {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="2"] {
    grid-template-columns: repeat(1, 1fr);
    gap: 0px;
    background-color: #F8F8F8;
    padding-left: 30px;
  }
}

.modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap {
  flex-direction: column;
}

@media only screen and (max-width: 1280px) {
  .modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap {
    gap: 20px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap {
    flex-direction: row;
    gap: 5px;
    justify-content: flex-start;
    align-items: flex-start;
    border-bottom: 1px solid rgba(34, 34, 34, 0.1);
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap>.menu {
    border-bottom: unset;
  }
}

.modal-menu .menu-list[data-level="1"]>.menu-plate.current>.menu-wrap>.menu::before {
  position: relative;
}

.modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu {
  width: fit-content;
  height: fit-content;
  font-weight: 600;
  font-size: 35px;
  letter-spacing: -1.05px;
  color: #004A9C;
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu {
    font-size: 25px;
    letter-spacing: -0.75px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="1"]>.menu-plate>.menu-wrap>.menu {
    pointer-events: none;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 74px;
    font-size: 20px;
    letter-spacing: 0.6px;
    padding: 25px 30px;
  }
}

.modal-menu .menu-list[data-level="2"]>.menu-plate.current>.menu-wrap>.menu {
  color: #E5002B;
}

.modal-menu .menu-list[data-level="2"]>.menu-plate.current>.menu-wrap>.menu::before {
  position: relative;
}

.modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap>.menu {
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.66px;
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap>.menu {
    font-size: 20px;
    letter-spacing: -0.6px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="2"]>.menu-plate>.menu-wrap>.menu {
    flex: 0 0 95px;
    font-size: 18px;
    letter-spacing: -0.54px;
    padding: 12px 0;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="3"]>.menu-plate:last-of-type>.menu-wrap>.menu {
    border-bottom: unset;
  }
}

.modal-menu .menu-list[data-level="3"]>.menu-plate.current>.menu-wrap>.menu {
  gap: 0;
}

.modal-menu .menu-list[data-level="3"]>.menu-plate.current>.menu-wrap>.menu::before {
  position: relative;
  content: "·";
  position: absolute;
  left: 0;
  top: 0px;
  display: inline;
  font-size: 37px;
  line-height: 23.8px;
  color: #E5002B;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="3"]>.menu-plate.current>.menu-wrap>.menu::before {
    top: 8.4px;
  }
}

.modal-menu .menu-list[data-level="3"]>.menu-plate.current>.menu-wrap>.menu .txt {
  text-indent: 10px;
}

.modal-menu .menu-list[data-level="3"]>.menu-plate>.menu-wrap>.menu {
  font-size: 18px;
  letter-spacing: -0.54px;
  color: #333333;
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="3"]>.menu-plate>.menu-wrap>.menu {
    font-size: 17px;
    letter-spacing: -0.51px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="3"]>.menu-plate>.menu-wrap>.menu {
    width: 100%;
    padding: 12px 5px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="4"]>.menu-plate:last-of-type>.menu-wrap>.menu {
    border-bottom: unset;
  }
}

.modal-menu .menu-list[data-level="4"]>.menu-plate.current>.menu-wrap>.menu {
  gap: 0;
}

.modal-menu .menu-list[data-level="4"]>.menu-plate.current>.menu-wrap>.menu::before {
  position: relative;
  content: "·";
  position: absolute;
  left: 0;
  top: 0px;
  display: inline;
  font-size: 37px;
  line-height: 23.8px;
  color: #E5002B;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="4"]>.menu-plate.current>.menu-wrap>.menu::before {
    top: 8.4px;
  }
}

.modal-menu .menu-list[data-level="4"]>.menu-plate.current>.menu-wrap>.menu .txt {
  text-indent: 10px;
}

.modal-menu .menu-list[data-level="4"]>.menu-plate>.menu-wrap>.menu {
  font-size: 18px;
  letter-spacing: -0.54px;
  color: #333333;
}

@media only screen and (max-width: 767px) {
  .modal-menu .menu-list[data-level="4"]>.menu-plate>.menu-wrap>.menu {
    font-size: 17px;
    letter-spacing: -0.51px;
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-list[data-level="4"]>.menu-plate>.menu-wrap>.menu {
    width: 100%;
    padding: 12px 5px;
  }
}

.modal-menu .menu-plate>.menu-wrap>.menu {
  transition: border 0.3s;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-plate>.menu-wrap>.menu {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid rgba(34, 34, 34, 0.1);
  }
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-plate>.menu-wrap>.menu:not(:first-of-type) {
    border-bottom: 1px solid rgba(34, 34, 34, 0.1);
  }
}

.modal-menu .menu-plate>.menu-wrap>.menu .icon {
  display: none;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-plate>.menu-wrap>.menu .icon {
    display: block;
    transition: transform 0.3s;
  }
}

.modal-menu .menu-plate>.menu-wrap>.menu .icon img {
  transition: filter 0.3s;
}

.modal-menu .menu-wrap {
  display: flex;
  justify-content: space-between;
  gap: 25px;
  transition: left 0.2s ease-in-out;
}

@media only screen and (max-width: 530px) {
  .modal-menu .menu-wrap {
    gap: 0px;
  }
}

.modal-menu .more-menu {
  display: none;
  margin-bottom: auto;
  padding: 0 6px;
}

@media only screen and (max-width: 530px) {
  .modal-menu .more-menu {
    display: block;
  }
}

.modal-menu .more-menu .btn-wrap {
  position: relative;
  padding: 15px 0;
}

.modal-menu .more-menu .btn-wrap:not(:first-child) {
  padding: 15px 0 15px;
}

.modal-menu .more-menu .btn-wrap:not(:first-child)::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.2);
}

.modal-menu .more-menu .btn {
  font-family: "GyeonggiBatang", sans-serif;
  font-size: 13px;
  color: #fff;
  letter-spacing: 0;
}

.full-menu {
  position: fixed;
  top: 0%;
  left: 100%;
  width: 100%;
  height: 100vh;
  min-height: 100%;
  overflow: hidden;
  z-index: 101;
  background-color: #fff;
  transition: left 0.2s ease-in-out;
  display: flex;
  justify-content: space-between;
}

.full-menu.active {
  left: 0;
}

.full-menu .body {
  width: calc(100% - 80px);
  background-color: #FFFFFF;
}

.full-menu .body .top_logo {
  width: 100%;
  height: 90px;
  display: flex;
  align-items: center;
  padding-left: 40px;
  border-bottom: 1px solid #E8E8E8;
}

.full-menu .body .depth-1 {
  padding-left: 135px;
  padding-top: 10px;
  padding-bottom: 40px;
  overflow: auto;
  height: calc(100% - 90px);
}

.full-menu .body .depth-1>li {
  padding: 50px 0;
  display: flex;
}

.full-menu .body .depth-1>li>a {
  color: #004A9C;
  font-size: 35px;
  font-weight: 600;
  width: 380px;
  min-width: 380px;
}

.full-menu .body .depth-1>li>ul.depth-2 {
  width: calc(100% - 380px);
  display: flex;
}

.full-menu .body .depth-1>li>ul.depth-2>li {
  width: 25%;
}

.full-menu .body .depth-1>li>ul.depth-2>li>a {
  color: #222222;
  font-size: 22px;
  font-weight: 600;
}

.full-menu .body .depth-1>li>ul.depth-2>li>ul.depth-3 {
  padding-top: 25px;
  display: flex;
  flex-direction: column;
  gap: 17px;
  color: #333333;
  font-size: 18px;
}

.full-menu .side {
  width: 80px;
  padding: 25px 20px;
  background-color: #004A9C;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.full-menu .side .top_position .btn-close {
  width: 40px;
  height: 40px;
}

.full-menu .side .bottom_position {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.full-menu .side .bottom_position a+a {
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid #fff;
}

.full-menu .side .bottom_position a .text {
  font-size: 15px;
  font-weight: 600;
  color: #fff;
}

.hover_after .full-menu {
  display: none;
}

/* //scss 메뉴창 */
/* footer start */
.footer {
  position: relative;
  display: flex;
  width: 100%;
  height: 26rem;
  z-index: 1000;
}

@media only screen and (max-width: 767px) {
  .footer {
    flex-direction: column;
  }
}

.footer .layout {
  height: 100%;
}

.footer-block {
  position: relative;
  width: 100%;
  background-color: #29282D;
  font-weight: 300;
  color: #D4D4D4;
  letter-spacing: 0;
}

@media only screen and (max-width: 767px) {
  .footer-block:first-child .footer-plate {
    padding: 4rem 0;
  }
}

.footer-block:last-child {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  width: 1366px;
  height: 100%;
  border-left: 1px solid #43414D;
  background-color: #323137;
  padding: 45px 66px;
}

@media only screen and (max-width: 1660px) {
  .footer-block:last-child {
    width: calc(100% - 340px);
    padding: 35px 30px;
  }
}

@media only screen and (max-width: 767px) {
  .footer-block:last-child {
    position: relative;
    right: unset;
    bottom: unset;
    width: 100%;
    background-color: #29282D;
    padding: 20px 15px;
  }
}

.footer-block:last-child a {
  font-weight: 300;
  color: #D4D4D4;
  letter-spacing: 0;
}

.footer-block:last-child dl {
  display: flex;
}

.footer-block:last-child .infoprocess {
  color: #fff;
}

.footer-block:last-child .infoprocess a {
  color: #fff;
}

.footer-block:last-child .address {
  flex: 100%;
}

.footer-block:last-child .address dt {
  display: none;
}

.footer-block:last-child .copy {
  color: #ACACAC;
}

.footer-plate {
  display: flex;
  align-items: center;
  height: 100%;
}

@media only screen and (max-width: 767px) {
  .footer-plate {
    justify-content: center;
    text-align: center;
  }
}

.footer-plate:has(.address) {
  gap: 5px 40px;
  flex-wrap: wrap;
  margin-top: 40px;
}

@media only screen and (max-width: 767px) {
  .footer-plate:has(.address) {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 30px 5px;
    margin-top: 30px;
  }
}

@media only screen and (max-width: 425px) {
  .footer-plate:has(.address) {
    gap: 15px 5px;
    margin-top: 15px;
  }
}

.footer-plate:has(.copy) {
  margin-top: 2.5rem;
}

.footer-list {
  display: flex;
  gap: 45px;
}

@media only screen and (max-width: 1400px) {
  .footer-list {
    gap: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .footer-list {
    gap: 35px;
  }
}

@media only screen and (max-width: 425px) {
  .footer-list {
    gap: 15px;
  }
}

/* footer end */
/* scss 수정 */
.wrap[data-path] #container {
  min-height: 100dvh;
}

@media only screen and (max-width: 1660px) {
  .side {
    display: none;
  }
}

.side .btn {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 1rem;
  padding: 1.7rem 0 1.8rem;
}

.side .btns {
  position: sticky;
  top: 20rem;
  display: flex;
  flex-direction: column;
}

.side .btns-wrap {
  position: fixed;
  right: calc((100% - 1400px) / 2 - 35px);
  transform: translateX(100%);
  top: 0;
  display: block;
  width: 80px;
  height: 100dvh;
  z-index: 1100;
}

.side .btn-wrap:not(:first-child) {
  border-top: 1px solid #A5AEC5;
}

/* //scss 수정 */





/* css 수정 */
/* //css 수정 */