@charset "utf-8";*,a:active {
    outline: 0
}

body,input {
    width: 100%
}

.placeholder,button,html,input,textarea {
    font-family: 'Helvetica Neue',Helvetica,Hiragino Sans GB,'Microsoft Yahei',STHeiTi,Arial,sans-serif
}

#start span,b,strong {
    font-weight: 700
}

* {
    box-sizing: border-box
}

html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased
}

body {
    line-height: 1;
    overflow-x: hidden;
    max-width: 640px;
    margin: 0 auto;
    color: #333;
    background-color: #f0f0f0;
    -webkit-overflow-scrolling: touch;
    -webkit-touch-callout: none;
    font-size: .12rem
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
    display: block
}

a {
    text-decoration: none;
    color: inherit
}

dfn {
    font-style: normal
}

img {
    max-width: 100%;
    vertical-align: middle;
    border: 0
}

button,input,textarea {
    font-size: .12rem;
    margin: 0;
    padding: 0;
    border: 0
}

textarea {
    resize: none
}

table {
    border-spacing: 0;
    border-collapse: collapse
}

td,th {
    padding: 0
}

blockquote,figure,form,h1,h2,h3,h4,h5,h6,p {
    margin: 0
}

dd,dl,li,ol,ul {
    margin: 0;
    padding: 0
}

li,ol,ul {
    list-style: none
}

input {
    height: .34rem;
    padding: 0 .1rem;
    text-align: left;
    border: 1px solid #ddd;
    border-radius: .04rem
}

.placeholder {
    text-align: left;
    color: #999
}

input:-moz-placeholder,textarea:-moz-placeholder {
    font-family: 'Helvetica Neue',Helvetica,Hiragino Sans GB,'Microsoft Yahei',STHeiTi,Arial,sans-serif;
    text-align: left;
    color: #999
}

input:-moz-placeholder :-moz-placeholder,textarea:-moz-placeholder :-moz-placeholder {
    color: #ddd
}

input:-moz-placeholder ::-webkit-input-placeholder,textarea:-moz-placeholder ::-webkit-input-placeholder {
    color: #ddd
}

input::-moz-placeholder,textarea::-moz-placeholder {
    opacity: 1;
    font-family: 'Helvetica Neue',Helvetica,Hiragino Sans GB,'Microsoft Yahei',STHeiTi,Arial,sans-serif;
    text-align: left;
    color: #999
}

input::-moz-placeholder :-moz-placeholder,textarea::-moz-placeholder :-moz-placeholder {
    color: #ddd
}

input::-moz-placeholder ::-webkit-input-placeholder,textarea::-moz-placeholder ::-webkit-input-placeholder {
    color: #ddd
}

input:-ms-input-placeholder,textarea::-ms-input-placeholder {
    font-family: 'Helvetica Neue',Helvetica,Hiragino Sans GB,'Microsoft Yahei',STHeiTi,Arial,sans-serif;
    text-align: left;
    color: #999
}

input:-ms-input-placeholder :-moz-placeholder,textarea::-ms-input-placeholder :-moz-placeholder {
    color: #ddd
}

input:-ms-input-placeholder ::-webkit-input-placeholder,textarea::-ms-input-placeholder ::-webkit-input-placeholder {
    color: #ddd
}

input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
    font-family: 'Helvetica Neue',Helvetica,Hiragino Sans GB,'Microsoft Yahei',STHeiTi,Arial,sans-serif;
    text-align: left;
    color: #999
}

#start span,.myCredits,.needCredits {
    text-align: center
}

input::-webkit-input-placeholder :-moz-placeholder,textarea::-webkit-input-placeholder :-moz-placeholder {
    color: #ddd
}

input::-webkit-input-placeholder ::-webkit-input-placeholder,textarea::-webkit-input-placeholder ::-webkit-input-placeholder {
    color: #ddd
}

.hidden {
    display: none!important;
    visibility: hidden!important
}

.fl {
    float: left
}

.fr {
    float: right
}

.DB_guide {
    position: absolute;
    z-index: 20;
    display: none;
    pointer-events: none
}

.DB_guide .DB_G_circle,.DB_guide .DB_G_hand {
    position: absolute;
    display: inline-block;
    background-repeat: no-repeat
}

