357 lines
11 KiB
HTML
357 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>인사규정 - 테크니컬코리아</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>인사규정</strong>
|
|
</nav>
|
|
|
|
<!-- 페이지 헤더 -->
|
|
<header class="page-header">
|
|
<h2>인사규정</h2>
|
|
<p>Human Resources - 인사관리 규정 및 지침</p>
|
|
</header>
|
|
|
|
<!-- 메인 컨텐츠 -->
|
|
<main class="main-content">
|
|
<div class="document-list">
|
|
<!-- 인사규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-001.html'">
|
|
<div class="document-content">
|
|
<h3>HR-001 인사관리 규정</h3>
|
|
<p>채용, 승진, 전보, 퇴직 등 인사관리 전반</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 급여규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-002.html'">
|
|
<div class="document-content">
|
|
<h3>HR-002 급여관리 규정</h3>
|
|
<p>급여체계, 수당, 상여금 지급 기준</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 근무규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-003.html'">
|
|
<div class="document-content">
|
|
<h3>HR-003 근무시간 관리규정</h3>
|
|
<p>근무시간, 휴게시간, 연장근무 규정</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 휴가규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-004.html'">
|
|
<div class="document-content">
|
|
<h3>HR-004 휴가 및 휴직규정</h3>
|
|
<p>연차, 병가, 특별휴가, 휴직 관련 규정</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 복리후생 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-005.html'">
|
|
<div class="document-content">
|
|
<h3>HR-005 복리후생 규정</h3>
|
|
<p>건강보험, 퇴직금, 각종 지원금 규정</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 성과평가 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-006.html'">
|
|
<div class="document-content">
|
|
<h3>HR-006 성과평가 관리규정</h3>
|
|
<p>성과평가 기준, 절차, 결과 활용 방안</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 교육훈련 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-007.html'">
|
|
<div class="document-content">
|
|
<h3>HR-007 교육훈련 관리규정</h3>
|
|
<p>신입사원 교육, 직무교육, 외부교육 지원</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 징계규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-008.html'">
|
|
<div class="document-content">
|
|
<h3>HR-008 징계 관리규정</h3>
|
|
<p>징계사유, 절차, 징계양정 기준</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 보안규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-009.html'">
|
|
<div class="document-content">
|
|
<h3>HR-009 정보보안 및 기밀유지</h3>
|
|
<p>회사 정보보안 및 기밀유지 의무</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 복무규정 -->
|
|
<div class="document-item" onclick="location.href='hr/HR-010.html'">
|
|
<div class="document-content">
|
|
<h3>HR-010 복무 및 행동강령</h3>
|
|
<p>직원 복무 기준 및 윤리 행동강령</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 검색 섹션 -->
|
|
<div class="search-section">
|
|
<h3>인사규정 검색</h3>
|
|
<div class="search-box">
|
|
<input type="text" id="hrSearchInput" placeholder="인사규정 검색 (예: 급여, 휴가, 교육)">
|
|
<button onclick="filterDocuments(document.getElementById('hrSearchInput').value)">검색</button>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<p>테크니컬코리아 내부 전용 문서시스템</p>
|
|
<p>인사 문의: hr@technicalkorea.co.kr | 내선: 3456</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 = 'block';
|
|
} else {
|
|
doc.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
|
|
// Enter 키로 검색
|
|
document.getElementById('hrSearchInput').addEventListener('keypress', function(e) {
|
|
if (e.key === 'Enter') {
|
|
filterDocuments(this.value);
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |