.main__section {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 40px;
  box-sizing: border-box
}

.main__section.special_artwork {
  padding: 0;
  margin: 110px 0 240px;
}

.artwork__title,
.exhibit__period,
.exhibit__title,
.intro__title,
.main-kv__title,
.reservation__title {
  font-family: RidleyGrotesk, sans-serif
}

.notice-popup {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, .6);
  z-index: 100;
  opacity: 0;
  transition: opacity .6s ease;
  will-change: opacity
}

.notice-popup.is-active {
  opacity: 1
}

.notice-popup__wrap {
  overflow-y: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 295px;
  max-height: 90vh;
  box-sizing: border-box;
  transform: translate(305px, -50%)
}

.notice-popup__body {
  overflow-y: auto;
  padding: 50px 0 30px;
  background: linear-gradient(180deg, #fcd9df 0, #f3e3e3 48.44%, #cfe0fe 100%)
}

.notice-popup__icon {
  margin: 0 auto 20px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #4b37d5 url(../../images/icon_notice-popup.svg) no-repeat 50% 50%
}

.notice-popup__item {
  text-align: center
}

.notice-popup__title {
  display: block;
  padding: 0 40px;
  font-size: 24px;
  line-height: 1.5416666667;
  color: #000
}

.notice-popup__content {
  margin-top: 18px;
  padding: 0 30px;
  font-size: 16px;
  line-height: 1.6875;
  color: #666
}

.notice-popup__foot {
  height: 40px;
  background: #fff;
  box-sizing: border-box
}

.notice-popup__foot .a-radio {
  float: left;
  padding: 9px 20px
}

.notice-popup__foot .a-radio__icon {
  width: 16px;
  height: 16px
}

.notice-popup__foot .a-radio__text {
  margin-left: 5px;
  font-size: 14px;
  line-height: 1.5714285714;
  color: #000
}

.notice-popup__close {
  padding: 9px 20px;
  float: right;
  font-size: 14px;
  line-height: 1.5714285714;
  color: #000
}

.notice-popup .swiper-pagination {
  position: relative;
  top: -1px;
  z-index: 30;
  margin-top: 30px;
  font-size: 0
}

.notice-popup .swiper-pagination-bullet {
  position: relative;
  width: 10px;
  height: 10px;
  background: 0 0;
  border: 1px solid #111;
  border-radius: 50%;
  opacity: 1;
  transition: background .2s ease-in-out;
  box-sizing: border-box
}

.notice-popup .swiper-pagination-bullet-active {
  background: #111
}

.artwork__title,
.exhibit__title,
.intro__title,
.reservation__title {
  display: block;
  font-size: 48px;
  line-height: 60px;
  color: #000;
  text-align: center
}

.exhibit__link,
.intro__link {
  position: relative;
  display: inline-block;
  padding-right: 25px;
  color: #111;
  font-size: 20px;
  line-height: 27px
}

.exhibit__link:after,
.intro__link:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 15px;
  height: 10px;
  background: url(../../images/icon_view-more-arrow.svg) no-repeat 100% 50%;
  transform: translateY(-50%)
}

.p-main {
  opacity: 0;
  transition: opacity .1s ease
}

.p-main.is-loaded {
  opacity: 1
}

.p-main>main {
  padding-bottom: 0
}

.p-main .floating-button {
  height: 0;
  z-index: 20
}

.main {
  padding-top: 100vh
}

.main-masking {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 60;
  pointer-events: none
}

.main-nav {
  position: fixed;
  top: 220px;
  left: 40px;
  z-index: 2;
  font-size: 16px;
  line-height: 1.2;
  color: #fff;
  transform: translateZ(0)
}

.main-nav.is-invert {
  color: #999;
  z-index: 30
}

.main-nav.is-invert .main-nav__anchor:before {
  background-color: #999
}

.main-nav__item+.main-nav__item {
  margin-top: 11px
}

.main-nav__anchor {
  position: relative;
  display: inline-block;
  padding-left: 16px;
  line-height: 24px;
  color: inherit;
  transition: all .15s ease-out;
  font-size:16px;
}

.main-nav__anchor:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 3px;
  height: 3px;
  transform: translateY(-50%);
  border-radius: 1.5px;
  background: rgba(255, 255, 255, .3);
  transition: all .15s ease-out
}

