@import url(sub.css);


/* Àüü_INTRO
------------------------------------------------------------------------------------------------------------------------------------------------------
#int_wrap { position:relative; width:100%; height:100%; line-height:150%;  overflow:hidden; }
.int_inner { position:relative; width:800px; height:100%; margin:0 auto;}
.int_inner .header { position:relative; top:100px; }
.int_inner .header h1 { text-align:left; }

.int_inner .BtnArea {position:relative; top:230px; width:800px; overflow:hidden; padding-left:85px;}
.int_inner .BtnArea .scBtn li {background:url(../images/intro/btn_bg01.png) no-repeat; width:150px; height:150px; float:left; text-align:center; padding-top:30px; margin:0 40px;}
.int_inner .BtnArea .scBtn li span {display:block; padding-top:20px; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-weight:600; font-size:18px; color:#ca0000; letter-spacing:-1;}

.int_inner .copyArea {position:relative; top:360px; width:800px; overflow:hidden; padding-left:85px; font-size:13px; color:#5c5c5c;}
.int_inner .copyArea .copylogo {padding:0 0 20px 0;}
.int_inner .copyArea span {padding:0 0 0 20px;}
.int_inner .copyArea .copyright {padding-top:10px;}
.int_inner .copyArea .copyright span {color:#0088a5; padding:0;}*/


/* Ãë¾÷_INTRO_new
------------------------------------------------------------------------------------------------------------------------------------------------------*/

#intro02 { position:relative; width:100%; height:100%; line-height:150%;  overflow:hidden; }
#introWrap02 { position:relative; width:100%; height:100%; /*overflow:hidden;*/ z-index:10; }

.intro_inner02 { position:relative; width:760px; height:100%; margin:0 auto;}
.intro_inner02 .header { position:relative; top:10%; }
.intro_inner02 .header h1 { text-align:center; }

