/* 상단팝업 */
.upPop .popup_wrap{ height:6rem; margin-top:-6rem; visibility: hidden;}
#topPop { position:relative; width:100%; -webkit-transition:0.3s; transition:0.3s; background:#333; color:#fff; z-index:10; overflow:hidden;}
#topPop .popup_wrap { position:relative; max-width:96rem; margin-left:auto; margin-right:auto; overflow:hidden; -webkit-transition:0.3s; transition:0.3s;}
#topPop .slick-list{ position:relative; margin:0 1.75rem; padding-top: 0.75rem ; }
#topPop .slick-list:before { content:""; position:absolute; left:-1px; top:0; height:100%; border-left:2px solid #2c455f; z-index: 1;}
#topPop .item a { position:relative; display: block; height:6rem;  overflow:hidden; } 
#topPop .item a .img { overflow:hidden; border:1px solid transparent; transition: border 0.2s; -webkit-transition: border 0.2s; font-size: 0;}
#topPop .item a .img img { height:100%; transform: translateX(-50%); position: relative; left: 50%;}
#topPop .item a dl{ width:100%; display:flex; align-items: center; justify-content: center;}
#topPop .item a dt { width:calc(100% - 4rem); padding-right:0.5rem; font-size:0.75rem; max-height:3.3rem; font-weight:400; word-break:keep-all; line-height:1.1rem; overflow:hidden; }
#topPop .item a dd { width:4rem; text-align:center; line-height:1.3rem; padding:0 0.5rem; border:1px solid #fff; font-size:0.65rem; border-radius:1.5rem; -webkit-transition:opacity 0.2s; transition:opacity 0.2s; opacity: 0.7; }
#topPop .slick-arrow { position:absolute; top:1.8rem; font-size:0;}
#topPop .slick-arrow:before {font-family:"xeicon"; font-size:1.2rem; }
#topPop .slick-prev { left:0; }
#topPop .slick-prev:before {content:"\e93d";}
#topPop .slick-next { right:0; }            
#topPop .slick-next:before {content:"\e940"; }        
#topPop .control { position:absolute; right: calc(50% - 40rem);; bottom: 0; line-height:1.8rem; text-align:right; font-size:13px; font-weight:400; }
#topPop .control .close input[type="checkbox"]{ margin-right:4px;}
#topPop .control .close a{ display:inline-block; vertical-align: top; margin-left: 1.6rem; }
#topPop .control .close a i{ display: inline-block; vertical-align: middle; margin-left: 0.3rem;}
#topPop .control > a{ position:absolute; left:0; bottom:0.5rem; width:1.4rem; height:1.4rem; line-height:1.4rem; border-radius:50%; text-align:center; font-size:11px; color:#fff; background:#4b5f74;}
#topPop .control > .play{display:none;}
#topPop .control a,
#topPop .control a i{ transition: all 0.2s; -webkit-transition: all 0.2s;}
#topPop .item a:hover dt,
#topPop .item a:focus dt{ text-decoration:underline; }
#topPop .item a:hover dd,
#topPop .item a:focus dd { opacity: 1;} 

/* open */
.open.upPop .popup_wrap { margin-top:0; visibility: visible;}

/* popBtn */
.popBtn { display:none; }

/* pop_close */
.pop_close { position:absolute; right:calc(50% - 920px); top:0; width:104px; height:38px; border-radius:0 0 19px 19px; background:#333; text-align:center; font-size:14px; letter-spacing: .5px; color:#fff; line-height:40px }
.pop_close:after { content:"\e942"; font-family:"xeicon"; margin-left:3px; font-size:20px; vertical-align: bottom; }
.pop_close span { position: relative;}
.pop_close span::after { content: '열기'; font-size: 14px; color: #fff; display: inline-block; margin-left: 0.2rem;}

.openPop .up_pop { margin-top:0;}
.open .pop_close:after {content:"\e945";}
.open .pop_close span::after { content: '닫기'; }

/* 레이어 팝업 */
#lyPop { position:  fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 1rem; overflow: hidden; box-shadow: 0 0 1rem rgba(0,0,0,0.1);}
#lyPop .img {width: 25rem; height: 30rem; background: rgba(0,0,0,0.3);}
#lyPop .img {width: auto;height: 100%; position: relative; left: 50%; transform: translateX(-50%); }
#lyPop .close { position: absolute; background: #333; bottom: 0; left: 0; width: 100%; display: flex; justify-content: space-between; padding: 0 1.5rem;}
#lyPop .close label { color: #fff; vertical-align: middle; line-height: 2.5rem; padding-left: 0.5rem; font-size: 0.75rem;}
#lyPop .close .lypop_close { line-height: 2.5rem; font-size: 0.75rem; color: #fff;}
#lyPop .close .lypop_close::after {  display: none;}
#lyPop .close .lypop_close i { padding-left: 0.5rem;}

@media screen and (max-width: 1920px){
    /* pop_close */
.pop_close { right: 1rem;}
    
    /* topPop */    
    #topPop .control > a{ left:0.5rem; bottom:.25rem;}
} 
 
@media screen and (max-width: 1650px){
    #topPop .control { right: 1rem;}
}

@media screen and (max-width: 1240px){
    
    /* topPop */    
    #topPop .control > a{ left:0.5rem; bottom:.25rem;}
}

@media screen and (max-width: 1024px){

    /* layout */ 
    #container { -webkit-transition:padding 0.3s; transition:padding 0.3s; }
    #header, 
    #header .mBtn, #header h1, #mSearch{  -webkit-transition:top 0.3s; transition:top 0.3s;}

    /* topPop */
    #topPop { display: none;}
    #topPop .item a:before{ display:none;}

    .pop_close { display: none;}
 
}

@media screen and (max-width:768px){
    
    /* topPop */
    #topPop .pop_close{font-size:14px; right:1rem;}

 

    /* 레이어 팝업 */
    #lyPop { display: none;}
}