@charset "UTF-8";

.today-wrap-popup {margin-top: 90px; margin-bottom: 95px;}
.today-wrap-popup .container::after {content:""; display: table; clear: both;}
.today-wrap-popup .today-cate-box {width: 100%; transform: translateX(-50px); opacity: 0; transition: all .3s; position: relative; max-width: 1600px; margin: 0 auto;}
.edit .today-wrap-popup .today-cate-box {transform: translateX(0); opacity: 1;}
.today-wrap-popup .today-cate-box.on {transform: translateX(0); opacity: 1;}
.today-wrap-popup .today-category-title {text-align: left;}
.today-wrap-popup .today-category-title h1 {color: black; font-family: "Gong Medium"; font-size: 42px; position: relative; display: inline-block;}
.today-wrap-popup .control {position: absolute; right: 0; bottom: 5px; display: flex; flex-wrap: wrap;}
.today-wrap-popup .recent-remote {display: none;}
.today-wrap-popup .recent-remote.on {display: block;}
.today-wrap-popup .today-remote button {width: 9px; height: 15px; float: left; display: block; text-indent: -9999px;}
.today-wrap-popup .today-remote .today-prev {background-image: url(../images/prev_arrow.png);}
.today-wrap-popup .today-remote .today-next {background-image: url(../images/next_arrow.png);}
.today-wrap-popup .today-remote .today-count {margin: 0 20px; line-height: 15px;}
.today-wrap-popup .today-remote .today-count span {font-size: 15px; line-height: 15px; display: inline-block; color: #909090; margin: 0 10px;}
.today-wrap-popup .today-remote .today-count .today-current {font-family: "Dream Bold"; color: #000; margin: 0;}
.today-wrap-popup .today-remote .today-count .today-total {margin: 0;}
.today-wrap-popup .today-remote::after {content:""; display: table; clear: both;}
.today-wrap-popup .today-count {float: left;}

.today-wrap-popup .slider {transition: all .3s; transform: translateX(50px); opacity: 0; margin: 0 -33.5px; margin-top:52px;}
.edit .today-wrap-popup .slider {transform: translateX(0); opacity: 1;}
.today-wrap-popup .slider.on {opacity: 1; transform: translateX(0);}
.today-wrap-popup .slider .slick-slide {padding: 0 33.5px; cursor: pointer;}
.today-wrap-popup .slider li a {position: relative; width: 100%; height: 100%; display: block; margin-bottom: 30px;}
.today-wrap-popup .slider li .notice-cate {position: absolute; right: 0; top: 0; z-index: 3; width: 70px; height: 70px; text-align: center; line-height: 70px; font-size: 18px; color: white;}
.today-wrap-popup .slider li .notice-cate.cate_1 {background-color: #277fe2;}
.today-wrap-popup .slider li .notice-cate.cate_2 {background-color: #ff5223;}
.today-wrap-popup .slider li .notice-cate.cate_3 {background-color: #119e67;}
.today-wrap-popup .slider li .today-image {width: 100%; height: 410px; overflow: hidden; transition: all .3s;}
.today-wrap-popup .slider li .today-image-box {width: 100%; height: 100%; transform: scale(1); transition: all .3s;}
.today-wrap-popup .slider li:hover .today-image {box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.2);}
.today-wrap-popup .slider li:hover .today-image-box {transform: scale(1.1);}
.today-wrap-popup .slider .today-info {margin-top: 25px;}

.today-wrap-popup .slider .exhibition-type {font-family: "Noto DemiLight"; font-size: 16px; color: #222; border: 1px solid #000; display: inline-block; padding: 4px 12px;}
.today-wrap-popup .slider .today-title {font-family: "Noto Bold"; font-size: 24px; line-height: 32px; color: #000000; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; -webkit-box-orient: vertical; margin-top: 15px;}
.today-wrap-popup .slider .date {font-family: "Dream Medium"; color: #909090; font-size: 14px; display: block; margin-top: 15px;}

@media all and (max-width: 1680px) {
    .today-wrap-popup .slider {margin: 0 -21.5px; margin-top: 52px;}
    .today-wrap-popup .slider .slick-slide {padding: 0 21.5px;}
}

@media all and (max-width: 1023px) {
    .today-wrap-popup {margin: 55px 0 60px;}
    .today-wrap-popup .today-category-title h1 {font-size: 36px;}
    .today-wrap-popup .control {bottom: auto; top: 16px;}
    .today-wrap-popup .slider {margin: 0 -33.5px; margin-top: 54px; width: 90.5%;}
    .today-wrap-popup .slider .slick-list {overflow: visible;}
    .today-wrap-popup .slider .slick-slide {padding: 0 33.5px;}
    .today-wrap-popup .slider .today-title {font-size: 22px;}
}

@media all and (max-width: 768px) {
    .today-wrap-popup {margin-top: 59px; margin-bottom: 30px;}
    .today-wrap-popup .slider .today-title {font-size: 20px; line-height: 30px;}
    .today-wrap-popup .control {display: none;}
    .today-wrap-popup .slider {width: 65.2%; margin: 0 -15px; margin-top: 35px;}
    .today-wrap-popup .slider .slick-slide {padding: 0 15px;}
    .today-wrap-popup .slider li .today-image {height: 330px;}
}

/* 웹접근성으로 인해 추가 */
.today-wrap-popup .control .playstop {float: left; margin-left: 30px;}
.today-wrap-popup .control .playstop button {display: none; width: 9px; height: 15px; text-indent: -9999px;}
.today-wrap-popup .control .playstop button.on {display: block;}
.today-wrap-popup .control .playstop .play {background: url(../images/popup_play.png);}
.today-wrap-popup .control .playstop .stop {background: url(../images/popup_stop.png);}