*{ margin:0; padding:0; list-style: none; border:0 }
html,body{ width:100%; height:100%; }
a{ text-decoration:none; }


/*横屏*/
@media screen and (orientation: landscape) {
    .wrapper{ width:100%; height:100%; max-width: 1920px; margin: 0 auto; position: relative; min-height:800px; background-image:url(img/download/pc.jpg); background-position: top center; background-repeat: no-repeat;}

    .top_bar .language{ width: 80px; height: 20px; line-height: 20px; padding:12px 10px; border: 1px rgba(255, 255, 255, .4) solid; float: right; position: relative; margin: 22px; background: rgba(0,0,0,.2);}
    .top_bar .language a{ width: 40px; height: 20px; line-height: 20px; display: block; float: left; text-align: center; color: #fff}
    .top_bar .language a:first-child{ border-right: 1px #ddd solid; box-sizing: border-box; }
    .top_bar .language a.language_cur{ color: #e6d6a3 }
    .top_bar .language a:hover{ color: #e6d6a3 }

    .top_bar{ width: 100%; height: 90px; background-image: linear-gradient(to bottom,rgba(0, 0, 0, .6),rgba(0, 0, 0, .1)); border-bottom: 1px rgba(255, 240, 200, .4) solid; position:absolute; left:0; top: 0; z-index: 7; transition: .5s}
    .top_bar .top_logo{ display: block; float: left; margin: 7px 0 0 15px; width: 170px; height: 45px; }
    .top_bar .top_logo img{ width: 100%; }

    .top_bar .btn_back{ float:right; margin:22px 10px 0 0; width:140px; display:block; transition: .5s}
    .top_bar .btn_back img{ width:100%; display:block; }
    .top_bar .btn_back:hover{ transform:translateX(-3px); }

    .top_bar .btn_share{ display: block; line-height: 30px; float: right;margin:30px 35px 0 0; transition: .5s; color: #fff}
    .top_bar .btn_share span{ display:block; float:left }
    .top_bar .btn_share a{ width: 30px; display:block; float:left; transition: .5s}
    .top_bar .btn_share a img{ width: 100%; display:block;}
    .top_bar .btn_share a:hover{ transform:scale(1.1); }

    .wrapper .download_box{ width:462px; height: 156px; background-image: url(img/download/download_box.png); position: absolute; top: 670px; left:50%; transform: translateX(-50%); z-index:2 }
    .wrapper .download_box .qrcode{ width:130px; float:left; border-radius:5px; margin:14px 0 0 75px; }
    .wrapper .download_box .btn { float:left; width:204px; margin: 8px 0 0 12px}
    .wrapper .download_box .btn a{ width: 100%; display:block; margin:5px 0; transition: .5s}
    .wrapper .download_box .btn a img{ width:100%; display:block; }
    .wrapper .download_box .btn a:hover{ transform:translateY(-2px); }
}


/*竖屏*/
@media screen and (orientation: portrait) {
    .wrapper{ width:100%; height:100%; position: relative; min-height:35rem; background-image:url(img/download/m.jpg); background-color: #000; background-repeat: no-repeat; background-size: 100% auto;}

    .top_bar{ width: 100%; height: 3.2rem; background-image: linear-gradient(to bottom,rgba(0, 0, 0, .6),rgba(0, 0, 0, .1)); border-bottom: 1px rgba(255, 240, 200, .4) solid; position:absolute; left:0; top: 0; z-index: 7; transition: .5s}
    .top_bar .top_logo{ display: block; float: left; margin: .5rem 0 0 .6rem; width: 5rem; }
    .top_bar .top_logo img{ width: 100%; }

    .top_bar .btn_back{ float:right; margin:.8rem .3rem 0 0; width:5rem; display:block; transition: .5s}
    .top_bar .btn_back img{ width:100%; display:block; }
    .top_bar .btn_back:hover{ transform:translateX(-3px); }

    .top_bar .btn_share{ position: absolute; top: 3.8rem; right: 1rem; display: block; line-height: 1.2rem; font-size: .6rem; color: #fff}
    .top_bar .btn_share span{ display:block; float:left }
    .top_bar .btn_share a{ width: 1.2rem; display:block; float:left;}
    .top_bar .btn_share a img{ width: 100%; display:block;}

    .top_bar .language{ width: 3rem; height: .8rem; line-height: .8rem; padding:.5rem .2rem; border: 1px rgba(255, 255, 255, .4) solid; font-size: .6rem; float: right; position: relative; margin: .6rem; background: rgba(0,0,0,.2);}
    .top_bar .language a{ width: 1.5rem; height: .8rem; line-height: .8rem; display: block; float: left; text-align: center; color: #fff}
    .top_bar .language a:first-child{ border-right: 1px #ddd solid; box-sizing: border-box; }
    .top_bar .language a.language_cur{ color: #e6d6a3 }
    .top_bar .language a:hover{ color: #e6d6a3 }


    .wrapper .download_box{ position: absolute; top: 27.5rem; left:0; width: 100%; text-align: center; z-index:2 }
    .wrapper .download_box .qrcode{ display:none }
    .wrapper .download_box .btn a{ width: 8rem; display:inline-block; margin:0 .3rem;}
    .wrapper .download_box .btn a img{ width:100%; display:block; }



}