.main-nav__anchor.is-active {
  font-size: 18px;
  color: #111
}

.main-nav__anchor.is-active:before {
  width: 10px;
  background-color: #111 !important
}

.rolling_banner_container {
  position: fixed;
  top: 126px;
  z-index: 50;
  width: 100%;
  height: 0px;
  max-width: 1920px;
  transform: translateX(-50%);
  left: 50%;
}

.banner_close_button {
  background-image: url(../../images/btn_banner_close.svg);
  background-size: cover;
  z-index: 51;
  width: 30px;
  height: 30px;
  right: 5%;
  position: absolute;
}

.rolling_banner {
  position: absolute;
  display: block;
  z-index: 50;
  width: 250px;
  height: 250px;
  right: 5%;
}

.banner_img_bunker{
  background-image: url(../../images/main/bunker/KGS_bunker_banner_2024.png);
  background-size: cover;
}

.banner_img_theatre{
  background-image: url(../../images/main/theatre/KGS_theatre_banner_2024.png);
  background-size: cover;
}

.banner_disabled{
  pointer-events: none;
}

.main-kv {
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 1
}

.main-kv__head {
  position: absolute;
  top: calc((417 / 1080) * 100%);
  left: 50%;
  z-index: 3;
  width: 100%;
  transform: translateX(-50%);
  text-align: center;
  color: #fff
}

.main-kv__text {
  overflow: hidden;
  display: block;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.1875;
  font-size: 32px;
  line-height: 38px
}

/* s:20220620 폰트 사이즈 줄이기 */
.main-kv__title {
  overflow: hidden;
  margin-top: 10px;
  padding: 0 20px;
  font-size: 100px;
  font-weight: 600;
  line-height: 1.2416666667;
  font-size: 100px;
  line-height: 149px
}
/* e:20220620 폰트 사이즈 줄이기 */

.main-kv__title br {
  display: none
}

.main-kv__char {
  opacity: 0
}

/* s:20220531 예약하기 버튼 추가-pc*/
.ticket-head {
  position: fixed;
  top: 120%;
  width: 100%;
}

.ticket-head .content-wrap {
  max-width: 500px;
}

.ticket-head .content-wrap .ticket-head__action a {
  background-color: transparent;
  border: 1px solid #fff;
}

.ticket-head .content-wrap .ticket-head__action:not(:last-of-type) {
  margin-bottom: 15px;
}

/* e:20220531 예약하기 버튼 추가*/
.main-kv__body {
  position: relative;
  height: 100%
}

.main-kv__body:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, .4) 30.21%, rgba(0, 0, 0, 0) 100%)
}

.main-kv__body .swiper-container {
  height: 100%
}

.main-kv__item {
  overflow: hidden;
  width: 100% !important;
  height: 100%;
  background: #111
}

.main-kv__item img,
.main-kv__item video {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 110%;
  height: 110%;
  z-index: 1;
  -o-object-fit: cover;
  object-fit: cover;
  transform: translate(-50%, -50%)
}

.main-kv .swiper-pagination {
  position: absolute;
  bottom: 159px;
  left: 50%;
  z-index: 30;
  transform: translateX(-50%)
}

.main-kv .swiper-pagination-bullet {
  position: relative;
  width: 24px;
  height: 24px;
  background: 0 0;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 50%;
  opacity: 1;
  transition: border .2s ease-in-out;
  box-sizing: border-box
}

.main-kv .swiper-pagination-bullet:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  background-color: #fff;
  border-radius: 50%;
  transform: translate(-50%, -50%)
}

.main-kv .swiper-pagination-bullet-active {
  border-color: #fff
}

.main__content {
  position: relative;
  z-index: 20;
  background: #e5eadf;
  transition: background 1.5s ease
}

.main__clip {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: calc((100vw - 1200px)/ 2);
  clip: rect(0, auto, auto, 0)
}

.main__clip.is-ignore {
  clip: auto
}

.main__section {
  padding-bottom: 120px
}

.main__section+.main__section {
  padding-top: 120px
}

.exhibit {
  padding-top: 160px
}

.exhibit__item {
  position: relative
}

.exhibit__item+.exhibit__item {
  margin-top: 240px
}

.exhibit__item--main .exhibit__title_bunker {
  color: #D03B12;
  margin-top: 20px
}

