webadmin.php

/home/mjc1/public_html/j3demo/shopm/index_test.php

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=3.0, minimum-scale=1.0, user-scalable=yes" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10,chrome=1">
    <title><?php echo $config['shop_title'];?> <?php echo $title;?></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <link href="<?php //echo $j3_css_url;?>http://shop.mjsoft.co/j3/hjwcs3/css/mobile.css" rel="stylesheet" />
<style>
html, body {padding:0px;margin:0px;}
.screen_out{ visibility:hidden; overflow:hidden; position:absolute; left:-9999px; width:0; height:0; font-size:0; line-height:0;}
</style>
</head>
<body style="overflow:hidden;">

<style>
#wrap {position:relative;width:100%;height:100%;}
header {position:fixed;top:0;left:0;width:100%;height:50px;z-index:100;transition:top 0.3s;background-color:#FFF}
header h1 {height:50px;text-align:center;}
header h1 a img {padding:5px 0;height:40px;}

header > a {width:40px;height:40px;}
header > a img {padding:8px;width:24px;height:24px;}
header > #btn_cate {position:absolute;top:5px;left:5px;}
header > #btn_search {position:absolute;top:5px;right:45px;}
header > #btn_cart {position:absolute;top:5px;right:5px;}

#container {margin:50px 0 0;}
#gnb {width:100%;height:40px;text-align:center;border-top:1px solid #ddd;border-bottom:2px solid #60b23b;}
#gnb li {float:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
#gnb li a {display:inline-block;padding-top:3px;font-size:13px;font-weight:600;letter-spacing:-1px;line-height:40px;}

#main_banner img {width:100%;height:100%;}

#main_section {position:relative;}
#main_section h2 {line-height:40px;text-align:center;font-weight:600;}

.sbn_side li:first-child {margin-top:0;}
.sbn_side li {margin:10px;}

#btn_more a {display:block;width:100%;height:30px;text-align:center;font-size:13px;line-height:30px;border-bottom:1px solid #ccc;}
#btn_more a em {margin-right:5px;font-style:normal;}

.wave_bg img {width:100%;height:100%;}
.smt_10 {padding:0 10px;background:#eee;}
.smt_10 ul {width:100%;height:380px;}
.smt_10 li {position:relative;float:left;margin:0 2% 2% 0;width:32%;height:180px;background:#FFF;}
.smt_10 li:nth-child(3n) {margin:0 0 2% 0;}
.smt_10 li .sct_title {padding:5px 5px 0;font-size:0.82em;font-weight:600;}
.smt_10 li .sct_basic {padding:0 5px;color:#777;font-size:0.75em}
.smt_10 li .sct_cost {position:absolute;right:0;bottom:5px;padding:0 5px;text-align:right;}
.smt_10 li .sct_cost strike {color:#999;font-size:0.42em;font-weight:600;}
.smt_10 li .sct_cost .cost2 {color:#00bbb6;font-size:1em;font-weight:bold;}
.smt_10 li .sct_cost span {color:#00bbb6;font-size:10px;}
#page {position:relative;margin:15px 0;height:32px;text-align:center;}
#page > a {display:inline-block;width:30px;height:30px;border:1px solid #e6e6e6;}
#page > a > img {padding:3px 0 0;width:20px;height:20px;}
.here {color:#fe5a59;}
#page > span {margin:0 10px;vertical-align:middle;}

.smt_20 {border-bottom:1px solid #ddd;}
.smt_20 ul {width:100%;height:180px;}
.smt_20 li {position:relative;float:left;margin:0 2% 2%;width:30%;height:180px;}
.smt_20 li:nth-child(3n) {margin:0 0 2% 0;}
.smt_20 li .sct_img img {border-radius:999px;}
.smt_20 li .sct_title {padding:5px 5px 0;font-size:0.82em;font-weight:600;}
.smt_20 li .sct_basic {padding:0 5px;color:#777;font-size:0.75em}
.smt_20 li .sct_cost {position:absolute;right:0;bottom:5px;padding:0 5px;text-align:right;}
.smt_20 li .sct_cost strike {color:#999;font-size:0.42em;font-weight:600;}
.smt_20 li .sct_cost .cost2 {color:#00bbb6;font-size:1em;font-weight:bold;}
.smt_20 li .sct_cost span {color:#00bbb6;font-size:10px;}

.smt_30 {margin:0 10px;}
.smt_30 ul {width:100%;height:252px;}
.smt_30 li {position:relative;float:left;padding:10px 2.3%;margin-right:-1px;width:45%;height:230px;border:1px solid #ccc;}
.smt_30 li .sct_title {padding:5px 5px 0;font-size:0.82em;font-weight:600;}
.smt_30 li .sct_basic {padding:0 5px;color:#777;font-size:0.75em}
.smt_30 li .sct_cost {position:absolute;right:0;bottom:5px;padding:0 5px;text-align:right;}
.smt_30 li .sct_cost strike {color:#999;font-size:0.42em;font-weight:600;}
.smt_30 li .sct_cost .cost2 {font-size:1em;font-weight:bold;}
.smt_30 li .sct_cost span {font-size:10px;}

.smt_40 {padding:0 10px;}
.smt_40 ul {width:100%;height:420px;}
.smt_40 li {position:relative;float:left;margin:0 0 10px;width:100%;height:130px;background:#f8f8f8;}
.smt_40 li .sct_img {float:left;margin-right:10px;} 
.smt_40 li .sct_title {padding:5px 5px 0;font-size:0.82em;font-weight:600;}
.smt_40 li .sct_basic {padding:0 5px;color:#777;font-size:0.75em}
.smt_40 li .sct_cost {position:absolute;right:0;bottom:5px;padding:0 5px;text-align:right;}
.smt_40 li .sct_cost strike {color:#999;font-size:0.42em;font-weight:600;}
.smt_40 li .sct_cost .cost2 {font-size:1em;font-weight:bold;}
.smt_40 li .sct_cost span {font-size:10px;}

.smt_50 {margin:0 10px;}
.smt_50 ul {width:100%;height:490px;}
.smt_50 li {position:relative;float:left;margin:0 10px 10px 0;width:48.5%;height:240px;}
.smt_50 li:nth-child(2n) {margin:0 0 10px 0;}
.smt_50 li .sct_title {padding:5px 5px 0;font-size:0.82em;font-weight:600;}
.smt_50 li .sct_basic {padding:0 5px;color:#777;font-size:0.75em}
.smt_50 li .sct_cost {position:absolute;left:0;bottom:5px;padding:0 5px;}
.smt_50 li .sct_cost strike {color:#999;font-size:0.42em;font-weight:600;}
.smt_50 li .sct_cost .cost2 {font-size:1em;font-weight:bold;}
.smt_50 li .sct_cost span {font-size:10px;}

#cs_menu {width:100%;height:35px;text-align:center;border-top:1px solid #000;border-bottom:1px solid #000;background:#333;}
#cs_menu li {float:left;width:19.75%;border-right:1px solid #000;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
#cs_menu li:last-child {border-right:0px none;}
#cs_menu li a {display:inline-block;width:100%;color:#777;font-size:13px;letter-spacing:-1px;line-height:35px;}

#notice {padding:0 10px;height:40px;line-height:40px;background:#f8f8f8}
#notice h2 {float:left;margin-right:10px;font-size:14px;}
#notice em {float:left;display:inline-block;width:55%;font-size:13px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
#notice span {float:right;color:#999;font-size:12px;}
#notice span > a {padding:0 7px;text-align:center;}

#customer {margin:15px 10px;height:76px;}
#customer h3 {margin:0 0 5px;font-size:14px;line-height:14px;}
#bank, #tel {float:left;width:48%;}

#bank {margin-right:4%;}
#bank p {font-size:10px;line-height:19px;letter-spacing:-0.5px;}
#bank p span {color:#999}

#tel p {font-size:9px;line-height:16px;letter-spacing:-0.5px;}
#tel .tel_num {color:#00bbb6;font-size:24px;line-height:25px;font-weight:600;letter-spacing:0px;}
#tel .lunch {color:#999;}

footer {border-top:1px solid #eee;background:#f8f8f8}
#fnb {width:100%;padding:10px 0;text-align:center;}
#fnb a {padding:0 10px;color:#777;font-size:11px;line-height:12px;border-right:1px solid #ccc;}
#fnb a:last-child {border-right:0px none;}

#info {color:#999;font-size:8px;text-align:center;line-height:15px;letter-spacing:-1px;}
#info em {margin:0 3px;font-size:9px;font-weight:600;}

#copyright {padding:10px 0 5px;color:#555;font-size:10px;text-align:center;}
</style>



<div id="wrap">
    <!-- 상단메뉴고정 -->
    <header>
        <h1><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/mobile_logo.png" alt="쇼핑몰명" title="쇼핑몰명"></a></h1>
        <!--<a id="btn_cate" href="#cate_open" class="open"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_menu.png" alt="메뉴"></a>-->
        <a id="btn_cate" class="gnb_open"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_menu.png" alt="메뉴"></a>
        <a id="btn_search"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_search.png" alt="검색"></a>
        <a id="btn_cart"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_cart.png" alt="장바구니"></a>
    </header>
    <!-- //상단메뉴고정 -->







<script src="http://shop.mjsoft.co/j3/hjwcs3/plugin/simple-sidebar/dist/jquery.simpler-sidebar.min.js"></script>
<script>
    $(document).ready(function() {
        $('#main-sidebar').simplerSidebar({
            opener:'.gnb_open',
            top:0,                    
            animation:{
                easing:"easeOutQuint"
            },
            sidebar:{
                closingLinks:'.close-sb',
                width:180,
                align:'left'
            }
        });

        $("#main-sidebar").show();
    });

    /*$(function(){
        $(".menu_next_gt").click(function(){ // 서브 메뉴 가져옴
            v_this_li = $(this).closest("li");
            v_ca_ul = $(v_this_li).find(".sub1_ul");
            
            if($(v_ca_ul).attr("class")==undefined){ // ajax로 가져온게 없으면 가져온
                v_ca_id = $(this).closest("li").find("input[name='ca_id']").val();
                $.get("<?php echo G5_MSHOP_URL?>/ajax.get_sub_ca_menu.php?ca_id="+v_ca_id,function(rtn){
                    v_this_li.append(rtn);
                });
            } else { // ajax로 가져온게 있으면 보이기/안보이기함
                if($(v_ca_ul).css("display")=='none'){
                    v_ca_ul.show();
                } else {
                    v_ca_ul.hide();
                }
            }
        });

        
    });*/
</script>

<style>
.main-sidebar {position:fixed;top:0;bottom:0;background-color:#77c7c8;color:white;width:300px;}
.main-sidebar a:link {color:#f0f0f0;}
.main-sidebar a:visited {color:#f0f0f0;}
.main-sidebar a:hover {color:#f0f0f0;}
.main-sidebar a:active {color:#f0f0f0;}
.main-sidebar .section {margin:1em 0;margin-bottom:2em !important;}
.main-sidebar .main-sidebar-wrapper nav ul li {line-height:25px;font-size:1.3em;font-size:14px;padding:5px 0px 5px 15px;border-bottom:1px solid #5ab4b5;font-weight:bold;}

.main-sidebar-right {right:0;text-align:left;}
.main-sidebar-left {left:0;text-align:left;}
[data-ssbplugin="sbwrapper"] {padding:0em;}
.dynamic-right .main-navbar-content {float:right;}
.dynamic-left .main-navbar-content {float:left;}
.main-sidebar-wrapper {position:relative;height:100%;overflow-y:auto;overflow-x:hidden;padding:0em;}

.main-sidebar-wrapper ul li {position:relative;}
.menu_next_gt, .menu_next_gt2 {position:absolute;right:5px;top:3px;}
</style>

<div id="main-sidebar" class="main-sidebar main-sidebar-right" style='position: fixed; top: 0px; bottom: 0px; width: 180px; left: -180px; z-index: 3000;'>
    <div id="main-sidebar-wrapper" class="main-sidebar-wrapper">
        <nav>
            <span class="sound_only">[상품 메뉴]</span>
            <ul>
                <li><a href=''>카테고리이름</a></li>
                <li><a href=''>카테고리이름</a></li>
                <li><a href=''>카테고리이름</a></li>
                <li><a href=''>카테고리이름</a></li>
                <li><a href=''>카테고리이름</a></li>
            </ul>
        </nav>
    </div>
</div>
































<!-- 새로 만든 것 -->
<style>
#cate_open {position:absolute;left:0;top:-50px;width:70%;z-index:200;}
#cate_wrap {position:relative;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;background:#eee;}
#cate_wrap h1 {padding:7px 10px;height:26px;background:#00bbb6;}
.btn_login {display:block;width:70px;height:24px;line-height:24px;text-align:center;border:1px solid #FFF;border-radius:100px;}
.btn_login span {color:#FFF;font-weight:600;font-size:14px;}
.close {position:absolute;right:10px;top:5px;width:24px;height:24px;}

#cate_open article {display:block;overflow:hidden;}
#cate_open article h2 {margin:15px 0 5px;height:14px;padding-left:10px;color:#999;font-size:14px;}
#lnb li {float:left;padding-left:4%;margin:0 1px 1px 0;width:45.8%;height:37px;line-height:32px;background:#FFF;}
#lnb li:nth-child(even) {margin-right:0px;}
#lnb li a {display:block;margin-top:3px;color:#555;font-size:13px;font-weight:600;letter-spacing:-0.5px;}
#lnb li a img {margin:-9px 5px 0 0;}

#member {margin-bottom:10px;}
#member ul {margin:0 10px;}
#member li {float:left;margin:0 1px 1px 0;padding-left:10px;width:45.3%;height:35px;line-height:35px;background:#FFF;}
#member li:nth-child(even) {margin-right:0px;}
#member li a {display:block;margin-top:3px;font-size:13px;font-weight:600;letter-spacing:-0.5px;background:url('http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_go.png') top right no-repeat}

#cscenter {position:absolute;bottom:0px;padding-bottom:15px;text-align:center;background:#00bbb6;}
#cscenter h2 {margin:15px 0 5px;color:#000;font-size:14px;line-height:14px;}
#cscenter tel {height:24px;color:#FFF;font-size:24px;font-weight:600;}
#cscenter p {color:#ddd;font-size:10px;line-height:16px;letter-spacing:-0.5px;}
#cscenter .lunch {color:#555;}
</style>
    <!-- 좌측메뉴 -->
    <div id="cate_open" style="display:none;">
        <div id="cate_wrap">
            <h1 id="login"><a class="btn_login"><span>로그인</span></a><a href="#" class="close"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_close.png" alt="" style="width:100%;height:100%;"></a></h1>

            <article id="lnb">
                <h2>카테고리</h2>
                <ul>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb1.png" alt="한식ㆍ밑반찬" style="width:17px;height:17px;">한식ㆍ밑반찬</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb2.png" alt="면류ㆍ파스타" style="width:17px;height:17px;">면류ㆍ파스타</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb3.png" alt="찌개ㆍ국물류" style="width:17px;height:17px;">찌개ㆍ국물류</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb4.png" alt="축산ㆍ계란류" style="width:17px;height:17px;"">축산ㆍ계란류</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb5.png" alt="수산ㆍ해산물" style="width:17px;height:17px;">수산ㆍ해산물</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb6.png" alt="야채ㆍ샐러드" style="width:17px;height:17px;">야채ㆍ샐러드</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb7.png" alt="간식ㆍ디저트" style="width:17px;height:17px;">간식ㆍ디저트</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb8.png" alt="가공ㆍ냉동류" style="width:17px;height:17px;">가공ㆍ냉동류</a></li>
                    <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_lnb9.png" alt="소스ㆍ양념류" style="width:17px;height:17px;">소스ㆍ양념류</a></li>
                </ul>
            </article>

            <article id="member">
                <h2>회원 바로가기</h2>
                <ul>
                    <li><a>마이페이지</a></li>
                    <li><a>FAQ</a></li>
                    <li><a>1:1문의</a></li>
                    <li><a>장바구니</a></li>
                    <li><a>주문리스트</a></li>
                    <li><a>위시리스트</a></li>
                </ul>
            </article>

            <footer id="cscenter">
                <h2>CS center</h2>
                <tel>052-987-6543</tel>
                <p>평일 09:00~18:00 / 토요일 09:00~12:30</p>
                <p class="lunch">점심 12:00~13:00 / 일.공휴일은 쉽니다.</p>
            </footer>
        </div>
    </div>
<script>
$(document).ready(function () {
    $(".open").click(function(){
        $("#cate_open").slideDown("fast");
        return false;
    });
    
    $(".close").click(function(){
        $("#cate_open").slideUp("fast");
        return false;
    });
});
</script>
    <!-- //좌측메뉴 -->







    <div id="container">
        <ul id="gnb">
            <li style="width:20%;"><a>한식밑반찬</a></li>
            <li style="width:20%;"><a>주문게시판</a></li>
            <li style="width:20%;"><a>New Item</a></li>
            <li style="width:20%;"><a>크리스마스할인</a></li>
            <li style="width:20%;"><a>아이반찬</a></li>
        </ul>
        <div id="top_banner">
            <img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/top_banner.png" alt="상단우측배너" style="width:100%;height:100%;">
        </div>

        <!-- 메인배너 -->
        <section id="main_banner">
            <img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/sample/banner.png" alt="메인배너">
        </section>
        <!-- //메인배너 -->

        <!-- 이벤트 -->
        <section id="main_section" class="sbn_side">
            <h2>이벤트</h2>
            <ul>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/event1.png" alt="이벤트명" style="width:100%;height:100%;"></a></li>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/event2.png" alt="이벤트명" style="width:100%;height:100%;"></a></li>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/event3.png" alt="이벤트명" style="width:100%;height:100%;"></a></li>
            </ul>
        </section>
        <!-- //이벤트 -->

        <!-- 히트상품 -->
        <div class="wave_bg"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/bg_wave.png" alt="웨이브배경"></div>
        <section id="main_section" class="smt_10">
            <h2>HIT ITEM</h2>
            <ul>
                <!-- 첫줄 -->
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>

                <!-- 두번째줄 -->
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>
        </section>
        <div id="btn_more">
            <a><em>HIT ITEM</em>전체보기<span>+</span></a>
        </div>
        <!-- //히트상품 -->

        <!-- 베스트상품 -->
        <section id="main_section" class="smt_20">
            <h2>BEST ITEM</h2>
            <ul>
                <!-- 첫줄 -->
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>

            <div id="page">
                <a class="btn_prev"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_back.png"></a><span><em class="here">5</em> / 10</span><a class="btn_next"><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/ico_next.png"></a>
            </div>
        </section>
        <div id="btn_more">
            <a><em>BEST ITEM</em>전체보기<span>+</span></a>
        </div>
        <!-- //베스트상품 -->


        <section id="main_section" class="sbn_banner">
            <h2 class="screen_out">광고배너</h2>
            <ul>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/sample/banner1.png" alt="광고배너1" style="width:100%;height:100%;"></a></li>
            </ul>
        </section>

        <!-- 신규상품 -->
        <section id="main_section" class="smt_30">
            <h2>NEW ITEM</h2>
            <!-- 첫줄 -->
            <ul>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>

            <!-- 두번째줄 -->
            <ul>
                <li style="margin-top:-1px;">
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li style="margin-top:-1px;">
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>
        </section>
        <div id="btn_more" style="margin-top:10px;border-top:1px solid #ddd;">
            <a><em>NEW ITEM</em>전체보기<span>+</span></a>
        </div>
        <!-- //신규상품 -->

        <section id="main_section" class="sbn_banner">
            <h2 class="screen_out">광고배너</h2>
            <ul>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/sample/banner2.png" alt="광고배너2" style="width:100%;height:100%;"></a></li>
            </ul>
        </section>

        <!-- 인기상품 -->
        <section id="main_section" class="smt_40">
            <h2>HOT ITEM</h2>
            <!-- 첫줄 -->
            <ul>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="height:130px"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="height:130px"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="height:130px"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>
        </section>
        <div id="btn_more" style="border-top:1px solid #ddd;">
            <a><em>HOT ITEM</em>전체보기<span>+</span></a>
        </div>
        <!-- //인기상품 -->

        <section id="main_section" class="sbn_banner">
            <h2 class="screen_out">광고배너</h2>
            <ul>
                <li><a><img src="http://shop.mjsoft.co/j3/hjwcs3/img/mobile/sample/banner3.png" alt="광고배너3" style="width:100%;height:100%;"></a></li>
            </ul>
        </section>

        <!-- 할인상품 -->
        <section id="main_section" class="smt_50">
            <h2>SALE ITEM</h2>
            <!-- 첫줄 -->
            <ul>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
                <li>
                    <div class="sct_img"><a><img src="http://shop.mjsoft.co/j3/hjwcs3/data/product/17/17_pic1_285_285" alt="제품이미지" style="width:100%"></a></div>
                    <div class="sct_title"><a>브라질세라허니</a></div>
                    <div class="sct_basic"><a>비고란입니다.</a></div>
                    <div class="sct_cost"><a>
                        <strike>18,000</strike><em class="cost2">15,200</em><span>원</span>
                    </a></div>
                </li>
            </ul>
        </section>
        <div id="btn_more" style="margin-top:10px;border-top:1px solid #ddd;">
            <a><em>SALE ITEM</em>전체보기<span>+</span></a>
        </div>
        <!-- //할인상품 -->
    </div><!-- #container -->


    <!-- 고객센터 -->
    <div>
        <h1 class="screen_out">하단메뉴</h1>
        <div id="cs_menu">
            <ul>
                <li><a>로그인</a></li>
                <li><a>1:1문의</a></li>
                <li><a>마이페이지</a></li>
                <li><a>주문내역</a></li>
                <li><a>PC버전</a></li>
            </ul>
        </div>
        <div id="notice">
            <h2>Notice</h2>
            <p><em>코멘트 이벤트 당첨자 사은품수령 안내</em><span>2017.01.26 <a>+</a></span></p>
        </div>
        <div id="customer">
            <h2 class="screen_out">고객센터</h2>
            <div id="bank">
                <h3>Online-Bank</h3>
                <p>기업은행 000-00000-00-000 <span>(홍길동)</span></p>
                <p>우리은행 0000-000-000000 <span>(홍길동)</span></p>
                <p>국민은행 000000-00-000000 <span>(홍길동)</span></p>
            </div>

            <div id="tel">
                <h3>CS center</h3>
                <p class="tel_num">052-987-6543</p>
                <p>평일 09:00~18:00 / 토요일 09:00~12:30</p>
                <p class="lunch">점심 12:00~13:00 / 일.공휴일은 쉽니다.</p>
            </div>
        </div>
    </div>
    <!-- //고객센터 -->

    <!-- 하단메뉴 -->
    <footer>
        <div id="fnb">
            <a>ABOUT</a><a>GUIDE</a><a>개인정보취급방침</a><a>서비스이용약관</a>
        </div>
        <div id="info">
            <em>회사명</em><span>그린스토어</span>
            <em>주소</em><span>서울특별시 강남구 땡땡로 123(땡땡동 123-45)</span>
            <br>
            <em>사업자등록번호</em><span>123-45-67890</span>
            <em>대표자</em><span>홍길동</span>
            <em>전화</em><span>02-123-4567</span>
            <em>팩스</em><span>02-123-4568</span>
            <br>
            <em>통신판매업신고번호</em><span>서울 강남 789</span>
            <em>개인정보관리책임자</em><span>임꺽정</span>
            <em>E-mail</em><span>green@naver.com</span>

        </div>
        <div id="copyright">Copyright ⓒ 2017 쇼핑몰명. All Rights Reserved.</div>
    </footer>
    <!-- //하단메뉴 -->

</div><!-- #wrap -->

</body>
</html>