<script type="text/javascript">
                
    jQuery(function($) {
        
        // 1. 현재 위치 표시 부분에 current 관련 클래스가 있는 메뉴의 텍스트를 복사 ---------------------------
        // 1-1) 현재 위치 두번째 
        let breadcrumbs_menu_second = $('.breadcrumbs-menu.menu-second .w-text-value');
        let current_second = $('#breadcrumbs-menu-data > .menu > .current-menu-ancestor > a').text();
        if ( $('#breadcrumbs-menu-data > .menu > .current-menu-item').length ) {
            // 서브 메뉴가 없는 메뉴는 클래스명이 다름 (current-menu-item)
            current_second = $('#breadcrumbs-menu-data > .menu > .current-menu-item > a').text();
        }				
        breadcrumbs_menu_second.text(current_second);
        
        // 1-2) 현재 위치 세번째 
        let breadcrumbs_menu_third = $('.breadcrumbs-menu.menu-third .w-text-value');
        let current_third = $('#breadcrumbs-menu-data > .menu > .current-menu-ancestor .sub-menu > .current-menu-item a').text();
        if (current_third) {
            // 서브 메뉴 중에 current-menu-item 클래스를 가진 메뉴가 있는 경우 
            breadcrumbs_menu_third.text(current_third);
        }
        
        // 2. 드롭다운 메뉴 리스트 만들어 붙이기 ------------------------------------------------------
        // 2-1) 2댑스 메뉴들 중 부모 메뉴에 현재 위치가 있는 것을 새 리스트에 담고, 현재 위치 표시 요소에 붙이기 
        let $thirdUl = $('<ul>').addClass('breadcrumbs-menu-sub breadcrumbs-menu-third-sub'); 
        if ( $('#breadcrumbs-menu-data > .menu > .current-menu-ancestor').length ) {					
            // 선택된 모든 요소에 대한 반복문 (.each)
            $('#breadcrumbs-menu-data > .menu > .current-menu-ancestor > ul').each(function(index, element) {
                // 각 요소에 대한 작업 수행
                // index는 현재 요소의 인덱스이고, element는 현재 요소 자체입니다.
                // 예: 각 요소의 텍스트 콘텐츠 출력
                $thirdUl.append($(element).html());	
            });
            $('.breadcrumbs-menu.menu-third').append($thirdUl);						
        } else if ( $('#breadcrumbs-menu-data > .menu > .current-menu-item > ul').length ) { 
            // 자식 메뉴가 있지만, 부모 페이지도 링크를 가진 경우, 클래스명이 달라짐
            $('#breadcrumbs-menu-data > .menu > .current-menu-item > ul').each(function(index, element) {
                $thirdUl.append($(element).html());	
            });
            $('.breadcrumbs-menu.menu-third').append($thirdUl);						
        } else {
            // 자식 메뉴가 없는 페이지는 현재 위치 표시 구조에서 세번째 것을 없앰					
            $('.breadcrumbs-menu.menu-third').remove(); 					
        }
        $('#breadcrumbs-menu-data > .menu .sub-menu').remove();  // 이제 서브 메뉴들은 삭제 
        
        // 2-2) 1댑스 메뉴들만 리스트로 만들어서 현재 위치 표시 요소에 붙이기 (2-1 끝에서 이미 자식 메뉴들은 다 제거된 상태) 
        let $secondUl = $('<ul>').addClass('breadcrumbs-menu-sub breadcrumbs-menu-second-sub');
        // 선택된 모든 요소에 대해 반복
        $('#breadcrumbs-menu-data > .menu').each(function(index, element) {
            $secondUl.append($(element).html());	
        });
        $('.breadcrumbs-menu.menu-second').append($secondUl);				
        $('#breadcrumbs-menu-data').remove();
        
        // 3. hover event check --------------------------------------------------------------
        // 마우스가 요소 위에 올라갔을 때의 이벤트를 체크해서 붙여진 리스트가 보이도록 클래스를 토글(toggle)
        $(".breadcrumbs-menu").hover(function(){
            // 마우스가 요소 위에 있을 때 실행되는 코드
            $(this).find('.breadcrumbs-menu-sub').toggleClass('on');
        }, function(){
            // 마우스가 요소에서 벗어났을 때 실행되는 코드
            $(this).find('.breadcrumbs-menu-sub').toggleClass('on');
        });
        
    }); 				

</script>