447 lines
16 KiB
HTML
447 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>HSE 관리시스템 - 테크니컬코리아</title>
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
background: #f8f9fa;
|
|
min-height: 100vh;
|
|
color: #333;
|
|
padding: 20px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1000px;
|
|
margin: 0 auto;
|
|
background: white;
|
|
border: 2px solid #dc2626;
|
|
box-shadow: 0 10px 30px rgba(220, 38, 38, 0.1);
|
|
min-height: calc(100vh - 40px);
|
|
}
|
|
|
|
/* 브레드크럼 */
|
|
.breadcrumb {
|
|
background: #f8f9fa;
|
|
padding: 15px 30px;
|
|
border-bottom: 1px solid #dc2626;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.breadcrumb a {
|
|
color: #dc2626;
|
|
text-decoration: none;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.breadcrumb a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.breadcrumb span {
|
|
color: #6b7280;
|
|
margin: 0 10px;
|
|
}
|
|
|
|
/* 헤더 */
|
|
.page-header {
|
|
text-align: center;
|
|
padding: 40px 30px;
|
|
border-bottom: 1px solid #dc2626;
|
|
}
|
|
|
|
.page-header h2 {
|
|
color: #dc2626;
|
|
font-size: 2rem;
|
|
margin-bottom: 10px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.page-header p {
|
|
color: #6b7280;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
/* 메인 컨텐츠 */
|
|
.main-content {
|
|
padding: 30px;
|
|
}
|
|
|
|
/* 문서 목록 */
|
|
.document-list {
|
|
display: grid;
|
|
gap: 15px;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.document-item {
|
|
background: white;
|
|
border: 1px solid #dc2626;
|
|
padding: 25px;
|
|
transition: all 0.3s ease;
|
|
box-shadow: 0 1px 3px rgba(220, 38, 38, 0.1);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.document-item:hover {
|
|
border-color: #991b1b;
|
|
box-shadow: 0 4px 12px rgba(220, 38, 38, 0.15);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.document-content h3 {
|
|
color: #111827;
|
|
font-size: 1.1rem;
|
|
font-weight: 600;
|
|
margin: 0 0 8px 0;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.document-content p {
|
|
color: #6b7280;
|
|
font-size: 0.9rem;
|
|
margin: 0;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.document-content {
|
|
flex: 1;
|
|
}
|
|
|
|
/* 검색 섹션 */
|
|
.search-section {
|
|
background: #f8f9fa;
|
|
border: 1px solid #dc2626;
|
|
padding: 25px;
|
|
text-align: center;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.search-section h3 {
|
|
color: #111827;
|
|
font-size: 1.2rem;
|
|
margin-bottom: 15px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.search-box {
|
|
display: flex;
|
|
gap: 10px;
|
|
max-width: 400px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.search-box input {
|
|
flex: 1;
|
|
padding: 12px 15px;
|
|
background: white;
|
|
border: 1px solid #dc2626;
|
|
color: #111827;
|
|
font-size: 0.9rem;
|
|
outline: none;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.search-box input::placeholder {
|
|
color: #9ca3af;
|
|
}
|
|
|
|
.search-box input:focus {
|
|
border-color: #991b1b;
|
|
box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
|
|
}
|
|
|
|
.search-box button {
|
|
background: white;
|
|
color: #dc2626;
|
|
border: 1px solid #dc2626;
|
|
padding: 12px 20px;
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
font-size: 0.9rem;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.search-box button:hover {
|
|
background: #dc2626;
|
|
color: white;
|
|
}
|
|
|
|
/* 푸터 */
|
|
.footer {
|
|
text-align: center;
|
|
padding: 30px;
|
|
border-top: 1px solid #dc2626;
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.footer p {
|
|
color: #6b7280;
|
|
font-size: 0.8rem;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
/* 반응형 */
|
|
@media (max-width: 768px) {
|
|
.container {
|
|
margin: 10px;
|
|
}
|
|
|
|
.page-header {
|
|
padding: 25px 20px;
|
|
}
|
|
|
|
.page-header h2 {
|
|
font-size: 1.6rem;
|
|
}
|
|
|
|
.main-content {
|
|
padding: 20px;
|
|
}
|
|
|
|
.search-box {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- 브레드크럼 네비게이션 -->
|
|
<nav class="breadcrumb">
|
|
<a href="index.html">홈</a>
|
|
<span>></span>
|
|
<strong>HSE 관리시스템</strong>
|
|
</nav>
|
|
|
|
<!-- 페이지 헤더 -->
|
|
<header class="page-header">
|
|
<h2>HSE 관리시스템</h2>
|
|
<p>Health, Safety & Environment - 안전보건환경 관련 절차서</p>
|
|
</header>
|
|
|
|
<!-- 메인 컨텐츠 -->
|
|
<main class="main-content">
|
|
<div class="document-list">
|
|
<!-- HSE 관리시스템 매뉴얼 (최상위 문서) -->
|
|
<div class="document-item" onclick="location.href='iso45001_bilingual_manual.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-001 ISO 45001:2018 HSE 관리시스템 매뉴얼</h3>
|
|
<p>ISO 45001:2018 기반 보건, 안전 및 환경 관리시스템 최상위 문서 (한/영 이중언어)</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 4. 조직의 상황 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-410.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-410 조직 상황 이해 및 HSE 관리시스템 운영 절차</h3>
|
|
<p>조직의 내외부 상황 파악 및 HSE 관리시스템 전반 운영</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 5. 리더십과 근로자 참여 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-510.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-510 리더십 및 정책 수립 절차</h3>
|
|
<p>최고경영자 리더십 및 HSE 정책 수립·운영 절차</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-520.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-520 조직 편성 및 직무 배정 절차</h3>
|
|
<p>HSE 관련 조직 구성 및 역할·책임·권한 배정</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 6. 기획 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-610.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-610 기획 및 위험 관리 절차</h3>
|
|
<p>HSE 관리시스템 기획 및 위험과 기회 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-620.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-620 위험 평가 절차</h3>
|
|
<p>유해요인 식별 및 위험성 평가 실시 절차</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-630.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-630 HSE 법적 요구사항 관리 절차</h3>
|
|
<p>HSE 관련 법령 및 기타 요구사항 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-640.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-640 HSE 목표 관리 절차</h3>
|
|
<p>HSE 목표 설정, 달성 계획 수립 및 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 7. 지원 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-710.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-710 자원 관리 절차</h3>
|
|
<p>HSE 관리시스템 운영에 필요한 자원 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-720.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-720 교육 및 훈련 관리 절차</h3>
|
|
<p>HSE 관련 교육·훈련 계획 수립 및 실시</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-730.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-730 인식 및 의사소통 절차</h3>
|
|
<p>HSE 인식 제고 및 내외부 의사소통 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-740.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-740 문서화된 정보 관리 절차</h3>
|
|
<p>HSE 문서 및 기록의 작성, 관리, 보관</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 8. 운영 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-810.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-810 운영 기획 및 관리 절차</h3>
|
|
<p>HSE 운영 기획, 작업허가, 변경관리, 조달관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-820.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-820 비상 대비 및 대응 절차</h3>
|
|
<p>비상상황 대비, 대응 계획 및 훈련</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 9. 성과 평가 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-910.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-910 프로세스 성과 관리 절차</h3>
|
|
<p>HSE 관리시스템 프로세스 성과 관리</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-920.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-920 HSE 모니터링 및 측정 관리 절차</h3>
|
|
<p>HSE 성과 모니터링, 측정 및 분석</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-930.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-930 내부 심사 절차</h3>
|
|
<p>HSE 관리시스템 내부 심사 계획 및 실시</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-940.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-940 경영 검토 절차</h3>
|
|
<p>HSE 관리시스템 경영진 검토</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 10. 개선 관련 문서 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-1010.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-1010 사건, 부적합 및 시정조치 절차</h3>
|
|
<p>사건·사고 조사, 부적합 처리 및 시정조치</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-P-1020.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-P-1020 지속적 개선 절차</h3>
|
|
<p>HSE 관리시스템 지속적 개선 활동</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 실무 지침 문서들 -->
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-W-001.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-W-001 개인보호구 관리 지침</h3>
|
|
<p>개인보호구 지급, 관리, 점검 실무 지침</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-W-002.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-W-002 화학물질 관리 지침</h3>
|
|
<p>화학물질 보관, 사용, 폐기 실무 지침</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="document-item" onclick="location.href='hse/TK-HSE-W-003.html'">
|
|
<div class="document-content">
|
|
<h3>TK-HSE-W-003 응급처치 및 의료관리 지침</h3>
|
|
<p>응급상황 대응 및 응급처치 실무 지침</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 검색 섹션 -->
|
|
<div class="search-section">
|
|
<h3>HSE 문서 검색</h3>
|
|
<div class="search-box">
|
|
<input type="text" id="hseSearchInput" placeholder="HSE 문서 검색 (예: 안전, 화재, 교육)">
|
|
<button onclick="filterDocuments(document.getElementById('hseSearchInput').value)">검색</button>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<p>테크니컬코리아 내부 전용 문서시스템</p>
|
|
<p>HSE 문의: safety@technicalkorea.co.kr | 내선: 1234</p>
|
|
</footer>
|
|
</div>
|
|
|
|
<script>
|
|
// 문서 필터링 기능
|
|
function filterDocuments(searchTerm) {
|
|
const documents = document.querySelectorAll('.document-item');
|
|
const term = searchTerm.toLowerCase();
|
|
|
|
documents.forEach(doc => {
|
|
const title = doc.querySelector('h3').textContent.toLowerCase();
|
|
const description = doc.querySelector('p').textContent.toLowerCase();
|
|
|
|
if (title.includes(term) || description.includes(term)) {
|
|
doc.style.display = 'flex';
|
|
} else {
|
|
doc.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
|
|
// Enter 키로 검색
|
|
document.getElementById('hseSearchInput').addEventListener('keypress', function(e) {
|
|
if (e.key === 'Enter') {
|
|
filterDocuments(this.value);
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |