@charset "UTF-8";
/*
AUTH : ssooya
VERSION : version 2
*/
/**********
펑션
***********/
/**********
텍스트 자간
***********/
/**********
텍스트 말줄임
***********/
/**********
아이콘
***********/

.vr-container {
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 50;
  /* HTML5 display-role reset for older browsers */
  /** ios reset **/
}
@media (max-width: 1080px) {
  .vr-container {
    padding-bottom: 15px;
  }
}
.vr-container .blind {
  display: none;
}
.vr-container button {
  outline: none;
}
.vr-container html, .vr-container body, .vr-container div, .vr-container span, .vr-container applet, .vr-container object, .vr-container iframe,
.vr-container h1, .vr-container h2, .vr-container h3, .vr-container h4, .vr-container h5, .vr-container h6, .vr-container p, .vr-container blockquote, .vr-container pre,
.vr-container a, .vr-container abbr, .vr-container acronym, .vr-container address, .vr-container big, .vr-container cite, .vr-container code,
.vr-container del, .vr-container dfn, .vr-container em, .vr-container img, .vr-container ins, .vr-container kbd, .vr-container q, .vr-container s, .vr-container samp,
.vr-container strike, .vr-container strong, .vr-container sub, .vr-container sup, .vr-container tt, .vr-container var,
.vr-container b, .vr-container u, .vr-container i, .vr-container center,
.vr-container dl, .vr-container dt, .vr-container dd, .vr-container ol, .vr-container ul, .vr-container li,
.vr-container fieldset, .vr-container form, .vr-container label, .vr-container legend,
.vr-container table, .vr-container caption, .vr-container tbody, .vr-container tfoot, .vr-container thead, .vr-container tr, .vr-container th, .vr-container td,
.vr-container article, .vr-container aside, .vr-container canvas, .vr-container details, .vr-container embed,
.vr-container figure, .vr-container figcaption, .vr-container footer, .vr-container header, .vr-container hgroup,
.vr-container menu, .vr-container nav, .vr-container output, .vr-container ruby, .vr-container section, .vr-container summary,
.vr-container time, .vr-container mark, .vr-container audio, .vr-container video, .vr-container textarea, .vr-container input, .vr-container select {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  /* font-family: "Pretendard", sans-serif; */
  color: #191919;
  vertical-align: baseline; /* a안 img가 들어갈 때 a를 위로 정렬시켜 여백을 없앨 때 사용 */
}
.vr-container article, .vr-container aside, .vr-container details, .vr-container figcaption, .vr-container figure,
.vr-container footer, .vr-container header, .vr-container hgroup, .vr-container menu, .vr-container nav, .vr-container section {
  display: block;
}
.vr-container body {
  line-height: 1; /* 한글 기준은 1.2 */
}
.vr-container ol, .vr-container ul {
  list-style: none;
}
.vr-container blockquote, .vr-container q {
  quotes: none;
}
.vr-container blockquote:before, .vr-container blockquote:after,
.vr-container q:before, .vr-container q:after {
  content: none;
}
.vr-container textarea {
  outline: none;
}
.vr-container table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
.vr-container a {
  text-decoration: none;
  color: inherit;
  display: inline-block;
}
.vr-container i {
  display: inline-block;
  vertical-align: middle;
}
.vr-container strong {
  font-weight: 700;
}
.vr-container th, .vr-container td {
  vertical-align: middle;
}
.vr-container button {
  background: transparent;
  padding: 0;
  /* outline: none; */ /* 웹접근성개선 2025 new */
  border: none;
  cursor: pointer;
  /* font-family: "Pretendard"; */
}
.vr-container * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /** flex word reset **/
  word-break: break-word;
  word-wrap: break-word;
}
.vr-container span, .vr-container div {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  color: inherit;
}
.vr-container select::-ms-expand {
  display: none;
}
.vr-container b {
  color: inherit;
  font-family: inherit;
}
.vr-container input {
  box-shadow: none;
  border: 0;
  background-clip: padding-box;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}
.vr-container * {
  -webkit-tap-highlight-color: transparent !important;
}

section.item-note .note-msg-box {
  color: #aaa;
  font-size: 14px;
  line-height: 24px;
  padding-top: 24px;
}
section.item-note .note-msg-box b {
  color: #000;
}
@media (max-width: 1080px) {
  section.item-note .note-msg-box {
    padding: 15px 15px 0;
    font-size: 13px;
    line-height: 19px;
  }
}

