@charset "utf-8";


.main-visual ._fnctWrap ._fnctAdmin {top: 95px;}

/* visual */ 
.wrap-visual {height: calc(100vh - 0px);z-index: 0;position: relative;}
.wrap-visual .slider {position:relative;z-index: 0;height: 100%;background: #ccc;}
.wrap-visual .slider li {position:relative;text-align:center;height: 100%;}
.wrap-visual .slider li:before {content:'';width:100%;height: 100%;position: absolute;left: 0;top: 0;background: #00000052;z-index: 1;}
.wrap-visual .slider li img {object-fit: cover;width: 100%;display: block;height: 100%;}
.wrap-visual .slider * {height:100%}

.wrap-visual button {}
.wrap-visual .prevnext{ }
.wrap-visual .prevnext > div { display: flex;   }
.wrap-visual .prevnext button {width: 20px;z-index:1;background-size: contain !important;margin-right: 15px;}
.wrap-visual .prevnext button.prev {background: url('../images/chevron-left-w.png') left center no-repeat;}
.wrap-visual .prevnext button.next {background: url('../images/chevron-right-w.png') right center no-repeat;}
.wrap-visual .control {margin-top: 60px;display: flex;}
.wrap-visual .control .playstop, .wrap-visual .control .paging{ }
.wrap-visual .control .playstop {margin-left: 6px;margin-top: -6px;}
.wrap-visual .control .paging {height: 4px;margin: 3px 15px;}
.wrap-visual .control .paging ul {height:100%; }
.wrap-visual .control .paging li {display:inline-block; height:100%;}
.wrap-visual .control .paging button {text-indent: inherit; width: 40px;text-indent: -9999px; border: 2px solid #fff;margin: 0px 0;height: 100%;}
.wrap-visual .control .paging .slick-active button {border-color: #2e92e4;}
.wrap-visual .control .playstop button {display:none;width: 30px;height: 30px;background-size: 80% !important;text-indent: -9999px;transform: rotate(0deg);background-size: 21px !important;position: relative;top: 3px;border: 2px solid #ffffffa6;border-radius: 50px;background-size: 55% !important;}
.wrap-visual .control .playstop button.on {display:inline-block;}
.wrap-visual .control .playstop button.play {background:url('../images/play-w.png') no-repeat center;}
.wrap-visual .control .playstop button.stop {background:url('../images/pause-w.png') no-repeat center;}
.wrap-visual .control .count {color:#fff;padding: 4px 0 5px;display: flex;line-height: 1.1;}
.wrap-visual .control .count span {padding: 0px 14px;line-height: 1;min-width: 40px;font-size: 20px;}
   

/* visual 글씨 */ 
.visualBox{position: absolute;max-width: 1700px;width: 100%;top: 260px;box-sizing:border-box;margin: 0 auto;z-index: 1;left: 50%;transform: translateX(-50%);padding: 0 20px;}
.visualBox .main-slogan {position: relative;color: #fff;margin: 0 auto;}
.visualBox .main-slogan p {text-shadow: 0px 0px 5px #131313c7;line-height: 1.2;}
.visualBox .p-1 {margin-bottom: 50px;font-size: 55px;font-weight: bold;}
.visualBox .p-2 {font-size: 26px;}


.wrap-visual .scroll-wrap {position: absolute;max-width: 1700px;left: 50%;transform: translateX(-50%);width: 100%;top: 260px;}
.wrap-visual .scroll {position: relative;float:right;padding-bottom: 100px;display: block;}
.wrap-visual .scroll:before, .wrap-visual .scroll:after {content: '';position: absolute;bottom: 0;left: 16px;height: 30%;border: 1px solid #ffffff5c;}
.wrap-visual .scroll:after {border-color: #ffffff9e;animation: scroll_ani 1.9s cubic-bezier(0.445,0.05,0.55,0.95) infinite;}
.wrap-visual .scroll .circle {position: relative;border: 1px solid #ffffffb3;aspect-ratio: 1/1.6;border-radius: 50px;width: 22px;margin: 0 auto;margin-bottom: 8px;}
.wrap-visual .scroll .circle::before {content: '';position: absolute;left: 8px;height: 8px;width: 5px;top: 8px;background: #ffffffc4;border-radius: 50px;}
.wrap-visual .scroll .txt{color: #fff;writing-mode: vertical-rl;margin-top: 15px;font-size: 16px;}

@keyframes scroll_ani {
    0%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center top;transform-origin:center bottom}
    49%{-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center top;transform-origin:center bottom}
    50%{-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center bottom;transform-origin:center top}
    99%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center bottom;transform-origin:center top}
    100%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center bottom;transform-origin:center top}
}

@media all and (min-width: 1024px) { 
    
	.prevnext button:hover {transition: 0.3s;} 
    
}
@media all and (max-width:1500px){
	
	.wrap-visual .scroll-wrap {right:50px}
	
}
@media all and (max-width:1300px){

	.wrap-visual {height: calc(100vh - 100px);} 
	.visualBox {top: 170px;}
	.visualBox .p-1 {font-size: 50px;}
	.visualBox .p-2 {font-size: 25px;}
	
}
@media all and (max-width:1024px){
	
	.wrap-visual {margin-top: 0px;height: 550px;} 
	.visualBox {/* top: 120px; */width: 95%;text-align: center;}
	.visualBox .main-slogan p {line-height: 1.1;}
	.visualBox .p-1 {font-size: 33px;margin-bottom: 30px;}
	.visualBox .p-2 {font-size: 21px;}
	.wrap-visual .scroll-wrap {display:none}
	.wrap-visual .control {margin-top: 50px;justify-content: center;}  
	
}
@media all and (max-width:768px){

	.wrap-visual{height: 420px;}  
	.wrap-visual .control {margin-top: 50px;}
	.visualBox {top: 130px;}
	.visualBox .p-1{font-size: 28px;}
	.visualBox .p-2{font-size: 18px;}  
	.wrap-visual .control .playstop {margin-left: 0;}
	.wrap-visual .control .paging {margin: 2px 10px;height: 2px;} 
	.wrap-visual .control .paging button {width: 35px;} 
	.wrap-visual .control {margin-top: 40px;} 
	.wrap-visual .control .count span {padding: 0px 8px;min-width: 30px;font-size: 18px;} 
	.visualBox .p-1{font-size: 31px;margin-bottom: 20px;}
	.visualBox .p-2{font-size: 18px;}  
	
}

@media all and (max-width:550px){  

	
}