:root {
  --animate-delay: 0.5s;
}
/********************************************************
■ 공통폰트
********************************************************/
#wrap h2{font-size: 3.25rem; font-weight:600;}


@media (max-width:767px){
	#wrap h2{font-size: 2rem;}
}

/*******레이어팝업**********/
.layerPopup{background:#fff !important; border: 10px solid #fff !important; }


/********************************************************
■ 메인비주얼
********************************************************/
/*메인 비주얼*/ 
.slick-list,
.slick-track{height: 100% !important;}
#visual{ position:relative; height:47.8rem; overflow:hidden;}
.visual-wrap {width: 100%; height: 100%;}
.visual-item {width: 100%; height: 100%; overflow:hidden; position:relative;}
.visual-item:before {content:''; display:inline-block; vertical-align:middle; width:0; height:100%; font-size:0;}
.visual-inner {position:relative; display: flex; width: 1400px; margin: 0 auto; color:#fff; z-index:10;}
.visual-inner .ptext {position:relative; width: 100%;}
.visual-inner .ptext h2{font-weight: 300; line-height: 1.2;}
.visual-inner .ptext h2 b{font-weight: 500;}
.visual-inner .ptext p{margin-top: 1.5rem; font-size: 1.1rem; font-weight: 300;}
.visual-inner .ptext p.s_txt{font-size:0.9rem;}
.visual-inner .ptext p b{font-weight: 400;}
.visual-inner .ptext .text{-webkit-transition: opacity 0.7s, transform 0.7s; -o-transition:transform 0.7s, opacity 0.7s; transition:opacity 0.7s, transform 0.7s; 
-webkit-transform:translate(0, 1rem);-ms-transform:translate(0, 1rem);transform:translate(0, 1rem); opacity:0}
.visual-inner.is-active .ptext .text{-webkit-transition-delay:0.4s; -o-transition-delay:0.4s; transition-delay:0.4s;
-webkit-transform:translate(0, 0); -ms-transform:translate(0, 0); transform:translate(0, 0); opacity:1}
.visual-inner .ptext .text a{display:inline-block;border:1px solid #fff;color:#fff;padding:1rem 4.5rem 1rem 1.5rem;border-radius:40px;margin-top:2rem;position:relative;-webkit-transition: color .3s;transition: color .3s;}
.visual-inner .ptext .text a:after{content:'';display:block;position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:url("/images/default/main/visual_arrow.png")no-repeat center center;width:1.35rem;height:1.35rem;background-size:100% auto;}
.visual-inner .ptext .text a:hover { background:#fff; color: #000; transition: all 0.4s; }
.visual-inner .ptext .text a:hover:after{background:url("/images/default/main/visual_arrow_ov.png")no-repeat center center;}

.visual-inner > h3{font-weight:600; line-height:1.2; margin-bottom:1rem;}
.visual-inner > p{ color:rgba(255, 255, 255, 0.7);}
.visual-inner > h2{position: absolute; bottom: -.55rem; left:0; width: 100%;}

.nth-5 .ptext{color:#333;}
.nth-5 .ptext .text a{display:inline-block;border:1px solid #333;color:#333;padding:1rem 4.5rem 1rem 1.5rem;border-radius:40px;margin-top:2rem;position:relative;
}
.nth-5 .ptext .text a:after{content:'';display:block;position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:url("/images/default/main/visual_arrow_ov.png")no-repeat center center;width:1.35rem;height:1.35rem;background-size:cover;}

/*메인 페이징바*/
#visual .slick-control {display: flex; justify-content: flex-start; position: absolute; width: 1400px; bottom: 10rem; left: 50%;  -webkit-transform: translateX(-50%);    transform: translateX(-50%);}
#visual .slick-dots {display: flex;  justify-content: flex-start;  }
#visual .slick-dots a{color:#fff; font-size:1rem; display: flex;  align-items: center;}
#visual .slider-nav { margin-right: 1.5rem; font-size: 0.8rem; color: #fff;}
#visual .slider-nav-bar { position: relative; margin-left: 0.5rem; width: 0; height: 2px; background-color: rgba(255, 255, 255, 0.5);}
#visual .slider-nav-bar::after { content: ""; position: absolute; top: 0; left: 0; width: 0; height: 100%; background-color: #fff;}
#visual .slick-active .slider-nav-bar { width: 3rem;}
#visual .slick-active .slider-nav-bar::after { width: 100%; -webkit-transition: width 7.5s linear; transition: width 7.5s linear;}
#visual .slick-active .slider-nav-bar::after { width: 0; -webkit-animation: fillSliderBar 7.5s infinite linear;  animation: fillSliderBar 7.5s infinite linear;}

@-webkit-keyframes fillSliderBar {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
@keyframes fillSliderBar {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
#visual .slick-control .control{  display: flex; align-items: center;}
#visual .slick-control .control a{display:inline-block; font-size:0; width:.75rem; height:.75rem; opacity:0.6; margin-right:.5rem;}
#visual .slick-control .control a.on{opacity:1;}
#visual .slick-control .control a.play{background: url('/images/default/main/slider-play.png') no-repeat center top; background-size:100% 100%;}
#visual .slick-control .control a.pause{background: url('/images/default/main/slider-pause.png') no-repeat center top; background-size:100% 100%;}

/*메인 Arrow*/
.slick-arrow{position:absolute; top:50%; transform:translateY(-50%); z-index:10; font-size:0; width:2.1rem; height:4.05rem; opacity:0.6; transition: 0.3s;}
.slick-arrow:hover{opacity:1;}
.slick-prev{left:1rem;background: url('/images/default/main/pre.png') no-repeat center top; background-size:100% 100%;}
.slick-next{right:1rem;background: url('/images/default/main/nex.png') no-repeat center top;background-size:100% 100%;}


/*비주얼 백그라운드*/
.visual-item > .bg {position:absolute; height:100%; width:100%; top:50%; left:50%; overflow:hidden; transform:translate(-50%, -50%); z-index:-1;}
/* .visual-item > .bg:before {content:''; display:block; position:absolute; height:100%; width:100%;top:50%; left:50%; transform:translate(-50%, -50%); background:rgba(0, 0 , 0, 0.4); z-index:1;} */
.visual-item > .bg .visual-img{
	-webkit-transition:all 6s ease-in-out;
	-webkit-transform:scale(1);
	-ms-transition:transform 6s ease-in-out ;
	-ms-transform: scale(1);
	transition:all 6s ease-in-out;
	transform:scale(1);
}
.slick-active > .bg .visual-img.is-scale{ 
	-webkit-transition:all 10s ease-in-out;
	-webkit-transform:scale(1.2);
	-ms-transition:transform 10s ease-in-out ;
	-ms-transform: scale(1.2);
	transition:all 10s ease-in-out;
	transform:scale(1.2);
}
.visual-img,
.visual-img span{display: block; width:100%; height:100%;}
.is-opacity {
  -webkit-animation-name: is-opacity;
  -webkit-animation-duration: 10s;
  -ms-animation-name: is-opacity;
  -ms-animation-duration: 10s;
  animation-name: is-opacity;
  animation-duration: 10s;
}
@keyframes is-opacity {
  0% { opacity:0; }
  100% { opacity:1; }
}
@-ms-keyframes is-opacity {
  0% { opacity:0; }
  
  100% { opacity:1; }
}
@-webkit-keyframes is-opacity {
  0% { opacity:0; }
  
  100% { opacity:1; }
}

@media (max-width:1400px){
	.visual-inner {width: 100%; padding: 0 1rem;} 
	.page_num{padding-left:1rem;bottom:3rem;}

	#visual .slick-control{width:100%; left:0%;-webkit-transform: translateX(0%);    transform: translateX(0%);}
}
@media (max-width:1030px){
	#visual .slick-control{bottom:3rem;}
}

@media (max-width:767px){
	#visual{height:30rem;}
	.visual-inner .ptext .text a{padding:0.5rem 2.5rem 0.5rem 0.75rem; font-size:0.7rem;}
	.visual-inner .ptext .text a:after{width:1rem;height:1rem;}
	.visual-inner .ptext p{width:80%;}
	.visual-inner .ptext p br{display:none;}
}
@media (max-width:467px){
	#visual .slider-nav{margin-right:.5rem}
	#visual .slick-active .slider-nav-bar{width:2rem;}
}


/********************************************************
■ 메인컨텐츠
********************************************************/
.cts1{width:1400px; margin:0 auto;  padding:5.4rem 0;}
.cts1 .inn{display:flex; margin:0 -2.5rem;}
.cts1 .ctBox{flex:1; margin:0 2.5rem;}
.cts1 .ctBox a{display:flex; flex-direction: column;}
.cts1 .ctBox .title{position:relative; margin-bottom:1.5rem;}
.cts1 .ctBox .title h3{font-size:1.1rem; font-weight:bold; color:#333; line-height:1; letter-spacing:0; text-transform:uppercase; padding-top:13px;}
.cts1 .ctBox .title h3:before{content : ""; display : block; position : absolute; left : 0; top:0;  width :2rem; height : 1px; background : #333;}
.cts1 .ctBox .title p{position:absolute; right:0; top:5px; font-size:0.75rem; color:#666; font-weight:500;}
.cts1 .ctBox .title p i{vertical-align:middle; color:#dbdcdf; font-size:1.1rem;}

.cts1 .ctBox .gimg{overflow:hidden; position:relative; border-bottom:none; margin-bottom:0;}
.cts1 .ctBox .gimg em{position:absolute; left:0px; top:0px; background:#262520; color:#fff; width:4rem; height:2rem; line-height:2rem; border-radius:0 0 .75rem 0; text-align:center; font-weight:600; z-index: 1;}
.cts1 .ctBox .gimg span{width:100%; padding-top:75.25%;  display: inline-block; 	transition: transform .3s ease-out; }
.cts1 .ctBox a:hover .gimg span{transform: scale(1.1);}
.cts1 .ctBox a:hover .title p i{color:#2ec1ff;}

@media (max-width:1400px){
	.cts1{width:100%; padding:5.4rem 1rem;}
}
@media (max-width:1030px){
	.cts1 .inn{margin:0 -1rem;}
	.cts1 .ctBox{margin:0 1rem;}
}
@media (max-width:767px){
	.cts1 .inn{display:block; margin:0; margin-top:-3rem;}
	.cts1 .ctBox{margin:0; margin-top:3rem;}
	.cts1 .ctBox .title h3{font-size:1.3rem;}
	.cts1 .ctBox .title p{font-size:1rem;}
}