@charset "UTF-8";
@import url(font.css);
@import url(//fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap);


#sub-wrap { min-width:1440px; overflow:hidden; }
#header { position:relative; width:100%; height:80px; box-shadow:0 0 10px rgba(0,0,0,0.2); }
.sinner { height:80px; max-width:1440px; margin:0 auto;}
.sinner::after { content:""; clear:both; display:block; }
.sinner h1 { position:relative; float:left; top:20px; }

.inner { max-width:1200px; margin:0 auto;}

.h-menus { max-width:587px; margin:0 auto; }
.h-menus::after { content:""; clear:both; display:block; }
.h-menus .depth-wrap { float:left;}
.h-menus .depth-wrap::after { content:""; clear:both; display:block; }
.h-menus .depth-wrap .depth1 { display:block; line-height:80px; padding:0 20px; font-size:18px; text-align:center; }
.h-menus .depth-wrap .depth1.active { font-weight:bold ;}
.h-menus .depth2-wrap { display:none; background-color:#4447de; height:55px; line-height:55px; z-index:999; }
.h-menus .depth2-wrap.on { display:block; position:absolute; left:0; width:100%; }
.h-menus .depth2-wrap .depth-inner { max-width:1200px; margin:0 auto; }
.h-menus .depth2-wrap ul { display:flex; justify-content:center; }
.h-menus .depth2-wrap ul li a { display:block; padding:0 15px; color:rgba(255,255,255,0.7);}

.h-menus .depth2-wrap .depth2-item .depth2 { position:relative; overflow: hidden; }
.h-menus .depth2-wrap .depth2-item .depth2:hover { color:rgba(255,255,255,1); }
.h-menus .depth2-wrap .depth2-item .depth2.active { color:#fff; }
.h-menus .depth2-wrap .depth2-item .depth2.active::before {   content:""; display:block; width:100%; height:2px; position:absolute; left:0; bottom:10px; background-color:#fff; }
.h-menus .depth2-wrap .depth2-item .depth2::before { content:""; display:block; width:0; height:2px; position:absolute; left:0; bottom:10px; background-color:#fff; transition:width 0.3s}
.h-menus .depth2-wrap .depth2-item .depth2:hover::before {  width:100%; transition:width 0.3s }

.h-menus .depth3-wrap { display:none; background-color:#4447de; height:55px; line-height:55px; }
.h-menus .depth3-wrap.on { display:block; position:absolute; left:0; width:100%; }
.h-menus .depth3-wrap ul li { position:relative; overflow: hidden; }
.h-menus .depth3-wrap .depth3:hover { color:#ffe29e; }
.h-menus .depth3-wrap .depth3.active { color:#ffe29e;}
.h-menus .depth3-wrap .depth3::before { content:""; display:block; width:0; height:4px; border-top-left-radius:2px; border-top-right-radius:2px; position:absolute; left:0; bottom:0; background-color:#ffe29e; transition:width 0.3s}
.h-menus .depth3-wrap .depth3:hover::before {  width:100%; transition:width 0.3s }

.login-state { position:absolute; top:18px; right:10%;}
.login-state p { display:inline-block; vertical-align: middle; padding-left:25px; line-height:1em; }
.login-state p.login-hello::before { content:""; display:block; position:absolute; left:0; top:18px; width:17px; height:17px; background-image:url(../images/login_state.png); background-repeat:no-repeat; background-size:cover; }
.login-state span { color:#00aeef; border-bottom:1px solid #00aeef; font-weight:bold; }
.login-state .logout-btn { position:relative; font-size:17px; height:100%; height:45px; line-height:45px; padding:0 18px; border:1px solid #000; border-radius:5px; margin-left:15px; transition:color 0.5s;}
.login-state .logout-btn:hover { color:#fff; transition:color 0.5s;}
.login-state .logout-btn::after { content:""; z-index:-1; position:absolute; background-color:#000; display:block; width:0%; height:100%; top:0; left:0; transition:width 0.5s }
.login-state .logout-btn:hover::after { width:100%; transition:width 0.5s }


.sub-main { width:100%; background-color:#f6f7f8; padding:30px 0;}

.sub-main-notice { position:relative; max-width:1200px; background-color:#fff; padding:30px 30px 30px 250px; border:3px solid #e0e5ed; border-radius:10px; background-image:url(../images/notice_box_bg.png); background-position:top left; background-repeat:no-repeat;}
.sub-main-notice::before { content:""; display:block; width:187px; height:184px; background-image:url(../images/notice_box_img.png); background-repeat:no-repeat; position:absolute; left:10px; top:-50%; z-index:0; }
.sub-main-notice strong { position:relative; display:inline-block; vertical-align:middle; width:135px; border-right:1px solid #e0e5ed; font-size:30px; line-height:1em; }
.sub-main-notice strong.new::after{ content:""; position:absolute; display:block; width: 9px; height:9px; background-color:#d6196b; border-radius:9p ;box-shadow:0 4px 4px rgba(0,0,0,0.25); top:0; right:10px; border-radius:9px; }
.sub-main-notice .notice-list { display:inline-block; vertical-align: middle; width:779px; margin-left:-4px; padding-left:20px; }
.sub-main-notice .notice-list { position:relative; line-height:1em;  }
.sub-main-notice .notice-list span.n-cate { display:inline-block; vertical-align: middle; font-weight:bold; }
.sub-main-notice .notice-list p.n-subject { display:inline-block; vertical-align: middle; padding-left:5px; }
.sub-main-notice .notice-list span.n-date { display:block; position:absolute; right:25px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); color:#a5a6ac; font-family: 'Montserrat', 'sans-serif'; }
.sub-main-notice .notice-list-btn { position:absolute; right:20px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);}
.sub-main-notice .notice-list-btn #prevDiv { width:15px; height:15px; background-image:url(../images/notice_prev.svg); background-size:10px 5px; background-repeat:no-repeat; background-position:center; cursor: pointer; margin-bottom:15px;}
.sub-main-notice .notice-list-btn #nextDiv { width:15px; height:15px; background-image:url(../images/notice_next.svg); background-size:10px 5px; background-repeat:no-repeat; background-position:center; cursor: pointer; margin-top:15px; }

.section-wrap { margin:35px 0; }
.section-wrap::after { clear:both; display:block; content:""; }
.section-wrap .last-5year { float:left; width:520px; height:318px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 35px; }
.section-wrap .last-5year strong { display:block; margin-bottom:35px; font-size:20px; font-weight:400; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; color:#333; letter-spacing:-0.05em; }
.section-wrap .last-5year strong span { font-weight:700; }
.section-wrap .last-5year .last-5year-graph { position:relative; width:95%; margin-left:5%; height:180px; background-color:#fff}
.section-wrap .last-5year .last-5year-graph .lines span { position:absolute; display:block; width:100%; height:1px; background-color:#ddd; font-size:14px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .last-5year .last-5year-graph .lines span.p100 { top:0; }
.section-wrap .last-5year .last-5year-graph .lines span.p100::before { content:"100"; position:relative; left:-30px; top:-10px; color:#a4a4a4 }
.section-wrap .last-5year .last-5year-graph .lines span.p75 { bottom:75% }
.section-wrap .last-5year .last-5year-graph .lines span.p75::before { content:"75"; position:relative; left:-22px; top:-10px; color:#a4a4a4 }
.section-wrap .last-5year .last-5year-graph .lines span.p50 { bottom:50% }
.section-wrap .last-5year .last-5year-graph .lines span.p50::before { content:"50"; position:relative; left:-22px; top:-10px; color:#a4a4a4 }
.section-wrap .last-5year .last-5year-graph .lines span.p25 { bottom:25% }
.section-wrap .last-5year .last-5year-graph .lines span.p25::before { content:"25"; position:relative; left:-22px; top:-10px; color:#a4a4a4 }
.section-wrap .last-5year .last-5year-graph .lines span.p0 { bottom:0; }
.section-wrap .last-5year .last-5year-graph .lines span.p0::before { content:"0"; position:relative; left:-14px; top:-12px; color:#a4a4a4 }
.section-wrap .last-5year .last-5year-graph .graph-box { position:relative; bottom:0; width:100%; height:180px; padding:0 20px; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar { position:absolute; bottom:0; width:49.5px; height:0; background-color:#2464E5;  }
.section-wrap .last-5year .last-5year-graph .graph-box .bar span.rate { display:block; position:absolute; top:-20px; width:100%; text-align:center; color:#515df1; font-size:11px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar span.year { display:block; position:absolute; bottom:-20px; width:100% ;text-align: center; color:#a4a4a4; font-size:12px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar:nth-of-type(2) { left:104.5px; background-color:#43444A; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar:nth-of-type(3) { left:189px; background-color:#63D8DD; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar:nth-of-type(4) { left:273.5px; background-color:#FCB130; }
.section-wrap .last-5year .last-5year-graph .graph-box .bar:nth-of-type(5) { left:358px; background-color:#6368D5; }
.section-wrap .last-5year .last-5year-graph .years { position:absolute; bottom:-25px; padding:0 20px;}
.section-wrap .last-5year .last-5year-graph .years ul li { float:left; width:49.5px; margin-right:35px; text-align:center; color:#a4a4a4; font-size:12px; font-weight:700; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .last-5year .last-5year-graph .years ul li:last-child { margin:0; }

.section-wrap .section-right { float:left; margin-left:30px; }
.section-wrap .section-right .ptotal-info { position:relative; width:650px; height:150px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 40px; box-sizing: border-box; }
.section-wrap .section-right .ptotal-info::after { content:""; clear:both; display:block; }
.section-wrap .section-right .ptotal-info .p-count-list { position:absolute; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); left:40px;  }
.section-wrap .section-right .ptotal-info .p-count-list ul li { line-height:1em; margin-bottom:14px; }
.section-wrap .section-right .ptotal-info .p-count-list ul li:last-child { margin-bottom:0; }
.section-wrap .section-right .ptotal-info .p-count-list ul li dl dt { display:inline-block; vertical-align:middle; font-size:16px; color:#333; min-width:80px; line-height:1em; }
.section-wrap .section-right .ptotal-info .p-count-list ul li dl dd { display:inline-block; vertical-align:middle; font-size:14px; color:#777; padding-left:35px; line-height:1em; }
.section-wrap .section-right .ptotal-info .p-count-list ul li dl dd span { color:#4f5bf1; font-size:18px; font-weight:700; }

.section-wrap .section-right .ptotal-info .gender-rate::after { clear:both; display:block; content:""; }
.section-wrap .section-right .ptotal-info .gender-rate { position:absolute; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); right:40px;}
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item { float:left; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item:nth-child(2) { margin-left:30px; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info { display:inline-block; vertical-align: middle; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span { display:block; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.gender { font-size:14px; color:#777; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.gender-f-rate { font-size:24px; color:#333; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate { position:relative; font-size:18px; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate::after { content:""; position:absolute; /*right:10px;*/ top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:9px; height:12px; background-size:9px 12px; background-repeat:no-repeat; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate.dec { color:#d6196b; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate.dec::after { background-image:url(../images/dec_arrow.svg); }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate.inc { color:#00aeef; }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item .gender-info span.yoy-rate.inc::after { background-image:url(../images/inc_arrow.svg); }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item i { display:inline-block; vertical-align: middle; width:72px; height:72px; background-size:72px; background-position:center; margin-left:8px;}
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item i.ico-gf { background-image:url(../images/ico_gf.svg); }
.section-wrap .section-right .ptotal-info .gender-rate ul li.gender-item i.ico-gm { background-image:url(../images/ico_gm.svg); }

.section-wrap .section-right .employment-rate { position:relative; width:650px; height:142px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 35px; margin-top:26px; }
.section-wrap .section-right .employment-rate strong.tit { position:absolute; display:block; left:35px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; font-size:20px; font-weight:400; letter-spacing:-0.02em; color:#333; }
.section-wrap .section-right .employment-rate strong.tit span { font-weight:700; }
.section-wrap .section-right .employment-rate .SC-date { position:absolute; right:35px; top:15px; color:#777; font-size:18px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; line-height:1em; }
.section-wrap .section-right .employment-rate .SC-date span { display:inline-block; vertical-align: middle; }
.section-wrap .section-right .employment-rate .SC-date span.tit { font-size:14px; margin-right:10px; }
.section-wrap .section-right .employment-rate .rate-data { position:absolute; bottom:25px; right:35px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .section-right .employment-rate .rate-data span { display:inline-block; vertical-align: middle; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-tit { color:#777; font-size:18px; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate { position:relative; font-size:18px; padding-right:20px; margin-left:17px; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate::after { content:""; position:absolute; right:10px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:9px; height:12px; background-size:9px 12px; background-repeat:no-repeat; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate.dec { color:#d6196b; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate.dec::after { background-image:url(../images/dec_arrow.svg); }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate.inc { color:#00aeef; }
.section-wrap .section-right .employment-rate .rate-data span.yoy-rate.inc::after { background-image:url(../images/inc_arrow.svg); }
.section-wrap .section-right .employment-rate .rate-data span.real-rate { font-size:40px; color:#5360f0; margin-left:25px; }


.section-wrap .yoy-br { float:left; width:459px; height:335px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 35px; }
.section-wrap .yoy-br strong.tit { display:block; margin-bottom:28px; font-size:20px; font-weight:400; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; color:#333; letter-spacing:-0.05em; }
.section-wrap .yoy-br strong.tit span { font-weight:700; }
.section-wrap .yoy-br .br-con { position:relative }
.section-wrap .yoy-br .br-con .br-map img { vertical-align: top; }
.section-wrap .yoy-br .br-con .br-rate { position:absolute; top:15px; right:40px; line-height:1em;  }
.section-wrap .yoy-br .br-con .br-rate ul li { margin-bottom:18px}
.section-wrap .yoy-br .br-con .br-rate ul li .br-n  { margin-bottom:10px;}
.section-wrap .yoy-br .br-con .br-rate ul li .br-n strong { font-size:18px; font-weight:400; color:#333; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .yoy-br .br-con .br-rate ul li .br-n span { font-size:11px; color:#838685; padding-left:13px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap strong { color:#5360f0; font-size:12px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; font-weight:400; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap strong em { color:#5360f0; font-size:24px; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span { position:relative;  padding-left:38px; padding-right:15px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span::after { content:""; position:absolute; right:0px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:9px; height:12px; background-size:9px 12px; background-repeat:no-repeat; } 
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span.dec { color:#d6196b; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span.dec::after { background-image:url(../images/dec_arrow.svg); }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span.inc { color:#00aeef; }
.section-wrap .yoy-br .br-con .br-rate ul li .rate-wrap span.inc::after { background-image:url(../images/inc_arrow.svg); }

.section-wrap .yoy-be { float:left; margin-left:30px; width:340px; height:335px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 35px; }
.section-wrap .yoy-be strong.tit { display:block; margin-bottom:28px; font-size:20px; font-weight:400; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; color:#333; letter-spacing:-0.05em; }
.section-wrap .yoy-be strong.tit span { font-weight:700; }
.section-wrap .yoy-be .be-list ul li { display:table; width:100%; }
.section-wrap .yoy-be .be-list ul li strong.item-name { display:table-cell; width:55%; font-size:16px; color:#777; font-weight:400;  }
.section-wrap .yoy-be .be-list ul li span.item-rate { display:table-cell; width:25%; color:#909498; font-size:16px; }
.section-wrap .yoy-be .be-list ul li span.item-di {display:table-cell; width:20%; color:#777; font-size:16px; position:relative; padding-right:15px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .yoy-be .be-list ul li span.item-di::after { content:""; position:absolute; right:0px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:9px; height:12px; background-size:9px 12px; background-repeat:no-repeat; } 
.section-wrap .yoy-be .be-list ul li span.dec { color:#d6196b; }
.section-wrap .yoy-be .be-list ul li span.dec::after { background-image:url(../images/dec_arrow.svg); }
.section-wrap .yoy-be .be-list ul li span.inc { color:#00aeef; }
.section-wrap .yoy-be .be-list ul li span.inc::after { background-image:url(../images/inc_arrow.svg); }

.section-wrap .yoy-bc { float:left; margin-left:30px; width:340px; height:335px; border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,0.05); background-color:#fff; padding:25px 35px; }
.section-wrap .yoy-bc strong.tit { display:block; margin-bottom:28px; font-size:20px; font-weight:400; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; color:#333; letter-spacing:-0.05em; }
.section-wrap .yoy-bc strong.tit span { font-weight:700; }
.section-wrap .yoy-bc .bc-list ul li { display:table; width:100%; }
.section-wrap .yoy-bc .bc-list ul li strong.item-name { display:table-cell; width:55%; font-size:16px; color:#777; font-weight:400;  }
.section-wrap .yoy-bc .bc-list ul li span.item-rate { display:table-cell; width:25%; color:#909498; font-size:16px; }
.section-wrap .yoy-bc .bc-list ul li span.item-di {display:table-cell; width:20%; color:#777; font-size:16px; position:relative; padding-right:15px; font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; }
.section-wrap .yoy-bc .bc-list ul li span.item-di::after { content:""; position:absolute; right:0px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:9px; height:12px; background-size:9px 12px; background-repeat:no-repeat; } 
.section-wrap .yoy-bc .bc-list ul li span.dec { color:#d6196b; }
.section-wrap .yoy-bc .bc-list ul li span.dec::after { background-image:url(../images/dec_arrow.svg); }
.section-wrap .yoy-bc .bc-list ul li span.inc { color:#00aeef; }
.section-wrap .yoy-bc .bc-list ul li span.inc::after { background-image:url(../images/inc_arrow.svg); }


.sub-visual { width:100%; height:126px; line-height:126px; background-color:#5360f0; background-image:url(../images/sub_visual_bg.png); background-repeat:no-repeat; background-size:cover; }
.sub-visual h2 { text-align:center; color:#fff; font-size:30px;}

.sub-contents .cont-top { padding:20px 0; border-bottom:2px solid #38383a; }
.sub-contents .cont-top::after { content:""; clear:both; display:block; }
.sub-contents .cont-top .select-area { float:left; }
.sub-contents .cont-top .select-area span { display:inline-block; vertical-align: middle;}
.sub-contents .cont-top .select-area .y-select { margin-right:10px; font-size:18px; }
.sub-contents .cont-top .select-area .y-select::before { content:""; display:inline-block; vertical-align: middle; width:21px; height:23px; background-image: url(../images/y_select.png); background-repeat:no-repeat; background-position:center; margin-right:8px; }
.sub-contents .cont-top .select-area  select#ys { border:1px solid #e0e5ed; border-radius:5px; padding:10px; vertical-align: middle; width:110px; margin-right:8px; }
.sub-contents .cont-top .select-area  select#ms { border:1px solid #e0e5ed; border-radius:5px; padding:10px; vertical-align: middle; width:110px; margin-right:8px; }
.sub-contents .cont-top .top-btns { float:right }
.sub-contents .cont-top .top-btns button { height:47px; border:1px solid #e0e5ed; padding:10px 15px; font-size:16px; margin-left:5px; border-radius:5px; line-height:1em }
.sub-contents .cont-top .top-btns button span { display:inline-block; vertical-align: middle; margin-left:8px; padding-left:8px; border-left: 1px solid #e0e5ed; }
.sub-contents .cont-top .top-btns button.down-excel::before { content:""; display:inline-block; vertical-align: middle; width:21px; height:20px; background-image:url(../images/down_excel.png); background-repeat:no-repeat; background-position:center;  }
.sub-contents .cont-top .top-btns button.down-excel { box-shadow: 0 0 #c4d3e9; transition:all 0.5s; }
.sub-contents .cont-top .top-btns button.down-excel:hover { box-shadow: 0 4px #c4d3e9; transition:all 0.5s; }
.sub-contents .cont-top .top-btns button.print-btn::before { content:""; display:inline-block; vertical-align: middle; width:21px; height:21px; background-image:url(../images/print-btn.png); background-repeat:no-repeat; background-position:center;  }
.sub-contents .cont-top .top-btns button.print-btn { box-shadow: 0 0 #c4d3e9; transition:all 0.5s; }
.sub-contents .cont-top .top-btns button.print-btn:hover { box-shadow: 0 4px #c4d3e9; transition:all 0.5s; }
.sub-contents .cont-top .top-btns button.reset-btn { border:1px solid #38383a; background-color:#38383a; color:#fff; }
.sub-contents .cont-top .top-btns button.reset-btn span { border:none; margin-left:0; margin-right:8px; padding-left:0; }
.sub-contents .cont-top .top-btns button.reset-btn::after { content:"";  display:inline-block; vertical-align: middle; width:19px; height:18px; background-image:url(../images/reset_btn.png); background-repeat:no-repeat; background-position:center; transform:rotate(0deg); transition:all 0.5s; }
.sub-contents .cont-top .top-btns button.reset-btn:hover::after { transform:rotate(360deg); transition:all 0.5s; }

.sub-contents .detail-search { padding:20px 0;  }
.sub-contents .detail-search::after { content:""; clear:both; display:block; }
.sub-contents .detail-search .select-area { float:left; }
.sub-contents .detail-search .select-area span { display:inline-block; vertical-align: middle;}
.sub-contents .detail-search .select-area .line-select { margin-right:10px; font-size:18px; }
.sub-contents .detail-search .select-area .dep-select { margin:0 10px 0 20px; font-size:18px; }
.sub-contents .detail-search .select-area  select#lines { border:1px solid #e0e5ed; border-radius:5px; padding:10px; vertical-align: middle; width:180px; margin-right:8px; }
.sub-contents .detail-search .select-area  select#department { border:1px solid #e0e5ed; border-radius:5px; padding:10px; vertical-align: middle; width:180px; margin-right:8px; }
.sub-contents .detail-search .detail-reset { float:right }
.sub-contents .detail-search .detail-reset button { height:47px; border:1px solid #e0e5ed; padding:10px 15px; font-size:16px; margin-left:5px; border-radius:5px; line-height:1em }
.sub-contents .detail-search .detail-reset button span { display:inline-block; vertical-align: middle; margin-left:8px; padding-left:8px; border-left: 1px solid #e0e5ed; }
.sub-contents .detail-search .detail-reset button.reset-btn { border:1px solid #38383a; background-color:#38383a; color:#fff; }
.sub-contents .detail-search .detail-reset button.reset-btn span { border:none; margin-left:0; margin-right:8px; padding-left:0; }
.sub-contents .detail-search .detail-reset button.reset-btn::after { content:"";  display:inline-block; vertical-align: middle; width:19px; height:18px; background-image:url(../images/reset_btn.png); background-repeat:no-repeat; background-position:center; transform:rotate(0deg); transition:all 0.5s; }
.sub-contents .detail-search .detail-reset button.reset-btn:hover::after { transform:rotate(360deg); transition:all 0.5s; }

.sub-contents .cont { padding:50px 0 80px 0; }
.sub-contents .cont .con-tab { margin-bottom:35px; }
.sub-contents .cont .con-tab ul { display:flex; justify-content:center;  }
.sub-contents .cont .con-tab ul li { padding:0 20px; border-left:1px solid #e0e5ed;}
.sub-contents .cont .con-tab ul li:first-child { border:none; }
.sub-contents .cont .con-tab ul li a { display:block; font-size:18px; font-weight:bold; color:#a5a6ac; }
.sub-contents .cont .con-tab ul li.active a { color:#000; }
.sub-contents .cont .con-tab ul li a:hover { color:#000; }

.sub-contents .cont .tab-contents .tab-con { display:none; opacity:0; transition:all 0.5s; position:relative; }
.sub-contents .cont .tab-contents .tab-con::after { content:""; clear:both; display:block; }
.sub-contents .cont .tab-contents .tab-con.on { display:block; opacity:1; transition:all 0.5s }

.sub-contents .cont .tab-contents .tab-con .content-left { float:left; position:relative; width:570px; }
.sub-contents .cont .tab-contents .tab-con .content-right { float:left; position:relative; width:570px; margin-left:60px; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap { margin-bottom:10px; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap::after { content:""; clear:both; display:block; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap strong.table-tit { display:block; font-size:20px; padding-left:30px; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap strong.table-tit::before { content:""; display:block; width:24px; height:25px; position:absolute; left:0; top:2px; background-image:url(../images/ico_p.png); background-size:24px 25px; background-repeat:no-repeat; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap p.table-info { display:block; position:absolute; right:0; top:5px; color:#4447de; letter-spacing:-0.05em; }
.sub-contents .cont .tab-contents .tab-con .table-info-wrap p.table-info.float { position:static; float:right;}

.con-table table {  width:100%; border-collapse: separate; border-spacing: 0; font-size:15px; }
.con-table table thead tr th { position:relative;border-right:1px solid #fff; background-color:#6e737f; color:#fff; padding:15px 8px; text-align:left; }
.con-table table thead tr th.tc { text-align:center; }
.con-table table thead tr th.bd { border-bottom:1px solid #fff;}
.con-table table thead tr th.ib { border-right:1px solid #fff !important; }
.con-table table thead tr th:last-child { border-right:none; text-align:center; }
.con-table table thead tr th a { position:absolute; right:5px; width:10px; height:7px; display:block; }
.con-table table thead tr th a.asc { background-image:url(../images/asc_arrow.png); background-repeat:no-repeat; background-position:center; top:6px; }
.con-table table thead tr th a.desc { background-image:url(../images/desc_arrow.png); background-repeat:no-repeat; background-position:center; bottom:6px; }
.con-table table tbody tr th { text-align:center; border-right:1px solid #e0e5ed; border-bottom:1px solid #e0e5ed; padding:15px 0; background-color:#f6f7f8; }
.con-table table tbody tr td { position:relative; text-align:center; border-right:1px solid #e0e5ed; border-bottom:1px solid #e0e5ed; padding:15px 0; }
.con-table table tbody tr th:first-child { border-left:1px solid #e0e5ed; }
.con-table table tbody tr th.ib { border-left:1px solid #e0e5ed; }
.con-table table tbody tr td.ib { border-left:1px solid #e0e5ed; }
.con-table table tbody tr td span { position:relative; }
.con-table table tbody tr td.inc { color:#ff0000; }
.con-table table tbody tr td.inc span::before { content:""; position:absolute; left:-15px; top:50%;  transform:translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); display:block;  width: 0; height: 0; border-style: solid; border-width: 0 4px 5px 4px; border-color: transparent transparent #ff0000 transparent; }
.con-table table tbody tr td.dec { color:#2456e4; }
.con-table table tbody tr td.dec span::before { content:""; position:absolute; left:-15px; top:50%;  transform:translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); display:block;  width: 0; height: 0; border-style: solid; border-width: 5px 4px 0 4px; border-color: #2456e4 transparent transparent transparent; }
.con-table table tbody tr td.avg { color:#7ed273; font-size:1.1em; font-weight:bold; }
.con-table table tbody tr.total th { background-color:#e1f7ff }
.con-table table tbody tr.total td { background-color:#e1f7ff }
.con-table table tbody tr.no-data td { color:#333; font-size:18px; }

.notice-top { margin-bottom:10px}
.notice-top::after { content:""; clear:both; display:block; }
.notice-top .notice-count { float:left; line-height:47px; }
.notice-top .notice-count strong { display:inline-block; vertical-align: middle; font-size:19px; letter-spacing: -0.05em; }
.notice-top .notice-count strong span { color:#00aeef; }
.notice-top .notice-count p { display:inline-block; vertical-align: middle; letter-spacing: -0.05em; }
.notice-top .notice-count p span { color:#00aeef; }
.notice-top .notice-search { float:right;  }
.notice-top .notice-search select { display:inline-block; vertical-align: middle; height:47px; border:1px solid #e0e5ed; border-radius:5px; padding:10px; vertical-align: middle; width:110px; margin-right:8px; box-sizing: border-box; }
.notice-top .notice-search .notice-search-box { position:relative; display:inline-block; vertical-align: middle; border:1px solid #dadada; background-color:#f6f7f8; padding:10px 35px 10px 10px; border-radius:5px; height:47px; box-sizing: border-box; }
.notice-top .notice-search .notice-search-box input { outline:none; border:none; background-color:transparent;  }
.notice-top .notice-search .notice-search-box button.search-btn { position:absolute; right:10px; top:13px; width:22px; height:22px; text-indent:-9999em; background-image:url(../images/ico_s.png); background-size:22px; background-repeat:no-repeat; }
.notice-top .notice-search button.reset-btn { display:inline-block; vertical-align: middle; height:47px; box-sizing: border-box;  padding:10px 15px; font-size:16px; margin-left:5px; border-radius:5px; line-height:1em; border:1px solid #38383a; background-color:#38383a; color:#fff; }
.notice-top .notice-search button.reset-btn span { display:inline-block; vertical-align: middle; margin-right:8px; }
.notice-top .notice-search button.reset-btn::after { content:"";  display:inline-block; vertical-align: middle; width:19px; height:18px; background-image:url(../images/reset_btn.png); background-repeat:no-repeat; background-position:center; transform:rotate(0deg); transition:all 0.5s; }
.notice-top .notice-search button.reset-btn:hover::after { transform:rotate(360deg); transition:all 0.5s; }

.notice-table { width:100%; table-layout: fixed;}
.notice-table tr th { border-top:2px solid #38383a; border-bottom:1px solid #000; padding:15px 0 }
.notice-table tr td { padding:15px; border-bottom:1px solid #dadada; }
.notice-table tr td.notice-num { text-align:center; }
.notice-table tr td.notice-subject { position:relative; padding:15px 20px;}
.notice-table tr td.notice-subject.inotice { padding:15px 15px 15px 75px; }
.notice-table tr td.notice-subject.inotice::before { content:"공지"; position:absolute; left:15px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background-color:#00aeef; color:#fff; padding:5px 10px;}
.notice-table tr td.notice-subject a { display:block; width:100%; overflow:hidden; white-space: nowrap; text-overflow:ellipsis; color:#000 }
.notice-table tr td.notice-date { text-align:center; color:#8d8d8d; }


.notice-list-wrap .notice-list-paging { display:table; position:relative; margin:40px auto 0 auto; }
.notice-list-wrap .notice-list-paging .page-control { display:table-cell; vertical-align:top; }
.notice-list-wrap .notice-list-paging .page-control a { display:inline-block; width:35px; height:35px; border:1px solid #dadada; overflow:hidden; font-size:0; }
.notice-list-wrap .notice-list-paging .page-control a.first-page::before { content:""; display:block; width:100%; height:100%; background-image:url(../images/board_pre_end.png); background-repeat:no-repeat; background-position:50% 50%; }
.notice-list-wrap .notice-list-paging .page-control a.prev-page::before { content:""; display:block; width:100%; height:100%; background-image:url(../images/board_prev.png); background-repeat:no-repeat; background-position:50% 50%; }

.notice-list-wrap .notice-list-paging .page-number { display:table-cell; vertical-align:top; padding:0 5px }
.notice-list-wrap .notice-list-paging .page-number a { display:inline-block; width:35px; height:35px; line-height:35px; border:1px solid #dadada; overflow:hidden; vertical-align:middle; text-align:center; transition:all 0.5s; box-sizing: border-box; }
.notice-list-wrap .notice-list-paging .page-number a.active {  border:2px solid #00aeef; color:#00aeef; }
.notice-list-wrap .notice-list-paging .page-number a:hover {  border:2px solid #00aeef; color:#00aeef; transition:all 0.5s }

.notice-list-wrap .notice-list-paging .page-control a.last-page::before { content:""; display:block; width:100%; height:100%; background-image:url(../images/board_next_end.png); background-repeat:no-repeat; background-position:50% 50%; }
.notice-list-wrap .notice-list-paging .page-control a.next-page::before { content:""; display:block; width:100%; height:100%; background-image:url(../images/board_next.png); background-repeat:no-repeat; background-position:50% 50%; }


.notice-view-wrap .view-top { border-top:2px solid #38383a; border-bottom:1px solid #dadada; padding:30px 20px; }
.notice-view-wrap .view-top strong.view-subject { display:block; text-align:center;  font-size:25px; font-weight:normal; word-break: keep-all; }
.notice-view-wrap .view-top dl { text-align:center; margin-top:30px; }
.notice-view-wrap .view-top dl dt { position:relative; display:inline-block; vertical-align: middle; color:#8d8d8d; padding-right:10px; }
.notice-view-wrap .view-top dl dt::after { content:""; display:block; position:absolute; right:0; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); width:1px; height:14px; background-color:#e1e1e1; }
.notice-view-wrap .view-top dl dd { display:inline-block; vertical-align: middle; color:#8d8d8d; padding-left:4px; }

.notice-view-wrap .view-content { white-space: pre-wrap; padding:30px 20px 80px 20px; border-bottom:1px solid #dadada;}
.notice-view-wrap .view-files { position:relative; border-bottom:1px solid #dadada; padding:20px; }
.notice-view-wrap .view-files .file-list { width:90%; }
.notice-view-wrap .view-files .file-list::after { content:""; clear:both; display:block }
.notice-view-wrap .view-files .file-list ul li { float:left; margin:8px; }
.notice-view-wrap .view-files .file-list ul li a { position:relative; display:block; padding:12px 45px 12px 20px; border:1px solid #dadada; border-radius:30px; line-height:1em; color:#000; }
.notice-view-wrap .view-files .file-list ul li a::after { content:""; position:absolute; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); right:5px; background-color:#edeff0; border-radius:20px; width:28px; height:28px; background-image:url(../images/down_btn.png); background-size:15px; background-position:center; background-repeat:no-repeat; }

.notice-view-wrap .view-files .all-download-btn { position:absolute; right:20px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); }
.notice-view-wrap .view-files .all-download-btn button { position:relative; font-size:16px; border:1px solid #dadada; border-radius:5px; padding:8px 40px 8px 15px; letter-spacing:-0.05em; transition:all 0.5s; }
.notice-view-wrap .view-files .all-download-btn button::after { content:""; position:absolute; right:15px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);  width:15px; height:15px; background-image:url(../images/down_btn.png); background-size:15px; background-repeat:no-repeat; }
.notice-view-wrap .view-files .all-download-btn button:hover { box-shadow: 4px 4px #ddd; transition:all 0.5s; }

.notice-view-wrap a.list-back { display:block; text-align:center; width:120px; font-size:18px; color:#000; border:1px solid #dadada; border-radius:5px; padding:8px 15px; margin:30px auto 0 auto; letter-spacing:-0.05em; transition:all 0.5s}
.notice-view-wrap a.list-back:hover { background-color:#dadada; color:#fff; transition:all 0.5s }

.con-pgraph-wrap { width:1137px; margin:0 auto; box-sizing: border-box; }
.con-pgraph-wrap::after { content:""; clear:both; display:block; }
.con-pgraph { float:left; width:541px; border:1px solid #E0E5ED; padding:20px 50px; box-sizing: border-box; }
.con-pgraph::after { content:""; clear:both; display:block  }
.con-pgraph strong { display:block; text-align:center; font-size:16px; color:#231815; margin-bottom:25px; font-weight:400; }
.con-pgraph strong span { color:#515df1 }
.con-pgraph:nth-child(2n) { margin-left:55px; }
.con-pgraph:nth-child(n+3) { margin-top:55px; }

.con-pgraph .pgraph-area { position:relative; width:198px; height:165px; float:left;}
.con-pgraph .pgraph-m { position:absolute; width:77px; left:111px; bottom:0;  }
.con-pgraph .pgraph-m .graph-box { position:relative; width:77px; height:165px;}
.con-pgraph .pgraph-m .graph-box .bg-image { position:absolute; width:100%; height:165px; background-image:url(../images/p_graph_m.png); background-size:77px 165px; background-repeat:no-repeat; z-index:1; }
.con-pgraph .pgraph-m .graph-box .bg { position:absolute; width:100%; height:165px; background-color:#ddd; z-index:0}
.con-pgraph .pgraph-m .graph-box .bg-bar { position:absolute; background-color:#2464E5; width:100%; z-index:0;  bottom:0; }
.con-pgraph .pgraph-f { position:absolute; width:77px; left:19px; bottom:0; }
.con-pgraph .pgraph-f .graph-box{ position:relative; width:77px; height:165px; }
.con-pgraph .pgraph-f .graph-box .bg-image { position:absolute; width:100%; height:165px; background-image:url(../images/p_graph_f.png); background-size:77px 165px; background-repeat:no-repeat; z-index:1; }
.con-pgraph .pgraph-f .graph-box .bg { position:absolute; width:100%; height:165px; background-color:#ddd; z-index:0; overflow:hidden}
.con-pgraph .pgraph-f .graph-box .bg-bar { position:absolute; background-color:#F365A3; width:100%; z-index:0; bottom:0; overflow:hidden }

.con-pgraph2 { width:100%; border:1px solid #E0E5ED; padding:20px 50px; box-sizing: border-box; }
.con-pgraph2::after { content:""; clear:both; display:block  }
.con-pgraph2 strong { display:block; text-align:center; font-size:16px; color:#231815; margin-bottom:25px; font-weight:400; }
.con-pgraph2 strong span { color:#515df1 }
.con-pgraph2 .pgraph-item-wrap { width:775px; margin:0 auto; padding:0 25px; }
.con-pgraph2 .pgraph-item-wrap::after { content:""; clear:both; display:block; }
.con-pgraph2 .pgraph-item { float:left; width:200px; margin-left:62px; }
.con-pgraph2 .pgraph-item:nth-of-type(1) { margin-left:0; }
.con-pgraph2 .pgraph-area { position:relative; width:200px; height:171px; }
.con-pgraph2 .pgraph-m { position:absolute; width:32px; right:32%; bottom:0; overflow:hidden }
.con-pgraph2 .pgraph-m .graph-box { position:relative; width:32px; height:171px;}
.con-pgraph2 .pgraph-m .graph-box .bg-image { position:absolute; bottom:-100%; width:100%; height:171px; background-image:url(../images/p_graph_m2.png); background-size:32px 171px; background-repeat:no-repeat; z-index:1; }
.con-pgraph2 .pgraph-f { position:absolute; width:38px; left:32%; bottom:0; overflow:hidden}
.con-pgraph2 .pgraph-f .graph-box{ position:relative; width:38px; height:171px; }
.con-pgraph2 .pgraph-f .graph-box .bg-image { position:absolute; bottom:-100%; width:100%; height:171px; background-image:url(../images/p_graph_f2.png); background-size:38px 171px; background-repeat:no-repeat; z-index:1; }



.con-pgraph .pgraph-lines { position:relative; width:100%; height:165px; }
.con-pgraph2 .pgraph-lines { position:relative; width:100%; height:171px; }

.pgraph-lines span { position:absolute; display:block; width:100%; height:1px; /*background-color:rgba(218, 218, 218, 0.5);*/ z-index:1; }
.con-pgraph2 .pgraph-lines span { background-color:rgba(218, 218, 218, 0.5); }
.pgraph-lines span.p100 { top:0; }
.pgraph-lines span.p100::before { content:"100"; display:block; position:relative; left:-25px; top:-8px; font-size:10px; letter-spacing:-0.02em; color:#909498 }
.pgraph-lines span.p90 { bottom:90%; }
.pgraph-lines span.p80 { bottom:80%; }
.pgraph-lines span.p70 { bottom:70%; }
.pgraph-lines span.p60 { bottom:60%; }
.pgraph-lines span.p50 { bottom:50%; }
.pgraph-lines span.p50::before { content:"50"; display:block; position:relative; left:-20px; top:-8px; font-size:10px; letter-spacing:-0.02em; color:#909498 }
.pgraph-lines span.p40 { bottom:40%; }
.pgraph-lines span.p30 { bottom:30%; }
.pgraph-lines span.p20 { bottom:20%; }
.pgraph-lines span.p10 { bottom:10%; }
.pgraph-lines span.p0 { bottom:0; }
.pgraph-lines span.p0::before { content:"0"; display:block; position:relative; left:-13px; top:-8px; font-size:10px; letter-spacing:-0.02em; color:#909498 }

.con-pgraph .pgraph-rate { float:left; width:241px; position:relative; box-sizing: border-box; padding:43.5px 0 43.5px 60px; }
.con-pgraph .pgraph-rate::after { content:""; clear:both; display:block; }
.con-pgraph .pgraph-rate .female { float:left }
.con-pgraph .pgraph-rate .male { float:left; margin-left:30px; }
.con-pgraph .pgraph-rate p { color:#909498; font-size:14px; margin-bottom:9px; }
.con-pgraph .pgraph-rate span > span { font-size:12px; }
.con-pgraph .pgraph-rate span.pcdm { color:#2464E5; text-align:center; font-size:30px; font-weight:bold; }
.con-pgraph .pgraph-rate span.pcdf { color:#F365A3; text-align:center; font-size:30px; font-weight:bold; }

.con-pgraph2 .pgraph-rate { width:100%; position:relative; box-sizing: border-box; padding:10px; }
.con-pgraph2 .pgraph-rate::after { content:""; clear:both; display:block; }
.con-pgraph2 .pgraph-rate .female { float:left; width:50%; text-align:center }
.con-pgraph2 .pgraph-rate .male { float:left; width:50%; text-align:center }
.con-pgraph2 .pgraph-rate p { color:#909498; font-size:14px; margin-bottom:9px; }
.con-pgraph2 .pgraph-rate span > span { font-size:12px; }
.con-pgraph2 .pgraph-rate span.pcdm { color:#2464E5; text-align:center; font-size:30px; font-weight:bold; }
.con-pgraph2 .pgraph-rate span.pcdf { color:#F365A3; text-align:center; font-size:30px; font-weight:bold; }

.con-pgraph2 p.pgraph-year { text-align:center; color:#909498; font-size:14px; letter-spacing: -0.02em; margin-top:20px;}

#footer { font-family:'Noto Sans KR', 'Spoqa Han Sans Neo', sans-serif; padding:20px 0; border-top:1px solid #ddd; background-color:#f6f7f8}
#footer p { text-align:center; color:#9a9a9a }