header.html

<div id="header">
  <!-- header_wrap, w:100% -->
  <div class="header_wrap">
  <!-- header-inner,margin:0 auto -->
  <div class="header_inner">
  <!-- 로고 -->
  <h1 class="logo"><a href="index.html">삼성전기</a></h1>
  <!-- 주메뉴 -->
  <nav class="gnb">
    <h2 class="blind">주메뉴</h2>
    <ul>
    <li><a href="sub1.html">기업정보</a>
      <div>
        <ul>
          <li><a href="#">기업소개</a>
            <ul>
              <li><a href="#">삼성전기 소개</a></li>
              <li><a href="#">CEO 인사말</a></li>
              <li><a href="#">연혁</a></li>
              <li><a href="#">수상실적</a></li>
              <li><a href="#">사업장 소개</a></li>
              <li><a href="#">홍보 영상</a></li>
            </ul>
          </li>
          <li><a href="#">IR</a>
            <ul>
              <li><a href="#">실적발표</a></li>
              <li><a href="#">주주총회</a></li>
              <li><a href="#">주주현황</a></li>
              <li><a href="#">주가정보</a></li>
              <li><a href="#">재무정보</a></li>
            </ul>
            <ul>
              <li><a href="#">기업지배구조</a></li>
              <li><a href="#">IR자료실</a></li>
              <li><a href="#">전자공고</a></li>
            </ul>
          </li>
          <li><a href="#">ESG</a>
            <ul>
              <li><a href="#">지속가능경영</a></li>
              <li><a href="#">윤리경영</a></li>
              <li><a href="#">준법경영</a></li>
              <li><a href="#">사회공헌</a></li>
              <li><a href="#">환경</a></li>
            </ul>
            <ul>
              <li><a href="#">임직원</a></li>
              <li><a href="#">협력회사</a></li>
              <li><a href="#">고객</a></li>
              <li><a href="#">지속가능성보고서</a></li>
            </ul>
          </li>
          <li><a href="#">행동규범</a></li>
        </ul>
        <div class="gnb_button">
          <a href="#" target="_blank" title="새 창으로 바로가기">
            <strong>온라인 홍보관</strong>
            <p>모두에게 가치 있는 경험을 제공하기 위해 노력해온 삼성전기의 역사를 소개합니다.</p>
          </a>  
        </div>
      </div>
    </li>
  <!-- //1 -->
  
  <!-- 2 -->
  <li><a href="sub2.html">인재채용</a>
  <div>
  <ul>
  <li><a href="#">채용정보</a>
  <ul>
    <li><a href="#">직무 소개</a></li>
    <li><a href="#">채용프로세스</a></li>
    <li><a href="#">채용공고</a></li>
    <li><a href="#">채용 Tips</a></li>
  </ul>
  </li>
  <li><a href="#">회사생활</a>
  <ul>
    <li><a href="#">복리후생</a></li>
    <li><a href="#">인재육성</a></li>
  </ul>
  </li>
  <li><a href="#">채용문의</a>
  <ul>
    <li><a href="#">채용FAQ</a></li>
    <li><a href="#">문의하기</a></li>
  </ul>
  </li>
  <li><a href="#">Recruit Live</a></li>
  </ul>
  </div>
  </li>
  <!-- //2 -->
  
  <!-- 3 -->
  <li><a href="sub1.html">뉴스룸</a>
  <div>
  <ul>
  <li><a href="#">뉴스</a></li>
  <li><a href="#">뉴스레터</a>
  <ul>
    <li><a href="#">뉴스레터 보기</a></li>
    <li><a href="#">뉴스레터 신청</a></li>
  </ul>
  </li>
  </ul>
  </div>
  </li>
  <!-- //3 -->
  
  <!-- 4 -->
  <li><a href="sub2.html">제품정보</a>
  <div>
  <ul>
  <li><a href="#">컴포넌트</a>
    <ul>
    <li><a href="#">MLCC</a></li>
    <li><a href="#">Inductor</a></li>
    <li><a href="#">Chip Resistor</a></li>
    <li><a href="#">Tantalum</a></li>
    </ul>
  </li>
  <li><a href="#">모듈</a>
    <ul>
    <li><a href="#">Camera Module</a></li>
    </ul>
  </li>
  <li><a href="#">인쇄회로기판</a>
  <ul>
    <li><a href="#">Package Substarate</a></li>  
  </ul>
  </li>
    <li><a href="#">적용분야</a>
    <ul>
      <li><a href="#">Automotive</a></li>
      <li><a href="#">Computer</a></li>
      <li><a href="#">Display</a></li>
      <li><a href="#">Hard Disk Drive</a></li>
      <li><a href="#">Mobile Phone</a></li>
    </ul>
    <ul>
      <li><a href="#">Network</a></li>
      <li><a href="#">Server</a></li>
      <li><a href="#">Solid State Drive</a></li>
      <li><a href="#">Tablet</a></li>
      <li><a href="#">Wearable</a></li>
    </ul>
    </li>
    </ul>
    <div class="gnb_button">
      <a href="#" target="_blank" title="새 창으로 바로가기">
      <strong>Product Search</strong>
      <p>원하는 제품을 쉽고 빠르게 검색해보세요.</p></a>
    </div>
    <div class="gnb_button">
      <a href="#" target="_blank" title="새 창으로 바로가기">
      <strong>Component Library</strong>
      <p>시물레이션으로 제품을 한 눈에 파악해 보세요.</p></a>
    </div>
    <div class="gnb_button">
      <a href="#" target="_blank" title="새 창으로 바로가기">
      <strong>Component Library</strong>
      <p>시물레이션으로 제품을 한 눈에 파악해 보세요.</p></a>
    </div>
  </div>
  </li>
  <!-- //4 -->
  
  <!-- 5 -->
  <li><a href="sub1.html">고객지원</a>
  <div>
    <ul>
      <li><a href="#">고객문의</a>
      <ul>
        <li><a href="#">FAQ</a></li>
        <li><a href="#">문의하기</a></li>
      </ul>
      </li>
      <li>
        <a href="#">Sales Partners</a>
        <a href="#">Buy Now</a>
      </li>
      <li><a href="#">인증서</a>
      <ul>
        <li><a href="#">환경/안전/품질</a></li>
        <li><a href="#">제품책임주의</a></li>
      </ul>
      </li>
      <li><a href="#">기술자료</a>
      <ul>
        <li><a href="#">제품카탈로그</a></li>
        <li><a href="#">소프트웨어라이브러리</a></li>
        <li><a href="#">기술문서</a></li>
      </ul>
      </li>
      <li>
        <a href="#">모조품에 대한 면책</a>
        <a href="#">B2Bi(EDI)</a>
        <a href="#">대금지불 안내</a>
        <a href="#">방문신청</a>  
      </li>
    </ul>
  </div>
  </li>
  <!-- //5 -->
  </ul>
    </nav>
  
  <!-- 탑메뉴 -->
  <h3 class="blind">문의하기,sns,홈페이지 언어설정</h3>
  <dl class="topMenu">
    <dt class="blind">탑메뉴</dt>
    <dd><a href="#">문의하기</a></dd>
    <dd><a href="#">SNS</a>
    <ul>
      <li><a href="#" target="_blank" title="새창으로 바로가기">유튜브 바로가기</a></li>
      <li><a href="#" target="_blank" title="새창으로 바로가기">네이버 블로그 바로가기</a></li>
      <li><a href="#" target="_blank" title="새창으로 바로가기">페이스북 바로가기</a></li>
      <li><a href="#" target="_blank" title="새창으로 바로가기">인스타그램 바로가기</a></li>
    </ul>
    </dd>
    <dd>
      <a href="#">KOR</a>
      <ul>
        <li><a href="#">ENG</a></li>
        <li><a href="#">CHN</a></li>
        <li><a href="#">JPN</a></li>
      </ul>
    </dd>
  </dl>
  <!-- 검색버튼 -->
  <div class="btn_srch"><a href="#">검색</a></div>
   </div>
   <!-- //header_inner -->
   </div>
   <!-- //header_wrap -->
   <!-- 통합검색 -->
   <div class="srch_wrap">
    <div class="srch_inner">
      <form>
        <fieldset>
          <legend class="blind">통합검색</legend>
          <label for="srch" class="blind">검색어를 입력하세요.</label>
          <input type="search" id="srch" placeholder="검색어를 입력해주세요" />
          <button type="button">검색버튼</button>
        </fieldset>
        <ul>
          <li><a href="#">Product Search</a></li>
          <li><a href="#">Component Library</a></li>
          <li><a href="#">방문신청</a></li>
          <li><a href="#">사업장소개</a></li>
        </ul>
      </form>
    </div>
    <a href="#" class="btn_srch_close">통합검색 닫기</a>
   </div>
  </div>