html, body {
    font-size: 10px;
    font-family: 微軟雅黑;
}
body {
    max-width: 640px;
    margin: 0 auto !important;
    position: relative;
}
.fl {
    float: left;
}

.fr {
    float: right;
}

.clear {
    clear: both;
}
/*#plugin-publish
{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 99999;
}*/

#plugin-unPublish {
    z-index: 99999;
    position: absolute;
    left: 0;
    width: 100%;
}

#plugin-copyright {
    width: 100%;
    left: 0;
    bottom: -1px;
    position: absolute;
    z-index: 9999;
    background-color: rgba(0,0,0,0.5);
}

#plugin-prop-btn {
    display: none;
    width: 100%;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 999;
    max-height: 5%;
}

#plugin-prop-btn-plugin {
    display: none;
    width: 100%;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 9999;
    max-height: 5%;
}

#plugin-firstBtns {
    display: none;
    position: absolute;
    z-index: 9;
    top: 60%;
    right: 5%;
    max-width: 15%;
}

    #plugin-firstBtns img {
        width: 100%;
    }

#plugin-prop-panel {
    z-index: 9999;
    font-size: 1.6rem;
    display: none;
    background: rgba(0, 0, 0, .7);
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: absolute;
}

    #plugin-prop-panel .img {
        position: absolute;
        width: 80%;
        height: 80%;
        top: 10%;
        left: 10%;
    }

    #plugin-prop-panel .panel {
        width: 80%;
        height: auto;
        /* margin: auto 0; */
        /*background-color: #fff;*/
        position: absolute;
        top: 10%;
        left: 10%;
        text-align: center;
    }

        #plugin-prop-panel .panel .qrcode {
            width: 90%;
            margin: 5% 0 0 0;
        }

        #plugin-prop-panel .panel .tip {
            position: initial;
            height: 15%;
            line-height: 2rem;
            color: #fff;
        }

#plugin-unPublish img, #plugin-copyright img {
    width: 100%;
}

#plugin-mycoupon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: none;
    background-color: rgba(0,0,0,0.7);
}

    #plugin-mycoupon .panel {
        z-index: 1002;
        position: absolute;
        top: 10%;
        left: 5%;
        width: 90%;
        height: 80%;
    }

        #plugin-mycoupon .panel .nothing {
            font-size: 1.6rem;
            text-align: center;
        }

        #plugin-mycoupon .panel .list {
            position: absolute;
            top: 15%;
            left: 5%;
            width: 90%;
            height: 70%;
            overflow: auto;
        }

            #plugin-mycoupon .panel .list .item {
                width: 90%;
                height: 30%;
                position: relative;
                text-align: center;
                margin: 5% 5%;
            }

                #plugin-mycoupon .panel .list .item .name {
                    font-size: 2rem;
                    color: #fff;
                    line-height: 20px;
                    position: absolute;
                    top: 15%;
                    /* text-align: center; */
                    width: 100%;
                }

                #plugin-mycoupon .panel .list .item .couponno {
                    FONT-SIZE: 1.6rem;
                    color: #fff;
                    position: absolute;
                    top: 48%;
                    /* margin: 0px 15% 0 13%; */
                    /* height: 60%; */
                    /* text-align: center; */
                    width: 100%;
                }

                #plugin-mycoupon .panel .list .item .pic img {
                    width: 100%;
                    max-height: 100%;
                }

    #plugin-mycoupon .tool {
        position: absolute;
        bottom: 5%;
        left: 5%;
        width: 90%;
        text-align: center;
    }

        #plugin-mycoupon .tool .btn {
            width: 45%;
        }