section.item-viewer {
  aspect-ratio: 1600/800;
  position: relative;
  max-width: 1600px;
  width: 100%;
  overflow: hidden;
}
section.item-viewer.overlay:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 500;
  background-color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 1080px) {
  section.item-viewer {
    width: 100%;
    height: auto;
    aspect-ratio: 390/520;
  }
}
section.item-viewer .viewer-intro {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 99;
  padding-top: 240px;
  padding-left: 100px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro {
    width: 100%;
    height: 100%;
    transform: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 24px 20px;
  }
}
section.item-viewer .viewer-intro .sub-box {
  color: rgba(255, 255, 255, 0.8);
  font-size: 32px;
  line-height: 120%;
  font-weight: 300;
  letter-spacing: -0.04em;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .sub-box {
    font-size: 16px;
  }
}
section.item-viewer .viewer-intro .subject-box {
  padding-top: 16px;
  letter-spacing: -0.02em;
  font-weight: 700;
  font-size: 46px;
  line-height: 120%;
  color: #fff;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .subject-box {
    padding-top: 4px;
    font-size: 20px;
    letter-spacing: -0.02em;
    line-height: 120%;
  }
}
section.item-viewer .viewer-intro .con-box {
  padding-top: 30px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 22px;
  line-height: 120%;
  letter-spacing: -0.02em;
}
section.item-viewer .viewer-intro .con-box b {
  color: #fff;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .con-box {
    padding-top: 16px;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: -0.02em;
  }
}
section.item-viewer .viewer-intro .menu-box {
  display: flex;
  padding-top: 60px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .menu-box {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    justify-content: center;
  }
}
section.item-viewer .viewer-intro .menu-box .menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 25px;
  height: 70px;
  background-color: rgba(245, 245, 245, 0.9);
  padding: 0 40px;
  transition: background 0.1s linear;
}
/* 웹접근성개선 - S */
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .menu-box .menu-btn {
    height: 44px;
    border-radius: 15px;
    padding: 0 20px 0 25px;
  }
  section.item-viewer .viewer-intro .menu-box .menu-btn:hover,
  section.item-viewer .viewer-intro .menu-box .menu-btn:focus {
    border-radius: 15px !important;
  }
}
section.item-viewer .viewer-intro .menu-box .menu-btn:hover,
section.item-viewer .viewer-intro .menu-box .menu-btn:focus {
  border-radius: 25px;
  background-color: #353535;
  box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(7.5px);
}
section.item-viewer .viewer-intro .menu-box .menu-btn:hover .ic.ic-link,
section.item-viewer .viewer-intro .menu-box .menu-btn:focus .ic.ic-link {
  background: url("../img/ic_link_arrow_hover.svg") no-repeat center/cover;
}
section.item-viewer .viewer-intro .menu-box .menu-btn:hover .txt,
section.item-viewer .viewer-intro .menu-box .menu-btn:focus .txt {
  color: #fff;
}
/* 웹접근성개선 - E */
section.item-viewer .viewer-intro .menu-box .menu-btn .ic {
  margin-left: 5px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .menu-box .menu-btn .ic {
    margin-left: 0;
  }
}
section.item-viewer .viewer-intro .menu-box .menu-btn .ic.ic-link {
  background: url("../img/ic_link_arrow.svg") no-repeat center/cover;
  width: 32px;
  height: 32px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .menu-box .menu-btn .ic.ic-link {
    width: 18px;
    height: 18px;
  }
}
section.item-viewer .viewer-intro .menu-box .menu-btn .txt {
  color: #000; /*웹접근성 개선 디자인 변경으로인해 컬러 수정 */
  font-weight: 700;
  font-size: 22px;
  line-height: 120%;
  letter-spacing: -0.04em;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-intro .menu-box .menu-btn .txt {
    font-size: 14px;
  }
}
section.item-viewer .viewer-menu {
  display: flex;
  align-items: center;
  z-index: 99;
  position: absolute;
  left: 50px;
  bottom: 36px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-menu {
    left: 20px;
    bottom: 20px;
  }
}
section.item-viewer .viewer-menu .viewer-menu-box + .viewer-menu-box {
  margin-left: 20px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-menu .viewer-menu-box + .viewer-menu-box {
    margin-left: 8px;
  }
}
section.item-viewer .viewer-menu .viewer-menu-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
section.item-viewer .viewer-menu .viewer-menu-btn .icon-box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
section.item-viewer .viewer-menu .viewer-menu-btn .icon-box .ic {
  width: 80px;
  height: 80px;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-menu .viewer-menu-btn .icon-box .ic {
    width: 48px;
    height: 48px;
  }
}
section.item-viewer .viewer-menu .viewer-menu-btn .icon-box .ic.ic-interior {
  background: url("../img/ic_view_menu_interior.svg") no-repeat center/cover;
}
section.item-viewer .viewer-menu .viewer-menu-btn .icon-box .ic.ic-rotate {
  background: url("../img/ic_view_menu_rotate.gif") no-repeat center/cover;
}
section.item-viewer .viewer-menu .viewer-menu-btn .name-box {
  padding-top: 3px;
  font-size: 17px;
  line-height: 26px;
  letter-spacing: -0.06em;
  color: #666666;
  font-weight: 700;
}
@media (max-width: 1080px) {
  section.item-viewer .viewer-menu .viewer-menu-btn .name-box {
    font-size: 11px;
    line-height: 16px;
  }
}
section.item-viewer .view-frame {
  height: 100%;
  display: flex;
  position: relative;
  background: url("../img/visual_bg_PC.jpg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  section.item-viewer .view-frame {
    background: url("../img/visual_bg_M.jpg") no-repeat center/cover;
  }
}
section.item-viewer .view-frame img {
  will-change: transform;
  transition: all 5s linear;
  object-fit: cover;
  position: relative;
  width: 100%;
  transform: scale(1);
}
section.item-viewer .view-frame img.active {
  transform: scale(1.05);
}
@keyframes zoom {
  100% {
    transform: scale(1.05);
  }
}
section.item-viewer .view-frame map area {
  cursor: pointer;
}
section.item-viewer .frame-item {
  position: absolute;
}
section.item-viewer .frame-item.item1 {
  top: 103px;
  right: 635px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item.item1 {
    top: 146px;
    right: 221px;
  }
}
section.item-viewer .frame-item.item1 .frame-btn .num-box {
  left: -50px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item.item1 .frame-btn .num-box {
    left: -15px;
  }
}
section.item-viewer .frame-item.item2 {
  top: 121px;
  right: 115px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item.item2 {
    top: 108px;
    right: 14px;
  }
}
section.item-viewer .frame-item.item2:after {
  content: "";
  position: absolute;
  left: -40px;
  bottom: -56px;
  background: url("../img/ic_view_line.svg") no-repeat center/cover;
  width: 93px;
  height: 56px;
  z-index: 10;
}
section.item-viewer .frame-item.item3 {
  right: 354px;
  top: 450px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item.item3 {
    top: 308px;
    right: 96px;
  }
}
section.item-viewer .frame-item .frame-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
section.item-viewer .frame-item .frame-btn .num-box {
  font-weight: 200;
  position: absolute;
  left: -30px;
  bottom: 110px;
  color: #888888;
  font-size: 110px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item .frame-btn .num-box {
    left: -10px;
    bottom: 65px;
    font-size: 48px;
    line-height: 65px;
  }
}
section.item-viewer .frame-item .frame-btn .view-box {
  width: 80px;
  height: 80px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(7.5px);
  -webkit-backdrop-filter: blur(7.5px);
  border-radius: 24px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item .frame-btn .view-box {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }
}
section.item-viewer .frame-item .frame-btn .view-box .ic-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item .frame-btn .view-box .ic-box {
    width: 48px;
    height: 48px;
  }
}
section.item-viewer .frame-item .frame-btn .view-box .ic-box .ic-view {
  width: 20px;
  height: 20px;
  background: url("../img/ic_view.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item .frame-btn .view-box .ic-box .ic-view {
    width: 12px;
    height: 12px;
  }
}
section.item-viewer .frame-item .frame-btn .txt-box {
  padding-top: 6px;
  text-align: center;
  color: #888;
  font-size: 18px;
  letter-spacing: -0.05em;
  line-height: 27px;
}
@media (max-width: 1080px) {
  section.item-viewer .frame-item .frame-btn .txt-box {
    font-size: 11px;
    line-height: 15px;
  }
}
section.item-viewer .frame-item .frame-btn .txt-box.type-white {
  color: #fff;
}

