@charset "utf-8";
/* CSS Document */

/*메인비주얼*/
.carousel-control {background:none !important; width:8%;}
.carousel-control .ctl_btn {width:40px; height:72px; background-repeat:no-repeat; background-position:center center;
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
  margin-top: -36px;
}
.carousel-control.left .ctl_btn {background-image:url('img/btn_v_lt.png'); left: 50%; margin-left: -20px;}
.carousel-control.right .ctl_btn {background-image:url('img/btn_v_rt.png'); right: 50%; margin-right: -20px;}

@media (max-width: 1199px) {
.carousel-control .ctl_btn {width:33px; height:60px; margin-top:-30px; background-size:cover;}	
.carousel-control.left .ctl_btn {margin-left: -15px;}
.carousel-control.right .ctl_btn {margin-right: -15px;}	
}

@media (max-width: 991px) {
.carousel-control .ctl_btn {top:47%;}

}

@media (max-width: 575px) {
.carousel-control .ctl_btn {width:20px; height:36px; margin-top:-18px; background-size:cover;}	
.carousel-control.left .ctl_btn {margin-left: -10px;}
.carousel-control.right .ctl_btn {margin-right: -10px;}		

}


.carousel-indicators {
  bottom: 17%;
}
.carousel-indicators li {
  width: 15px;
  height:15px;
  margin:0 5px;
  opacity:1;
  background-color:transparent !important;
  background:url('img/pg.png') no-repeat 0 0;
  
}
.carousel-indicators .active {
  width: 15px;
  height:15px;
  margin:0 5px;  
  opacity:1;	
  background-position:0 -15px;
}

@media (max-width: 991px) {
.carousel-indicators {bottom:15%;}	
.carousel-indicators li {
  width: 12px;
  height:12px;
  margin:0 4px;
  background-size:12px;
  
}
.carousel-indicators .active {
  width: 12px;
  height:12px;
  margin:0 4px;  
  background-position:0 -12px;
}
}


@media (max-width: 575px) {
.carousel-indicators li {
  width: 10px;
  height:10px;
  margin:0 3px;
  background-size:10px;
  
}
.carousel-indicators .active {
  width: 10px;
  height:10px;
  margin:0 3px;  
  background-position:0 -10px;
}
}

@media (max-width:379px) {
.carousel-indicators {bottom:10%;}	
}



.main_visual .item {height:667px; background-repeat:no-repeat; background-position:center center; background-size:cover;}
.main_visual .item1 {background-image:url('img/visual_01.jpg');}
.main_visual .item2 {background-image:url('img/visual_02.jpg');}
.main_visual .item3 {background-image:url('img/visual_03.jpg');}

.main_visual .carousel-caption {
  top:44%;
  left:0;
  right:0;
  bottom:inherit;
  text-align:left;
  text-shadow: 0 0 10px rgba(0, 0, 0, .5);
  transform:translateY(-50%);
  -webkit-transform:translateY(-50%);
  -moz-transform:translateY(-50%);
  font-size:2.53em; 
  line-height:1.2em; 
  letter-spacing:-0.03em;
}
.main_visual .carousel-caption p {width:50%;}

.main_visual .carousel-caption p.txt_big {font-size:1.57em; line-height:1.2em; padding-left:-0.05em; font-weight:700; margin:0 0 .3em;}

@media (max-width: 1199px) {
.main_visual .item {height:0; padding-bottom:56%;}

.main_visual .carousel-caption {padding:0 5%;}
}

@media (max-width: 991px) {
.main_visual .item {padding-bottom:76%;}
.main_visual .item1 {background-image:url('img/mo_visual_01.jpg');}
.main_visual .item2 {background-image:url('img/mo_visual_02.jpg');}
.main_visual .item3 {background-image:url('img/mo_visual_03.jpg');}

.main_visual .carousel-caption {font-size:2.13em; line-height:1.1em;}
.main_visual .carousel-caption p {width:80%;}
}


@media (max-width:575px) {
.main_visual .carousel-caption {font-size:1.63em;}
}


@media (max-width:379px) {
.main_visual .item {padding:0; height:333px;}
}


@media \0screen\,screen\9 {
.main_visual .carousel-caption {margin-top:-103px;}
}


/*carousel 애니*/
.fadeLeft > p,  
.fadeRight > p,  
.fadeUp > p, 
.fadeDown > p 
{position:relative; opacity:0;}

.fadeLeft > p {left:20%;}

.fadeRight > p {right:20%;}

.fadeUp > p {bottom:-150px;}

.fadeDown > p {top:-150px;}


@media all and (min-width:0\0) and (min-resolution:.001dpcm)
{
.fadeLeft > p,  
.fadeRight > p,  
.fadeUp > p,
.fadeDown > p
{opacity:1;}


.fadeLeft > p {left:0;}

.fadeRight > p {right:0;}

.fadeUp > p {bottom:0;}

.fadeDown > p {top:0;}

}

@media \0screen\,screen\9 {
.fadeLeft > p {left:0;}

.fadeRight > p {left:0;}

.fadeUp > p {bottom:0;}	

.fadeDown > p {top:0;}	
}


/*left*/
@keyframes left {
	from {opacity:0; left: 20%;}
    to {opacity:1; left: 0;}	
}

@-webkit-keyframes left {
	from {opacity:0; left: 20%;}
    to {opacity:1; left: 0;}	
}


/*right*/
@keyframes right {
	from {opacity:0; right: 20%;}
    to {opacity:1; right: 0;}
}

@-webkit-keyframes right {
	from {opacity:0; right: 20%;}
    to {opacity:1; right: 0;}
}


/*up*/
@keyframes up {
	from {opacity:0; bottom:-150px;}
    to {opacity:1; bottom:0;}
}

@-webkit-keyframes up {
	from {opacity:0; bottom:-150px;}
    to {opacity:1; bottom:0;}
}

/*down*/
@keyframes down {
	from {opacity:0; top:-150px;}
    to {opacity:1; top:0;}	
}

@-webkit-keyframes down {
	from {opacity:0; top:-150px;}
    to {opacity:1; top:0;}	
}


/*left*/
.fadeLeft > p {
animation:left ease-in-out 1.2s 1 forwards;
-webkit-animation:left ease-in-out 1.2s 1 forwards;
-moz-animation:left ease-in-out 1.2s 1 forwards;
}


/*right*/
.fadeRight > p {
animation:right ease-in-out 1.2s 1 forwards;
-webkit-animation:right ease-in-out 1.2s 1 forwards;
-moz-animation:right ease-in-out 1.2s 1 forwards;
}

/*up*/
.fadeUp > p {
animation: up ease-in-out 1.2s 1 forwards;
-webkit-animation: up ease-in-out 1.2s 1 forwards;
-moz-animation: up ease-in-out 1.2s 1 forwards;
}

/*down*/
.fadeLeft .txt_big {
animation-delay:.1s;
-webkit-animation-delay:.1s;
-moz-animation-delay:.1s;
}

.fadeUp .txt_mdd {
animation-delay:.3s;
-webkit-animation-delay:.3s;
-moz-animation-delay:.3s;
}
