﻿#k_popup { position: fixed; left:0px; z-index: 9999980; top: 0; width:100%; height: 100%; display: none; }
/* #k_popup2 { position: fixed; left: calc(-720px - 3.5rem); z-index: 9999980; top: 0; width: 720px; height: 100%; transition: left 0.8s 0s; } 
 #k_popup2 { position: fixed; left: calc(-1080px - 3.5rem); z-index: 9999980; top: 0; width: 1080px; height: 100%; transition: left 0.8s 0s; } */
 #k_popup2 { position: fixed; left: calc(-1440px - 3.5rem); z-index: 9999980; top: 0; width: 1440px; height: 100%; transition: left 0.8s 0s; }
/*#k_popup2 { position: fixed; left: calc(-1800px - 3.5rem); z-index: 9999980; top: 0; max-width: 1800px; width: 100%; height: 100%; transition: left 0.8s 0s; }*/
#k_popup3 { position: fixed; left:0px; z-index: 9999970; top: 0; width:100%; height: 100%; display: none; }
/* #k_popup2.active { left: 0 !important; } */
#k_popup2.show { left: 0; }
/*#k_popup2.peek { left: -1800px; }*/
#k_popup2.peek { left: -1440px; }
/*#k_popup2.peek { left: -1080px; }*/
/*#k_popup2.peek { left: -360px; }*/
#k_popup2.hidden { left: calc(-1440px - 3.5rem); }

.black_overlay { position: absolute; opacity:1; width: 100%; height: 100vh; background-color: black; z-index: 99999998; -moz-opacity: 0.7; opacity: .70; filter: alpha(opacity=60); top: 0; cursor: pointer; display: none; }
.black_overlay2 { position: absolute; opacity:1; width: 100%; height: 100vh; background-color: black; z-index: 99999998; -moz-opacity: 0.7; opacity: .70; filter: alpha(opacity=60); top: 0; cursor: pointer; }


#player { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; z-index: 999; }
#player iframe { position: absolute; top: 50%; transform: translate(-50%,-50%); left: 50%; width: 100%; height: 100%; z-index: 2; }

.check { width: 100%; display: block; margin-top: 12px; display: none; }
.check label { font-size: 14px; line-height: 100%; margin-left: 5px; }

.popup { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #fff; }

.popup_close { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: none; }
.popup_close2 { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }

.popup_close_txt { color:#fff; text-align: center; font-size: 13px; margin-bottom: 1.25rem; display: block; display: none; }

/* .pop_content { z-index:190; max-width: 360px; width: 90%; position: relative; text-align: center; margin:0 auto; z-index: 99999999; } */
.pop_content { z-index:190; width: 100%; position: relative; text-align: center; margin:0 auto; z-index: 99999999; transform: translateY(3rem);}
.pop_content2 { z-index:190; width: 90%; max-width: 1100px; position: relative; text-align: center; margin:0 auto; z-index: 99999999; }

.pop_content ul { position: relative; left: 0; right: 0; margin: auto; margin-top: 0px; width: 100%; display: flex; justify-content: space-between; gap: 0 0px; }
/* .pop_content li { float:left; text-align: center; width: auto; margin-left: 5px; width: 366px; } */
.pop_content li { position: relative; text-align: center; width: auto; width: 100%; }
.pop_content li:first-child { margin-left: 0; }
.pop_content li img { float: left; width: 100%; }
.pop_content li a { float: left; width: 100%; }

.swiper_pop { overflow: visible; width: 100%; margin: auto; margin-top: 0%; }
.swiper_pop .swiper-slide { width: 100%; }
.swiper_pop .swiper-slide a { width: 100%; position: relative; z-index: 9; }
.swiper_pop .swiper-slide img { width: 100%; }
.pop_arrow { width: 90px; height: 32px; position: relative; margin-top: 0px; background-color: #fff; border-radius: 50px; display: flex; justify-content: center; padding: 0 2px; box-sizing: border-box; }
.pop_arrow .swiper-pagination-fraction { width: 50px; height: 32px; line-height: 32px; position: static; color: #000; letter-spacing: 0; font-weight: 500; font-size: 13px; }
.pop_arrow .swiper-pagination-current,.pop_arrow .swiper-pagination-total { padding: 0 3px; }
.pop_arrow .swiper-button-prev-pop { width: 25px; height: 100%; margin: 0; padding: 0; left: 0; top: 0; outline: none; position: relative; }
.pop_arrow .swiper-button-prev-pop>div { width: 6px; height: 6px; border-left: 1px solid #000; border-bottom: 1px solid #000; transform: rotate(45deg); transform-origin: center; position: absolute; left: 8px; right: 0; top: 0; bottom: 0; margin: auto; }
.pop_arrow .swiper-button-next-pop { width: 25px; height: 100%; margin: 0; padding: 0; right: 0; top: 0; outline: none; position: relative; }
.pop_arrow .swiper-button-next-pop>div { width: 6px; height: 6px; border-right: 1px solid #000; border-bottom: 1px solid #000; transform: rotate(-45deg); transform-origin: center; position: absolute; left: 0; right: 8px; top: 0; bottom: 0; margin: auto; }

.swiper_pop .swiper-slide { display: flex; justify-content: center; flex-wrap: wrap; }

.popup_bt { width: 3.5rem; height: 100%; position: absolute; right: -3.5rem; top: 0; background-color: #003c66; color: #fff; text-align: center; display: flex; justify-content: center; align-items: flex-end; 
border-radius: 0 0.5rem 0.5rem 0; /*border-radius:0.5rem 0 0rem 0.5rem;*/  cursor: pointer; }
.popup_bt>div { width: 3.5rem; height: 3.5rem; position: absolute; right: 0; top: 0; }
.popup_bt>div::after { content: ''; width: 25%; height: 25%; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); position: absolute; right: 0%; left: 10%; top: 0; bottom: 0; margin: auto; }
.popup_bt p { width: 1.125rem; font-size: 1.125rem; line-height: 150%; font-weight: 400; margin-bottom: 1.5rem; text-transform: uppercase; }

#k_popup2.peek .popup_bt>div::after { transform: rotate(-135deg); right: 15%; left: 0; }


/* 모바일 */
@media screen and (max-width: 1280px) {
  #k_popup2 {
    width: 100%;
    height: 100svh;           /* 모바일 주소창 높이 변동 대응 */
    transform: translateY(-120%);
    /* right/top 조작은 완전히 제거 */
  }
  #k_popup2.show    { transform: translateY(0); }
  #k_popup2.peek    { transform: translateY(-10%); }
  #k_popup2.hidden  { transform: translateY(-120%); }

  .popup_bt { display: none; }
  .pop_content { width: 100%; }
  .pop_content>ul { display: none !important; }
  .swiper_pop { display: block !important; }
  .swiper_pop .swiper-slide img { width: 85%; max-width: 360px; margin: 0 auto; display: block; }
  .check { width: 85%; max-width: 360px; margin: .5rem auto 0; display: flex; justify-content: space-between; align-items: center; }
  .black_overlay, .popup_close, .popup_close_txt { display: block; }

  /* keyframes 애니메이션은 transition과 충돌하니 제거(또는 미사용) */
}

    html,
    body,
    body * {
        font-family: "Noto Sans KR", "Hahmlet", sans-serif;
    }

