@charset "utf-8"; 

/* sub-sec 공통 */
.sub-sec{padding:120px 0 140px}
.sub-sec2{padding:0 0 80px}
.sub-txt{font-size:20px; line-height:1.6;}
.sub-txt p{margin-bottom:24px}
.txt-align1{text-align:center;}
.color-w{color:#fff;}
.color-g{color:#299f3d; border-bottom:1px solid #299f3d; font-weight:bold; font-style:italic}
table img{width:100%}

/* 서브 큰 타이틀 */
.sub-title h2{font-size:52px; letter-spacing:0.03em; font-weight:400; line-height:1.2; 
font-family:'Josefin Sans', 'Noto Sans KR', 'Nanum Gothic', sans-serif; text-transform:uppercase; 
text-align:center;}
.sub-title-type2{margin-bottom:52px;}
.sub-m-title h3{font-size:36px; font-weight:400; letter-spacing:-0.02em;  line-height:1.2;}


/* sub01 */
.sub-top-bg{width:100%; height:280px; background:url('../img/sub-header01.png') no-repeat center center;
background-size:cover; position:relative;}
.bg2{background:url('../img/sub-header02.png') no-repeat center center;}
.sub-title-position{width:100%; position:absolute; top:50%; left:0; transform:translateY(-50%)}
.en_greeting{word-break:keep-all;}

/* sub01 - history */ 
.history{background-color:#fafafa; background-image:url('../img/history_bg_color.png');
background-repeat:no-repeat; background-position:100% 100%;
background-size:960px auto; background-attachment:fixed;} 
.history-ul{margin-left:120px; border-left:5px solid #333;} 
.history-ul li{padding-bottom:12px; margin-left:48px; position:relative;} 
.history-ul li:last-child{padding-bottom:0}
.history-year{font-size:24px; font-weight:500; padding-right:32px; 
letter-spacing:-0.03em} 
.history-con{font-size:20px; color:#777}

/* sub03 - sub table 공통 */
.sub-table-in{padding-top:84px;}
.table_title h4{font-size:32px; font-weight:300; padding-bottom:32px; letter-spacing:-0.05em;position:relative;}
.table_title h4:after{content:"";position:absolute; top:-3px; left:0; width:25px; height:2px; background:#565656;
margin-left:0.08em;}
.sub-sec table{text-align:center; table-layout:fixed;	width:100%;line-height:1.6; border-collapse: collapse;}
.sub-sec table tr:nth-child(1){	background:#535353; color:#fff;}
.sub-sec table td:hover{background:#eee;
    -webkit-transition: all .4s;
    -moz-transition: all .4s
    -o-transition: all .4s;
	transition:all .4s;
}
.sub-sec table th{padding:10px 6px;font-size:20px; font-weight:400; text-align:center;}
.sub-sec table td{padding:10px 6px;font-size:18px; border-bottom:1px solid #ddd;border-right:1px solid #ddd;}
.sub-sec table td:last-child{border-right:0;}
.sub-sec table .t-col-1{width:160px;}
.sub-sec table .t-col-2{width:240px;}

/* sub03 개발 장비 보유현황 */
#equipment table{border-left:1px solid #ddd; border-right:1px solid #ddd;}
#equipment table tr:nth-child(1) {background:transparent; border-top:1px solid #ddd;}

/* sub04 - contact */
.contact-txt{padding:24px 0}
.contact-txt .table_title h4{padding-bottom:16px; margin-left:-0.08em}
.contact-title{font-weight:bold; padding-right:8px;}
.ct-last{padding-left:16px;}
.contact-txt p{line-height:1.75} 
.contact-txt p:nth-child(1){padding-top:4px;}

.contact-wrap:after{content:""; display:block; clear:both;}
.txt-left,
.txt-right{width:50%; float:left;}
.en-ls{letter-spacing:0.04em;}

/* 문의사항 */
::placeholder {
    color: #bbb;
    opacity: 1; /* Firefox */
}
:-moz-placeholder { /* 파이어폭스 4–18 */
   color: #bbb;
   opacity:  1;
}
::-moz-placeholder { /* 파이어폭스 19–50 */
   color: #bbb;
   opacity:  1;
}
:-ms-input-placeholder { /* 인터넷 익스플로러 10+ */
   color:  #bbb;
}
::placeholder { /* 파이어폭스 51+, 크롬 57+ */
   color: #bbb;
   opacity:  1;
}

.row{margin-bottom:1%;}
.row:after {content: ""; display:table; clear:both;}
.col-50 {float: left; width:49%;}
.col-50:nth-child(odd){margin-right:1% ;}
.col-50:nth-child(even){margin-left:1% ;}

.cs-form input[type="text"],
.cs-form input[type="email"],
.cs-form input[type="submit"],
.cs-form select, 
.cs-form textarea {
	width: 100%;
	font-family:'Noto Sans KR', sans-serif;
    border: 1px solid #ddd;
    resize: vertical;
	font-size:1rem;
	padding:.5rem;
	margin-top:.25rem
}
.cs-form input[type="submit"]{
    border: none;
	padding:0;
}
.cs-form input, 
.cs-form textarea{
    padding: 0px;	
}
.submit-btn input[type="submit"]{
	background:#ddd;
	color:#323232;
	border:none;
	margin-top:.5rem;
	padding:.75rem 0;
}
.submit-btn input:hover{
	background:#323232;
	color:#fff;
	transition:ease-out .5s
}
.cs-checkbox-more{font-weight:500; margin-left:12px;}


/* 게시판 공통 */
#bo_v_title .bo_v_tit{display:block; font-size:24px; padding-top:12px;}
.filmography-item__info{cursor:pointer;}


/* 1200px 이하 */
@media screen and (max-width:1200px) {
	#sub_page, 
	#sub_page a { font-size:16px; }

	h2#container_title { font-size:36px; }
	h2#container_title span { }
}	


/* 1024px 이하 */
@media screen and (max-width:1024px) {
	.history{ background-position:500% 100%;} 
}


/* 768px 이하 */
@media screen and (max-width:768px) {
	.sub-top-bg{height:240px;}
	.sub-sec{padding:80px 0 100px}
	.sub-title h2{font-size:40px;}
	.sub-txt{font-size:18px; padding:0 24px}
	.custom-block{display:inline;}

	.history{ background-position:-100% 100%;} 
	.history-ul{margin-left:80px;}
	.history-year{font-size:20px;}
	.history-con{font-size:18px;}
	
	.sub-m-title h3{font-size:32px;}
	.table_title h4{font-size:24px;}
	.sub-sec table td{padding:6px; font-size:16px;}
	.sub-sec table .t-col-1{width:120px;}

	.txt-left, .txt-right{width:100%; float:none;}
	.contact-txt:last-child{padding:24px 0 0 0 }
	.cs-checkbox-more{margin-left:0}
	.cs-checkbox{font-size:0.875em;}
	.sub-sec2{padding:0 0 64px;}
}


/* 660px 이하 */
@media screen and (max-width:660px) {
	
	.sub-sec table th{font-size:18px;}
	.history{ background-image:none;} 

	/* 게시판 하단 검색, 버튼 */
	#bo_sch,
	.bo_fx { float:none; clear:both; }
	.bo_fx { margin-bottom:10px; padding:8px 0; }
	#bo_sch {width:100%;}
	.btn_bo_user { float:none; margin:0 auto; text-align:center; }
	.btn_bo_user li { float:none; display:inline-block; zoom:1; *display:inline; }

}


/* 520px 이하 */
@media screen and (max-width:520px) {
	.sub-top-bg{height:180px;}
	.sub-title h2{font-size:28px;}
	.sub-sec{padding:48px 0 64px}
	.sub-txt{font-size:16px; padding:0}
	.aboutus-sign{width:130px; margin:0 auto}
	.aboutus-sign img{width:100%; height:auto;}

	.history{background-size:160px auto; background-position:90% 90%}
	.history-ul{margin-left:0}
	.history-ul li{margin-left:16px;}
	.history-year{font-size:14px; padding-right:16px;}
	.history-con{font-size:16px;}

	.sub-sec table{width:550px}
	.table_wrap{overflow-x:auto; border:1px solid #454545}
	.sub-table-in{padding-top:56px;}
	.sub-table-in:after{content:"※테이블을 좌우로 스크롤 하세요"; display:block; 
	color:#bbb; font-size:12px; padding-top:4px;}
	.sub-m-title h3{font-size:28px}
	.table_title h4{font-size:20px}
	.sub-sec table th{font-size:15px; padding:6px;}
	.sub-sec table td{font-size:14px;}
	.sub-sec table .t-col-1{width:80px;}
	.sub-sec table td:hover{background:none;}

	.contact-txt p{font-size:14px;}

	/* 게시판 */
	.tbl_head01 thead th { padding:12px 0; }
	.tbl_head01 td { padding:12px 5px; }

	/* 게시판 이전,다음글 보기 */
	.bo_v_nb { margin:0; padding:0; }
	.bo_v_nb li { padding:10px 5px; }
	.bo_v_nb li .nb_date { display:none; }

	#bo_v_title .bo_v_cate,
	#bo_v_con,
	#bo_v_info{font-size:0.875em}
	#bo_v_title .bo_v_tit{padding:12px 0}
	#bo_v_info .if_date{float:left;}
	#bo_v_info{border-top:1px solid #ddd; padding:10px 0}
}


/* 414px 이하 */
@media screen and (max-width:414px) {
	.sub-txt,
	.history-con	{font-size:14px; }
	.history-year{font-size:12px;}

	.sub-m-title h3{font-size:26px}
	.table_title h4{font-size:20px; padding-bottom: 16px;}
	.sub-sec table th{font-size:14px; padding:6px;}
	.sub-sec table td{font-size:13px;}
	.sub-sec table .t-col-1{width:72px;}

	.contact-txt p{font-size:14px; letter-spacing:-0.03em}

	#bo_v a.btn_admin{display:none;}
}

/* 320px 이하 */
@media screen and (max-width:375px) {
	.aboutus-sign{width:110px;}
}
/* 320px 이하 */
@media screen and (max-width:320px) {
	.sub-txt,
	.history-con	{font-size:13px; }
	.history-year{display:block;}
	.txt-align1{text-align:left;}

	.contact-txt p{font-size:14px; letter-spacing:0}
	.contact-title{padding-right:4px;}
	.cs-form input[type="text"],
	.cs-form input[type="email"],
	.cs-form select, 
	.cs-form textarea {font-size:.75rem;	}

	.moreView{display:block}
}