@charset "utf-8"; 

/*슬라이드*/
.wrap-visual {box-sizing:border-box; position:relative; z-index:1;}
.wrap-visual .slider {position:relative; z-index:1;}
.wrap-visual .slider li {position:relative; text-align:center;}
.wrap-visual .slider li:before {content:""; position:absolute; top:0; left:0px; width:100%; height:700px; z-index:2; background:rgba(11,42,74,0.38);}
.wrap-visual .slider li img {display:inline-block; max-width:none; width:100%; height:700px;}
@media all and (max-width:1484px) {

	.wrap-visual .slider li:before {height:700px;}
	.wrap-visual .slider li img {position:relative; left:50%; transform:translate(-50%,0); width:auto; height:700px;}
}
@media all and (max-width:767px) {
	.wrap-visual .slider li:before {height:815px;}
	.wrap-visual .slider li img {height:815px;}
}

.wrap-visual .control-box {position:absolute; left:50%; bottom:180px; transform:translate(-50%, 0); z-index:99999; padding-right:36px;}
.wrap-visual .control-box .control {position:absolute; right:0;}
.wrap-visual .control-box .count, .wrap-visual .control-box button {display:inline-block;}
.wrap-visual .count {font-family:"Noto Sans KR"; font-weight:300; text-align:center; font-size:1.125rem; color:#ddd; line-height:2rem;}
.wrap-visual .count .now {color:#fff; padding:0 15px 0 10px;}
.wrap-visual .count .total {padding:0 10px 0 8px;}
.wrap-visual .prevnext {display:flex;}
.wrap-visual .prevnext button {width:2rem; height:2rem; text-indent:-9999px;}
.wrap-visual .prevnext .prev {left:20px; background:url('../images/visual_left.png') center center no-repeat;}
.wrap-visual .prevnext .next {left:120px; background:url('../images/visual_right.png') center center no-repeat;}
.wrap-visual .control-box .control button {display:none; width:2rem; height:2rem; background-position:center center; background-repeat:no-repeat; text-indent:-9999px; z-index:9999;}
.wrap-visual .control-box .control button.on {display:block;}
.wrap-visual .control-box .control button.play {background-image:url('../images/visual_play.png');}
.wrap-visual .control-box .control button.stop {background-image:url('../images/visual_pause.png');}



@media all and (max-width:767px) {
	.wrap-visual .control-box {bottom:50px;}
}
@media all and (max-width:400px) {
	.wrap-visual .count .now {padding:0 10px 0 5px;}
	.wrap-visual .count .total {padding:0 5px 0 3px;}
	.wrap-visual .prevnext button {width:1.6rem;}
}