.exhibit__item--curated .exhibit__title_bunker {
  color: #0685B2;
  margin-top: 20px
}

.exhibit__item--main .exhibit__title_theatre {
  color: #AA7B1F;
  margin-top: 20px
}

.exhibit__item--curated .exhibit__title_theatre {
  color: #0039A7;
  margin-top: 20px
}

.exhibit__head {
  overflow: hidden;
  position: relative
}

.exhibit__head::before {
  content: "";
  display: block;
  padding-top: calc((482 / 1200) * 100%)
}

.exhibit__image {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: 100%
}

.exhibit__body {
  position: relative;
  font-size: 0;
  color: #111;
  margin-top: 64px
}

.exhibit__category {
  display: inline-block;
  padding-top: 11px;
  padding-bottom: 11px;
  padding-left: 24px;
  padding-right: 24px;
  border: 1px solid #111;
  border-radius: 40px;
  font-size: 20px;
  line-height: 24px;
  box-sizing: border-box
}

.exhibit__subtitle,
.exhibit__text,
.exhibit__title {
  padding-right: 250px
}

.exhibit__title {
  margin-top: 20px;
  text-align: left
}

.exhibit__subtitle {
  display: block;
  margin-top: 20px;
  font-size: 32px;
  line-height: 38px
}

.exhibit__text {
  margin-top: 20px;
  font-size: 20px;
  line-height: 34px
}

[lang=en] .exhibit__text {
  line-height: 34px
}

.exhibit__period {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 32px;
  line-height: 40px;
  font-weight: 600;
  font-style: normal
}

[lang=en] .exhibit__period {
  font-size: 32px;
  line-height: 40px
}

.exhibit__audio {
  position: absolute;
  top: 8px;
  right: 0;
  padding-left: 34px;
  background: url(../../images/icon_audio.svg) no-repeat 0 50%;
  font-size: 20px;
  line-height: 1.55;
  color: inherit
}

.exhibit__link {
  margin-top: 20px
}

.artwork__title {
  text-transform: uppercase
}

.artwork__body {
  margin-top: 54px;
  font-size: 0
}

.artwork__row {
  display: flex;
  overflow: hidden
}

.artwork__row+.artwork__row {
  margin-top: 4px
}

.artwork__row--1 .artwork__column--1 {
  width: 66.5%;
  flex: none
}

.artwork__row--2.artwork__row__main--2 .artwork__column--4 {
  width: 66.5%;
  flex: none
}

.artwork__row--3,
.artwork__row--4 {
  display: none
}

.artwork.is-expanded .artwork__row--3,
.artwork.is-expanded .artwork__row--4 {
  display: flex
}

.artwork__column {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  overflow: hidden
}

.artwork__column+.artwork__column {
  margin-left: 4px
}

.artwork__image {
  cursor: pointer
}

.artwork img {
  width: 100%;
  height: auto;
  transition: transform .3s ease
}

.artwork img:hover {
  transform: scale(1.0625)
}

.artwork__foot {
  text-align: center
}

.artwork__more {
  position: relative;
  display: inline-block;
  margin-top: 40px;
  padding-right: 26px;
  font-size: 16px;
  line-height: 1.6875;
  color: #000
}

.artwork.is-expanded .artwork__more {
  display: none
}

.artwork__more::after,
.artwork__more::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 16px;
  height: 2px;
  background-color: #111;
  margin-top: -1px
}

.artwork__more::before {
  transform: rotate(90deg)
}

.reservation__title {
  text-transform: uppercase
}

.reservation__table {
  table-layout: fixed;
  width: 100%;
  margin-top: 63px;
  text-align: left;
  border-top: 1px solid #111
}

.reservation__td,
.reservation__th {
  border-bottom: 1px solid #111;
  padding-top: 40px;
  padding-bottom: 40px
}

.reservation__th {
  width: calc((208 / 1200) * 100%);
  padding-left: 40px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  color: #111;
  vertical-align: top;
  box-sizing: border-box
}

.reservation__td {
  padding-right: 40px;
  font-size: 20px;
  line-height: 32px;
  color: #666
}

.reservation__td .highlight {
  color: #111
}