#plugin-myprize {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: none;
    background-color: rgba(0,0,0,0.7);
}

    #plugin-myprize .panel {
        z-index: 1002;
        position: absolute;
        top: 10%;
        left: 5%;
        width: 90%;
        height: 80%;
        text-align: center;
    }

        #plugin-myprize .panel .list {
            position: absolute;
            top: 15%;
            left: 5%;
            width: 90%;
            height: 70%;
            overflow: auto;
        }

            #plugin-myprize .panel .list .item {
                width: 80%;
                height: 60%;
                position: relative;
                text-align: center;
                margin: 0 10%;
            }

                #plugin-myprize .panel .list .item .name {
                    font-size: 2rem;
                    color: #fff;
                    line-height: 20px;
                    position: absolute;
                    top: 15%;
                    /* text-align: center; */
                    width: 100%;
                }

                #plugin-myprize .panel .list .item .pic {
                    position: absolute;
                    top: 30%;
                    margin: 0px 15% 0 13%;
                    height: 60%;
                }

                    #plugin-myprize .panel .list .item .pic img {
                        width: 100%;
                        max-height: 100%;
                    }

        #plugin-myprize .panel .nothing {
            font-size: 1.8rem;
        }

    #plugin-myprize .tool {
        position: absolute;
        bottom: 5%;
        left: 5%;
        width: 90%;
        text-align: center;
    }

        #plugin-myprize .tool .btn {
            width: 45%;
        }
    
 .plugin-share {
    display: block;
    z-index: 9;
    position: absolute;

    top: 48%;
    right: 3%;
    max-width: 15%;
}
    .plugin-share .btn {
        width: 70%;
    }

#plugin-sidebar {
    z-index: 99;
    position: absolute;
    top: 10%;
    right: 0;
    width: 10%;
}

    #plugin-sidebar .btn {
        width: 100%;
    }

#plugin-loading {
    position: absolute;
    width: 100%;
    height: 100%;
    /*background: #eee;*/
    z-index: 999;
    overflow: hidden;
}

    #plugin-loading .panel {
        position: absolute;
        top: 20%;
        left: 0;
        text-align: center;
        width: 100%;
        margin: auto 0;
        height: 50%;
    }

    #plugin-loading .logo {
        display: none;
        max-width: 80%;
        -webkit-filter: grayscale(1);
        opacity: .2;
    }

    #plugin-loading .logodiv1 {
        background-color: #eee;
    }

    #plugin-loading .logodiv, #plugin-loading .logodiv1 {
        position: absolute;
        top: 0;
        height: 50%;
        overflow: hidden;
        text-align: center;
        width: 100%;
    }

    #plugin-loading .logo1 {
        display: none;
        max-width: 80%;
    }

    #plugin-loading .loading_text {
        width: 100%;
        font-size: 1.8rem;
        margin: 5% 0;
        position: initial;
    }

#plugin-ad {
    position: absolute;
    z-index: 999999;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
    display: none;
}

    #plugin-ad .plugin-adimg {
        width: 80%;
        position: absolute;
        top: 20%;
        left: 10%;
        border-radius: 1rem;
    }

/* 活動規則 */
.rule {
    z-index: 999;
    height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}

    .rule .btn {
        z-index: 999;
        position: absolute;
        top: 10%;
        right: 0;
        max-width: 10%;
        display: none;
    }

        .rule .btn img {
            width: 100%;
        }

    .rule .rulePanel {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        width: 100%;
        height: 100%;
        display: none;
        background-color: rgba(0,0,0,0.7);
    }

        .rule .rulePanel .ruleText {
            z-index: 999;
            position: absolute;
            top: 15%;
            left: 10%;
            width: 80%;
            height: 70%;
        }

        .rule .rulePanel img {
            width: 100%;
        }

            .rule .rulePanel img.ok {
                position: absolute;
                bottom: 5%;
                left: 30%;
                width: 40%;
            }

        .rule .rulePanel .text {
            margin: 20% 10%;
            height: 70%;
            overflow-y: auto;
            font-size: 1.6rem;
            text-align: left;
        }
/*活動規則*/

