/* about */
.ab_vis_1 {position:absolute; width:2000px; height:700px; left:calc(50% - 550px); top:180px; background-position:0px 0px; animation:ab_1 3s 0s ease-in-out normal forwards; opacity:.2; background-size:95% 95%;}
@keyframes ab_1 {
  0% {
    opacity:.2;
	background-size:95% 95%;
  }
  100% {
    opacity:1;
	background-size:100% 100%;  
  }
}
.ab_bg_1 {background:url('../img/sub/s_vis_ab_1.jpg') no-repeat;}
.ab_bg_2 {background:url('../img/sub/s_vis_ab_3.jpg') no-repeat;}

.ab_vis_txt_1 {position:absolute; top:300px; left:calc(50% - 700px); font-size:60px; font-weight:800; color:#fff; letter-spacing:-2px; line-height:120%; text-align:center; text-shadow:0px 0px 15px rgba(0,0,0,.15); animation:ab_2 2.5s 0.5s ease normal forwards; opacity:0; word-break:keep-all;}
@keyframes ab_2 {
  0% {
    opacity:0;
	left:calc(50% - 620px); 
  }
  100% {
    opacity:1;
	left:calc(50% - 700px);  
  }
}

.ab_vis_txt_2 {position:absolute; top:460px; left:calc(50% - 350px); font-size:17px; font-weight:400; color:rgba(255,255,255,.9); letter-spacing:normal; line-height:140%; text-align:left; text-shadow:0px 0px 15px rgba(0,0,0,.35); animation:ab_3 2.5s 1s ease normal forwards; opacity:0; word-break:keep-all;}
@keyframes ab_3 {
  0% {
    opacity:0;
	left:calc(50% - 300px); 
  }
  100% {
    opacity:1;
	left:calc(50% - 350px);  
  }
}

.ab_txt_1 {position:relative; width:100%; font-size:40px; font-weight:300; color:#fff; text-align:left; line-height:110%; letter-spacing:-0.5px; font-family:NanumSquare,Pretendard,HelveticaNeue,'¸¼Àº °íµñ','malgun gothic','Apple SD Gothic Neo','Apple SD »êµ¹°íµñ Neo','Microsoft NeoGothic','Droid sans',sans-serif; padding-bottom:20px; word-break:keep-all;}
.ab_txt_2 {position:relative; width:60%; font-size:18px; font-weight:300; color:rgba(255,255,255,.8); text-align:left; line-height:160%; letter-spacing:-0.2px; word-break:keep-all; padding-bottom:160px;}
.ab_txt_3 {position:relative; width:70%; font-size:16px; font-weight:300; color:rgba(255,255,255,.8); text-align:left; line-height:180%; letter-spacing:normal; word-break:keep-all;}
.ab_txt_4 {position:relative; width:70%; font-size:17px; font-weight:800; color:rgba(255,255,255,1); text-align:left; line-height:100%; letter-spacing:normal; word-break:keep-all; padding-bottom:7px; padding-top:17px; font-family:NanumSquare,Pretendard,HelveticaNeue,'¸¼Àº °íµñ','malgun gothic','Apple SD Gothic Neo','Apple SD »êµ¹°íµñ Neo','Microsoft NeoGothic','Droid sans',sans-serif; z-index:1000;}
.ab_txt_5 {position:relative; width:80%; font-size:16px; font-weight:300; color:rgba(255,255,255,.8); text-align:left; line-height:160%; letter-spacing:normal; word-break:keep-all; padding-bottom:35px; z-index:1000;}
.ab_line {position:absolute; width:15px; height:1px; left:0px; top:0px; background:rgba(255,255,255,.2);}

.ab_vis_posbox {position:relative;}
.ab_vis_2 {position:absolute; width:1080px; height:600px; top:-480px; left:1000px; background:url('../img/sub/s_vis_ab_2.jpg') no-repeat 0px 0px; opacity:.1; transition:all 3s ease 0s; background-size:90% 90%;}
.ab_vis_act_1 {opacity:1; left:900px; background-size:100% 100%;}
.ab_vis_3 {position:absolute; width:600px; height:600px; top:0px; left:550px; background:url('../img/sub/s_vis_ab_4.jpg') no-repeat 0px 0px; opacity:.1; transition:all 2s ease 0s; border-radius:300px; background-size:600px 600px;}
.ab_vis_act_2 {opacity:1; left:500px; border-radius:0px;}

/* ÅÂºí¸´ CSS */
@media all and (max-width:1600px){
	.ab_vis_1 {position:absolute; width:1285px; height:450px; left:150px; top:160px;}
	.ab_vis_txt_1 {width:100%; top:220px; left:110px; font-size:30px; letter-spacing:-0.5px; text-align:left; line-height:130%;}
	@keyframes ab_2 {
	  0% {
		opacity:0;
		left:110px; 
	  }
	  100% {
		opacity:1;
		left:70px;  
	  }
	}
	
	.ab_vis_txt_2 {width:70%; top:315px; left:150px; font-size:15px; letter-spacing:-0.1px; line-height:140%; color:rgba(255,255,255,.85);}
	@keyframes ab_3 {
	  0% {
		opacity:0;
		left:150px; 
	  }
	  100% {
		opacity:1;
		left:110px;  
	  }
	}
	
	.ab_txt_1 {font-size:30px; line-height:120%; letter-spacing:0.2px; padding-bottom:20px; font-weight:300;}
	.ab_txt_2 {width:80%; font-size:15px; font-weight:300; padding-bottom:150px; letter-spacing:normal; color:rgba(255,255,255,.75);}
	.ab_txt_3 {width:80%; font-size:15px; font-weight:300; line-height:160%; letter-spacing:normal; color:rgba(255,255,255,.75);}
	.ab_vis_2 {position:relative; width:450px; height:250px; top:-80px; left:130px; opacity:.1; background-size:90% 90%;}
	.ab_vis_act_1 {opacity:1; left:80px; background-size:100% 100%;}
	
	.ab_txt_4 {font-size:16px; padding-bottom:7px; padding-top:17px;}
	.ab_txt_5 {width:80%; font-size:15px; font-weight:300; color:rgba(255,255,255,.75); text-align:left; padding-bottom:32px;}
	.ab_vis_3 {width:350px; height:350px; top:46px; left:400px; border-radius:175px; background-size:350px 350px;}
	.ab_vis_act_2 {left:350px; border-radius:5px;}
}


/* ¸ð¹ÙÀÏ CSS */
@media all and (max-width:480px){
	.ab_vis_1 {position:absolute; width:1285px; height:450px; left:100px; top:160px;}
	.ab_vis_txt_1 {width:100%; top:220px; left:60px; font-size:22px; letter-spacing:-0.5px; text-align:left; line-height:130%;}
	@keyframes ab_2 {
	  0% {
		opacity:0;
		left:60px; 
	  }
	  100% {
		opacity:1;
		left:20px;  
	  }
	}
	
	.ab_vis_txt_2 {width:70%; top:295px; left:90px; font-size:14px; letter-spacing:-0.1px; line-height:140%; color:rgba(255,255,255,.85);}
	@keyframes ab_3 {
	  0% {
		opacity:0;
		left:90px; 
	  }
	  100% {
		opacity:1;
		left:50px;  
	  }
	}
	
	.ab_txt_1 {font-size:24px; line-height:120%; letter-spacing:0.2px; padding-bottom:15px; font-weight:300;}
	.ab_txt_2 {width:80%; font-size:14px; font-weight:300; padding-bottom:120px; letter-spacing:normal; color:rgba(255,255,255,.75);}
	.ab_txt_3 {width:90%; font-size:14px; font-weight:300; line-height:160%; letter-spacing:normal; color:rgba(255,255,255,.75);}
	.ab_vis_2 {position:relative; width:450px; height:250px;  top:-60px; left:130px; opacity:.1; background-size:90% 90%;}
	.ab_vis_act_1 {opacity:1; left:80px; background-size:100% 100%;}
	
	.ab_txt_4 {font-size:15px; padding-bottom:6px; padding-top:15px;}
	.ab_txt_5 {width:85%; font-size:14px; font-weight:300; color:rgba(255,255,255,.75); text-align:left; padding-bottom:30px;}
	.ab_vis_3 {position:relative; width:250px; height:250px; top:0px; left:120px; border-radius:125px; background-size:250px 250px;}
	.ab_vis_act_2 {left:70px; border-radius:5px;}
}