/* s:20220621 들여쓰기 없애기 */
.red-txt{color:red; /*margin-left:20px;*/}
/* e:20220621 들여쓰기 없애기 */

.reservation__buttons {
  margin-top: 63px
}

.reservation__buttons .a-button {
  max-width: 384px
}

.reservation__buttons .a-button.a-button--white {
  background-color: inherit
}

.reservation .price-info {
  width: 100%
}

.reservation .price-info thead th {
  padding: 14px;
  font-size: 20px;
  line-height: 32px;
  color: #111;
  text-align: center;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc
}

[lang=en] .reservation .price-info thead th {
  padding-left: 14px;
  padding-right: 14px
}

.reservation .price-info thead th:nth-child(1) {
  width: calc((454 / 952) * 100%)
}

.reservation .price-info thead th:nth-child(2) {
  width: calc((165 / 952) * 100%)
}

.reservation .price-info thead th:nth-child(3) {
  width: calc((165 / 952) * 100%)
}

.reservation .price-info tbody td,
.reservation .price-info tbody th {
  padding: 14px;
  font-size: 20px;
  line-height: 32px;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
  color: #666;
  border-bottom: solid 1px #ccc;
  word-break: break-all
}

[lang=en] .reservation .price-info tbody td,
[lang=en] .reservation .price-info tbody th {
  padding-left: 14px;
  padding-right: 14px;
  word-break: keep-all
}

[lang=en] .reservation .price-info tbody th {
  font-size: 20px;
  line-height: 32px
}

[lang=en] .reservation .price-info tbody th .highlight {
  font-size: 20px;
  line-height: 32px
}

.reservation .price-info tbody td {
  border-left: solid 1px #ccc
}

.intro__item {
  display: flex
}

.intro__item--1 {
  flex-direction: row-reverse
}

.intro__item--1 .intro__body {
  margin-top: 44px;
  margin-right: 40px
}

.intro__item--2 {
  margin-top: 80px
}

.intro__item--2 .intro__body {
  margin-top: 123px;
  margin-left: 40px
}

.intro__head {
  flex: 1;
  width: 49%
}

.intro__head img {
  display: block;
  width: 100%;
  height: auto
}

.intro__body {
  flex: 1
}

.intro__title {
  text-align: left
}

.intro__text {
  color: #666;
  margin-top: 10px;
  font-size: 20px;
  line-height: 34px
}

.intro__link {
  margin-top: 20px
}

.location {
  position: relative;
  padding-bottom: 200px
}

.location__title {
  font-size: 48px;
  font-weight: 700;
  text-align: center
}

.location__table {
  table-layout: fixed;
  width: 100%;
  margin-top: 63px;
  text-align: left
}

.location__td,
.location__th {
  border-top: 1px solid #111;
  padding-top: 40px;
  padding-bottom: 40px
}

.location__th {
  width: 17.3%;
  padding-left: 40px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  color: #111
}

.location__td {
  font-size: 20px;
  line-height: 34px;
  color: #666
}

#the_way_to_visit {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#the_way_to_visit > a {
  width: 40%;
}

#the_way_to_visit > a > img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

.info__link {
  display: flex;
  justify-content: end;
  font-size: 20px;
  line-height: 36px;
  color: #111;
}

.info__link >span {
  display: flex;
  margin-left: 20px;
  cursor: pointer;
}

.info__link >span >img {
  margin-right: 5px;
}

.location__link {
  position: absolute;
  display: inline-block;
  bottom: 160px;
  right: 40px;
  padding-left: 28px;
  font-size: 20px;
  line-height: 36px;
  color: #111
}

.location__link::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 24px;
  height: 24px;
  background: url(../../images/icon_map.svg) no-repeat 50% 50%;
  transform: translateY(-50%)
}