/* 排行榜 */
.ranking {
    z-index: 1002;
    font-size: 1.6rem;
    display: none;
    background: rgba(0, 0, 0, .7);
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: absolute;
}

    .ranking .panel, .ranking .rankingPrize {
        z-index: 1002;
        position: absolute;
        top: 8%;
        left: 5%;
        width: 90%;
        height: 84%;
    }

        .ranking .panel .rowth {
            width: 100%;
            position: initial;
            text-align: center;
        }

            .ranking .panel .rowth div {
                position: initial;
                font-size: 1.8rem;
                font-weight: bold;
            }

        .ranking .panel .row {
            position: initial;
            height: 3rem;
            line-height: 3rem;
            background-color: #fff;
            /* border-top: 1px solid #ccc; */
            border-radius: 3rem;
            margin-top: .5rem;
        }
            /*.ranking .panel .row:last-child
        {
            
            margin-bottom: .5rem;
        }*/

            .ranking .panel .row div {
                position: initial;
                overflow: hidden;
                white-space: nowrap;
            }

        .ranking .panel .paiming {
            width: 20%;
        }

        .ranking .panel .nicheng {
            width: 55%;
        }

        .ranking .panel .fenshu {
            width: 25%;
        }

        .ranking .panel .text {
            position: relative;
            margin: 20% 5% 0 5%;
            height: 70%;
            text-align: center;
            width: 90%;
        }


            .ranking .panel .text #wrapperRanking {
                /*overflow: auto;
                position: absolute;*/
                width: 100%;
                height: 84%;
                top: 0;
                bottom: 0;
            }

            .ranking .panel .text .rows {
                position: initial;
                /*position:absolute;*/
                width: 100%;
                /*height: 90%;*/
                /*overflow-y: auto;*/
                /*
                -webkit-overflow-scrolling: touch;*/
            }


            .ranking .panel .text table {
                width: 100%;
            }

                .ranking .panel .text table th {
                    white-space: nowrap;
                    font-size: 1.8rem;
                    line-height: 2.5rem;
                }

                .ranking .panel .text table td {
                    text-align: center;
                    line-height: 2.4rem;
                }

        .ranking .panel .myranking {
            position: absolute;
            top: 82%;
            left: 10%;
            width: 80%;
            font-size: 1.6rem;
            text-align: left;
        }

    .ranking .tool {
        position: absolute;
        bottom: 5%;
        left: 5%;
        width: 90%;
        text-align: center;
    }

        .ranking .tool .btn {
            width: 45%;
        }

    .ranking .panel img.choujiang {
        position: absolute;
        bottom: 15%;
        left: 20%;
        width: 60%;
    }

    .ranking .rankingPrize {
        display: none;
    }

        .ranking .rankingPrize .prizePanel {
            position: absolute;
            top: 13%;
            height: 73%;
            margin: 0 10%;
            overflow: auto;
            width: 80%;
        }

        .ranking .rankingPrize .title {
            font-size: 2rem;
            font-weight: bold;
            text-align: center;
        }

        .ranking .rankingPrize .offlinetime {
            text-align: left;
            border-bottom: 1px solid #4C4C4C;
            border-top: 0px solid #4C4C4C;
            padding: 2% 0;
            font-size: 1.4rem;
        }

            .ranking .rankingPrize .offlinetime .tip {
                font-size: 1.6rem;
            }

        .ranking .rankingPrize .remark {
            padding: 2% 0;
            font-size: 1.6rem;
            /*margin: 0% 5%;
             top: 35%;
            width: 90%; */
            text-align: left;
            /* height: 13%; */
            /* overflow: auto; */
        }

        .ranking .rankingPrize .prizeList {
        }

            .ranking .rankingPrize .prizeList .prizeTitle {
                width: 100%;
                text-align: center;
                border-bottom: 0px solid #4C4C4C;
                padding-bottom: 2%;
                font-size: 2rem;
                font-weight: bold;
            }

        .ranking .rankingPrize div {
            position: initial;
        }

        .ranking .rankingPrize .prizeList .prizeItem {
            margin: 2% 0;
            clear: both;
        }

        .ranking .rankingPrize .prizeList .prizeImg {
            float: left;
            width: 30%;
        }

            .ranking .rankingPrize .prizeList .prizeImg img {
                width: 100%;
                max-height: 20%;
            }

        .ranking .rankingPrize .prizeList .prizeName {
            display: none;
        }

        .ranking .rankingPrize .prizeList .prizeRemark {
            float: right;
            width: 68%;
        }

        .ranking .rankingPrize .rankprizeok {
            /*position: absolute;
            bottom: 5%;
            left: 30%;
            width: 40%;*/
        }
