
/* ******************  메인 비주얼 ********************** */
#siteVisual .slick-prev:before, #siteVisual .slick-next:before,
#siteVisual .slick-dots li button:before{display:none!important}
#siteVisual{ position:relative;  margin:0 100px; }
.slick-track,.slick-list{-webkit-perspective:2000;-webkit-backface-visibility:hidden}
#siteVisual .main-visual-list-con,#siteVisual .visual-wrapper,#siteVisual .slick-list,#siteVisual .slick-track,.visual-each{height:100%}
.visual-wrapper{z-index:1;overflow:visible}
.visual-each{opacity:0;visibility:hidden;transition:opacity 1s ease;-webkit-transition:opacity 1s ease}
.visual-wrapper.slick-initialized .visual-each{visibility:visible;opacity:1}
/* 메인 비주얼 :: 이미지 */
.visual-each{position:relative; overflow:hidden/*;height:681px*/}
.visual-each .img-pc{
	width:100%;
	height:100%;
	-ms-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1); 
    -moz-transform: scale(1.1,1.1); 
    -webkit-transform: scale(1.1,1.1); 
     transform: scale(1.1,1.1);
	-webkit-transition:transform 5000ms  ease-in-out ;
	-moz-transition:transform 5000ms ease-in-out ;
	-o-transition:transform 5000ms ease-in-out ;
	-ms-transition:transform 5000ms ease-in-out ;
    transition:transform 5000ms ease-in-out ;	
}
.visual-each .img-pc img{width:100%;}