article.video-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 100;
  display: none;
}
article.video-layer .layer-wrap {
  display: flex;
  width: 100%;
  height: 100%;
}
article.video-layer .layer-wrap .shadow1 {
  height: 140px;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 101;
  background: var(--dim-15, linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 100%));
}
@media (max-width: 1080px) {
  article.video-layer .layer-wrap .shadow1 {
    height: 80px;
  }
}
article.video-layer .layer-wrap .shadow2 {
  height: 220px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 101;
  background: var(--dim-15, linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 100%));
  transform: rotate(180deg);
}
@media (max-width: 1080px) {
  article.video-layer .layer-wrap .shadow2 {
    height: 140px;
  }
}
article.video-layer .layer-wrap .video-bg-layer {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
}
article.video-layer .layer-wrap .video-bg-layer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
article.video-layer .layer-wrap .video-poster {
  display: none !important;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 101;
}
article.video-layer .layer-wrap .video-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
article.video-layer .layer-wrap #videoPlayer1, article.video-layer .layer-wrap #videoPlayer2, article.video-layer .layer-wrap #videoPlayer3 {
  display: none;
}
article.video-layer .layer-wrap video {
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  background-color: #000;
}
article.video-layer .layer-wrap video source {
  display: none;
}
article.video-layer .layer-wrap video source:first-child {
  display: block;
}

