html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    -webkit-tap-highlight-color: transparent;
}

/* 添加背景图 */
body {
    display: flex;
    flex-grow: 1;
    font-family: PingFang, Roboto, Helvetica, Arial, Microsoft JhengHei, 微轟正黑髛;
    margin: 0;
    box-sizing: border-box;

    /* 默认背景图（电脑端） */
    background-image: url('../img/diannao.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    /* 兼容旧浏览器 */
    background: url('../img/diannao.jpg') center/cover no-repeat;
}

/* 针对移动端设备的媒体查询 */
@media (max-width: 768px) {
    body {
        background-image: url('../img/beijingtu.jpg');
        background-size: cover; /* 改为 cover */
        background-position: center;
        background-repeat: no-repeat;
        background-color: #0B0F29;
        background: url('../img/beijingtu.jpg') center / cover no-repeat #0B0F29;
    }
}

.wrapper {
    margin: 0 auto;
    padding-bottom: 20px;
    width: 420px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.top {
    margin-top: 50px;
}

.top img {
    display: block;
    margin: 0 auto;
    width: 300px;
}

.loaderText {
    text-align: center;
}

.text {
    display: inline-block;
    text-align: center;
    margin-top: 20px;
}

.bottom {
    text-align: center;
    margin-bottom: 40px;
}

/* 按钮通用样式 */
.btn {
    width: 60%;
    padding: 5px;
    border-radius: 15px;
    outline: none;
    border: none;
    font-size: 18px;
    margin-bottom: 20px;
    cursor: pointer;
    /* 移除按钮文字样式 */
    color: transparent;
    /* 隐藏文字 */
    text-shadow: none;
    /* 移除文字阴影 */
    background-color: transparent; /* 设置为透明色 */
}

/* 默认情况下隐藏所有按钮 */
#desktop-btn, #mobile-btn {
    display: none;
}

/* 电脑端按钮样式（屏幕宽度大于 768px） */
@media (min-width: 769px) {
    #desktop-btn {
        display: inline-block; /* 或者 block，看你的布局 */
        background-color: transparent; /* 恢复电脑端按钮的背景色 */
    }
}

/* 手机端按钮样式（屏幕宽度小于等于 768px） */
@media (max-width: 768px) {
    #mobile-btn {
        display: inline-block; /* 或者 block，看你的布局 */
        background-color: transparent; /* 恢复手机端按钮的背景色， 或者设置为你想要的颜色 */
    }
}

/* button:disabled,
button[disabled]{
  background-color: #cccccc;
  color: #666666;
} */

.notice {
    text-align: center;
    font-size: 12px;
    font-weight: 300;
    color: #ccc;
}

.loader {
    display: inline-block;
    margin-left: 20px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: none;
    box-shadow: none;
    position: relative;
    animation: flash 0.5s ease-out infinite alternate;
}

@keyframes flash {
    0% {
        background-color: #000;
        box-shadow: none;
    }

    50% {
        background-color: #FFF;
        box-shadow: none;
    }

    100% {
        background-color: #000;
        box-shadow: 16px 0 #FFF, -16px 0 #000;
    }
}

@media screen and (min-width: 768px) {
    .wrapper {
        height: 890px;
        position: relative;
        transform: translateY(-50%);
        top: 50%;
    }
}

.downloadApp {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.downloadApp_main {
    background: url(../../static/img/bg.png) #000 50% no-repeat;
    background-size: contain;
    min-height: 100vh;
    overflow: auto;
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 1080px;
}

.downloadApp_container {
    width: 65%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: auto;
}

.downloadApp_tit {
    width: 452px;
    margin-top: 122px;
    margin-bottom: 28px;
}

.downloadApp_download {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.downloadApp_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 43px;
    background-color: #cc2330;
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    padding: 0 22px;
    margin-bottom: 15px;
    border-radius: 8px;
}

.downloadApp_name {
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    text-align: center;
}

.downloadApp_code {
    width: 100px;
    height: 100px;
    border-radius: 10px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 18px;
}

.downloadApp_web {
    margin-bottom: 20px;
    height: 44px;
    width: 330px;
    border-radius: 25px;
    background-color: #cc2330;
    text-decoration: none;
}

.buttonClass {
    background: #cc2330;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    font-size: 16px;
    border: 0;
}

.buttonClass:hover {
    background-color: rgba(204, 35, 38, .5) !important;
}

.buttonClass:disabled {
    background-color: rgba(204, 35, 38, .2) !important;
    color: #fff !important;
}

.downloadApp_phoneImg {
    width: 359px;
}

@media screen and (max-width: 1920px) {
    .downloadApp_main {
        background-size: cover;
    }
}