@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap');


/* 공통 */
html, body {width:100%; height:100%; font-family: "Lora"; word-break:keep-all; background-color:#000; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

.inner {width:100%; margin:0 auto; padding:0 13.65%; }
.con_inner {width:1420px; max-width:100%; padding:0 10px; margin:0 auto; }
.h_full {height:100dvh; }
.full_video {display:block; width:100%; height:100%; object-fit:cover; }

section {position:relative; width:100%; height:100dvh;  background-color:#000; overflow:hidden;}
section .txt_cont {z-index:10; position:relative; }

.playfair {font-family: "Lora", serif; font-optical-sizing: auto; font-style: normal; }


@media all and (max-width:767px){
    .home {background-color:#240000;}
}

select::-ms-expand { 
	display: none;
}
select {
    -o-appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


.main_tit h3 {margin-bottom:30px; }
.main_tit p {font-size:20px; color:#fff; line-height:1.5; }



@media all and (max-width:767px){
    .inner {padding:0 20px; }

    .main_tit h3 img {height:42px; }
    .main_tit p {font-size:15px; }
    .main_tit p br {display:none; }
}


/* 스크롤바 커스텀 */
.scrollbar {scrollbar-color: rgba(43,198,157,.5) rgba(0,0,0,0); scrollbar-width: thin; }
.noscrollbar::-webkit-scrollbar {display:none; }
.scrollbar_hover {scrollbar-color: transparent transparent; scrollbar-width: thin; }
.scrollbar_hover:hover {scrollbar-color: rgba(43,198,157,1) rgba(0,0,0,0);}


/* header */
h1.logo {z-index:1001; opacity:1; position:absolute; left:0; top:40px; transition:all 0.2s; }
h1.logo a {display:block; padding:10px 20px; }
h1.logo.hidden {opacity:0; }

header {z-index:1000; position:fixed; left:-80px; top:0;  width:107px; height:100%; padding-right:27px; transition:all 0.4s; -webkit-text-size-adjust: none; text-size-adjust: none; }
header:before {content:''; position:fixed; left:2px; top:30%; width:5px; height:40%; background-color:rgba(255,255,255,0.5); border-radius:10px; }
header:hover:before {opacity:0; }
header:hover {left:0; }
header .header_box {display:flex; flex-direction:column; justify-content:center; width:100%; height:100%; padding:30px 0 40px; background-color:rgba(255,255,255,0.01); box-shadow:4px 0 21px 7px rgba(0,0,0,0.25); backdrop-filter:blur(5px); }
header h1 {position:absolute; left:0; top:40px; }
header h1 a {display:block; padding:10px 20px; }
header .gnb {display:flex; flex-direction:column; gap:0px; }
header .gnb > li {position:relative; }
header .gnb > li > a {position:relative; display:flex; align-items:center; justify-content:center; height:60px; text-align:center; font-size:16px; color:rgba(255,255,255,0.5); font-family: "Lora", serif; font-weight:800; }
header .gnb > li > a img {opacity:0.5; transition:all 0.3s; }
header .gnb > li > a:after {content:''; opacity:0; position:absolute; right:0; top:0; width:4px; height:100%; background-color:#ca3727; transition:all 0.3s; }
header .gnb > li:hover > a {color:rgba(255,255,255,1);}

header .gnb .depth2 {z-index:-9999; opacity:0; visibility:hidden; position:absolute; left:100%; top:50%; min-width:130px; padding:20px; background-color:#100204; transform:translateY(-50%); transition:all 0.3s; }
header .gnb .depth2 li {font-size:20px; color:#fff; }
header .gnb .depth2 li + li {margin-top:8px; }
header .gnb .depth2 li a {display:block; font-size:16px; font-weight:500; color:rgba(255,255,255,0.5); transition:all 0.3s; font-family: "Lora", serif; font-weight:600;  }
header .gnb .depth2 li a:hover {color:rgba(255,255,255,1); }

header .gnb .depth3 {visibility:hidden; position:absolute; left:100%; top:0; overflow-y:auto; min-width:130px; max-height:208px; padding:20px; background-color:#100204; transition:all 0.3s;}
header .gnb .depth3 li a { font-family: "Pretendard"; }

header .gnb .depth3::-webkit-scrollbar {width:2px; height:2px; -webkit-appearance:none; }
header .gnb .depth3::-webkit-scrollbar-thumb {background:#ffffff; border-radius:5px; width:2px; }
header .gnb .depth3::-webkit-scrollbar-track {background:rgba(0,0,0,0.1); }

header .gnb > li:hover > a img {opacity:1; }
header .gnb > li:hover > a:after {opacity:1; }
header .gnb > li:hover .depth2 {z-index:10; opacity:1; visibility:visible;}
header .gnb > li:hover .depth2 li:hover .depth3 {z-index:10; opacity:1; visibility:visible;}

header .ham_btn {display:none; z-index:10; position:relative; flex-direction:column; justify-content:space-between; width:35px; height:30px; padding:5px; }
header .ham_btn i {display:block; width:100%; height:2px; background-color:rgba(255,255,255,0.8); transform-origin:center center; transition:all 0.4s; }
header .ham_btn.active i:nth-of-type(1) {transform:rotate(45deg) translate(6px,6.8px); }
header .ham_btn.active i:nth-of-type(2) {opacity:0;; }
header .ham_btn.active i:nth-of-type(3) {transform:rotate(-45deg) translate(6px,-6.5px); }

@media all and (max-width:767px){
    h1.logo {position:fixed; top:5px; left:10px; }
    h1.logo.hidden {opacity:1; }
    h1.logo a {padding:10px; }
    header {left:0; top:0; width:100%; height:70px; padding:0; }
    header:before {display:none; }
    header .header_box {flex-direction:row; align-items:center; justify-content:flex-end; width:100%; height:100%; padding:0 20px; transition:all 0.3s; }
    header .header_box.on {background-color:#100204; }
    header .ham_btn {display:flex; }
    header .gnb {z-index:9; position:fixed; left:0; top:-100dvh; gap:40px; overflow-y:auto; width:100%; height:calc(100dvh - 70px); padding:20px 0; background-color:#100204; transition:all 0.3s; }
    header .gnb.on {top:70px; }
    header .gnb > li > a img {opacity:1; }
    header .gnb > li > a {flex-direction:column; width:100%; height:45px; font-size:17px; font-weight:500; color:#fff; }
    header .gnb > li > a span {display:block; padding-top:15px; }
    header .gnb .depth2 {z-index:10; opacity:1; visibility:visible; position:relative; left:0; top:0; width:100%; padding:0 20px; transform:none; text-align:center; }
    header .gnb .depth2 > li > a {padding:2px 0; }
    header .gnb .depth2 > li > a:hover {color:rgba(255,255,255,0.7); }
    header .gnb .depth3 {z-index:10; opacity:1; visibility:visible; display:none; position:relative; left:0; top:0; width:100%; max-height:none; margin-top:5px; padding:10px 20px; transform:none; text-align:center; background-color:rgba(255,255,255,0.1);}
    header .gnb .depth3.active {display:block; }
    header .gnb .depth3 li + li {margin-top:10px; }
    header .gnb .depth3 li a {font-size:15px; font-weight:400; }
    header .gnb > li:hover > a:after {opacity:0; }
    
    /* 모바일 메뉴 열렸을 때 배경 스크롤 방지 */
    body.menu-open {overflow:hidden !important; position:fixed; width:100%; }
}


.intro {z-index:100000; opacity:1; visibility:visible; position:fixed; left:0; top:0; width:100%; height:100dvh; transition:all 0.5s; }
.intro.hidden {z-index:-100; opacity:0; visibility:hidden }
.intro .intro_video {display:block; width:100%; height:100dvh; object-fit:cover; }

.section .btn_box {z-index:10; position:absolute; left:42px; bottom:10%; }
.section .btn_box a {display:flex; align-items:center; gap:8px; padding:8px 18px; border:1px solid rgba(255,255,255,0.7); font-size:16px; color:#fff; font-weight:400; font-family: "Lora", serif; }

@media all and (max-width:1440px){
    .section .btn_box {left:20px; }
}

@media all and (max-width:767px){

    .section .btn_box a {font-size:14px;}

}


/* 문의하기 */
.contact_con01 {display:flex; align-items:center; justify-content:center; width:100%; }
.contact_con01 .box {width:100%; padding:80px 0; }
.contact_con01 .box h4 {font-size:42px; color:#ddd; font-weight:600; text-align:center; }
.contact_con01 .box p {margin-top:20px; font-size:16px; color:#ddd; text-align:center; line-height:1.4; }
.contact_con01 .box .form_box {width:600px; max-width:95%; margin:40px auto 0; padding:24px 24px 16px; background-color:#1b1b1b; border-radius:20px; }
.contact_con01 .box .form_box dl {display:flex; align-items:center; gap:10px; }
.contact_con01 .box .form_box dl + dl {margin-top:20px; }
.contact_con01 .box .form_box dl dt {flex-shrink:0; width:85px; font-size:16px; color:#dddd; }
.contact_con01 .box .form_box dl dd {width:100%; }
.contact_con01 .box .form_box dl dd input {width:100%; height:56px; padding:16px; border:0 none; font-size:16px; color:rgba(221,221,221,0.8); background-color:#101010; border-radius:10px; }
.contact_con01 .box .form_box dl dd input:disabled {color:rgba(221,221,221,0.4);}
.contact_con01 .box .form_box dl dd input:focus {outline:none; }
.contact_con01 .box .form_box dl dd textarea {resize:none; width:100%; height:200px; padding:16px; border:0 none; font-size:16px; color:rgba(221,221,221,0.8); background-color:#101010; border-radius:10px; }
.contact_con01 .box .form_box dl dd textarea:focus {outline:none; }
.contact_con01 .box .btn_box {position:relative; margin-top:24px; padding-top:16px; }
.contact_con01 .box .btn_box:before {content:''; position:absolute; left:-24px; top:0; width:calc(100% + 48px); height:1px; background-color:rgba(221,221,221,0.1); }
.contact_con01 .box .btn_box button { width:100%; height:54px; font-size:16px; color:#fff; font-weight:600; background-color:#e02622; border-radius:10px; }


@media all and (max-width:767px){
    .contact_con01 .box h4 {font-size:34px; }
    .contact_con01 .box p {margin-top:15px; font-size:14px; }
    .contact_con01 .box .form_box dl {flex-direction:column; align-items:flex-start; gap:10px; }
    .contact_con01 .box .form_box dl dt {padding-left:5px; font-size:14px; }
    .contact_con01 .box .form_box dl dd input {height:45px; font-size:14px; }
    .contact_con01 .box .form_box dl dd textarea {height:150px; font-size:14px; }
    .contact_con01 .box .btn_box button {height:45px; font-size:14px; }
}

/* 메인 passcode 모달 */
.modal {z-index:100; visibility:hidden; opacity:0; position:fixed; left:0; top:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; transition:all 0.5s; }
.modal.show {visibility:visible; opacity:1;}
.modal .modal_bg {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); }
.modal .modal-content {z-index:10; position:relative; width:410px; max-width:90%; background-color:#1b1b1b; border-radius:20px; }
.modal .modal_body {padding:24px; text-align:center; }
.modal .modal_body .img_box {display:flex; align-items:center; justify-content:center; gap:10px; }
.modal .modal_body p {margin:20px 0; font-size:18px; color:#ddd; line-height:1.4; }
.modal .modal_body input {width:100%; height:56px; padding:16px; border:0 none; font-size:16px; color:rgba(221,221,221,0.8); text-align:center; background-color:#101010; border-radius:10px; }
.modal .modal_body input:focus {outline:none; }
.modal .btn_box {display:flex; align-items:center; gap:10px; padding:16px 24px; border-top:1px solid rgba(221,221,221,0.1); }
.modal .btn_box .btn {display:flex; align-items:center; justify-content:center; width:100%; height:54px; font-size:16px; font-weight:600; border-radius:10px; }
.modal .btn_box .btn.btn-secondary {color:rgba(255,255,255,0.4); background-color:#2f2e2e; }
.modal .btn_box .btn.btn-primary {color:#fff; background-color:#e02622; }



/* 자료실 */
.reference_con {min-height:100dvh; padding:100px 0; background-color:#1b1b1b; }
.reference_con .tit_box {display:flex; align-items:center; justify-content:space-between; }
.reference_con .tit_box h4 {font-size:42px; color:#ddd; font-weight:600; }
.reference_con .tit_box .search_form {display:flex; align-items:center; gap:10px; width:655px; max-width:55%;}
.reference_con .tit_box .search_form select {width:17%; height:56px; padding:16px; border:0 none; font-size:16px; color:rgba(221,221,221,0.8); background:#101010 url('../img/icon/arrow_gray.svg') no-repeat 95% center; ; border-radius:4px; }
.reference_con .tit_box .search_form select:focus {outline:none; }
.reference_con .tit_box .search_form input {width:100%; height:56px; padding:16px; border:0 none; font-size:16px; color:rgba(221,221,221,0.8); background-color:#101010; border-radius:4px; }
.reference_con .tit_box .search_form input:focus {outline:none; }
.reference_con .tit_box .search_form button {width:18%; height:56px; padding:10px 16px; font-size:16px; color:#fff; font-weight:500; background-color:#e02622; border-radius:4px; }

.reference_con .list_box {margin-top:100px; }
.reference_con .list_box dl {border:1px solid rgba(221,221,221,0.1); border-radius:4px; }
.reference_con .list_box dl + dl {margin-top:10px; }
.reference_con .list_box dl dt {position:relative; display:flex; align-items:center;  width:100%; min-height:86px; padding:10px 7% 10px 10px; color:#fff; cursor:pointer; }
.reference_con .list_box dl dt:before {content:''; position:absolute; right:0; top:0; width:7%; height:100%; background:url('../img/icon/arrow_down_red.svg') no-repeat center center; }
.reference_con .list_box dl dt.active:before {background:url('../img/icon/arrow_up_white.svg') no-repeat center center; }
.reference_con .list_box dl dt .num {flex-shrink:0; width:11%; font-size:18px; color:#ddd; font-weight:300; text-align:center; }
.reference_con .list_box dl dt .tit {display:flex; align-items:center; justify-content:space-between; width:100%; font-size:18px; color:#ddd; font-weight:600; }
.reference_con .list_box dl dt .file {flex-shrink:0; width:7%; }
.reference_con .list_box dl dt .file img {display:block; margin:0 auto; }
.reference_con .list_box dl dt .date {flex-shrink:0; width:11%; font-size:16px; color:rgba(221,221,221,0.4); font-weight:300; text-align:center; }
.reference_con .list_box dl dd {display:none; padding:40px 80px; background-color:#101010; border-radius:4px; }
.reference_con .list_box dl dd .content {color:#ddd; font-size:16px; line-height:1.6; }
.reference_con .list_box dl dd .down_box {margin-top:40px; border-top:1px solid rgba(221,221,221,0.1); }
.reference_con .list_box dl dd .down_box a {display:flex; align-items:center; justify-content:space-between; padding:20px 0; }
.reference_con .list_box dl dd .down_box a span {font-size:16px; color:#ddd; font-weight:600; }
.reference_con .list_box dl dd .down_box a b {display:flex; align-items:center; gap:4px; color:#e02622; font-weight:600; }

.reference_con .pager {display:flex; align-items:center; justify-content:center; gap:8px; margin-top:40px; }
.reference_con .pager button img {display:block; }
.reference_con .pager button:disabled img {opacity:0.2; }
.reference_con .pager .start,
.reference_con .pager .prev {transform:rotate(180deg); }
.reference_con .pager a {display:flex; align-items:center; justify-content:center; width:24px; height:24px; font-size:14px; color:rgba(221,221,221,0.4); font-weight:500; background-color:rgba(221,221,221,0.2); border-radius:4px; }
.reference_con .pager a.active {color:#fff; background-color:#e02622;}

@media all and (max-width:767px){
    .reference_con .tit_box {flex-direction:column; gap:20px; }
    .reference_con .tit_box h4 {font-size:32px; }
    .reference_con .tit_box .search_form {gap:5px; max-width:100%; }
    .reference_con .tit_box .search_form select {width:25%; height:50px; padding:10px; font-size:14px;}
    .reference_con .tit_box .search_form input {height:50px; padding:10px; font-size:14px;}
    .reference_con .tit_box .search_form button {width:20%; height:50px; padding:10px; font-size:14px;}
    
    .reference_con .list_box {MARGIN-TOP:50PX; }
    .reference_con .list_box dl dt {flex-direction:column; justify-content:center; align-items:flex-start; padding:10px 15% 10px 10px; }
    .reference_con .list_box dl dt:before {width:15%; background-size:30px 30px !important; }
    .reference_con .list_box dl dt .num {display:none; }
    .reference_con .list_box dl dt .tit {justify-content:flex-start; gap:5px; font-size:16px; }
    .reference_con .list_box dl dt .date {font-size:14px; }
    .reference_con .list_box dl dd {padding:20px 20px 0; }
    .reference_con .list_box dl dd .content {font-size:14px; }
    .reference_con .list_box dl dd .down_box a span,
    .reference_con .list_box dl dd .down_box a b {font-size:13px; }
}

/* sub */
.cinema {overflow:hidden; }
.mo_tit {display:none; }
.slide_box {height:100%; }
.slide_box li {position:relative; }
.slide_box li img {position:absolute; left:0; top:0; right:0; bottom:0; display:block; max-width:100%; max-height:100%; margin:auto; object-fit:cover; }


.thumbs_box {overflow:hidden; z-index:10; position:absolute; left:0; bottom:100px; width:100%; padding:0 13.65%; }
.thumbs_box h3 {margin-bottom:24px; }
.thumbs_area {position:relative; }
.thumbs_area .arrow {position:absolute; top:calc(50% - 25px); }
.thumbs_area .arrow.prev {left:-60px; }
.thumbs_area .arrow.next {right:-60px; }
.thumbs_area .arrow.prev img {transform:rotate(180deg); }
.thumbs_area .arrow.swiper-button-disabled img {filter:brightness(5); opacity:0.5; cursor:default; }
.thumbs_slide {overflow:hidden; }
/* .thumbs_slide li {overflow:hidden; border:2px solid transparent; border-radius:6px; cursor:pointer; } */
.thumbs_slide li {overflow:hidden; background:#000000; border-radius:6px; cursor:pointer; }


.thumbs_slide li i {position:relative; display:block; width:100%; padding-bottom:55%; }
.thumbs_slide li.swiper-slide-thumb-active {border:2px solid #e02622; }
.thumbs_slide li img {position:absolute; left:0; top:0; display:block; width:100%; height:100%; object-fit:scale-down;}
.thumbs_slide li video {position:absolute; left:0; top:0; display:block; width:100%; height:100%; object-fit:cover;}
/* font-family: "Lora", serif; 제거 */
.thumbs_slide li button {position:absolute; left:0; top:0%; width:100%; height:100%; border:1px solid rgba(255,255,255,0.7); font-size:16px; color:#fff; border-radius:4px;  background-color:rgba(255,255,255,0.01); backdrop-filter:blur(5px); }

@media all and (max-width:767px){
    /* .cinema,
    .drama,
    .etcetera {display:flex; flex-direction:column; justify-content:center; } */
    /* .slide_box {width:85%; height:70vh; margin:0 auto; } */
    .sub_page {display:flex; flex-direction:column; gap:10px; }
    .slide_box {flex-grow:1; height:auto; }
    .slide_box li {overflow:hidden; border-radius:10px; border:1px solid rgba(255,255,255,0.05); background-color:#000; }
    .slide_box li .full_video {height:100%; }

    .thumbs_box {position:relative; bottom:0; padding:20px 30px; }
    .thumbs_area {height:100%; }
    .thumbs_area .arrow.prev {left:-40px; }
    .thumbs_area .arrow.next {right:-40px; }
    .thumbs_slide li button {font-size:14px; }
}


@media (orientation: landscape) {
    .h_full.sub_page {height:auto;}
    .sub_page .slide_box img {position:unset;}
}