@charset "utf-8";
body{ margin:0; padding:0; font:normal 100% "Microsoft YaHei",\5b8b\4f53,Arial, Helvetica, sans-serif; -webkit-tap-highlight-color: rgba(0,0,0,0);}
div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,input,select,textarea,table,td{ margin:0; padding:0;}
area{outline:none;}
img{ border:0; object-fit: cover; }
input, textarea, select{ -webkit-appearance: none; outline: none; border-radius: 0;}
input::-ms-clear{display:none;}
ol,ul{list-style:none;}
a{ text-decoration:none; outline:none; cursor: pointer;}
.cf:after {content:"";display:block;height:0;clear:both;} 
.cf {zoom:1;}
.fl{ float: left; }
.fr{ float: right; }
.pub_clr{clear:both;font-size:0;height:0;line-height:0;overflow:hidden;}
.auto{left: 50%; -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); transform:translate(-50%,0);}
.box_justify{ display: -webkit-box; display: -moz-box; display: -o-box; display: -ms-box; -webkit-box-pack:justify; -moz-box-pack:justify; -o-box-pack:justify; -ms-box-pack:justify; box-pack:justify;}
/* 去除点击选项卡时出现的蓝色边框 */
/*.swiper-pagination .swiper-pagination-bullet:focus{ outline: none; }*/
/* 去除点击选项卡时出现的蓝色背景 */
/*.swiper-pagination-clickable .swiper-pagination-bullet{ cursor: auto; }*/
.swiper-pagination-bullet:focus,
.swiper-button-prev:focus,
.swiper-button-next:focus{ outline: none; }
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ opacity: 0; }
html, body{ width: 750px; margin: 0 auto; height: 100%;}
body{-webkit-text-size-adjust: 100%; }
.wrap{ position: relative; height: 1334px; min-height: 100%;}
.box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;}

