<div id="btn_side">
<button type="button" id="side_mn_btn"><a href="#"><span class="sound_only"> 메뉴 열기</span></a></button>
</div>
<div id="side_menu">
<div class="side_close"><button type="button">닫기</button></div>
<div class="side_wr add_side_wr">
  <div style="padding:5%;text-align:center;">
  <a href="<?php echo G5_URL ?>"><img src="<?php echo G5_IMG_URL ?>/mobile/logo_m.png"alt="<?php echo $config['cf_title']; ?>"width="120px"></a>
  </div>
<aside id="isroll_wrap" class="side_inner_rel">
<div class="side_inner_abs">
<nav class="side_menu">
<ul>
<?php
$sql = " select *
from {$g5['menu_table']}
where me_mobile_use = '1'
and length(me_code) = '2'
order by me_order, me_id ";
$result = sql_query($sql, false);
for ($i=0; $row=sql_fetch_array($result); $i++) {
?>
<li class="mu_title">
<?php
$submenus = '';
$sql2 = " select *
from {$g5['menu_table']}
where me_mobile_use = '1'
and length(me_code) = '4'
and substring(me_code, 1, 2) = '{$row['me_code']}'
order by me_order, me_id ";
$result2 = sql_query($sql2);
for ($k=0; $row2=sql_fetch_array($result2); $k++) {
if($k == 0) {
$submenus .= '<button type="button" class="sub_toggle">하위메뉴</button>'.PHP_EOL;
$submenus .= '<ul class="sub_menu">'.PHP_EOL;
}
$submenus .= '<li><a href="'.$row2['me_link'].'" target="_'.$row2['me_target'].'" class="gnb_2da">'.$row2['me_name'].'</a></li>'.PHP_EOL;
}
if($k > 0)
$submenus .= '</ul>'.PHP_EOL;
if($submenus)
$gnb_class = 'sd_cl';
else
$gnb_class = 'sd_cl';
?>
<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="<?php echo $gnb_class; ?>"><?php echo $row['me_name'] ?></a>
<?php echo $submenus; ?>
</li>
<?php
}
if ($i == 0) { ?>
<li id="side_menu_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하세요.<?php } ?></li>
<?php } ?>
</ul>
</nav>
</div>
</aside>
</div>
</div>
<script>
        //사이드 메뉴
        var $btn_side = $("#btn_side"),
            $side_menu = $("#side_menu"),
            $side_wr = $("#side_menu .side_wr"),
            side_obj = { my : {} },
            is_trans_sup = '';
       
        $side_wr.css({"right":"-280px"});   //초기화
       
        side_obj.destory = function(){
            if( !is_trans_sup ) return;
            side_obj.my.destroy();
        }
        side_obj.refresh = function(){
            if( !is_trans_sup ) return;
            side_obj.my.refresh();
        }
       
        function iscroll_loaded() {
            if( is_trans_sup ){
                $side_wr.removeClass("add_side_wr");
                side_obj.my = new IScroll('#isroll_wrap', { bounceTime : 400, mouseWheel: true, click: true, hScroll:false });
            }
        }
       
        $btn_side.on("click", function() {
            if (!$(this).data('toggle_enable')) {
                $(this).data('toggle_enable', true);
                $side_menu.show();
                $side_wr.animate({"right": "0px"}, 200, function(){
                    iscroll_loaded();
                    height_update($(this));
                });
            } else {
                remove_side_data();
            }
        });
       
        $(document).on("click", ".side_close", function(e){
            if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){
                remove_side_data();
            }
        })
       
        function height_update(target){
            var side_wr_height = target.height();
            $("body").css({"min-height":side_wr_height+"px"}).addClass("over_hidden");
        }
       
        function remove_side_data(){
            $btn_side.data('toggle_enable', false);
            $side_wr.animate({"right": "-280px"}, 160, function(){
                $side_menu.hide();
                $("body").removeClass("over_hidden").css({"min-height":""});
            });
        }
       
        $("#side_menu .side_wr").on("clickoutside", function(e){
            //if ( !$(e.target).is('#btn_side *, #btn_side') ){
            if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){
                remove_side_data();
            }
        });
       
        // 서브메뉴 열기
        $(function (){
            $(".sub_toggle").on("click", function() {
                var $this = $(this);
                $sub_ul = $(this).closest("li").children("ul.sub_menu");
       
                if($sub_ul.size() > 0) {
                    var txt = $this.text();
       
                    if($sub_ul.is(":visible")) {
                        txt = txt.replace(/닫기$/, "열기");
                        $this
                            .removeClass("sd_cl")
                            .text(txt);
                    } else {
                        txt = txt.replace(/열기$/, "닫기");
                        $this
                            .addClass("sd_cl")
                            .text(txt);
                    }
       
                    $sub_ul.toggle();
                }
            });
        });
        </script>