body,html{height:100%;overflow-x:hidden}.page-container{width:100%;height:952px;position:relative}.page{width:100%;height:952px;background:center top no-repeat;position:absolute;left:0;top:0}.index{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/index_bg.jpg);z-index:1}.index video{position:absolute;left:50%;-webkit-transform:translate(-50%);-moz-transform:translate(-50%);-ms-transform:translate(-50%);-o-transform:translate(-50%);transform:translate(-50%)}.index canvas{position:absolute;z-index:1;left:50%;margin-left:-400px;top:0;opacity:0;-webkit-transition:opacity .5s;-o-transition:opacity .5s;-moz-transition:opacity .5s;transition:opacity .5s}.index canvas.active{opacity:1;animation:float 1s infinite alternate-reverse}.index .btn{width:73px;height:149px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/select.png);position:absolute;left:50%;top:207px;z-index:2}.logo{display:block;width:152px;height:63px;position:absolute;left:40px;top:20px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/logo.png) no-repeat;z-index:2}.top-nav{width:280px;height:48px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/top-nav.png?v1);background-repeat:no-repeat;position:absolute;right:20px;top:0;z-index:2;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0 50px}.top-nav li{padding-top:6px}.bgm{width:30px;cursor:pointer}.top-nav.on{background-position:0 0}.top-nav.off{background-position:0 -49px}.top-nav li i{width:20px;height:20px;display:inline-block;vertical-align:bottom;cursor:pointer}.top-nav li.on i{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/on.png)}.top-nav li.off i{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/off.png)}.top-nav li a{font-size:16px;color:#ca7d39;text-shadow:1px 1px 2px #000}.top-nav li a:hover{color:#eeab4d}.index .left{margin-left:-449px;opacity:0;-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s;transition:all .5s}.index .left.active{margin-left:-499px;opacity:1}.index .right{background-position:right 0;margin-left:376px;opacity:0;-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s;transition:all .5s}.index .right.active{margin-left:426px;opacity:1}.index .card-container{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-perspective:500;-moz-perspective:500;perspective:500;position:absolute;width:344px;height:552px;left:50%;margin-left:-172px;z-index:-1;top:35px;animation:float 1s infinite alternate-reverse}.index .card-back{width:344px;height:552px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/card_back.png) no-repeat;position:relative;opacity:0;-webkit-transform:scale(.93);-moz-transform:scale(.93);-ms-transform:scale(.93);-o-transform:scale(.93);transform:scale(.93);-webkit-transition:opacity .5s;-o-transition:opacity .5s;-moz-transition:opacity .5s;transition:opacity .5s}.index .card-back .chara{position:absolute;bottom:82px;opacity:0}.index .card_1 .chara{width:238px;height:425px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/chara_1.png);left:53px}.index .card_2 .chara{width:238px;height:421px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/chara_2.png);left:53px}.index .card_3 .chara{width:268px;height:421px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/chara_3.png);left:25px}.index .card_4 .chara{width:270px;height:413px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/chara_4.png);left:53px}.index .card-back .board{width:230px;height:189px;position:absolute;left:50%;margin-left:-115px;bottom:90px;opacity:0}.index .card_1 .board{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/board_1.png) no-repeat}.index .card_2 .board{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/board_2.png) no-repeat}.index .card_3 .board{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/board_3.png) no-repeat}.index .card_4 .board{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/board_4.png) no-repeat}.index .card-back .silk{width:348px;height:76px;position:absolute;left:50%;margin-left:-174px;bottom:160px;opacity:0}.index .card_1 .silk{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/silk_1.png) no-repeat}.index .card_2 .silk{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/silk_2.png) no-repeat}.index .card_3 .silk{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/silk_3.png) no-repeat}.index .card_4 .silk{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/silk_4.png) no-repeat}.index .card-back .detail{width:144px;height:41px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/detail.png);position:absolute;left:50%;margin-left:-72px;bottom:130px;cursor:pointer;opacity:0}.index .card-back.disable::after{content:"";width:348px;height:189px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/lock.png?v1);position:absolute;bottom:90px;left:-2px;opacity:0;cursor:pointer}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@-moz-keyframes fadeIn{from{opacity:0}to{opacity:1}}@-o-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.index .card-container.active{z-index:3}.index .card-container.active .card-back.disable::after{-webkit-animation:fadeIn .5s 1.5s forwards;-moz-animation:fadeIn .5s 1.5s forwards;-o-animation:fadeIn .5s 1.5s forwards;animation:fadeIn .5s 1.5s forwards}.index .card-container.active .card-back{opacity:1}.index .card-container.active .board{-webkit-animation:zoomIn .5s forwards;-moz-animation:zoomIn .5s forwards;-o-animation:zoomIn .5s forwards;animation:zoomIn .5s forwards}.index .card-container.active .chara{-webkit-animation:fadeIndown .5s .5s forwards;-moz-animation:fadeIndown .5s .5s forwards;-o-animation:fadeIndown .5s .5s forwards;animation:fadeIndown .5s .5s forwards}.index .card-container.active .silk{-webkit-animation:fadeInup 1s 1s forwards;-moz-animation:fadeInup 1s 1s forwards;-o-animation:fadeInup 1s 1s forwards;animation:fadeInup 1s 1s forwards}.index .card-container.active .detail{-webkit-animation:fadeIn 1s 1.5s forwards;-moz-animation:fadeIn 1s 1.5s forwards;-o-animation:fadeIn 1s 1.5s forwards;animation:fadeIn 1s 1.5s forwards}@-webkit-keyframes zoomIn{from{opacity:0;-webkit-transform:scale(1.5);transform:scale(1.5)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-moz-keyframes zoomIn{from{opacity:0;-moz-transform:scale(1.5);transform:scale(1.5)}to{opacity:1;-moz-transform:scale(1);transform:scale(1)}}@-o-keyframes zoomIn{from{opacity:0;-o-transform:scale(1.5);transform:scale(1.5)}to{opacity:1;-o-transform:scale(1);transform:scale(1)}}@keyframes zoomIn{from{opacity:0;-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)}to{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-webkit-keyframes fadeIndown{from{-webkit-transform:translateY(-10px);transform:translateY(-10px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@-moz-keyframes fadeIndown{from{-moz-transform:translateY(-10px);transform:translateY(-10px);opacity:0}to{-moz-transform:translateY(0);transform:translateY(0);opacity:1}}@-o-keyframes fadeIndown{from{-o-transform:translateY(-10px);transform:translateY(-10px);opacity:0}to{-o-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fadeIndown{from{-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);-o-transform:translateY(-10px);transform:translateY(-10px);opacity:0}to{-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);opacity:1}}@-webkit-keyframes fadeInup{from{-webkit-transform:translateY(10px);transform:translateY(10px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@-moz-keyframes fadeInup{from{-moz-transform:translateY(10px);transform:translateY(10px);opacity:0}to{-moz-transform:translateY(0);transform:translateY(0);opacity:1}}@-o-keyframes fadeInup{from{-o-transform:translateY(10px);transform:translateY(10px);opacity:0}to{-o-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fadeInup{from{-webkit-transform:translateY(10px);-moz-transform:translateY(10px);-o-transform:translateY(10px);transform:translateY(10px);opacity:0}to{-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);opacity:1}}@-webkit-keyframes rubberBand{from{opacity:0;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@-moz-keyframes rubberBand{from{opacity:0;-moz-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-moz-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-moz-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-moz-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-moz-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-moz-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{opacity:1;-moz-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@-o-keyframes rubberBand{from{opacity:0;transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{opacity:1;transform:scale3d(1,1,1)}}@keyframes rubberBand{from{opacity:0;-webkit-transform:scale3d(1,1,1);-moz-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);-moz-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);-moz-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);-moz-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);-moz-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);-moz-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{opacity:1;-webkit-transform:scale3d(1,1,1);-moz-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.expand{z-index:-1;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/expand_bg.jpg);-webkit-mask-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/mist.png);mask-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/mist.png);-webkit-mask-size:2400% 100%;mask-size:2400% 100%}.expand.active{z-index:2;-webkit-animation:mistPlay steps(24) 1s;-moz-animation:mistPlay steps(24) 1s;-o-animation:mistPlay steps(24) 1s;animation:mistPlay steps(24) 1s}.expand.disable{z-index:2;-webkit-animation:mistPlayReverse steps(24) 1s;-moz-animation:mistPlayReverse steps(24) 1s;-o-animation:mistPlayReverse steps(24) 1s;animation:mistPlayReverse steps(24) 1s}@-webkit-keyframes mistPlay{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 0;mask-position:0 0}}@-moz-keyframes mistPlay{from{mask-position:100% 0}to{mask-position:0 0}}@-o-keyframes mistPlay{from{mask-position:100% 0}to{mask-position:0 0}}@keyframes mistPlay{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 0;mask-position:0 0}}@-webkit-keyframes mistPlayReverse{from{-webkit-mask-position:0 0;mask-position:0 0}to{-webkit-mask-position:100% 0;mask-position:100% 0}}@-moz-keyframes mistPlayReverse{from{mask-position:0 0}to{mask-position:100% 0}}@-o-keyframes mistPlayReverse{from{mask-position:0 0}to{mask-position:100% 0}}@keyframes mistPlayReverse{from{-webkit-mask-position:0 0;mask-position:0 0}to{-webkit-mask-position:100% 0;mask-position:100% 0}}.layer-container{width:760px;height:200px;position:absolute;left:50%;top:9px;margin-left:-460px;z-index:3}.layer-container li{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer.png?v1) no-repeat;position:absolute;bottom:0;cursor:pointer}.layer-container li:nth-child(1){width:252px;height:118px;-webkit-transform:rotate(-4deg);-moz-transform:rotate(-4deg);-ms-transform:rotate(-4deg);-o-transform:rotate(-4deg);transform:rotate(-4deg);background-position:-10px -10px;bottom:10px}.layer-container li:nth-child(2){left:254px;width:248px;height:113px;background-position:-10px -151px;bottom:27px;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-ms-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg)}.layer-container li:nth-child(3){width:254px;height:121px;left:490px;background-position:-284px -10px;bottom:33px}.layer-container li:nth-child(4){width:171px;height:173px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/back.png?v1);left:824px;bottom:-72px;-webkit-transform:rotate(-5deg);-moz-transform:rotate(-5deg);-ms-transform:rotate(-5deg);-o-transform:rotate(-5deg);transform:rotate(-5deg)}.layer-container li.active{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer_active.png) no-repeat}.layer-container li.active:nth-child(1){width:363px;height:171px;background-position:-394px -10px;-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);bottom:0}.layer-container li.active:nth-child(2){width:360px;height:168px;background-position:-10px -204px;bottom:22px;-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}.layer-container li.active:nth-child(3){width:364px;height:174px;background-position:-10px -10px}.layer-container li.disabled{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer_disabled.png)}.swiper-container{width:1080px;height:690px;position:absolute;left:50%;margin-left:-540px;top:154px;z-index:4}.track{width:1118px;height:340px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/track.png) no-repeat;position:absolute;left:-40px;top:200px}.ball-container{width:980px;height:440px;position:absolute;left:52px;top:120px}.ball-container li{position:absolute;cursor:pointer}.ball-container .ball{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/balls.png) no-repeat}.ball-container li .btn{background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/detail.png);-webkit-background-size:100% 100%;-moz-background-size:100% 100%;background-size:100% 100%;-webkit-transform:rotate(-5deg);-moz-transform:rotate(-5deg);-ms-transform:rotate(-5deg);-o-transform:rotate(-5deg);transform:rotate(-5deg);margin-top:-5px}.ball-container li:nth-child(1){left:0;top:76px}.ball-container li:nth-child(1) .ball{width:243px;height:304px}.ball-container li:nth-child(1) .btn{width:164px;height:47px;margin-left:50px}.ball-container li:nth-child(2){left:278px;top:-52px}.ball-container li:nth-child(2) .ball{width:222px;height:277px;background-position:-279px 0}.ball-container li:nth-child(2) .btn{width:152px;height:43px;margin-left:45px}.ball-container li:nth-child(3){left:560px;top:120px}.ball-container li:nth-child(3) .ball{width:204px;height:251px;background-position:-557px 0}.ball-container li:nth-child(3) .btn{width:145px;height:41px;margin-left:44px}.ball-container li:nth-child(4){left:846px;top:44px}.ball-container li:nth-child(4) .ball{width:168px;height:204px;background-position:-844px 0}.ball-container li:nth-child(4) .btn{width:126px;height:36px;margin-left:28px}.ball-container li:hover .ball{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/balls_active.png)}.expand .popup{width:100%;height:100%;background-color:rgba(0,0,0,.9);position:fixed;left:0;top:0;z-index:4;display:none}.paper-back{position:absolute;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/paper_back.png) no-repeat;-webkit-background-size:100% 100%;-moz-background-size:100% 100%;background-size:100% 100%;-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-ms-transform:rotate(6deg);-o-transform:rotate(6deg);transform:rotate(6deg);-webkit-transition:-webkit-transform .3s .5s;transition:-webkit-transform .3s .5s;-o-transition:-o-transform .3s .5s;-moz-transition:transform .3s .5s,-moz-transform .3s .5s;transition:transform .3s .5s;transition:transform .3s .5s,-webkit-transform .3s .5s,-moz-transform .3s .5s,-o-transform .3s .5s}.active .paper-back{-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}.paper-front{position:absolute;left:36px;top:62px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/paper_front.png) no-repeat;-webkit-background-size:100% 100%;-moz-background-size:100% 100%;background-size:100% 100%}.paper-front .title{position:absolute;left:50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%)}.paper-front .sign{position:absolute;width:112px;height:111px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/sign.png) no-repeat}.paper-front .arti{margin:0 auto;font-size:16px;color:#5e3a1f;line-height:26px;position:relative}.paper-front .arti p{margin-bottom:26px}.paper-container{margin:100px auto 0 auto;position:relative;display:none}.paper-container.active{display:block}.paper-container-1{width:1002px;height:652px;margin:100px auto 0 auto;position:relative}.paper-container-1 .paper-front{width:957px;height:584px}.paper-container-1 .paper-front .title{width:590px;height:57px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/title_1.png);top:79px}.paper-container-1 .paper-front .arti{width:800px;margin-top:160px}.paper-container-1 .paper-front .sign{top:380px;right:110px}.paper-container-1 .paper-back{width:1002px;height:652px}.paper-container-2{width:660px;height:429px}.paper-container-2 .paper-front{width:630px;height:384px;left:10px;top:36px}.paper-container-2 .paper-front .sign{top:216px;right:65px}.paper-container-2 .paper-front .title{width:590px;height:57px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/title_2.png);top:70px}.paper-container-2 .paper-front .arti{width:470px;margin-top:150px}.paper-container-2 .paper-back{width:660px;height:429px}.paper-container-3{width:527px;height:343px}.paper-container-3 .paper-front{width:505px;height:308px;left:10px;top:28px}.paper-container-3 .paper-front .sign{top:104px;right:60px}.paper-container-3 .paper-front .title{width:390px;height:57px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/title_3.png);top:57px}.paper-container-3 .paper-front .arti{width:350px;margin-top:136px}.paper-container-3 .paper-front .arti li{position:relative}.paper-container-3 .paper-front .arti li::before{content:"";position:absolute;width:6px;height:6px;background-color:#5e3a1f;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);left:-10px;top:10px}.paper-container-3 .paper-back{width:527px;height:343px}.paper-container-4 .inner{width:1109px;height:669px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/paper-container-4.png)}.paper-container-5{width:998px;height:649px}.paper-container-5 .paper-front{width:958px;height:584px;left:20px;top:54px}.paper-container-5 .paper-front .card-detail{width:791px;height:414px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/card-detail.png?v2) no-repeat;margin:80px 58px}.paper-container-5 .paper-back{width:998px;height:649px}.close{width:61px;height:61px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/close.png);margin:0 auto;cursor:pointer}.layer2-chara{width:520px;height:667px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/qirimubiao-stay.png?v1);-webkit-background-size:100% 100%;-moz-background-size:100% 100%;background-size:100% 100%;position:relative}.layer2-chara.active{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/qirimubiao_2.png);-webkit-background-size:2000% 100%;-moz-background-size:2000% 100%;background-size:2000% 100%;-webkit-animation:charaMove 2s steps(19) infinite;-moz-animation:charaMove 2s steps(19) infinite;-o-animation:charaMove 2s steps(19) infinite;animation:charaMove 2s steps(19) infinite}.layer2-chara .tag{width:171px;height:301px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/tag.png);position:absolute;top:186px;left:10px}@-webkit-keyframes charaMove{from{background-position:0 0}to{background-position:100% 0}}@-moz-keyframes charaMove{from{background-position:0 0}to{background-position:100% 0}}@-o-keyframes charaMove{from{background-position:0 0}to{background-position:100% 0}}@keyframes charaMove{from{background-position:0 0}to{background-position:100% 0}}.layer2-inner{position:absolute;left:486px;top:105px;-webkit-transform:rotate(-4deg);-moz-transform:rotate(-4deg);-ms-transform:rotate(-4deg);-o-transform:rotate(-4deg);transform:rotate(-4deg)}.inner-bg{width:535px;height:10px;position:absolute;left:0;top:330px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer2_inner.png);background-position:0 bottom}.layer2-card{width:527px;height:248px;position:absolute;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;top:78px;left:6px}.layer2-card li .card{width:166px;height:244px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer2_card.png?v3);-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s;transition:all .5s;cursor:pointer}.layer2-card li.active .card{background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer2_card_active.png?v4)}.layer2-card li:nth-child(2) .card{background-position:-182px 0}.layer2-card li:nth-child(3) .card{background-position:-362px 0}.layer2-card li .pagination{width:29px;height:29px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/icon.png);background-position:-29px 0;position:relative;cursor:pointer;margin:0 auto}.layer2-card li.active .pagination{background-position:0 0}.layer2-card li .pagination::after{width:11px;height:11px;content:"";display:block;position:absolute;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/icon.png) right top;left:50%;margin-left:-5px;top:-20px;opacity:0;-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s;transition:all .5s}.layer2-card li.active .pagination::after{top:-15px;opacity:1}.layer2-tab-container{width:540px;height:170px;position:absolute;left:0;top:360px;color:#472c17;-webkit-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-ms-transform:rotate(-1deg);-o-transform:rotate(-1deg);transform:rotate(-1deg)}.layer2-tab-container .layer2-tab{width:100%;height:100%;position:absolute}.layer2-tab-container .layer2-tab .layer-tab-title{width:409px;height:86px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer-tab-title.png);position:absolute;top:-360px}.layer2-tab-container .layer2-tab:nth-child(2) .layer-tab-title{background-position:0 -104px}.layer2-tab-container .layer2-tab:nth-child(3) .layer-tab-title{background-position:0 -205px}.layer2-tab-container .layer2-tab .content-box{width:340px;float:left}.items{background-position:right 0;float:left}.items_1{width:168px;height:168px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/item2.png) no-repeat;-webkit-background-size:contain;-moz-background-size:contain;background-size:contain}.items_2{width:200px;height:170px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/layer-tab-3.png);background-position:-320px -24px}.layer2-tab-container .layer2-tab:not(:first-child){display:none}.layer2-tab-container .layer2-tab h3{font-weight:700;margin-bottom:4px;font-size:24px}.layer2-tab-container .layer2-tab p{font-size:16px;line-height:24px}.layer2-tab-container .layer2-tab p span{font-weight:700}.layer2-tab-container .layer2-tab img{position:absolute;top:-30px}.layer2-tab .detail{width:134px;height:36px;line-height:34px;text-align:center;color:#c4a887;background-color:#772420;border:1px solid #c4a887;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:18px;-moz-border-radius:18px;border-radius:18px;cursor:pointer;margin-top:10px}.layer2-tab .detail:hover{background-color:#812f29}@-webkit-keyframes float{from{-webkit-transform:translateY(10px);transform:translateY(10px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-moz-keyframes float{from{-moz-transform:translateY(10px);transform:translateY(10px)}to{-moz-transform:translateY(0);transform:translateY(0)}}@-o-keyframes float{from{-o-transform:translateY(10px);transform:translateY(10px)}to{-o-transform:translateY(0);transform:translateY(0)}}@keyframes float{from{-webkit-transform:translateY(10px);-moz-transform:translateY(10px);-o-transform:translateY(10px);transform:translateY(10px)}to{-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}.loading{width:118px;height:119px;position:absolute;left:50%;margin-left:-69px;top:300px;opacity:1;-webkit-transition:opacity 1s;-o-transition:opacity 1s;-moz-transition:opacity 1s;transition:opacity 1s}.loading.active{opacity:0}.loading .loading-bg{width:100%;height:100%;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/loading-bg.png);position:absolute;animation:rotate 4s infinite alternate-reverse}.loading .progress{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#ac7c50}@-webkit-keyframes rotate{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(720deg);transform:rotate(720deg)}}@-moz-keyframes rotate{from{-moz-transform:rotate(0);transform:rotate(0)}to{-moz-transform:rotate(720deg);transform:rotate(720deg)}}@-o-keyframes rotate{from{-o-transform:rotate(0);transform:rotate(0)}to{-o-transform:rotate(720deg);transform:rotate(720deg)}}@keyframes rotate{from{-webkit-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(720deg);-moz-transform:rotate(720deg);-o-transform:rotate(720deg);transform:rotate(720deg)}}.download{width:187px;height:460px;background:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/download.png?v1) no-repeat;position:fixed;right:40px;top:50%;margin-top:-200px;z-index:10}.download a{display:block;width:128px;height:26px;line-height:26px;text-align:center;color:#fff;background-color:#b8924b;-webkit-border-radius:13px;-moz-border-radius:13px;border-radius:13px;margin:380px auto 0 auto}.notice{position:absolute;display:block;width:100%;text-align:center;left:50%;top:130px;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);color:#ac7c50}.slide-title{width:975px;height:53px;background-image:url(https://static.web.sdo.com/xuezu/pic/20190310_newArea/tab_bg.png);-webkit-transform:rotate(-5deg);-moz-transform:rotate(-5deg);-ms-transform:rotate(-5deg);-o-transform:rotate(-5deg);transform:rotate(-5deg);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding-left:50px;position:absolute;top:115px;left:45px}.slide-title div{display:inline-block;width:196px;height:50px;text-align:center;font-size:24px;line-height:50px;color:#472c17;cursor:pointer}.slide-title.tab-1{background-position:0 bottom}.slide-title.tab-1 div:nth-child(1){font-weight:700}.slide-title.tab-2{background-position:0 0}.slide-title.tab-2 div:nth-child(2){font-weight:700}.tab-inner ul li{color:#472c17;margin-bottom:12px;position:relative}.tab-inner{line-height:26px}.tab-inner .num{display:inline-block;width:20px;height:20px;background-color:#5e3a1f;color:#d1c0a5;text-align:center;line-height:20px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;position:absolute;left:-30px;top:2px}.tab-container{position:absolute;left:80px;top:200px;-webkit-transform:rotate(-5deg);-moz-transform:rotate(-5deg);-ms-transform:rotate(-5deg);-o-transform:rotate(-5deg);transform:rotate(-5deg);width:900px}.tab-container .tab-inner{position:absolute;left:0;top:0;visibility:hidden}.tab-container .tab-inner.active{visibility:visible}.tab-container .tab-inner:nth-child(1){width:900px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.tab-container .tab-inner:nth-child(1) ul{width:416px;vertical-align:top}