<div class="nav-group">
  <ul class="depth01">
    <li>
      <a href="/skin/myclass.php"> 마이클래스 </a>
      <div class="state-box">
        <span class="unit">0<small>%</small></span>
        <span class="progress">
          <span class="progress-bar" style="width: 0%"></span>
        </span>
      </div>
    </li>
    <li>
      <a href="/skin/onboarding.php"> 온보딩 </a>
      <div class="state-box">
        <span class="unit" style="left: calc(68% - 3px);">68<small>%</small></span>
        <span class="progress">
          <span class="progress-bar" style="width: 68%"></span>
        </span>
      </div>
    </li>
    <li>
      <a href="/skin/learning.php"> 법정교육 </a>
      <div class="state-box">
        <span class="unit">0<small>%</small></span>
        <span class="progress">
          <span class="progress-bar" style="width: 0%"></span>
        </span>
      </div>
    </li>
    <li>
      <a href="#">리더십</a>
    </li>
    <li>
      <a href="/skin/insight.php">인사이트 </a>
      <!-- 2depth -->
      <ul class="depth02">
        <li>
          <a href="./insight.php">
            <span class="ico-box">
              <img src="/img/ico/ico_economy.svg" />
            </span>
            경제와 사회
          </a>
        </li>
        <li>
          <a href="#">
            <span class="ico-box">
              <img src="/img/ico/ico_future.svg" />
            </span>
            기술과 미래
          </a>
        </li>
        <li>
          <a href="#">
            <span class="ico-box">
              <img src="/img/ico/ico_trend.svg" />
            </span>
            트렌드 업
          </a>
        </li>
        <li>
          <a href="#">
            <span class="ico-box">
              <img src="/img/ico/ico_health.svg" />
            </span>
            행복과 건강
          </a>
        </li>
        <li>
          <a href="#">
            <span class="ico-box">
              <img src="/img/ico/ico_people.svg" />
            </span>
            피플스토리
          </a>
        </li>
        <li>
          <a href="#">
            <span class="ico-box">
              <img src="/img/ico/ico_life.svg" />
            </span>
            라이프
          </a>
        </li>
      </ul>
    </li>
    <li>
      <a href="/skin/biztrend.php">비즈트렌드</a>
    </li>
  </ul>
</div>