article.video-back-layer {
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 200;
  display: none;
}
@media (max-width: 1080px) {
  article.video-back-layer {
    top: 20px;
    left: 20px;
  }
}
/* 웹접근성 개선 : 홈버튼 이미지 디자인 변경 - S */
article.video-back-layer .video-menu-home-btn {
  border-radius: 20px;
  box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(7.5px);
  background: url("../img/ic_video_menu_home.svg") no-repeat center/cover;
  width: 70px;
  height: 70px;
}
@media (max-width: 1080px) {
  article.video-back-layer .video-menu-home-btn {
    background: url("../img/ic_video_menu_home_m.svg") no-repeat center/cover;
    border-radius: 12px;
    width: 44px;
    height: 44px;
  }
}
article.video-back-layer .video-menu-home-btn:focus,
article.video-back-layer .video-menu-home-btn:hover {
  background: url("../img/ic_video_menu_home_white.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-back-layer .video-menu-home-btn:focus,
  article.video-back-layer .video-menu-home-btn:hover {
    background: url("../img/ic_video_menu_home_m_white.svg") no-repeat center/cover;  
  }
}
/* 웹접근성 개선 : 홈버튼 이미지 디자인 변경 - E */
/* 웹접근성개선 2025 new - S */
article.video-menu-layer {
  position: absolute;
  left: 30px;
  bottom: 40px;
  z-index: 300;
  display: none;
}
@media (max-width: 1080px) {
  article.video-menu-layer {
    left: 20px;
    bottom: auto;
    top: 74px;
  }
}
article.video-menu-layer .video-menu-box .video-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  background: rgba(255,255,255,.7);
}
article.video-menu-layer .video-menu-box .video-menu-btn:is(:hover, :focus) {background: rgba(0,0,0,.65);}
@media (max-width: 1080px) {
  article.video-menu-layer .video-menu-box .video-menu-btn {
    width: 44px;
    height: 44px;
    border-radius: 12px;
  }
}
article.video-menu-layer .video-menu-box .video-menu-btn.pause .ic-toggle {
  background: url("../img/ic_video_menu_pause.svg") no-repeat center/38px 38px;
}
article.video-menu-layer .video-menu-box .video-menu-btn.pause:is(:hover, :focus) .ic-toggle {background-image:url("../img/ic_video_menu_pause_white.svg");}
@media (max-width: 1080px) {
  article.video-menu-layer .video-menu-box .video-menu-btn.pause .ic-toggle {
    background-size: 24px 24px;
  }
}
article.video-menu-layer .video-menu-box .video-menu-btn .video-progress {
  z-index: 10;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(8);
  transition: all 0.2s linear;
  display: none;
}
article.video-menu-layer .video-menu-box .video-menu-btn .video-menu-bg {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
}
article.video-menu-layer .video-menu-box .video-menu-btn .ic-toggle {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: url("../img/ic_video_menu_play.svg") no-repeat center/38px 38px;
  width: 100%;
  height: 100%;
}
article.video-menu-layer .video-menu-box .video-menu-btn:is(:hover, :focus) .ic-toggle {background-image:url("../img/ic_video_menu_play_white.svg");}
@media (max-width: 1080px) {
  article.video-menu-layer .video-menu-box .video-menu-btn .ic-toggle {
    background-size: 24px 24px;
  }
}
/* 웹접근성개선 2025 new - E */
article.video-sound-layer {
  display: none;
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 101;
}
@media (max-width: 1080px) {
  article.video-sound-layer {
    top: 20px;
    right: 20px;
  }
}
article.video-sound-layer .sound-msg-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-msg-box {
    margin-right: 8px;
  }
}
article.video-sound-layer .sound-msg-box .ic.ic-volume {
  background: url("../img/ic_volume.svg") no-repeat center/cover;
  width: 24px;
  height: 24px;
  margin-right: 10px;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-msg-box .ic.ic-volume {
    margin-right: 6px;
    width: 18px;
    height: 18px;
  }
}
article.video-sound-layer .sound-msg-box .txt {
  color: rgba(255, 255, 255, 0.8);
  font-size: 20px;
  line-height: 120%;
  font-weight: 400;
  letter-spacing: -0.04em;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-msg-box .txt {
    font-size: 12px;
  }
}
article.video-sound-layer .sound-toggle-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* 250317 웹접근성 개선 : hover,focus 디자인 추가 / 이미지 확장자 변경 (png -> svg) - S */
article.video-sound-layer .sound-toggle-box .sound-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: url("../img/ic_sound_off.svg") no-repeat center/cover;
  width: 70px;
  height: 70px;
  box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(7.5px);
  border-radius: 20px;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn {
    background: url("../img/ic_sound_off_m.svg") no-repeat center/cover;
    border-radius: 12px;
    width: 44px;
    height: 44px;
  }
}
article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active {
  background: url("../img/ic_sound_on.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active {
    background: url("../img/ic_sound_on_m.svg") no-repeat center/cover;
  }
}
article.video-sound-layer .sound-toggle-box .sound-toggle-btn:hover,
article.video-sound-layer .sound-toggle-box .sound-toggle-btn:focus {
  background: url("../img/ic_sound_off_white.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn:hover,
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn:focus {
    background: url("../img/ic_sound_off_m_white.svg") no-repeat center/cover;
  }
}

article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active:hover,
article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active:focus {
  background: url("../img/ic_sound_on_white.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active:hover,
  article.video-sound-layer .sound-toggle-box .sound-toggle-btn.active:focus {
    background: url("../img/ic_sound_on_m_white.svg") no-repeat center/cover;
  }
}
/* 250317 웹접근성 개선 : hover,focus 디자인 추가 / 이미지 확장자 변경 (png -> svg) - E */
article.video-selector-floating {
  position: absolute;
  left: 50%;
  bottom: 40px;
  transform: translateX(-50%);
  z-index: 200;
  display: none;
}
@media (max-width: 1080px) {
  article.video-selector-floating {
    bottom: 20px;
    left: 20px; /* 웹접근성개선 2025 new */
    right: 20px; /* 웹접근성개선 2025 new */
    transform: none;
    max-width: none; /* 웹접근성개선 2025 new */
    margin: 0 auto;
  }
}
article.video-selector-floating .selector-msg-box {
  position: absolute;
  top: -51px;
  left: 0;
  right: 0;
  text-align: center;
  color: #fff;
  font-size: 25px;
  line-height: 120%;
  font-weight: 500;
  letter-spacing: -0.04em;
  white-space: pre; /* 웹접근성 개선 */
}
article.video-selector-floating .selector-msg-box .blind {display:block;} /* 웹접근성개선 2025 new */
@media (max-width: 1080px) {
  article.video-selector-floating .selector-msg-box {
    top: auto;
    bottom: 54px;
    font-size: 14px;
    line-height: 140%;
  }
  article.video-selector-floating .selector-msg-box .mobile-enter {
    display: block;
  }
}
article.video-selector-floating .selector-list {
  border-radius: 25px;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
  /* padding: 17px 35px 17px; */
  padding: 0; /* 웹접근성 개선 */
  display: flex;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list {
    /* 웹접근성 개선 */
    width: auto; /* 웹접근성개선 2025 new */
    border-radius: 15px;
    padding: 0;
  }
}
/* 웹접근성 개선 - S */
article.video-selector-floating .selector-list .selector-btn {
  width: 220px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  flex-direction: column;
  padding: 17px 5px;
}
article.video-selector-floating .selector-list .selector-btn:first-child {
  padding-left: 35px;
  border-radius: 25px 0 0 25px;
}
article.video-selector-floating .selector-list .selector-btn:last-child {
  padding-right:35px;
  border-radius: 0 25px 25px 0;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn {
    width: 100%;
    padding: 10px 0;
    min-width: auto; /* 웹접근성개선 2025 new */
    white-space: nowrap; /* 웹접근성개선 2025 new */
  }
  
  article.video-selector-floating .selector-list .selector-btn:first-child {
    padding-left: 16px !important;
    padding-right: 5px;
    border-radius: 15px 0 0 15px;
  }
  article.video-selector-floating .selector-list .selector-btn:last-child {
    padding-right: 16px !important;
    border-radius: 0 15px 15px 0;
  }
  article.video-selector-floating .selector-list .selector-btn + .selector-btn {
    padding: 0 5px;
  }
  article.video-selector-floating .selector-list .selector-btn + .selector-btn:last-child {
    padding-left: 5px;
  }
}
/* article.video-selector-floating .selector-list .selector-btn + .selector-btn {
  margin-left: 10px;
} */
/* 웹접근성 개선 - E */
/* as-is 
article.video-selector-floating .selector-list .selector-btn.active .info-box {
  opacity: 1;
}
article.video-selector-floating .selector-list .selector-btn.active .progress-box {
  opacity: 1;
}
article.video-selector-floating .selector-list .selector-btn.active .progress-box .selector-menu-bg {
  background-color: #fff;
} */

/* 웹접근성 개선 250317 추가(컨텐츠바로가기 버튼) - S */
.conts-btn-wrap .conts-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 25px;
    height: 70px;
    background-color: rgba(245, 245, 245, 0.9);
    padding: 0 40px;
    transition: background 0.1s linear;
    position: absolute;
    bottom: 100px;
    right: 100px;     
}
@media (max-width: 1080px) {
  .conts-btn-wrap .conts-btn {      
    bottom: 40px;  
    left: 50%;
    right: 0;
    height: 44px;
    transform: translateX(-50%);
    padding: 0 20px 0 25px;
    border-radius: 15px !important;    
  }
}
 .conts-btn-wrap .conts-btn .txt {
    color: #000;
     font-weight: 700;
     font-size: 22px;
     line-height: 120%;
     letter-spacing: -0.04em;
}
@media (max-width: 1080px) {
  .conts-btn-wrap .conts-btn .txt {
    font-size: 14px;
  }
}
 .conts-btn-wrap .conts-btn .ic.ic-link {
    width:32px;
     height:32px;
     background: url("../img/ic_link_arrow.svg") no-repeat center/cover;
     margin-left: 5px;
}
@media (max-width: 1080px) {
  .conts-btn-wrap .conts-btn .ic.ic-link {
    width: 18px;
    height: 18px;
  }
}
.conts-btn-wrap .conts-btn:hover,
.conts-btn-wrap .conts-btn:focus {
  border-radius: 25px;
    background: #282624;
  /* blur&shadow PC */
    box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(7.5px);
}
.conts-btn-wrap .conts-btn:hover .ic.ic-link,
.conts-btn-wrap .conts-btn:focus .ic.ic-link {
  background: url("../img/ic_link_arrow_hover.svg") no-repeat center/cover;
}
.conts-btn-wrap .conts-btn:hover .txt,
.conts-btn-wrap .conts-btn:focus .txt {
  color:#fff;
}
/* 웹접근성 개선 250317 추가(컨텐츠바로가기 버튼) - E */

/* 웹접근성 개선 - S */
article.video-selector-floating .selector-list .selector-btn.active,
article.video-selector-floating .selector-list .selector-btn:focus,
article.video-selector-floating .selector-list .selector-btn:hover {
  background: rgba(101,100,99,0.8);
}
article.video-selector-floating .selector-list .selector-btn.active .info-box .info-txt,
article.video-selector-floating .selector-list .selector-btn:focus .info-box .info-txt,
article.video-selector-floating .selector-list .selector-btn:hover .info-box .info-txt {
  color: #fff;
}
article.video-selector-floating .selector-list .selector-btn.active .info-box,
article.video-selector-floating .selector-list .selector-btn:focus .info-box,
article.video-selector-floating .selector-list .selector-btn:hover .info-box {
  opacity: 1;
}
article.video-selector-floating .selector-list .selector-btn.active .progress-box,
article.video-selector-floating .selector-list .selector-btn:focus .progress-box,
article.video-selector-floating .selector-list .selector-btn:hover .progress-box {
  opacity: 1;
}
article.video-selector-floating .selector-list .selector-btn.active .progress-box .selector-menu-bg,
article.video-selector-floating .selector-list .selector-btn:focus .progress-box .selector-menu-bg,
article.video-selector-floating .selector-list .selector-btn:hover .progress-box .selecton-menu-bg {
  background-color: #fff;
}

article.video-selector-floating .selector-list .selector-btn .info-box {
  padding-bottom: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* opacity: 0.3; */
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box {
    padding-bottom: 8px;
  }
}
article.video-selector-floating .selector-list .selector-btn .info-box .info-txt {
  font-size: 22px;
  line-height: 26px;
  color: #000; /* 웹접근성 개선 디자인 변경으로인한 컬러 수정 */
  font-weight: 500;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box .info-txt {
    position: relative;
    top: 1px;
    font-size: 11px;
    line-height: 13px;
  }
}
article.video-selector-floating .selector-list .selector-btn .info-box .ic {
  margin-right: 4px;
  position: static;
  transform: none;
  width: 28px;
  height: 28px;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box .ic {
    margin-right: 2px;
    width: 13px;
    height: 13px;
  }
}
article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item1 {
  background: url("../img/ic_exp_item1.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item1 {
    background: url("../img/ic_exp_item1_m.svg") no-repeat center/cover;
  }
}
article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item2 {
  background: url("../img/ic_exp_item2.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item2 {
    background: url("../img/ic_exp_item2_m.svg") no-repeat center/cover;
  }
}
article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item3 {
  background: url("../img/ic_exp_item3.svg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .info-box .ic.ic-exp-item3 {
    background: url("../img/ic_exp_item3_m.svg") no-repeat center/cover;
  }
}

/* 웹접근성 개선 디자인 변경 : S */
article.video-selector-floating .selector-list .selector-btn.active .info-box .ic.ic-exp-item1,
article.video-selector-floating .selector-list .selector-btn:hover .info-box .ic.ic-exp-item1,
article.video-selector-floating .selector-list .selector-btn:focus .info-box .ic.ic-exp-item1 {
  background: url("../img/ic_exp_item1_white.svg") no-repeat center/cover;
}
article.video-selector-floating .selector-list .selector-btn.active .info-box .ic.ic-exp-item2,
article.video-selector-floating .selector-list .selector-btn:hover .info-box .ic.ic-exp-item2,
article.video-selector-floating .selector-list .selector-btn:focus .info-box .ic.ic-exp-item2 {
  background: url("../img/ic_exp_item2_white.svg") no-repeat center/cover;
}

article.video-selector-floating .selector-list .selector-btn.active .info-box .ic.ic-exp-item3,
article.video-selector-floating .selector-list .selector-btn:hover .info-box .ic.ic-exp-item3,
article.video-selector-floating .selector-list .selector-btn:focus .info-box .ic.ic-exp-item3 {
  background: url("../img/ic_exp_item3_white.svg") no-repeat center/cover;
}
/* 웹접근성 개선 디자인 변경 : E */

article.video-selector-floating .selector-list .selector-btn .progress-box {
  overflow: hidden;
  position: relative;
  width: 100%;
  border-radius: 99px;
}
article.video-selector-floating .selector-list .selector-btn .selector-progress {
  z-index: 10;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: red;
  backdrop-filter: blur(8);
  transition: all 0.2s linear;
}
article.video-selector-floating .selector-list .selector-btn .selector-menu-bg {
  width: 100%;
  background: rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6px;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .selector-menu-bg {
    height: 4px;
  }
}
article.video-selector-floating .selector-list .selector-btn .ic {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
article.video-selector-floating .selector-list .selector-btn .ic.ic-design1 {
  background: url("../img/design/ic_design1.svg") no-repeat center/cover;
  width: 47px;
  height: 36px;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .ic.ic-design1 {
    width: 24px;
    height: 18px;
  }
}
article.video-selector-floating .selector-list .selector-btn .ic.ic-design2 {
  background: url("../img/design/ic_design2.svg") no-repeat center/cover;
  width: 40px;
  height: 42px;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .ic.ic-design2 {
    width: 22px;
    height: 23px;
  }
}
article.video-selector-floating .selector-list .selector-btn .ic.ic-design3 {
  background: url("../img/design/ic_design3.svg") no-repeat center/cover;
  width: 38px;
  height: 38px;
}
@media (max-width: 1080px) {
  article.video-selector-floating .selector-list .selector-btn .ic.ic-design3 {
    width: 21px;
    height: 21px;
  }
}

article.video-finish-layer {
  z-index: 101;
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: url("../img/finish_bg_PC.jpg") no-repeat center/cover;
}
@media (max-width: 1080px) {
  article.video-finish-layer {
    background: url("../img/finish_bg_M.jpg") no-repeat center/cover;
  }
}
article.video-finish-layer .layer-intro {
  opacity: 0;
  position: absolute;
  left: 90px;
  top: 280px;
  z-index: 99;
  transition: opacity 0.3s linear;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-intro {
    top: 0;
    left: 0;
    right: 0;
    padding: 24px 20px;
  }
}
article.video-finish-layer .layer-intro .sub-box {
  color: rgba(255, 255, 255, 0.8);
  font-size: 32px;
  letter-spacing: -0.04em;
  line-height: 120%;
  font-weight: 300;
  padding-bottom: 16px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-intro .sub-box {
    line-height: 120%;
    font-size: 16px;
    padding-bottom: 4px;
  }
}
article.video-finish-layer .layer-intro .subject-box {
  letter-spacing: -0.02em;
  font-weight: 700;
  font-size: 46px;
  line-height: 140%;
  color: #fff;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-intro .subject-box {
    line-height: 120%;
    font-size: 20px;
  }
  article.video-finish-layer .layer-intro .subject-box br {
    display: none;
  }
}
article.video-finish-layer .layer-menu {
  opacity: 0;
  position: absolute;
  right: 220px;
  top: 180px;
  z-index: 101;
  transition: opacity 0.3s linear;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu {
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    padding: 0 33px;
  }
}
article.video-finish-layer .layer-menu .tit-box {
  padding-bottom: 60px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 500;
  font-size: 30px;
  line-height: 120%;
  letter-spacing: -0.02em;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .tit-box {
    font-size: 14px;
    padding-bottom: 28px;
  }
}
article.video-finish-layer .layer-menu .tit-box b {
  color: #fff;
}
article.video-finish-layer .layer-menu .menu-box {
  position: relative;
  padding: 0 19px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box {
    padding: 0;
  }
}
article.video-finish-layer .layer-menu .menu-box + .menu-box {
  margin-top: 50px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box + .menu-box {
    margin-top: 20px;
  }
}
article.video-finish-layer .layer-menu .menu-box .order-box {
  position: absolute;
  left: -8px;
  top: -24px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .order-box {
    left: -20px;
    top: -8px;
  }
}
article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order1 {
  background: url("../img/img_finish_menu_order1.svg") no-repeat center/cover;
  width: 17px;
  height: 56px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order1 {
    background: url("../img/img_finish_menu_order1_M.svg") no-repeat center left 4px;
    width: 20px;
    height: 28px;
  }
}
article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order2 {
  background: url("../img/img_finish_menu_order2.svg") no-repeat center/cover;
  width: 40px;
  height: 57px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order2 {
    background: url("../img/img_finish_menu_order2_M.svg") no-repeat center/cover;
    width: 20px;
    height: 29px;
  }
}
article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order3 {
  background: url("../img/img_finish_menu_order3.svg") no-repeat center/cover;
  width: 38px;
  height: 57px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .order-box .ic.ic-order3 {
    background: url("../img/img_finish_menu_order3_M.svg") no-repeat center/cover;
    width: 20px;
    height: 29px;
  }
}
article.video-finish-layer .layer-menu .menu-box .menu-btn {
  position: relative;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 70px;
  border-radius: 25px;
  width: 260px;
  background-color: #dfdfdf;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .menu-btn {
    width: 135px;
    height: 44px;
    border-radius: 15px;
  }
}
/* 웹접근성 개선 - S : focus 추가 */
article.video-finish-layer .layer-menu .menu-box .menu-btn:hover,
article.video-finish-layer .layer-menu .menu-box .menu-btn:focus {
  background: rgba(101,100,99,0.8);
  box-shadow: 4px 4px 20px 0px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(7.5px);
}
article.video-finish-layer .layer-menu .menu-box .menu-btn:hover .ic.ic-exp-item1,
article.video-finish-layer .layer-menu .menu-box .menu-btn:focus .ic.ic-exp-item1 {
  background: url("../img/ic_exp_item1_white.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn:hover .ic.ic-exp-item2,
article.video-finish-layer .layer-menu .menu-box .menu-btn:focus .ic.ic-exp-item2 {
  background: url("../img/ic_exp_item2_white.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn:hover .ic.ic-exp-item3,
article.video-finish-layer .layer-menu .menu-box .menu-btn:focus .ic.ic-exp-item3 {
  background: url("../img/ic_exp_item3_white.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn:hover .txt,
article.video-finish-layer .layer-menu .menu-box .menu-btn:focus .txt {
  color: #fff;
}
/* 웹접근성 개선 - E : focus 추가 */
article.video-finish-layer .layer-menu .menu-box .menu-btn .ic {
  position: static;
  transform: none;
  width: 32px;
  height: 32px;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .menu-btn .ic {
    margin-right: 5px;
    width: 18px;
    height: 18px;
  }
}
article.video-finish-layer .layer-menu .menu-box .menu-btn .ic.ic-exp-item1 {
  background: url("../img/ic_exp_item1.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn .ic.ic-exp-item2 {
  background: url("../img/ic_exp_item2.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn .ic.ic-exp-item3 {
  background: url("../img/ic_exp_item3.svg") no-repeat center/cover;
}
article.video-finish-layer .layer-menu .menu-box .menu-btn .txt {
  text-align: center;
  width: 145px;
  font-size: 22px;
  font-weight: 700;
  line-height: 120%;
  color: #000;
  letter-spacing: -0.04em;
}
@media (max-width: 1080px) {
  article.video-finish-layer .layer-menu .menu-box .menu-btn .txt {
    width: 88px;
    font-size: 14px;
    line-height: 130%;
  }
}
article.video-finish-layer .layer-bg-box {
  display: flex;
}
article.video-finish-layer .layer-bg-box img {
  height: 100%;
  width: 100%;
}

article.intro-video-layer {
  z-index: 101;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
article.intro-video-layer video {
  object-fit: cover;
  max-width: 100%;
  max-height: 100%;
}

/* 웹접근성개선 2025 new - S */
.vr-container button:is(:focus) {outline:2px #000 auto;}

section.item-viewer:has(article.intro-video-layer) .viewer-intro {
  visibility: hidden;
}

section.item-viewer:has(article.intro-video-layer[style*=display]) .viewer-intro {
  visibility: visible;
}

.vr-container article.video-layer .caption-wrap {z-index:120;top:110px;right:40px;}
.vr-container article.video-layer .cap-section .rectangle .blind {display:none;}

@media (max-width: 1080px) {
  .vr-container article.video-layer .caption-wrap {top:74px;right:20px;}
}
/* 웹접근성개선 2025 new - E */
/*# sourceMappingURL=style.css.map */