@charset "utf-8";
/* CSS Document */
body,h1,h2,h3,h4,h5,h6,hr,p,dl,dt,dd,ul,ol,li,pre,code,form,legend,b,button,input,textarea,blockquote{margin:0;padding:0;}
img,abbr,acronym{border:0;}
table td{word-break:break-all;}
caption,th{text-align:left;}
ol,ul{list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:700;}
input,button,textarea,select{font-size:inherit;*font-size:100%;font-family:inherit;}
address,cite,dfn,em,code,var,caption,th{font-style:normal;font-weight:normal;}
q:before,q:after{content:'';}
wbr:after{content:'\00200b';}
input::-webkit-input-placeholder { color:#747474 !important; font-weight:normal;}
/* Basic */
*{ word-wrap:break-word; outline:none; box-sizing:border-box;}
*::selection,*::-moz-selection{background:#669bb7; color:#fff;}

.cbh{ clear:both; height:0; overflow:hidden}
.fl{ float:left}
.fr{ float:right}
.clb{ clear:both}
:; display:none
.hidden{ overflow:hidden}
input::-webkit-input-placeholder {color:#FFF;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}
.icheckbox_square-blue,.iradio_square-blue { margin-bottom:2px !important;}
input[type="submit"],input[type="reset"],input[type="button"],button { -webkit-appearance: none;}
.red { color:#e60012;}
.blue { color:#268fd3;}
.organ { color:#ff9f40;}
.grey { color:#999;}
.white { color:#fff;}
.yellow { color:#fff000;}
.bg-w { background:#ffffff;}
.bg-g { background:#afafaf;}
.bold{font-weight: bold;}
.w100 { width:100% !important;}
.w80 { width:80%;}
.w70 { width:70%;}
.w50 { width:50%;}
.w33 { width:33.333333%;}
.w30 { width:30%;}
.w25 { width:25%;}
.w20 { width:20%;}
.inher{height:inherit}

.mt1m { margin-top:.1rem !important;}
.mb1m { margin-bottom:.1rem !important;}
.mt2rem { margin-top:.2rem;}
.mb2rem { margin-bottom:.2rem;}
.mt4rem { margin-top:.4rem;}

.pd10{ padding:.1rem;}
.pd15{ padding:.15rem;}
.pd20{ padding:.2rem;}

.po-r { position:relative;}
.po-a { position:absolute;}
.po-f { position:fixed;}

.img-middle { vertical-align:middle;}
.img-mv { height:1em; vertical-align:middle; margin-bottom:2px;}

.fz30{ font-size:.3rem;}
.fz32{ font-size:.32rem;}
.fz28{ font-size:.28rem;}
.fz26{ font-size:.26rem;}
.fz24{ font-size:.24rem;}
.fz22{ font-size:.22rem;}
.fz20{ font-size:.2rem;}
.fz18{ font-size:.18rem;}

.bg-w { background-color:#ffffff;}
.bor { border:1px solid #eeeeee;}
.bor-t { border-top:1px solid #cccccc;}
.bor-l { border-left:1px solid #cccccc;}
.bor-b { border-bottom:1px solid #cccccc;}
.bor-r { border-right:1px solid #cccccc;}
.bor-none { border:none;}
.bor-r50 { border-radius:50%;}

.color333 { color:#333333;}

.tx-c { text-align:center}
.tx-r { text-align:right;}
.underline { text-decoration:underline !important;}
.in-2em { text-indent:2em;}

.block { display:block;}
.inline-block{ display:inline-block;}
.none { display:none !important;}
.box-bor { box-sizing:border-box;}
.o-f { overflow:hidden;}
.ws-all { word-break:break-all; white-space:pre-wrap;}

.img-block { display:block; width:100%;}
.mc { margin:0 auto;}

.cl-fl:after { height:0; content:' '; display:block; visibility:hidden; clear:both;}

body{ font:.24rem/1.5 '微软雅黑'; font-size:.24rem; background-color:#62988a; color:#272423;}
.wrap { max-width:640px; margin:0 auto; position:relative;background-color: #fff2e1;}
.wrap a.block {}

.share-friend { height:100%; background:rgba(0,0,0,.8) url(../images/share.png) no-repeat 95% top; background-size:3.53rem 1.62rem; z-index:9999; top:0; left:0; display:none;}

.bgFFF{background-color: #fff;}

.modal{ width:100%; height:100%; position:fixed; left:0; top:0; z-index:99; text-align:left; display:none;}
.mod-bg{ width:100%; height:100%; position:absolute; background-color:rgba(0,0,0,0.8);}
.mod-area { width:5.4rem; margin:0 auto; position:relative; z-index:99; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); border-radius:.2rem;padding: 0rem .3rem .2rem; background:#fff0cd;}
.mod-hide.off { position:absolute; width:.6rem; height:.6rem; top:-.2rem; right:-.2rem; background:url(../images/off.png) no-repeat; background-size:100% 100%; z-index:100;}

.mod-con { overflow-y:auto; color:#333;min-height: .75rem; font-size:.3rem;}
.mod-msg { font-size:.24rem;}
.mod-header{ width: 4.58rem; font-size: .36rem; color:#000; margin:0 auto; position:relative; top:-.3rem;}
.mod-head-Tips{ width:3.62rem; height:.67rem; font-size: .38rem;text-align: center; display: block;margin: 0 auto; color:#721b00; background:url(../images/mod-tit.png) no-repeat; background-size:100% 100%;}
.mod-tit { width:100%; height:.5rem;}
.public-mod-tit { height:3.53rem; top:-2.91rem;}
.title-box{ display:inline-block; padding:.04rem .2rem; background:#ff9600; color:#000; border-radius:.08rem;}


.rule-msg b { color:#fff; display:inline-block; padding:.06rem .09rem; background:#f00; border-top-left-radius:.06rem; border-bottom-left-radius:.06rem; position:relative; line-height:1; margin:.5em 0;}
.rule-msg b:before { position:absolute; display:block; content:''; right:-.2rem; top:0; width:0; height:0; border-top:.18rem solid transparent; border-left:.2rem solid red; border-bottom:.18rem solid transparent;}
.mod-btn { display:block; margin:.2rem auto 0 auto; width:3.8rem; height:.9rem; line-height:.78rem; font-size:.3rem; color:#fff; text-align:center; background-size:100% 100%; background-repeat:no-repeat;}
.rule-btn{padding-top: .15rem;}
.mod-btn-red { background:url(../images/rule-btn.png) no-repeat; background-size:100% 100%; color: #fff;font-size: .3rem;}

.error { width:100%; height:100%; position:fixed; left:0; top:0; z-index:199; text-align:left; display:none;}
.err-area { width:80%; text-align:center; padding:.3rem; color:#fff; background:rgba(0,0,0,.8); font-size:.28rem; border-radius:.12rem; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}

/* index */
.index{ background:url(../images/index-bg.png) no-repeat; background-size:100% 100%;}
.banner{ width:90%; min-height:9%; left:50%; top:19%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.gameTimes{ left:0; top:30%; text-align:center; line-height:.4rem;}
.share-btn{ width:1rem; height:1.15rem; line-height:.28rem; padding:.1rem; left:1%; top:30%; background:url(../images/share-txt-bg.png) no-repeat; background-size:100% 100%; z-index:9;}
.colf9e4ba{ color:#f9e4ba;}
.fixed-btn{ width:1rem; height:.56rem; line-height:.28rem; right:0; top:30%; background:rgba(0,0,0,0.5) url(../images/rule-icon.png) no-repeat 3% center; background-size:.4rem .4rem; border-radius:.12rem 0 0 .12rem; padding-left:5%; z-index:9;}
.gift-btn{ top:36.5%; background-image:url(../images/gift-icon.png);}
.giftBtn{width: 3.2rem;height: .85rem;top:85%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); background:url(../images/rule-btn.png) no-repeat; background-size:100% 100%; color:#fff; font-size: .32rem; text-align: center; line-height: .7rem;}
.gs{ height:3.97rem; left:0; top:53%; background:url(../images/gs.png) no-repeat; background-size:100% 100%;}
.turntable-bg{ width:5.2rem; height:5.2rem; left:50%; top:35%; transform:translateX(-50%); -webkit-transform:translateX(-50%); background:url(../images/turntable-bg.png) no-repeat; background-size:100% 100%;}
.rotate{ width:4.3rem; height:4.3rem; left:50%; top:50%; margin-left:-2.15rem; margin-top:-2.15rem;background:url(../images/turntable.png) no-repeat; background-size:100% 100%;}
.sx{ width:1.62rem; height:2rem; padding-top:.15rem;/* border-left:.5rem solid transparent; border-right:.5rem solid transparent; border-top:2rem solid rgba(0,32,52,0.5);*/ /*background:rgba(0,0,0,0.5);*/}
.sx p{ line-height:.28rem; font-size:.22rem;}
.sx1{ left:1.35rem; top:0rem; transform:rotate(0deg);}
.sx2{ left:2.16rem; top:.35rem; transform:rotate(45deg);}
.sx3{ left:2.5rem; top:1.16rem; transform:rotate(90deg);}
.sx4{ left:2.16rem; top:1.99rem; transform:rotate(135deg);}
.sx5{ left:1.35rem; top:2.33rem; transform:rotate(180deg);}
.sx6{ left:.52rem; top:1.98rem; transform:rotate(225deg);}
.sx7{ left:.19rem; top:1.16rem; transform:rotate(270deg);}
.sx8{ left:.53rem; top:.35rem; transform:rotate(315deg);}
.sx1 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx2 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx3 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx4 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx5 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx6 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx7 img{ width:.67rem; height:.67rem; margin-top:.2rem;}
.sx8 img{ width:.67rem; height:.67rem; margin-top:.2rem;}

.rollBox{ width:80%; height:.68rem; border:0.02rem solid #fff; border-radius:.12rem; background:#c73029; overflow:hidden; left:50%; top:90%; transform:translateX(-50%); -webkit-transform:translateX(-50%); }
.rollBox p{ height:.68rem; line-height:.68rem;}
.pointer2{ width:1.8rem; height:1.84rem;top:1.67rem;left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.pointer{ width:1.54rem; height:1.54rem; border-radius:50%; top:1.86rem;left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); opacity:0;}

.cry{ width:2.36rem; height:2.76rem; position:absolute; top:-2rem; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.gameDieTc{ background:#fff2e1;}
.exchangeBtn a{ width:2.3rem; display:inline-block;}
.userPhone{ width:66%; height:.45rem; background-color:#fff2e1; border:1px solid #7d7d7d; text-indent:0.2em;}
.userBarcode{ width:35%; height:.45rem; background-color:#fff2e1; border:1px solid #7d7d7d; text-indent:0.2em; margin-left:-.04rem}
.getBarcode{ width:29.3%; line-height:.45rem; background:#d6e7ed; color:#308cad;}

.mod-footTxt{ top:75%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}


/*userMsg.html*/
.userMegWrap{ padding:1rem .5rem;}
.userMegWrap p{ padding-bottom:20%;}
.inpBox input{ height:.5rem; width:4rem; text-indent:.05rem;}
.submitBtnBox{ padding-bottom:20%; margin-top:30%;}
.submitBtn{width: 2.5rem;height: .85rem; background:url(../images/rule-btn.png) no-repeat; background-size:100% 100%; color:#fff; font-size: .32rem; text-align: center; line-height: .7rem;}
.msgBox p { padding-left:.4rem; background:url(../images/icon01.png) no-repeat left .15rem; background-size:.28rem .3rem;}
.msgBox p label{ width:27%; height:.6rem; font-size:.3rem; line-height:.6rem; display:inline-block;text-align:justify;text-justify:inter-ideograph;}
.msgBox .icon02{ background-image:url(../images/icon02.png);}
.msgBox .icon03{ background-image:url(../images/icon03.png);}
.msgBox p label span{ display:inline-block; width:100%;}
.msgBox p input{ width:70%; height:.6rem; margin-left:2%; text-indent:.3em; background:#fff; border:1px solid #611214;}
.msgBox p textarea{ width:70%; height:1rem; margin-left:2%; text-indent:.3em; background:#fff; border:1px solid #611214;}

/*gift*/
.gift-bg{ background:url(../images/gift_bg.png) no-repeat; background-size:100% 100%;}
.giftWrap{ width:85%; left:50%; top:38%; transform:translateX(-50%); -webkit-transform:translateX(-50%); border-radius:.12rem; background:#fff2e1;}
.get-rule{ top:66%;}
.user-msg{ top:47%;}
.gift-tit{ width:3.6rem; height:.66rem; left:50%; top:-.3rem; transform:translateX(-50%); -webkit-transform:translateX(-50%); line-height:.54rem; font-size:.36rem; background:url(../images/mod-tit.png) no-repeat; background-size:100% 100%;}
.gift-tit2{ width:4.7rem;}
.userNum{ border-bottom:0.01rem dashed #721b00;}
.tabBox{ height:1.8rem; overflow:auto;}
.get-rule-txt{ height:1.6rem;}
.get-rule-txt p{ line-height:.28rem;}
.gift-tab th{ line-height:.28rem;}
.gift-tab th a{ width:1.5rem; line-height:.56rem; font-size:.28rem; background:#fb634b; border-radius:.35rem;}
.gift-tab th a.greyBtn{ background:#bfbfbf;}

.gift-btn-box{ left:0; top:91%;}
.userMsg-btn-box{ top:87%;}
.gift-btn-box a{ width:3.6rem; height:.9rem; font-size:.36rem; line-height:.75rem; background:url(../images/rule-btn.png) no-repeat; background-size:100% 100%;}

.shareWrp{ width:90%; left:50%; top:4.5rem; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.share-qr{ width: 2.68rem; height: 2.68rem; top: 2.2rem; left: 50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}

.loadMask{position: fixed;width:100%;height:100%;top: 0px;left: 0px;}