.DB_guide .DB_G_circle {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAJbUExURQAAAP2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf/5yf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf/5yf2/Zf/ttf2/Zf2/Zf3Baf/1wv/4x/3Caf2/Zf2/Zf2/Zf3Jdf2/Zf/2xP2/Zf2/Zf2/Zf/0wf7Shv2/Zf3AZ/2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf7em/2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf2/Zf3DbP2/Zf7qr//5yf/5yf2/Zf2/Zf/5yf/4x/3Ebf7TiP2/Zf/5yf/rsf/wuv7qsP3Cav7qsP/0wf/5yf/5yf/5yf/5yf/5yf/5yf/5yf/5yf/3xv/0wP3Nff7Ykf/2xP/zvv/zv/7Th/7Rhf7mqP7Zkf/utv7Uif7WjP7Zkv2/Zf7qsP3GcP2/Zf3Gcf2/Zf2/Zf/0wP7gnf/4x//0wP2/Zf2/Zf7mqP/ttf/ttP/rsP3Jd/3Jdv/5yf/5yf/5yf/5yf/3xf/0wP/rsf/zv/7OgP2/Zf/5yP/3xv/3xf7Xjv7hn//1wv7Xj/7hoP7Wjf3DbP/4x/3Ebv7Uif7Uiv7Qgv/5yf/5yf/5yf7Of//rsf7Xjv3Nff7fnf/vuf/0wf/wuf2/Zf7mqP7Zkv3Idf/wuv/1wv2/Zf/5ySw2figAAADIdFJOUwARbwUCBAZmdQELCQ8DCh4XFloOLWRIHBAIXUE3J09XBz8aEz4maiwhGzUwKiJeUik8Mx09JDQ7DP5fzlQjd+z5eEkScIBr8S9tTumOH3YUXDhNMUYgLqVDR0wYaVFEUHlnw1o7VTb9+HqQWTPH18V4w+hCY2QMAw8BBvblhpnw4+OQjbea0JGUmnTEfXN9QnHnqPfoKFO2zc3FgYE0DVgK9ObI5IhA/Pfzl6vrl6yVevp7kpKLOTgyiMaWh6fW6tZouJuA2O0rf8AtLQAABhFJREFUWMO9V2V7G0cQjk7SacXMzJIlywwxxUwxM1MMMcUOx2FyEjvM3LSBNk2TNlhm9M/qae8k3Z1PtvI8aefj7ezc7MA772zY8F8Jn88Rc9lsFEXZbK6Yw+e/320Ol22TCJQiVlhESoHEhnI5/IRvi1G9QOSU+aW+5KysrGSf1C9z6gR6VJyIDeznqETU6Gh3e1uTmnMyMzNzmpNave52R6NIkoAb2N8FOrnU3WGyt7WkWBVNhiaFNaWlzW7qcEvlOgFmYs3fi9lCkbz+erqrtCA0jICIIMOhglJX+vV6uUjIFsd3gs+15Tq15nSjxeABRV/dzD9a9XTladXR/JMv5oHHYDGmm7XOXBs3ngUOV6+UJVe7avOQhsVbW1fIsvXWYgOSV+uqTpYp9XGewWELdQ7zuEZRU/TT5pXVsvlKUY1CM2526IRsDvN9ljaYZlGDHy6vMMvlZ0BtSQtqWUwW+FwhK0NlH6sc+n7jSjzZODtUWWBXZbCEq+LA5+p1WpXRihw6uLKWHDyEWD9VaXV6ugWxTekI2q2X6qpiyju2d07de/363lTn9h3Rj1V1l6z2oENpE9MCkCszp40hxw9EFIu3vwsXgKevzxOuh3cjxcTBgRPIWJpZlksJAxYAZ7LJUvndJ5HHzlWAcrUipUfT3a3pSVGoy0HFHBGbIz9WWkzJTkoYOKhIW61RTz4k7m96C5DQ4EBOUkDl9aoCSTkDgyEEvN2Enz6cVGuqtSKUQ3JAIDe7FOARcX/bOaDuN2YHC6X+Xpms1y8tDGYb+9Xg3Db8/BFQuMxyQcwFDqqrz66tOUz4eKoEGDSmVKmchQGBUIjhAksuTTVpDKDkFP7AwzW12fW6mAtiiTzVmFdElN9f8+cVXQGfHHYvBkUc2OByX6Br+vw87sPmojxjqlwSSQQfFUnTLcgX+P2/LwDFRVVGmQCNtR0fa/KyDNXFaXABj8OXiCVdKkIJBY6+0e0yNOBHE2+AoUuFVSu1YzhYoWpVXQZwegJGucHgcjfqCRWuwNFR6lnEHbgD1JpABitSaXs/3hstVVZGQKMGd6Dakqe0wyHg4kdsUbupANyGB68qkH6TrwxP8r5vHvB4vAdf7yNqpcxn6kcqXoX1boMCU7uIDf/Ctznd9lAJ3v8jIBwemKGFmd08XHbPLBDJTjWGwAjEh5KQ3e20QQMciczbNnwGf0Fd+WC2FK+RnbyY7CTKTZo9WF4HFc8Mt3llEhgEscDf2oKcxPMD1AP/yGB+Znhk+RZPtyw4oAaws24iLa1+AUwkVylNugHyoYE5oEgrZIXT89EuioFde2C+WYVpCnA2rJkPUpKkShhFts7XbAXHoIHO6OdRHlVGI/9KAZ1hzWPA2uwTsaEBVmGOAnwODUwhPQG/IPyyLTQDW2AUBP5AD3Ic9iRQ5CSzoAGUlZXZBD6DBu56SlW94dDs59FlP4x3r0rjuRvWvAqaMrNYKDRQlpVpAHgSJvu6vTIhFoI9qwzAIAhl3u6+SagKDFEDJA+iBpg9IBnYGvOAHIO7Hg3+hDgxgE+4R4sBOQvHo0FkzAIpiKQskOsglkamOiCnkVQH5Eo8Gy0kWiXObKAV0slYJZJ7YQdWykG8lFf3AqWUSb1A6UZSMy3cj3bj/QV6MxWTupGCByMgFGlnDA9Gw7nYMrovit3Rdr5FwgMCkZbwgUQGFDIiRQHlTzii/iAhEhUTaZBGnr44pM2txkQKKk+cTgRUqahMnQubLixPx4X1ZRzWaXOBNpl+nT8/HR0sfEzIg+VnOJkWaZMpMhtnI6NtmXm0LROjbZY+GyPTeehxQsP18RB9OuP8YNxS+YTgB8/fMI33089xfvCk0jJO4wdRhjJFMJSJswwEYyLCUApWMRQGjlQ8coJMcU5EKE5VXTkTR2JkadcwklXx8mUFRrKurcvSSDxxdm2eOMbME8lM9Vk8pnrtxRpMlcKVrzBx5V/W4cpUtr6UX0y5XZy/tC5bp+0LJXBfuLpyFdsXfj88lMi+sMbG8lteeGNJXW9jgc9g2JluJLwzfYCtLf7emJvg3si4uea+1+b6IXbn/1P+BTfwUZRK/gQ7AAAAAElFTkSuQmCC);
    background-size: 100% 100%;
    width: .3rem;
    height: .3rem;
    left: 0;
    top: 0;
    opacity: 0;
    -webkit-animation: guidCircle 1.5s linear infinite normal;
    animation: guidCircle 1.5s linear infinite normal
}

