20260205 업데이트(컨텐츠 페이지 연결)
This commit is contained in:
418
kngil/skin/provided.php
Normal file
418
kngil/skin/provided.php
Normal file
@@ -0,0 +1,418 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<?php include __DIR__ . "/_head.php"; ?>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
<?php include __DIR__ . "/_header.php"; ?>
|
||||
|
||||
<!-- Main Container -->
|
||||
<div class="container provided">
|
||||
<!-- Header Section -->
|
||||
<section class="sub-header">
|
||||
<div class="page-title">
|
||||
<h2 data-aos="fade-down" data-aos-duration="1000">제공데이터</h2>
|
||||
<p class="sub-txt">
|
||||
항목별 공공데이터를 기반으로<br>
|
||||
공간정보(SHP), 통계자료, 응용데이터(추가 예정)등을 제공합니다.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Content Section -->
|
||||
<section class="sub-content">
|
||||
<div class="sub-tit-box">
|
||||
<h3 class="sub-tit">
|
||||
<strong>공간정보 및 통계자료</strong> 등<br>
|
||||
항목별 기초현황 데이터를 다양하게 제공
|
||||
</h3>
|
||||
</div>
|
||||
<div class="data-wrap">
|
||||
<div class="data-inner">
|
||||
<div class="data-core">
|
||||
<div class="core-oval">공공데이터 기반의 <strong>제공데이터</strong></div>
|
||||
</div>
|
||||
<div class="data-provision">
|
||||
<div class="data-bullet" aria-hidden="true"></div>
|
||||
<div class="data-bullet bullet-2" aria-hidden="true"></div>
|
||||
|
||||
<div class="data-categories">
|
||||
<!-- 공간정보 -->
|
||||
<div class="category-item spatial" aria-labelledby="spatial-title">
|
||||
<div class="category-images">
|
||||
<div class="image-item">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_spatial.png"
|
||||
alt="공간정보 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-circle">
|
||||
<div class="category-icon">
|
||||
<img
|
||||
src="/kngil/img/ico/ico_map_marker.svg"
|
||||
alt="지도 마커 아이콘"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<h3 id="spatial-title" class="category-title">공간정보</h3>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 통계자료 -->
|
||||
<div class="category-item statistical" aria-labelledby="statistical-title">
|
||||
<div class="category-images">
|
||||
<div class="image-item">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_stat.png"
|
||||
alt="통계자료 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-circle">
|
||||
<div class="category-icon">
|
||||
<img
|
||||
src="/kngil/img/ico/ico_chart_3d.svg"
|
||||
alt="차트 아이콘"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<h3 id="statistical-title" class="category-title">통계자료</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<article class="data-categories-list">
|
||||
<ul class="fix spatial" aria-label="공간정보 데이터 항목">
|
||||
<li>
|
||||
<div class="fix-01"><p>행정경계</p></div>
|
||||
<div class="dot f-01" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-02"><p>건물통합정보</p></div>
|
||||
<div class="dot f-02" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-03"><p>생태자연</p></div>
|
||||
<div class="dot f-03" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-04"><p>토지이용계획</p></div>
|
||||
<div class="dot f-04" aria-hidden="true"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="fix statistical" aria-label="통계자료 데이터 항목">
|
||||
<li>
|
||||
<div class="fix-01"><p>인구</p></div>
|
||||
<div class="dot f-01" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-02"><p>기상</p></div>
|
||||
<div class="dot f-02" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-03"><p>문화재</p></div>
|
||||
<div class="dot f-03" aria-hidden="true"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="fix-04"><p>기반시설</p></div>
|
||||
<div class="dot f-04" aria-hidden="true"></div>
|
||||
</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Process Section -->
|
||||
<section class="layout-fix-left process">
|
||||
<nav class="left" data-aos="fade-right" data-aos-duration="1000" aria-label="데이터 분류 네비게이션">
|
||||
<div class="bg js-fixLeft-bg on" aria-hidden="true"></div>
|
||||
<div class="bg js-fixLeft-bg" aria-hidden="true"></div>
|
||||
<ul
|
||||
class="js-fixLeft-tit"
|
||||
role="tablist"
|
||||
aria-label="데이터 분류 목록"
|
||||
>
|
||||
<li class="on" role="tab" aria-selected="true" tabindex="0">
|
||||
<span><strong>01</strong>자연조건</span>
|
||||
</li>
|
||||
<li role="tab" aria-selected="false" tabindex="-1">
|
||||
<span><strong>02</strong>사회특성</span>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="right js-fixLeft-secs">
|
||||
<section class="natural" aria-labelledby="natural-tit">
|
||||
<h2 id="natural-tit" class="sub-tit">
|
||||
<i class="ico-natural" aria-hidden="true"></i>
|
||||
자연적 환경 요소인 <strong>지형, 기후, 생태자연, 도시주거</strong> 항목을<br class="pc-only">
|
||||
<strong>자연조건</strong>으로 분류하여 제공
|
||||
</h2>
|
||||
<ul class="cont-list">
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-location" aria-hidden="true"></i>
|
||||
지역의 개황
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>위치 및 행정구역</li>
|
||||
<li>지형 및 지세</li>
|
||||
<li>지진</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_natural_01.png"
|
||||
alt="지진발생 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">지진발생</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
</li>
|
||||
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-weather" aria-hidden="true"></i>
|
||||
기상 및 자연재해
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>기상</li>
|
||||
<li>풍수해</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_natural_02.png"
|
||||
alt="현상일수 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">현상일수</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</li>
|
||||
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-eco" aria-hidden="true"></i>
|
||||
생태 및 자연환경
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>생태자연도</li>
|
||||
<li>국토환경성 평가</li>
|
||||
<li>임상도</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_natural_03.png"
|
||||
alt="국토환경성 평가 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">국토환경성 평가</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
</ul>
|
||||
</section>
|
||||
<section class="social" aria-labelledby="social-tit">
|
||||
<h2 id="social-tit" class="sub-tit">
|
||||
<i class="ico-social" aria-hidden="true"></i>
|
||||
사회적 구조 요소인 <strong>인구, 토지, 건축물, 사회기반시설</strong> 항목을<br class="pc-only">
|
||||
<strong>사회특성</strong>으로 분류하여 제공
|
||||
</h2>
|
||||
<ul class="cont-list">
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-population"></i>
|
||||
인구
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>과거인구 추이</li>
|
||||
<li>행정구역별 인구</li>
|
||||
<li>연령(5세별) 및 성별 인구</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_social_01.png"
|
||||
alt="연령 및 성별 인구 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">연령 및 성별 인구</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</li>
|
||||
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-land" aria-hidden="true"></i>
|
||||
토지
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>용도지정</li>
|
||||
<li>보호구역</li>
|
||||
<li>토지이용</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_social_02.png"
|
||||
alt="토지이용(소유자별) 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">토지이용(소유자별)</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</li>
|
||||
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-building" aria-hidden="true"></i>
|
||||
건축물
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>용도/구조/층수/경과연도</li>
|
||||
<li>연면적/건폐율/용적률</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_social_03.png"
|
||||
alt="건축물(용도별) 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">건축물(용도별)</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
</li>
|
||||
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-society" aria-hidden="true"></i>
|
||||
사회기반시설
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>교통/공간/유통업무</li>
|
||||
<li>상수도</li>
|
||||
<li>환경기초</li>
|
||||
<li>방재/기타</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_social_04.png"
|
||||
alt="상수도(배수지) 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">상수도(배수지)</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</li>
|
||||
<li class="cont-item">
|
||||
<dl>
|
||||
<dt>
|
||||
<i class="ico-city" aria-hidden="true"></i>
|
||||
도시 및 주거환경
|
||||
</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li>지역안전지수</li>
|
||||
<li>노후/불량 건축물</li>
|
||||
<li>호수밀도/접도율</li>
|
||||
<li>토지 형상</li>
|
||||
</ul>
|
||||
</dd>
|
||||
<dd>
|
||||
<figure class="sub-figs">
|
||||
<div class="imgs">
|
||||
<img
|
||||
src="/kngil/img/provided/img_provided_natural_04.png"
|
||||
alt="노후/불량 건축물 데이터 시각화"
|
||||
width="auto"
|
||||
height="auto"
|
||||
>
|
||||
</div>
|
||||
<figcaption class="fig-caption">노후/불량 건축물</figcaption>
|
||||
</figure>
|
||||
</dd>
|
||||
</dl>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- // Main Container -->
|
||||
|
||||
<?php include __DIR__ . "/_footer.php"; ?>
|
||||
</div>
|
||||
|
||||
<script src="/kngil/js/provided.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user