<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="<?php echo $conf['web_description'] ?>"/>
    <meta name="keywords"  content="<?php echo $conf['keywords'] ?>"/>
    <link rel="stylesheet" href="./assets/simple/css/index.css">
    <link rel="stylesheet" href="./assets/simple/css/index_mobile.css">
    <link href="./assets/simple/css/a67b80f1478e0410cdbe76e1a7e35158.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="./assets/js/jquery.min.js"></script>
    <title><?php echo $conf['web_name'] ?>|<?php echo $conf['web_subtitle'] ?></title>

<body>
<header class="header center-box head-fixed">
    <div class="container space-between-box">
        <div class="logo"><a href=""><img class="logo" src="./assets/img/logo/logo.png?r=<?php echo rand(10000,99999)?>" alt="""/></a></div>
        <ul class="navRoot">
            <li class="navSection right grid"><a href="./consumer/login.php" class="rootLink">用户登录</a><a
                        class="block-btn regbtn"   href="./consumer/register.php">注册</a></li>
        </ul>
        <ul class="navRoot navRoot-Mobile icon">
            <div class="side-toggle">
                <div><span></span><span></span><span></span></div>
            </div>
        </ul>
    </div>
    <div id="header-mask" class="mask" style="display: none">
        <div class="sidebar">
            <ul>
                <li><a href="">首页</a></li>
                <li><a href="./consumer/login.php">用户登录</a></li>
                <li><a href="./consumer/register.php">注册账号</a></li>
            </ul>
            <div class="side-mask"></div>
        </div>
        <div class="sidebar-mask"></div>
    </div>
</header>
<script>$(document).ready(function () {
        var a = !1;
        $(".sidebar a").each(function () {
            -1 < location.href.indexOf($(this).attr("href")) && "/" !== $(this).attr("href") && (a = !0, $(this).addClass("active"))
        });
        a || $(".sidebar a:eq(0)").addClass("active");
        var c = function (a) {
            var b = $("#header-mask");
            a ? ($(".side-toggle>div>span:eq(0)").addClass("toggle1"), $(".side-toggle>div>span:eq(1)").addClass("toggle2"), $(".side-toggle>div>span:eq(2)").addClass("toggle3"), b.addClass("slide-fade-enter-active").show(), setTimeout(function () {
                b.removeClass("slide-fade-enter-active")
            }, 10)) : ($(".side-toggle>div>span:eq(0)").removeClass("toggle1"), $(".side-toggle>div>span:eq(1)").removeClass("toggle2"), $(".side-toggle>div>span:eq(2)").removeClass("toggle3"), b.addClass("slide-fade-leave-active"), setTimeout(function () {
                b.removeClass("slide-fade-leave-active").hide()
            }, 400))
        };
        $(".side-toggle").click(function () {
            c(!$(".side-toggle>div>span:eq(0)").hasClass("toggle1"))
        });
        $("#header-mask").click(function () {
            c(!1)
        })
    });</script>
<div id="banner-area">
    <div class="banner header-box grid" style="opacity: 1; z-index: 88;">
        <div class="header-container container grid center-box">
            <div class="mask quote-mask quote-mask-active">
                <div class="mask1"><img src="./assets/simple/images/bg-mask1_47d5d.png"></div>
                <div class="mask2"><img src="./assets/simple/images/bg-mask2_b8afa.png"></div>
                <div class="mask3"><img src="./assets/simple/images/bg-mask3_af41b.png"></div>
            </div>
            <div class="left"><h2 class="h2 quote quote-active">响应式建站系统</h2>
                <p class="f-tit tit-style quote quote-active">解决建站的快捷高效平台<br>为站长提供，便捷、绿色、安全、快速的网站体验。</p>
                <div class="head-btn-group grid quote quote-active"><a class="head-btn" href="./consumer/index.php" ><i
                                class="sj-icon"></i>立即体验</a></div>
            </div>
            <div class="right space-between-box">
                <div class="small-circle">
                    <div class="circle cir-1 quote-circle-l1 delay12 quote-circle-l1-active"><img
                                src="./assets/simple/images/ills-1_02237.svg"></div>
                    <div class="circle cir-2 quote-circle-l1 delay13 quote-circle-l1-active"><img
                                src="./assets/simple/images/ills-2_6c2eb.svg"></div>
                    <div class="circle cir-3 quote-circle-l1 delay14 quote-circle-l1-active"><img
                                src="./assets/simple/images/ills-3_bd288.svg"></div>
                </div>
                <div class="big-circle center-box"><img class="quote-index-circle quote-index-circle-active"
                                                        src="./assets/simple/images/ills_69b23.png">
                    <div class="anim-bg-circle"><span
                                class="anim-c1 quote-bg-circle delay10 quote-bg-circle-active1"></span><span
                                class="anim-c2 quote-bg-circle delay8 quote-bg-circle-active2"></span><span
                                class="anim-c3 quote-bg-circle delay6 quote-bg-circle-active3"></span></div>
                </div>
            </div>
        </div>
    </div>
</div>
<section class="product anim-product">
    <div class="container"><h3 class="h3"><?php echo $conf['web_name']?></h3>
        <p class="p-text-tit">立即注册账户，享受全新的建站体验</p>
        <div class="grid space-between-box pro-panel">
            <div class="center-box anim-item1">
                <div class="pro-box">
                    <div class="top grid">
                        <div class="G1-icon center-box G1-logo-height"><img style="height: 64px"
                                                                            src="./assets/simple/images/alipay.png"></div>
                        <div class="tit-text"><p class="p-text">在线支付系统</p></div>
                    </div>
                    <div class="bottom"><p class="pro-detail-text">全自动建站系统，在线选择喜欢的网站模板。<br>在线支付订购，网站到期邮件提醒，我们能做的就是给您更好地服务。
                        </p></div>
                    <a href="./consumer/index.php" class="G1-pro-btn"  >立即使用</a></div>
            </div>
            <div class="center-box anim-item2">
                <div class="pro-box">
                    <div class="top grid">
                        <div class="G1-icon G2-icon center-box G1-logo-height"><img style="height: 64px"
                                                                                    src="./assets/simple/images/area_chart.png"></div>
                        <div class="tit-text"><p class="p-text">丰富的统计图表</p></div>
                    </div>
                    <div class="bottom"><p class="pro-detail-text">丰富的统计图形表格，用户的支付金额、支付时间、支付方式一目了然。<br>可视化分析可以对用户的支付习惯有更深层次理解，从而可以根据统计分析结果进行针对性优化，迅速提升销售额。
                        </p></div>
                    <a href="./consumer/index.php" class="G2-pro-btn"  >立即使用</a></div>
            </div>
        </div>
    </div>
</section>
<script>
    var _hmt = _hmt || [];
    (function () {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?f19779a7c7a9d88b02d650c223987f5b";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();
</script>
<style type="text/css">.text-center {
        text-align: center
    }

    .contact {
        bottom: calc(50vh - 12px);
        right: 8px;
        z-index: 10;
        width: 120px;
        background-color: #fff;
        box-shadow: 0 0 4px rgba(0, 0, 0, .2);
        position: fixed;
        font-size: 16px
    }

    .contact.left-contact {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px
    }

    .contact.right-contact {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px
    }

    .contact-close {
        float: right;
        margin-top: -24px;
        cursor: pointer
    }

    .contact-close > .close {
        display: inline-block;
        width: 20px;
        height: 2px;
        background: #aaa;
        line-height: 0;
        font-size: 0;
        vertical-align: middle;
        -webkit-transform: rotate(45deg)
    }

    .contact-close > .close:after {
        content: '/';
        display: block;
        width: 20px;
        height: 2px;
        background: #aaa;
        -webkit-transform: rotate(-90deg)
    }

    .contact-time {
        margin-top: 10px;
        margin-bottom: 10px;
        font-size: 12px;
        color: #aaa
    }

    .contact-list {
        padding: 0;
        margin: 14px 0;
        list-style: none
    }

    .contact-list > li {
        margin-bottom: 10px;
        text-align: center
    }

    .contact-list > li > a {
        cursor: pointer;
        display: inline-block;
        width: 100px;
        height: 30px;
        line-height: 30px;
        font-size: 14px;
        text-align: center;
        color: #fff;
        background-color: #03a9f4;
        border-radius: 2px
    }

    .contact-list > li > a > img {
        position: relative;
        top: 3px;
        display: inline-block;
        width: 13px;
        margin-right: 5px
    }

    .contact-bottom {
        width: 120px
    }

    .bottom-text {
        margin-top: 0;
        font-size: 12px;
        color: #aaa
    }

    @media only screen and (max-width: 480px) {
        .contact-bottom, .bottom-text {
            display: none
        }
    }</style>
<div id="contact" class="contact left-contact right-contact" style="display:none">
    <div class="contact-close text-center" onclick="this.parentNode.parentNode.removeChild(this.parentNode)"><a
                class="close"></ a>
    </div>

    <div id="mobile-qrcode" class="contact-bottom" style="padding:8px"></div>
   </div>
<script type="text/javascript" src="./assets/simple/js/qrcode.min.js"></script>

<footer class="footer">
    <div class="link-box">


        <div class="container beian"><p>Copyright © 2020-2050
                . <?php echo $conf['web_name'] ?> 版权所有</p><?php if($conf['web_icp']){echo " <br/> 网站备案号: <a href='http://beian.miit.gov.cn/' target='_blank'>".$conf['web_icp']."</a>";?> <?php } ?>

        </div>
    </div>
</footer>
</body>
</html>
