@charset "UTF-8";
/* CSS Document */


.wrap-layer-popup { display:none; align-items:center; justify-content:center; position:fixed; z-index:991;left:0; top:0; width:100%; height:100%; }
.wrap-layer-popup::after { content:''; position:fixed; z-index:990; display:block; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.8); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition: opacity .2s;}
.wrap-layer-popup.open { display: flex; }
.wrap-layer-popup.open > .inner-layer-popup { animation:innerPpopup 0.3s both; }
.wrap-layer-popup.prev-popup { z-index: 989;}
.wrap-layer-popup > .inner-layer-popup { position:relative; z-index:999; display:flex; flex-wrap:wrap; align-content:stretch; width:400px; max-height:100%; height:auto; opacity:0; overflow:hidden; }
.wrap-layer-popup .wrap-layer-popup-title { width:100%; padding:22px 2em; background:#fff;}
.wrap-layer-popup .wrap-layer-popup-title h1 { margin:0; font-size:20px; font-weight:700; line-height:30px;}
.wrap-layer-popup .wrap-layer-popup-title strong { font-size:20px; }

@keyframes innerPpopup { from { opacity:0; transform:translateY(-30%) } to { opacity:1; transform:translateY(0px); } }
@keyframes fadePpopup { from { opacity:0; } to { opacity:1; } }

.wrap-layer-popup .layer-popup-contents { position:relative; width:100%; max-height:calc(100% - 50px); overflow-y:auto; background:#fff; padding:0 25px 25px;}
.wrap-layer-popup .layer-popup-bottom { display:flex; border-top:1px solid #ededed; width:100%; padding:10px; background:#fff; }
.scroll-lock { overflow: hidden;}
.wrapper { width: 900px; margin: 0 auto;}
.hidden { position:relative; z-index:-1; display:inline-block; overflow:hidden; height:1px; width:1px; border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); word-break:initial; word-wrap: initial;}

.btn-layer-close { position: absolute; right:18px; top:20px; width: 26px; height: 26px; padding: 0; border: 0; background: transparent; border-radius:0;transform:rotate(0deg);}
.btn-layer-close::before, .btn-layer-close::after { position: absolute; content: ''; top:50%; left:50%; width: 20px; height: 1px; background: #999; transition:all 0.3s;}
.btn-layer-close::before { transform:translate(-50%, -50%) rotate(45deg); }
.btn-layer-close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.btn-layer-close:hover { transform:rotate(90deg);transition:all 0.3s;}
.btn-layer-close:hover::before, .btn-layer-close:hover::after { background:#000; }

.btn-layer-close.outside { right:0; top:0; }
.btn-layer-close.outside:hover::before, .btn-layer-close.outside:hover::after { background:#fff; }


/*통합검색*/
#search_popup { align-items:flex-start; }
#search_popup > .inner-layer-popup { width:100%; border-radius:0;background:rgba(255,255,255,1); overflow:visible; }
#search_popup .layer-popup-contents {  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); padding:2em; }
#search_popup .wrap-layer-popup-title { height:0; visibility:hidden; }
#search_popup .layer-popup-contents strong { font-size:2.4em; }
#search_popup .inner { padding:0; }
#search_popup .search_wrap { display:flex; position:relative; }
#search_popup .inputText { height:60px; width:calc(100% - 60px); background:none; padding:10px; border:none; border-radius:0; font-size:1.5em; font-weight:600; }
#search_popup .inputText:hover { box-shadow:none; }
#search_popup .btn_search { width:60px; height:60px; border-radius:0 !important; border:none; font-size:2em; background:none; color:#727272; transition:all 0.3s; }
#search_popup .btn_search:hover { box-shadow:none; color:#333; }
#search_popup .btn-layer-close { top:140px; left:50%; transform:translateX(-50%); z-index:999; background:#fff; border-radius:50px; width:40px; height:40px; }
#search_popup .btn-layer-close:hover { transform:translateX(-50%) rotate(90deg); }
#search_popup .btn-layer-close::before, #search_popup .btn-layer-close::after { height:2px; background:#333; }

.main_modal_wrap { width:400px; height:550px; position:fixed; top:50px; left:50px; z-index:999; display:flex; justify-content:center; align-items:center; box-shadow:10px 10px 20px 0 rgba(0,0,0,0.2); }
/* .main_modal_wrap::after { content:'';  background:rgba(0,0,0,0.8); width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:10; -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); }*/
.main_modal { position:relative; z-index:11; display:flex; align-items:center; flex-direction: column; border:1px solid #121212; }
.main_modal .modal_control { width:100%; display:flex; justify-content:space-between; align-items:center; background:#121212; height:50px; padding:0 14px; }
.main_modal .modal_control .modal_count { padding:0 15px; height:40px; display:flex; align-items:center;}
.main_modal .modal_control .btn_s { padding:0 10px; border:1px solid #fff; color:#fff; background:none; height:30px; }
.main_modal .modal_control .btn_s:hover { color:#121212; background:#fff; }
.main_modal .modal_control .check { align-items: center; margin:0; color:#fff; height:30px; }

.main_modal .modal_content { width:400px; height:500px; padding:0; animation:fadeUp 1s both; overflow:hidden;}
.main_modal .modal_content .modal_slide .swiper-slide { width:100%; height:auto; }
.main_modal .modal_content .swiper-slide { width:auto; height:500px; overflow:hidden; }
.main_modal .modal_content .swiper-slide a { width:400px; height:500px; display:block; position:relative; background-color:#fff; }
.main_modal .modal_content .swiper-slide img { height:100%; }

.modal-slide { position:relative; }
.modal-slide-control { position:absolute; bottom:65px; right:15px; z-index:9;}
.modal_contr.swiper-button-next, .modal_contr.swiper-button-prev { position:static; height:45px;width:45px; border-radius:50px; margin:0; }
.modal_contr.swiper-button-next:after, .modal_contr.swiper-button-prev:after { font-size:20px; font-weight:900; color:#333; }
.modal_contr.swiper-pagination { width:auto; display:flex; align-items:center; position:static; }
.modal_contr.swiper-pagination span { background:#fff; border:2px solid #000; width:12px; height:12px; position:relative; margin:0 5px !important; display:inline-block; }
.modal_contr.swiper-pagination-bullet-active::after { border:1px solid #fff; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:15px; height:15px; display:inline-block; border-radius:50px; content:''; animation:fadeIndot 0.5s both cubic-bezier(0.550, 0.085, 0.680, 0.530); }

#subscribe .inner-layer-popup { width:500px; border-radius:0; }
#subscribe .inner-layer-popup p { margin-bottom:30px; }
#email .inner-layer-popup { width:750px; height:calc(100% - 10em); }
#email .layer-popup-contents { padding-top:30px; }

@media all and (max-width: 450px) {
	.main_modal_wrap { width:calc(100% - 2em); height:auto; top:1em; left:1em; }
	.modal_contr.swiper-pagination span { margin:0 5px !important; }
	.main_modal .modal_content { width:100%; height:auto; }
	.main_modal .modal_content .swiper-slide { width:100% !important; }
	.main_modal .modal_content .swiper-slide a { width:100%; height:auto; display:flex; }
	.main_modal .modal_content img { width:100%; height:auto !important; min-height:0; }
}

@media all and (max-width: 340px) {
	.modal-slide-control { margin:13px 0; bottom:100px; }
	.main_modal .modal_control { flex-direction:column; align-items:flex-start; height:auto; padding:10px 14px 15px; }
	.main_modal .modal_control .btn_s { height:35px; width:100%; margin-top:5px; }
	}