세미나 샘플
This commit is contained in:
@@ -0,0 +1,5 @@
|
|||||||
|
### 📑 업무 내역 및 분석
|
||||||
|
|
||||||
|
* **09:30 ~ 12:00** | **장헌 자료 정리 및 업로드**
|
||||||
|
|
||||||
|
* **13:00 ~ 18:00** | **2분기 업무성과 면담지 작성**
|
||||||
+158
@@ -0,0 +1,158 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ko">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>2026 성과도약 세미나 발표 샘플</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: 'Arial', sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #f4f6f9;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: #1e3a8a;
|
||||||
|
color: white;
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 30px auto;
|
||||||
|
padding: 20px;
|
||||||
|
background: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 0 10px rgba(0,0,0,0.05);
|
||||||
|
}
|
||||||
|
.tabs {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
border-bottom: 2px solid #e5e7eb;
|
||||||
|
}
|
||||||
|
.tab {
|
||||||
|
padding: 12px 24px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #6b7280;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
.tab.active {
|
||||||
|
color: #1e3a8a;
|
||||||
|
border-bottom: 3px solid #1e3a8a;
|
||||||
|
}
|
||||||
|
.content-section {
|
||||||
|
display: none;
|
||||||
|
animation: fadeIn 0.5s ease-in-out forwards;
|
||||||
|
}
|
||||||
|
.content-section.active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.keyword-card {
|
||||||
|
background: #f8fafc;
|
||||||
|
border-left: 5px solid #3b82f6;
|
||||||
|
padding: 15px;
|
||||||
|
margin: 15px 0;
|
||||||
|
border-radius: 0 8px 8px 0;
|
||||||
|
}
|
||||||
|
.btn-action {
|
||||||
|
display: block;
|
||||||
|
width: 200px;
|
||||||
|
margin: 20px auto;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #10b981;
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
border: none;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.btn-action:hover {
|
||||||
|
background-color: #059669;
|
||||||
|
}
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from { opacity: 0; transform: translateY(10px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 5px;
|
||||||
|
padding: 15px;
|
||||||
|
color: #9ca3af;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>2026년 성과도약 세미나</h1>
|
||||||
|
<p>총괄기획실 실행력 강화 및 성과관리</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<!-- 상단 탭 메뉴 (10분 발표 흐름 맞춤) -->
|
||||||
|
<div class="tabs">
|
||||||
|
<div class="tab active" onclick="switchTab(0)">1. 도입 (배경)</div>
|
||||||
|
<div class="tab" onclick="switchTab(1)">2. 핵심 키워드</div>
|
||||||
|
<div class="tab" onclick="switchTab(2)">3. 실행 방안 및 결론</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 1번 탭: 도입 -->
|
||||||
|
<div id="section0" class="content-section active">
|
||||||
|
<h2>우리가 마주한 3분기의 도전</h2>
|
||||||
|
<p>팀장과 수석이 중심이 되어 조직의 실행력을 극대화하고, 주도적으로 성과를 만들어내야 하는 시점입니다.</p>
|
||||||
|
<div class="keyword-card">
|
||||||
|
<strong>현 시점 점검:</strong> 우리 팀의 일정관리, 우선순위 설정, 그리고 협업 방식은 효율적으로 작동하고 있는가?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 2번 탭: 핵심 키워드 -->
|
||||||
|
<div id="section1" class="content-section">
|
||||||
|
<h2>성과 도약을 위한 5가지 핵심 가치</h2>
|
||||||
|
<p>탭을 클릭하거나 발표 흐름에 맞춰 아래 핵심 가치를 설명합니다.</p>
|
||||||
|
<div class="keyword-card"><strong>💡 성과창출:</strong> 3분기에 반드시 만들어야 할 목표와 결과에 집중</div>
|
||||||
|
<div class="keyword-card"><strong>🚀 실행리더십:</strong> 팀장과 수석이 직접 챙기고 이끄는 주도적 실행</div>
|
||||||
|
<div class="keyword-card"><strong>🤝 협업:</strong> 타 팀 및 조직 차원의 적극적인 협조와 시너지</div>
|
||||||
|
<div class="keyword-card"><strong>🔥 자신감 & 도약:</strong> 할 수 있다는 믿음으로 한 단계 더 높은 성장을 달성</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 3번 탭: 실행 방안 및 결론 -->
|
||||||
|
<div id="section2" class="content-section">
|
||||||
|
<h2>Action Plan: 어떻게 성과를 만들 것인가?</h2>
|
||||||
|
<p>발표를 마무리하며 팀원들과 공유할 최종 다짐을 확인합니다.</p>
|
||||||
|
<ul>
|
||||||
|
<li>개인별 구체적인 롤 정립 및 일정 수립</li>
|
||||||
|
<li>철저한 실행력 중심의 모니터링 및 피드백</li>
|
||||||
|
<li>조직 간 장벽을 허무는 유기적인 협업 체계 가동</li>
|
||||||
|
</ul>
|
||||||
|
<button class="btn-action" onclick="alert('성과도약을 향해 함께 나아갑시다! 화이팅!')">성과도약 선언하기</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
© 2026 총괄기획실 Seminar Sample. All 임직원 필참.
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function switchTab(index) {
|
||||||
|
// 모든 탭과 섹션 비활성화
|
||||||
|
const tabs = document.querySelectorAll('.tab');
|
||||||
|
const sections = document.querySelectorAll('.content-section');
|
||||||
|
|
||||||
|
tabs.forEach(tab => tab.classList.remove('active'));
|
||||||
|
sections.forEach(section => section.classList.remove('active'));
|
||||||
|
|
||||||
|
// 선택한 탭과 섹션 활성화
|
||||||
|
tabs[index].classList.add('active');
|
||||||
|
document.getElementById('section' + index).classList.add('active');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user