html,body{margin: 0;padding: 0;}
a{color:#337ab7;text-decoration:none}
a:hover,a:focus{text-decoration:none}
a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}
button:focus,input:focus,textarea:focus {outline: none;}
.btn {border-radius: 0.5rem; background-color: #ffe335; border: none; padding: 0.3rem 1rem; color: #d31427; display: inline-block;}
.r_content_box{background-image: linear-gradient(160deg, #b100ff 20%,#00b3ff 80%);width: 100%;height: 100%;padding-bottom: 50px;}
/* 幸运转盘*/
.lucky_img{width:100%;text-align: center;}
img{max-width: 100%;}
.lottery_box{width:100%; height: auto;position: relative; margin:0 auto;z-index: 1;padding: 10px 0 16px;}
#lottery{width:85%;margin: 0 auto;padding: 10px;}
.lottery-change-0{background:#A4CE6A;border: 3px solid #A4CE6A;-webkit-box-shadow:1px 2px 1px #A4CE6A;-moz-box-shadow:1px 2px 1px #A4CE6A;box-shadow:1px 2px 1px #A4CE6A;}
.lottery-change-1{background:#62B971;border: 3px solid #62B971;-webkit-box-shadow:1px 2px 1px #62B971;-moz-box-shadow:1px 2px 1px #62B971;box-shadow:1px 2px 1px #62B971;}
.lottery-change-2{background:#A46BA9;border: 3px solid #A46BA9;-webkit-box-shadow:1px 2px 1px #A46BA9;-moz-box-shadow:1px 2px 1px #A46BA9;box-shadow:1px 2px 1px #A46BA9;}
.lottery-change-3{background:#E3CE6D;border: 3px solid #E3CE6D;-webkit-box-shadow:1px 2px 1px #E3CE6D;-moz-box-shadow:1px 2px 1px #E3CE6D;box-shadow:1px 2px 1px #E3CE6D;}
.lottery-change-4{background:#F08E4D;border: 3px solid #F08E4D;-webkit-box-shadow:1px 2px 1px #F08E4D;-moz-box-shadow:1px 2px 1px #F08E4D;box-shadow:1px 2px 1px #F08E4D;}
.lottery-change-5{background:#6872B4;border: 3px solid #6872B4;-webkit-box-shadow:1px 2px 1px #6872B4;-moz-box-shadow:1px 2px 1px #6872B4;box-shadow:1px 2px 1px #6872B4;}
.lottery-change-6{background:#7EC27F;border: 3px solid #7EC27F;-webkit-box-shadow:1px 2px 1px #7EC27F;-moz-box-shadow:1px 2px 1px #7EC27F;box-shadow:1px 2px 1px #7EC27F;}
.lottery-change-7{background:#61C3E0;border: 3px solid #61C3E0;-webkit-box-shadow:1px 2px 1px #61C3E0;-moz-box-shadow:1px 2px 1px #61C3E0;box-shadow:1px 2px 1px #61C3E0;}
.lottery-change{-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;text-align: center;width: 33%}
#lottery table td.active{border: 3px solid #E5502D;-webkit-box-shadow:1px 2px 1px #E5502D;-moz-box-shadow:1px 2px 1px #E5502D;box-shadow:1px 2px 1px #E5502D;border-color: #E5502D;-webkit-box-shadow: 0 0 18px #E5502D;}
#lottery table{width: 100%;}
#lottery table td{text-align: center;}
.border_radius{-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}
.others_box_tip{width: 100%;text-align: center;font-family:"微软雅黑";font-size: 1.0rem;color: #0f3f41;}
.other_box{width: 85%;margin-bottom:20px;padding: 15px 0 10px 0;background: linear-gradient(45deg,rgba(254,172,94,0.5),rgba(199,121,208,0.5),rgba(75,192,200,0.5));margin: 0 auto;}
.mltext_box{width: 95%;font-size: 0.8rem; font-family:"微软雅黑";overflow: hidden;color: #0f3f41;line-height: 25px;text-align: JUSTIFY;}
.mltext_box ul{ margin: 0; padding: 0;}
.ml-slide-list{ position: relative; z-index: 1;}
.layui-m-layercont p{text-align: left;font-size: 1.0rem;}
.tel{color: #333;border: 1px solid #eee;width: 250px;height: 35px;line-height: 35px;border-radius: 5px;padding-left: 10px;font-size: 1.0rem;}
.layui-m-layercont p.tip{color: red;font-size: 0.8rem;line-height: 10px;}
.colorred{color: red;}
.clear{clear: both;}
/* 圆转盘样式 */
.banner{display:block;width:79%;margin-left:auto;margin-right:auto;margin-bottom: 20px;}
.banner .turnplate{display:block;width:100%;position:relative;}
.banner .turnplate canvas.item{width:100%;}
.banner .turnplate img.pointer{position:absolute;width:31.5%;height:42.5%;left:34.1%;top:23%;}
#sbtn{ position: absolute;top: 85%;text-align: center;width: 100%; }
#sbtn img{ width: 24%;margin: 0 20px; }
.content{position: absolute;width: 100%;margin: 10px auto;}
/*砸金蛋*/
.stage {position: relative; width:100%; overflow: hidden;}
img.stage-img{display: block; width:100%}
.lanren {width: 9rem;height: 9rem;position: absolute;bottom: 16%;left: 0; right: 0;margin: auto;border-radius: 50%;animation: a 1000s linear;-webkit-animation: a 1000s linear;}
.agg {
width: 5rem;
height: 7rem;
transform-origin: center;
-webkit-transform-origin: center;
background: url("http://r.vnetone.com/ghpt/images/agg.png") no-repeat center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
border-radius: 100%;
}
.agg:nth-child(1){
margin-top: 45%;
animation: b 1000s linear,zindex 10000ms 0ms infinite linear;
-webkit-animation: b 1000s linear,zindex 10000ms 0ms infinite linear;
}
.agg:nth-child(2){
margin-top: -5%;
margin-left: -5%;
animation: b 1000s linear,zindex 10000ms -2500ms infinite linear;
-webkit-animation: b 1000s linear,zindex 10000ms -2500ms infinite linear;
}
.agg:nth-child(3){
margin-top: -5%;
margin-right: -5%;
animation: b 1000s linear,zindex 10000ms -5500ms infinite linear;
-webkit-animation: b 1000s linear,zindex 10000ms -5500ms infinite linear;
}
.lanren.paused,.paused .agg {-webkit-animation-play-state:paused; animation-play-state:paused;}
@keyframes a{
0% {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to{
transform: rotate(36000deg);
-webkit-transform: rotate(36000deg);
}
}
@-webkit-keyframes a{
0% {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to{
transform: rotate(36000deg);
-webkit-transform: rotate(36000deg);
}
}
@keyframes b{
0% {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to{
transform: rotate(-36000deg);
-webkit-transform: rotate(-36000deg);
}
}
@-webkit-keyframes b{
0% {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to{
transform: rotate(-36000deg);
-webkit-transform: rotate(-36000deg);
}
}
@keyframes zindex {
0% {
z-index: 1;
}
25% {
z-index: -1;
}
55% {
z-index: -1;
}
75% {
z-index: 1;
}
}
@-webkit-keyframes zindex {
0% {
z-index: 1;
}
25% {
z-index: -1;
}
55% {
z-index: -1;
}
75% {
z-index: 1;
}
}
.footer{ width:90%; margin:0px auto 1rem auto}
.footer a{ display:block; width:34%; height:2rem; line-height:2rem; background-color:#ffd318; color:#db4151; text-align:center; border-radius:1rem; margin-bottom:1rem;margin: 30px auto;}
.jn-box,.jn-box2{ width:100%;position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.85); z-index:100; display:none}
.jn-main{width: 80%; height:260px; border-radius: 0.5rem; background-color:#d31427; position: absolute; left:50%; top:50%; margin:-160px 0% 0% -40%;}
.jn-main h1{font-size:16px; color:#FFF; height:40px; line-height:40px; text-align:center; border-bottom:1px solid #FFF}
.tabs {border-bottom: solid 1px #9d9d9d; padding: 5% 5% 0; margin: 0 5%;}
.tabs strong {display: inline-block;width: 42%; text-align: center; color: #fff; font-size: 90%;}
.tabs strong span {display: inline-block; padding: 0.5rem 0 0.8rem; }
.tabs strong.current span {border-bottom: solid 2px #fff;position: relative;}
.tabs strong.current span:after { content: " "; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; width:0; height:0;border-left:0.4rem solid transparent;border-right:0.4rem solid transparent;border-bottom:0.4rem solid #fff;}
.btn-close { position: absolute;top: -4%;right: 4%;font-size: 1.5rem;color: #ffffff; line-height: 3rem; }
.tabsbox2{ width:86%; margin:0px auto;font-size: 80%; color: #fff;}
.tabsbox { width:80%; height:180px; margin:0px auto;font-size: 80%; color: #fff; overflow: auto; -webkit-overflow-scrolling:touch;}
.tabsbox p {margin: 0; line-height:26px;}
.sorryBox {position: fixed; top: 0; left: 0; z-index: 99; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8);}
.sorryBox > div {position: absolute; left:50%; top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%); width: 80%; text-align: center;}
.sorryBox .btn {width: 80%; margin-bottom:5%; padding: 0.5rem;}
.hammer {
position: absolute;
z-index: 10;
left: -60%;
top: -30%;
width: 6.5rem;
display: block;
max-width: none;
-webkit-animation: hammer 0.5s alternate;
animation: hammer 0.5s alternate;
transform-origin: bottom left;
-webkit-transform-origin: bottom left;
}
.agg-puo {
position: absolute;
left: -40%;
right: 0;
bottom: 18%;
width: 10rem;
display: block;
max-width: none;
display: none;
}
@keyframes hammer
{
50%
{
transform: rotate(15deg);
}
}
@-webkit-keyframes hammer
{
50%
{
-webkit-transform: rotate(15deg);
}
}
.winBox{ width:100%; height:100%;position: fixed; top: 0px; left: 0px; background-color: rgba(0, 0, 0, 0.85); z-index:100; display:none;}
.winBox-main{width: 80%; height:200px; border-radius: 0.5rem; background-color:#d31427; position: absolute; left:50%; top:50%; margin:-100px 0% 0% -40%;}
.winBox-main p{ text-align:center; color:#FFF; font-size:18px; margin-top:50px;}
.winBox-main p span{ color:#ffff8c}
.winBox-main .btn{ display:block; width:70%; margin:0px auto}
.sorrytext{ display:none; text-align:center; color:#FFF}
.fromBox {position: fixed; top: 0; left: 0; z-index: 99; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: table}
.fromBox > div {padding: 10%; display: table-cell; vertical-align: middle;}
.from {padding: 10% 5% 0;}
.from input {width: 100%; border: none; background-color: #fff; border-radius: 0.5rem; padding: 0.5rem 1rem; margin-bottom: 5%;}
.from > div input {width: 48%; float: left;}
.from > div button {width: 48%; float: right; padding: 0.5rem;}
#btn-lq {display: block; margin: auto; padding: 0.5rem 3rem; font-weight: 700; margin-top: 7%;}
/*刮刮卡*/
.box {width: 100%;}
.box .bg_in {
border-radius: 6px;
-webkit-border-radius: 6px;
}
.box .bg_in .title {
color: #fff;
font-size: 0.9rem;
text-align: center;
padding: 0.25rem 0;
}
.box .content {
z-index: 10;
position: relative;
width: 13rem;
height: 6rem;
margin: 0 auto 0 auto;
background: #CD261D;
border-radius: 6px;
-webkit-border-radius: 6px;
}
.hint-show {
display: none;
position: absolute;
left: 50%;
top: 6rem;
width: 286px;
height: 245px;
margin-left: -143px;
z-index: 99;
}
.hint-show .hint-img {
width: 286px;
height: 245px;
}
.hint-show .colour-img {
width: 239px;
height: 138px;
position: absolute;
top: -20px;
left: 50%;
margin-left: -120px;
z-index: 110;
}
.hint-show .prize-img {
width: 116.5px;
height: 121.5px;
position: absolute;
top: 74px;
left: 50%;
margin-left: -60px;
z-index: 100;
}
#mask_img_bg {
position: absolute;
left: 0.2rem;
top: 0.2rem;
bottom: 0.2rem;
right: 0.2rem;
background: #fff;
border-radius: 6px;
-webkit-border-radius: 6px;
}
#mask_img_bg img {
width: 5.3rem;
height: 5.5rem;
margin: 0 auto;
display: block;
}
#redux {
z-index: 22;
position: absolute;
padding: 0.2rem;
box-sizing: border-box;
width: 100%;
height: 100%;
border-radius: 6px;
-webkit-border-radius: 6px;
}
.cont-span{
display: block;
width: 120px;
height: 38px;
text-align: center;
position: absolute;
top: 40%;
left: 50%;
margin-left: -60px;
z-index: 10;
}
.hint-show .prize-span {
display: block;
width: 120px;
height: 38px;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-left: -60px;
z-index: 100;
}
.hint-show .close {
display: inline-block;
width: 32px;
height: 32px;
position: absolute;
top: 0;
right: 0;
z-index: 200;
}
.hint-show .btns {
display: inline-block;
width: 180px;
height: 37px;
position: absolute;
bottom: 10px;
left: 48px;
z-index: 200;
}
.mask {
display: none;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 98;
}
.gua_box{width: 80%;margin: 20px auto;background:#D4787B;}
.gua_box_tip{width: 100%;font-size: 0.7rem;padding-top: 20px;color: #fff;text-align: center;}
.gua_text_ol{color: #fff;font-size: 0.5rem;}
.gua_sorrytext{font-size: 0.6rem;}
#telphone{width: 90%;}
.gua_btn{color: #fff;background: #F7000C;}
/*摇一摇*/
.indexbg {width: 100%;position: relative;}
.indexBg {width: 100%;margin: 0 auto;position: absolute;}
.cp {width: 100%;z-index:1;position: absolute;margin-top: 33%;}
.shakeimg{width: 63.125%;left: 50%;margin-left: -31.5625%;margin-top: 51.875%;position: absolute;}
.nav {width: 100%;position: absolute;margin-top: 128.91%;}
.yao_box{background: #F73236;}