513 lines
13 KiB
HTML
513 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>건설산업 DX의 올바른 이해</title>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;900&display=swap');
|
|
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
|
body {
|
|
font-family: 'Noto Sans KR', sans-serif;
|
|
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
|
|
min-height: 100vh;
|
|
padding: 20px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
background: #fff;
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* ===== 헤더 영역 ===== */
|
|
.header {
|
|
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
|
color: white;
|
|
padding: 30px;
|
|
text-align: center;
|
|
}
|
|
|
|
.main-title {
|
|
font-size: 2.2rem;
|
|
font-weight: 900;
|
|
margin-bottom: 8px;
|
|
letter-spacing: -1px;
|
|
}
|
|
|
|
.subtitle {
|
|
font-size: 1.1rem;
|
|
opacity: 0.9;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* ===== 문제 제기 영역 ===== */
|
|
.problem-section {
|
|
background: #fef2f2;
|
|
border-left: 5px solid #ef4444;
|
|
margin: 20px;
|
|
padding: 25px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.problem-title {
|
|
font-size: 1.3rem;
|
|
font-weight: 700;
|
|
color: #dc2626;
|
|
margin-bottom: 15px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.problem-title::before {
|
|
content: '⚠️';
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.problem-content {
|
|
font-size: 1rem;
|
|
line-height: 1.7;
|
|
color: #374151;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.problem-impact {
|
|
background: rgba(239, 68, 68, 0.1);
|
|
padding: 15px;
|
|
border-radius: 6px;
|
|
font-size: 0.95rem;
|
|
color: #7f1d1d;
|
|
border: 1px dashed #ef4444;
|
|
}
|
|
|
|
/* ===== 사례 영역 ===== */
|
|
.examples-section {
|
|
margin: 20px;
|
|
padding: 25px;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 1.4rem;
|
|
font-weight: 700;
|
|
color: #1e293b;
|
|
margin-bottom: 20px;
|
|
border-bottom: 3px solid #3b82f6;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
.examples-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 20px;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.example-card {
|
|
border: 2px solid #e5e7eb;
|
|
border-radius: 10px;
|
|
padding: 20px;
|
|
background: #f9fafb;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.example-card:hover {
|
|
border-color: #3b82f6;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 25px rgba(59, 130, 246, 0.15);
|
|
}
|
|
|
|
.card-header {
|
|
background: #3b82f6;
|
|
color: white;
|
|
padding: 8px 15px;
|
|
border-radius: 6px;
|
|
font-size: 0.9rem;
|
|
font-weight: 700;
|
|
margin: -20px -20px 15px -20px;
|
|
}
|
|
|
|
.card-meta {
|
|
font-size: 0.8rem;
|
|
color: #6b7280;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.card-content {
|
|
font-size: 0.9rem;
|
|
line-height: 1.6;
|
|
color: #374151;
|
|
}
|
|
|
|
.highlight-text {
|
|
background: linear-gradient(120deg, #fef3c7 0%, #fde68a 100%);
|
|
padding: 15px 25px;
|
|
border-radius: 8px;
|
|
text-align: center;
|
|
font-weight: 600;
|
|
color: #92400e;
|
|
border: 1px solid #f59e0b;
|
|
}
|
|
|
|
/* ===== 정의 영역 ===== */
|
|
.definitions-section {
|
|
background: #f8fafc;
|
|
margin: 20px;
|
|
padding: 30px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.definitions-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
|
|
gap: 20px;
|
|
}
|
|
|
|
.definition-card {
|
|
background: white;
|
|
border-radius: 12px;
|
|
padding: 25px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
|
|
border-top: 4px solid;
|
|
position: relative;
|
|
}
|
|
|
|
.definition-card:nth-child(1) { border-top-color: #10b981; }
|
|
.definition-card:nth-child(2) { border-top-color: #3b82f6; }
|
|
.definition-card:nth-child(3) { border-top-color: #8b5cf6; }
|
|
|
|
.term-name {
|
|
font-size: 1.2rem;
|
|
font-weight: 900;
|
|
margin-bottom: 5px;
|
|
color: #1e293b;
|
|
}
|
|
|
|
.term-category {
|
|
font-size: 0.85rem;
|
|
font-weight: 600;
|
|
margin-bottom: 15px;
|
|
padding: 4px 12px;
|
|
border-radius: 20px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.definition-card:nth-child(1) .term-category {
|
|
background: #d1fae5;
|
|
color: #065f46;
|
|
}
|
|
|
|
.definition-card:nth-child(2) .term-category {
|
|
background: #dbeafe;
|
|
color: #1d4ed8;
|
|
}
|
|
|
|
.definition-card:nth-child(3) .term-category {
|
|
background: #ede9fe;
|
|
color: #5b21b6;
|
|
}
|
|
|
|
.term-description {
|
|
font-size: 0.95rem;
|
|
line-height: 1.6;
|
|
color: #374151;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.term-details {
|
|
font-size: 0.85rem;
|
|
color: #6b7280;
|
|
border-top: 1px solid #e5e7eb;
|
|
padding-top: 15px;
|
|
}
|
|
|
|
.term-source {
|
|
font-size: 0.75rem;
|
|
color: #9ca3af;
|
|
font-style: italic;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
/* ===== 관계도 영역 ===== */
|
|
.relationship-section {
|
|
margin: 20px;
|
|
padding: 30px;
|
|
background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.relationship-visual {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 300px;
|
|
position: relative;
|
|
margin: 30px 0;
|
|
}
|
|
|
|
.tech-bubble {
|
|
position: absolute;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-weight: 700;
|
|
color: white;
|
|
text-shadow: 0 2px 4px rgba(0,0,0,0.3);
|
|
transition: all 0.3s ease;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.tech-bubble:hover {
|
|
transform: scale(1.05);
|
|
box-shadow: 0 8px 25px rgba(0,0,0,0.2);
|
|
}
|
|
|
|
.dx-bubble {
|
|
width: 200px;
|
|
height: 200px;
|
|
background: linear-gradient(135deg, #1e293b 0%, #475569 100%);
|
|
border: 3px solid #0ea5e9;
|
|
font-size: 0.9rem;
|
|
flex-direction: column;
|
|
gap: 5px;
|
|
}
|
|
|
|
.gis-bubble {
|
|
width: 80px;
|
|
height: 80px;
|
|
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
|
|
left: 40px;
|
|
top: 30px;
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
.bim-bubble {
|
|
width: 80px;
|
|
height: 80px;
|
|
background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
|
|
left: 40px;
|
|
top: 140px;
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
.twin-bubble {
|
|
width: 90px;
|
|
height: 90px;
|
|
background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
|
|
right: 30px;
|
|
top: 50px;
|
|
font-size: 0.7rem;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
}
|
|
|
|
.relationship-text {
|
|
background: white;
|
|
padding: 20px;
|
|
border-radius: 8px;
|
|
border-left: 4px solid #0ea5e9;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.relationship-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.relationship-list > li {
|
|
margin-bottom: 15px;
|
|
font-size: 0.95rem;
|
|
line-height: 1.6;
|
|
color: #374151;
|
|
}
|
|
|
|
.relationship-list > li::before {
|
|
content: '▶';
|
|
color: #0ea5e9;
|
|
font-weight: 700;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.sub-list {
|
|
margin-top: 10px;
|
|
margin-left: 20px;
|
|
list-style: none;
|
|
}
|
|
|
|
.sub-list li {
|
|
margin-bottom: 8px;
|
|
font-size: 0.85rem;
|
|
color: #6b7280;
|
|
}
|
|
|
|
.sub-list li::before {
|
|
content: '○';
|
|
color: #9ca3af;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
/* ===== 결론 영역 ===== */
|
|
.conclusion-section {
|
|
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
|
margin: 20px 0 0 0;
|
|
padding: 30px;
|
|
text-align: center;
|
|
}
|
|
|
|
.conclusion-label {
|
|
color: #94a3b8;
|
|
font-size: 0.9rem;
|
|
font-weight: 600;
|
|
margin-bottom: 10px;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
}
|
|
|
|
.conclusion-text {
|
|
color: white;
|
|
font-size: 1.4rem;
|
|
font-weight: 700;
|
|
line-height: 1.4;
|
|
letter-spacing: -0.5px;
|
|
}
|
|
|
|
.conclusion-highlight {
|
|
color: #60a5fa;
|
|
background: rgba(96, 165, 250, 0.1);
|
|
padding: 2px 8px;
|
|
border-radius: 4px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="container">
|
|
<!-- 헤더 -->
|
|
<div class="header">
|
|
<h1 class="main-title">건설산업 DX의 올바른 이해</h1>
|
|
<p class="subtitle">개념 정립을 통한 체계적 접근</p>
|
|
</div>
|
|
|
|
<!-- 문제 제기 -->
|
|
<div class="problem-section">
|
|
<h2 class="problem-title">용어의 혼용</h2>
|
|
<div class="problem-content">
|
|
건설산업의 디지털 전환 논의에서 <strong>DX(Digital Transformation)</strong>와 <strong>BIM(Building Information Modeling)</strong>이 개념적으로 명확히 정립되지 않은 채 혼용되어 사용되고 있음
|
|
</div>
|
|
<div class="problem-impact">
|
|
<strong>영향:</strong> BIM기술의 도입을 DX의 완성으로 오인하거나, DX를 BIM 기술 도입 수준으로 한정하는 인식 확산
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 혼용 사례 -->
|
|
<div class="examples-section">
|
|
<h2 class="section-title">혼용 대표 사례</h2>
|
|
<div class="examples-grid">
|
|
<div class="example-card">
|
|
<div class="card-header">스마트 건설 활성화 방안</div>
|
|
<div class="card-meta">국토교통부, 2022.07</div>
|
|
<div class="card-content">
|
|
<strong>추진과제:</strong> 건설산업 디지털화<br>
|
|
<strong>실행과제:</strong> BIM 전면 도입, BIM 전문인력 양성
|
|
</div>
|
|
</div>
|
|
<div class="example-card">
|
|
<div class="card-header">제7차 건설기술진흥 기본계획</div>
|
|
<div class="card-meta">국토교통부, 2023.12</div>
|
|
<div class="card-content">
|
|
<strong>추진방향:</strong> 디지털 전환을 통한 스마트 건설 확산<br>
|
|
<strong>추진과제:</strong> BIM 도입으로 건설산업 디지털화
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="highlight-text">
|
|
건설산업의 DX를 올바르게 이해하기 위해 각 <strong>용어의 정의, 역할, 상호관계</strong>에 대한 체계적 정립 필요
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 용어 정의 -->
|
|
<div class="definitions-section">
|
|
<h2 class="section-title">용어 정의</h2>
|
|
<div class="definitions-grid">
|
|
<div class="definition-card">
|
|
<h3 class="term-name">건설산업</h3>
|
|
<span class="term-category">종합산업</span>
|
|
<div class="term-description">
|
|
다양한 시설물을 각 산업마다의 광범위한 기술을 통합 및 융합하여 만들어내는 종합산업
|
|
</div>
|
|
<div class="term-details">
|
|
목적 시설물의 품질 욕구를 충족시키면서 최단기간 내에 최소 비용으로 편리하고 안전하며 우수한 성능의 시설물 완성을 목표로 함
|
|
</div>
|
|
</div>
|
|
|
|
<div class="definition-card">
|
|
<h3 class="term-name">BIM (Building Information Modeling)</h3>
|
|
<span class="term-category">디지털 전환을 위한 핵심 기술</span>
|
|
<div class="term-description">
|
|
시설물의 생애주기동안 발생한 모든 정보를 3차원 모델 기반으로 통합·관리하는 정보 관리 도구
|
|
</div>
|
|
<div class="term-details">
|
|
건설 정보와 절차를 표준화된 방식으로 연계하고 디지털 협업이 가능하도록 하는 핵심 인프라 기술
|
|
</div>
|
|
<div class="term-source">건설산업 BIM 기본지침, 국토교통부, 2020</div>
|
|
</div>
|
|
|
|
<div class="definition-card">
|
|
<h3 class="term-name">DX (Digital Transformation)</h3>
|
|
<span class="term-category">산업 패러다임의 변화</span>
|
|
<div class="term-description">
|
|
디지털 기술을 기반으로 산업 전반의 업무방식과 가치 창출 구조를 전환하는 과정 및 결과
|
|
</div>
|
|
<div class="term-details">
|
|
단순한 기술 도입이 아닌, 고객 가치와 의사결정 방식의 근본적인 변화로 산업의 새로운 방향을 정립하는 것을 의미함
|
|
</div>
|
|
<div class="term-source">Digital Transformation, IBM Institute for Business Value, 2011</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 상호관계 -->
|
|
<div class="relationship-section">
|
|
<h2 class="section-title">용어간 상호관계</h2>
|
|
<div class="relationship-visual">
|
|
<div class="tech-bubble dx-bubble">
|
|
<span>건설산업 DX</span>
|
|
<small>(Digital Transformation)</small>
|
|
</div>
|
|
<div class="tech-bubble gis-bubble">GIS</div>
|
|
<div class="tech-bubble bim-bubble">BIM</div>
|
|
<div class="tech-bubble twin-bubble">
|
|
<span>Digital Twin</span>
|
|
<small>가상환경</small>
|
|
</div>
|
|
</div>
|
|
<div class="relationship-text">
|
|
<ul class="relationship-list">
|
|
<li><strong>DX</strong>는 BIM과 같은 디지털기술을 기반으로 산업 전반의 <strong>프로세스를 혁신</strong>하는 상위개념</li>
|
|
<li>건설산업의 DX는 <strong>GIS(공간정보), BIM, 디지털 트윈(가상환경)</strong>의 기술융합을 통해서만 실현 또는 구현 가능
|
|
<ul class="sub-list">
|
|
<li><strong>GIS의 역할:</strong> 지리적 데이터를 공간 분석하여 시각적으로 표현, 위치기반 정보 제공</li>
|
|
<li><strong>BIM의 역할:</strong> 형상정보와 내용정보가 포함된 3D모델로, 건설 정보 기반의 Process와 Product를 제공</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 핵심 결론 -->
|
|
<div class="conclusion-section">
|
|
<div class="conclusion-label">핵심 요약</div>
|
|
<div class="conclusion-text">
|
|
<span class="conclusion-highlight">BIM</span>은 건설산업의 디지털전환(DX)을 수행하는 과정에서<br>
|
|
가장 기초가 되는 <span class="conclusion-highlight">일부분</span>이다
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html> |