.DB_guide .DB_G_hand {
    width: .89rem;
    height: .94rem;
    left: .1rem;
    top: .05rem;
    background-image: url(../img/hand.png);
    -webkit-animation: guideHand2 .5s step-start infinite;
    animation: guideHand2 .5s step-start infinite;
    background-size: cover
}

.radius-bg,.radius-bg.default {
    background-image: url(../img/radius-1.png)
}

#circle,#start,.record {
    background-size: 100% 100%
}

@-webkit-keyframes guideHand {
    0% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }

    20%,80% {
        opacity: 1;
        -webkit-transform: scale(.8,.8);
        transform: scale(.8,.8)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.8,.8);
        transform: scale(.8,.8)
    }
}

@keyframes guideHand {
    0% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }

    20%,80% {
        opacity: 1;
        -webkit-transform: scale(.8,.8);
        transform: scale(.8,.8)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.8,.8);
        transform: scale(.8,.8)
    }
}

@-webkit-keyframes guideHand2 {
    0% {
        background-position: 0 0
    }

    50% {
        background-position: -.89rem 0
    }
}

@keyframes guideHand2 {
    0% {
        background-position: 0 0
    }

    50% {
        background-position: -.89rem 0
    }
}

@-webkit-keyframes guidCircle {
    0%,20% {
        opacity: 0;
        -webkit-transform: scale(0,0);
        transform: scale(0,0)
    }

    50%,80% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }
}

@keyframes guidCircle {
    0%,20% {
        opacity: 0;
        -webkit-transform: scale(0,0);
        transform: scale(0,0)
    }

    50%,80% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1,1);
        transform: scale(1,1)
    }
}

.clearfix {
    display: table;
    clear: both;
    content: ''
}

#db-content {
    position: relative;
    display: none;
    background-repeat: no-repeat;
    background-size: 100% 5.04rem;
    height: 5.04rem
}

.record {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: .54rem;
    height: .54rem;
    z-index: 10
}

.banner,.core,.core-overflow {
    position: relative
}

.banner {
    height: 1.15rem;
    margin-bottom: .05rem
}

.needCredits {
    margin: 0 auto .15rem;
    height: .25rem
}

