.title[data-v-7ed464c4] {
    width: 100%;
    height: 1.3rem;
    line-height: 1.3rem;
    text-align: center;
    font-size: .45rem;
    color: #fff;
    z-index: 99;
    background-image: -webkit-radial-gradient(transparent .02667rem,rgba(0,0,0,.396078) 0);
    background-image: radial-gradient(transparent .02667rem,rgba(0,0,0,.396078) 0)
}

.title span[data-v-7ed464c4] {
    z-index: 99
}

.titleP[data-v-7ed464c4] {
    position: absolute;
    top: 0
}

.topIcon[data-v-7ed464c4] {
    width: .5rem;
    height: .5rem
}

.back_icon[data-v-7ed464c4] {
    position: absolute;
    top: .4rem;
    left: .4rem
}

.set_icon[data-v-7ed464c4] {
    width: .6rem;
    height: .6rem;
    position: absolute;
    top: .35rem;
    right: .5rem
}

#particles-js[data-v-10a9785c] {
    position: fixed;
    width: 100%;
    height: 100vh
}

[data-v-10a9785c] .van-overlay {
    background-color: rgba(0,0,0,.3)
}

.box[data-v-10a9785c] {
    height: 100vh;
    overflow: hidden;
    position: relative
}

.chessboardBox[data-v-10a9785c] {
    padding: 8%;
    position: relative
}

