html,body,.wrapper{ height: 100%; font-family: 'fangzheng'; background-color: #a73627; }
@font-face {
    font-family: 'fangzheng';     
    src: url("//png.pookcdn.net/new_net/bydrqp/v3/fangzheng.TTF") format('truetype');
    font-weight: normal;
    font-style: normal;
}

.header{ width: 100%; height:  14.4rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/bg_header.jpg); background-size: cover; overflow: hidden; background-position: top center;}


.btn-list{ bottom: .5rem; left: 50%; width: 12.1rem; -webkit-justify-content: center; justify-content: center; z-index: 2; -webkit-transform: translateX(-50%);  transform: translateX(-50%); }
.btn-list [class*="btn-"]{ width: 6.01rem; height: 1.91rem;}
.btn-download{ background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/btn_download.png); }
#downBtn{ display: none; }

.guide-arrow{ left: 50%; bottom: 1.6rem; -webkit-transform:translateX(-50%); transform:translateX(-50%); z-index: 999; z-index: 2; }
.guide-arrow .ico-arrow{ display: block; margin-top: -.3rem; width: .91rem; height: .55rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/ico_arrow_guide.png); -webkit-animation: opacity 1s linear infinite; animation: opacity 1s linear infinite }
.guide-arrow .ico-arrow:last-of-type{ -webkit-animation-delay: .5s; animation-delay: .5s;}
@-webkit-keyframes opacity {
    0%{ opacity: 1;}
    50%{ opacity: .5;}
    100%{ opacity: 1;}
}
@keyframes opacity {
    0%{ opacity: 1;}
    50%{ opacity: .5;}
    100%{ opacity: 1;} 
}


.main{ height: 25.75rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/bg_main.jpg); overflow: hidden; }

.item-title{  margin: 0 auto; width: 12.95rem; height: 1rem; }
/* .item-title::before{ content: ""; position: absolute; top: -.5rem; left: -.2rem; width: 5.26rem; height: 6.05rem; background: url(//png.pookcdn.net/new_net/bydrqp/v3/title_after.png) no-repeat; background-size: 100% 100%; } */
.item-title img{ position: relative; width: 100%; z-index: 2; }


.swiper-container{ position: relative; top: 0; left: 0; overflow: hidden; width: 100%; height: 100%;}
.content-slide{ height: 100%;  opacity: 0; -webkit-transition: 0.8s cubic-bezier(0.76, 0, 0.24, 1); transition: 0.8s cubic-bezier(0.76, 0, 0.24, 1);}
.swiper-slide-active{ z-index: 2; -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); opacity: 1;}


.feature{ margin-top: 2rem; }
.swiper-content{position:relative; margin:.4rem auto 0px;  width:11.2rem; height:6.37rem;  background: transparent; }
.swiper-content .swiper-slide,
.video-content{ padding: .1rem .1rem; width:11.2rem; height:6.37rem; background: url("//png.pookcdn.net/new_net/bydrqp/v3/bg_swiper.png") no-repeat; background-size: 100% 100%; border-radius: .1rem; overflow: hidden;  box-sizing: border-box; overflow: hidden;}

