【ソースコード】番外編：アコーディオンメニューの練習
index.html
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>タイトル</title>
<meta name="description" content="テキストテキストテキストテキストテキストテキスト">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css">
<link rel="stylesheet" href="css/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="js/main.js"></script>
</head>
<body>
<div class="content">
<h2 class="title">募集職種</h2>
<ul id="ac-menu">
<li>
<div class="label">１．Webディレクター</div>
<div class="detail">
<dl>
<dt>仕事内容</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>応募資格</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>必須スキル</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>給与</dt>
<dd>XXX万～XXX万 (スキル・経験・実績により優遇)</dd>
<dt>休日・休暇</dt>
<dd>土日祝祭日、有給休暇、夏季休暇、年末年始休暇、産前産後休暇、育児休暇</dd>
<dt>雇用形態</dt>
<dd>正社員（試用期間3ヶ月）<br>業務委託</dd>
<dt>勤務時間</dt>
<dd>フレックスタイム</dd>
<dt>勤務地</dt>
<dd>東京</dd>
</dl>
</div>
</li>
<li>
<div class="label">２．Webデザイナー</div>
<div class="detail">
<dl>
<dt>仕事内容</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>応募資格</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>必須スキル</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>給与</dt>
<dd>XXX万～XXX万 (スキル・経験・実績により優遇)</dd>
<dt>休日・休暇</dt>
<dd>土日祝祭日、有給休暇、夏季休暇、年末年始休暇、産前産後休暇、育児休暇</dd>
<dt>雇用形態</dt>
<dd>正社員（試用期間3ヶ月）<br>業務委託</dd>
<dt>勤務時間</dt>
<dd>フレックスタイム</dd>
<dt>勤務地</dt>
<dd>東京</dd>
</dl>
</div>
</li>
<li>
<div class="label">３．プログラマー</div>
<div class="detail">
<dl>
<dt>仕事内容</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>応募資格</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>必須スキル</dt>
<dd>テキストテキストテキストテキスト</dd>
<dt>給与</dt>
<dd>XXX万～XXX万 (スキル・経験・実績により優遇)</dd>
<dt>休日・休暇</dt>
<dd>土日祝祭日、有給休暇、夏季休暇、年末年始休暇、産前産後休暇、育児休暇</dd>
<dt>雇用形態</dt>
<dd>正社員（試用期間3ヶ月）<br>業務委託</dd>
<dt>勤務時間</dt>
<dd>フレックスタイム</dd>
<dt>勤務地</dt>
<dd>東京</dd>
</dl>
</div>
</li>
</ul>
</div>
</body>
</html>