@charset "UTF-8";

.wrap_visual{position:relative;}
.wrap_visual .slick-list{position:relative;top:0;left:50%;width:2000px;margin-left:-1000px;}
.wrap_visual .slick-list .slick-track .slick-slide img{width:100%}
/*애니메이션*/
.wrap_visual .slick-list .slick-track .slick-slide img{animation-name:mainVisual;animation-duration:5s;animation-fill-mode:forwards;}
@keyframes mainVisual{
	0%{transform:scale(1);filter:blur(100px);filter:grayscale(1);}
	100%{transform:scale(1.05);filter:blur(0px);filter:grayscale(0);}
}

/*가로2000이상꽉차게*/
@media only screen and (min-width:2001px){
	.wrap_visual .slick-list{left:0;width:100%;margin-left:0;}
}
@media only screen and (max-width:1024px){
	.wrap_visual .slick-list{width:1440px;margin-left:-720px;}
}
@media only screen and (max-width:768px){
	.wrap_visual .slick-list{width:1024px;margin-left:-512px;}
}

/*넘버링*/
.wrap_visual .numbering{display:none;}

/*공통*/
.wrap_visual .playstop,
.wrap_visual .paging li{line-height:0;}
.wrap_visual .paging button,
.wrap_visual .playstop button,
.wrap_visual .prevnext button{display:inline-block;text-indent:-9999px;}

/*컨트롤*/
.wrap_visual .control{position:absolute;left:0;bottom:30px;width:100%;}
.wrap_visual .control .container{display:flex;justify-content:center;align-items:center;}
	/*페이징*/
	.wrap_visual .paging{}
	.wrap_visual .paging ul{display:flex;justify-content:center;}
	.wrap_visual .paging li{padding:0 3px;}
	.wrap_visual .paging button{width:20px;height:2px;background:#FFF;}
	.wrap_visual .paging li.slick-active button{background:#6dcff6;}
	/*재생정지*/
	.wrap_visual .playstop{display:none;margin-left:10px;}
	.wrap_visual .playstop button{display:none;width:9px;height:12px;}
	.wrap_visual .playstop button.play{background:url(/sites/style_guide/images/common/play_2_w.png) no-repeat center;}
	.wrap_visual .playstop button.stop{background:url(/sites/style_guide/images/common/pause_2_w.png) no-repeat center;}
	.wrap_visual .playstop button.on{display:inline-block;}

/*이전다음*/
.wrap_visual .prevnext{display:none;}
.wrap_visual .prevnext .container{}
.wrap_visual .prevnext button{width:60px;height:60px;background:rgba(0,0,0,0.7) url(/sites/style_guide/images/common/arrow_5_w.png) no-repeat center;position:absolute;top:calc(50% - 30px);}
.wrap_visual .prevnext button.prev{left:0;transform:rotate(180deg);}
.wrap_visual .prevnext button.next{right:0;}
@media only screen and (max-width:768px){
	.wrap_visual .prevnext button{width:45px;height:45px;top:calc(50% - 22.5px);background-size:10px;}
}


/*HOVER효과************************************************************/
@media all and (min-width:1025px) {
}