<body>
<!-- 전체 컨테이너 영역 -->
<div class="container">
<!-- 헤더 영역 -->
<div class="header">
<!-- 로고 영역 (클릭 시 메인페이지로 넘어가기) -->
<div>
<a href="#">
<img src="./src/bee1.jpg" alt="" id="home-logo">
</a>
</div>
<div>
<!-- 검색창 -->
<div class="search-area">
<!-- form 내부 input 태그 값을 서버 또는 페이지로 전달 -->
<form action="#" name="search-form">
<!-- fieldset : form 내부에서 input을 종류별로 묶는 용도로 많이 사용 -->
<fieldset>
<!-- autocomplete="off" : HTML 기본 자동완성 사용 X -->
<input type="search" id="query" name="query"
autocomplete="off" placeholder="검색어를 입력해주세요.">
<!-- 검색버튼 -->
<button id="search-btn" class="fa-solid fa-magnifying-glass"></button>
</fieldset>
</form>
</div>
</div>
<!-- 공백영역 -->
<div></div>
</div>
<!-- 헤더 영역 끝 -->
<!-- nav 영역 시작-->
<div class="nav">
<ul>
<li><a href="#">공지사항</a></li>
<li><a href="#">자유 게시판</a></li>
<li><a href="#">질문 게시판</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">1:1문의</a></li>
</ul>
</div>
<!-- nav 영역 끝 -->
<!-- content 영역 시작 -->
<div class="content">
<!-- content 내용 영역 -->
<div class="content-1"></div>
<!-- 아이디/비밀번호/로그인버튼 영역 -->
<div class="content-2">
<form action="#" name="login-form">
<fieldset id="id-pw-area">
<div>
<input type="text" name="inputId" placeholder="아이디">
<input type="password" name="inputPw" placeholder="비밀번호">
</div>
<div>
<!-- button의 type 기본값은 submit -->
<button>로그인</button>
</div>
</fieldset>
<!-- 회원가입 / ID/PW 찾기 영역 -->
<div id="signup-find-area">
<a href="#">회원가입</a>
<span>|</span>
<a href="#">ID/PW 찾기</a>
</div>
</form>
</div>
</div>
<!-- content 영역 끝 -->
<!-- 전체 컨테이너 영역 끝 -->
</div>
<!-- footer 영역 시작 -->
<div class="footer">
<p>Copyright © KH Information Educational Institute A-Class</p>
<div>
<a href="#">프로젝트 소개</a>
<span>|</span>
<a href="#">이용약관</a>
<span>|</span>
<a href="#">개인정보처리방침</a>
<span>|</span>
<a href="#">고객센터</a>
</div>
</div>
<!-- footer 영역 끝 -->