@import url("/new/css/reset.css");

figcaption { display:none }
.txt_blueb { font-weight:bold; color:#4196d1 }


@media (min-width:1200px) {

header { background-image:url(/new/img/common/left_bg.gif), url(/new/img/common/left_bg_repeat.gif); background-repeat:no-repeat, repeat-y; width:150px; position:absolute; height:100%; min-height:950px }
	header h1 a { background:url(/new/img/common/logo.png) no-repeat center; text-indent:-9999px; width:123px; height:50px; display:block; margin:12px 0 0 13px }
	
	.gnb h2 { display:none }
	.gnb ul { margin:15px 0 0 17px }
	.gnb li a { text-indent:-9000px; width:83px; height:31px; background-position:10px 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	.gnb li a.menu1 { background-image:url(/new/img/common/gnb01.png) }
	.gnb li a.menu1_o { background-image:url(/new/img/common/gnb01_o.png) }
	.gnb li a.menu2 { background-image:url(/new/img/common/gnb02.png) }
	.gnb li a.menu2_o { background-image:url(/new/img/common/gnb02_o.png) }
	.gnb li a.menu3 { background-image:url(/new/img/common/gnb03.png) }
	.gnb li a.menu3_o { background-image:url(/new/img/common/gnb03_o.png) }
	.gnb li a.menu4 { background-image:url(/new/img/common/gnb04.png) }
	.gnb li a.menu4_o { background-image:url(/new/img/common/gnb04_o.png) }
	
	.etc h2 { display:none }
	.etc { margin:50px 0 0 0; overflow:hidden }
	.etc li { float:left }
	.etc li a.etc_login { background:url(/new/img/common/login.png) no-repeat 5px 2px; width:35px; margin:0 10px 0 16px }
	.etc li a.etc_old { background:url(/new/img/common/old.png) no-repeat 5px 2px; width:70px }
	.etc li a { text-indent:-9000px; overflow:hidden; display:block; height:21px }
	
	#blackTransparent { clear:both; display:none; position:absolute; left:0; top:0; width:100%; height:100%; background:url(/new/img/sub04/transparent_black.png); z-index:10000 }
	
	.login_box { position:absolute; width:550px; display:none; height:300px; background:#ffffff; top:50%; left:50%; margin:-180px 0 0 -275px; padding:37px 42px 20px 42px; z-index:10000 }
	.login_box h2 { background:url(/new/img/common/login_top.gif) no-repeat; height:93px; width:340px }
	.login_box h3 { font-size:0; margin:0; height:0 }
	.login_box dl { border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; padding:18px 15px; overflow:hidden }
	.login_box dt, .login_box dd { float:left; height:40px }
	.login_box dt.txt_id { background:url(/new/img/common/login_txt_id.gif) no-repeat 10px 10px; width:54px; }
	.login_box dt.txt_pwd { background:url(/new/img/common/login_txt_pwd.gif) no-repeat 20px 10px; width:74px; }
	.login_box dd.input_id input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:160px }
	.login_box dd.input_pwd input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:180px }
	.login_box ul { clear:both }
	.login_box li.btn_login { padding:20px 0 0 0; text-align:center }
	.login_box li.btn_idsearch a { float:left; background:url(/new/img/common/btn_idsearch.gif) no-repeat; width:242px; height:21px; margin:20px 30px 0 25px }
	.login_box li.btn_join a { float:left; background:url(/new/img/common/btn_join.gif) no-repeat; width:212px; height:21px; margin:20px 0 0 0 }
	
	.banner h2 { display:none; }
	.banner ul { margin:30px 0 0 19px; clear:both }
	.banner li a { text-indent:-9000px; background-repeat:no-repeat; overflow:hidden; display:block }
	.banner li a.skin { background-image:url(/new/img/common/ban_skin.png); width:115px; height:153px; margin-bottom:25px }
	.banner li a.estimate { background-image:url(/new/img/common/ban_estimate.png); width:115px; height:61px; margin-bottom:25px }
	.banner li a.recruit { background-image:url(/new/img/common/ban_recruit.png); width:115px; height:61px }
		
	
#sub_left01, #sub_left02, #sub_left03, #sub_left04 { width:200px; position:absolute; left:-200px; height:100%; min-height:950px }

#sub_left01 { background:#ffb000 }
#sub_left02 { background:#0894f6 }
#sub_left03 { background:#63c53b }
#sub_left04 { background:#e4211c }

	#sub_left01 nav h2 { text-indent:-9000px; background:url(/new/img/sub01/left_tit.png) no-repeat; height:20px; margin:35px 0 20px 22px }
	#sub_left01 .sub_img { position:relative; top:-130px; padding-top:130px; }
	#sub_left01 .gnb_sub { margin:0 0 0 22px }
	#sub_left01 .gnb_sub li a { text-indent:-9000px; width:155px; height:31px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left01 .gnb_sub li a.menu1 { background-image:url(/new/img/sub01/menu01.png); }
	#sub_left01 .gnb_sub li a.menu2 { background-image:url(/new/img/sub01/menu02.png); }
	#sub_left01 .gnb_sub li a.menu3 { background-image:url(/new/img/sub01/menu04.png); }
	#sub_left01 .gnb_sub li a.menu4 { background-image:url(/new/img/sub01/menu05.png); }
	
	#sub_left02 nav h2 { text-indent:-9000px; background:url(/new/img/sub02/left_tit.png) no-repeat; height:20px; margin:35px 0 20px 22px }
	#sub_left02 .sub_img { position:relative; top:-155px; padding-top:130px }
	#sub_left02 .gnb_sub { margin:0 0 0 22px }
	#sub_left02 .gnb_sub li a { text-indent:-9000px; width:155px; height:31px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left02 .gnb_sub li a.menu1 { background-image:url(/new/img/sub02/menu01.png); }
	#sub_left02 .gnb_sub li a.menu2 { background-image:url(/new/img/sub02/menu06.png); }
	#sub_left02 .gnb_sub li a.menu3 { background-image:url(/new/img/sub02/menu02.png); }
	#sub_left02 .gnb_sub li a.menu4 { background-image:url(/new/img/sub02/menu03.png); }
	#sub_left02 .gnb_sub li a.menu5 { background-image:url(/new/img/sub02/menu04.png); }
	#sub_left02 .gnb_sub li a.menu6 { background-image:url(/new/img/sub02/menu05.png); }
	
	#sub_left03 nav h2 { text-indent:-9000px; background:url(/new/img/sub03/left_tit.png) no-repeat; height:20px; margin:35px 0 20px 22px }
	#sub_left03 .sub_img { position:relative; top:-125px; padding-top:160px }
	#sub_left03 .gnb_sub { margin:0 0 0 22px }
	#sub_left03 .gnb_sub li a { text-indent:-9000px; width:155px; height:31px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left03 .gnb_sub li a.menu1 { background-image:url(/new/img/sub03/menu01.png); }
	#sub_left03 .gnb_sub li a.menu2 { background-image:url(/new/img/sub03/menu02.png); }
	#sub_left03 .gnb_sub li a.menu3 { background-image:url(/new/img/sub03/menu03.png); }
	#sub_left03 .gnb_sub li a.menu4 { background-image:url(/new/img/sub03/menu04.png); }
	#sub_left03 .gnb_sub li a.menu5 { background-image:url(/new/img/sub03/menu05.png); }
	
	#sub_left04 nav h2 { text-indent:-9000px; background:url(/new/img/sub04/left_tit.png) no-repeat; height:20px; margin:35px 0 20px 22px }
	#sub_left04 .sub_img { position:relative; padding-top:240px }
	#sub_left04 .gnb_sub { margin:0 0 0 22px }
	#sub_left04 .gnb_sub li a { text-indent:-9000px; width:155px; height:31px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left04 .gnb_sub li a.menu1 { background-image:url(/new/img/sub04/menu01.png); }
	#sub_left04 .gnb_sub li a.menu2 { background-image:url(/new/img/sub04/menu02.png); }
	#sub_left04 .gnb_sub li a.menu3 { background-image:url(/new/img/sub04/menu03.png); }
	#sub_left04 .gnb_sub li a.menu4 { background-image:url(/new/img/sub04/menu04.png); }
	#sub_left04 .gnb_sub li a.menu5 { background-image:url(/new/img/sub04/menu05.png); }


#contents { position:absolute; left:350px; right:0; padding:0 70px; height:100%; min-height:950px; }
	
	.slides_container { width:100%; display:none; }		
	.slides_container div { width:800px; max-width:100%; min-height:820px; height:820px; display:block; }
	.title { margin:50px 60px 0 0; }
	.real_contents { margin:50px 0; background-repeat:no-repeat; background-size:100%; width:800px  }
	
	.contact li { float:left }
	.contact li.addr { margin:0 0 20px 0 }
	.contact li.tel { float:right; margin:10px 15px 0 0 }
	.contact li.mail { float:right; margin:15px 10px 0 0 }
	.contact li.print { float:right; margin:12px 0 0 0 }
	.contact li.map { clear:both; width:100% }
	
	.recruit_btn { position:absolute; width:215px; height:64px;   text-indent:-9000px; left:62%; padding-top:63% }
	.recruit_btn a { display:block; width:215px; height:64px; background:url(/new/img/sub01/sub04_btn.png) no-repeat; background-size:215px; }
	
	.estimate_btn { position:absolute; width:195px; height:59px;   text-indent:-9000px; left:68%; padding-top:47% }
	.estimate_btn a { display:block; width:195px; height:59px; background:url(/new/img/sub02/btn_estimate.png) no-repeat; background-size:195px; }
	
	.list_gallery01 {}
	.list_gallery01 li { float:left; margin-right:10px; width:188px }
	.list_gallery01 li.last { margin-right:0 }
	.list_gallery01 li p { text-align:center; font:normal 11px/30px Dotum; color:#333 }
	.list_gallery01 li p img { border:3px solid #404040 }
	
	h1.estimate { margin:0; line-height:0; font:0 }
	.btn_area { text-align:center; padding-top:25px }
	
	.table_vertical01 { border-top:3px solid #000; border-collapse:collapse; width:100% }
	.table_vertical01 th { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; color:#333; background:url(/new/img/board/th01.gif) no-repeat right bottom; text-align:left }
	.table_vertical01 td { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; font-weight:normal }
	.table_vertical01 input[type:text] { background-color:transparent; border:1px solid #444; padding:0 3px }
	.table_vertical01 textarea { background-color:transparent; border:1px solid #444; padding:5px }
	.table_vertical01 input.btn { border:none; padding:0 }
	.table_vertical01 li { float:left; margin-right:10px }
	
	h1.portfolio { padding-bottom:30px }
	ul.portfolio { float:left; margin:0 19px 20px 0; width:254px }
	ul.first { clear:both }
	ul.last { margin-right:0 }
	ul.portfolio li { text-align:center }
	ul.portfolio li img { cursor:pointer; width:254px; height:195px; }
	ul.portfolio li.project { color:#333; font-weight:bold }
	ul.portfolio li.url { color:#555; font:11px Dotum; text-decoration:none }
	ul.portfolio li.url a { color:#555; text-decoration:none }
	ul.portfolio li.code { color:#4c91d5; font:bold 11px Dotum; }
	div.pagenum { text-align:center; padding:20px 0 0 0; clear:both; font:normal 11px Dotum; }
	
	
	.detail_back { background:#fff; width:1000px; height:700px; display:none; position:absolute; left:50%; top:50%; margin:-400px 0 0 -725px; z-index:10000; padding:50px }
		.detail_back .left { float:left; width:650px; }
		.detail_back .left img { border:1px solid #ddd; width:648px }
		.detail_back .right { float:right; width:300px; margin:0 0 0 50px }
			.detail_back .right dl { border-top:2px solid #333; padding:8px 0 }
			.detail_back .right dt { font:normal 10px/20px Arial; float:left; width:75px; padding:0 0 0 5px; text-transform:uppercase; }
			.detail_back .right dd { font:normal 11px/20px Dotum; }
			.detail_back .right .comment { font:normal 11px/14px Dotum; color:#999; padding:10px 0 5px 5px; border-bottom:1px solid #eee; border-top:1px solid #eee }
			.detail_back .right .thumbnail { padding:20px 0 0 0 }
			.detail_back .right .thumbnail ul { float:left; width:80px; margin-right:5px }
			.detail_back .right .thumbnail ul li { text-align:center; font:11px Dotum; padding:0 0 8px 0 }
			.detail_back .right .thumbnail ul li img { width:80px; height:62px }
			.detail_back .right .btn { clear:both; text-align:center; padding:20px 0 }
	
	.mobile { display:none }
	
	
aside { position:absolute; right:0; z-index:99; }
	.callcenter { text-indent:-9000px; background:url(/new/img/common/callcenter.png) no-repeat; width:177px; height:177px }
	

footer { position:relative; left:420px; top:860px }
	footer .copyright { font-size:11px; font-family:arial; font-weight:bold; color:#555; padding:0 0 12px }
	footer address { font-style:normal; font:normal 11px/15px dotum,'dotum'; color:#666 }
	footer span { display:inline-block; margin:0 10px 0 0 }

}	
	

@media (min-width:768px) and (max-width:1199px){ 

header { background-image:url(/new/img/common/left_bg.gif); background-repeat:repeat-x; width:100%; height:85px; }
	header h1 a { background:url(/new/img/common/logo.png) no-repeat 10px 15px; text-indent:-9999px; height:50px; display:block; margin:12px 0 0 13px; float:left; width:150px }
	
	.gnb h2 { display:none }
	.gnb ul { padding:35px 0 0 0 }
	.gnb li { float:left; }
	.gnb li a { text-indent:-9000px; width:110px; height:31px; background-position:10px 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	.gnb li a.menu1 { background-image:url(/new/img/common/gnb01.png) }
	.gnb li a.menu1_o { background-image:url(/new/img/common/gnb01_o.png) }
	.gnb li a.menu2 { background-image:url(/new/img/common/gnb02.png) }
	.gnb li a.menu2_o { background-image:url(/new/img/common/gnb02_o.png) }
	.gnb li a.menu3 { background-image:url(/new/img/common/gnb03.png) }
	.gnb li a.menu3_o { background-image:url(/new/img/common/gnb03_o.png) }
	.gnb li a.menu4 { background-image:url(/new/img/common/gnb04.png) }
	.gnb li a.menu4_o { background-image:url(/new/img/common/gnb04_o.png) }

	.etc h2 { display:none }
	.etc { display:none }
	.etc li { display:none }
	.etc li a.etc_login { display:none }
	.etc li a.etc_old { display:none }
	.etc li a { display:none }
	
	#blackTransparent { clear:both; display:none; position:absolute; left:0; top:0; width:100%; height:100%; background:url(/new/img/sub04/transparent_black.png); z-index:10000 }
	
	.login_box { position:absolute; width:550px; display:none; height:300px; background:#ffffff; top:50%; left:50%; margin:-180px 0 0 -275px; padding:37px 42px 20px 42px; z-index:10000 }
	.login_box h2 { background:url(/new/img/common/login_top.gif) no-repeat; height:93px; width:340px }
	.login_box h3 { font-size:0; margin:0; height:0 }
	.login_box dl { border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; padding:18px 15px; overflow:hidden }
	.login_box dt, .login_box dd { float:left; height:40px }
	.login_box dt.txt_id { background:url(/new/img/common/login_txt_id.gif) no-repeat 10px 10px; width:54px; }
	.login_box dt.txt_pwd { background:url(/new/img/common/login_txt_pwd.gif) no-repeat 20px 10px; width:74px; }
	.login_box dd.input_id input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:160px }
	.login_box dd.input_pwd input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:180px }
	.login_box ul { clear:both }
	.login_box li.btn_login { padding:20px 0 0 0; text-align:center }
	.login_box li.btn_idsearch a { float:left; background:url(/new/img/common/btn_idsearch.gif) no-repeat; width:242px; height:21px; margin:20px 30px 0 25px }
	.login_box li.btn_join a { float:left; background:url(/new/img/common/btn_join.gif) no-repeat; width:212px; height:21px; margin:20px 0 0 0 }
	
	.banner { position:absolute; left:30px; top:310px; padding-top:40px; z-index:99 }
	.banner h2 { display:none }
	.banner ul { margin:0 }
	.banner li a { text-indent:-9000px; background-repeat:no-repeat; overflow:hidden; display:block }
	.banner li a.skin { background-image:url(/new/img/common/ban_skin.png); width:115px; height:153px; margin-bottom:25px }
	.banner li a.estimate { background-image:url(/new/img/common/ban_estimate.png); width:115px; height:61px; margin-bottom:25px }
	.banner li a.recruit { background-image:url(/new/img/common/ban_recruit.png); width:115px; height:61px }
		
	
#sub_left01, #sub_left02, #sub_left03, #sub_left04 { width:180px; position:absolute; left:-180px; top:0; bottom:0; min-height:900px }

#sub_left01 { background:#ffb000 }
#sub_left02 { background:#0894f6 }
#sub_left03 { background:#63c53b }
#sub_left04 { background:#e4211c }

	#sub_left01 nav h2 { text-indent:-9000px; background:url(/new/img/sub01/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px }
	#sub_left01 .sub_img { position:relative; top:250px }
	#sub_left01 .gnb_sub { margin:0 0 0 22px }
	#sub_left01 .gnb_sub li a { text-indent:-9000px; width:155px; height:28px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left01 .gnb_sub li a.menu1 { background-image:url(/new/img/sub01/menu01.png); }
	#sub_left01 .gnb_sub li a.menu2 { background-image:url(/new/img/sub01/menu02.png); }
	#sub_left01 .gnb_sub li a.menu3 { background-image:url(/new/img/sub01/menu04.png); }
	#sub_left01 .gnb_sub li a.menu4 { background-image:url(/new/img/sub01/menu05.png); }
	
	
	#sub_left02 nav h2 { text-indent:-9000px; background:url(/new/img/sub02/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px }
	#sub_left02 .sub_img { position:relative; top:250px }
	#sub_left02 .gnb_sub { margin:0 0 0 22px }
	#sub_left02 .gnb_sub li a { text-indent:-9000px; width:155px; height:28px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left02 .gnb_sub li a.menu1 { background-image:url(/new/img/sub02/menu01.png); }
	#sub_left02 .gnb_sub li a.menu2 { background-image:url(/new/img/sub02/menu06.png); }
	#sub_left02 .gnb_sub li a.menu3 { background-image:url(/new/img/sub02/menu02.png); }
	#sub_left02 .gnb_sub li a.menu4 { background-image:url(/new/img/sub02/menu03.png); }
	#sub_left02 .gnb_sub li a.menu5 { background-image:url(/new/img/sub02/menu04.png); }
	#sub_left02 .gnb_sub li a.menu6 { background-image:url(/new/img/sub02/menu05.png); }
	
	#sub_left03 nav h2 { text-indent:-9000px; background:url(/new/img/sub03/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px }
	#sub_left03 .sub_img { position:relative; top:320px }
	#sub_left03 .gnb_sub { margin:0 0 0 22px }
	#sub_left03 .gnb_sub li a { text-indent:-9000px; width:155px; height:28px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left03 .gnb_sub li a.menu1 { background-image:url(/new/img/sub03/menu01.png); }
	#sub_left03 .gnb_sub li a.menu2 { background-image:url(/new/img/sub03/menu02.png); }
	#sub_left03 .gnb_sub li a.menu3 { background-image:url(/new/img/sub03/menu03.png); }
	#sub_left03 .gnb_sub li a.menu4 { background-image:url(/new/img/sub03/menu04.png); }
	#sub_left03 .gnb_sub li a.menu5 { background-image:url(/new/img/sub03/menu05.png); }
	
	#sub_left04 nav h2 { text-indent:-9000px; background:url(/new/img/sub04/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px }
	#sub_left04 .sub_img { position:relative; top:500px }
	#sub_left04 .gnb_sub { margin:0 0 0 22px }
	#sub_left04 .gnb_sub li a { text-indent:-9000px; width:155px; height:28px; background-position:0 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	#sub_left04 .gnb_sub li a.menu1 { background-image:url(/new/img/sub04/menu01.png); }
	#sub_left04 .gnb_sub li a.menu2 { background-image:url(/new/img/sub04/menu02.png); }
	#sub_left04 .gnb_sub li a.menu3 { background-image:url(/new/img/sub04/menu03.png); }
	#sub_left04 .gnb_sub li a.menu4 { background-image:url(/new/img/sub04/menu04.png); }
	#sub_left04 .gnb_sub li a.menu5 { background-image:url(/new/img/sub04/menu05.png); }


#contents { position:absolute; left:180px; top:85px; bottom:0; right:0; padding:0 0 0 50px; min-height:900px }
	
	.slides_container { width:100%; display:none; }		
	.slides_container div { width:800px; max-width:100%; min-height:800px; display:block; }
	.title { margin:40px 0 0 0; }
	.real_contents { margin:30px 0; background-repeat:no-repeat; background-size:100%; max-width:100%; }
	
	.contact li { float:left }
	.contact li.addr { margin:0 0 20px 0 }
	.contact li.tel { float:right; margin:10px 15px 0 0 }
	.contact li.mail { float:right; margin:15px 10px 0 0 }
	.contact li.print { float:right; margin:12px 0 0 0 }
	.contact li.map { clear:both; width:100% }
	
	.recruit_btn { position:absolute; width:215px; height:64px;   text-indent:-9000px; left:60%; padding-top:63% }
	.recruit_btn a { display:block; width:190px; height:57px; background:url(/new/img/sub01/sub04_btn.png) no-repeat; background-size:190px; }
	
	.estimate_btn { position:absolute; width:195px; height:59px;   text-indent:-9000px; left:68%; padding-top:47% }
	.estimate_btn a { display:block; width:195px; height:59px; background:url(/new/img/sub02/btn_estimate.png) no-repeat; background-size:195px; }
	
	.list_gallery01 {}
	.list_gallery01 li { float:left; margin-right:10px; width:188px }
	.list_gallery01 li.last { margin-right:0 }
	.list_gallery01 li p { text-align:center; font:normal 11px/30px Dotum; color:#333 }
	.list_gallery01 li p img { border:3px solid #404040 }
	
	h1.estimate { margin:0; line-height:0; font:0 }
	.btn_area { text-align:center; padding-top:25px }
	
	.table_vertical01 { border-top:3px solid #000; border-collapse:collapse; width:100% }
	.table_vertical01 th { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; color:#333; background:url(/new/img/board/th01.gif) no-repeat right bottom; text-align:left }
	.table_vertical01 td { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; font-weight:normal }
	.table_vertical01 input[type:text] { background-color:transparent; border:1px solid #444; padding:0 3px }
	.table_vertical01 textarea { background-color:transparent; border:1px solid #444; padding:5px }
	.table_vertical01 input.btn { border:none; padding:0 }
	.table_vertical01 li { float:left; margin-right:10px }
	
	h1.portfolio { padding-bottom:20px }
	ul.portfolio { float:left; margin:0 15px 10px 0; width:182px }
	ul.first { }
	ul.last { }
	ul.portfolio li { text-align:center }
	ul.portfolio li img { cursor:pointer; width:182px; height:140px }
	ul.portfolio li.project { color:#333; font-weight:bold }
	ul.portfolio li.url { color:#555; font:11px Dotum; text-decoration:none }
	ul.portfolio li.url a { color:#555; text-decoration:none }
	ul.portfolio li.code { color:#4c91d5; font:bold 11px Dotum; }
	div.pagenum { text-align:center; padding:20px 0 0 0; clear:both; font:normal 11px Dotum; }
	
	
	.detail_back { background:#fff; width:690px; height:470px; display:none; position:absolute; left:50%; top:50%; margin:-300px 0 0 -463px; z-index:10000; padding:30px }
		.detail_back .left { float:left; width:430px; }
		.detail_back .right { float:right; width:230px; margin:0 0 0 30px }
			.detail_back .right dl { border-top:2px solid #333; padding:8px 0 }
			.detail_back .right dt { font:normal 10px/20px Arial; float:left; width:75px; padding:0 0 0 5px; text-transform:uppercase; }
			.detail_back .right dd { font:normal 11px/20px Dotum; }
			.detail_back .right .comment { font:normal 11px/14px Dotum; color:#999; padding:10px 0 5px 5px; border-bottom:1px solid #eee; border-top:1px solid #eee }
			.detail_back .right .thumbnail { padding:20px 0 0 0 }
			.detail_back .right .thumbnail ul { float:left; width:73px; margin-right:5px }
			.detail_back .right .thumbnail ul:last-child { margin-right:0 }
			.detail_back .right .thumbnail ul li { text-align:center; font:11px Dotum; padding:0 0 8px 0 }
			.detail_back .right .thumbnail ul li img { width:73px; height:57px }
			.detail_back .right .btn { clear:both; text-align:center; padding:20px 0 }
			
	.mobile { display:none }
	
aside { position:absolute; right:0; top:25px; z-index:99 }
	.callcenter { text-indent:-9000px; background:url(/new/img/common/callcenter_tablet.png) no-repeat; width:177px; height:177px }
	

footer { position:absolute; left:235px; top:920px }
	footer .copyright { font-size:11px; font-family:arial; font-weight:bold; color:#555; padding:0 0 12px }
	footer address { font-style:normal; font:normal 11px/15px dotum,'dotum'; color:#666 }
	footer span { display:inline-block; margin:0 10px 0 0 }

}



@media (max-width:767px) { 

header { background-image:url(/new/img/common/left_bg.gif); background-repeat:repeat-x; width:100%; height:100px; padding-top:12px }
	header h1 a { background:url(/new/img/common/logo.png) no-repeat 10px 15px; text-indent:-9999px; height:50px; display:block; margin:0 0 0 7px; padding-top:12px; width:150px }
	
	.gnb h2 { display:none }
	.gnb ul { margin:0 0 0 14px }
	.gnb li { float:left; }
	.gnb li a { text-indent:-9000px; width:75px; height:31px; background-position:5px 10px; background-repeat:no-repeat; overflow:hidden; display:block }
	.gnb li a.menu1 { background-image:url(/new/img/common/gnb01.png) }
	.gnb li a.menu1_o { background-image:url(/new/img/common/gnb01_o.png) }
	.gnb li a.menu2 { background-image:url(/new/img/common/gnb02.png) }
	.gnb li a.menu2_o { background-image:url(/new/img/common/gnb02_o.png) }
	.gnb li a.menu3 { background-image:url(/new/img/common/gnb03.png); background-position:0 10px }
	.gnb li a.menu3_o { background-image:url(/new/img/common/gnb03_o.png); background-position:0 10px }
	.gnb li a.menu4 { background-image:url(/new/img/common/gnb04.png) }
	.gnb li a.menu4_o { background-image:url(/new/img/common/gnb04_o.png) }

	.etc h2 { display:none }
	.etc { margin:50px 0 0 0; overflow:hidden;display:none }
	.etc li { float:left }
	.etc li a.etc_login { background:url(/new/img/common/login.png) no-repeat 5px 2px; width:35px; margin:0 10px 0 16px }
	.etc li a.etc_old { background:url(/new/img/common/old.png) no-repeat 5px 2px; width:70px }
	.etc li a { text-indent:-9000px; overflow:hidden; display:block; height:21px }
	
	#blackTransparent { clear:both; display:none; position:absolute; left:0; top:0; width:100%; height:100%; min-height:990px; background:url(/new/img/sub04/transparent_black.png); z-index:10000 }
	
	.login_box { position:absolute; width:550px; display:none; height:300px; background:#ffffff; top:50%; left:50%; margin:-180px 0 0 -275px; padding:37px 42px 20px 42px; z-index:10000 }
	.login_box h2 { background:url(/new/img/common/login_top.gif) no-repeat; height:93px; width:340px }
	.login_box h3 { font-size:0; margin:0; height:0 }
	.login_box dl { border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; padding:18px 15px; overflow:hidden }
	.login_box dt, .login_box dd { float:left; height:40px }
	.login_box dt.txt_id { background:url(/new/img/common/login_txt_id.gif) no-repeat 10px 10px; width:54px; }
	.login_box dt.txt_pwd { background:url(/new/img/common/login_txt_pwd.gif) no-repeat 20px 10px; width:74px; }
	.login_box dd.input_id input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:160px }
	.login_box dd.input_pwd input { border:5px solid #e6e6e6; height:30px; padding:0 5px; font-weight:bold; width:180px }
	.login_box ul { clear:both }
	.login_box li.btn_login { padding:20px 0 0 0; text-align:center }
	.login_box li.btn_idsearch a { float:left; background:url(/new/img/common/btn_idsearch.gif) no-repeat; width:242px; height:21px; margin:20px 30px 0 25px }
	.login_box li.btn_join a { float:left; background:url(/new/img/common/btn_join.gif) no-repeat; width:212px; height:21px; margin:20px 0 0 0 }
	
	.banner { position:absolute; left:30px; top:300px; padding-top:30px; z-index:99; display:none }
	.banner h2 { display:none }
	.banner ul { margin:0 }
	.banner li a { text-indent:-9000px; background-repeat:no-repeat; overflow:hidden; display:block }
	.banner li a.skin { background-image:url(/new/img/common/ban_skin.png); width:115px; height:153px; margin-bottom:25px }
	.banner li a.estimate { background-image:url(/new/img/common/ban_estimate.png); width:115px; height:61px; margin-bottom:25px }
	.banner li a.recruit { background-image:url(/new/img/common/ban_recruit.png); width:115px; height:61px }
		
	
#sub_left01, #sub_left02, #sub_left03, #sub_left04 { width:100% }

#sub_left01 { background:#ffb000; height:55px }
#sub_left02 { background:#0894f6; height:80px }
#sub_left03 { background:#63c53b; height:55px }
#sub_left04 { background:#e4211c; height:32px }

	#sub_left01 nav h2 { text-indent:-9000px; background:url(/new/img/sub01/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px; display:none }
	#sub_left01 .sub_img { position:relative; top:250px; display:none }
	#sub_left01 .gnb_sub { margin:0 0 0 22px }
	#sub_left01 .gnb_sub li { float:left; padding:5px 10px 0 10px; background:url(/new/img/common/bullet01.png) no-repeat 0 12px }
	#sub_left01 .gnb_sub li a { color:#fff; font:bold 12px/20px Arial, Helvetica, sans-serif; text-decoration:none }
	
	#sub_left02 nav h2 { text-indent:-9000px; background:url(/new/img/sub02/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px; display:none }
	#sub_left02 .sub_img { position:relative; top:250px; display:none }
	#sub_left02 .gnb_sub { margin:0 0 0 22px; height:10px }
	#sub_left02 .gnb_sub li { float:left; padding:5px 10px 0 10px; background:url(/new/img/common/bullet01.png) no-repeat 0 12px }
	#sub_left02 .gnb_sub li a { color:#fff; font:bold 12px/20px Arial, Helvetica, sans-serif; text-decoration:none }
	#sub_left02 .gnb_sub li.nomobile { display:none }
	
	#sub_left03 nav h2 { text-indent:-9000px; background:url(/new/img/sub03/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px; display:none }
	#sub_left03 .sub_img { position:relative; top:250px; display:none }
	#sub_left03 .gnb_sub { margin:0 0 0 22px }
	#sub_left03 .gnb_sub li { float:left; padding:5px 10px 0 10px; background:url(/new/img/common/bullet01.png) no-repeat 0 12px }
	#sub_left03 .gnb_sub li a { color:#fff; font:bold 12px/20px Arial, Helvetica, sans-serif; text-decoration:none }
	
	#sub_left04 nav h2 { text-indent:-9000px; background:url(/new/img/sub04/left_tit.png) no-repeat; height:20px; margin:25px 0 15px 22px; display:none }
	#sub_left04 .sub_img { position:relative; top:250px; display:none }
	#sub_left04 .gnb_sub { margin:0 0 0 22px }
	#sub_left04 .gnb_sub li { float:left; padding:5px 10px 0 10px; background:url(/new/img/common/bullet01.png) no-repeat 0 12px }
	#sub_left04 .gnb_sub li a { color:#fff; font:bold 12px/20px Arial, Helvetica, sans-serif; text-decoration:none }


#contents { width:100%; padding-bottom:20px; }
	
	.slides_container { width:100%; display:none; }		
	.slides_container div { width:800px; max-width:96%; min-height:380px; height:380px; display:block; }
	.title { margin:20px 20px 0 20px; width:80% }
	.real_contents { margin:15px 20px 30px 20px; background-repeat:no-repeat; background-size:100%; max-width:100%; }
	
	.contact li {}
	.contact li.addr { margin:0 0 10px 0 }
	.contact li.tel { margin:10px 0 15px 0 }
	.contact li.mail { display:none }
	.contact li.print { display:none }
	.contact li.map { clear:both }
	
	.recruit_btn { position:absolute; width:215px; height:64px;   text-indent:-9000px; left:62%; padding-top:60% }
	.recruit_btn a { display:block; width:100px; height:30px; background:url(/new/img/sub01/sub04_btn.png) no-repeat; background-size:100px; }
	
	.list_gallery01 {}
	.list_gallery01 li { float:left; margin-right:10px; width:188px }
	.list_gallery01 li.last { margin-right:0 }
	.list_gallery01 li p { text-align:center; font:normal 11px/30px Dotum; color:#333 }
	.list_gallery01 li p img { border:3px solid #404040 }
	
	h1.estimate { margin:0; line-height:0; font:0 }
	.btn_area { text-align:center; padding-top:25px }
	
	.table_vertical01 { border-top:3px solid #000; border-collapse:collapse; width:100% }
	.table_vertical01 th { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; color:#333; background:url(/new/img/board/th01.gif) no-repeat right bottom; text-align:left }
	.table_vertical01 td { border-bottom:1px solid #404040; padding:8px 10px 7px 10px; font-weight:normal }
	.table_vertical01 input[type:text] { background-color:transparent; border:1px solid #444; padding:0 3px }
	.table_vertical01 textarea { background-color:transparent; border:1px solid #444; padding:5px }
	.table_vertical01 input.btn { border:none; padding:0 }
	.table_vertical01 li { float:left; margin-right:10px }
	
	h1.portfolio { padding-bottom:20px; width:70% }
	ul.portfolio { float:left; margin:0 10px 15px 0; width:130px }
	ul.first {  }
	ul.last { }
	ul.portfolio li { text-align:center }
	ul.portfolio li img { cursor:pointer; width:130px; height:100px }
	ul.portfolio li.project { color:#333; font-weight:bold }
	ul.portfolio li.url { color:#555; font:11px Dotum; text-decoration:none }
	ul.portfolio li.url a { color:#555; text-decoration:none }
	ul.portfolio li.code { color:#4c91d5; font:bold 11px Dotum; }
	div.pagenum { text-align:center; padding:20px 0 0 0; clear:both; font:normal 11px Dotum; }
	
	
	.detail_back { background:#fff; width:250px; display:none; position:absolute; left:50%; top:50%; margin:-150px 0 0 -135px; z-index:10000; padding:10px }
		.detail_back .left { width:250px; }
		.detail_back .right { margin:0 }
			.detail_back .right dl { border-top:2px solid #333; padding:8px 0 }
			.detail_back .right dt { font:normal 10px/20px Arial; float:left; width:75px; padding:0 0 0 5px; text-transform:uppercase; }
			.detail_back .right dd { font:normal 11px/20px Dotum; }
			.detail_back .right .comment { font:normal 11px/14px Dotum; color:#999; padding:10px 0 5px 5px; border-bottom:1px solid #eee; border-top:1px solid #eee }
			.detail_back .right .thumbnail { padding:20px 0 0 0; display:none }
			.detail_back .right .thumbnail ul { float:left; width:80px; margin-right:5px }
			.detail_back .right .thumbnail ul li { text-align:center; font:11px Dotum; padding:0 0 8px 0 }
			.detail_back .right .btn { clear:both; text-align:center; padding:20px 0; display:none }
			
	.mobile { cursor:pointer; text-align:center; margin:15px 0 5px 0 }
	

aside { }
	.callcenter { text-indent:-9000px; background:url(/new/img/common/callcenter_mobile.png) no-repeat 15px 15px; width:250px; height:40px }
	
	
footer { width:100%; }
	footer .copyright { font-size:11px; font-family:arial; font-weight:bold; color:#555; padding:15px 0 12px 15px }
	footer address { font-style:normal; font:normal 11px/15px dotum,'dotum'; color:#666; margin-left:15px }
	footer span { display:inline-block; margin:0 10px 0 0 }


}