/* 메인 비주얼 :: 텍스트 */
.visual-each .visual-txt{position:absolute; top:0; left:0px; width:450px; bottom:0px;} /* margin-top은 조정 (텍스트영역 높이의 반) */
.visual-each .visual-txt:before{
	position:absolute; top:0px; left:0px; width:0; bottom:0px; z-index:1; background:url(/wp-content/themes/Givia/img/0-Mainvisual/ui/bg.png) no-repeat 0 0; content:"";
	-webkit-transition:opacity 1.0s, width 1.2s;
	-moz-transition:opacity 1.0s, width 1.2s;
	-o-transition:opacity 1.0s, width 1.2s;
	-ms-transition:opacity 1.0s, width 1.2s;
	transition:opacity 1.0s, width 1.2s;
}
.visual-each .visual-txt .tc {
    padding-left: 60px;
    padding-right: 37px;
}
.visual-each .visual-txt .visual-comment1,
.visual-each .visual-txt .visual-comment2,
.visual-each .visual-txt .visual-comment3,
.visual-each .btn-wrap{
	overflow:hidden;
	position:relative; z-index:10;
}
.visual-each .visual-txt .visual-comment1 {
    margin-bottom: 26px;
}
.visual-each .visual-txt .visual-comment2{margin-bottom:53px}
.visual-each .visual-txt .visual-comment2 br{display:none}
.visual-each .visual-txt .visual-comment1-2{margin-bottom:53px}
.visual-each .visual-txt .visual-comment1 strong,
.visual-each .visual-txt .visual-comment2 span,
.visual-each .visual-txt .visual-comment3 span,
.visual-each .btn-wrap{
	opacity:0;filter:Alpha(opacity=0);
	-webkit-transform:translateY(100%);
	transform:translateY(100%);
	-webkit-transition: opacity 1.4s  cubic-bezier(0.47, 0, 0.31, 1.04) 0.2s, transform 1.4s cubic-bezier(0.47, 0, 0.31, 1.04) 0.2s;
	transition: opacity 1.4s  cubic-bezier(0.47, 0, 0.31, 1.04) 0.2s, transform 1.4s cubic-bezier(0.47, 0, 0.31, 1.04) 0.2s;
}
.visual-each .btn-wrap a {
    background-color: #fff;
    color: #1942A6;
}
.visual-each .btn-wrap a:hover {
    color: #fff;
}
.visual-each .btn-wrap::before {
    content: '';
    display: block;
    height: 2px;
    background: #fff;
    width: 141px;
    margin-bottom:41px;
}
.visual-each .visual-txt .visual-comment1 strong{display:block;letter-spacing:-0.011em;font-size:55px;color:#fff;line-height:70px;text-transform:uppercase;font-family:'Teko',sans-serif;font-weight:500}
.visual-each02 .visual-txt .visual-comment1 strong{font-size:64px;}
.visual-each .visual-txt .visual-comment1-2 strong{-webkit-transition-delay:0.5s;-moz-transition-delay:0.5s;-o-transition-delay:0.5s;-ms-transition-delay:0.5s;transition-delay:0.4s;}
.visual-each .visual-txt .visual-comment2 span,
.visual-each .visual-txt .visual-comment3 span{
    display: block;
    font-size: 22px;
    font-weight: 200;
    letter-spacing: -0.011em;
    color: #fff;
}
.visual-each .visual-txt .visual-comment2 span{margin-bottom:20px; -webkit-transition-delay:0.5s;-moz-transition-delay:0.5s;-o-transition-delay:0.5s;-ms-transition-delay:0.5s;transition-delay:0.5s;}
.visual-each .visual-txt .visual-comment3 span{-webkit-transition-delay:0.8s;-moz-transition-delay:0.8s;-o-transition-delay:0.8s;-ms-transition-delay:0.8s;transition-delay:0.8s;}
.visual-each .btn-wrap{-webkit-transition-delay:1s;-moz-transition-delay:1s;-o-transition-delay:1s;-ms-transition-delay:1s;transition-delay:1s;margin-top:0}
.visual-each .visual-txt .visual-comment2 b,
.visual-each .visual-txt .visual-comment3 b{font-weight:500;}

/* 메인 비주얼 :: 제품이미지 */
.img-float{position:absolute; bottom:30px; right:30px;  width:25%}
.visual-each03 .img-float img{max-width:100%; width:100%;}

/* 메인 비주얼 :: active효과 */
.visual-each.active-item .img-pc{
	-ms-transform: scale(1.0,1.0) rotate(0.0001deg);
    -o-transform: scale(1.0,1.0) rotate(0.0001deg);
    -moz-transform: scale(1.0,1.0) rotate(0.0001deg);
    -webkit-transform: scale(1.0,1.0) rotate(0.0001deg);
     transform: scale(1.0,1.0) rotate(0.0001deg);
}
.visual-each.active-item .visual-txt:before{width:450px}
.visual-each.active-item .visual-comment1 strong,
.visual-each.active-item .visual-comment2 span,
.visual-each.active-item .visual-comment3 span,
.visual-each.active-item .btn-wrap{
	opacity:1.0;filter:Alpha(opacity=100);
	-webkit-transform:translateX(0);
	transform:translateX(0);
}
.visual-each .btn-wrap a {
    background-color: #fff;
    color: #1942A6;
    padding:5px 20px;
    width:auto
}
.visual-each .btn-wrap a:hover {
    color: #fff;
}
/* 메인 비주얼 :: 버튼 */
#siteVisual .slick-dots{position:absolute; width:100px; text-align:center; left:-100px; top:50%; margin-top:-60px;}
#siteVisual .slick-dots li{margin:27px auto 27px; height:3px; display:block}
#siteVisual .slick-dots li button{
	margin:0 auto;
	cursor:pointer; margin:0px; padding:0px; background:none; font-size:0; width:15px; height:15px; background-color:#ddd; vertical-align:top;
}
#siteVisual .slick-dots li.slick-active button{background-color:#1942a6}		/* 버튼 active */

/* 메인 비주얼 :: 화살표 */
#siteVisual .slick-arrow{	position:absolute; width:100px; height:100px; left:-100px;cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0;}		/* 버튼이미지에 맞게 크기 수정 */
#siteVisual .slick-arrow.slick-prev{top:50%; margin-top:-190px; background:url(/wp-content/themes/Givia/img/0-Mainvisual/ui/up.png) no-repeat 50% 50%}
#siteVisual .slick-arrow.slick-next{bottom:50%; top:auto;margin-bottom:-170px; background:url(/wp-content/themes/Givia/img/0-Mainvisual/ui/down.png) no-repeat 50% 50%}

