﻿/* 所有元素点击态背景去掉 */

* {
    -webkit-tap-highlight-color: transparent;
}

/* 弹窗固定背景 */

.actfixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%; /* 解决背景抖动 */
}

/* 主体 */

.main {
    width: 100%;
    height: 22.76rem;
    background: url(../images/bg.jpg) no-repeat;
    background-size: 100%;
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* 登录模块 */

.userbox {
    position: absolute;
    top: 0.75rem;
    left: 0.3rem;
    min-width: 1rem;
    height: 0.38rem;
    font: normal 0.26rem/0.4rem "";
    text-align: center;
}

.userbox span {
    display: inline-block;
    height: 0.38rem;
}

.userbox__uid {
    margin-right: 0.1rem;
    color: #678f83;
}

.userbox__btn {
    width: 0.96rem;
    height: 0.38rem;
    border: solid 1px #678f83;
    border-radius: 0.1rem;
    background-color: rgba(255, 255, 255, 0.4);
    color: #678f83;
    font: normal 0.26rem/0.38rem "";
}

/* 分享按钮 */
.floatbtn {
    position: fixed;
    right: 0.5rem;
    width: 0.65rem;
    height: 0.66rem;
    background: url() no-repeat;
    background-size: 100%;
    z-index: 10;
}

.floatbtn:active {
    animation: rubberBand 0.2s linear;
}

.btnshare {
    top: 1.6rem;
    background-image: url(../images/floatbtn_share.png);
}

.btncommunity {
    top: 2.6rem;
    background-image: url(../images/floatbtn_group.png);
}

/* 视频 */

.btnplay {
    display: none;
    position: absolute;
    top: 4.3rem;
    left: 50%;
    transform: translateX(-50%);
    width: 0.96rem;
    height: 0.96rem;
    background: url(../images/play.png) no-repeat;
    background-size: 100%;
}

/* 预约模块 */

.reservebox {
    position: absolute;
    top: 7.6rem;
    left: 0;
    width: 100%;
    /* border: solid 1px green; */
}

@keyframes rubberBand {
    from {
        transform: scale3d(1, 1, 1);
    }

    50% {
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        transform: scale3d(1, 1, 1);
    }
}

.reservebox__btn {
    display: inline-block;
    width: 3.2rem;
    height: 0.9rem;
    background: url(../images/btn_reserve__.png) no-repeat;
    background-size: 100%;
}

.reservebox__btn:active {
    animation: rubberBand 0.2s linear;
}

.reservebox__tip {
    margin-top: 0.2rem;
    display: inline-block;
    font: normal 0.24rem/1 "";
    color: #666;
    position: relative;
    top: -0.1rem;
}

.reservebox__switch {
    display: inline-block;
    width: 0.74rem;
    height: 0.36rem;
    background: url(../images/swich_off.png) no-repeat;
    background-size: 100%;
    vertical-align: middle;
    position: relative;
    top: -0.14rem;
    left: 0.1rem;
}

.reservebox__switch--on {
    background-image: url(../images/switch_on.png);
}

.reservebox__btn--reserve {
    background-image: url(../images/btn_reserve__.png);
}

.reservebox__btn--already {
    background-image: url(../images/btn_already.png);
}

.reservebox__btn--Android {
    background-image: url(../images/btn_download_Android.png);
}

.reservebox__btn--iOS {
    background-image: url(../images/btn_download_iOS.png);
}

.reservebox--download {
    top: 8rem;
}

.reservebox--download .reservebox__btn {
    margin: 0 0.2rem;
    width: 2.7rem;
    height: 0.86rem;
}

/* 邀请函模块 */

.invitebox {
    margin: 8.5rem auto 0;
    width: 7.41rem;
    height: 9.92rem;
    background: url(../images/rules-bg.png) no-repeat;
    background-size: 100%;
}

/* 广告模块 */

.adbox {
    margin: 0.3rem auto 0;
    width: 7.35rem;
    height: 9.71rem;
    background: url(../images/ades2.png) no-repeat;
    background-size: 100%;
}

/* 资讯模块 */

.newsbox {
    /* padding-top: 1.9rem; */
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 1.35rem;
    width: 7.5rem;
    height: 2.5rem;
    /* border: solid 1px green; */
    /* background: url(../images/newsbox_bg.png) no-repeat; */
    /* background-size: 100%;*/
}

.newsbox span {
    margin-left: 4.4rem;
    margin-bottom: 0.17rem;
    float: left;
    clear: left;
    width: 1.3rem;
    height: 0.55rem;
    /* border: solid 1px green; */
}

/* 微信遮罩 */
.wx_mask {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 199;
    background: rgba(0, 0, 0, 0.8) url(../images/wx_defaultbrowser.png) top
        center/100% no-repeat;
}

/* 弹窗 */
.popmask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99;
}

.popbody {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6.5rem;
    background: url() no-repeat;
    background-size: 100%;
    z-index: 100;
    text-align: center;
    overflow: hidden;
    position: relative;
}

.popbody--big {
    height: 6.86rem;
    background-image: url(../images/popbg_big.png);
}

.popbody--small {
    height: 5rem;
    background-image: url(../images/popbg_small.png);
}

.popbody__close {
    position: absolute;
    top: 0.4rem;
    right: 0.43rem;
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/close.png) no-repeat;
    background-size: 100%;
}

.popbody__title {
    margin: 0.4rem auto 0;
    width: 4.5rem;
    height: 1rem;
    /* border: solid 1px green; */
    font: normal 0.4rem/1rem "";
    color: #60918d;
    /* background: url() no-repeat;
    background-size: 100%; */
}

/* .popbody__title--reserve {
    background-image: url(../images/poptitle_reserve.png);
}

.popbody__title--already {
    background-image: url(../images/poptitle_already.png);
}

.popbody__title--share {
    background-image: url(../images/poptitle_share.png);
}

.popbody__title--alert {
    background-image: url(../images/poptitle_alert.png);
} */

.popbody__cont {
    color: #666;
    padding-top: 0.2rem;
}

.popbody__cont span {
    margin: 0 auto;
    display: inline-block;
    width: 80%;
    font: normal 0.28rem/1.5 "";
    text-align: center;
}

.popshare .popbody__cont span {
    /* margin-top: 0.5rem; */
}

.popbody__cont span i {
    color: #5d6ed7;
}

.popshare .popbody__cont span {
    text-align: center;
}

.popshare .popbody__cont span i {
    line-height: 2;
}

.popbody__btns {
    position: absolute;
    left: 0;
    bottom: 0.6rem;
    width: 100%;
    height: 0.68rem;
}

.popbody__btns__btn {
    display: inline-block;
    width: 2.4rem;
    height: 0.68rem;
    background: url(../images/pop_btn.png) no-repeat;
    background-size: 100%;
    color: #fff;
    font: normal 0.3rem/0.63rem "";
}

/* 视频弹窗 */

.popvideo__body {
    width: 7rem;
    height: 3.89rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
    background: #000;
}

.popvideo__close {
    position: absolute;
    top: -0.5rem;
    right: 0;
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/close.png) no-repeat;
    background-size: 100%;
}

.popvideo__video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