/* 排行榜 */
/* 中獎頁面

.drawPage
{
    z-index: 999;
    font-size: 16px;
    font-family: 微軟雅黑;
}

    .drawPage .panel
    {
        z-index: 999;
        position: absolute;
        top: 5%;
        left: 5%;
        width: 90%;
        height: 90%;
    }

        .drawPage .panel .text
        {
            margin: 30% 10%;
            height: 60%;
            overflow-y: auto;
            text-align: center;
        }

            .drawPage .panel .text table
            {
                width: 100%;
            }

                .drawPage .panel .text table td
                {
                    text-align: center;
                }

        .drawPage .panel .myranking
        {
            position: absolute;
            top: 80%;
            left: 10%;
            width: 80%;
            font-size: 1.3em;
        }

        .drawPage .panel img.ok
        {
            position: absolute;
            bottom: 5%;
            left: 20%;
            width: 60%;
        }

        .drawPage .panel img.choujiang
        {
            position: absolute;
            bottom: 15%;
            left: 20%;
            width: 60%;
        }
/* 中獎頁面 */

/* 中獎頁面 */
.sbg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
}

#plugin-prize {
    background: rgba(0, 0, 0, .7);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    display: none;
    overflow: hidden;
}

    #plugin-prize * {
        position: absolute;
    }

    #plugin-prize .prizeOkBox {
        display: none;
    }

        #plugin-prize .prizeOkBox .prizeOk {
            width: 80%;
            height: 80%;
            background: #fff;
            left: 10%;
            top: 10%;
        }

    #plugin-prize .prizeOk .prizeImg {
        width: 50%;
        position: absolute;
        left: 25%;
        top: 35%;
    }

    #plugin-prize .prizeOk .prizeDesc {
        width: 70%;
        height: 15%;
        position: absolute;
        right: 15%;
        top: 15%;
        font-size: 1.8rem;
        line-height: 150%;
        text-align: center;
        overflow: auto;
    }

    #plugin-prize .prizeOk .awardBtn {
        position: absolute;
        bottom: 5%;
        left: 54%;
        width: 38%;
    }

    #plugin-prize .prizeOk .closeBtn {
        position: absolute;
        bottom: 5%;
        left: 8%;
        width: 38%;
    }


    #plugin-prize .prizeNoBox {
        display: none;
    }

        #plugin-prize .prizeNoBox .prizeNo {
            width: 80%;
            height: 80%;
            background: #fff;
            left: 10%;
            top: 10%;
        }

            #plugin-prize .prizeNoBox .prizeNo .noPrizeText {
                width: 80%;
                position: absolute;
                left: 10%;
                top: 20%;
                font-size: 1.8rem;
                text-align: center;
            }

        #plugin-prize .prizeNoBox .noPrize {
            width: 60%;
            position: absolute;
            left: 20%;
            top: 40%;
        }

        #plugin-prize .prizeNoBox .closeNoPeizeBtn {
            width: 50%;
            position: absolute;
            bottom: 5%;
            left: 25%;
        }

    #plugin-prize .userInfoBox {
        display: none;
        font-size: 1.8rem;
    }

    #plugin-prize .userInfo {
        width: 80%;
        height: 80%;
        background: #fff;
        position: absolute;
        left: 10%;
        top: 10%;
    }

        #plugin-prize .userInfo table {
            width: 80%;
            position: absolute;
            left: 10%;
            top: 15%;
        }

            #plugin-prize .userInfo table * {
                position: relative;
            }

        #plugin-prize .userInfo tr {
            height: 40px;
        }

        #plugin-prize .userInfo input {
            height: 30px;
        }

        #plugin-prize .userInfo .submitRemark {
            width: 50%;
            position: absolute;
            bottom: 5%;
            left: 25%;
        }


