@charset "utf-8";

.wrap_popup {position: relative;}

.wrap_popup,
.wrap_popup .swiper-wrapper {}
.wrap_popup .swiper-slide {position: relative;display:inline-block;height: 100%;vertical-align: top;}
.wrap_popup .swiper-slide-prev {opacity: 0 !important;}
.wrap_popup .swiper-slide-next {opacity: 0 !important;}



.wrap_popup .popup-zone {position: relative;width: 40rem; height: 43.5rem; margin-top: 2.8rem;}
.wrap_popup .popup-zone .slider {height: 100%;}
.wrap_popup .swiper-slide > a {display: block;height: 100%;}
.wrap_popup .popup-zone::before {content: '알림판';position: absolute;right: -7rem;top: -2rem;width: 15rem;height: 5.4rem;background: #1d398d;font-size: 2.6rem;color: #fff;font-family: pb;border-radius: 3rem 0 3rem 0;text-align: center;line-height: 5.4rem;z-index: 2;}

.wrap_popup .icon{height: 100%;text-align: center;border-radius: 2rem;overflow: hidden;}
.wrap_popup .icon img {width: 100%;height: 100%;object-fit: cover;object-position: center;}




@media screen and (max-width:1640px){
	.wrap_popup .popup-zone {width: 80%;}
	.wrap_popup .popup-zone::before {right: -5rem;width: 13rem;}
}

@media screen and (max-width:1400px){
	.wrap_popup .popup-zone {width: 83%;}
}

@media screen and (max-width:768px){
	.wrap_popup .popup-zone::before {font-size: 2.2rem;}
}


/*콘트롤*/
.wrap_popup .item-wrap {position:absolute;bottom: 0;right: 0;z-index: 1000;}


.wrap_popup .control{display:flex;align-items:center;flex-direction: column;}
.wrap_popup button{display:block;cursor:pointer;text-indent:-9999px;}
.wrap_popup .control .numbering{display: flex;flex-direction: column;align-items: center;margin-bottom: 3.8rem;color:#FFF;font-size:1.6rem;font-family: pb;}
.wrap_popup .control .numbering > span {display: inline-block;}
.wrap_popup .control .numbering .now {font-size: 2.4rem;color: #1d398d;font-family: pb;}
.wrap_popup .control .numbering .total {font-size: 1.4rem;color: #000;font-family: pb;}
.wrap_popup .control .numbering .now::before {content: '0';}
.wrap_popup .control .numbering .total::before {content: '0';}
.wrap_popup .control .numbering .slash {margin: .8rem 0;font-size: 1.4rem;font-family: pb;color: #000;}
.wrap_popup .control .paging {display: none;margin-right:2rem;}
.wrap_popup .control .paging ul{display:flex;align-items:center;}
.wrap_popup .control .paging ul li{height:.2rem;}
.wrap_popup .control .paging ul li button{width:5rem;height:100%;background:rgba(255,255,255,0.5);}
.wrap_popup .control .paging ul li.slick-active button{background:rgba(255,255,255,1);}
.wrap_popup .control .pannel{display:flex;flex-direction: column;align-items:center;}
.wrap_popup .control button.play,
.wrap_popup .control button.stop{display:none;width:5rem;height:5rem;margin: 1rem 0;border-radius: 50%;transition: background .25s;}
.wrap_popup .control button.on{display:block;}
.wrap_popup .control button.play{background: #f1f2f3 url(../images/ic-play.png) no-repeat center;}
.wrap_popup .control button.stop{background: #f1f2f3 url(../images/ic-stop.png) no-repeat center;}
.wrap_popup .control button.play:hover {background: #3c4148 url(../images/ic-play-hover.png) no-repeat center;}
.wrap_popup .control button.stop:hover {background: #3c4148 url(../images/ic-stop-hover.png) no-repeat center;}
.wrap_popup .control button.prev,
.wrap_popup .control button.next{width:5rem;height:5rem;border-radius: 50%;transition: background .25s;}
.wrap_popup .control button.prev{background:#f1f2f3 url(../images/ic-up.png) no-repeat center;}
.wrap_popup .control button.next{background: #f1f2f3 url(../images/ic-down.png) no-repeat center;}
.wrap_popup .control button.prev:hover{background: #3c4148 url(../images/ic-up-hover.png) no-repeat center;}
.wrap_popup .control button.next:hover{transform: rotate(0);background: #3c4148 url(../images/ic-down-hover.png) no-repeat center;}




/* @media screen and (max-width:1600px){
	.wrap_popup .item-wrap {bottom: 21rem;left: 4rem;}
	

	.wrap_popup .item-wrap.long {bottom: 19.5rem}
	

}

@media screen and (max-width:1024px){
	.wrap_popup .item-wrap {bottom: 19rem;left: 4rem;}

	.wrap_popup .item-wrap.long {bottom: 17rem}
	
}

@media screen and (max-width:768px){
	.wrap_popup .item-wrap {bottom: 21rem;left: 2rem;}
	.wrap_popup .control .numbering {margin-right: 3rem;}
	
	

	.wrap_popup .item-wrap.long {bottom: 16rem}
} */