.needCredits p {
    line-height: .23rem;
    display: inline-block;
    height: .25rem;
    margin: 0 auto;
    padding: 0 .2rem;
    color: #fdaad9;
    border: .01rem solid #fdaad9;
    border-radius: .125rem;
    box-shadow: 0 0 .05rem rgba(254,46,139,.75),0 0 .05rem rgba(254,46,139,.75) inset;
    text-shadow: 0 0 .05rem rgba(254,46,139,.75)
}

.core {
    width: 2.9rem;
    height: 2.9rem;
    margin: 0 auto .075rem
}

.core-overflow {
    overflow: hidden;
    width: 100%;
    height: 100%
}

.circle-box {
    position: absolute;
    top: .015rem;
    left: .015rem;
    overflow: hidden;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 50%
}

#circle {
    width: 2.73rem;
    height: 2.73rem;
    margin-top: .085rem;
    margin-left: .085rem;
    border-radius: 50%;
    background-repeat: no-repeat;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000
}

#circle .prize {
    position: absolute;
    width: 1.35rem;
    height: 1.35rem;
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom
}

#circle .prize:nth-child(1) {
    -webkit-transform: rotate(60deg) skewY(30deg);
    transform: rotate(60deg) skewY(30deg)
}

#circle .prize:nth-child(2) {
    -webkit-transform: rotate(120deg) skewY(30deg);
    transform: rotate(120deg) skewY(30deg)
}

#circle .prize:nth-child(3) {
    -webkit-transform: rotate(180deg) skewY(30deg);
    transform: rotate(180deg) skewY(30deg)
}

#circle .prize:nth-child(4) {
    -webkit-transform: rotate(240deg) skewY(30deg);
    transform: rotate(240deg) skewY(30deg)
}

#circle .prize:nth-child(5) {
    -webkit-transform: rotate(300deg) skewY(30deg);
    transform: rotate(300deg) skewY(30deg)
}

#circle .prize:nth-child(6) {
    -webkit-transform: rotate(360deg) skewY(30deg);
    transform: rotate(360deg) skewY(30deg)
}

#circle .prize .prize-dialog {
    position: absolute;
    top: .45rem;
    left: .53rem;
    width: .75rem;
    height: .75rem;
    -webkit-transform: skewY(-30deg) rotate(-30deg);
    transform: skewY(-30deg) rotate(-30deg);
    text-align: center
}

#start,#start span,.point {
    position: absolute;
    left: 50%
}

#circle .prize .prize-dialog img {
    width: .55rem;
    height: .55rem;
    margin-top: .05rem
}

#circle .prize .prize-dialog p {
    font-size: .1rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: none
}

#circle .prize:nth-child(odd) .prize-dialog p {
    color: #ffdb78
}

#circle .prize:nth-child(even) .prize-dialog p {
    color: #0e8d88
}

#start {
    top: 50%;
    width: .84rem;
    height: .87rem;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    background-repeat: no-repeat
}

#start span {
    font-size: .21rem;
    top: 50%;
    display: block;
    width: .45rem;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #e56c01
}

.myCredits {
    margin: 0 auto .1rem;
    padding: 0 .2rem;
    color: #fda9d8;
    text-shadow: 0 0 .075rem rgba(254,46,139,.75)
}

.myCredits span {
    color: #ffdb78
}

.point {
    top: -.065rem;
    width: .21rem;
    height: .34rem;
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.radius-bg,.radius-group {
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: absolute;
    background-size: 100% 100%
}

.radius-bg {
    border-radius: 1.45rem;
    -webkit-border-radius: 1.45rem
}

.radius-bg.toggle {
    background-image: url(../img/radius-2.png)
}

.radius-bg.end {
    background-image: url(../img/radius-3.png)
}

.radius-group {
    border-radius: 1.45rem;
    background-repeat: no-repeat;
    background-color: #fe2e8b
}

.rule {
    position: absolute;
    top: .09rem;
    left: .15rem;
    width: .46rem;
    height: .17rem;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.filter {
    filter: blur(5px);
    -webkit-filter: blur(5px)
}

.prize-detail-dialog .prize-detail-slideup {
    width: .48rem;
    height: .48rem;
    background-image: url(//yun.tuisnake.com/h5/activity/turntable_circle/images/prize-detail-btn.png)!important;
    background-size: .48rem .48rem
}

.giveup-modal,.recommand-modal {
    display: none
}

.apple {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0
}

.rule-modal .rule-modal-dialog header i {
    background-color: #fff
}

.rule-modal .close,.rule-modal .rule-modal-dialog header span,.rule-modal .rule-modal-dialog section .description,.rule-modal .rule-modal-dialog section .probability .text {
    color: #fff
}