/*自定義表單*/
.customTableDIV {
    background: rgba(0, 0, 0, .7);
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 1005;
    overflow: hidden;
}

    .customTableDIV .panel {
        width: 90%;
        height: 84%;
        text-align: center;
        position: absolute;
        left: 5%;
        top: 8%;
    }

        .customTableDIV .panel .win {
            position: relative;
            height: 100%;
            width: 100%;
        }

        .customTableDIV .panel .text {
            text-align: left;
            position: initial;
        }

    .customTableDIV .tableDiv {
        position: absolute;
        top: 15%;
        margin: 0 10%;
        width: 80%;
        font-size: 1.6rem;
        height: 70%;
        overflow: auto;
    }

        .customTableDIV .tableDiv .customtable {
            margin-top: 2%;
        }

        .customTableDIV .tableDiv #customtable {
            margin-top: 1rem;
        }

            .customTableDIV .tableDiv #customtable .row {
                margin: .5rem 0;
            }

                .customTableDIV .tableDiv #customtable .row .keytext {
                    white-space: nowrap;
                    line-height: 30px;
                    text-align: right;
                    width: 30%;
                    overflow: hidden;
                    font-size: 1.4rem;
                }

                .customTableDIV .tableDiv #customtable .row .control {
                    width: 70%;
                    text-align: left;
                }

    .customTableDIV #customtable tr {
        height: 40px;
    }

    .customTableDIV #customtable input {
        height: 28px;
        width: 80%;
        border: 1px solid #ccc;
        padding: 0 5%;
    }

    .customTableDIV .panel #submitCustomTable {
        position: absolute;
        bottom: 5%;
        left: 54%;
        width: 38%;
    }

    .customTableDIV .panel #closeBtn {
        position: absolute;
        bottom: 5%;
        left: 8%;
        width: 38%;
    }

/*分享提示*/
#plugin-share {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 2222;
    overflow: hidden;
}

    #plugin-share .panel {
        width: 100%;
        height: 100%;
    }

/*優惠券*/

#plugin-coupon {
    background: rgba(0, 0, 0, .7);
    display: none;
    z-index: 999;
    font-size: 1.8rem;
    overflow: hidden;
}

    #plugin-coupon .coupon {
        position: absolute;
        width: 80%;
        height: 80%;
        background: #fff;
        left: 10%;
        top: 10%;
    }

        #plugin-coupon .coupon .couponTip {
            position: absolute;
            width: 80%;
            height: 30%;
            left: 10%;
            top: 20%;
            text-align: center;
            font-size: 1.8rem;
            overflow: auto;
        }

        #plugin-coupon .coupon .couponName {
            position: absolute;
            width: 80%;
            height: 30%;
            left: 10%;
            top: 10%;
            text-align: center;
            font-size: 2rem;
            color: #fff;
            font-weight: bold;
        }

        #plugin-coupon .coupon .couponBg {
            position: absolute;
            /*padding: 10px 0;*/
            color: #fff;
            text-align: center;
            /*border-radius: 5px;
            font-weight: bold;*/
            width: 90%;
            height: 25%;
            top: 40%;
            left: 5%;
        }

        #plugin-coupon .coupon .couponnodiv {
            top: 50%;
            position: absolute;
            width: 100%;
            left: 0;
        }

        #plugin-coupon .coupon .couponBtn, #plugin-coupon .coupon .closeBtn {
            position: absolute;
            width: 50%;
            left: 25%;
            bottom: 5%;
        }

        #plugin-coupon .coupon .couponImg {
            position: absolute;
            width: 60%;
            left: 20%;
            top: 35%;
        }

/*分享角標*/
#plugin-share-corner {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 999;
    display: none;
}
