<!doctype html>
<html lang="ko"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layout/default}">
<head>
	<title>조직도</title>
<body>

<div id="wrapper" layout:fragment="content">

    <!-- ======================== HEADER -->
    <header id="hd" class="sub"></header>

    <!-- ======================== CONTAINER -->
    <div id="container">
        <div id="container_wrapper">

            <!-- ========= SUB VISUAL + BREADCRUMB ========= -->
            <div id="sub_visual">
                <div class="sub-bg bg-organ"></div>
                <div class="sub-tit-wrap">
                    <h2 class="sub-tit">조직도</h2>
                    <p class="sub-desc">항상 고객사와 소통하는 오라인포</p>
                </div>
				
				<div id="sub_breadcrumb">
					<div class="inner">
						<ul class="breadcrumb">
							<li>
								<a href="/" class="bc-home" aria-label="홈으로 이동">
									<img src="/img/sub/ico_home.svg" alt="HOME">
								</a>
							</li>
							<li class="bc-item bc-depth1">
								<button class="bc-btn" type="button" aria-haspopup="listbox" aria-expanded="false">
									<span class="bc-label">회사소개</span>
									<span class="bc-arrow">
										<img src="/img/sub/ico_arrow.svg" alt="arrow">
									</span>
								</button>
								<ul class="bc-dropdown" role="listbox">
									<li class="active"><a href="/company/intro">회사소개</a></li>
									<li><a href="/company/business">사업소개</a></li>
									<li><a href="/company/talent">인재채용</a></li>
									<li><a href="/company/owrainfo">오라인</a></li>
								</ul>
							</li>
							<li class="bc-item bc-depth2">
								<button class="bc-btn" type="button" aria-haspopup="listbox" aria-expanded="false">
									<span class="bc-label">조직도</span>
									<span class="bc-arrow">
										<img src="/img/sub/ico_arrow.svg" alt="arrow">
									</span>
								</button>
								<ul class="bc-dropdown" role="listbox">
									<li><a href="/company/intro">사업개요</a></li>
									<li ><a href="/company/business">경영이념/비전</a></li>
									<li><a href="/company/history">회사 연혁</a></li>
									<li class="active"><a href="/company/chart">조직도</a></li>
									<li><a href="/company/map">찾아오는 길</a></li>
								</ul>
							</li>
						</ul>
					</div>
				</div>
            </div>            
            <!-- ========= SUB VISUAL + BREADCRUMB [e] ========= -->


            <!-- ========= SUB CONTENT [s] ========= -->
            <div class="sub_content">	
				<div class="sub-section">
					<div class="sub-inner">
						<!-- 조직도 타이틀 -->
						<div class="" data-aos="fade-up">
							<h2 class="sub-h2 text-center">
								오라인포는 <em>각 분야의 핵심 인재들</em>로
								유기적인 구성이 되어 있습니다.
							</h2>
						</div>
						
						<!-- 조직도 -->
						<div class="org-tree" data-aos="fade-up"> 
							
							<div class="node node--ceo">대표이사</div>
							<div class="dept-vdown"></div>
							<!-- CEO 수직선 중간에 경영지원팀 분기 -->
							<div class="ceo-stem">
							<div class="ceo-stem__top"></div>
								<div class="support-group">
									<div class="node node--support">경영지원팀</div>
									</div>
								<div class="ceo-stem__bot"></div>
							</div>

							<div class="depts-wrap">
								<div class="dept-col dept-col--left">
									<div class="node node--dept">솔루션 사업부</div>
									<div class="dept-vdown"></div>
									<div class="teams-wrap">
										<div class="team-col"><div class="node node--team">PG<br>솔루션</div></div>
										<div class="team-col"><div class="node node--team">교육<br>솔루션</div></div>
										<div class="team-col"><div class="node node--team">매출정산<br>솔루션</div></div>
									</div>
								</div>
								<div class="dept-col dept-col--center">
									<div class="node node--dept">개발 운영팀</div>
									<div class="dept-vdown"></div>
									<div class="teams-wrap">
										<div class="team-col"><div class="node node--team">모바일<br>개발팀</div></div>
										<div class="team-col"><div class="node node--team">결제<br>시스템 운영</div></div>
										<div class="team-col"><div class="node node--team">SM&amp;SI</div></div>
									</div>
								</div>
								<div class="dept-col dept-col--right">
									<div class="node node--dept">PG 사업부</div>
									<div class="dept-vdown"></div>
									<div class="teams-wrap">
										<div class="team-col"><div class="node node--team">RM<br>관리</div></div>
										<div class="team-col"><div class="node node--team">정산관리</div></div>
										<div class="team-col"><div class="node node--team">영업관리</div></div>
									</div>
								</div>

							</div>

						</div>
						
					</div>
				</div>				
			</div>
			
            <!-- ========= SUB CONTENT [e] ========= -->

        </div>
    </div>
</div>
