/* Visual */
.visual {
	position: relative;	
	margin: 10px 0;
	height: 135px;
}
.visual .text {
	position: absolute;
	overflow: hidden;
	left: 50%;
	top: 0;	
	width: 350px;
	margin-left: -150px;
	line-height: 1.4;
	letter-spacing: -0.02em;
}
.visual .text h3 {
	position: absolute;	
	overflow: hidden;
	width: 100%;
	margin: 0;
	font-family: 'Noto Sans KR';
	font-weight: 700;
	font-size: 22px;
	color: #888;
	animation: one .4s 1 normal;
	-moz-animation: one .4s 1 normal; /* Firefox */
	-webkit-animation: one .4s 1 normal; /* Safari and Chrome */
	-o-animation: one .4s 1 normal; /* Opera */
}
@keyframes one {
    0% { top: 30%; opacity:0;} 
	100% { top: 0%; opacity:1;}
}
@-moz-keyframes one { /* Firefox */
    0% { top: 30%; opacity:0;} 
	100% { top: 0%; opacity:1;}
}
@-webkit-keyframes one { /* Safari and Chrome */
    0% { top: 30%; opacity:0;} 
	100% { top: 0%; opacity:1;}
}
@-o-keyframes one { /* Opera */
    0% { top: 30%; opacity:0;} 
	100% { top: 0%; opacity:1;}
}

.visual .text h4 {
	position: relative;
	overflow: hidden;
	margin-top: 30px;
	font-family: 'Noto Sans KR';
	font-weight: 900;
	font-size: 24px;
	color: #555;
	text-shadow: 0 0 5px #fff;	
	animation: two 3s 1 normal;
    -moz-animation: two 3s 1 normal; /* Firefox */
    -webkit-animation: two 3s 1 normal; /* Safari and Chrome */
    -o-animation: two 3s 1 normal; /* Opera */
	animation-iteration-count: infinite;
}
@keyframes two {
    0% { opacity:0;} 
	80% { opacity:.9;} 
	90%{ opacity:.8;}
	100% { opacity:1;}
}
@-moz-keyframes two { /* Firefox */
    0%,	80% { opacity:0;} 
	100%, 150% { opacity:1;}
}
@-webkit-keyframes two { /* Safari and Chrome */
    0%,	80% { opacity:0;} 
	100%, 150% { opacity:1;}
}
@-o-keyframes two { /* Opera */
    0%,	80% { opacity:0;} 
	100%, 150% { opacity:1;}
}


.visual .text .img01 {	
	position: absolute;	
	z-index: 1;
	top: -10px;
	left: 0;
	height: 26px;
	text-align: left;
	animation: img01 5s 1 normal;
    -moz-animation: img01 5s 1 normal; /* Firefox */
    -webkit-animation: img01 5s 1 normal; /* Safari and Chrome */
    -o-animation: img01 5s 1 normal; /* Opera */
	animation-iteration-count: infinite;
}
@keyframes img01 {
    0% { left:0; opacity:0;} 
	60% { left:100%; opacity:1;}
	100% { opacity:0;}
}
@-moz-keyframes img01 { /* Firefox */
    0% { left:0; opacity:.8;} 
	80% { left:100%; opacity:1;}
	90% { opacity:.5;}
	100% { opacity:1;}
}
@-webkit-keyframes img01 { /* Safari and Chrome */
    0% { left:0; opacity:.8;} 
	80% { left:100%; opacity:1;}
	90% { opacity:.5;}
	100% { opacity:1;}
}
@-o-keyframes img01 { /* Opera */
    0% { left:0; opacity:.8;} 
	80% { left:100%; opacity:1;}
	90% { opacity:.5;}
	100% { opacity:1;}
}