@charset "utf-8";
/* CSS Document */
.center_area { width:1140px; position:relative; margin:0 auto; }
header { position:relative; height:100px; border-bottom:1px solid #ccc; }
header h1 { float:left; margin-top:29px; }
header nav { padding-top:38px; }
header nav ul li { float:left; margin-left:90px; }
/* 로고에 시범운영 없을경우 header nav ul li:first-child { margin-left:106px; } */
header nav ul li:first-child { margin-left:90px; }
header nav ul li a { display:inline-block; font-size:22px; font-weight:400; line-height:24px; color:#333; }
header .top_side_menu { position:absolute; top:40px; right:0; }
header .top_side_menu li { float:left; margin-left:20px; }
header .top_side_menu li a { color:#666; font-size:14px; font-weight:100; }
header .top_side_menu li a:hover { text-decoration:underline; }
header .top_search { }
header .top_search a { display:inline-block; width:20px; height:22px; background:url(../images/icon_search.png) 0 0 no-repeat; margin-left:65px; }
header .top_search_input { position:relative; float:right; margin-top:-4px; }
header .top_search_input input { position:absolute; right:0; top:0; border:1px solid #ccc; height:35px; width:250px; vertical-align:top; padding-left:4px; }
header .top_search_input button { position:absolute; right:0; top:0; height:35px; line-height:28px; width:50px; padding:0 6px; background-color:#0066ff; font-size:14px; border:none; color:#fff; }

header #all_menu { position:absolute; top:100px; border-bottom:1px solid #ccc; z-index:1001; width:100%; background-color:#f2f7ff; overflow:hidden; }
header #all_menu .center_area { position:relative; background:url(../images/bg_all_menu.png) 0 top no-repeat; padding-top:31px; height:160px; }
header #all_menu .center_area p { font-size:30px; font-weight:300; letter-spacing:-1px; line-height:36px; }
header #all_menu .center_area ul { position:absolute; top:31px; }
header #all_menu .center_area ul li a { font-size:14px; color:#666; font-weight:300; line-height:24px; }
header #all_menu .center_area ul li a:hover { text-decoration:underline; }
header #all_menu .center_area ul.all_menu01 { left:253px; } /* 역이동vr 숨김처리로 메뉴 이동 조정 253px > 270px*/
header #all_menu .center_area ul.all_menu02 { left:446px; } /* 역이동vr 숨김처리로 메뉴 이동 조정 458px > 440px*/
header #all_menu .center_area ul.all_menu03 { left:678px; } /* 역이동vr 숨김처리로 메뉴 이동 조정 630px > 620px*/
header #all_menu .center_area ul.all_menu04 { left:848px; } /* 역이동vr 숨김처리로 메뉴 이동 조정 848px > 790px*/
header #all_menu .center_area ul.all_menu05 { left:1003px; }

#main { width:1140px; position:relative; margin:0 auto; }
#main #main_cont { float:left; width:849px; }
#main #main_cont .main_top { position:relative; height:155px; border-bottom:1px solid #ccc; font-size:36px; color:#333; line-height:28px; font-weight:100; letter-spacing:-1px; padding-top:40px; }
#main #main_cont .main_top strong { font-size:72px; color:#ff3300; font-weight:100; }
#main #main_cont .main_top a { position:absolute; top:23px; right:20px; background-color:#0066ff; display:block; width:107px; height:107px; background:#0066ff url(../images/bg_main_data.png) center 78px no-repeat; color:#fff; font-size:20px; font-weight:100; border-radius:100px; text-align:center; padding-top:18px; } 
#main #main_cont .main_visual { position:relative; border-bottom:1px solid #ccc; overflow:hidden; }
#main #main_cont .main_visual strong { font-size:30px; font-weight:100; height:42px; color:#0066ff; letter-spacing:-1px; }
#main #main_cont .main_visual p { font-size:14px; color:#999; font-weight:300; }
#main #main_cont .main_visual .main_visual01 { background:url(../images/main/main_visual01.png) 450px 20px no-repeat; height:204px; padding:25px 28px; }
#main #main_cont .main_visual .main_visual02 { background:url(../images/main/main_visual02.png) 280px 33px no-repeat; height:204px; padding:25px 28px; }
#main #main_cont .main_visual .main_visual03 { background:url(../images/main/main_visual03.png) 360px 0px no-repeat; height:204px; padding:25px 28px; }
#main #main_cont .main_visual .main_visual04 { background:url(../images/main/main_visual04.png) 300px 20px no-repeat; height:204px; padding:25px 28px; }
#main #main_cont .main_visual .main_visual_btn { position:absolute; display:block; background-color:#333; left:25px; top:120px; height:60px; width:60px; border-radius:100px; color:#fff; font-size:16px; text-align:center; padding-top:16px; }
#main #main_cont .main_visual ul { position:absolute; top:20px; right:32px; }
#main #main_cont .main_visual ul li { float:left; margin-left:5px; }
#main #main_cont .main_visual ul li a { display:inline-block; width:12px; height:12px; background:url(../images/main_visual_rolling.png) 0 0 no-repeat; }
#main #main_cont .main_visual ul li a:hover, #main #main_cont .main_visual ul li a.active { background:url(../images/main_visual_rolling_ov.png) 0 0 no-repeat; }
#main #main_cont .board_area>div { position:relative; padding-top:25px; float:left; width:50%; }
#main #main_cont .board_area>div:nth-child(even) { border-left:1px solid #ccc; padding-left:36px; }
#main #main_cont .board_area>div h3 { font-size:20px; font-weight:400; color:#333; letter-spacing:-1px; }
#main #main_cont .board_area .main_more { position:absolute; top:33px; right:37px; color:#999; font-size:14px; font-weight:300; }
#main #main_cont .board_area .board01 ul a {  padding-right: 37px; display: block; }
#main #main_cont .board_area .board01, #main #main_cont .board_area .board02 { border-bottom:1px solid #ccc; height:300px; }
#main #main_cont .board_area .board03, #main #main_cont .board_area .board04 { height:300px; }
#main #main_cont .board_area .board01 ul { margin-top:22px; }
#main #main_cont .board_area .board01 ul li { height:70px; }
#main #main_cont .board_area .board01 ul li a img { float:left; margin-right:20px; }
#main #main_cont .board_area .board01 ul li a h4 { font-size:16px; color:#333; height:26px; font-weight:400; }
#main #main_cont .board_area .board01 ul li a p { font-size:14px; color:#666; font-weight:300; text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;/* 라인수 */-webkit-box-orient: vertical;word-wrap: break-word;height: 34px;line-height: 16px;overflow: hidden;}
#main #main_cont .board_area .board02 ul { position:relative; }
#main #main_cont .board_area .board02 h3 { height:40px; }
#main #main_cont .board_area .board02 ul > li {} 
#main #main_cont .board_area .board02 ul > li > a { float:left; display:block; width:190px; height:40px; background-color:#fff; border:1px solid #ccc; margin-left:-1px; text-align:center; padding-top:5px; font-size:16px; font-weight:400; letter-spacing:-1px; }
#main #main_cont .board_area .board02 ul > li > a:hover, #main #main_cont .board_area .board02 ul > li.active > a { text-decoration:none; color:#fff; background-color:#0066ff; border:1px solid #0066ff; }
#main #main_cont .board_area .board02 ul ol { position:absolute; top:50px; left:16px; }
#main #main_cont .board_area .board02 ul ol li a {display: inline-block;font-size: 16px;color: #666;letter-spacing: -0.5px;font-weight: 300;width: 360px;line-height: 30px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#main #main_cont .board_area .board03 ul { position:relative; }
#main #main_cont .board_area .board03 ul li { float:left; margin-left:25px; }
#main #main_cont .board_area .board03 ul li:first-child { margin-left:0; }
#main #main_cont .board_area .board03 ul li a { display:inline-block; height:34px; font-size:16px; color:#666; border-bottom:3px solid #fff; line-height:30px; }
#main #main_cont .board_area .board03 ul li.active>h3 a, #main #main_cont .board_area .board03 ul li>h3 a:hover { border-bottom:3px solid #0066ff; text-decoration:none; color:#333; }
#main #main_cont .board_area .board03 ul li li { margin-left:0; }
#main #main_cont .board_area .board03 ul li li a {display: inline-block;font-size: 16px;color: #666;letter-spacing: -0.5px;font-weight: 300;width: 390px;line-height: 30px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;border:none;}
#main #main_cont .board_area .board03 ul li li a:hover { text-decoration:underline; }
#main #main_cont .board_area .board03 ul li.active li a { border:none; }
#main #main_cont .board_area .board03 ul li ul { position:absolute; left:0; top:60px; }
#main #main_cont .board_area .board03 .main_more { top:3px; font-size:14px; font-weight:300; color:#999; }
#main #main_cont .board_area div a:hover { text-decoration:underline; }

#main #main_cont .board_area .board04  { position:relative; }
#main #main_cont .board_area .social_list { position:absolute; right:0; top:33px; }
#main #main_cont .board_area .social_list li { float:left; margin-left:6px; text-align:center;}
#main #main_cont .board_area .social_cont { padding:0; margin-top:15px; width:100%; height:148px; }

#main #main_cont .board_area .social_list .sns_list { position:absolute; right:0; top:20px; border:1px solid #ccc; width:170px; height:170px; padding:10px 10px; background-color:#fff; overflow:auto; z-index:10; }
#main #main_cont .board_area .social_list .sns_list li {clear:both;}

#main aside { float:right; width:250px; height:960px; background-color:#0066ff; overflow:hidden; color:#fff; padding:28px 30px; }
#main aside a { color:#fff; }
#main aside a:hover { text-decoration:underline; }
#main aside .top li { position:relative; font-size:24px; font-weight:100; }
#main aside .top li a { position:absolute; top:0; right:0; font-size:26px; font-weight:bold; }
#main aside .middle { clear:both; margin-top:28px; }
#main aside .middle li { height:110px; border-bottom:1px solid #4d94ff; background-position:15px 31px; background-repeat:no-repeat; padding:15px 6px 0 66px; }
#main aside .middle li:last-child { border-bottom:none; }
#main aside .middle li h5 { font-size:18px; font-weight:400; }
#main aside .middle li p { position:relative; font-size:12px; color:#b8d4ff; font-weight:100; }
#main aside .middle li p a { position:absolute; top:0; right:0; font-size:14px; font-weight:bold; }
#main aside .middle li.aside01 { background-image:url(../images/bg_side01.png); }
#main aside .middle li.aside02 { background-image:url(../images/bg_side02.png); }
#main aside .middle li.aside03 { background-image:url(../images/bg_side03.png); }
#main aside .middle li.aside04 { background-image:url(../images/bg_side04.png); }
#main aside .middle li.aside05 { background-image:url(../images/bg_side05.png); }
#main aside .middle li.aside06 { background-image:url(../images/bg_side06.png); }
#main aside .aside_bottom { clear:both; margin-top:28px; background-color:#0033cc; padding:20px 23px; }
#main aside .aside_bottom h5 { color:#3399ff; font-size:24px; font-weight:100; letter-spacing:-1px; height:42px; }
#main aside .aside_bottom h5 strong { font-weight:400; }
#main aside .aside_bottom li a { font-size:12px; font-weight:100; letter-spacing:-0.5px; line-height:24px; }

#sub { width:1140px; position:relative; margin:0 auto; background:url(../images/sub/bg_sub_top.png) right 0 no-repeat; min-height:650px; }
#sub .left { float:left; width:200px; height:auto; overflow:hidden; }
#sub .left h2 { background:url(../images/sub/sub_side_top.png) 0 0 no-repeat; height:118px; color:#fff; text-align:center; padding-top:50px; font-size:30px; font-weight:400; }
#sub .left ul { padding-top:25px; padding-left:6px; }
#sub .left ul li a { display:block; font-size:16px; font-weight:100; color:#333; height:45px; width:100%; }
#sub .left ul li a:hover, #sub .left ul li.active a { background:url(../images/sub/bg_sub_sidemenu.png) 177px 7px no-repeat; color:#0066ff; }

#sub .left ul li .depth2 ul {padding:0 0 20px 10px;}
#sub .left ul li .depth2 ul li a {height:30px;color:#555; font-size:14px; background:none;}
#sub .left ul li .depth2 ul li a:hover, #sub .left ul li .depth2 ul li.active a {color:#0066ff; background:none;}

#sub .sub_cont { float:right; width:940px; border-left:1px solid #ccc; padding-left:35px; min-height:650px;padding-bottom: 35px; }
#sub .sub_cont .sub_cont_top { height:118px; padding-top:23px; }
#sub .sub_cont .sub_cont_top ul { height:36px; }
#sub .sub_cont .sub_cont_top ul li { float:left; background:url(../images/sub/bg_sub_top_indexing.png) 0 center no-repeat; padding-left:14px; }
#sub .sub_cont .sub_cont_top ul li:first-child { background:none; padding-left:0; }
#sub .sub_cont .sub_cont_top ul li a { margin-right:7px; color:#999; font-size:14px; font-weight:300; }
#sub .sub_cont .sub_cont_top h3 { clear:both; font-size:30px; font-weight:500; color:#555; }


/* 20191104_KTK */
/* TOP메뉴 추가 */
#ab_util_wrap {clear:both; width:100%; display:inline-block; height:30px; background-color:#eee; border-bottom:solid 1px #ccc;}
#ab_util_box {width:1140px; margin:0 auto; height:30px;}
#ab_util_box li {float:left; list-style:none;}
#ab_util_box li a {display:block; height:30px; line-height:30px; font-size:12px;}
#ab_util_box .ab_util_mn li a {padding:0 15px; color:#000; border-right:solid 1px #ccc;}
#ab_util_box .indp_site {float:right;}
#ab_util_box .indp_site li a {padding:0 20px; color:#fff; background-color:#555; border-left:solid 1px #ccc;}


.Banner { width:1140px; height:90px; border-top:#ccc solid 1px; clear:both; padding:22px 0 0 120px; position:relative; background:#fff; margin:0 auto;}
.Banner h2 { position:absolute; left:22px; top:26px; font-family:"나눔고딕EB";font-size:13px; color:#777;}
.Banner ul { width:97%;}
.Banner li { display:inline-block; margin:0 11px;}
.Banner .Banner_forward { display:inline-block; position:absolute; left:100px; top:35px; text-indent:-1000px; overflow:hidden; background:url(../images/banner/banner_forward.png) no-repeat center center; width:20px; height:20px;}
.Banner .Banner_next { display:inline-block; position:absolute; right:10px; top:35px; text-indent:-1000px; overflow:hidden; background:url(../images/banner/banner_next.png) no-repeat center center; width:20px; height:20px;}
.Banner_Control { position:absolute; left:25px; top:50px; background:#777; width:42px; height:18px; border-radius:10px; text-align:center; box-sizing:border-box; padding-top:1px;}
.Banner_Control a { text-indent:-1000px !important; display:inline-block; }
.Banner_Control .Banner_stop,.Banner_Control .Banner_play {width:100%; height:15px;}
.Banner_Control .Banner_stop { background:url(../images/banner/banner_stop.png) no-repeat center center;}
.Banner_Control .Banner_play { background:url(../images/banner/banner_play.png) no-repeat center center;}

footer { position:relative; border-top:1px solid #ccc; padding-bottom:40px; clear: both;}
footer a:hover { text-decoration:underline; }
footer ul { padding-top:24px; }
footer li { float:left; background:url(../images/bg_footer_line.png) 0 center no-repeat; padding:0 15px; }
footer li:first-child { background:none; padding-left:0; }
footer p { padding-top:21px; clear:both; font-size:12px; color:#666; line-height:20px; }
footer .footer_right { position:absolute; top:20px; right:0; text-align:right; }
footer .footer_right select { height:30px; border:1px solid #ccc; padding:4px; width:220px; }
footer .footer_right button { background-color:#fff; border:1px solid #ccc; padding:4px 10px; margin-left:-1px; height:30px; }
footer .footer_right .social_area { clear:both; padding-top:15px; }

.error_content * {margin:0;padding:0;}
.error_content img{border:none;}
.error_content em {font-style:normal;}
.error_content {width:410px; margin:80px auto 0; padding:120px 0 0 0; font-size:12px; text-align:left; background:url(../images/error/bg_thumb.png) no-repeat center top; white-space:nowrap;}
.error_content p {margin:0;}
.error_content .error_desc { margin-bottom:10px; overflow:hidden; text-align:center; font-size:30px; font-weight:400; }
.error_content .error_desc strong { color:#0066ff; font-weight:500; }
.error_content .error_desc2 {margin-bottom:11px; padding-bottom:7px; color:#888; line-height:18px; border-bottom:1px solid #eee;}
.error_content .error_desc3 {clear:both; color:#888;}
.error_content .error_desc3 a {color:#004790; text-decoration:underline;}
.error_content p.btn{margin:29px 0 100px; text-align:center;}

.btn {padding: 6px 12px;border-radius: 6px;-moz-border-radius: 6px;-o-border-radius: 6px;-webkit-border-radius: 6px;line-height: 13px;}
.green_btn { color:#ffffff; border:1px solid #336600; background:#339900;}
.green_btn:hover { background:#336600; }
.blue_btn {color: #ffffff;border: 1px solid #003399;background: #3366cc;}
.blue_btn:hover {background: #003399;}
.white_btn {color: #555555;border: 1px solid #dddddd;background: #ffffff;}
.white_btn:hover {color: #333333;background: #f7f7f7;}
.gray_btn {color: #f2f2f2;border: 1px solid #333333;background: #555555;}
.gray_btn:hover {background: #333333;color: #ffffff;}
.darkgray_btn {color: #ffffff;border: none;background: #000000;}
.darkgray_btn:hover {background: #333333;}
.round_btn {margin-top: 10px;margin-left: 3px;height: 80px;width: 80px;color: #444444;background: #eaeaea;border: 1px solid #cccccc;border-radius: 60px;-moz-border-radius: 6px;-o-border-radius: 60px;-webkit-border-radius: 60px;}
.round_btn:hover {border: 1px solid #515151;background: #515151;color: #ffffff;}
.btn_small{padding: 3px 6px 2px 6px;font-size: 10px;}

.quadrangle { border-radius:0; padding:8px 20px; height:34px; margin-left:5px; }
.w100 { width:100%; }
.paL { position:absolute; left:0; }
.marginT10 { margin-top:10px; }
.marginT20 { margin-top:20px; }
.marginT40 { margin-top:40px; }
.marginL20 { margin-left:20px; }
.marginL30 { margin-left:30px; }
.marginL40 { margin-left:40px; }

/* 서브메뉴 공용 */
.sub_h6 {font-size: 18px;}
.sub_h7 {font-size: 16px;font-weight: normal;background: url(../images/comn/sub_blet.png) 0 50% no-repeat;line-height: 19px;display: block;height: 30px;line-height: 30px;padding-left: 22px;margin-top: 2px;margin-bottom: 2px;}
.sub_h7 > span {font-size: 12px;float: right;color: #ff0000;}

/* 2017.09.08 추가 - 김유미 */
#sub_contents { padding-top:25px; }
#sub_contents h4 { font-size:20px; color:#333; line-height:20px; margin-bottom:25px; }
#sub_contents h4:before { content:''; display:inline-block; width:4px; height:18px; background:#06f; vertical-align:middle; margin-right:7px; margin-top:-4px; }

#sub_contents ul.Type1 { font-size:16px; margin-bottom:50px; font-weight:300;}
#sub_contents ul.Type1 li { margin-bottom:10px; padding-left:12px; position:relative;}
#sub_contents ul.Type1 li:before { content:''; display:inline-block; width:5px; height:1px; background:#666; position:absolute; left:2px; top:10px;}
#sub_contents button.Btn_Go_Form { background:#036 url(../images/sub/btn_go_form.png) no-repeat 13px center; color:#fff; text-align:center; float:right; padding:0 10px; padding-left:35px; border:none; height:33px; line-height:33px; margin-top:-50px;} 
#sub_contents button.Btn_Go_Form:hover { background-color:#039;}

#sub_contents .ImgFlow { background:#fff; text-align:center; padding:30px 0; border:#ddd solid 1px; margin-bottom:30px; box-shadow:0 3px 0 #eee; }

#sub_contents ol.Type2 { font-size:16px; margin-bottom:50px; font-weight:300;}
#sub_contents ol.Type2 li { margin-bottom:10px; padding-left:55px; position:relative; margin-bottom:30px; }
#sub_contents ol.Type2 li .Num { display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; background:#f5f5f5; border:#ddd solid 1px; border-radius:20px; position:absolute;  left:0; top:-8px; font-size:14px;}


#sub_contents ul.Type3 { background:#f4f4f4; border:1px solid #dddddd; padding:10px 18px; margin-bottom:40px; }
#sub_contents ul.Type3 li { font-size:16px; background:url(../images/sub/sub_blet.png) 0 6px no-repeat; padding-left:8px; }
#sub_contents ul.Type3 ul { padding-top:20px; }

.api_bg {background: url(../images/sub/sub_api.png) no-repeat right 30px; height:550px;}
/*popup*/
.popup { position:absolute; background:#ffffff url(../images/comn/popup_title.png) 0 0 no-repeat; border:2px solid #3366cc; z-index:2;  box-shadow: 4px 4px 4px #dddddd; }
.popup h4 { color: #ffffff !important;font-size: 15px !important; padding:5px 30px; font-weight:normal; }
.popup .popup_body { padding:20px; }
.popup .body { padding-top:0px; }
.popup .popup_grid_btn_add {
    position: absolute;
    top: 86px;
    left: 819px;
    border: 1px solid #b9b9b9;
    color: #475577;
    height: 31px;
    width: 32px;
    -webkit-border-radius: inherit;
    background: linear-gradient(to bottom,  #f8f8f8 0%,#ededed 100%);
}
.popup .popup_grid_btn_del {
    position: absolute;
    top: 86px;
    left: 850px;
    text-align: center;
    padding-left: 7px;
	border: 1px solid #b9b9b9;
    color: #475577;
    height: 31px;
    width: 32px;
    -webkit-border-radius: inherit;
    background:linear-gradient(to bottom,  #f8f8f8 0%,#ededed 100%);
}