@media (max-width:1280px) and (min-width:769px) {

  .artwork__title,
  .exhibit__title,
  .intro__title,
  .reservation__title {
    font-size: 4vw
  }

  .artwork__title,
  .exhibit__title,
  .intro__title,
  .reservation__title {
    line-height: 5vw
  }

  .exhibit__link,
  .intro__link {
    font-size: 1.6666666667vw
  }

  .exhibit__link,
  .intro__link {
    line-height: 2.25vw
  }

  .main-kv__text {
    font-size: 2.6666666667vw
  }

  .main-kv__text {
    line-height: 3.1666666667vw
  }

  .main-kv__title {
    font-size: 10vw
  }

  .main-kv__title {
    line-height: 12.4166666667vw
  }

  .main__section {
    padding-bottom: 10vw
  }

  .main__section+.main__section {
    padding-top: 10vw
  }

  .main__section.special_artwork {
    margin: 10vw 0 20vw
  }

  .exhibit {
    padding-top: 13.3333333333vw
  }

  .exhibit__item+.exhibit__item {
    margin-top: 20vw
  }

  .exhibit__body {
    margin-top: 5.3333333333vw
  }

  .exhibit__category {
    padding-top: .9166666667vw
  }

  .exhibit__category {
    padding-bottom: .9166666667vw
  }

  .exhibit__category {
    padding-left: 2vw
  }

  .exhibit__category {
    padding-right: 2vw
  }

  .exhibit__category {
    font-size: 1.6666666667vw
  }

  .exhibit__category {
    line-height: 2vw
  }

  .exhibit__subtitle,
  .exhibit__text,
  .exhibit__title {
    padding-right: 20.8333333333vw
  }

  .exhibit__title {
    margin-top: 1.6666666667vw
  }

  .exhibit__subtitle {
    margin-top: 1.6666666667vw
  }

  .exhibit__subtitle {
    font-size: 2.6666666667vw
  }

  .exhibit__subtitle {
    line-height: 3.1666666667vw
  }

  .exhibit__text {
    margin-top: 1.6666666667vw
  }

  .exhibit__text {
    font-size: 1.6666666667vw
  }

  .exhibit__text {
    line-height: 2.8333333333vw
  }

  [lang=en] .exhibit__text {
    line-height: 2.8333333333vw
  }

  .exhibit__period {
    font-size: 2.6666666667vw
  }

  .exhibit__period {
    line-height: 3.3333333333vw
  }

  [lang=en] .exhibit__period {
    font-size: 2.6666666667vw
  }

  [lang=en] .exhibit__period {
    line-height: 3.3333333333vw
  }

  .artwork__body {
    margin-top: 4.5vw
  }

  .reservation__table {
    margin-top: 5.25vw
  }

  .reservation__td,
  .reservation__th {
    padding-top: 3.3333333333vw
  }

  .reservation__td,
  .reservation__th {
    padding-bottom: 3.3333333333vw
  }

  .reservation__th {
    padding-left: 3.3333333333vw
  }

  .reservation__th {
    font-size: 2vw
  }

  .reservation__th {
    line-height: 2.6666666667vw
  }

  .reservation__td {
    font-size: 1.6666666667vw
  }

  .reservation__td {
    line-height: 2.6666666667vw
  }

  .reservation__buttons {
    margin-top: 5.25vw
  }

  .reservation .price-info thead th {
    padding: 1.1666666667vw
  }

  .reservation .price-info thead th {
    font-size: 1.6666666667vw
  }

  .reservation .price-info thead th {
    line-height: 2.6666666667vw
  }

  [lang=en] .reservation .price-info thead th {
    padding-left: 1.1666666667vw
  }

  [lang=en] .reservation .price-info thead th {
    padding-right: 1.1666666667vw
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    padding: 1.1666666667vw
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    font-size: 1.6666666667vw
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    line-height: 2.6666666667vw
  }

  [lang=en] .reservation .price-info tbody td,
  [lang=en] .reservation .price-info tbody th {
    padding-left: 1.1666666667vw
  }

  [lang=en] .reservation .price-info tbody td,
  [lang=en] .reservation .price-info tbody th {
    padding-right: 1.1666666667vw
  }

  [lang=en] .reservation .price-info tbody th {
    font-size: 1.6666666667vw
  }

  [lang=en] .reservation .price-info tbody th {
    line-height: 2.6666666667vw
  }

  [lang=en] .reservation .price-info tbody th .highlight {
    font-size: 1.6666666667vw
  }

  [lang=en] .reservation .price-info tbody th .highlight {
    line-height: 2.6666666667vw
  }

  .intro__item--1 .intro__body {
    margin-top: 3.6666666667vw
  }

  .intro__item--1 .intro__body {
    margin-right: 3.3333333333vw
  }

  .intro__item--2 .intro__body {
    margin-top: 10.25vw
  }

  .intro__item--2 .intro__body {
    margin-left: 3.3333333333vw
  }

  .intro__text {
    margin-top: .8333333333vw
  }

  .intro__text {
    font-size: 1.6666666667vw
  }

  .intro__text {
    line-height: 2.8333333333vw
  }

  .intro__link {
    margin-top: 1.6666666667vw
  }

  .location {
    padding-bottom: 16.6666666667vw
  }

  .location__table {
    margin-top: 5.25vw
  }

  .location__td,
  .location__th {
    padding-top: 3.3333333333vw
  }

  .location__td,
  .location__th {
    padding-bottom: 3.3333333333vw
  }

  .location__th {
    padding-left: 3.3333333333vw
  }

  .location__th {
    font-size: 2vw
  }

  .location__th {
    line-height: 2.6666666667vw
  }

  .location__td {
    font-size: 1.6666666667vw
  }

  .location__td {
    line-height: 2.8333333333vw
  }

  .location__link {
    bottom: 15vw;
  }

  .location__link {
    font-size: 1.6666666667vw
  }

  .location__link {
    line-height: 3vw
  }
}