.intro_inner02 .BtnArea {position:relative; top:20%; width:760px; margin:0 auto; overflow:hidden;}
.intro_inner02 .BtnArea .scBtnArea {float:left; border-right:1px solid #e5e5e5; padding:0 10px; display:block;}
.intro_inner02 .BtnArea .scBtnArea h2 {clear:both; text-align:center;font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-weight:600; padding-top:20px;color:#615f5f; font-size:15px;}
.intro_inner02 .BtnArea .last {border-right:0;}

/*.intro_inner02 .BtnArea .scBtn li {background:url(../images/intro/btn_bg01.png) no-repeat; width:116px; height:116px; float:left; text-align:center; padding-top:20px; margin:0 10px;}*/
.intro_inner02 .BtnArea .scBtn li {position:relative; float:left; width:150px; height:150px; text-align:center; border-radius:100%; background:rgba(202,0,0,.2);}
.intro_inner02 .BtnArea .scBtn li::before{content:""; position:absolute; left:0; top:0; width:130px; height:130px; border-radius:100%; border:10px solid #ca0000; border-left:10px solid transparent; border-top:10px solid transparent; z-index:-1;}
.intro_inner02 .BtnArea .scBtn li:first-child{margin-right:20px;}
.intro_inner02 .BtnArea .scBtn li a{display:block; width:130px; height:130px; margin:10px; background:#fff; border-radius:100%;}
.intro_inner02 .BtnArea .scBtn li a img{margin-top:25px;}
.intro_inner02 .BtnArea .scBtn li a:hover span{color:#ca0000;}
.intro_inner02 .BtnArea .scBtn li span {display:block; padding-top:10px; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-weight:600; font-size:16px; color:#333; letter-spacing:-1;}

.intro_inner02 .BtnArea .scBtn02 li {position:relative; float:left; width:150px; height:150px; text-align:center; border-radius:100%; background:rgba(0,0,0,.2);}
.intro_inner02 .BtnArea .scBtn02 li::before{content:""; position:absolute; left:0; top:0; width:130px; height:130px; border-radius:100%; border:10px solid #333; border-left:10px solid transparent; border-top:10px solid transparent; z-index:-1;}
.intro_inner02 .BtnArea .scBtn02 li a{display:block; width:130px; height:130px; margin:10px; background:#fff; border-radius:100%;}
.intro_inner02 .BtnArea .scBtn02 li a img{margin-top:25px;}
.intro_inner02 .BtnArea .scBtn02 li span {display:block; padding-top:10px; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-weight:600; font-size:16px; color:#333; letter-spacing:-1;}

#introWrap02 .go_smart{position:absolute; right:0; bottom:0; }




/* INTRO
------------------------------------------------------------------------------------------------------------------------------------------------------*/

#intro { position:relative; width:100%; height:100%; line-height:150%; background:url(../images/intro/intro_bg.jpg) no-repeat top center; overflow:hidden; }
#introWrap { position:relative; width:100%; height:100%; /*overflow:hidden;*/ z-index:10; }

/* PANEL */

a.openPanel { position:fixed; right:0; top:0;z-index:100; }
.sidePanel { position:fixed; right:-300px; top:0; width:300px; height:100%; background:#000; text-align:center; z-index:200; display:none; }
.sidePanel strong { width:90px; margin:90px auto 0 auto; padding:0 0 15px 0; border-bottom:2px solid #a3b8fe; font-family:'Roboto'; font-size:30px; font-weight:300; color:#a3b8fe; display:block; }
.sidePanel ul { margin:60px 0 0 0; }
.sidePanel ul li{ margin:40px 0; }
.sidePanel ul li a{ font-size:20px; color:#a9a8a8; }
.sidePanel ul li a:hover { color:#fff; }
.sidePanel a.closePanel { display:block; text-align:center; margin:20px 0 0 0; }


/* INTRO - CONTENTS */

.intro_inner { position:relative; width:810px; height:100%; margin:0 auto; }
.intro_inner .header { position:relative; top:10%; }
.intro_inner .header h1 { text-align:center; }

.intro_inner .shoutcutArea { position:relative; top:17%; width:810px; margin:0 auto; overflow:hidden; }
.intro_inner .shoutcutArea li { float:left; position:relative; width:230px; height:280px; margin:0 20px; text-align:center; }
.intro_inner .shoutcutArea li h2 { margin:60px 0 0 0; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-weight:600; }
.intro_inner .shoutcutArea li p{ margin:15px 0 0 0; font-size:13px; font-weight:600; color:#666; }
.intro_inner .shoutcutArea .sc_class01 { background:url(../images/intro/intro_class01.jpg) no-repeat top left; }
.intro_inner .shoutcutArea .sc_class02 { background:url(../images/intro/intro_class02.jpg) no-repeat top left; }
.intro_inner .shoutcutArea .sc_class03 { background:url(../images/intro/intro_class03.jpg) no-repeat top left; }
.intro_inner .shoutcutArea li ul.detail_class{ position:absolute; bottom:0; left:0; width:100%; }
.intro_inner .shoutcutArea li ul.detail_class li { height:auto; margin:0; }
.intro_inner .shoutcutArea li ul.detail_class li a { height:30px; margin:0 ; line-height:30px; background:url(../images/intro/btn_left_bg.png) no-repeat top left; font-size:12px; font-weight:600; color:#666; display:block; }
.intro_inner .shoutcutArea li ul.detail_class li a span { margin:0 0 0 16px; padding:0 16px 0 0; background:url(../images/intro/btn_right_bg.png) no-repeat top right; display:block; }
.intro_inner .shoutcutArea li ul.detail_class li a:hover{background:url(../images/intro/btn_left_bg_over.png) no-repeat top left; color:#fff;}
.intro_inner .shoutcutArea li ul.detail_class li a:hover span{background:url(../images/intro/btn_right_bg_over.png) no-repeat top right;}

.intro_inner .go_main{ position:relative; top:23%; left:50%; margin-left:-22px; width:45px; height:45px; background:url(../images/common/arrow_go.gif) no-repeat top left; text-indent:-9999px; display:block;	text-align:center; }

#introWrap .go_smart{position:absolute; right:0; bottom:0; }


/* MAIN
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* PORTFOLIO */

.pfArea { position:relative; width:100%; height:auto; background:url(../images/main/pf_bg.jpg) no-repeat top center; }
.pfArea2 { position:relative; width:100%; min-width:1100px; height:390px; margin:0 auto; background:url(../images/main/build_visual.jpg) no-repeat top center; }
.pfArea .squareList .btn_allpf { position:absolute; bottom:1px; right:-1px; width:130px; height:130px; background:url(../images/main/pf_more_bg.gif) no-repeat top left; text-align:center; z-index:30; border-left:1px solid white; border-top:1px solid white; border-right:1px solid white;}
.pfArea .squareList .btn_allpf a { position:relative; top:70px; padding:35px 0 0 0; background:url(../images/main/btn_more.png) no-repeat top center; font-size:13px; color:#fff; line-height:140%; }
.pfArea .pfText {position:absolute; bottom:30px; font-size:13px; left:50%; margin-left:300px; color:#fff;line-height:150%;}

/* °è¿­¼Ò°³ */

.introArea { width:100%; min-width:1100px; height:90px; margin:0 auto; background:url(../images/main/intro_bg.gif) no-repeat top center; }
.introArea div { position:relative; width:1100px; height:90px; margin:0 auto; background:url(../images/main/intro_inner_bg.gif) no-repeat top left; }
.introArea div strong { position:absolute; bottom:15px; left:40px; }
.introArea div em { position:absolute; top:15px; left:310px; padding:3px 5px; background:#85a3cf; font-family:'Roboto'; font-weight:300; font-size:20px; color:#e5f0ff; display:block; }
.introArea div p { position:absolute; top:45px; left:313px; line-height:150%; font-size:12px; color:#666;}
	


/* ÀÎÀ縮½ºÆ® */

.ppArea { position:relative; width:600px; margin:0 auto; z-index:9; }
.ppArea h2 { width:600px; margin:50px auto 10px auto; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-size:17px; color:#999; line-height:150%; text-align:center; }
.ppArea h2 span { color:#333;}

/* ÀÎÀ縮½ºÆ® - ¿¬µµ */

.ppArea .select_year { position:absolute; top:100px; left:0; width:100px; font-family:'Roboto'; text-align:center; z-index:100; }
.ppArea .select_year .title { width:100px; height:45px; line-height:45px; background:#ff7e4d; }
.ppArea .select_year .title span { padding:1px 20px 0 0; background:url(../images/common/icon_ck.png) no-repeat right 0; font-size:13px; font-weight:600; color:#fff; }
.ppArea .select_year ul li a { width:98px; padding:8px 0; background:#fff; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc; font-size:13px; display:block; }
.ppArea .select_year ul li a:hover { color:#ff7e4d; }
.ppArea .select_year ul li a.on { color:#ff7e4d; }

/* ÀÎÀ縮½ºÆ® -ÀÎÀç¼Ò°³*/

.ppArea .squareList .intro_pp { position:absolute; top:131px; left:133px; width:260px; height:260px; background:url(../images/main/pp_text_bg.gif) no-repeat top left; z-index:50; }
.ppArea .squareList .intro_pp p { margin:40px 0 0 0; line-height:160%; font-size:12px; color:#dfb8b8; text-align:center; }
.ppArea .squareList .intro_pp p strong { margin:0 0 10px 0; line-height:150%; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; font-size:15px; color:#fff; display:block; }
.ppArea .squareList .intro_pp a { width:35px; height:35px; margin:20px auto; background:url(../images/common/arrow_go.gif) no-repeat top left; text-indent:-9999px; display:block; }
	
/* ¹Ù·Î°¡±â */

.scArea { width:100%; margin:30px 0 0 0; padding:80px 0; background:#f9f9f9; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; overflow:hidden; }
.scArea .scWrap { width:900px; margin:0 auto; }
.scArea .scWrap ul { width:200%; margin:0 0 0 100px; }
.scArea .scWrap ul li { float:left; width:175px; margin:0 100px 0 0; padding:65px 0 0 0; line-height:130%; text-align:center; }

.scArea .scWrap ul li.sc01 { background:url(../images/main/sc_icon01.gif) no-repeat top center; }
.scArea .scWrap ul li.sc02 { background:url(../images/main/sc_icon02.gif) no-repeat top center; }
.scArea .scWrap ul li.sc03 { background:url(../images/main/sc_icon03.gif) no-repeat top center; }
.scArea .scWrap ul li strong { font-size:20px; color:#222; font-weight:600; display:block; }
.scArea .scWrap ul li span { margin:10px 0 0 0; font-size:13px; color:#999; display:block; }
.scArea .scWrap ul li a { width:50px; height:50px; margin:25px auto 0 auto; background:url(../images/main/btn_sc.gif) no-repeat top left; text-indent:-9999px; display:block; }
.scArea .scWrap ul li a:hover { background:url(../images/main/btn_sc_over.gif) no-repeat top left; }

/* °øÁö»çÇ× */
.noticeArea { width:100%; height:64px; border-top:1px solid #dcdcdc; }
.noticeArea div { width:1100px; height:64px; margin:0 auto; overflow:hidden; }
.noticeArea strong { float:left; width:200px; line-height:64px; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; font-size:23px; color:#222; text-align:center; display:block; }
.noticeArea ul { float:left; }
.noticeArea ul li { padding:0 0 0 30px; height:64px; line-height:64px; display:block; }
.noticeArea ul li a { font-size:17px; color:#666; }
.noticeArea a.more { float:right; width:64px; height:46px; padding:18px 0 0 0; line-height:64px; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; text-align:center; display:block; }



/* ¸ÞÀÎ Äü */
#mainCont { position:relative; width:1100px; min-height:400px; margin:0 auto 100px auto; }
#mainCont .submenu { margin:0px 0 0 100px; z-index:9; }
#mainCont .submenu ul { height:52px; }
#mainCont .submenu ul li { float:left; text-align:center; margin-left:-1px; }
#mainCont .submenu ul li a { width:178px; height:50px; border:1px solid #d7d7d7; line-height:50px; font-size:15px; color:#666; display:block; }
#mainCont .submenu ul li.on a{background:#ff7e4d; border:1px solid #ff7e4d; color:#fff;} /* ÇØ´çÆäÀÌÁöÀÏ ¶§ li¿¡ class="on" */
#mainCont .submenu.left .title { width:102px; padding:12px 0 14px; background:#ff7e4d; text-align:center;}
#mainCont .submenu.left{ float:left; }
#mainCont .submenu.left ul { height:auto; }
#mainCont .submenu.left ul li { float:none; margin:-1px 0 0 0;; }
#mainCont .submenu.left ul li a{ width:100px; height:auto; padding:10px 0; font-size:13px; line-height:normal; }
#mainCont .submenu.left ul li.on a { background:#fff; color:#ff7e4d; font-weight:600; position:relative; z-index:10; }



/* SUB
------------------------------------------------------------------------------------------------------------------------------------------------------*/

.subTop { background:#272a33; font-family:'³ª´®½ºÄù¾î', 'NanumSquareR'; }
.subTop div { width:1100px; height:135px; margin:0 auto; background:url(../images/sub/subtitle_bg01.jpg) no-repeat top left; text-align:center; overflow: hidden; }
.subTop div h2 { margin:38px 0 0 0; font-size:35px; color:#bec3d9; display:block; }
.subTop div span { margin:10px 0 0 0; font-size:14px; color:#8e94a8; line-height:140%; display:block; }

#subCont { position:relative; width:1100px; min-height:400px; margin:0 auto 100px auto; }
#subCont .submenu { margin:30px 0 0 100px; }
#subCont .submenu ul { height:52px; }
#subCont .submenu ul li { float:left; text-align:center; margin-left:-1px; }
#subCont .submenu ul li a { width:178px; height:50px; border:1px solid #d7d7d7; line-height:50px; font-size:15px; color:#666; display:block; }
#subCont .submenu ul li.on a{background:#ff7e4d; border:1px solid #ff7e4d; color:#fff;} /* ÇØ´çÆäÀÌÁöÀÏ ¶§ li¿¡ class="on" */


/* ÀÎÀçÁ¤º¸,ÀÛÇ°°¶·¯¸® º°µµ ½ºÅ¸ÀÏ */
#subCont .submenu.left .title { width:102px; padding:12px 0 14px; background:#ff7e4d; text-align:center;}
#subCont .submenu.left{ float:left; margin-top:70px; }
#subCont .submenu.left ul { height:auto; }
#subCont .submenu.left ul li { float:none; margin:-1px 0 0 0;; }
#subCont .submenu.left ul li a{ width:100px; height:auto; padding:10px 0; font-size:13px; line-height:normal; }
#subCont .submenu.left ul li.on a { background:#fff; color:#ff7e4d; font-weight:600; position:relative; z-index:10; }
#subCont .rightCont { float:right; width:840px; }
.squareList.sub { position:relative; width:650px; margin:70px auto 0 30px; background:none; }
.squareList.sub > ul:after { display:block; content:""; clear:both; }
.squareList.sub > ul > li { position:relative; float:left; width:130px; height:130px; margin-right:1px; margin-bottom:1px; }


#contents { width:960px; margin:70px auto 0 auto; line-height:150%; }



/* --------------- ÄÁÅÙÃ÷½ºÅ¸ÀÏ --------------- */

/*º»¹® ¶ç¿ì±â */

.para01 { margin-top:20px; }

.para02 { margin-top:40px; }

.para03 { margin-top:70px; }

/*Á¦¸ñ */

#contents h3 { padding:0 0 15px 25px; font-size:16px; font-weight:600; background:url(../images/sub/list01_b.gif) no-repeat left 0px; }
#contents h4 { padding:0 0 0 13px; background:url(../images/sub/list02_b.gif) no-repeat left 3px; font-weight:600; font-size:14px; }
ul.list01 > li { margin:0 0 30px 0; padding:0 0 0 25px; font-size:16px; font-weight:600; background:url(../images/sub/list01_b.gif) no-repeat left 1px; }
ul.list02 > li { margin:0 0 5px 0; padding:0 0 0 15px; background:url(../images/sub/list02_b.gif) no-repeat left 1px; font-weight:400; font-size:14px; }
ul.list03 > li { margin:0 0 3px 0; padding:0 0 0 13px; background:url(../images/sub/list03_b.gif) no-repeat left 7px; font-weight:400; font-size:13px; }
ul.list04 > li { margin:0 0 3px 0; padding:0 0 0 10px; background:url(../images/sub/list04_b.gif) no-repeat left 8px; font-weight:400; font-size:13px; }
ul.none > li  {background:none; }

ul.list02{margin:10px 0;}
ul.list03{margin:5px 0;}
ul.list04{margin:5px 0;}

.text {	margin:7px 0; font-size:13px; font-weight:400; }


/* --------------- Å×À̺í --------------- */

/* 񃧯 */

.basic_table {  border-top: 1px solid #4a5b76; border-left: 1px solid #ddd; border-bottom: none;  border-right: none; margin-top: 15px;  border-collapse: collapse; font-size:13px; width: 100%; }
.basic_table th, .basic_table td { padding:8px; border-right: 1px solid #ddd;	border-bottom: 1px solid #ddd; }
.basic_table thead th { background:#f6f6f6; color:#4a5b76; }
.basic_table tbody th { background:#fafafa; }

/* ¶óÀÎ Å×À̺í */

.line_table { border-top: 1px solid #4a5b76; border-bottom: 1px solid #4a5b76; margin: 15px 0 22px 0; border-collapse: collapse; width: 100%; font-size:13px; }
.line_table thead th { padding:10px; border-bottom: 1px solid #4a5b76; }
.line_table tbody td, .line_table tbody th {padding:10px; border-bottom: 1px solid #d7d7d7; }


/* --------------- ¾ç½Ä --------------- */

.inputStyle { height:20px; padding:0 5px; border:1px solid #c0c0c0; }
.selStyle { height:22px; border:1px solid #c0c0c0; }
.textareaStyle { border:1px solid #c0c0c0; }

.btnArea { margin:50px 0 0 0; text-align:center; }
.board-btnArea { margin:10px 0 0 0; text-align:right; }

a.btnWhite-s { width:85px; height:30px; margin:0 5px; background:url(../images/sub/btn_white_s.gif) no-repeat top left; line-height: 30px; font-weight: 600; color:#666; text-align: center;  display: inline-block;  zoom: 1; }
a.btnDgray-s { width: 85px; height: 30px; margin: 0 5px; background: url(../images/sub/btn_dgray_s.gif) no-repeat top left; line-height: 30px; font-weight: 600; color:#fff; text-align: center; display: inline-block; zoom: 1; }
a.btnGray-s { width: 85px; height: 30px; margin: 0 5px; background: url(../images/sub/btn_gray_s.gif) no-repeat top left; line-height: 30px; font-weight: 600; color:#666; text-align: center;  display: inline-block; zoom: 1; }
a.btnNavy-s { width: 85px; height: 30px; margin: 0 5px; background: url(../images/sub/btn_navy_s.gif) no-repeat top left; line-height: 30px; font-weight: 600; color:#cacddc; text-align: center;  display: inline-block; zoom: 1; }
a.btnRed-s { width: 85px; height: 30px; margin: 0 5px; background: url(../images/sub/btn_red_s.gif) no-repeat top left; line-height: 30px; font-weight: 600; color:#e7d2d2; text-align: center; display: inline-block; zoom: 1; }
a.btnGray { width: 170px; height: 40px;  margin: 0 5px; background: url(../images/sub/btn_gray.gif) no-repeat top left; line-height: 40px; font-weight: 600; text-align: center; display: inline-block; zoom: 1; }
a.btnRed { width: 170px;  height: 40px; margin: 0 5px; background: url(../images/sub/btn_red.gif) no-repeat top left; line-height: 40px; font-weight: 600; color:#fff; text-align: center; display: inline-block; zoom: 1; }

a.btnReset { padding:3px 20px; margin:0 5px; font-weight:600; font-size:12px; color:#fff; display:inline-block; zoom:1; background:#393F61; border-radius:5px;  }

.pageArea {	margin:20px 0; text-align:center; }
.pageArea a { margin:0 2px; }
.pageArea a.num { width:23px; height:23px; line-height:25px; text-align:center; border:1px solid #d6d6d6; display: inline-block; zoom: 1; }
.pageArea a.on { border:1px solid #ae6161; background:#ae6161; color:#fff; }
.pageArea a img { vertical-align:top; }