@charset "UTF-8";

@font-face {
    font-family: 'NanumBarunGothic';
    src:url(/_font/s/NanumBarunGothicWeb.eot);
    src:url(/_font/s/NanumBarunGothicWeb.eot?#iefix) format('embedded-opentype'),
        url(/_font/s/NanumBarunGothicWeb.woff) format('woff'),
        url(/_font/s/NanumBarunGothicWeb.ttf) format('truetype');
}

/* 스킨 수정 */
div.jwxe_board table.type_board thead th{border-top:2px solid #333 !important;}
div.jwxe_board div.board_view div.board_title{border-top:2px solid #333 !important;}
div.jwxe_board div.board_search{margin-top:30px;}
div.jwxe_board ul.gallery_list li div.ratio_box a span.title{height:50px !important; line-height:50px !important; background-color:rgba(0,0,0,0.7) !important; font-size:18px !important; opacity:1 !important; filter:alpha(opacity=100) !important;}

/* Default Setting */
html, body{height:100%;}
html, body, h1, h2, h3, h4, h5, h6, p, dt, dd, dl, ul, li, span, div, table, td, input, fieldset, textarea, select, a, img{font-family:'NanumBarunGothic','Malgun Gothic',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif; padding:0; margin:0;}
body{font-size:14px; color:#333; overflow-y:auto;}
li{list-style:none;}
img{vertical-align:top; border:none;}
a{color:#333; text-decoration:none;}
table{border-collapse:collapse;}
.hidden{width:0; height:0; overflow:hidden; font-size:0;}
.mobile{display:none;}
.mobile_img{display:none;}

/* Common Layout */
header{background:url(/_res/cleanenergy/img/bg_top_line.png) repeat-x 50% 40px;}
header > div{width:100%; max-width:1080px; height:130px; margin:0 auto; position:relative; box-sizing:border-box;}
header > div > div{position:absolute; top:0; left:0; overflow:hidden;}
header > div > div a{display:block; height:40px; line-height:40px; padding:0 25px; float:left; font-size:15px; color:#676767; background-color:#f4f4f4;}
header > div > div a:first-child{color:#277276; background-color:#fff; border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1;}
header > div > ul{position:absolute; top:0; right:0; overflow:hidden; z-index:101;}
header > div > ul li{float:left;}
header > div > ul li a{display:block; height:40px; line-height:40px; padding:0 20px; font-size:13px; color:#919191; background:url(/_res/cleanenergy/img/icon_top_login.png) no-repeat 0 10px;}
header > div > ul li:first-child a{background:url(/_res/cleanenergy/img/icon_top_home.png) no-repeat 0 10px;}
header > div h1{padding-top:70px; float:left;}
header > div h1 a{display:block; width:268px; height:38px; text-indent:-9999px; background:url(/_res/cleanenergy/img/logo.png) no-repeat 50% 50%; background-size:268px auto;}
header > div a.gnb_handle{
    position:absolute;
    top:20px;
    right:20px;
    width:40px; 
    height:40px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
header > div a.gnb_handle span{
    display:block;
    width:40px;
    height:4px;
    background-color:#b3b3b3;
    position:absolute;
    top:50%;
    left:0;
    margin-top:-2.5px;
    text-indent:-9999px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
header > div a.gnb_handle:before{
    display:block; 
    content:""; 
    width:40px; 
    height:4px; 
    background-color:#b3b3b3; 
    position:absolute; 
    top:0; 
    left:0;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
header > div a.gnb_handle:after{
    display:block; 
    content:""; 
    width:40px; 
    height:4px; 
    background-color:#b3b3b3; 
    position:absolute; 
    bottom:0; 
    left:0;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
header > div a.gnb_handle.active span{opacity:0;}
header > div a.gnb_handle.active:before{
    top:18px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}
header > div a.gnb_handle.active:after{
    bottom:18px;
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
header > div nav{padding-top:40px; float:right; position:relative; z-index:100;}
header > div nav > ul{height:90px;}
header > div nav > ul > li{float:left; position:relative;}
header > div nav > ul > li > a{display:block; height:90px; line-height:90px; padding:0 50px; font-size:18px;}
header > div nav > ul > li.active > a{color:#18a2a8;}
header > div nav > ul > li > ul{display:none; width:100%; position:absolute; top:88px; left:0; border-top:2px solid #18a2a8;}
header > div nav > ul > li > ul li{opacity:0; filter:alpha(opacity=0); position:relative; top:-10px;}
header > div nav > ul > li > ul li a{
    display:block; 
    height:50px; 
    padding:0 20px; 
    line-height:50px; 
    font-size:17px; 
    text-align:center;
    background-color:#f1f3f8;
    box-sizing:border-box;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
header > div nav > ul > li > ul li:first-child a{border-top:none;}
header > div nav > ul > li > ul li a:hover, header > div nav > ul > li > ul li a:focus{background-color:#e8eaee;}

#quick_wrap{width:100%; background-color:#242424; border-top:1px solid #444;}
#qnb{width:100%; max-width:1080px; margin:0 auto;}
#qnb > ul{height:50px; border-left:1px solid #444; border-right:1px solid #444;}
#qnb > ul > li{width:25%; float:left; position:relative; background:url(/_res/counsel/img/bg_qnb_arrow.png) no-repeat 95% 50%;}
#qnb > ul > li > a{display:block; height:50px; line-height:52px; padding-left:25px; font-size:16px; color:#9e9e9e; border-left:1px solid #444;}
#qnb > ul > li:first-child > a{border-left:none;}
#qnb > ul > li > ul{display:none; width:100%; height:400px; overflow-y:auto; position:absolute; bottom:50px; left:0; z-index:2; border:1px solid #444;}
#qnb > ul > li.type_04 > ul{height:160px;}
#qnb > ul > li.active{background:url(/_res/counsel/img/bg_qnb_arrow_on.png) no-repeat 95% 50%;}
#qnb > ul > li.active > ul{display:block;}
#qnb > ul > li > ul > li > a{display:block; height:40px; line-height:40px; padding:0 20px; font-size:16px; color:#9e9e9e; background-color:#242424;}
#qnb > ul > li > ul > li > a:hover, #qnb > ul > li > ul > li > a:focus{background-color:#3c3c3c; color:#fff;}

footer > div{width:100%; max-width:1080px; margin:0 auto; padding:30px 0; overflow:hidden;}
footer > div address{float:left; padding-right:10px; font-size:13px; font-style:normal; color:#5c5c5c;}
footer > div address span:before{display:inline-block; content:"|"; padding:0 10px;}
footer > div p{font-size:13px; color:#5c5c5c;}

/* Main Contents */
#main_contents a.more{display:block; width:18px; height:18px; position:absolute; background:url(/_res/cleanenergy/img/bg_main_board_more.png) no-repeat 50% 50%; background-size:18px 18px; text-indent:-9999px;}
#visual_section{position:relative; overflow:hidden;}
#visual_bg{
    position:absolute; 
    top:50%; 
    left:50%;
    margin:-500px 0 0 -1000px;
    z-index:-1;
    -webkit-transition:all 60s;
    -moz-transition:all 60s;
    -o-transition:all 60s;
    -ms-transition:all 60s;
    transition:all 60s;
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -o-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);
}
#visual_bg.active{
    -webkit-transform:scale(1.2) rotate(10deg);
    -moz-transform:scale(1.2) rotate(10deg);
    -o-transform:scale(1.2) rotate(10deg);
    -ms-transform:scale(1.2) rotate(10deg);
    transform:scale(1.2) rotate(10deg);
}
#visual_contents{display:table; table-layout:fixed; width:100%; max-width:1080px; margin:0 auto; overflow:hidden; padding:110px 0; box-sizing:border-box;}
#main_left{display:table-cell; width:420px; position:relative; vertical-align:top;}
#main_left > div{overflow:hidden;}
#main_left > div *{
    -webkit-transform:translateX(-100%);
    -moz-transform:translateX(-100%);
    -o-transform:translateX(-100%);
    -ms-transform:translateX(-100%);
    transform:translateX(-100%);
}
#main_left > div p{
    -webkit-transition:all 1s;
    -moz-transition:all 1s;
    -o-transition:all 1s;
    -ms-transition:all 1s;
    transition:all 1s;
}
#main_left > div p img{width:280px;}
#main_left > div h2{
    padding-top:20px;
    -webkit-transition:all 1s 0.7s;
    -moz-transition:all 1s 0.7s;
    -o-transition:all 1s 0.7s;
    -ms-transition:all 1s 0.7s;
    transition:all 1s 0.7s;
}
#main_left > div h2 img{width:355px;}
#main_left > div.active *{
    -webkit-transform:translateX(0);
    -moz-transform:translateX(0);
    -o-transform:translateX(0);
    -ms-transform:translateX(0);
    transform:translateX(0);
}
#main_left > ul{height:125px; position:absolute; left:0; bottom:0;}
#main_left > ul li{position:absolute; top:0;}
#main_left > ul li.type_01{left:0;}
#main_left > ul li.type_02{left:110px;}
#main_left > ul li.type_03{left:220px;}
#main_left > ul li a{display:block; width:125px; height:125px; border-radius:125px; padding-top:20px; box-sizing:border-box;}
#main_left > ul li.type_01 a{background-color:rgba(5, 165, 173, 0.6);}
#main_left > ul li.type_02 a{background-color:rgba(31, 74, 196, 0.6);}
#main_left > ul li.type_03 a{background-color:rgba(15, 13, 53, 0.6);}
#main_left > ul li a span{display:block; font-size:14px; color:#fff; text-align:center;}
#main_left > ul li a span.icon{width:50px; height:50px; margin:0 auto 10px auto; background-image:url(/_res/cleanenergy/img/main_quick_01.png); background-repeat:no-repeat;}
#main_left > ul li.type_01 a span.icon{background-position:0 0;}
#main_left > ul li.type_02 a span.icon{background-position:-50px 0;}
#main_left > ul li.type_03 a span.icon{background-position:-100px 0;}
#main_right{display:table-cell; vertical-align:top;}
#right_top{overflow:hidden;}
#right_top div.recent_notice{width:440px; height:290px; padding:35px; float:left; position:relative; background-color:#fff; box-sizing:border-box;}
#right_top div.recent_notice h3{display:inline-block; padding-bottom:10px; border-bottom:2px solid #2b58cc; font-size:20px; font-weight:normal;}
#right_top div.recent_notice > a.more{top:35px; right:35px;}
#right_top div.recent_notice div.board{padding-top:25px;}
#right_top div.recent_notice div.board ul li{margin-top:15px;}
#right_top div.recent_notice div.board ul li:first-child{margin-top:0;}
#right_top div.recent_notice div.board ul li a span{display:block; font-size:16px;}
#right_top div.recent_notice div.board ul li a span.subject{margin-bottom:5px;}
#right_top div.recent_notice div.board ul li a span.date{color:#666;}
#right_top div.introduce{width:220px; float:left; position:relative; overflow:hidden;}
#right_top div.introduce > div a{display:block; height:290px; padding:30px; background:url(/_res/cleanenergy/img/bg_main_introduce.jpg) no-repeat 50% 50%; background-size:cover; box-sizing:border-box;}
#right_top div.introduce > div a h3{font-size:18px; font-weight:normal; color:#fff;}
#right_top div.introduce > div a p{padding-top:15px;}
#right_top div.introduce > div a:after{display:block; content:""; width:93px; height:20px; background:url(/_res/cleanenergy/img/bg_main_introduce_arrow.png) no-repeat 50% 50%; background-size:93px 20px; position:absolute; bottom:65px; right:25px;}
#right_top div.introduce > ul{width:50%; float:left;}
#right_top div.introduce > ul li{width:100%; height:0; padding-bottom:50%; position:relative; overflow:hidden;}
#right_top div.introduce > ul li a{display:block; width:100%; height:100%; position:absolute; top:0; left:0;}
#right_top div.introduce > ul li.type_01 a{background-color:#403f51;}
#right_top div.introduce > ul li.type_02 a{background-color:#545b75;}
#right_top div.introduce > ul li a span{display:block;}
#right_top div.introduce > ul li a span.text{position:absolute; top:50%; left:25px; margin-top:-8px; font-size:14px; color:#fff;}
#right_top div.introduce > ul li a span.icon{width:40px; height:40px; position:absolute; top:50%; right:25px; margin-top:-20px; background-image:url(/_res/cleanenergy/img/main_quick_02.png); background-repeat:no-repeat; background-size:80px 40px;}
#right_top div.introduce > ul li.type_01 a span.icon{background-position:0 0;}
#right_top div.introduce > ul li.type_02 a span.icon{background-position:-40px 0;}

#right_bottom{overflow:hidden;}
#right_bottom div.quick_01{width:220px; float:left;}
#right_bottom div.quick_01 ul li a{display:block; height:90px; line-height:90px; padding:0 30px; position:relative;}
#right_bottom div.quick_01 ul li.type_01 a{background-color:#403f51;}
#right_bottom div.quick_01 ul li.type_02 a{background-color:#545b75;}
#right_bottom div.quick_01 ul li a span{display:block; font-size:18px; color:#fff;}
#right_bottom div.quick_01 ul li a span.icon{width:45px; height:45px; position:absolute; top:50%; right:30px; margin-top:-22.5px; background-image:url(/_res/cleanenergy/img/main_quick_02.png); background-repeat:no-repeat; background-size:90px 45px;}
#right_bottom div.quick_01 ul li.type_01 a span.icon{background-position:0 0;}
#right_bottom div.quick_01 ul li.type_02 a span.icon{background-position:-45px 0;}
#right_bottom div.quick_02{width:440px; float:left;}
#right_bottom div.quick_02 ul{overflow:hidden;}
#right_bottom div.quick_02 ul li{width:50%; float:left;}
#right_bottom div.quick_02 ul li a{display:block; height:180px; padding:30px; box-sizing:border-box;}
#right_bottom div.quick_02 ul li.type_01 a{background:#4660aa url(/_res/cleanenergy/img/bg_main_contents_03.png) no-repeat 103% 103%; background-size:74px auto;}
#right_bottom div.quick_02 ul li.type_02 a{background:#727681 url(/_res/cleanenergy/img/bg_main_contents_04.png) no-repeat 103% 103%; background-size:78px auto;}
#right_bottom div.quick_02 ul li a span{display:block; color:#fff;}
#right_bottom div.quick_02 ul li a span.text{font-size:18px;}
#right_bottom div.quick_02 ul li a span.desc{font-size:14px; line-height:150%; padding-top:20px;}

#recent_gallery{width:100%; max-width:1080px; margin:0 auto; padding:80px 0; position:relative; box-sizing:border-box;}
#recent_gallery h3{font-size:24px; font-weight:normal; text-align:center; padding-bottom:40px;}
#recent_gallery a.more{top:85px; right:0;}
#recent_gallery div.board ul.gallery_slide{overflow:hidden;}
#recent_gallery div.board ul.gallery_slide li{float:left; margin-left:24px; position:relative;}
#recent_gallery div.board ul.gallery_slide li:first-child{margin-left:0;}
#recent_gallery div.board ul.gallery_slide li a{display:block; width:252px; height:200px; border:1px solid #ddd; overflow:hidden; box-sizing:border-box; background-position:50% 50%; background-size:cover; position:relative;}
#recent_gallery div.board ul.gallery_slide li a div.info{width:100%; position:absolute; left:0; bottom:0;}
#recent_gallery div.board ul.gallery_slide li a div.info span{display:block; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center;}
#recent_gallery div.board ul.gallery_slide li a div.info span.title{height:50px; line-height:50px; font-size:18px; color:#fff; background-color:rgba(0,0,0,0.7); box-sizing:border-box; padding:0 15px;}
#recent_gallery div.board ul.gallery_slide li a div.info span.date{display:none;}

/* 서브 레이아웃 */
#sub_visual_wrap{text-align:center;}
#sub_visual_wrap h2{padding:55px 0 10px 0; font-size:35px; font-weight:normal; color:#000;}
#sub_visual_wrap p.desc{font-size:19px;}
#sub_visual_wrap > div > div{width:100%; max-width:1080px; margin:0 auto; box-sizing:border-box;}
#sub_visual_wrap div.visual_01{height:250px; background:url(/_res/cleanenergy/img/bg_sub_visual_01.jpg) no-repeat 50% 0;}
#sub_visual_wrap div.visual_02{height:250px; background:url(/_res/cleanenergy/img/bg_sub_visual_02.jpg) no-repeat 50% 0;}
#sub_visual_wrap div.visual_03{height:250px; background:url(/_res/cleanenergy/img/bg_sub_visual_03.jpg) no-repeat 50% 0;}
#sub_visual_wrap div.visual_04{height:250px; background:url(/_res/cleanenergy/img/bg_sub_visual_04.jpg) no-repeat 50% 0;}

#snb_wrap{margin-top:-65px;}
#snb_wrap h3{display:none; background:rgba(0,0,0,0.7); margin-top:-50px; position:relative;}
#snb_wrap h3 a{display:block; height:50px; line-height:50px; font-size:18px; font-weight:normal; color:#fff; text-align:center;}
#snb_wrap h3 div.arrow{width:20px; height:20px; margin-top:-10px; position:absolute; top:50%; right:15px;}
#snb_wrap h3 div.arrow span{
    display:block; 
    width:12px;
    height:1px; 
    background-color:#fff;
    position:absolute;
    top:10px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    transition:all 0.3s;
}
#snb_wrap h3 div.arrow span.left{
    left:0;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}
#snb_wrap h3 div.arrow span.right{
    right:0;
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
#snb_wrap.active h3{background:#42b6ae;}
#snb_wrap.active h3 div.arrow span.left{
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
#snb_wrap.active h3 div.arrow span.right{
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}
#snb_wrap ul{width:100%; max-width:1080px; margin:0 auto; display:table; table-layout:fixed;}
#snb_wrap ul li{display:table-cell; border-right:1px solid transparent;}
#snb_wrap ul li:last-child{border-right:none;}
#snb_wrap ul li a{display:block; width:100%; height:65px; line-height:65px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:21px; text-align:center; background:rgba(255,255,255,0.6); box-sizing:border-box;}
#snb_wrap ul li.active a{background:rgba(0,0,0,0.7); color:#fff;}

#sub_contents{width:100%; max-width:1080px; margin:0 auto; padding:75px 0; box-sizing:border-box;}
#contents_wrap{padding-top:60px;}
#contents_wrap div.section{padding-top:80px;}
#contents_wrap div.section:first-child{padding-top:0;}
#contents_wrap div.section p{font-size:17px; color:#333; line-height:170%; word-break:keep-all;}
#contents_wrap h4.title{margin-bottom:40px; font-size:25px; font-weight:normal;}
#contents_wrap h4.title:after{display:block; content:""; width:40px; height:3px; margin-top:8px; background-color:#a4a4a4;}
#title_wrap{overflow:hidden; padding-bottom:20px; border-bottom:1px solid #d1d1d1;}
#title_wrap h3{float:left; font-size:31px; font-weight:normal; color:#333;}
#title_wrap div.path{padding-top:15px; float:right;}
#title_wrap div.path ul{overflow:hidden;}
#title_wrap div.path ul li{float:left; font-size:13px; color:#919191;}
#title_wrap div.path ul li:before{display:block; padding:0 10px; float:left; content:">"; font-size:13px; color:#919191; letter-spacing:-5px;}
#title_wrap div.path ul li:first-child:before{display:none;}

/* 탭 메뉴(페이징) */
ul.tabs{overflow:hidden; height:inherit !important;}
ul.tabs li{float:left;}
ul.tabs li a{display:block; height:65px; line-height:65px; font-size:21px; text-align:center; border-top:1px solid #c7c7c7; border-right:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7; background-color:#fff; box-sizing:border-box;}
ul.tabs li a:hover, ul.tabs li a:focus{background-color:#e2e2e2;}
ul.tabs li.active a{line-height:63px; border-bottom:4px solid #1ab4bb;}
ul.tabs li.active a span{color:#009bfa; padding-bottom:1px; border-bottom:1px solid #009bfa;}
ul.tabs li:first-child a{border-left:1px solid #c7c7c7;}

/* 목록형 */
ul.list_dash li{margin-top:10px; padding-left:15px; line-height:150%; font-size:17px; word-break:keep-all; background:url(/_res/cleanenergy/img/bullet_list_dash.png) no-repeat 0 10px;}
ul.list_dash li:first-child{margin-top:0;}
ul.list_dot li{margin-top:10px; padding-left:10px; line-height:150%; font-size:17px; word-break:keep-all; background:url(/_res/cleanenergy/img/bullet_list_dot.png) no-repeat 0 8px;}
ul.list_dot li:first-child{margin-top:0;}

/* 테이블 */
table.type_horizontal{width:100%; table-layout:fixed; border-top:2px solid #444;}
table.type_horizontal thead tr th{padding:15px; font-size:19px; border:1px solid #d4d4d4; font-weight:normal; text-align:center; background-color:#f8f8f8;}
table.type_horizontal thead tr th:first-child{border-left:none;}
table.type_horizontal thead tr th:last-child{border-right:none;}
table.type_horizontal tfoot tr th{padding:15px; font-size:19px; color:#000; border:1px solid #d4d4d4; font-weight:normal; text-align:center; background-color:#f8f8f8;}
table.type_horizontal tfoot tr th:first-child{border-left:none;}
table.type_horizontal tfoot tr th:last-child, table.type_horizontal tfoot tr td:last-child{border-right:none;}
table.type_horizontal tfoot tr td{padding:15px; font-size:17px; color:#000; border:1px solid #d4d4d4; text-align:center;}
table.type_horizontal tbody tr td{padding:15px; font-size:17px; color:#666; line-height:160%; border:1px solid #d4d4d4; text-align:center; word-break:keep-all;}
table.type_horizontal tbody tr th{padding:15px; font-size:17px; border:1px solid #d4d4d4; font-weight:normal; background-color:#f8f8f8;}
table.type_horizontal tbody tr td:first-child, table.type_horizontal tbody tr th:first-child{border-left:none;}
table.type_horizontal tbody tr td:last-child, table.type_horizontal tbody tr th:last-child{border-right:none;}
table.type_horizontal tbody tr td.al_left{text-align:left;}

/* 사업단 소개 */
#sub_01_01{width:100%; display:table; table-layout:fixed;}
#sub_01_01 div.section{display:table-cell; padding:0 0 0 30px;}
#sub_01_01 div.section:first-child{padding:0 30px 0 0;}
#sub_01_01 div.section strong{font-size:23px; font-weight:normal;}
#sub_01_01 div.section strong span{display:block; margin-top:5px; color:#18a2a8;}
#sub_01_01 div.section p{padding-top:10px;}
#sub_01_01 div.section div.box{padding-top:100px;}
#sub_01_01 div.section div.box:first-child{padding-top:0;}
#sub_01_01 div.section div.box > div{padding-left:200px; background:url(/_res/cleanenergy/img/bg_introduce_01.png) no-repeat 90px 50%;}
#sub_01_01 div.section div.box > div div.info strong{display:block; padding-top:10px; font-size:30px; font-weight:normal;}
#sub_01_01 div.section div.box > div div.info p{padding-top:0;}
#sub_01_01 div.section div.box > ul{overflow:hidden;}
#sub_01_01 div.section div.box > ul li{width:37%; float:left; font-size:17px; color:#555; text-align:center; background:url(/_res/cleanenergy/img/bg_introduce_03.png) no-repeat 0 50%;}
#sub_01_01 div.section div.box > ul li:first-child{width:26%; background:none;}
#sub_01_01 div.section div.box > ul li:before{display:block; content:""; width:60px; height:60px; padding-bottom:20px; margin:0 auto; background-image:url(/_res/cleanenergy/img/bg_introduce_02.png); background-repeat:no-repeat;}
#sub_01_01 div.section div.box > ul li.type_01:before{background-position:0 0;}
#sub_01_01 div.section div.box > ul li.type_02:before{background-position:-60px 0;}
#sub_01_01 div.section div.box > ul li.type_03:before{background-position:-120px 0;}

/* 조직도 */
#sub_01_03 div.section div.image{text-align:center;}

/* 참여학과 */
#sub_01_04 div.section div.bg{display:table; width:100%; height:380px; margin-bottom:30px; table-layout:fixed;}
#sub_01_04 div.section.type_01 div.bg{background:url(/_res/cleanenergy/img/bg_introduce_04.jpg) no-repeat 50% 50%; background-size:cover;}
#sub_01_04 div.section.type_02 div.bg{background:url(/_res/cleanenergy/img/bg_introduce_05.jpg) no-repeat 50% 50%; background-size:cover;}
#sub_01_04 div.section.type_03 div.bg{background:url(/_res/cleanenergy/img/bg_introduce_06.jpg) no-repeat 50% 50%; background-size:cover;}
#sub_01_04 div.section div.bg div.title{display:table-cell; width:40%; vertical-align:middle; text-align:center;}
#sub_01_04 div.section div.bg div.title strong{display:block; line-height:140%; font-size:23px; font-weight:normal; color:#fff;}
#sub_01_04 div.section div.bg div.title strong:before{display:block; content:""; width:60px; height:60px; padding-bottom:20px; margin:0 auto; background-image:url(/_res/cleanenergy/img/bg_introduce_07.png); background-repeat:no-repeat;}
#sub_01_04 div.section.type_01 div.bg div.title strong:before{background-position:0 0;}
#sub_01_04 div.section.type_02 div.bg div.title strong:before{background-position:-60px 0;}
#sub_01_04 div.section.type_03 div.bg div.title strong:before{background-position:-120px 0;}
#sub_01_04 div.section div.bg div.text{display:table-cell; vertical-align:middle; padding-right:50px;}
#sub_01_04 div.section div.bg div.text p{color:#fff;}
#sub_01_04 div.section h5{padding:30px 0 10px 0; font-size:21px; font-weight:normal; color:#049ca3;}

/* 특성화 사업 */
#sub_02_01 ul.tabs li{width:25%;}
#sub_02_01 div.section{padding-top:70px;}
#sub_02_01 div.section div.image{text-align:center;}
#sub_02_01.type_horizontal div.section{overflow:hidden;}
#sub_02_01.type_horizontal div.section h4.title{width:160px; margin:0; float:left;}
#sub_02_01.type_horizontal div.section div.desc{width:920px; float:left;}
#sub_02_01.type_horizontal div.section.vision p{
    height:85px; 
    line-height:85px; 
    font-size:23px;
    color:#fff;
    text-align:center;
    background:#18a2a8; /* Old browsers */
    background:-moz-linear-gradient(-45deg, #18a2a8 0%, #1881a8 100%);
    background:-webkit-linear-gradient(-45deg, #18a2a8 0%,#1881a8 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#18a2a8', endColorstr='#1881a8',GradientType=1 );
}
#sub_02_01.type_horizontal div.section.area ul{overflow:hidden; position:relative;}
#sub_02_01.type_horizontal div.section.area ul li{width:170px; height:170px; line-height:170px; border-radius:170px; font-size:19px; text-align:center; box-sizing:border-box;}
#sub_02_01.type_horizontal div.section.area ul li.type_01{float:left; border:3px solid #18a3a8; color:#18a3a8;}
#sub_02_01.type_horizontal div.section.area ul li.type_02{position:absolute; top:0; left:50%; margin-left:-85px; background-color:#188fa8; color:#fff;}
#sub_02_01.type_horizontal div.section.area ul li.type_03{float:right; border:3px solid #1863a8; color:#1863a8;}
#sub_02_01.type_horizontal div.section.smart div.desc{display:table; table-layout:fixed;}
#sub_02_01.type_horizontal div.section.smart div.desc div.name{display:table-cell; width:230px; vertical-align:middle; text-align:center; background-color:#188fa8;}
#sub_02_01.type_horizontal div.section.smart div.desc div.name h5{font-size:19px; font-weight:normal; color:#fff;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list{display:table-cell; vertical-align:middle; padding-left:10px;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model{display:table; width:100%; table-layout:fixed; margin-top:10px;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model:first-child{margin-top:0;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model h6{display:table-cell; width:150px; vertical-align:middle; font-size:19px; font-weight:normal; color:#fff; text-align:center;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model.type_01 h6{background-color:#1899a8;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model.type_02 h6{background-color:#1881a8;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model.type_03 h6{background-color:#1863a8;}
#sub_02_01.type_horizontal div.section.smart div.desc div.list div.model ul{display:table-cell; padding:25px 0 25px 30px; vertical-align:middle; background-color:#f0f0f0;}
#sub_02_01.type_horizontal div.section.purpose{padding:0 0 40px 0;}
#sub_02_01.type_horizontal div.section.purpose h4.title{padding-top:50px;}
#sub_02_01.type_horizontal div.section.purpose div.desc{padding-top:50px; position:relative;}
#sub_02_01.type_horizontal div.section.purpose div.desc:after{
    display:block; 
    content:""; 
    width:0; 
    height:0; 
    border-top:370px solid none;
    border-bottom:370px solid #f4f4f4;
    border-right:460px solid transparent;
    border-left:460px solid transparent;
    position:absolute;
    top:10px;
    left:0;
    z-index:-1;
}
#sub_02_01.type_horizontal div.section.purpose div.desc div.text{padding:30px 0 30px 160px; border:1px solid #18a2a8; background-color:rgba(255,255,255,0.6);}
#sub_02_01.type_horizontal div.section.purpose div.desc > ul{width:560px; overflow:hidden; margin:40px auto 0 auto; position:relative;}
#sub_02_01.type_horizontal div.section.purpose div.desc > ul li{width:130px; height:130px; line-height:130px; border-radius:130px; font-size:19px; text-align:center; background-color:#fff; box-sizing:border-box;}
#sub_02_01.type_horizontal div.section.purpose div.desc > ul li.type_01{float:left; border:3px solid #18a3a8; color:#18a3a8;}
#sub_02_01.type_horizontal div.section.purpose div.desc > ul li.type_02{position:absolute; top:0; left:50%; margin-left:-65px; border:3px solid #188fa8; color:#188fa8;}
#sub_02_01.type_horizontal div.section.purpose div.desc > ul li.type_03{float:right; border:3px solid #1881a8; color:#1881a8;}
#sub_02_01.type_horizontal div.section.strategy{padding-top:0;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul{overflow:hidden;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li{width:226.25px; height:85px; line-height:85px; float:left; margin-left:5px; font-size:19px; color:#fff; text-align:center;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li:first-child{margin-left:0;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li.type_01{background-color:#18a3a8;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li.type_02{background-color:#1899a8;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li.type_03{background-color:#1881a8;}
#sub_02_01.type_horizontal div.section.strategy div.desc ul li.type_04{background-color:#1863a8;}
#sub_02_01.type_horizontal div.section.task{padding-top:20px;}
#sub_02_01.type_horizontal div.section.task div.desc > ul{overflow:hidden;}
#sub_02_01.type_horizontal div.section.task div.desc > ul > li{width:226.25px; height:310px; float:left; margin-left:5px; background-color:#f6f6f6;}
#sub_02_01.type_horizontal div.section.task div.desc > ul > li:first-child{margin-left:0;}
#sub_02_01.type_horizontal div.section.task div.desc > ul > li ol{padding:30px 25px 30px 40px;}
#sub_02_01.type_horizontal div.section.task div.desc > ul > li ol li{line-height:150%; margin-top:15px; font-size:17px; word-break:keep-all; list-style-type:decimal;}
#sub_02_01.type_horizontal div.section.task div.desc > ul > li ol li:first-child{margin-top:0;}

#sub_02_02 ul.tabs li{width:33.33%;}
#sub_02_02 ul.tabs li:first-child{width:33.34%;}
#sub_02_02.training div.section > ul.list_color{overflow:hidden;}
#sub_02_02.training div.section > ul.list_color > li{width:350px; margin-left:15px; float:left; background-color:#f6f6f6;}
#sub_02_02.training div.section > ul.list_color > li:first-child{margin-left:0;}
#sub_02_02.training div.section > ul.list_color > li strong{display:block; height:70px; line-height:70px; text-align:center; font-size:19px; font-weight:normal; color:#fff; text-align:center;}
#sub_02_02.training div.section > ul.list_color > li.type_01 strong{background-color:#1899a8;}
#sub_02_02.training div.section > ul.list_color > li.type_02 strong{background-color:#1881a8;}
#sub_02_02.training div.section > ul.list_color > li.type_03 strong{background-color:#1863a8;}
#sub_02_02.training div.section > ul.list_color > li ul.list_dash{padding:30px 25px; box-sizing:border-box;}
#sub_02_02.training div.section > ul.list_color.type_01 > li ul.list_dash{height:145px;}
#sub_02_02.training div.section > ul.list_color.type_02 > li ul.list_dash{height:185px;}
#sub_02_02.training div.section > div.image{text-align:center;}
#sub_02_02.training div.section > ul.list_black{margin-top:40px; overflow:hidden;}
#sub_02_02.training div.section > ul.list_black > li{width:262.5px; margin-left:10px; float:left; background-color:#f6f6f6;}
#sub_02_02.training div.section > ul.list_black > li:first-child{margin-left:0;}
#sub_02_02.training div.section > ul.list_black > li strong{display:block; height:70px; line-height:70px; text-align:center; font-size:19px; font-weight:normal; color:#fff; text-align:center; background-color:#646464;}
#sub_02_02.training div.section > ul.list_black > li ul.list_dash{height:330px; padding:30px 25px; box-sizing:border-box;}
#sub_02_02.stability div.section{width:100%; display:table; table-layout:fixed;}
#sub_02_02.stability div.section > div{display:table-cell;}
#sub_02_02.stability div.section > div div.image{text-align:center;}
#sub_02_02.infra div.section div.image{text-align:center;}
#sub_02_02.infra div.section > ul.list_color{overflow:hidden;}
#sub_02_02.infra div.section > ul.list_color > li{width:262.5px; margin-left:10px; float:left; background-color:#f6f6f6;}
#sub_02_02.infra div.section > ul.list_color > li:first-child{margin-left:0;}
#sub_02_02.infra div.section > ul.list_color > li strong{display:block; height:75px; line-height:75px; text-align:center; font-size:19px; font-weight:normal; color:#fff; text-align:center; box-sizing:border-box;}
#sub_02_02.infra div.section > ul.list_color > li strong.line_break{padding-top:12px; line-height:140%;}
#sub_02_02.infra div.section > ul.list_color > li.type_01 strong{background-color:#18a3a8;}
#sub_02_02.infra div.section > ul.list_color > li.type_02 strong{background-color:#1899a8;}
#sub_02_02.infra div.section > ul.list_color > li.type_03 strong{background-color:#1881a8;}
#sub_02_02.infra div.section > ul.list_color > li.type_04 strong{background-color:#1863a8;}
#sub_02_02.infra div.section > ul.list_color > li ul.list_dash{height:215px; padding:30px 25px; box-sizing:border-box;}
#sub_02_02.infra div.section > ul.list_black{overflow:hidden;}
#sub_02_02.infra div.section > ul.list_black > li{width:350px; margin-left:15px; float:left; background-color:#f6f6f6;}
#sub_02_02.infra div.section > ul.list_black > li:first-child{margin-left:0;}
#sub_02_02.infra div.section > ul.list_black > li strong{display:block; height:70px; line-height:70px; text-align:center; font-size:19px; font-weight:normal; color:#fff; text-align:center; background-color:#646464;}
#sub_02_02.infra div.section > ul.list_black > li ul.list_dash{height:240px; padding:30px 25px; box-sizing:border-box;}

/* 지역사회 산업기여 */
#sub_02_03 div.section div.image{text-align:center;}
#sub_02_03 div.section table.type_horizontal col.track{width:250px;}
#sub_02_03 div.section table.type_horizontal col.software{width:300px;}

/* 산학협력 */
#sub_02_04 ul.tabs li{width:50%;}
#sub_02_04.plan div.section.type_01{overflow:hidden;}
#sub_02_04.plan div.section.type_01 div.box{float:left;}
#sub_02_04.plan div.section.type_01 div.box.type_01{width:43%;}
#sub_02_04.plan div.section.type_01 div.box.type_01 div.image img{width:100%; max-width:385px;}
#sub_02_04.plan div.section.type_01 div.box.type_02{width:55%;}
#sub_02_04.plan div.section.type_01 div.box.type_02 table.type_horizontal thead th{font-size:17px;}
#sub_02_04.plan div.section.type_01 div.box.type_02 table.type_horizontal tbody td{padding:5px; font-size:15px; word-break:break-word;}
#sub_02_04.plan div.section.type_02 > ul.list_color{overflow:hidden;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li{width:350px; height:350px; margin-left:15px; float:left; background-color:#f6f6f6;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li:first-child{margin-left:0;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li strong{display:block; height:70px; line-height:70px; text-align:center; font-size:19px; font-weight:normal; color:#fff; text-align:center;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li.type_01 strong{background-color:#1899a8;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li.type_02 strong{background-color:#1881a8;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li.type_03 strong{background-color:#1863a8;}
#sub_02_04.plan div.section.type_02 > ul.list_color > li ul.list_dash{padding:30px 25px; box-sizing:border-box;}
#sub_02_04.plan div.section.type_03 div.image{text-align:center;}
#sub_02_04.plan div.section.type_03 div.image img{width:100%; max-width:559px;}

/* 프로그램안내 */
#sub_03_01 ul.tabs li{width:50%;}
#sub_03_01 div.section table.type_horizontal{margin-top:30px;}
#sub_03_01 div.section table.type_horizontal col.num{width:70px;}
#sub_03_01 div.section table.type_horizontal tbody tr td:nth-child(3){padding-left:50px; text-align:left;}
#sub_03_01 div.section div.box{width:100%; display:table; table-layout:fixed; margin-top:30px;}
#sub_03_01 div.section div.box div.title{display:table-cell; vertical-align:middle; width:490px; height:206px; text-align:center; background-size:cover;}
#sub_03_01 div.section div.box.type_01 div.title{background:url(/_res/cleanenergy/img/bg_program_01.jpg) no-repeat 50% 50%;}
#sub_03_01 div.section div.box.type_02 div.title{background:url(/_res/cleanenergy/img/bg_program_02.jpg) no-repeat 50% 50%;}
#sub_03_01 div.section div.box.type_03 div.title{background:url(/_res/cleanenergy/img/bg_program_03.jpg) no-repeat 50% 50%;}
#sub_03_01 div.section div.box.type_04 div.title{background:url(/_res/cleanenergy/img/bg_program_04.jpg) no-repeat 50% 50%;}
#sub_03_01 div.section div.box div.title h5{display:inline-block;}
#sub_03_01 div.section div.box div.title h5 span{font-size:20px; font-weight:normal; color:#fff;}
#sub_03_01 div.section div.box div.text{display:table-cell; vertical-align:middle; padding-left:30px;}
#sub_03_01 div.section div.box div.text ul.list_dot li{margin-top:5px; font-size:15px;}
#sub_03_01 div.section div.box div.text dl{overflow:hidden; margin-top:20px;}
#sub_03_01 div.section div.box div.text dl dt{margin-top:10px; float:left; clear:both; font-size:15px; color:#049ca3;}
#sub_03_01 div.section div.box div.text dl dt:after{display:inline; content:":"; padding:0 5px; font-size:17px; color:#333;}
#sub_03_01 div.section div.box div.text dl dd{margin-top:10px; font-size:15px;}

/* PC Mini & Tablet */
@media all and (min-width:768px) and (max-width:1200px) {
    #qnb > ul > li > a{font-size:14px; padding:0 15px;}
    #qnb > ul > li > ul > li > a{font-size:14px; padding:0 15px;} 
}

/* Mobile */
@media all and (max-width:767px) {
    body{overflow-x:hidden;}
    .web{display:none;}
    .mobile{display:block;}
    .mobile_img{display:inline;}

    header{background:none;}
    header > div{height:70px;}
    header > div > div{display:none;}
    header > div > ul{display:none;}
    header > div h1{padding:12px 0 0 15px;}
    header > div h1 a{width:205px; height:40px; background-size:205px auto;}

    header > div a.gnb_handle{width:30px; height:30px; right:15px;}
    header > div a.gnb_handle span{width:30px;}
    header > div a.gnb_handle:before{width:30px;}
    header > div a.gnb_handle:after{width:30px;}
    header > div a.gnb_handle.active:before{top:13px;}
    header > div a.gnb_handle.active:after{bottom:13px;}
    header > div nav{width:250px; position:absolute; top:0; right:inherit; left:-400px;}
    header > div nav.active{left:0;}
    header > div nav > ul{height:inherit;}
    header > div nav > ul > li{background:none; float:none; padding:0; border-bottom:1px solid #e1e1e1;}
    header > div nav > ul > li > a{display:block; height:50px; line-height:50px; padding:0 20px; font-size:15px; color:#2d9dc4; background-color:#fff;}
    header > div nav > ul > li > ul{width:100%; position:static; margin:0;}
    header > div nav > ul > li > ul.active{display:block;}
    header > div nav > ul > li > ul li{opacity:1; filter:alpha(opacity=100); top:0;}
    header > div nav > ul > li > ul li a{height:35px; line-height:35px; font-size:13px; border:none;}
    header > div nav > ul > li > ul li a:hover, header > div nav > ul > li > ul li a:focus{border:none;}
    #qnb > ul{height:inherit; border-left:none; border-right:none;}
    #qnb > ul > li{width:100%; float:none; border-bottom:1px solid #444; background-position:95% 50%; background-size:7px auto;}
    #qnb > ul > li > a{height:40px; line-height:40px; padding:0 20px; font-size:14px; color:#d0d0d0; border-left:none;}
    #qnb > ul > li > ul{display:none; height:200px; overflow-y:auto; position:static; border:none; padding:10px 0; border-top:1px solid #444; -webkit-overflow-scrolling:touch;}
    #qnb > ul > li > ul > li > a{height:30px; line-height:30px; padding:0 20px; font-size:13px;}

    /* Main Contents */
    #main_contents a.more{display:block; width:18px; height:18px; position:absolute; background:url(/_res/cleanenergy/img/bg_main_board_more.png) no-repeat 50% 50%; background-size:18px 18px; text-indent:-9999px;}
    #visual_section{width:100%;}
    #visual_bg{display:none;}
    #visual_contents{display:block; padding:0;}
    #main_left{display:block; width:100%; padding:35px 0; background:url(/_res/cleanenergy/img/bg_main_visual_mobile.jpg) no-repeat 50% 50%; background-size:cover;}
    #main_left > div p img{width:210px;}
    #main_left > div h2{padding-top:10px;}
    #main_left > div h2 img{width:265px;}
    #main_left > div.active *{
        -webkit-transform:translateX(20px);
        -moz-transform:translateX(20px);
        -o-transform:translateX(20px);
        -ms-transform:translateX(20px);
        transform:translateX(20px);
    }
    #main_left > ul{height:inherit; padding-top:30px; position:static; font-size:0; text-align:center;}
    #main_left > ul li{position:static; display:inline-block; margin:0 4px;}
    #main_left > ul li a{width:90px; height:90px; padding-top:20px;}
    #main_left > ul li a span{font-size:11px;}
    #main_left > ul li a span.icon{width:30px; height:30px; margin:0 auto 10px auto; background-size:90px 30px;}
    #main_left > ul li.type_02 a span.icon{background-position:-30px 0;}
    #main_left > ul li.type_03 a span.icon{background-position:-60px 0;}
    #main_right{display:block; padding:0 15px;}
    #right_top div.recent_notice{width:100%; height:inherit; padding:30px 0; float:none;}
    #right_top div.recent_notice h3{display:block; border-bottom:none; font-size:20px; text-align:center;}
    #right_top div.recent_notice > a.more{top:35px; right:35px;}
    #right_top div.introduce{width:100%; float:none;}
    #right_top div.introduce > div{width:50%; height:0; float:left; position:relative; overflow:hidden; padding-bottom:50%;}
    #right_top div.introduce > div a{width:100%; height:100%; padding:25px; position:absolute; top:0; left:0;}
    #right_top div.introduce > div a h3{font-size:14px;}
    #right_top div.introduce > div a p img{width:70px;}
    #right_top div.introduce > div a:after{width:70px; height:15px; background-size:auto 15px; bottom:25px; right:25px;}
    #right_bottom div.quick_02{width:100%; float:none;}
    #right_bottom div.quick_02 ul li{height:0; padding-bottom:50%; overflow:hidden; position:relative;}
    #right_bottom div.quick_02 ul li a{width:100%; height:100%; padding:25px; position:absolute; top:0; left:0;}
    #right_bottom div.quick_02 ul li.type_01 a{background-size:70px auto;}
    #right_bottom div.quick_02 ul li.type_02 a{background-size:80px auto;}
    #right_bottom div.quick_02 ul li a span.text{font-size:14px;}
    #right_bottom div.quick_02 ul li a span.desc{font-size:12px; padding-top:15px;}

    #recent_gallery{padding:60px 15px 30px 15px;}
    #recent_gallery h3{font-size:20px; padding-bottom:20px;}
    #recent_gallery a.more{top:63px; right:15px;}

    #recent_gallery div.board ul.gallery_slide li{width:48%; height:0; margin-left:2%; margin-bottom:2%; padding-bottom:33.33%; overflow:hidden;}
    #recent_gallery div.board ul.gallery_slide li:nth-child(odd){margin-left:0;}
    #recent_gallery div.board ul.gallery_slide li a{width:100%; height:100%; position:absolute; top:0; left:0;}
    #recent_gallery div.board ul.gallery_slide li a div.info span.title{height:35px; line-height:35px; padding:0 10px; font-size:14px;}
    #recent_gallery div.board ul.gallery_slide li a div.info span.date{font-size:12px;}

    /* 서브 레이아웃 */
    #sub_visual_wrap h2{padding:25px 0 10px 0; font-size:20px;}
    #sub_visual_wrap p.desc{font-size:11px;}
    #sub_visual_wrap > div > div{width:100%; max-width:1080px; margin:0 auto; box-sizing:border-box;}
    #sub_visual_wrap div.visual_01{height:150px; background-size:cover;}
    #sub_visual_wrap div.visual_02{height:150px; background-size:cover;}
    #sub_visual_wrap div.visual_03{height:150px; background-size:cover;}
    #sub_visual_wrap div.visual_04{height:150px; background-size:cover;}

    #snb_wrap{width:100%; background:none; margin-top:0; border-top:none; position:absolute; top:220px; left:0; z-index:5;}
    #snb_wrap h3{display:block;}
    #snb_wrap ul{
        display:block; 
        max-height:0;
        overflow:hidden;
        -webkit-transition:all 0.3s;
        -moz-transition:all 0.3s;
        -o-transition:all 0.3s;
        -ms-transition:all 0.3s;
        transition:all 0.3s;
    }
    #snb_wrap.active ul{max-height:300px;}
    #snb_wrap ul li{display:block; border:none;}
    #snb_wrap ul li:first-child{border:none;}
    #snb_wrap ul li.active{display:none;}
    #snb_wrap ul li a{height:50px; line-height:50px; font-size:18px; background-color:#f9f9f9; border-bottom:1px solid #d1d1d1;}

    #sub_contents{padding:0 15px 30px 15px;}
    #contents_wrap{padding-top:30px;}
    #contents_wrap div.section{padding-top:40px;}
    #contents_wrap div.section p{font-size:13px;}
    #contents_wrap h4.title{margin-bottom:20px; font-size:17px;}
    #contents_wrap h4.title:after{width:30px; height:2px; margin-top:5px;}
    #title_wrap{padding:0; border:none;}
    #title_wrap h3{display:none;}
    #title_wrap div.path{padding:10px 0 0 0;}
    #title_wrap div.path ul{overflow:hidden;}
    #title_wrap div.path ul li{float:left; font-size:13px; color:#919191;}
    #title_wrap div.path ul li:before{display:block; padding:0 10px; float:left; content:">"; font-size:13px; color:#919191; letter-spacing:-5px;}
    #title_wrap div.path ul li:first-child:before{display:none;}

    /* 탭 메뉴(페이징) */
    ul.tabs{background-color:#eee;}
    ul.tabs li a{height:45px; line-height:45px; font-size:15px;}
    ul.tabs li.active a{line-height:43px; border-bottom:3px solid #1ab4bb;}

    /* 목록형 */
    ul.list_dash li{padding-left:12px; font-size:13px; background:url(/_res/cleanenergy/img/bullet_list_dash.png) no-repeat 0 8px; background-size:5px 1px;}
    ul.list_dot li{padding-left:8px; font-size:13px; background:url(/_res/cleanenergy/img/bullet_list_dot.png) no-repeat 0 8px; background-size:2px 2px;}

    /* 테이블 */
    table.type_horizontal thead tr th{padding:10px 7px; font-size:15px;}
    table.type_horizontal tfoot tr th{padding:7px; font-size:15px;}
    table.type_horizontal tfoot tr td{padding:7px; font-size:13px;}
    table.type_horizontal tbody tr td{padding:7px; font-size:13px;}
    table.type_horizontal tbody tr th{padding:7px; font-size:13px;}

    /* 사업단 소개 */
    #sub_01_01{display:block;}
    #sub_01_01 div.section{display:block; padding:40px 0 0 0;}
    #sub_01_01 div.section:first-child{padding:0;}
    #sub_01_01 div.section strong{font-size:16px;}
    #sub_01_01 div.section div.box{padding-top:40px;}
    #sub_01_01 div.section div.box > div{padding-left:35%; background:url(/_res/cleanenergy/img/bg_introduce_01.png) no-repeat 22% 50%; background-size:35px auto;}
    #sub_01_01 div.section div.box > div div.info strong{padding-top:5px; font-size:20px;}
    #sub_01_01 div.section div.box > ul li{font-size:13px; background-size:20px 20px;}
    #sub_01_01 div.section div.box > ul li:before{width:40px; height:40px; padding-bottom:15px; background-size:120px 40px;}
    #sub_01_01 div.section div.box > ul li.type_02:before{background-position:-40px 0;}
    #sub_01_01 div.section div.box > ul li.type_03:before{background-position:-80px 0;}

    /* 조직도 */
    #sub_01_03 div.section div.image img{width:100%; max-width:337px;}

    /* 참여학과 */
    #sub_01_04 div.section div.bg{display:block; height:150px; margin:0;}
    #sub_01_04 div.section div.bg div.title{display:block; width:100%; padding-top:30px;}
    #sub_01_04 div.section div.bg div.title strong{font-size:15px;}
    #sub_01_04 div.section div.bg div.title strong:before{width:40px; height:40px; padding-bottom:15px; background-size:120px 40px;}
    #sub_01_04 div.section.type_02 div.bg div.title strong:before{background-position:-40px 0;}
    #sub_01_04 div.section.type_03 div.bg div.title strong:before{background-position:-80px 0;}
    #sub_01_04 div.section div.bg div.text{display:none;}
    #sub_01_04 div.section h5{padding:20px 0 0 0; font-size:15px;}
    #sub_01_04 div.section p{padding-top:10px;}

    /* 특성화 사업 */
    #sub_02_01 ul.tabs li{width:50%;}
    #sub_02_01 ul.tabs li:nth-child(3) a{border-left:1px solid #c7c7c7;}
    #sub_02_01 ul.tabs li:nth-child(3) a, #sub_02_01 ul.tabs li:nth-child(4) a{border-top:none;}
    #sub_02_01 div.section{padding-top:40px;}
    #sub_02_01 div.section div.image img{width:100%;}
    #sub_02_01.type_horizontal div.section h4.title{width:100%; margin-bottom:20px; float:none;}
    #sub_02_01.type_horizontal div.section h4.title br{display:none;}
    #sub_02_01.type_horizontal div.section div.desc{width:100%; float:none;}
    #sub_02_01.type_horizontal div.section.vision p{height:50px; line-height:50px; font-size:13px;}
    #sub_02_01.type_horizontal div.section.area ul li{width:90px; height:90px; line-height:90px; font-size:13px;}
    #sub_02_01.type_horizontal div.section.area ul li.type_02{margin-left:-45px;}
    #sub_02_01.type_horizontal div.section.smart div.desc{display:block;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.name{display:block; width:100%;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.name h5{height:45px; line-height:45px; margin-bottom:4px; font-size:15px;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.name h5 br{display:none;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.list{display:block; padding:0;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.list div.model{margin-top:4px;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.list div.model h6{width:70px; padding:0 15px; font-size:13px;}
    #sub_02_01.type_horizontal div.section.smart div.desc div.list div.model ul{padding:15px;}
    #sub_02_01.type_horizontal div.section.purpose h4.title{padding-top:25px;}
    #sub_02_01.type_horizontal div.section.purpose div.desc{padding-top:0;}
    #sub_02_01.type_horizontal div.section.purpose div.desc:after{ 
        border-top:100px solid none;
        border-bottom:100px solid #f4f4f4;
        border-right:100px solid transparent;
        border-left:100px solid transparent;
        top:-50px;
        left:50%;
        margin-left:-100px;
    }
    #sub_02_01.type_horizontal div.section.purpose div.desc div.text{padding:20px; background-color:#fff;}
    #sub_02_01.type_horizontal div.section.purpose div.desc > ul{width:100%; margin:20px auto 0 auto;}
    #sub_02_01.type_horizontal div.section.purpose div.desc > ul li{width:90px; height:90px; line-height:90px; font-size:13px;}
    #sub_02_01.type_horizontal div.section.purpose div.desc > ul li.type_02{margin-left:-45px;}
    #sub_02_01.type_horizontal div.section.strategy{padding-top:0;}
    #sub_02_01.type_horizontal div.section.strategy div.desc ul li{width:calc(50% - 2px); height:50px; line-height:50px; margin:0; font-size:13px;}
    #sub_02_01.type_horizontal div.section.strategy div.desc ul li:nth-child(even){float:right;}
    #sub_02_01.type_horizontal div.section.strategy div.desc ul li:nth-child(3), #sub_02_01.type_horizontal div.section.strategy div.desc ul li:nth-child(4){margin-top:4px;}
    #sub_02_01.type_horizontal div.section.task{padding-top:40px;}
    #sub_02_01.type_horizontal div.section.task div.desc > ul > li{width:100%; height:inherit; float:none; margin:0 0 10px 0;}
    #sub_02_01.type_horizontal div.section.task div.desc > ul > li ol{padding:20px 20px 20px 35px;}
    #sub_02_01.type_horizontal div.section.task div.desc > ul > li ol li{margin-top:10px; font-size:13px;}

    #sub_02_02 ul.tabs li{width:50%;}
    #sub_02_02 ul.tabs li:first-child{width:50%;}
    #sub_02_02 ul.tabs li:nth-child(3) a{border-left:1px solid #c7c7c7;}
    #sub_02_02 ul.tabs li:nth-child(3) a, #sub_02_01 ul.tabs li:nth-child(4) a{border-top:none;}
    #sub_02_02.training div.section > ul.list_color > li{width:100%; margin:10px 0 0 0; float:none;}
    #sub_02_02.training div.section > ul.list_color > li:first-child{margin-top:0;}
    #sub_02_02.training div.section > ul.list_color > li strong{height:45px; line-height:45px; font-size:13px;}
    #sub_02_02.training div.section > ul.list_color > li ul.list_dash{padding:15px; height:inherit !important;}
    #sub_02_02.training div.section > div.image img{width:100%;}
    #sub_02_02.training div.section > ul.list_black{margin:0;}
    #sub_02_02.training div.section > ul.list_black > li{width:100%; margin:10px 0 0 0; float:none;}
    #sub_02_02.training div.section > ul.list_black > li:first-child{margin-top:0;}
    #sub_02_02.training div.section > ul.list_black > li strong{height:45px; line-height:45px; font-size:13px;}
    #sub_02_02.training div.section > ul.list_black > li ul.list_dash{height:inherit; padding:15px;}
    #sub_02_02.stability div.section{display:block;}
    #sub_02_02.stability div.section > div{display:block; margin-top:40px;}
    #sub_02_02.stability div.section > div:first-child{margin-top:0;}
    #sub_02_02.stability div.section > div div.image img{width:100%;}
    #sub_02_02.infra div.section div.image img{width:100%;}
    #sub_02_02.infra div.section > ul.list_color > li{width:100%; margin:10px 0 0 0; float:none;}
    #sub_02_02.infra div.section > ul.list_color > li:first-child{margin-top:0;}
    #sub_02_02.infra div.section > ul.list_color > li strong{height:45px; line-height:45px; font-size:13px;}
    #sub_02_02.infra div.section > ul.list_color > li strong.line_break{padding:0; line-height:45px;}
    #sub_02_02.infra div.section > ul.list_color > li strong.line_break br{display:none;}
    #sub_02_02.infra div.section > ul.list_color > li ul.list_dash{height:inherit; padding:15px;}
    #sub_02_02.infra div.section > ul.list_black > li{width:100%; margin:10px 0 0 0; float:none;}
    #sub_02_02.infra div.section > ul.list_black > li:first-child{margin-top:0;}
    #sub_02_02.infra div.section > ul.list_black > li strong{height:45px; line-height:45px; font-size:13px;}
    #sub_02_02.infra div.section > ul.list_black > li ul.list_dash{height:inherit; padding:15px;}

    /* 지역사회 산업기여 */
    #sub_02_03 div.section div.image img{width:100%;}
    #sub_02_03 div.section table.type_horizontal col.track{width:80px;}
    #sub_02_03 div.section table.type_horizontal col.software{width:100px;}

    /* 산학협력 */
    #sub_02_04.plan div.section.type_01 div.box{margin-top:30px; float:none;}
    #sub_02_04.plan div.section.type_01 div.box.type_01{margin-top:0; width:100%;}
    #sub_02_04.plan div.section.type_01 div.box.type_01 div.image{text-align:center;}
    #sub_02_04.plan div.section.type_01 div.box.type_01 div.image img{max-width:200px;}
    #sub_02_04.plan div.section.type_01 div.box.type_02{width:100%;}
    #sub_02_04.plan div.section.type_01 div.box.type_02 table.type_horizontal thead th{font-size:13px;}
    #sub_02_04.plan div.section.type_01 div.box.type_02 table.type_horizontal tbody td{font-size:11px;}
    #sub_02_04.plan div.section.type_02 > ul.list_color > li{width:100%; height:inherit; margin:0 0 15px 0; float:none;}
    #sub_02_04.plan div.section.type_02 > ul.list_color > li strong{height:45px; line-height:45px; font-size:13px;}
    #sub_02_04.plan div.section.type_02 > ul.list_color > li ul.list_dash{padding:15px;}
    #sub_02_04.plan div.section.type_03 div.image img{max-width:300px;}

    /* 프로그램안내 */
    #sub_03_01 div.section table.type_horizontal{margin-top:30px;}
    #sub_03_01 div.section table.type_horizontal col.num{width:40px;}
    #sub_03_01 div.section table.type_horizontal col.program{width:100px;}
    #sub_03_01 div.section table.type_horizontal thead tr th{font-size:11px;}
    #sub_03_01 div.section table.type_horizontal tbody tr td{font-size:11px;}
    #sub_03_01 div.section table.type_horizontal tbody tr td:nth-child(3){padding-left:7px;}
    #sub_03_01 div.section table.type_horizontal tbody tr td ul.list_dot li{font-size:11px;}
    #sub_03_01 div.section > p{padding-bottom:15px;}
    #sub_03_01 div.section div.box{display:block; margin:0 0 30px 0;}
    #sub_03_01 div.section div.box div.title{display:block; width:100%; height:0; padding-bottom:40%; margin-bottom:15px; position:relative; overflow:hidden;}
    #sub_03_01 div.section div.box div.title h5{display:block; width:100%; height:100%; position:absolute; top:0; left:0;}
    #sub_03_01 div.section div.box div.title h5 span{display:block; width:100%; position:absolute; top:50%; margin-top:-8px; font-size:17px;}
    #sub_03_01 div.section div.box div.text{display:block; padding:0;}
    #sub_03_01 div.section div.box div.text ul.list_dot li{font-size:13px;}
    #sub_03_01 div.section div.box div.text dl{margin-top:0;}
    #sub_03_01 div.section div.box div.text dl dt{font-size:13px;}
    #sub_03_01 div.section div.box div.text dl dt:after{font-size:13px;}
    #sub_03_01 div.section div.box div.text dl dd{font-size:13px;}
}