@media screen and (min-width:1920px) {
  .main-nav {
    left: 50%;
    margin-left: -920px
  }
}

@media screen and (max-width:1400px) {
  .main-nav {
    display: none
  }

  .main__clip {
    display: none
  }
}

@media (max-width:1280px) {
  .notice-popup__wrap {
    transform: translate(-50%, -50%)
  }

  .main-kv__title br {
    display: block
  }

  .banner_close_button{
    width: 25px;
    height: 25px;
    top: 45px;
  }

  .rolling_banner{
    width: 175px;
    height: 175px;
    top: 50px;
  }

  .rolling_banner_container{
    top: 160px;
  }
}

@media (max-width:768px) {
  .main__section {
    padding: 0
  }

  .main__section.special_artwork {
    margin: 80px 0;
  }

  .artwork__title,
  .exhibit__title,
  .intro__title,
  .reservation__title {
    font-size: 28px
  }

  .artwork__title,
  .exhibit__title,
  .intro__title,
  .reservation__title {
    line-height: 40px
  }

  .artwork__title,
  .exhibit__title,
  .intro__title,
  .reservation__title {
    text-align: left
  }

  .exhibit__link,
  .intro__link {
    font-size: 16px
  }

  .exhibit__link,
  .intro__link {
    line-height: 27px
  }

  .main-kv__head {
    top: calc((242 / 812) * 100%)
  }

  .main-kv__text {
    font-size: 18px
  }

  .main-kv__text {
    line-height: 26px
  }

  .main-kv__title {
    font-size: 64px
  }

  .main-kv__title {
    line-height: 60px
  }

  .main-kv__title {
    margin-top: 20px
  }

  /* s:20220531 예약하기 버튼 추가-mo*/
  .ticket-head {
    top: 110%;
  }

  .ticket-head .content-wrap {
    max-width: 330px;
  }

  /* e:20220531 예약하기 버튼 추가*/
  .main-kv .swiper-pagination {
    bottom: 100px
  }

  .main__content {
    padding-left: 20px;
    padding-right: 20px
  }

  .main__section {
    padding-bottom: 40px
  }

  .main__section+.main__section {
    padding-top: 40px
  }

  .exhibit {
    padding-top: 80px
  }

  .exhibit__item {
    padding-top: 56px
  }

  .exhibit__item+.exhibit__item {
    margin-top: 80px
  }

  .exhibit__head::before {
    padding-top: calc((190 / 335) * 100%)
  }

  .exhibit__body {
    margin-top: 20px
  }

  .exhibit__body {
    position: static
  }

  .exhibit__category {
    padding-top: 9px
  }

  .exhibit__category {
    padding-bottom: 9px
  }

  .exhibit__category {
    padding-left: 12px
  }

  .exhibit__category {
    padding-right: 12px
  }

  .exhibit__category {
    font-size: 14px
  }

  .exhibit__category {
    line-height: 17px
  }

  .exhibit__category {
    position: absolute;
    top: 0;
    left: 0
  }

  .exhibit__subtitle,
  .exhibit__text,
  .exhibit__title {
    padding-right: 0
  }

  .exhibit__title {
    margin-top: 0
  }

  .exhibit__subtitle {
    margin-top: 10px
  }

  .exhibit__subtitle {
    font-size: 20px
  }

  .exhibit__subtitle {
    line-height: 31px
  }

  .exhibit__text {
    margin-top: 10px
  }

  .exhibit__text {
    font-size: 16px
  }

  .exhibit__text {
    line-height: 27px
  }

  .exhibit__text {
    max-width: 80%
  }

  [lang=en] .exhibit__text {
    line-height: 24px
  }

  [lang=en] .exhibit__text {
    max-width: none
  }

  .exhibit__period {
    font-size: 18px
  }

  .exhibit__period {
    line-height: 22px
  }

  .exhibit__period {
    position: static;
    display: block;
    margin-top: 20px
  }

  [lang=en] .exhibit__period {
    font-size: 16px
  }

  [lang=en] .exhibit__period {
    line-height: 19.89px
  }

  .exhibit__audio {
    top: 6px;
    width: 24px;
    height: 24px;
    padding: 0
  }

  .exhibit__audio span {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    clip: rect(0, 0, 0, 0)
  }

  .artwork__body {
    margin-top: 20px
  }

  .artwork__row+.artwork__row {
    margin-top: 0
  }

  .artwork__row--1 {
    display: block
  }

  .artwork__row--1 .artwork__column {
    display: flex;
    flex-wrap: nowrap
  }

  .artwork__row--1 .artwork__column--1 {
    width: 100%
  }

  .artwork__row--1 .artwork__column--2 {
    margin: 3px 0
  }

  .artwork__row--1 .artwork__column--2 .artwork__row {
    flex: 1 1 40%
  }

  .artwork__row--1 .artwork__column--2 .artwork__row:first-child {
    margin-right: 3px
  }

  .artwork__row--3 .artwork__column {
    margin: 3px 0
  }

  .artwork__row--2.artwork__row__main--2 .artwork__column {
    display: flex;
    flex-wrap: nowrap
  }

  .artwork__row--2.artwork__row__main--2 .artwork__column--3 {
    margin: 3px 0
  }

  .artwork__row--2.artwork__row__main--2 .artwork__column--3 .artwork__row:first-child {
    margin-right: 3px
  }

  .artwork__row--2.artwork__row__main--2 .artwork__column--4 {
    width: 100%;
  }

  .artwork__row--3 .artwork__column:first-child {
    margin-right: 3px
  }

  .artwork__row--2,
  .artwork__row--4 {
    flex-wrap: wrap
  }

  .artwork__row--2 .artwork__column,
  .artwork__row--4 .artwork__column {
    flex: 1 1 40%
  }

  .artwork__row--2 .artwork__column:first-child,
  .artwork__row--4 .artwork__column:first-child {
    margin-right: 3px
  }

  .artwork__row--2 .artwork__column--3,
  .artwork__row--4 .artwork__column--3 {
    display: block;
    margin-top: 3px
  }

  .artwork__row--2 .artwork__column--3 {
    display: none
  }

  .artwork.is-expanded .artwork__row--2 .artwork__column--3 {
    display: flex
  }

  .artwork__column+.artwork__column {
    margin-left: 0
  }

  .reservation__table {
    margin-top: 20px
  }

  .reservation__table>tbody {
    display: block
  }

  .reservation__row {
    display: block;
    padding: 20px 0;
    border-bottom: 1px solid #111
  }

  .reservation__td,
  .reservation__th {
    padding-top: 0
  }

  .reservation__td,
  .reservation__th {
    padding-bottom: 0
  }

  .reservation__td,
  .reservation__th {
    display: block;
    border-bottom: none;
    box-sizing: border-box
  }

  .reservation__th {
    padding-left: 0
  }

  .reservation__th {
    font-size: 20px
  }

  .reservation__th {
    line-height: 34px
  }

  .reservation__th {
    width: 100%
  }

  .reservation__td {
    font-size: 16px
  }

  .reservation__td {
    line-height: 27px
  }

  .reservation__td {
    margin-top: 10px;
    padding-right: 0
  }

  .reservation__td .slash {
    display: none
  }

  .reservation__buttons {
    margin-top: 20px
  }

  .reservation__buttons .a-button {
    padding: 18px;
    height: 56px;
    font-size: 16px
  }

  .reservation .price-info {
    margin-top: 20px;
    margin-bottom: 10px
  }

  .reservation .price-info thead th {
    padding: 12px
  }

  .reservation .price-info thead th {
    font-size: 12px
  }

  .reservation .price-info thead th {
    line-height: 26px
  }

  [lang=en] .reservation .price-info thead th {
    padding-left: 10px
  }

  [lang=en] .reservation .price-info thead th {
    padding-right: 10px
  }

  .reservation .price-info thead th:nth-child(1) {
    width: calc((127 / 335) * 100%)
  }

  [lang=en] .reservation .price-info thead th:nth-child(1) {
    width: calc((166 / 335) * 100%)
  }

  .reservation .price-info thead th:nth-child(2) {
    width: calc((88 / 335) * 100%)
  }

  [lang=en] .reservation .price-info thead th:nth-child(2) {
    width: calc((93 / 335) * 100%)
  }

  .reservation .price-info thead th:nth-child(3) {
    width: calc((88 / 335) * 100%)
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    padding: 12px
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    font-size: 12px
  }

  .reservation .price-info tbody td,
  .reservation .price-info tbody th {
    line-height: 18px
  }

  [lang=en] .reservation .price-info tbody td,
  [lang=en] .reservation .price-info tbody th {
    padding-left: 10px
  }

  [lang=en] .reservation .price-info tbody td,
  [lang=en] .reservation .price-info tbody th {
    padding-right: 10px
  }

  [lang=en] .reservation .price-info tbody th {
    font-size: 12px
  }

  [lang=en] .reservation .price-info tbody th {
    line-height: 20px
  }

  [lang=en] .reservation .price-info tbody th .highlight {
    font-size: 14px
  }

  [lang=en] .reservation .price-info tbody th .highlight {
    line-height: 20px
  }

  .intro__item {
    flex-wrap: wrap;
    flex-direction: column-reverse
  }

  .intro__item--1 {
    flex-direction: column-reverse
  }

  .intro__item--1 .intro__body {
    margin-top: 0
  }

  .intro__item--1 .intro__body {
    margin-right: 0
  }

  .intro__item--2 .intro__body {
    margin-top: 0
  }

  .intro__item--2 .intro__body {
    margin-left: 0
  }

  .intro__head {
    width: 100%;
    flex: none
  }

  .intro__body {
    margin: 0 0 32px !important
  }

  .intro__text {
    margin-top: 20px
  }

  .intro__text {
    font-size: 16px
  }

  .intro__text {
    line-height: 27px
  }

  .intro__link {
    margin-top: 10px
  }

  .location {
    padding-bottom: 140px
  }

  .location__title {
    font-size: 24px;
    line-height: 1.5416666667;
    text-align: left
  }

  .location__table {
    margin-top: 20px
  }

  .location__table>tbody {
    display: block
  }

  .location__row {
    display: block;
    padding: 20px 0;
    border-top: 1px solid #111
  }

  .location__td,
  .location__th {
    padding-top: 0
  }

  .location__td,
  .location__th {
    padding-bottom: 0
  }

  .location__td,
  .location__th {
    display: block;
    border-top: none;
    box-sizing: border-box
  }

  .location__th {
    padding-left: 0
  }

  .location__th {
    font-size: 20px
  }

  .location__th {
    line-height: 34px
  }

  .location__th {
    width: 100%
  }

  .location__td {
    font-size: 16px
  }

  .location__td {
    line-height: 27px
  }

  .location__td {
    margin-top: 8px
  }

  #the_way_to_visit {
    display: block;
  }

  .info__link {
    justify-content: left;
  }

  .info__link >span {
    margin-left: 0;
  }

  .info__link >span:nth-child(2) {
    display: none;
  }

  .location__link {
    bottom: 0
  }

  .location__link {
    font-size: 18px
  }

  .location__link {
    line-height: 24px
  }

  .location__link {
    top: 49px;
    bottom: auto;
    right: 0;
    padding-left: 24px;
    text-indent: -9999px
  }

  .banner_close_button{
    width: 15px;
    height: 15px;
    top: -75px;
  }

  .rolling_banner{
    width: 100px;
    height: 100px;
    top: -70px;
  }

  .rolling_banner_container{
    top: 160px;
  }

}