@charset "utf-8";
/* CSS Document */
html, body{
    height: 100%;
	overflow: auto;
}

body{position:relative;margin: 0 auto;font-size: 0.2rem;color:#fff;background: #fff;overflow-x:hidden; } 
[v-cloak]{display: none;opacity: 0;}
.bt {text-indent: -999px;overflow: hidden;cursor:pointer;}

.min_w{min-width:1000px;}
.wrap-box{width:1000px;margin: 0 auto;position: relative;}

/********************************主外框********************************/
.page_bg{width:1000px;height:7820px;background:url(../images/bg.jpg) no-repeat;margin:0 auto;}

.page00_bg {height:1700px;}
.page01_bg {height:1800px;}
.page02_bg {height:1600px;}
.page03_bg {height:1400px;}
.page04_bg {height:1300px;}


/********************************page00主視覺內容********************************/
.icon_box{width:100px;height:500px;top:20px; left: 10px;position: absolute;z-index: 1000;}
.icon_box ul {}
.icon_box li {width:90px;height:110px;background: url(../images/top_icon.png)no-repeat; display:block; }
.icon_box li a{width:90px;height:110px;display:block;}
.icon_box li.icon01{}
.icon_box li.icon02{background-position:-100px 0;  }
.icon_box li.icon03{background-position: -200px 0; }
.icon_box li.icon04{background-position: -305px 0;}

.page00_bg .top_logo{width:845px;height:508px;background: url(../images/top_logo.png)no-repeat;position:absolute;top:900px; left:70px;z-index:10; }

.page00_bg .download_box{position:absolute;top:1150px;z-index:10; }

.page00_bg .download_box .bt_google{width: 260px;height: 90px;position: absolute;top:260px;left: 220px; background: url(../images/bt_app.png) 0px 0px no-repeat;  }
.page00_bg .download_box .bt_appstore{width:260px;height: 90px;position: absolute;;top:260px;left: 500px ;background: url(../images/bt_app.png)-260px 0px  no-repeat; }
 


/********************************YOUYUBE影片框********************************/

#myVideo{width:100%;height: 1600px; position:absolute;overflow: hidden; }
#playerMovie{ width: 2000px; height:1920px; margin-left:-600px}
/********************************page01 *******************************/
.res_w{position:absolute;width:749px;height: 648px ;background: url(../images/res_w.png) top center no-repeat;margin: 280px 0 0 150px;}
.res_box01{position:absolute;width:749px;height: 370px ;margin: 0px 0 0 0px;}
.res_box02{position:absolute;width:749px;height: 200px ;  margin: 450px 0 0 0;}


.res_w .radio01{width: 25px;height: 25px;position:absolute;margin:20px 0 0 395px;}
.res_w .radio02{width: 25px;height: 25px;position:absolute;margin:20px 0 0 630px;}
.res_w .location{width: 100px;height:45px;position:absolute;margin:160px 0 0 190px;font-size:22px;letter-spacing: 2px;}
.res_w .phone_nb{width: 350px;height:43px;position:absolute;margin:160px 0 0 300px;font-size: 22px;letter-spacing: 2px;border: 2px solid #939699;padding-left: 10px}
.res_w .checkbox{width: 30px;height: 30px;position:absolute;margin: 220px 0 0 190px;}
.res_w .tips_word {width: 400px;height: auto;position: absolute;margin: 225px 0 0 230px;font-size: 20px;letter-spacing: 3px;color: #fff;opacity: .7;text-decoration:underline; }
.res_w .res_bt{width:280px;height: 87px;background: url(../images/res_bt.png) no-repeat;position: absolute;margin:270px 0 0 190px;}



.fb-login-button{width: 312px;height:67px;background: url(../images/res_fb.jpg) top center no-repeat;position: absolute;margin: 30px 0 0 420px;}
.fb-like-wrap{width: 312px;height:67px;position: absolute;margin: 30px 0 0 420px;text-indent: 0!important;}


.res_img{position:absolute;width:951px;height: 863px ;background: url(../images/res_img.png) top center no-repeat;margin: 900px 0 0 40px;}
.res_img ul{}
.res_img li{position:absolute;width:114px;height: 99px ;background: url(../images/res_clear.png) top no-repeat;}
.clear01{margin: 420px 0 0 85px;}
.clear02{margin: 420px 0 0 310px;}
.clear03{margin: 420px 0 0 510px;}
.clear04{margin: 420px 0 0 720px;}
.clear05{margin: 680px 0 0 130px;}
.clear06{margin: 680px 0 0 550px;}





/********************************page 02 invite *******************************/

.inv_bt{position:absolute;width:341px;height: 102px ;background: url(../images/inv_bt.png) top center no-repeat;margin: 1180px 0 0 350px;}
.inv_img{position:absolute; margin: 930px 0 0 10px;}


.inv_img_r {position:absolute;width:221px;height: 222px ;background: url(../images/inv_img_r.png) top no-repeat; z-index: 5}
.inv_img_r span{position: absolute;top: 119px;left: 96px; font-size: 16px;}
.inv_img_r.inv_r04{background-image: url(../images/inv_img_r_lottery.png)}

.inv_r01{ margin: 930px 0 0 10px;}
.inv_r02{  margin: 930px 0 0 255px;}
.inv_r03{ margin: 930px 0 0 500px;}
.inv_r04{  margin:930px  0 0 750px;}



/* page 03 lottery */
.lot_gift{position:absolute;margin: 90px 0 0 50px;}
.lot_bt{position:absolute;width:247px;height: 239px ;background: url(../images/lot_bt.png) top center no-repeat;margin: 470px 0 0 372px;z-index: 50}
.lot_number{display: block;position: absolute;font-size: 40px;letter-spacing: 1px;color:#FFD776;margin: 727px 0 0 520px;z-index: 50}
.lot_record{position:absolute;width:322px;height: 98px ;background: url(../images/lot_record.png) top center no-repeat;margin: 1060px 0 0 340px;z-index: 50}

/* page 04 note*/

.note_content{width:870px;height: 700px;position: absolute;display: block;  margin:30px 0 0 80px;padding: 10px;z-index: 500;color: #FFFFFF;}

.note_content ul {  list-style-type:decimal;}
.note_content li { font-size: 25px;line-height:45px;padding-left: 0px; letter-spacing: 1px; text-align: left;}


.entercanvas{position:absolute;left:0;top:0;width:1000px;height:1700px;}
.loading{width:100%;height:100%;opacity:1;position:fixed;top:0;left:0;z-index:999999;background:#1a100f;display: none;}
.loading .inner{position:absolute;top:50%;left:50%;text-align:center;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
.loading .loading_img{width:160px; height:160px; border-radius: 50%;margin: 0 auto;overflow: hidden;}
.loading .loading_img img{width:100%; -webkit-background-size:100%; background-size:100%;}
.loading .loading_rate{color:#fff;margin-top:10px;font-size:16px;}
.loading .loading_rate span{
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 5px;
    border-radius: 50%;
    background: #fff;
    -webkit-animation: load 1.04s ease infinite;
}
@-webkit-keyframes load{
    0%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}
.loading span:nth-child(1){
    -webkit-animation-delay:0.13s;
}
.loading span:nth-child(2){
    -webkit-animation-delay:0.26s;
}
.loading span:nth-child(3){
    -webkit-animation-delay:0.39s;
}
.loading span:nth-child(4){
    -webkit-animation-delay:0.52s;
}
.loading span:nth-child(5){
    -webkit-animation-delay:0.65s;
}