@charset "utf-8";

/* Popup Zone */
.wrap-text-pop {display: inline-flex !important;}
.wrap-pop {position: fixed !important; left: -99999rem; top: 1000%; z-index: 130; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: rgba(0,0,0,0.8); opacity: 0; transition: opacity .75s;}
.wrap-pop.on {opacity: 1; left: 0; top: 0;}
.edit .wrap-pop {position: static; padding: 10rem; opacity: 1; background: rgba(0,0,0,0.45);}
.sub .edit .wrap-pop {display: none;}
.wrap-pop .inner {position: relative; width: 100%; max-width: 172rem;}

.wrap-pop .box-slider {padding: 0 11rem;}
.wrap-pop .slider {overflow: hidden;}
.wrap-pop .slider .swiper-slide {text-align: center;}
.wrap-pop .slider a,
.wrap-pop .slider p {display: block; position: relative; text-align: center; outline: none;}
.wrap-pop .slider a:focus-visible {outline: .1rem solid red}
.wrap-pop .slider img {display: inline-block; width: 100%; max-width: 50rem;}
.wrap-pop .slider .nodata {text-align: center; color: rgba(255,255,255,.5);}

.wrap-pop .control {position: absolute; left: 0; top: 37%; width: 100%; height: 0;}
.wrap-pop .control button {display: inline-block; vertical-align: middle; text-indent: -99999rem;}
.wrap-pop .control button.slick-hidden {display: none;}
.wrap-pop .control .prev,
.wrap-pop .control .next {position: absolute; width: 3.6rem; height: 5.8rem; opacity: .5;}
.wrap-pop .control .prev:hover,
.wrap-pop .control .next:hover {opacity: 1;}
.wrap-pop .control .prev {left: 0; background: url('../images/btn-pop-prev.png') no-repeat center center / cover;}
.wrap-pop .control .next {right: 0; background: url('../images/btn-pop-next.png') no-repeat center center / cover;}
.wrap-pop .box-slider.no-slider .control {display: none;}

.wrap-pop .control2 {display: flex; justify-content: flex-end; margin-top: 5.5rem; text-align: center;}
.wrap-pop .control2 .pop-state {display: flex; align-items: center; font-size: 1.8rem; font-weight: 500; color: #fff;}
.wrap-pop .control2 .pop-state strong {width: 3rem; font-family: paper; font-weight: 700; color: #00e4ff;}
.wrap-pop .control2 .pop-state span {margin: 0 1rem;}
.wrap-pop .control2 .pop-state .under10::before {content: '0';}
.wrap-pop .control2 .playstop {margin-left: 2rem}
.wrap-pop .control2 .playstop button {display: none; width: 2.5rem; height: 2.5rem; border-radius: 100%; text-indent: -99999rem;}
.wrap-pop .control2 .playstop button.on {display: block;}
.wrap-pop .control2 .playstop .stop {background: #fff url('../images/btn-pop-stop.png') no-repeat center;}
.wrap-pop .control2 .playstop .play {background: #fff url('../images/btn-pop-play.png') no-repeat center;}
.wrap-pop .control2 .pop-today {display: flex; flex-direction: row-reverse; align-items: center; height: 4.5rem; margin-left: 3rem; padding: 0 2rem; border: 1px solid rgba(255,255,255,.3); font-size: 1.6rem; font-weight: 400; color: #fff; cursor: pointer;}
.wrap-pop .control2 .pop-today:hover {background: #0599d9; border: 1px solid #0599d9;}
.wrap-pop .control2 .pop-today {display: none;}
.wrap-pop .control2 .pop-today span {display: block;}
.wrap-pop .control2 .pop-today input[type="checkbox"] {position: absolute; right: 2.3rem; top: 1.2rem; z-index: 1; border: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; opacity: 0; cursor: pointer;}
.wrap-pop .control2 .pop-today input[type="checkbox"] + label {position: relative; top: 0; display: inline-block; width: 1rem; height: 1rem; margin-left: 1.5rem; background: url('../images/btn-pop-close2.png') no-repeat center / cover;}
.wrap-pop .control2 .pop-play {padding: 1.4rem 1.1rem; background: #101213; border-radius: 1rem; font-size: 0;}
.wrap-pop .control2 .pop-play .stop,
.wrap-pop .control2 .pop-play .play {display: none; width: .9rem; height: 1.4rem; margin: 0 1rem; text-indent: -9999rem;}
.wrap-pop .control2 .pop-play .stop {background: url('../images/ico-pop-stop.png') no-repeat center center / cover;}
.wrap-pop .control2 .pop-play .play {background: url('../images/ico-pop-play.png') no-repeat center center / cover;}
.wrap-pop .control2 .pop-play .stop.on,
.wrap-pop .control2 .pop-play .play.on {display: inline-block; vertical-align: middle;}

.wrap-pop .pop-close {position: absolute; right: 11rem; top: -10rem; }
.wrap-pop .pop-close button {display: flex; width: 7rem; height: 7rem; background: #0599d9 url('../images/btn-pop-close.png') no-repeat center / 1.8rem auto; border-radius: 100%; text-indent: -9999rem; transition: transform .35s;}
.wrap-pop .pop-close button:hover {transform: rotate(270deg);}

.wrap-pop .no-data {border: 0; color: #fff;}

.wrap-pop .empty-close {display: none;}
.wrap-pop.on .empty-close.on {display: block; position: absolute; right: 3rem; top: -10rem; width: 3.2rem; height: 3.2rem; background: url('../images/btn-menu-close.png') no-repeat center / cover; text-indent: -9999rem;}

@media print {
	.wrap-pop {display: none;}
}

@media screen and (max-width: 1720px) {
	.wrap-pop .inner {padding: 0 2rem;}
	.wrap-pop .title {margin-top: 1rem;}
	.wrap-pop .title strong {font-size: 3rem;}
	.wrap-pop .pop-close {right: 13rem;}
	.wrap-pop .control .prev {left: 2rem;}
	.wrap-pop .control .next {right: 2rem;}
}

@media screen and (max-width: 800px) {
	.wrap-pop .title strong {font-size: 2.5rem;}
	.wrap-pop .pop-close button {width: 5.5rem; height: 5.5rem;}
}

@media screen and (max-width: 700px) {
	.wrap-pop .title {padding: 0 6rem;}
	.wrap-pop .box-slider {padding: 0 6rem;}
	.wrap-pop .pop-close {right: 8rem; top: -8rem;}
	.wrap-pop .control2 {margin-top: 3rem;}
}

@media screen and (max-width: 600px) {
	.wrap-pop .title {padding: 0 15rem 0 0;}
	.wrap-pop .title strong {font-size: 4rem; line-height: 1;}
	.wrap-pop .pop-close {right: 6.5rem;}
	.wrap-pop .pop-close button {width: 5rem; height: 5rem;}
	.wrap-pop .box-slider {padding: 0 4.5rem;}
	.wrap-pop .control {top: 36%;}
	.wrap-pop .control .prev,
	.wrap-pop .control .next {width: 2.6rem; height: 4.1rem;}
	.wrap-pop .control2 .pop-today {margin-left: 2rem; font-size: 1.3rem;}
}