/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:absolute; bottom:55px; left:50%; margin-left:-41px; text-align:center; z-index:9}	/* width값에 맞게 margin-left수정 */
.main-scroll-icon span{display:block; color:#fff; padding-bottom:5px; letter-spacing:-0.5px; font-weight:300; }






@media all and (max-width: 1600px){
	.visual-each .btn-wrap::before{display:none}
	.visual-each .visual-txt .visual-comment2{margin-bottom:0}
}
@media all and (max-width: 1380px){
	#siteVisual{margin:0}
	/* 메인 비주얼 :: 텍스트 */ 
	.visual-each .visual-txt{width:330px}
	.visual-each .visual-txt .visual-comment1{margin-bottom:0}
	.visual-each .visual-txt .visual-comment1,
	.visual-each .visual-txt .visual-comment2,
	.visual-each .visual-txt .visual-comment3,
	.visual-each .visual-txt .main-visual-more-btn,.visual-each .btn-wrap{margin-left:25px;}
	.visual-each .visual-txt .visual-comment1 strong{font-size:38px !important; line-height:1.5}
	.visual-each .visual-txt .visual-comment2 span,
	.visual-each .visual-txt .visual-comment3 span{font-size:17px; line-height:1.3}

	/* 메인 비주얼 :: 버튼 */
	#siteVisual .slick-dots{top:auto; bottom:23px; width:330px; left:0; margin-top:0;}
	#siteVisual .slick-dots li{display:inline-block; margin:0 5px;}
	#siteVisual .slick-dots li button{background-color:#fff;}

	/* 메인 비주얼 :: 화살표 */
	#siteVisual .slick-arrow{left:0; width:70px; height:70px;}
	#siteVisual .slick-arrow.slick-prev{top:auto; bottom:0; left:50px; margin-top:0; background-image:url(/wp-content/themes/Givia/img/0-Mainvisual/ui/prev.png)}
	#siteVisual .slick-arrow.slick-next{bottom:0; margin-left:210px;  margin-bottom:0; background-image:url(/wp-content/themes/Givia/img/0-Mainvisual/ui/next.png)}
}
@media all and ( max-width: 800px ){
	.visual-each .visual-txt{
		position: relative;
	    top: auto;
	    right: auto;
	    left: auto;
	    bottom: auto;
	    width: 100%;
	    height: auto;
	    padding:20px 0;
	    background: url(/wp-content/themes/Givia/img/0-Mainvisual/ui/bg_m.png) repeat-x;
	    background-size: cover
	}
	.visual-each .visual-txt .tc{padding:0}
	.visual-each.active-item .btn-wrap{text-align:left;margin-left:25px;margin-top:14px}
	.visual-each.active-item .btn-wrap a{font-size:10px}
	.visual-each .visual-txt:before,.visual-each .btn-wrap::before{display:none;}
	.visual-each .visual-txt .visual-comment1-2,.visual-each .visual-txt .visual-comment2{margin-bottom:0}
	.visual-each .visual-txt .visual-comment1 strong{font-size:40px !important; line-height:46px; }
	.visual-each .visual-txt .visual-comment2 span{font-size:14px; line-height:18px; margin-bottom:10px;}
	.visual-each .visual-txt .visual-comment3 span{font-size:14px; line-height:18px;  }
	/* 메인 비주얼 :: 화살표 */
	#siteVisual .slick-arrow{width:30px;height:30px}
	#siteVisual .slick-arrow.slick-prev{bottom:36%;left:80%}
	#siteVisual .slick-arrow.slick-next{top:auto;margin-left:0;bottom:36%;left:89%}
	#siteVisual .slick-dots{display:none !important;}
}

@media all and (max-width:480px){
	/* 메인 비주얼 :: 텍스트 */
	.visual-each .visual-txt .visual-comment1{display:inline-block; vertical-align:top; margin-bottom:10px;}
	.visual-each .visual-txt .visual-comment1-2{margin-bottom:0;margin-left:5px}
	.visual-each .visual-txt .visual-comment1 strong{font-size:26px!important;line-height:28px;letter-spacing:1px}
	.visual-each .visual-txt .visual-comment2 span{font-size:13px; margin-bottom:0;}
	.visual-each .visual-txt .visual-comment2 span, .visual-each .visual-txt .visual-comment3 span{letter-spacing:-0.5px;}
	#siteVisual .slick-arrow{width:30px; height:30px}
	
}
@media all and (max-width:359px){
	/* 메인 비주얼 :: 텍스트 */
	.visual-each .visual-txt .visual-comment1{display:block; margin-bottom:10px;}
	.visual-each .visual-txt .visual-comment1-1{margin-bottom:3px;}
	.visual-each .visual-txt .visual-comment1-2{margin-left:25px;}
}