main.asset-main {
  gap: 0;
}
main .content.asset-page {
  gap: var(--spacing-48);
  display: none;
}
main .breadcrumb-tab {
  width: 100%;
}
main .breadcrumb-tab.nature-tab ul li[data-value=monument] .img-box img {
  object-fit: contain;
}
main .breadcrumb-tab.living-tab {
  padding-top: 0;
}
main .breadcrumb-tab.living-tab ul {
  overflow: hidden;
}
main .breadcrumb-tab.living-tab ul li {
  flex: 0 0 auto;
  min-width: 30.6rem;
  padding: 0;
}
main .breadcrumb-tab.living-tab ul li button {
  flex: 1 0;
  padding: 0 var(--spacing-16);
}
main .breadcrumb-tab.living-tab ul li .img-box {
  position: absolute;
  right: 1rem;
  object-fit: contain;
  width: 12.5rem;
}
main .breadcrumb-tab.living-tab ul li .img-box img {
  object-fit: fill;
}
main .breadcrumb-tab.living-tab ul li.active button {
  color: var(--white);
  flex: 0 auto;
  padding: 0 1.6rem 0;
  width: 100%;
}



main .breadcrumb-tab-two ul {
  display: flex;
  flex-direction: row;
  gap: var(--spacing-16);
  padding-top: 3.2rem;
  width: 100%;
}
main .breadcrumb-tab-two ul li {
  flex: 0 0 20%;
  background-color: var(--gray-50);
  height: 5.4rem;
  border-radius: var(--radius-md-8);
  gap: var(--spacing-12);
  position: relative;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  min-width: 26rem;
  padding: 0 var(--spacing-16);
}
main .breadcrumb-tab-two ul li .img-box {
  position: relative;
  width: 10.9rem;
  height: 7.2rem;
  transform: translateY(-1.8rem);
}
main .breadcrumb-tab-two ul li .img-box.wid-100 {
  width: 10rem;
}
main .breadcrumb-tab-two ul li .img-box.wid-150 {
  width: 15rem;
}
main .breadcrumb-tab-two ul li .img-box.wid-flex {
  width: 10.5rem;
}
main .breadcrumb-tab-two ul li .img-box.wid-85 {
  width: 8.5rem;
}
main .breadcrumb-tab-two ul li .img-box img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1);
  opacity: 0.5;
  pointer-events: none;
}
main .breadcrumb-tab-two ul li.active .img-box img  {
  opacity: 1;
  filter: grayscale(0);
}
main .breadcrumb-tab-two ul li button {
  color: var(--gray-500);
  height: 100%;
  box-sizing: border-box;
  border-radius: var(--radius-md-8);
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
  text-align: left;
  padding: 0;
}
main .breadcrumb-tab-two ul li.active button {
  color: var(--white);
  flex: 0 auto;
  padding: 0;
}