/*loading*/
.loading{ background: #feefc6 url(../images/loading.jpg) no-repeat center top;}
.logo{ position: absolute; top: 0;}
.progressBarBox{ position: absolute; top: 1083px; width: 563px; height: 80px; background: url(../images/progressBarBox.png) no-repeat 0 0;}
.progressBar{ position: absolute; bottom: 3px; width: 557px; height: 34px; }
.progressCurr{ position: absolute; top: 0; left: 0; height: 100%; background: #57bbde; border-radius: 17px; -webkit-border-radius: 17px; -moz-border-radius: 17px; -ms-border-radius: 17px; -o-border-radius: 17px;}
.progressCurr p{ position: absolute; bottom: 0; left: 100%; height: 45px; margin-left: -30px; line-height: 55px; padding-left: 50px; background: url(../images/progressCurr.png) no-repeat left bottom; font-weight: bold; font-size: 25px; color: #73a5c6;}
.crab{ position: absolute; left: 0; top: 1203px; animation-duration: 2s;}

/* 过度动画 */
.overanimation{ background: #405564; }
.overanimation_layer{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/overanimation_layer.jpg) no-repeat center top;}
.overanimation_click{ position: absolute; top: 230px; right: 70px; animation-duration: 2s;}
.overanimation_cont{ height: 100%;}
#ht_miagif{ display: block; }
.toMain{ position: absolute; top: 1190px; width: 352px; height: 86px; margin-left: 10px; background: url(../images/toMain.png) no-repeat 0 0; display: none;}

/* 大厦 */
.mansion{ background: #6ca548 url(../images/mansion.jpg) no-repeat center top;}
.backIndex{ position: absolute; top: 12px; left: 23px; width: 143px; height: 164px; background: url(../images/backIndex.png) no-repeat 0 0;}
.toWebSite{ position: absolute; top: 58px; left: 19px; width: 163px; height: 56px; background: url(../images/toWebSite.png) no-repeat 0 0;}
.clockProgressBox{ position: absolute; top: 39px; width: 330px; height: 60px; background: url(../images/clockProgressBox.png) no-repeat 0 0;}
.clockProgressBar{ position: absolute; bottom: 3px; width: 324px; height: 21px; }
.clockProgressCurr{ position: absolute; top: 0; left: 0; height: 100%; background: #ffdf88; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.clockProgressCurr p{ position: absolute; bottom: -30px; left: 100%; height: 21px; line-height: 21px; padding-left: 10px; font-weight: bold; font-size: 17px; color: #51432e; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); -o-transform: translate(-50%,0); }
.ruleBtn{ position: absolute; top: 58px; right: 19px; width: 162px; height: 56px; background: url(../images/ruleBtn.png) no-repeat 0 0;}
.floor1{ position: absolute; top: 840px; left: 230px; width: 178px; height: 103px; background: url(../images/floor1.png) no-repeat 0 0;}
.floor2{ position: absolute; top: 590px; left: 203px; width: 151px; height: 108px; background: url(../images/floor2.png) no-repeat 0 0; animation-delay: 0.2s;}
.floor3{ position: absolute; top: 530px; left: 572px; width: 171px; height: 99px; background: url(../images/floor3.png) no-repeat 0 0; animation-delay: 0.4s;}
.toLottery{ position: absolute; top: 1135px; right: 26px; width: 250px; height: 163px; background: url(../images/toLottery.png) no-repeat 0 0;}

/* 1层 */
.floor1Box{ background: #367ebc url(../images/floor1Box.jpg) no-repeat center top;}
.floor1Btn1{ position: absolute; top: 340px; left: 57px; width: 253px; height: 254px; background: url(../images/floor1Btn1.png) no-repeat 0 0;}
.floor1Btn2{ position: absolute; top: 871px; left: 416px; width: 182px; height: 183px; background: url(../images/floor1Btn2.png) no-repeat 0 0;}

/* 2层 */
.floor2Box{ background: #367ebc url(../images/floor2Box.jpg) no-repeat center top;}
.floor2Btn1{ position: absolute; top: 412px; left: 7px; width: 255px; height: 254px; background: url(../images/floor2Btn1.png) no-repeat 0 0;}
.floor2Btn2{ position: absolute; top: 773px; left: 387px; width: 273px; height: 242px; background: url(../images/floor2Btn2.png) no-repeat 0 0;}

/* 3层 */
.floor3Box{ background: #367ebc url(../images/floor3Box.jpg) no-repeat center top;}
.floor3Btn1{ position: absolute; top: 371px; left: 26px; width: 221px; height: 220px; background: url(../images/floor3Btn1.png) no-repeat 0 0;}
.floor3Btn2{ position: absolute; top: 292px; left: 529px; width: 194px; height: 189px; background: url(../images/floor3Btn2.png) no-repeat 0 0;}

/* 列表页 */
.listBox{ background: #75bdf2 url(../images/listBox.jpg) no-repeat center top;}
.backPrev{ position: absolute; top: 58px; right: 19px; width: 163px; height: 56px; background: url(../images/backPrev.png) no-repeat 0 0;}
.listPicBox{ position: absolute; width: 701px; height: 390px; /*background: url(../images/listPicBox.png) no-repeat 0 0;*/ display: flex; justify-content: center; align-items: center;}
.listPicBox img{ width: 693px; height: 383px;}
.listPicBox1{ top: 195px;}
.keyTit{ position: absolute; top: 615px;}
.listPicBox2{ top: 669px;}
.listPic{ width: 693px; height: 383px;}
.listPic .swiper-button-prev, .listPic .swiper-button-next{ width: 61px; height: 50px;}
.listPic .swiper-button-prev{ background: url(../images/prev.png) no-repeat 0 0;}
.listPic .swiper-button-next{ background: url(../images/next.png) no-repeat 0 0;}
.listPic .swiper-button-prev::after, .listPic .swiper-button-next::after{ display: none;}
.clickPicTip{ position: absolute; top: 1069px;}
.clockInBtn{ position: absolute; top: 1166px; width: 362px; height: 86px; background: url(../images/clockInBtn.png) no-repeat 0 0;}

/* 详情页 */
.articleBox{ background: #75bdf2; }
.articleBg{ position: absolute; top: 0; left: 0; width: 100%;}
.articlePic{ position: absolute; top: 182px;}
.voiceBtn{ position: absolute; top: 1069px; right: 44px; width: 141px; height: 206px; background: url(../images/voiceBtn.png) no-repeat 0 0;}

/* 分享页 */
.shareBox{ background: #76bdf3; }
.shareBox img{ display: block;}

/* 开蚌抽奖 */
.lotteryBox{ background: #FFF url(../images/lotteryBox.jpg) no-repeat center top;}
.riverbed{ position: relative; height: 100%; overflow: hidden;}
.riverbed span{ position: absolute; bottom: 0; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; background: #FFF; }
.lotteryCont{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/lotteryPreview.png) no-repeat center 1px;}
.lotteryNum{ position: absolute; top: 140px; left: 270px; height: 30px; line-height: 30px; padding-left: 190px; background: url(../images/lotteryNum.png) no-repeat left center; font-weight: bold; font-size: 28px; color: #ffdf88; }
.myPrizeBtn{ position: absolute; top: 28px; right: 37px; width: 128px; height: 148px; background: url(../images/myPrizeBtn.png) no-repeat 0 0;}
#mussel{ position: absolute; top: 483px; left: 17px; width: 699px; height: 632px; background: url(../images/mussel.png) no-repeat 0 0;}
#mussel.on, #mussel.off{ background-position: 0 -1264px;}
.openMusselTip{ position: absolute; top: -42px; left: 388px;}
.pearl{ position: absolute; top: 259px; left: 263px; display: none;}
#mussel.on .openMusselTip, #mussel.off .openMusselTip{ display: none;}
#mussel.on .pearl{ display: block;}

/* 弹出框 */
.pop{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 5; display: none;}
.popCont{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); width: 702px; }
.popCont1{ height: 596px; background: url(../images/popCont1.png) no-repeat 0 0;}
.popCont2{ height: 496px; background: url(../images/popCont2.png) no-repeat 0 0;}
.popCont3{ height: 446px; background: url(../images/popCont3.png) no-repeat 0 0;}
.pop_tit1{ position: absolute; top: 36px; left: 50%; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); -o-transform: translate(-50%,0); }
.pop_tit2{ position: absolute;}

/* 弹出框：活动规则 */
.popRuleCont{ position: absolute; top: 110px; width: 610px; height: 360px; overflow-x: hidden; overflow-y: auto; line-height: 36px; font-size: 26px; color: #342f36;}
.popRuleCont p{ margin-bottom: 10px }
.popRuleCont a{ text-decoration: underline; color: #342f36;}
.popRuleCont table{ border-top: 1px solid #000; border-left: 1px solid #000; }
.popRuleCont td{ box-sizing: border-box; padding: 0 5px; border-bottom: 1px solid #000; border-right: 1px solid #000; text-align: center; }
.popRuleCont thead td{ white-space: nowrap; }
.close{ position: absolute; bottom: 45px; width: 180px; height: 57px; background: url(../images/close.png) no-repeat 0 0;}

/* 弹出框：我的奖品 */
.popMyPrizeCont{ position: absolute; top: 88px; width: 630px; height: 260px; overflow-x: hidden; overflow-y: auto;}
.popMyPrizeCont dl{ padding: 5px 0; border-bottom: 1px solid #000; display: flex; justify-content: space-between; align-items: center;}
.popMyPrizeCont dt{ width: 440px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 26px; color: #342f36;}
.popMyPrizeCont dt span{ margin-left: 15px;}
.popMyPrizeCont dd a{ display: inline-block; width: 146px; height: 47px;}
.fillInfoBtn{ background: url(../images/fillInfoBtn.png) no-repeat 0 0;}
.copyBtn{ background: url(../images/copyBtn.png) no-repeat 0 0;}

/* 弹出框：收货地址 */
.popAddressCont{ position: absolute; top: 88px; width: 630px;}
.popAddressCont dl{ display: flex; align-items: center; margin-bottom: 17px;}
.popAddressCont dt{ width: 200px; box-sizing: border-box; padding-right: 15px; text-align: right; font-size: 30px; color: #6e6e6e;}
.popAddressCont dd{ font-size: 20px; color: #717171;}
.popAddressCont dd input{ width: 350px; height: 60px; box-sizing: border-box; padding: 0 15px; border: 1px solid #000; background: none; font-size: 25px; color: #717171;}
.popConfirm{ position: absolute; bottom: 45px; width: 180px; height: 57px; background: url(../images/popConfirm.png) no-repeat 0 0;}
#pop_address .popConfirm{ left: 150px;}
#pop_address .close{ right: 150px;}

/* 弹出框：中奖（实物） */
.popPrizeHead1{ position: absolute; top: -50px; left: 10px;}
.pop_tit2{ position: absolute; top: 45px; left: 390px;}
.popPrizeName1{ position: absolute; top: 110px; left: 337px; width: 330px; text-align: center; line-height: 36px; font-size: 32px; color: #342f36;}
.popPrizeIcon{ position: absolute; top: 182px; left: 350px; width: 230px; height: 180px; display: flex; justify-content: center; align-items: center;}
.popPrizeTip{ position: absolute; top: 360px; left: 350px; font-size: 20px; color: #342f36;}
.popOkBtn{ position: absolute; bottom: 45px; width: 180px; height: 57px; background: url(../images/popOkBtn.png) no-repeat 0 0;}

/* 弹出框：中奖（虚拟礼包） */
.popPrizeHead2{ position: absolute; top: -130px; left: 10px;}
.popPrizeName2{ position: absolute; top: 110px; left: 280px; width: 420px; text-align: center; font-size: 30px; color: #342f36;}
.changeCode{ position: absolute; top: 160px; left: 290px; width: 400px; text-align: center; font-size: 26px; color: #d9880f; text-decoration: underline;}
.pop_prize2_tip{ position: absolute; top: 210px; left: 290px; width: 400px; text-align: center; font-size: 26px; color: #d9880f;}
.prize2List{ position: absolute; top: 270px; width: 90%; display: flex; justify-content: space-around;}
.prize2List div{ height: 80px; display: flex; justify-content: center; align-items: center;}
.prize2List p{ text-align: center; font-size: 20px; color: #342f36;}

/* 弹出框：未中奖 */
.popPrizeNullHead{ position: absolute; top: -47px;}