.chessboardTop[data-v-10a9785c] {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.chessboardCenter[data-v-10a9785c],.chessboardTop[data-v-10a9785c] {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-orient: horizontal
}

.chessboardCenter[data-v-10a9785c] {
    -webkit-box-direction: normal;
    -webkit-flex-flow: row;
    flex-flow: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
}

.chessboardCenter-left[data-v-10a9785c],.chessboardCenter-right[data-v-10a9785c] {
    width: 16.66667%
}

.chessboardBottom[data-v-10a9785c] {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.chessboard[data-v-10a9785c] {
    width: 16.66667%;
    margin: 1%
}

.chessboard2[data-v-10a9785c] {
    margin: 6% 6% 12%
}

.chess[data-v-10a9785c] {
    width: 100%;
    padding-top: 100%;
    position: relative;
    border-radius: .2rem;
    background-image: hsla(0,0%,65.9%,0);
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
    box-shadow: 0 .02667rem .16rem 0 hsla(0,0%,100%,.1)
}

.bg1-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(45deg,#ff9a9e,#fad0c4 99%,#fad0c4);
    background-image: linear-gradient(45deg,#ff9a9e,#fad0c4 99%,#fad0c4);
    background-image: -webkit-linear-gradient(45deg,#fdcbf1,#fdcbf1 1%,#e6dee9);
    background-image: linear-gradient(45deg,#fdcbf1,#fdcbf1 1%,#e6dee9)
}

.bg1-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(45deg,#fcb69f 30%,#ffecd2);
    background-image: linear-gradient(45deg,#fcb69f 30%,#ffecd2)
}

.bg1-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(45deg,#feada6 30%,#f5efef);
    background-image: linear-gradient(45deg,#feada6 30%,#f5efef)
}

.bg2-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#a18cd1,#fbc2eb);
    background-image: linear-gradient(0deg,#a18cd1 0,#fbc2eb)
}

.bg2-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#ff9a9e,#fecfef 99%,#fecfef);
    background-image: linear-gradient(0deg,#ff9a9e 0,#fecfef 99%,#fecfef)
}

.bg2-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#a6c1ee,#fbc2eb);
    background-image: linear-gradient(0deg,#a6c1ee 0,#fbc2eb)
}

.bg3-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#d9afd9,#97d9e1);
    background-image: linear-gradient(0deg,#d9afd9 0,#97d9e1)
}

.bg3-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#df89b5,#bfd9fe);
    background-image: linear-gradient(0deg,#df89b5 0,#bfd9fe)
}

.bg3-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(bottom,#fed6e3,#a8edea);
    background-image: linear-gradient(0deg,#fed6e3 0,#a8edea)
}

.bg4-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(330deg,#f6d365,#fda085);
    background-image: linear-gradient(120deg,#f6d365,#fda085)
}

.bg4-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(330deg,#c2e9fb,#a1c4fd);
    background-image: linear-gradient(120deg,#c2e9fb,#a1c4fd)
}

.bg4-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(330deg,#88d3ce,#6e45e2);
    background-image: linear-gradient(120deg,#88d3ce,#6e45e2)
}

.bg5-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(330deg,#e0c3fc,#8ec5fc);
    background-image: linear-gradient(120deg,#e0c3fc,#8ec5fc)
}

.bg5-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(left,#4facfe,#00f2fe);
    background-image: linear-gradient(90deg,#4facfe 0,#00f2fe)
}

.bg5-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(left,#9face6,#74ebd5);
    background-image: linear-gradient(90deg,#9face6 0,#74ebd5)
}

.bg6-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#2cd8d5,#c5c1ff 56%,#ffbac3);
    background-image: linear-gradient(-225deg,#2cd8d5,#c5c1ff 56%,#ffbac3)
}

.bg6-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#5d9fff,#b8dcff 48%,#6bbbff);
    background-image: linear-gradient(-225deg,#5d9fff,#b8dcff 48%,#6bbbff)
}

.bg6-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#5271c4,#b19fff 48%,#eca1fe);
    background-image: linear-gradient(-225deg,#5271c4,#b19fff 48%,#eca1fe)
}

.bg7-1[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#65379b,#886aea 53%,#6457c6);
    background-image: linear-gradient(-225deg,#65379b,#886aea 53%,#6457c6)
}

.bg7-2[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#77ffd2,#6297db 48%,#1eecff);
    background-image: linear-gradient(-225deg,#77ffd2,#6297db 48%,#1eecff)
}

.bg7-3[data-v-10a9785c] {
    background-image: -webkit-linear-gradient(315deg,#7de2fc,#b9b6e5);
    background-image: linear-gradient(-225deg,#7de2fc,#b9b6e5)
}

.chessNum[data-v-10a9785c] {
    font-size: .5rem;
    color: #fff;
    font-weight: 600
}

.chessImg[data-v-10a9785c],.chessNum[data-v-10a9785c] {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.chessImg[data-v-10a9785c] {
    width: .5rem;
    height: .5rem
}

#boy[data-v-10a9785c],#girl[data-v-10a9785c] {
    width: 10%;
    position: absolute;
    z-index: 99;
    top: 9.6%;
    left: 85%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    -webkit-transition: all .4s cubic-bezier(.25,1,.3,1);
    transition: all .4s cubic-bezier(.25,1,.3,1)
}

.rulerBox[data-v-10a9785c] {
    width: 40%;
    padding: 8% 5% 5% 5%;
    color: #000;
    top: 50%;
    font-size: .3rem;
    background-color: hsla(0,0%,45.9%,.4196078431372549)
}

.rulerBox[data-v-10a9785c],.rulerTitle[data-v-10a9785c] {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    border-radius: .2rem
}

.rulerTitle[data-v-10a9785c] {
    width: 50%;
    height: 1rem;
    line-height: 1rem;
    font-size: .4rem;
    font-weight: 600;
    text-align: center;
    top: 0;
    color: #fff;
    background-color: #9795f0
}

.rulerImg[data-v-10a9785c] {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center
}

#gif[data-v-10a9785c] {
    width: 2rem;
    height: 2rem;
    -webkit-transition: all 1s cubic-bezier(.25,1,.3,1);
    transition: all 1s cubic-bezier(.25,1,.3,1)
}

.animationGif[data-v-10a9785c] {
    -webkit-animation: gif-10a9785c 1s ease 0s both;
    -moz-animation: gif-10a9785c 1s 0s ease both
}

@-webkit-keyframes gif-10a9785c {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    25% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    75% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.van-popup--center[data-v-10a9785c] {
    width: 70%;
    padding: .5rem .2rem;
    top: 45%;
    border-radius: .2rem;
    background-color: rgba(44,44,49,.501961);
    -webkit-backdrop-filter: blur(.26667rem);
    backdrop-filter: blur(.26667rem)
}

.iptBox[data-v-10a9785c] {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    color: #fff
}

.iptTitle[data-v-10a9785c] {
    font-size: .5rem;
    margin: .5rem 0 0 0;
    color: #fff;
    text-align: center
}

.errorTip[data-v-10a9785c] {
    font-size: .4rem;
    color: #fff;
    padding: .5rem;
    text-align: center
}

.bgc1[data-v-10a9785c] {
    background: -webkit-linear-gradient(top,#fdcbf1,#e6dee9);
    background: linear-gradient(180deg,#fdcbf1,#e6dee9);
    top: 0;
    top: -20%;
    left: -20%
}

.bgc1[data-v-10a9785c],.bgc2[data-v-10a9785c] {
    border-radius: 100%;
    opacity: .8000000059604645;
    -webkit-filter: blur(2.49045rem);
    filter: blur(2.49045rem);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 50%;
    aspect-ratio: 1/1;
    z-index: -1;
    position: absolute;
    height: 80%
}

.bgc2[data-v-10a9785c] {
    background: -webkit-linear-gradient(top,#fad0c4,#fad0c4);
    background: linear-gradient(180deg,#fad0c4,#fad0c4);
    top: 0;
    top: 20%;
    left: 40%
}

.bgc3[data-v-10a9785c] {
    border-radius: 100%;
    opacity: .8000000059604645;
    background: -webkit-linear-gradient(top,#a8edea,#fed6e3);
    background: linear-gradient(180deg,#a8edea,#fed6e3);
    -webkit-filter: blur(2.49045rem);
    filter: blur(2.49045rem);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 50%;
    aspect-ratio: 1/1;
    top: 0;
    z-index: -1;
    position: absolute;
    height: 80%;
    top: 60%;
    left: -10%
}