@charset "utf-8";

.mainContLayout01 { position:relative; width:1150px; height:434px; margin:0 auto; }
.mainContLayout01 article { position:absolute; box-sizing:border-box; font-family:notokr-regular; }
.mainContLayout01 article h3 { font-size:24px; color:#fff; margin-left:42px; letter-spacing:-1px; }

/* 은평구 요약통계 */
.mainStat { padding:40px 0 0 45px; left:-12px; top:-8px; width:602px; height:442px; background:url(../img/main/bg_main_stat.png) no-repeat 0 0; background-size:100% auto; }
.mainStat h3 { color:#000; line-height:140%; display:inline-block;}

.tblListMain {width:330px; table-layout:fixed; border-collapse:collapse; position:absolute; top:45px; right:35px; font-family:notokr-medium; color:#fff; }
.tblListMain thead th { height:35px; font-weight:normal; }
.tblListMain tbody th { height:40px; text-align:left; text-indent:25px;font-weight:normal; }
.tblListMain tbody td { height:40px; text-align:center; }

/* 통계로 보는 은평 */
.mainShortcut { padding:47px 0 0 45px; top:-8px; right:-22px; width:602px; height:214px; background:url(../img/main/bg_main_shortcut.png) no-repeat 0 0; background-size:100% auto; }
.mainShortcut h3 { padding-bottom:36px;}
.mainShortcut a { display:inline-block; width:158px; height:46px; line-height:46px; font-family:notokr-medium; font-size:15px; color:#fff; text-indent:20px; margin:0 7px 0 3px; box-sizing:border-box; background:#19aa89 url(../img/main/arrow_main03.png) no-repeat 135px center; background-size:7px auto;}
.mainShortcut a:hover { color:#25b393; background:#fff url(../img/main/arrow_main04.png) no-repeat 135px center; background-size:7px auto;}

/* 은평 마을지도 */
.mainEpMap { padding:8px 0 0 12px; right:-22px; top:186px; width:602px; height:214px; background:url(../img/main/bg_main_epmap.png) no-repeat 0 0; background-size:100% auto;}
.mainEpMap a { display:block; width:568px; height:180px; padding:38px 0 0 32px; box-sizing:border-box;}
.mainEpMap  p { line-height:150%; margin-top:19px; letter-spacing:-1px; color:#fff;}

/* 주제별 통계 , 데이터 개방 */
.mainSubject, .mainOpendata { clear:both; width:1150px; margin:0 auto; box-sizing:border-box; }

.mainOpendata { margin-top:28px; padding-top:26px; border-top:1px solid #e2e2e2;}

.mainSubject h3, .mainOpendata h3 { display:inline-block; font-size:22px; width:140px; height:70px; line-height:50px; vertical-align:middle; }
.mainSubject h3, .mainSubject a:hover  { color:#4460aa; }
.mainOpendata h3, .mainOpendata a:hover { color:#25b393; }
.mainSubject a, .mainOpendata a { display:inline-block; width:90px; height:70px; padding-top:52px; margin:0 0 0 8px; text-align:center; vertical-align:middle; box-sizing:border-box; }

.mainSubject .subject01 { background:url(../img/main/main_subject01_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject02 { background:url(../img/main/main_subject02_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject03 { background:url(../img/main/main_subject03_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject04 { background:url(../img/main/main_subject04_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject05 { background:url(../img/main/main_subject05_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject06 { background:url(../img/main/main_subject06_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject07 { background:url(../img/main/main_subject07_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject08 { background:url(../img/main/main_subject08_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject09 { background:url(../img/main/main_subject09_out.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject10 { background:url(../img/main/main_subject10_out.png) no-repeat center 0; background-size:auto 48px; }

.mainSubject .subject01:hover { background:url(../img/main/main_subject01_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject02:hover { background:url(../img/main/main_subject02_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject03:hover { background:url(../img/main/main_subject03_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject04:hover { background:url(../img/main/main_subject04_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject05:hover { background:url(../img/main/main_subject05_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject06:hover { background:url(../img/main/main_subject06_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject07:hover { background:url(../img/main/main_subject07_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject08:hover { background:url(../img/main/main_subject08_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject09:hover { background:url(../img/main/main_subject09_over.png) no-repeat center 0; background-size:auto 48px; }
.mainSubject .subject10:hover { background:url(../img/main/main_subject10_over.png) no-repeat center 0; background-size:auto 48px; }

.mainOpendata .data01 {background:url(../img/main/main_data01_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data02 {background:url(../img/main/main_data02_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data03 {background:url(../img/main/main_data03_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data04 {background:url(../img/main/main_data04_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data05 {background:url(../img/main/main_data05_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data06 {background:url(../img/main/main_data06_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data07 {background:url(../img/main/main_data07_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data08 {background:url(../img/main/main_data08_out.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data09 {background:url(../img/main/main_data09_out.png) no-repeat center 0; background-size:auto 48px;}

.mainOpendata .data01:hover {background:url(../img/main/main_data01_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data02:hover {background:url(../img/main/main_data02_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data03:hover {background:url(../img/main/main_data03_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data04:hover {background:url(../img/main/main_data04_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data05:hover {background:url(../img/main/main_data05_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data06:hover {background:url(../img/main/main_data06_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data07:hover {background:url(../img/main/main_data07_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data08:hover {background:url(../img/main/main_data08_over.png) no-repeat center 0; background-size:auto 48px;}
.mainOpendata .data09:hover {background:url(../img/main/main_data09_over.png) no-repeat center 0; background-size:auto 48px;}

/* 뉴스 & 자료링크 */
.mainContLayout02 { width:1150px; margin:50px auto; overflow:hidden;}
.mainNewsWrap { position:relative; float:left; width:725px; height:207px; margin-top:10px; background:url(../img/main/bg_news.png) no-repeat 0 0; background-size:825px auto; }

.mainNews h3 { position:absolute; top:0; left:0; width:150px; height:46px; font-size:16px; color:#9b9b9b; line-height:46px;  text-indent:20px; font-weight:normal;}
.mainNews h3 a { display:block;  background:#f4f4f4 url(../img/main/arrow_main02.png) no-repeat 120px center; background-size:8px auto;}
.mainNews h3 a.current { color:#fff; background:#a2a5b1 url(../img/main/arrow_main01.png) no-repeat 120px center; background-size:8px auto; }
.mainNews h3.newTit01 {}
.mainNews h3.newTit02 {left:151px;}
.mainNews h3.newTit02 a { background-color:#ededed; }
.mainNews h3.newTit02 a.current {background-color:#a2a5b1 !important;}
.mainNews h3.newTit03 { width:170px; left:302px;}
.mainNews h3.newTit03 a { background-position:140px center;}

.mainNews ul { display:none; margin-top:70px;}
.mainNews ul li { font-size:13px; color:#585858; margin:18px 25px 0 0; padding-left:8px; background:url(../img/main/bul_news.png) no-repeat 0 7px; background-size:4px auto; }
.mainNews ul li strong {/*font-family:notokr-medium;*/font-family: notokr-regular; font-size: 14px;}
.mainNews ul li span { float:right; }
.moreText { display:none; width:58px; height:26px; text-align:center; line-height:26px; color:#9b9b9b; text-decoration:underline; position:absolute; right:16px; top:11px;}

.mainDataLink { display:inline-block; float:right; }
.mainDataLink a { display:inline-block; width:175px; height:207px; padding-top:187px; box-sizing:border-box; text-align:center; text-indent:-5px; }
.mainDataLink .dataLink01 {background:url(../img/main/main_dataline01_out.png) no-repeat 0 0; background-size:175px auto;}
.mainDataLink .dataLink02 {background:url(../img/main/main_dataline02_out.png) no-repeat 0 0; background-size:175px auto; margin-left:-17px;}
.mainDataLink .dataLink01:hover {background:url(../img/main/main_dataline01_over.png) no-repeat 0 0; background-size:175px auto;}
.mainDataLink .dataLink02:hover {background:url(../img/main/main_dataline02_over.png) no-repeat 0 0; background-size:175px auto;}

/* 데이터 시각화 */
.dataVisualWrap{ background-color:#f0f5fe; height:357px; padding-top:45px; box-sizing:border-box; }
.dataVisualInner { width:1150px; margin:0 auto; /*overflow:hidden;*/}
.dataVisualInner h3 { display:inline-block; float:left; width:170px; padding-bottom:35px; font-size:22px; line-height:45px; background:url(../img/main/bul_datavisual.png) no-repeat 0 bottom; background-size:24px auto; }
.dataVisualInner h3 span { display:block; width:150px; font-size:16px; line-height:24px; color:#848484; }
.dataVisualInner h3 .more { display:block; float:right; margin-right:26px; width:58px; height:26px; text-align:center; font-size:14px; line-height:24px; }


.dataVisual li { display:inline-block; width:228px; height:268px; padding:15px 20px 0 20px; float:left; background-color:#fff; box-shadow:0px 5px 10px #dcdcdc; margin:0 9px; box-sizing:border-box; }
.dataVisual li:last-child { margin-right:0;}
.dataVisual li a { display:block;}
.dataVisual li .imgChart { width:193px; height:145px; }
.dataVisual li img { width:185px; height:140px; border:0; padding:0; margin:0;} /* 2018-05-16 추가 */
.dataVisual li strong { display:block; font-family:notokr-regular; width:193px; height:19px; background:url(../img/main/bul_datavisual2.png) no-repeat 0 0; background-size:19px auto; padding-left:28px; margin-top:5px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; box-sizing:border-box; }
.dataVisual li span { display:block; font-family:notokr-regular; font-size:13px; color:#848484; margin-top:8px;}
.dataVisual li .dataVisualView { background-color:#afafaf; color:#fff; text-align:center; height:27px; line-height:27px; margin-top:15px;}

/*.dataVisual li iframe { width:193px; height:231px; margin:0; padding:0; border:none; overflow:hidden;}*/