@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');

/* reset */
body {
	font:normal 13px '맑은고딕', 'MalgunGothic','돋움', dotum, AppleGothic, Arial, Verdana,sans-serif; 
	font-family: 'Do Hyeon', sans-serif;
	line-height:1.5;
	color: #333;
	background-color: #fff;
	margin: 0;
	padding: 0;
	letter-spacing: -1px;
}
h1, h2, h3, h4, h5, h6 {font-size:1em; font-weight: normal; }
h1, h2, h3, h4, h5, h6, div, p, dl, dt, dd, ul, ol, li, form, fieldset, blockquote, address, table, thead, tbody, tfoot, tr, td, caption {
	margin:0;
	padding:0;
}
li {list-style:none;}
table {width:100%; border-collapse:collapse;}
a:link, a:visited {color:#333; text-decoration:none;}
a:link, a:visited {color:transparent\9;}/* IE6,7,9,10 */
img {vertical-align: top;}
em, i, address, b, p { font-style: normal; font-weight: normal; }

.company { 
	width: 800px; 
	margin: 0 auto; 
	font-size: 16px; 
	font-family: 'Noto Sans KR', sans-serif;
}

/*모바일 반응형*/
@media (min-width: 481px) and (max-width: 767px) {
	.company { 
		width: 400px; 
		margin: 0 auto; 
		padding-left: 20px;
		word-break: keep-all; 
 	}
 }

.company h1 {
	font-size: 30px;
	margin-top: 150px;
	padding-bottom: 5px;
	border-bottom: 1px solid #d9d9d9;
	font-weight: 700;
	/*transition:all 0.5s ease;*/
	animation-name: textMontion1;
  	animation-duration: 5s;
}
@keyframes textMontion1 {
  from {color: #fff;}
  to {color: #333;}
}
/*모바일 반응형*/
@media (min-width: 481px) and (max-width: 767px) {
	.company h1 { margin-top: 50px; }
 }


.company h2 { 
	font-size: 25px;
	letter-spacing: -2px;
	font-weight: 700;
 }
.company  .coml {  
	margin-top: 40px; 
	animation-name: textMontion2;
  	animation-duration: 8s;
 }
 @keyframes textMontion2 {
  from {color: #fff;}
  to {color: #333;}
}

.company .coml > h2 { 
	margin-bottom: 15px;
 }
.company .coml > p {
 	line-height: 1.8;
 }
.company .coml > img {
  	margin: 65px 0;
	animation-name: textMontion-img;
  	animation-duration: 3s;
 }
 @keyframes textMontion-img {
  from { opacity: 0; }
  to { opacity: 1; }
}
/*모바일 반응형*/
@media (min-width: 481px) and (max-width: 767px) {
	.company .coml > img { width: 400px; margin: 30px 0;}
 }



.company > .history {
	margin-bottom: 100px;
	animation-name: textMontion3;
  	animation-duration: 10s;
 }
 @keyframes textMontion3 {
  from {color: #fff;}
  to {color: #333;}
}

.company > .history > h2 {
	font-size: 100px;
	font-weight: 900;
	float: left;
	padding-right:15px; 
}
/*모바일 반응형*/
@media (min-width: 481px) and (max-width: 767px) {
	.company > .history > h2 { font-size: 60px; float: none; margin-bottom: 30px; }
 }

.company > .history > ol {
	float: right;
	padding-left: 10px;
	border-left: 10px solid #ffe700;
	animation-name: textMontion4;
  	animation-duration: 10s;
 }
 @keyframes textMontion4 {
  from {border-left: 10px solid #fff;}
  to { border-left: 10px solid #ffe700;}
}
/*모바일 반응형*/
@media (min-width: 481px) and (max-width: 767px) {
	.company > .history > ol { float: none; }
 }

.company > .history ol li + li {
	margin-top: 10px;
}
.company > .history:after { 
	content: ''; 
	display: block; 
	clear: both;
}