<ul id="accordion" class="gnb accordion">
    <li class="home open">
        <a th:href="@{/dashboard/main}" class="link">HOME</a>
        <ul class="gnb_2depth"></ul>
    </li>
    <li class="statistics">
        <a href="javascript:void(0);" class="link">통계</a>
        <ul class="gnb_2depth">
            <li><a href="#">매체별 통계</a></li>
            <li><a href="#">광고별 통계</a></li>
        </ul>
    </li>
    <li class="question">
        <a href="javascript:void(0);" class="link">문의</a>
        <ul class="gnb_2depth">
            <li><a th:href="@{/consult/consults}">상담 신청 리스트</a></li>
            <li><a th:href="@{/consult/exceptConsults}">상담 제외 리스트</a></li>
        </ul>
    </li>
    <li class="setting">
        <a href="javascript:void(0);" class="link">환경설정</a>
        <ul class="gnb_2depth">
            <li><a href="#">계정관리</a></li>
            <li><a href="#">계정권한 관리</a></li>
            <li><a href="#">메뉴권한 관리</a></li>
        </ul>
    </li>
    <li class="setting">
        <a href="javascript:void(0);" class="link">로또생성기</a>
        <ul class="gnb_2depth">
            <li><a th:href="@{/generateNumber}">로또 번호 리스트</a></li>
        </ul>
    </li>
<style>


.accordion .open {
  background: #f6f8ff;
}

.gnb_2depth {display: none;}
</style>
<script>

var Accordion = function (el, multiple) {
    this.el = el || {};
    this.multiple = multiple || false;
    var links = this.el.find('.link');
    links.on('click', {el: this.el, multiple: this.multiple}, this.dropdown);

};

Accordion.prototype.dropdown = function (e) {
    var $el = e.data.el;
    $this = $(this),
    $next = $this.next();
    $next.slideToggle();
    $this.parent().addClass('open');


    if (!e.data.multiple) {
        $el.find('.gnb_2depth').not($next).slideUp().parent().removeClass('open');
    };
};
var accordion = new Accordion($('#accordion'), false);

</script>