.swiper-content .swiper-slide img,
.video-content video{ width: 100%; height: 100%; object-fit: fill; }
.swiper-content .swiper-slide p{line-height:.98rem;padding-top:0;text-align:center;color:#636363;font-size:1.1em;margin:0}
.swiper-content .feature-button-prev,
.swiper-content .feature-button-next{ top: 50%; left:-1.3rem; width:1.13rem;height:1.2rem; background-image:url("//png.pookcdn.net/new_net/bydrqp/v3/btn_prev.png"); cursor: pointer; z-index: 3;  -webkit-transform: translateY(-50%);  transform: translateY(-50%);}
.swiper-content .feature-button-next{ left: inherit; right: -1.3rem; background-image: url("//png.pookcdn.net/new_net/bydrqp/v3/btn_next.png"); }
.feature-pagination{ bottom: -.3rem!important;;}
.swiper-pagination-bullet{width: .15rem;height: .05rem;border: .02rem #fff solid;-webkit-border-radius: 0;border-radius: 0;margin: 0 .05rem;}
.swiper-pagination-bullet-active{ width: .55rem; background: #fff8a0; border-color: #fff8a0;}

.video{ margin-top: 2rem; }
.video-content{ margin: .5rem auto;  }
.video-content .play{ top: 50%; left: 50%; width: 2.03rem; height: 1.99rem; background-image: url("//png.pookcdn.net/new_net/bydrqp/v3/btn_play.png"); -webkit-transform: translate(-50%,-50%);  transform: translate(-50%,-50%); }

.videobox {background-color: rgba(0, 0, 0, .7);display: none;height: 100%;left: 0;position: fixed;top: 0;width: 100%;z-index: -1 }
.videobox.on {display: block;z-index: 999 }
.videobox .video-content {  width: 10rem; height: 5rem;left: 50%;position: absolute;top: 50%;-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.videobox .video-content .video {display: block;height: 100%;position: relative;width: 100%; object-fit: cover; }
.videobox .video-content .video.hide {display: none }
.videobox .video-content #gif {display: none;height: auto;margin-top: 1rem;width: 100% }
.videobox .video-content #gif.show {display: block }
.videobox .video-content .close { position: absolute; cursor: pointer; background: url(//png.pookcdn.net/new_net/bydrqp/v3/close.png) no-repeat;background-size: 100% 100%; top:0; right: -.8rem; height: .64rem;width: .64rem }


.footer{ margin-top: 2.6rem; padding: .5rem 0; background: rgba(132, 18, 18, .5); font-size: .3rem; color: #e28e82; } 
.footer a{ color: #e28e82;}
.footer div{ display: flex; display: -webkit-flex; gap:0 .1rem; -webkit-justify-content: center; justify-content: center; -webkit-flex-wrap: wrap;  flex-wrap: wrap; } 

.float-code{ background: #A23918; }
.float-code .code-title{ border-bottom: none; }
.float-code .code-arrow img{ width: .18rem; height: .29rem; }


.pup-tips{
    width: 8.02rem;
    height: 5.72rem;
    font-family:microsoft yahei;
    font-weight:700;
    background-image:url(//png.pookcdn.net/new_net/bydrqp/v2/tanchuang.png)
}
.pup-tips .btn-close{
    background-image:url(//png.pookcdn.net/new_net/bydrqp/v2/icon_x_2.png);
    width: .45rem;
    height: .45rem;
    top: .25rem;
    right: .2rem;
}
.pup-tips .pup-title{
    font-size:.44rem;
    color:#fcfdff;
    text-align:center;
    line-height: 1rem;
}
.pup-tips .pup-content{
    margin:.6rem auto 0;
    width:90%;
    color:#262755;
    font-size:.26rem;
}
.pup-tips .pup-content ul{
    margin:.15rem 0;
    font-size:.22rem;
    color:#392584;
    line-height:1.8
}
.pup-tips .btn-pup-download{
    margin: .4rem auto;
    width: 3.48rem;
    height: 1.08rem;
    background-image: url(//png.pookcdn.net/new_net/bydrqp/down-gold.png);
}

.pup-downloading {
    padding: .3rem .2rem;
    width: 4rem;
    background: #fff;
    font-size: .22rem;
    text-align: center;
    border-radius: .15rem;
}

.pup-downloading .title {
    font-weight: bold;
}

.progress-bar {
    margin: .2rem 0;
    height: .3rem;
    background: #E0E0E0;
    border-radius: .05rem;
}

.progress-bar .bar {
    height: 100%;
    background: #62A458;
    border-radius: .05rem;
}

.progress-bar .text {
    margin-top: .05rem;
    width: 100%;
    font-size: .18rem;
    text-align: center;
}

.btn-cancel {
    margin: .5rem auto 0;
    padding: .1rem .25rem;
    background: #E96E4A;
    font-size: .2rem;
    color: #fff;
    border-radius: .05rem;
}

.pup-common-tips {
    width: 53%;
    position: fixed;
    padding: .5rem 1rem;
    height: auto;
    text-align: center;
    color: #fff;
    font-size: .22rem;
    background: rgba(0, 0, 0, 0.8); 
}

.pup-common-tips .btn-close {
    position: absolute;
    top: .2rem;
    right: .2rem;
    width: .22rem;
    height: .23rem;
    cursor: pointer;
    background: url("//png.pookcdn.net/new_net/bydrqp/promotion/btn_close.png") no-repeat;
    background-size: 100% 100%;
}
@media (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) { 
    .top{ display: none; }
    .float-code{ display: none; }
    .float-top{ z-index: 99; display: flex; padding: 0 .2rem; left: 50%; width: 7.5rem; background: linear-gradient(rgba(132,18,18) 0%,rgba(132,18,18,.5) 100%); box-sizing: border-box; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
    .float-top .btn-download-top{ margin-top: .1rem; width: 2.27rem; height: .93rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download_top.png); }
    .float-top .logo {
        margin-right: .15rem;
    }
    .float-top .desc {
        display: block;
        font-size: .24rem;
    }
    .wrapper{ margin: 0 auto; width: 7.5rem; height: 28.6rem; background-image: url("//png.pookcdn.net/new_net/bydrqp/v3/mobile/bg.jpg"); }
    .guide-arrow{ display: none!important; }
    .ico-play{ top: 65%; }
    .btn-list{ bottom: .3rem; width: 100%; }
    .btn-list .btn-download{ display: block; margin: 0 auto; width: 4.79rem; height: 1.47rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download.png); }
    #downPcBtn{ display: none; }
    #downBtn{ display: block; }
    .header,
    .main{ height: auto; background: none; }
    .header{ height: 11rem; }
    .feature{ margin-top: 1rem;  margin-bottom: 1rem; width:100%; }
    .item-title{ width: 6.88rem; height: .53rem; }
    .swiper-content,
    .swiper-content  .swiper-slide,
    .video-content{ width:5.97rem; height: 3.39rem; }
    .video-content .play{ width: 1.08rem; height: 1.06rem; }
    .swiper-content .feature-button-prev,
    .swiper-content .feature-button-next{ width: .59rem; height: .64rem; }
    .swiper-content .feature-button-prev { left: -.7rem;  }
    .swiper-content .feature-button-next { right: -.7rem; }
    .videobox .video-content { width: 100%; }
    .video{ margin-top: 1rem; }
    .bot-code{ display: block; margin-top:.8rem;color: #fff; font-size: .28rem; }
    .bot-code .code-img,
    .bot-code .code-img img{ margin: 0 auto; width: 2.4rem;}
    .bot-code .code-title-pc,
    .bot-code .code-arrow{ display: none; }
    .bot-code .item-title{ margin-bottom:.5rem; width: 4.66rem; height: .53rem; }
    .footer{ margin-top: .6rem; font-size: .16rem; }
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){
    .top{ display: none; }
    .float-code{ display: none; }
    .float-top{ z-index: 99; display: flex; padding: 0 .2rem; left: 50%; width: 7.5rem; background: linear-gradient(rgba(132,18,18) 0%,rgba(132,18,18,.5) 100%); box-sizing: border-box; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
    .float-top .btn-download-top{ margin-top: .1rem; width: 2.27rem; height: .93rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download_top.png); }
    .float-top .logo {
        margin-right: .15rem;
    }
    .float-top .desc {
        display: block;
        font-size: .24rem;
    }
    .wrapper{ margin: 0 auto; width: 7.5rem; height: 28.6rem; background-image: url("//png.pookcdn.net/new_net/bydrqp/v3/mobile/bg.jpg"); }
    .guide-arrow{ display: none!important; }
    .ico-play{ top: 65%; }
    .btn-list{ bottom: .3rem; width: 100%; }
    .btn-list .btn-download{ display: block; margin: 0 auto; width: 4.79rem; height: 1.47rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download.png); }
    #downPcBtn{ display: none; }
    #downBtn{ display: block; }
    .header,
    .main{ height: auto; background: none; }
    .header{ height: 11rem; }
    .feature{ margin-top: 1rem;  margin-bottom: 1rem; width:100%; }
    .item-title{ width: 6.88rem; height: .53rem; }
    .swiper-content,
    .swiper-content  .swiper-slide,
    .video-content{ width:5.97rem; height: 3.39rem; }
    .video-content .play{ width: 1.08rem; height: 1.06rem; }
    .swiper-content .feature-button-prev,
    .swiper-content .feature-button-next{ width: .59rem; height: .64rem; }
    .swiper-content .feature-button-prev { left: -.7rem;  }
    .swiper-content .feature-button-next { right: -.7rem; }
    .videobox .video-content { width: 100%; }
    .video{ margin-top: 1rem; }
    .bot-code{ display: block; margin-top:.8rem;color: #fff; font-size: .28rem; }
    .bot-code .code-img,
    .bot-code .code-img img{ margin: 0 auto; width: 2.4rem;}
    .bot-code .code-title-pc,
    .bot-code .code-arrow{ display: none; }
    .bot-code .item-title{ margin-bottom:.5rem; width: 4.66rem; height: .53rem; }
    .footer{ margin-top: .6rem; font-size: .16rem; }
}
@media only screen and (max-width:780px){

    .float-top{ background: linear-gradient(rgba(132,18,18) 0%,rgba(132,18,18,.5) 100%); }
    .float-top .btn-download-top{ margin-top: .1rem; width: 2.27rem; height: .93rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download_top.png); }
    .wrapper{ margin: 0 auto; width: 7.5rem; height: 28.6rem; background-image: url("//png.pookcdn.net/new_net/bydrqp/v3/mobile/bg.jpg"); }
    .guide-arrow{ display: none!important; }
    .ico-play{ top: 65%; }
    .btn-list{ bottom: .3rem; width: 100%; }
    .btn-list .btn-download{ display: block; margin: 0 auto; width: 4.79rem; height: 1.47rem; background-image: url(//png.pookcdn.net/new_net/bydrqp/v3/mobile/btn_download.png); }
    #downPcBtn{ display: none; }
    #downBtn{ display: block; }
    .header,
    .main{ height: auto; background: none; }
    .header{ height: 11rem; }
    .feature{ margin-top: 1rem;  margin-bottom: 1rem; width:100%; }
    .item-title{ width: 6.88rem; height: .53rem; }
    .swiper-content,
    .swiper-content  .swiper-slide,
    .video-content{ width:5.97rem; height: 3.39rem; }
    .video-content .play{ width: 1.08rem; height: 1.06rem; }
    .swiper-content .feature-button-prev,
    .swiper-content .feature-button-next{ width: .59rem; height: .64rem; }
    .swiper-content .feature-button-prev { left: -.7rem;  }
    .swiper-content .feature-button-next { right: -.7rem; }
    .videobox .video-content { width: 100%; }
    .video{ margin-top: 1rem; }
    .bot-code{ margin-top:.8rem; }
    .bot-code .item-title{ margin-bottom:.5rem; width: 4.66rem; height: .53rem; }
    .footer{ margin-top: .6rem; font-size: .16rem; }
}