main .breadcrumb-tab ul {
  display: flex;
  flex-direction: row;
  gap: var(--spacing-16);
  padding-top: 3.2rem;
  width: 100%;
}
main .breadcrumb-tab ul li {
  flex: 0 0 20%;
  background-color: var(--gray-50);
  height: 5.4rem;
  border-radius: var(--radius-md-8);
  gap: var(--spacing-12);
  position: relative;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  min-width: 26rem;
  padding: 0 var(--spacing-16);
}
main .breadcrumb-tab ul li .img-box {
  position: relative;
  width: 10.9rem;
  height: 7.2rem;
  transform: translateY(-1.8rem);
}
main .breadcrumb-tab ul li .img-box.wid-100 {
  width: 10rem;
}
main .breadcrumb-tab ul li .img-box.wid-150 {
  width: 15rem;
}
main .breadcrumb-tab ul li .img-box.wid-flex {
  width: 10.5rem;
}
main .breadcrumb-tab ul li .img-box.wid-85 {
  width: 8.5rem;
}
main .breadcrumb-tab ul li .img-box img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1);
  opacity: 0.5;
  pointer-events: none;
}
main .breadcrumb-tab ul li button {
  color: var(--gray-500);
  height: 100%;
  box-sizing: border-box;
  border-radius: var(--radius-md-8);
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
  text-align: left;
  padding: 0;
}
main .breadcrumb-tab ul li.active button {
  color: var(--white);
  flex: 0 auto;
  padding: 0;
}
main .breadcrumb-tab ul li.active .img-box img {
  filter: grayscale(0);
  opacity: 1;
}
main .breadcrumb-tab ul li.active[data-value=Gyeongbokgung] {
  background-color: var(--teal-800);
}
main .breadcrumb-tab ul li.active[data-value=Symbol] {
  background-color: var(--teal-500);
}
main .breadcrumb-tab ul li.active[data-value=Changdeokgung] {
  background-color: var(--deep-green-900);
}
main .breadcrumb-tab ul li.active[data-value=GyedongTraditional] {
  background-color: var(--deep-green-800);
}
main .breadcrumb-tab ul li.active[data-value=Gyedongmodern] {
  background-color: var(--deep-green-700);
}
main .breadcrumb-tab ul li.active[data-value=Unhyeon] {
  background-color: var(--deep-green-600);
}
main .breadcrumb-tab ul li.active[data-value=Suncheon] {
  background-color: var(--deep-green-500);
}
main .breadcrumb-tab ul li.active[data-value=monument] {
  background-color: var(--green-800);
}
main .breadcrumb-tab ul li.active[data-value=Buddhist] {
  background-color: var(--green-600);
}
main .breadcrumb-tab ul li.active[data-value=Daeungjeon] {
  background-color: var(--teal-900);
}
main .breadcrumb-tab ul li.active[data-value=Ocheongjeontap] {
  background-color: var(--teal-800);
}
main .breadcrumb-tab ul li.active[data-value=Seongbangsa] {
  background-color: var(--teal-700);
}
main .breadcrumb-tab ul li.active[data-value=Noseolri] {
  background-color: var(--teal-600);
}
main .breadcrumb-tab ul li.active[data-value=government] {
  background-color: var(--deep-pink-800);
}
main .breadcrumb-tab ul li.active[data-value=army] {
  background-color: var(--deep-pink-700);
}
main .breadcrumb-tab ul li.active[data-value=BuddhistTwo] {
  background-color: var(--teal-800);
}
main .breadcrumb-tab ul li.active[data-value=naturalmonument] {
  background-color: var(--yellow-700);
}
main .breadcrumb-tab ul li.active[data-value=naturalmonument] {
  background-color: var(--yellow-700);
}
main .breadcrumb-tab ul li.active[data-value=ship] {
  background-color: var(--navy-800);
}
main .breadcrumb-tab ul li.active[data-value=taean] {
  background-color: var(--navy-600);
}
main .breadcrumb-tab-two ul li.active.BuddhistTwoSub {
  background-color: var(--teal-800);
}
main .breadcrumb-tab-two ul li.active.naturalmonumentSub {
  background-color: var(--yellow-700);
}
main .content-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-32);
}
main .content-list .search-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding-top: 5.2rem;
  gap: var(--spacing-32);
}
main .content-list h4 {
  font-size: var(--typography-Heading5-B-28-font-size);
  font-weight: var(--typography-Heading5-B-28-font-weight);
  line-height: var(--typography-Heading5-B-28-line-height);
  letter-spacing: var(--typography-Heading5-B-28-letter-spacing);
}
main .content-list .content-wrap-tab {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-40);
}
main .content-list .all-view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-12);
  width: 100%;
  padding: var(--spacing-20) 0;
  border-top: 1px solid var(--gray-200);
  font-size: var(--typography-Body1-M-18-font-size);
  font-weight: var(--typography-Body1-M-18-font-weight);
  line-height: var(--typography-Body1-M-18-line-height);
  letter-spacing: var(--typography-Body1-M-18-letter-spacing);
  color: var(--gray-700);
  transition: all 0.3s;
}
main .content-list .all-view-btn img {
  transition: all 0.3s;
  transform: rotate(90deg);
}
main .content-list .all-view-btn.active img {
  transform: rotate(-90deg);
}
main .content-list .all-view-btn:hover {
  background-color: var(--gray-50);
}
main .content-list .heritage-items-fourColumn-grid.asseTabPage {
  display: none;
  padding: 0.3rem;
  height: 57rem;
  box-sizing: border-box;
}
main .content-list .heritage-items-fourColumn-grid.active[data-value=Construction] {
  display: grid;
}
main .content-list .heritage-items-fourColumn-grid.active[data-value=living] {
  display: grid;
}
main .natural-visual {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: var(--spacing-28);
}
main .natural-visual .visual-img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 3.5/1;
  border-radius: var(--radius-md-8);
  overflow: hidden;
  max-height: 39.6rem;
  position: relative;
}
main .natural-visual .visual-img .txt-box {
  top: var(--spacing-32);
  left: var(--spacing-32);
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-12);
  width: calc(100% - 6.4rem);
  z-index: 2;
}
main .natural-visual .visual-img .txt-box h1 {
  font-size: var(--typography-Heading5-B-28-font-size);
  font-weight: var(--typography-Heading5-B-28-font-weight);
  line-height: var(--typography-Heading5-B-28-line-height);
  letter-spacing: var(--typography-Heading5-B-28-letter-spacing);
  color: var(--white);
}
main .natural-visual .visual-img .txt-box p {
  font-size: var(--typography-Body1-M-18-font-size);
  font-weight: var(--typography-Body1-M-18-font-weight);
  line-height: var(--typography-Body1-M-18-line-height);
  letter-spacing: var(--typography-Body1-M-18-letter-spacing);
  color: var(--white);
}
main .natural-visual .visual-img .grid-bg-dark-green {
  background: linear-gradient(96deg, #091C17 0.4%, rgba(72, 64, 26, 0) 96.36%);
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
main .natural-visual .visual-img .grid-bg-dark-yellow {
  background: linear-gradient(101deg, #AE9A3E 0.69%, rgba(87, 75, 21, 0) 88.66%);
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
}
main .natural-visual .visual-img img {
  width: 100%;
  height: auto;
  transform: translateY(-19%);
}
main .asset-visual {
  padding-bottom: 9.2rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: var(--spacing-28);
}
main .asset-visual:nth-child(2) {
  padding-top: 4.8rem;
}
main .asset-visual:nth-child(2).visual-bottom {
  padding-top: 6rem;
  padding-bottom: 0;
}
main .asset-visual:last-child {
  padding-bottom: 10rem;
}
main .asset-visual .visual-info {
  display: flex;
  gap: var(--spacing-28);
  overflow: auto;
  padding-bottom: 1.6rem;
}
main .asset-visual .visual-info::-webkit-scrollbar {
  height: 4px;
  background: transparent;
  border-radius: 4px;
}
main .asset-visual .visual-info::-webkit-scrollbar-thumb {
  background: var(--gray-300);
  border-radius: 4px;
}
main .asset-visual .visual-info::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 8px;
}
main .asset-visual .visual-info li {
  flex: 1 0 calc(25% - var(--spacing-28) * 3 / 4);
  position: relative;
  aspect-ratio: 1.3/1;
  border-radius: var(--radius-md-8);
  overflow: hidden;
  box-sizing: border-box;
  padding: var(--spacing-24);
  border: 1px solid var(--gray-200);
  min-width: 30rem;
}
main .asset-visual .visual-info li img {
  position: absolute;
  right: 2rem;
  top: 2rem;
}
main .asset-visual .visual-info li .vr-title {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-16);
  height: 100%;
  justify-content: flex-end;
}
main .asset-visual .visual-info li .vr-title h3 {
  font-size: var(--typography-Heading8-B-20-font-size);
  font-weight: var(--typography-Heading8-B-20-font-weight);
  line-height: var(--typography-Heading8-B-20-line-height);
  letter-spacing: var(--typography-Heading8-B-20-letter-spacing);
}
main .asset-visual .visual-info li .vr-title p {
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
  color: var(--gray-700);
}
main .asset-visual .visual-info li .vr-title p strong {
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
}
main .asset-visual .visual-title {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-12);
}
main .asset-visual .visual-title.intangible-txt {
  display: flex;
  flex-direction: row;
  gap: var(--spacing-16);
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
main .asset-visual .visual-title.intangible-txt div {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-16);
}
main .asset-visual .visual-title.intangible-txt .more-btn {
  flex-direction: row;
  align-items: center;
}
main .asset-visual .visual-title.intangible-txt .more-btn strong {
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
}
main .asset-visual .visual-title.intangible-txt .more-btn a {
  background-color: var(--teal-500);
  height: fit-content;
  padding: var(--spacing-12) var(--spacing-16);
  border-radius: var(--radius-md-8);
  font-size: var(--typography-Body2-R-16-font-size);
  font-weight: var(--typography-Body2-R-16-font-weight);
  line-height: var(--typography-Body2-R-16-line-height);
  letter-spacing: var(--typography-Body2-R-16-letter-spacing);
  color: var(--white);
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  transition: all 0.3s;
}
main .asset-visual .visual-title.intangible-txt .more-btn a:hover {
  background-color: var(--teal-600);
}
main .asset-visual .visual-title h2 {
  font-size: var(--typography-Heading5-B-28-font-size);
  font-weight: var(--typography-Heading5-B-28-font-weight);
  line-height: var(--typography-Heading5-B-28-line-height);
  letter-spacing: var(--typography-Heading5-B-28-letter-spacing);
}
main .asset-visual .visual-title p {
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
  color: var(--gray-700);
  width: 75%;
}
main .asset-visual .visual-img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 3.5/1;
  border-radius: var(--radius-md-8);
  overflow: hidden;
  max-height: 39.6rem;
}
main .asset-visual .visual-img img {
  width: 100%;
  height: auto;
  transform: translateY(-28%);
}
main .asset-visual .img-wrap {
  display: flex;
  gap: var(--spacing-28);
  width: 100%;
}
main .asset-visual .img-wrap .img-item {
  object-fit: cover;
  aspect-ratio: 2.5/1;
  border-radius: var(--radius-md-8);
  overflow: hidden;
  max-height: 39.6rem;
}
main .asset-visual .img-wrap .img-item.one {
  flex: 1 0 calc(80% - 2.8rem);
}
main .asset-visual .img-wrap .img-item.one img {
  width: 100%;
  height: auto;
  transform: translate(12%, -80px);
  scale: 150%;
}
main .asset-visual .img-wrap .img-item.two {
  flex: 1 0 20%;
}
main .asset-visual .img-wrap .img-item.two img {
  width: 100%;
  height: 100%;
  height: auto;
  scale: 1.5;
}
main .asset-visual .img-wrap .img-item.three {
  flex: 1 0 calc(80% - 2.8rem);
}
main .asset-visual .img-wrap .img-item.three img {
  width: 100%;
  height: auto;
  transform: translateY(-15%);
}
main .asset-visual .img-wrap .img-item.four {
  flex: 1 0 20%;
}
main .asset-visual .img-wrap .img-item.four img {
  width: 100%;
  scale: 5;
  transform: translate(-5%, 25%);
}
main .asset-visual .img-wrap .col-item ul.col-list li {
  flex: 0 0 calc(50% - var(--spacing-28) / 2);
  aspect-ratio: auto;
}
main .asset-visual .img-wrap .col-item ul.col-list li a {
  width: 100%;
}
main .asset-visual .img-wrap .col-item ul.col-list li:first-child {
  grid-area: 1/1;
}
main .asset-visual .img-wrap .col-item ul.col-list li:first-child a {
  background-color: var(--gray-900);
}
main .asset-visual .img-wrap .col-item ul.col-list li:first-child a .btn-link {
  width: 50%;
  min-width: 10rem;
  position: absolute;
  bottom: 0;
  right: 0;
}
main .asset-visual .img-wrap .col-item ul.col-list li:last-child {
  grid-area: 2/1;
}
main .asset-visual .img-wrap .col-item ul.col-list li:last-child a {
  cursor: default;
}
main .asset-visual .img-wrap .col-item ul li {
  flex: 0 0 calc(50% - var(--spacing-28) / 2);
  aspect-ratio: auto;
}
main .asset-visual .img-wrap .col-item ul li a {
  display: flex;
  overflow: hidden;
  border-radius: var(--radius-md-8);
  flex-direction: column;
  height: 100%;
}
main .asset-visual .img-wrap .col-item ul li a .market-img-list ul {
  display: flex;
  gap: var(--spacing-20);
  transform: translateX(-2.4rem);
}
main .asset-visual .img-wrap .col-item ul li a .market-img-list ul li {
  flex: 1 0 calc(20% - 1.65rem);
}
main .asset-visual .img-wrap .col-item ul li a .market-img-list ul li img {
  border-radius: var(--radius-md-8);
}
main .asset-visual .img-wrap .col-item ul li a h4 {
  z-index: 1;
  font-size: var(--typography-Heading8-B-20-font-size);
  font-weight: var(--typography-Heading8-B-20-font-weight);
  line-height: var(--typography-Heading8-B-20-line-height);
  letter-spacing: var(--typography-Heading8-B-20-letter-spacing);
}
main .asset-visual .img-wrap .col-item ul li a img {
  width: 100%;
  height: auto;
}
main .asset-visual .img-wrap .col-item ul li a .bg-img {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--spacing-32) var(--spacing-24);
  position: relative;
  flex: 1;
  overflow: hidden;
  justify-content: space-between;
  gap: var(--spacing-16);
}
main .asset-visual .img-wrap .col-item ul li a .bg-img.bg-black {
  background-color: var(--gray-900);
}
main .asset-visual .img-wrap .col-item ul li a .bg-img p {
  z-index: 2;
  color: var(--white);
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .logo-icon {
  z-index: 1;
  height: clamp(2.4rem, 2vw, 3.6rem);
  min-height: 2rem;
  max-height: 3.6rem;
  width: min-content;
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .bg {
  position: absolute;
  bottom: 0;
  left: 0;
  transition: all 0.3s;
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .bg.scale-img {
  scale: 2;
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .bg.scale-img:hover {
  scale: 2.1;
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .bg.scale-left {
  transform: translate(20%, 25%);
}
main .asset-visual .img-wrap .col-item ul li a .bg-img .grd-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  height: 30%;
  background: linear-gradient(to bottom, #1e2124 50%, rgba(0, 0, 0, 0));
}
main .asset-visual .img-wrap .col-item ul li a .bg-img video {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
  left: 0;
}
main .asset-visual .img-wrap .col-item ul li a .btn-link {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  justify-content: space-between;
  background-color: var(--teal-500);
  padding: var(--spacing-12) var(--spacing-16);
  width: 100%;
  box-sizing: border-box;
}
main .asset-visual .img-wrap .col-item ul li a .btn-link span {
  color: var(--white);
  font-size: var(--typography-Body2-R-16-font-size);
  font-weight: var(--typography-Body2-R-16-font-weight);
  line-height: var(--typography-Body2-R-16-line-height);
  letter-spacing: var(--typography-Body2-R-16-letter-spacing);
}
main .asset-visual .img-wrap .col-item ul li a .btn-link img {
  width: 1.6rem;
  height: 1.6rem;
}
main .asset-visual .img-wrap .col-item ul li a:hover .bg {
  scale: 1.1;
}
main .asset-content {
  display: flex;
  justify-content: space-between;
  gap: 10.7rem;
  padding-bottom: 9.2rem;
  position: relative;
  width: 100%;
}
main .asset-content.flex-col-28 {
  flex-direction: column;
  gap: var(--spacing-28);
}
main .asset-content.flex-col {
  flex-direction: column;
  gap: var(--spacing-32);
}
main .asset-content:last-child {
  padding-top: 9.2rem;
  padding-bottom: 10rem;
}
main .asset-content:last-child:before {
  content: "";
  display: block;
  width: 100vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 1px;
  background-color: var(--gray-200);
  pointer-events: none;
}
main .asset-content .market-title {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-12);
  flex: 0.9 0;
}
main .asset-content .market-title h3 {
  font-size: var(--typography-Heading5-B-28-font-size);
  font-weight: var(--typography-Heading5-B-28-font-weight);
  line-height: var(--typography-Heading5-B-28-line-height);
  letter-spacing: var(--typography-Heading5-B-28-letter-spacing);
}
main .asset-content .market-title p {
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
  color: var(--gray-700);
}
main .asset-content .scroll {
  display: flex;
  gap: var(--spacing-28);
  flex: 1 0 52%;
}
main .asset-content .scroll .market-list {
  display: flex;
  gap: var(--spacing-28);
  flex-wrap: wrap;
  width: 100%;
}
main .asset-content .scroll .market-list.flex-four li {
  flex: 0 0 calc(25% - var(--spacing-28) * 3 / 4);
}
main .asset-content .scroll .market-list li {
  flex: 0 0 calc(33.3333333333% - 1.92rem);
}
main .asset-content .scroll .market-list li a {
  display: flex;
  overflow: hidden;
  border-radius: var(--radius-md-8);
  flex-direction: column;
  height: 100%;
  aspect-ratio: 1/1.23;
}
main .asset-content .scroll .market-list li a h4 {
  z-index: 1;
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
}
main .asset-content .scroll .market-list li a img {
  width: 100%;
  height: auto;
}
main .asset-content .scroll .market-list li a .bg-img {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--spacing-32) var(--spacing-24);
  position: relative;
  flex: 1;
  overflow: hidden;
  gap: var(--spacing-4);
}
main .asset-content .scroll .market-list li a .bg-img .badge {
  position: absolute;
  bottom: 2.8rem;
  right: 0;
  z-index: 1;
  width: fit-content;
}
main .asset-content .scroll .market-list li a .bg-img.bg-black {
  background-color: var(--gray-900);
}
main .asset-content .scroll .market-list li a .bg-img p {
  z-index: 1;
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
  opacity: 0.8;
}
main .asset-content .scroll .market-list li a .bg-img .logo-icon {
  z-index: 1;
  height: clamp(2.4rem, 2vw, 3.6rem);
  min-height: 2rem;
  max-height: 3.6rem;
  width: min-content;
}
main .asset-content .scroll .market-list li a .bg-img .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s;
}
main .asset-content .scroll .market-list li a .bg-img .bg.scale-img {
  bottom: 0;
  height: auto;
  bottom: 0;
  top: auto;
}
main .asset-content .scroll .market-list li a .btn-link {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  justify-content: space-between;
  background-color: var(--teal-500);
  padding: var(--spacing-12) var(--spacing-16);
  width: 100%;
  box-sizing: border-box;
}
main .asset-content .scroll .market-list li a .btn-link span {
  color: var(--white);
  font-size: var(--typography-Body2-R-16-font-size);
  font-weight: var(--typography-Body2-R-16-font-weight);
  line-height: var(--typography-Body2-R-16-line-height);
  letter-spacing: var(--typography-Body2-R-16-letter-spacing);
}
main .asset-content .scroll .market-list li a .btn-link img {
  width: 1.6rem;
  height: 1.6rem;
}
main .asset-content .scroll .market-list li a:hover .bg {
  scale: 1.1;
}
main .world-heritage-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-32);
}
main .world-heritage-wrap .visual-top {
  display: flex;
  gap: var(--spacing-48);
  align-items: center;
  position: relative;
  height: 100%;
}
main .world-heritage-wrap .visual-top .left-area {
  aspect-ratio: 1.5/1;
  width: 100%;
  flex: 1 0 calc(70% - 2.4rem);
  position: relative;
}
main .world-heritage-wrap .visual-top .left-area .info-list {
  z-index: 1;
  position: absolute;
  left: 2rem;
  top: 2rem;
  height: calc(100% - 4rem);
  pointer-events: none;
}
main .world-heritage-wrap .visual-top .left-area .info-list ul {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}
main .world-heritage-wrap .visual-top .left-area .info-list ul li p {
  display: flex;
  gap: var(--spacing-8);
  font-size: var(--typography-Body3-R-14-font-size);
  font-weight: var(--typography-Body3-R-14-font-weight);
  line-height: var(--typography-Body3-R-14-line-height);
  letter-spacing: var(--typography-Body3-R-14-letter-spacing);
  color: var(--gray-900);
  align-items: center;
  transition: 0.3s;
}
main .world-heritage-wrap .visual-top .left-area .info-list ul li p.active {
  scale: 1.02;
}
main .world-heritage-wrap .visual-top .left-area .info-list ul li p.active span {
  background-color: var(--teal-500);
}
main .world-heritage-wrap .visual-top .left-area .info-list ul li p span {
  font-size: var(--typography-Body3-M-14-font-size);
  font-weight: var(--typography-Body3-M-14-font-weight);
  line-height: var(--typography-Body3-M-14-line-height);
  letter-spacing: var(--typography-Body3-M-14-letter-spacing);
  color: var(--white);
  background-color: var(--gray-900);
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm-4);
  transition: all 0.3s;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box {
  position: absolute;
  top: 0;
  background-color: var(--gray-50);
  height: 100%;
  border-radius: var(--radius-md-8);
  aspect-ratio: 1.5/1;
  overflow: hidden;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-10);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn button {
  width: 4rem;
  height: 4rem;
  background-color: var(--gray-50);
  background-color: var(--white);
  border-radius: var(--radius-md-8);
  border: 1px solid var(--gray-200);
  cursor: pointer;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn button:hover {
  scale: 1.05;
  transition: all 0.3s;
  background-color: var(--gray-100);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn button:active {
  scale: 0.95;
  transition: all 0.3s;
  background-color: var(--gray-200);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-in {
  position: relative;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-in:after, main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-in:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--gray-900);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-in:after {
  width: 0.15rem;
  height: 2rem;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-in:before {
  width: 2rem;
  height: 0.15rem;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-out {
  position: relative;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom-btn .zoom-out:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 2rem;
  height: 0.15rem;
  background-color: var(--gray-900);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .zoom {
  width: 100%;
  height: 100%;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box img {
  width: 100%;
  height: 100%;
  padding: var(--spacing-24);
  transform: translateX(5%);
  box-sizing: border-box;
  overflow: hidden;
  object-fit: contain;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(26, 1fr);
  grid-template-rows: repeat(16, 1fr);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker button {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 2.5rem;
  height: 3.2rem;
  transition: all 0.3s;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker button:hover {
  scale: 1.05;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker button:hover svg path {
  transition: all 0.3s;
  fill: var(--teal-500);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker button p {
  font-size: var(--typography-Body3-M-14-font-size);
  font-weight: var(--typography-Body3-M-14-font-weight);
  line-height: var(--typography-Body3-M-14-line-height);
  letter-spacing: var(--typography-Body3-M-14-letter-spacing);
  color: var(--white);
  z-index: 1;
  height: 2.5rem;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker button svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 2.5rem;
  height: 3.2rem;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="01"] {
  grid-area: 15/16;
  transform: translate(9px, -6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="02"] {
  grid-area: 13/15;
  transform: translate(-20px, 10px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="03"] {
  grid-area: 12/14;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="04"] {
  grid-area: 12/12;
  transform: translate(12px, 15px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="05"] {
  grid-area: 11/13;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="06"] {
  grid-area: 11/16;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="07"] {
  grid-area: 9/16;
  transform: translate(10px, 10px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="08"] {
  grid-area: 9/18;
  transform: translate(-19px, -6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="09"] {
  grid-area: 8/17;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="10"] {
  grid-area: 8/16;
  transform: translate(-11px, 0px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="11"] {
  grid-area: 8/19;
  transform: translate(-5px, 20px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="12"] {
  grid-area: 9/23;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="13"] {
  grid-area: 8/23;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="14"] {
  grid-area: 8/21;
  transform: translate(-11px, 5px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="15"] {
  grid-area: 6/15;
  transform: translate(13px, 0px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="16"] {
  grid-area: 5/15;
  transform: translate(-8px, 18px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="17"] {
  grid-area: 5/14;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="18"] {
  grid-area: 4/13;
  transform: translate(20px, 0px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="19"] {
  grid-area: 4/12;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="20"] {
  grid-area: 3/13;
  transform: translateX(-13px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="21"] {
  grid-area: 3/11;
  transform: translate(-16px, -7px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="22"] {
  grid-area: 2/9;
  transform: translate(19px, -11px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Chungdeokgung-marker button[data-area="23"] {
  grid-area: 6/7;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="01"] {
  grid-area: 12/25;
  transform: translate(-20px, 10px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="02"] {
  grid-area: 10/22;
  transform: translate(7px, 23px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="03"] {
  grid-area: 9/23;
  transform: translate(-12px, 0px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="04"] {
  grid-area: 8/21;
  transform: translate(-8px, 16px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="05"] {
  grid-area: 6/20;
  transform: translate(-7px, -15px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="06"] {
  grid-area: 5/22;
  transform: translate(-15px, 6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="07"] {
  grid-area: 4/21;
  transform: translate(-19px, 15px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="08"] {
  grid-area: 4/17;
  transform: translateX(6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="09"] {
  grid-area: 5/16;
  transform: translate(9px, -6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="10"] {
  grid-area: 5/15;
  transform: translate(-2px, -4px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="11"] {
  grid-area: 6/13;
  transform: translateX(-17px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="12"] {
  grid-area: 5/11;
  transform: translate(-2px, -14px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="13"] {
  grid-area: 5/9;
  transform: translateX(-7px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="14"] {
  grid-area: 4/7;
  transform: translate(-8px, -18px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="15"] {
  grid-area: 9/12;
  transform: translate(2px, -4px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="16"] {
  grid-area: 7/16;
  transform: translate(-8px, 16px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="17"] {
  grid-area: 7/18;
  transform: translate(-9px, 1px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="18"] {
  grid-area: 9/15;
  transform: translate(-10px, 10px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="19"] {
  grid-area: 11/8;
  transform: translate(-12px, -4px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="20"] {
  grid-area: 13/14;
  transform: translate(-2px, -10px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="21"] {
  grid-area: 13/16;
  transform: translate(-4px, -6px);
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="22"] {
  grid-area: 14/19;
}
main .world-heritage-wrap .visual-top .left-area .area-img-box .marker.Yangdong-marker button[data-area="23"] {
  grid-area: 12/19;
  transform: translate(-18px, -13px);
}
main .world-heritage-wrap .visual-top .right-area {
  flex: 1 0 20%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
main .world-heritage-wrap .visual-top .right-area .info-top {
  display: flex;
  flex-direction: column;
  gap: clamp(var(--spacing-12), 1vw, var(--spacing-32));
}
main .world-heritage-wrap .visual-top .right-area .info-top p {
  font-size: var(--typography-Body1-R-18-font-size);
  font-weight: var(--typography-Body1-R-18-font-weight);
  line-height: var(--typography-Body1-R-18-line-height);
  letter-spacing: var(--typography-Body1-R-18-letter-spacing);
  color: var(--gray-700);
}
main .world-heritage-wrap .visual-top .right-area .detail-info {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-16);
}
main .world-heritage-wrap .visual-top .right-area .detail-info .img {
  aspect-ratio: 1.657/1;
  border-radius: var(--radius-md-8);
  overflow: hidden;
  position: relative;
}
main .world-heritage-wrap .visual-top .right-area .detail-info .img p {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  font-size: var(--typography-Body3-M-14-font-size);
  font-weight: var(--typography-Body3-M-14-font-weight);
  line-height: var(--typography-Body3-M-14-line-height);
  letter-spacing: var(--typography-Body3-M-14-letter-spacing);
  font-family: var(--font-family-sub);
  color: var(--white);
  padding: var(--spacing-6) var(--spacing-12);
  border-top-left-radius: var(--radius-md-8);
  border-bottom-right-radius: var(--radius-md-8);
}
main .world-heritage-wrap .visual-top .right-area .detail-info .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius-md-8);
}
main .world-heritage-wrap .visual-top .right-area .detail-info .num {
  display: flex;
  gap: var(--spacing-8);
}
main .world-heritage-wrap .visual-top .right-area .detail-info .num p {
  font-size: var(--typography-Heading6-B-24-font-size);
  font-weight: var(--typography-Heading6-B-24-font-weight);
  line-height: var(--typography-Heading6-B-24-line-height);
  letter-spacing: var(--typography-Heading6-B-24-letter-spacing);
  color: var(--teal-500);
}
main .world-heritage-wrap .visual-top .right-area .detail-info .num span {
  font-size: var(--typography-Heading8-SB-20-font-size);
  font-weight: var(--typography-Heading8-SB-20-font-weight);
  line-height: var(--typography-Heading8-SB-20-line-height);
  letter-spacing: var(--typography-Heading8-SB-20-letter-spacing);
  color: var(--gray-900);
}
main .world-heritage-wrap .visual-top .right-area .more-button {
  font-size: var(--typography-Body1-M-18-font-size);
  font-weight: var(--typography-Body1-M-18-font-weight);
  line-height: var(--typography-Body1-M-18-line-height);
  letter-spacing: var(--typography-Body1-M-18-letter-spacing);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 0;
  gap: var(--spacing-12);
}

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