@charset "utf-8";

/*
index.html 문서 전체 스타일 담당
#header, #container #footer, 웹폰트, 공통스타일
= style.css

#sub_container 담당
= sub_style.css

CSS의 기본은
	- 블럭
	: width, height, border, margin(padding), float
	- 인라인
	: font-family, font-size, color, line-height, text-align

	- 배경 이미지 처리
	: background:url(	) repeat position/size
*/

/*
	1. 전체 서브 공통스타일
	- #sub_container, aside, lnb, .sub_content
*/
#sub_container{
	width:1200px;
	margin:80px auto 0 auto;}

#sub_container aside{
	width:180px;
	margin-right:20px;
	float:left;}

#sub_container aside h2{
	height:180px;
	color:#fff;
	background:#0c4da2;
	font-size:30px;
	text-align:center;
	line-height:180px;}

.lnb a{
	display:block;
	height:40px;
	border-bottom:1px solid #d9d9d9;
	line-height:40px;
	text-indent:20px;
	color:#333;}

.lnb a:hover{
	background:#0c4da2;
	color:#fff;}

.sub_content{
	width:1000px;
	float:left;
	margin-bottom:80px;}

.sub_content h3{
	font-size:40px;
	margin:68px 0 80px 0;}

/*각 서브페이지의 키워드는 20px 공통 크기 적용*/
.sub_content strong{font-size:20px;}

/*각 서브페이지의 공통 행간 설정 (명시도 11점)*/
.sub_content p{line-height:25px;}


/*sub1 개별 스타일*/
.business li{
	width:490px;
	height:145px;
	float:left;
	margin-bottom:20px;}
.business li:nth-child(odd){margin-right:20px;}
/*background:url(	)	repeat	position/size; */
.business li:nth-child(1){
	background:url(../images/business_cont_01.jpg);}
.business li:nth-child(2){
	background:url(../images/business_cont_02.jpg);}
.business li:nth-child(3){
	background:url(../images/business_cont_03.jpg);}
.business li:nth-child(4){
	background:url(../images/business_cont_04.jpg);}
.business li:nth-child(5){
	background:url(../images/business_cont_05.jpg);}
.business li:nth-child(6){
	background:url(../images/business_cont_06.jpg);}

.business p:first-child{margin:20px 0 10px 20px;}
.business p:last-child{margin-left:20px;}

.ceo_message>p:first-child{
	padding-bottom:40px;
	margin-bottom:40px;
	border-bottom:1px solid #d9d9d9;}

.ceo_message>p:nth-of-type(2){
	width:355px;
	height:350px;
	margin-right:40px;
	float:left;
	font-size:25px;
	line-height:35px;
	background:url(../images/bg_ceo_logo.jpg) no-repeat center bottom;}

.ceo_message span{
	font-weight:bold;
	color:#0c4da2;}

.ceo_message div{
	float:right;
	width:605px;}
 /*1000-395=605*/

.ceo_message div p{
	margin-bottom:20px;}

.ceo_message mark{
	background:none;
	font-weight:bold;
	font-size:18px;}

.history>li{margin-bottom:40px;}
.history p strong{
	display:block;
	margin-bottom:40px;
	font-size:40px;}
.history ol{margin-left:40px;}

/* ★★★
	float 속성을 적용한 자식태그들 둔 부모 태그는
	자식들이 포기한 문단의 높이를 인지하지 못하고
	별도의 높이값을 지정해주지 않았을 시 높이값이 제거가 됩니다.
	
	이때!!!!!!!!★★★★★★★★★★★★
	float 속성을 적용한 자식 태그를 둔 부모태그에게
	overflow:hidden 속성을 적용할 경우
	선택자로 지정된 부모 태그에게, 자식태그의 높이 값을 확인시켜줄 수 있게 됩니다.
*/
.history ol li{
	clear:both;
	/*★★★★★★★★★★★★★★*/
	overflow:hidden;
	/*★★★★★★★★★★★★★★*/
	margin-bottom:20px;}
.history ol p{float:left;}
.history ol p:first-child{margin-right:40px;}
.history ol p:nth-child(2)~p{
	clear:both;
	margin-left:60px;}

/*sub2 개별 스타일*/
.product p{margin-bottom:20px;}
.product p:last-child{
	border-top:1px solid #d9d9d9;
	border-bottom:1px solid #d9d9d9;
	padding:20px 0;}

/*sub3 개별 스타일*/
.rnd p{margin-bottom:20px;}
.rnd div:nth-of-type(1){margin-bottom:40px;}
.rnd div:nth-of-type(1) p:last-child{
	position:absolute;
	margin:-190px 0 0 695px;}

.rnd div:nth-of-type(2)>ul>li{
	width:320px;
	float:left;}
.rnd div:nth-of-type(2)>ul>li:nth-child(2){margin:0 20px;}
.rnd li p:nth-of-type(1){
	position:absolute;
	margin-top:220px;}
.rnd li p:nth-of-type(2){margin-bottom:60px;}
.rnd div:nth-of-type(2) img{width:320px;}
.rnd li li{
	line-height:30px;
	margin-left:20px;
	list-style-image:url(../images/rnd_list_icon.gif);}

/*sub4 개별 스타일*/
.media *{
	border:0;
	width:1000px;
	height:570px;}

/*sub5 개별 스타일*/

/*sub6 개별 스타일*/
.find iframe{
	border:0;
	width:1000px;
	height:500px;
	margin-bottom:20px;}
.find address{font-style:normal;}
.find>div{padding:20px;}
.find_info1{background:#f9f9f9;}
.find_info2{
	overflow:hidden;
	background:#eff6fc;}
.find_info2 div{
	float:left;
	margin-right:40px;}

/*
login, join 개별 스타일

★인라인 요소 중 면적 설정 및 마진 상하좌우적용 가능 태그
:img, form태그 내에 input/select/option/textarea

★form태그와 관련된 요소는 기본 마진, 패딩, 발생 대상 태그로써 초기 CSS 공통 스타일 항목에 추가 및 margin:0; padding:0;을 제거해 줍니다.

★form태그와 관련된 요소는 기본 외곽선을 포함하고 있으며, box-sizing:border-box;를 적용하고 사용하는 것을 권장합니다.
*/
.login table{width:700px; margin:0 auto;}
.login input{
	width:700px;
	height:50px;
	margin:10px 0;
	box-sizing:border-box;
	border-radius:10px;
	border:1px solid #999;}

.login tr:not(:last-child) input{
	text-indent:20px;}
.login tr:last-child input{
	background:#0c4da2;
	color:#fff;}

.join table{width:700px; margin:0 auto;}
.join td{
	padding:10px 0;
	border-bottom:1px solid #d9d9d9;}
.join tr:not(:last-child) p:first-child{
	color:#0c4da2;
	margin:10px 0;}

/* 1,2,3,4,(5:생년월일),6,7,(8:휴대전화),(9:문자수신),(10:기타)*/
.join tr p>*{
	width:700px;
	height:40px;
	border:1px solid #999;
	box-sizing:border-box;}

/*5.생년월일*/
.join tr:nth-child(5) p>*{width:230px;}

/*8.휴대전화*/
.join tr:nth-child(8) p:nth-child(3){margin:10px 0;}
.join tr:nth-child(8) p:nth-child(3) input{margin:10px 0; width:550px;}
.join tr:nth-child(8) p:nth-child(3) a{
	display:inline-block;
	width:145px; height:42px;
	background:#0c4da2; color:#fff;
	text-align:center; line-height:42px;
	text-indent:0;
	border:0;}

/*9.문자수신*/
.join tr:nth-child(9) input{
	margin:5px 15px 0 0;
	width:16px; height:16px;}

/*10.기타*/
.join tr:nth-child(10) textarea{height:150px;}

/*11.회원가입*/
.join tr:nth-child(11) input{
	background:#0c4da2; color:#fff;
}
