/* メニュー全体 */
.item {
  width: 13rem;
}




/* チェックボックスは非表示にする（内部的な Off/On の機能だけ利用する） */
.item input {
    display: none;
}

/* 開いた状態のサブメニュー */
.item input:checked + ul {
    display: block;

}

/* 閉じた状態のサブメニュー */
.item ul {
    display: none;
    /* 下記は開閉によらず共通の設定 */

    background: #eee;
    list-style: none;
    margin: 0;
    padding: 0.3rem;



}

/* 親項目の装飾 */
.item label {
    display: block;
    margin: 0;
    padding: 0.3rem;
    background: #ddd;
    cursor: pointer;


  font-weight: bold;








}



.item label:hover {
    background: #ccc;

}