@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus,
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px;}

.contain {*zoom:1; width:1100px; margin:0 auto;}
.contain:after {content:" "; display:block; clear:both;}

/* header */
#header {position:fixed; top:0; left:0; width:100%; height:100px; background:#fff; border-bottom:1px solid #ddd; z-index:100;}
#header .contain {position:relative; z-index:9999;}
#header .logo {position:absolute; top:12px; left:0; z-index:10;}
#header .util {position:absolute; top:38px; right:0; padding:0 20px; height:25px; background:#e4e4e4; border-radius:10px; overflow:hidden;}
#header .util li {float:left; padding-left:15px; font-size:10px; line-height:25px; font-weight:900; background:url('../images/common/colon.gif') 8px 10px no-repeat;}
#header .util li:first-child {padding-left:0; background:none;}
#header .util li a {text-decoration:none; color:#666;}
#gnb {*zoom:1; margin:0 200px 0 158px;}
#gnb:after {content:" "; display:block; clear:both;}
#gnb > ul {position:relative; float:right; *zoom:1;}
#gnb > ul > li {float:left; font-size:17px; font-weight:700; line-height:18px;}
#gnb > ul > li > a {display:block; text-decoration:none; padding:40px 50px 41px 50px; color:#333; background:url('../images/common/line.gif') 0 50% no-repeat;}
#gnb > ul > li:first-child > a {background:none;}
#gnb > ul > li.active:after, #gnb > ul > li:hover:after {content:" "; display:block; margin:-2px auto 0; width:63px; height:3px; background:#009bbf;}
#gnb > ul > li.active > a, #gnb > ul > li > a:hover {color:#009bbf;}
#gnb .submenu {display:none; position:absolute; top:100px;}
#gnb .m1 .submenu {left:45px;}
#gnb .m2 .submenu {left:0; width:800px;}
#gnb .m3 .submenu {left:360px;}
#gnb .m4 .submenu {right:45px;}
#gnb .submenu ul li {float:left; margin:22px 0 22px 57px; font-size:15px; line-height:24px; font-weight:700;}
#gnb .submenu ul li a {text-decoration:none; color:#fff;}
#gnb .submenu ul li.on, #gnb .submenu ul li:hover {text-decoration:underline;}
.submenu-bg {display:none; position:absolute; top:100px; left:0; height:70px; width:100%; background:#1e1e1e;}

#container {*zoom:1; width:1200px; margin:0 auto;}
#container:after {content:" "; display:block; clear:both;}

/* main */
#container {width:100%;}
#main .section {position:relative; overflow:hidden;}
.main-visual .wide-container {margin-top:101px;}

.scrollTo {
	position:absolute;
	bottom:30px;
	left:50%;
	margin-left:-45px;
	width:90px;
	height:138px;
	font-size:0;
	line-height:0;
	text-indent:-999em;
	overflow:hidden;
	background:url('../images/main/scroll_img.png') 50% 0 no-repeat;
	z-index:10;
	-webkit-animation: bounce .9s linear infinite alternate;
    -moz-animation: bounce .9s linear infinite alternate;
    -o-animation: bounce .9s linear infinite alternate;
    -ms-animation: bounce .9s linear infinite alternate;
    animation: bounce .9s linear infinite alternate;
}
@-moz-keyframes bounce{from{bottom:30px;}to{bottom:45px;}}
@-webkit-keyframes bounce{from{bottom:30px;}to{bottom:45px;}}
@-o-keyframes bounce{from{bottom:30px;}to{bottom:45px;}}
@keyframes bounce{from{bottom:30px;}to{bottom:45px;}}

.main-business {background:#eee;}
.main-business h2 {margin-top:100px; margin-bottom:47px; font-family:'NanumBarunGothic'; font-size:50px; line-height:55px; color:#333; text-align:center;}
.main-business h2 .point {color:#009bbf;}
.main-business h2 .ko {display:block; margin-bottom:10px; font-size:30px; line-height:32px; color:#333;}
.main-business h2 .area {display:block; margin-top:15px; font-size:20px; line-height:30px; color:#666; font-weight:normal;}
.main-business ul {*zoom:1;}
.main-business ul:after {content:" "; display:block; clear:both;}
.main-business ul li {position:relative; float:left; width:275px; font-size:14px; line-height:20px; background:#fff;}
.main-business ul li a {display:block; text-decoration:none; color:#505050;}
.main-business ul li .cnt {padding:30px 0 0 29px; height:190px;}
.main-business ul li .cnt p {margin-bottom:10px;}
.main-business ul li .cnt p.tt {margin-bottom:15px; font-size:17px; line-height:20px; color:#009999;}
.main-business ul li .cnt p.tt strong {font-weight:800;}
.main-business ul li .img {position:relative;}
.main-business ul li .img img {vertical-align:top;}
.main-business ul li .arrow {position:absolute; left:50%; margin-left:-15px; width:30px; height:15px; background-repeat:no-repeat; background-position:50% 0;}
.main-business ul li .arrow.up {bottom:0; background-image:url('../images/main/arrow_up.png');}
.main-business ul li .arrow.down {top:0; background-image:url('../images/main/arrow_down.png');}

.main-result h2 {margin-top:100px; margin-bottom:47px; font-family:'NanumBarunGothic'; font-size:50px; line-height:55px; color:#333; text-align:center;}
.main-result h2 .point {color:#009bbf;}
.main-result h2 .ko {display:block; margin-bottom:10px; font-size:30px; line-height:32px; color:#333;}
.main-result h2 .area {display:block; margin-top:15px; font-size:20px; line-height:30px; color:#666; font-weight:normal;}
.main-result .wrap {background:url('../images/main/bg_main_result.jpg') 50% 0 no-repeat;}
.main-result .contain {display: flex; height:500px;}
.main-result .tit {float:left; width:250px; height:500px; background:#ddb33e; text-align:center;}
.main-result .tit h4 {padding:73px 0 18px; font-family:'NanumBarunGothic'; font-size:36px; line-height:40px; font-weight:700; color:#fff;}
.main-result .tit .text {font-size:16px; line-height:24px; color:#fff;}
.main-result .result {float:right; width:849px; height:498px; background:#fff; border-top:1px solid #d1d1d1; border-right:1px solid #d1d1d1; border-bottom:1px solid #d1d1d1;}
.main-result .result .year {padding:35px 0 25px 50px; font-size:30px; line-height:35px; color:#000; font-weight:900;}
.main-result .result .result-slider ul {*zoom:1; margin:0 auto; width:750px;}
.main-result .result .result-slider ul:after {content:" "; display:block; clear:both;}
.main-result .result .result-slider ul li {font-size:14px; line-height:36px;}
.main-result .result .result-slider ul li a {text-decoration:none; color:#505050;}
.main-result .result .bx-wrapper .bx-controls-direction a {top:-60px; width:29px; height:29px; border:1px solid #000;}
.main-result .result .bx-wrapper .bx-prev {left:741px; background-image:url('../images/main/prev2.gif');}
.main-result .result .bx-wrapper .bx-next {left:771px; background-image:url('../images/main/next2.gif');}

.main-support .support {width:1100px; margin:0 auto;}
.main-support .support h2 {margin-bottom:47px; font-family:'NanumBarunGothic'; font-size:50px; line-height:55px; color:#333; text-align:center;}
.main-support .support h2 .point {color:#009bbf;}
.main-support .support h2 .ko {display:block; margin-bottom:10px; font-size:30px; line-height:32px; color:#333;}
.main-support .support h2 .area {display:block; margin-top:15px; font-size:20px; line-height:30px; color:#666; font-weight:normal;}
.main-support .support ul {*zoom:1; margin-bottom:130px;}
.main-support .support ul:after {content:" "; display:block; clear:both;}
.main-support .support ul li {float:left; position:relative; margin-left:20px; width:198px; height:198px; font-family:'NanumBarunGothic'; font-size:13px; line-height:18px; letter-spacing:-0.05em; text-align:center; background:url('../images/main/main_support1.jpg') no-repeat;}
.main-support .support ul li.l1 {margin-left:0;}
.main-support .support ul li.l2 {background-image:url('../images/main/main_support2.jpg');}
.main-support .support ul li.l3 {background-image:url('../images/main/main_support3.jpg');}
.main-support .support ul li.l4 {background-image:url('../images/main/main_support4.jpg');}
.main-support .support ul li.l5 {background-image:url('../images/main/main_support5.jpg');}
.main-support .support ul li a {display:block; text-decoration:none; color:#fff;}
.main-support .support ul li h3 {padding:35px 0 70px 0; font-size:24px; line-height:26px;}
.main-support #footer {position:absolute; bottom:0; left:0; width:100%;}


/* sub page */
#sub #container {width:100%; overflow:hidden;}
#contentArea {margin:0 auto; width:1100px; overflow:hidden;}
.sub-visual {padding-top:50px; height:110px; font-size:17px; background:#fff;}
.sub-visual .contain {position:relative;}
.sub-visual .title {margin-bottom:10px; font-size:24px; line-height:30px; font-weight:700; color:#3d3d3d;}

#sub-menu {position:relative; height:42px; background:#f1f1f1; margin-top:101px; border-bottom:1px solid #ddd;}
.sub-menu {position:relative; margin:0 auto; width:1050px; height:42px; padding-left:50px; background:url('../images/menu/icon_home.gif') 0 0 no-repeat; border-left:1px solid #ddd; z-index:999;}
.sub-menu h2 {position:relative; float:left; width:165px; height:42px; font-size:15px; line-height:42px; font-weight:normal; color:#424242; text-indent:28px; background:url('../images/menu/arrow.gif') 90% 20px no-repeat;border-left:1px solid #ddd;border-right:1px solid #dedede; cursor:pointer;}
.sub-menu .list1 {display:none; position:absolute; float:left; top:43px; left:50px; width:167px; height:42px; /* overflow:hidden; */ background:#fff; z-index:9999;}
.sub-menu .list1.active {display:block;}
.sub-menu .list1 li {font-size:15px; line-height:42px; text-indent:20px; background:#fff; border:1px solid #dedede; border-top:none;}
.sub-menu .list1 li a {display:block; text-decoration:none; color:#424242;}
.sub-menu .list1 li.active a {color:#0a6eb6;}
.sub-menu h2 .arrow {position:absolute; right:15px; font-size:12px;}
.sub-menu .last-path {position:relative; float:left; padding:0 40px 0 30px; min-width:109px; height:42px; font-size:15px; line-height:42px; font-weight:700; color:#000; border-right:1px solid #dedede; border-bottom:1px solid #dedede; background:url('../images/menu/arrow.gif') 90% 20px no-repeat; cursor:pointer;}
.sub-menu .list2 {display:none; position:absolute; float:left; top:43px; left:216px; width:181px; height:42px; /* overflow:hidden; */  background:#fff; z-index:9999;}
.sub-menu .list2.on {display:block;}
.sub-menu .list2 li {font-size:15px; line-height:42px; text-indent:20px; background:#fff; border:1px solid #dedede; border-top:none;}
.sub-menu .list2 li a {display:block; text-decoration:none; color:#424242;}
.sub-menu .list2 li.on a {color:#000;}
.sub-menu.one-page .list2 li:hover a {color:#0a6eb6;}

#status{background:#f1f1f1; border-bottom:1px solid #ddd; border-width:1px 0 1px 0; height:42px; line-height:42px; position:relative; margin-top:101px; z-index:95; }
#status .inner{width:1110px; margin:0 auto; }
#status .inner > li{float:left; width:205px; position:relative; border-right:1px solid #ddd; z-index:81;}
#status .inner > #first {width:165px;}
#status .inner > li:first-child{width:auto; border-left:1px solid #ddd; }
#status .inner > li > a{display:block; height:42px; font-size:15px; line-height:42px; text-indent:28px; color:#424242; text-decoration:none; background:url('../images/menu/arrow.gif') 90% 20px no-repeat;}
#status .inner > li:first-child > a{ padding:0px; width:42px; text-indent:-999em; background:url(../images/menu/icon_home.gif) no-repeat 50% 50%; }
#status .inner > li:last-child > a{color:#000; font-weight:600; }
#status .inner > li > ul{ display:none; }
#status .inner > li:hover > ul{background:#fff; border:1px solid #ddd; border-bottom:none; line-height:15px; display:block; position:absolute; top:42px; left:-1px; width:100%; min-width:98px;}
#status .inner > li:hover > ul > li{width:181px;}
#status .inner > #first:hover > ul > li {width:165px;}
#status .inner > li:hover > ul > li > a{font-size:15px; line-height:42px; text-indent:20px; text-decoration:none; background:#fff; border-bottom:1px solid #dedede; display:block;}
#status .inner > li > ul > li:hover > a,
#status .inner > li > ul > li.active > a{color:#0a6eb6;}

.sub-title {margin:0 auto 40px; width:1100px; height:129px; border-bottom:1px solid #d1d1d1; background:url('../images/title/bg_sub_tt1.jpg') 865px 50px no-repeat;}
.sub-title.business-area {background:url('../images/title/bg_sub_tt2.jpg') 928px 73px no-repeat;}
.sub-title.performance {background:url('../images/title/bg_sub_tt3.jpg') 900px 58px no-repeat;}
.sub-title.support {background:url('../images/title/bg_sub_tt4.jpg') 915px 50px no-repeat;}
.sub-title h2 {padding-top:60px; font-size:35px; line-height:37px; color:#333;}
.sub-title .path {display:none;}
.real-cont {min-height:450px; _height:450px; padding-bottom:100px;}

/* footer */
#footer {position:relative; clear:both; background:#303030;}
.foot-link {margin:0 auto; padding:17px 0; width:1100px;}
.foot-link ul {*zoom:1; float:left; padding-right:27px; background:url('../images/common/line2.gif') 100% 50% no-repeat;}
.foot-link ul:after {content:" "; display:block; clear:both;}
.foot-link ul li {float:left; padding-left:52px; font-size:13px; line-height:16px; background:url('../images/common/line2.gif') 26px 50% no-repeat;}
.foot-link ul li:first-child {padding-left:26px; background-position:0 50%;}
.foot-link ul li a {text-decoration:none; color:#fff;}
.foot-info {clear:both; padding:21px 0; font-size:13px; line-height:20px; color:#999; border-top:1px solid #464646;}
.foot-info address {margin:0 auto; width:1100px; font-style:normal;}
.foot-info address .c-name {font-weight:700;}
.go-top {position:absolute; top:0; left:1450px; display:block; width:51px; height:51px; font-size:13px; line-height:51px; color:#fff; text-decoration:none; text-align:center; background:#9d0620;}
.go-top:hover {text-decoration:none;}

.quick {position:absolute; top:275px; left:50px; left:200px; width:98px; height:464px; border:1px solid #96cad6; border-radius:7px;}
.quick ul li {margin-bottom:35px; font-size:14px; line-height:16px; text-align:center; background:url('../images/common/quick.gif') 50% 0 no-repeat;}
.quick ul li a {display:block; padding-top:45px; text-decoration:none; color:#333;}
.quick ul li.l1 a {margin-top:35px;}
.quick ul li.l2 a {padding-top:50px; background:url('../images/common/quick2.gif') 50% 0 no-repeat;}
.quick ul li.l3 a {padding-top:43px; background:url('../images/common/quick3.gif') 50% 0 no-repeat;}
.quick ul li.l4 {a padding-top:53px; background:url('../images/common/quick4.gif') 50% 0 no-repeat;}