/* 20261019-洛克王国-kb Yapi */
@charset "UTF-8";html {line-height:1.15; text-size-adjust:100%;}
html * {-webkit-tap-highlight-color:rgba(0,0,0,0); -moz-box-sizing:border-box; box-sizing:border-box; outline-color:transparent; outline-style:solid;}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,form,button,input,textarea,select,table,th,td,dl,dt,dd,label,figure,figcaption,blockquote {margin:0; padding:0; font-family:inherit; font-size:inherit; line-height:inherit; color:inherit;}
body {font-family:"Microsoft YaHei",Helvetica,Tahoma,sans-serif; font-size:0.24rem; line-height:1.4; overflow-x:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
a {color:#333; text-decoration:none;}
a:hover,a:active {cursor:pointer;}
img {border:none; max-width:100%; height:auto; vertical-align:middle; -webkit-user-select:none; user-select:none; -webkit-user-drag:none;}
ul,ol,li {list-style:none;}
em,i,cite {font-style:normal;}
html {font-size:13.33333vw; font-size:clamp(42.66667px,13.33333vw,100px);}
@media screen and (min-width:751px){
html {font-size:66.6666666667px;}
.headArea {margin-top:-110px !important;}
}
.tac {text-align:center;}
.b {position:relative; width:7.5rem; margin:-1px auto 0; background-repeat:no-repeat; background-size:7.5rem auto; -moz-box-sizing:border-box; box-sizing:border-box; overflow:hidden;}
.b>p {position:absolute; left:50%; transform:translateX(-50%);}
.gray,.grey {-webkit-filter:grayscale(100%); filter:grayscale(100%);}
/* global set*/
.mtxt {font-size:0.2rem; color:#ffd798; margin:1.6rem auto 3rem; text-align:center;}
.mtxt em {color:#f60;}
.btns a {color:#292828; font-size:0.38rem; font-weight:bold;}
.btns {text-align:center; font-size:0;}
.btns a {position:relative; background-image:url(../images/btn-big.png); background-size:100% 100%; display:inline-flex; align-items:center; justify-content:center;}
.hd-btns .btns a {background-image:url(../images/btn-hd.png);}
.hd-btns.col {margin:.1rem .3rem; display:-webkit-flex; display:flex; align-items:center;}
.hd-btns.col .btns a {display:flex; margin:.15rem;}
.hd-tip {font-size:0.18rem; color:#fff; bottom:.1rem; line-height:0.34rem; border-radius:0.16rem; background:rgba(0,0,0,0.5); position:absolute; left:50%; transform:translateX(-50%); padding:0 .15rem; text-align:center;}
.btns.btns7 a {width:2rem; height:.52rem; margin:2.55rem .8rem 0; font-size:.26rem;}
.btns.btns7 a:nth-child(-n+3) {margin:3.55rem .16rem 0;}

/*  bgs  */
.b1 {background-image:url(../images/b_01.jpg); height:1.8rem;}
.b2 {background-image:url(../images/b_02.jpg); height:7rem;}
.b3 {background-image:url(../images/b_03.jpg); padding-bottom:0.5rem;}
.b4 {background-image:url(../images/b_04.jpg); height:6.49rem;}
.b5 {background-image:url(../images/b_05.jpg); height:8.55rem;}
.b6 {background-image:url(../images/b_06.jpg); height:11.25rem;}
.b7 {background-image:url(../images/b_07.jpg); height:7.27rem;}
.b8 {background-image:url(../images/b_08.jpg); height:14.1rem;}
.b9 {background-image:url(../images/b_09.jpg); height:12.09rem;}
.b10 {background-image:url(../images/b_10.jpg); height:10.98rem;}
.b11 {background-image:url(../images/b_11.jpg); height:6.51rem;}
.b12 {background-image:url(../images/b_12.jpg); background-color:#000; padding-bottom:1.6rem; background-repeat:repeat-y;}
.taskList .button {background:url(../images/btn-task.png) no-repeat center/100% 100%;}
.btn-cj,.drawBox .drawBtn {background-image:url(../images/btn-cj.png);}

/* module:b2Side */
.rules,.nums {position:absolute;}
.nums {top:0; right:0; background:rgba(0,0,0,.55); height:.48rem; line-height:.48rem; padding:0 .2rem 0 .24rem; color:#fff; border-radius:.5rem 0 0 .5rem; font-size:.26rem; z-index:3;}
.nums em {color:#fff000;}
.rules {top:.6rem; right:0; z-index:3;}
.rules a {display:block; background:rgba(0,0,0,.55); height:.48rem; line-height:.48rem; padding:0 .2rem 0 .24rem; color:#fff; border-radius:.5rem 0 0 .5rem; font-size:.26rem; margin-bottom:.08rem;}

/* module:b3Btns */
.gameName {color:#333; font-size:.26rem; text-align:center;}

/* module:follow */
.llkModFollow {background:rgba(255,255,255,.7); width:6.86rem; height:1.2rem; margin:.2rem auto 0; border-radius:.3rem; box-shadow:0 .02rem .12rem 0 #999; display:-webkit-flex; display:flex; -webkit-justify-content:space-between; justify-content:space-between; -webkit-align-items:center; align-items:center; padding-left:.1rem; padding-right:.2rem; -moz-box-sizing:border-box; box-sizing:border-box; overflow:hidden;}
.llkModFollow .followImg {-webkit-flex-shrink:0; flex-shrink:0; width:1.02rem; height:.94rem;}
.llkModFollow .followImg img {display:block; width:1.02rem; height:.94rem;}
.llkModFollow .followTxt {-webkit-flex:1; flex:1; min-width:0; display:-webkit-flex; display:flex; -webkit-align-items:center; align-items:center; margin-left:.1rem;}
.llkModFollow .followTxt p {color:#444; font-size:.24rem; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.llkModFollow .followTxt i {display:inline-block; width:.2rem; height:.2rem; margin-left:.1rem; -webkit-flex-shrink:0; flex-shrink:0; border-radius:50%; position:relative;}
.llkModFollow .followTxt i:after {content:"?"; font-size:.18rem; display:flex; align-items:center; justify-content:center; border:1px solid; box-sizing:border-box; border-radius:50%; width:100%; height:100%;}
.llkModFollow .followBtn {background:#23c268; padding:0 .27rem; height:.5rem; line-height:.5rem; -webkit-flex-shrink:0; flex-shrink:0; color:#fff; font-size:.24rem; border-radius:999rem; text-align:center; -webkit-animation:followAnt 2.4s linear infinite; animation:followAnt 2.4s linear infinite;}
.llkModFollow .followBtn.gray {-webkit-animation:none; animation:none;}
@-webkit-keyframes followAnt{0%,100%{-webkit-transform:rotate(0) scale(.9);transform:rotate(0) scale(.9)}
10%{-webkit-transform:rotate(2deg) scale(1);transform:rotate(2deg) scale(1)}
15%,25%,35%{-webkit-transform:rotate(-4deg);transform:rotate(-4deg)}
20%,30%,40%{-webkit-transform:rotate(4deg);transform:rotate(4deg)}
45%{-webkit-transform:rotate(4deg);transform:rotate(4deg)}
50%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}
55%,90%{-webkit-transform:rotate(0);transform:rotate(0)}
}
@keyframes followAnt{
0%,100%{transform:rotate(0) scale(.9)}
10%{transform:rotate(2deg) scale(1)}
15%,25%,35%{transform:rotate(-4deg)}
20%,30%,40%{transform:rotate(4deg)}
45%{transform:rotate(4deg)}
50%{transform:rotate(2deg)}
55%,90%{transform:rotate(0)}
}

/* module:fixMenu */
.fixMenu{color:#fff;}
.fixMenu .fxmInner {position:fixed; left:50%; bottom:0; z-index:20; display:-webkit-flex; display:flex; -webkit-justify-content:center; justify-content:center; -webkit-align-items:flex-start; align-items:flex-start; width:7.5rem; height:1.77rem; padding-top:.6rem; box-sizing:border-box; background:url(../images/fix_menu_bg.png) no-repeat center/100% 100%; transform:translateX(-50%);}
.fixMenu .fxmInner .mask {display:none; position:absolute; top:-.55rem; left:50%; z-index:-3; width:1.4rem; height:.55rem;}
.fixMenu .fxmInner .mask:before {content:""; position:absolute; width:1.4rem; height:1.4rem; background:#f9c8ae; border-radius:9.99rem 9.99rem 0 0;}
.fixMenu .fxmInner .link {display:block; position:relative; width:1.3rem; height:1rem; margin:0 .02rem; text-align:center; -webkit-flex-shrink:0; flex-shrink:0;}
.fixMenu .fxmInner .link img {display:block; width:.56rem; height:.56rem; margin:.07rem auto 0; object-fit:contain;}
.fixMenu .fxmInner .link em {display:block; height:.32rem; line-height:.34rem; margin-top:.08rem; font-size:.2rem; color:#fff; text-align:center;}
.fixMenu .fxmInner .link p {background:#ffec9f; color:#255cbd; border:1px solid #d67829; font-size:.18rem; position:absolute; top:-.1rem; left:50%; margin-left:.1rem; padding:0 .12rem; height:.3rem; line-height:.28rem; border-radius:.25rem .25rem .25rem .02rem; white-space:nowrap;}
.fixMenu .fxmInner .link:nth-child(2) {z-index:3;}
.fixMenu .fxmInner .reservabtn {display:block; position:relative; width:1.74rem; margin:-.5rem .05rem 0; z-index:3; text-align:center;}
.fixMenu .fxmInner .reservabtn .item {padding-bottom:.1rem; display:flex; justify-content:center; align-items:center; flex-direction:column; position:relative; width:1.16rem; height:1.16rem; margin:0 auto 0; padding-right:.03rem; box-sizing:border-box; background:url(../images/fix_menu_yy.png) no-repeat center/100% 100%;}
.fixMenu .fxmInner .reservabtn .item i {display:block; width:.44rem; height:.56rem; margin:.1rem auto 0; background:url(../images/fix_btn.png) no-repeat center/.37rem .41rem; -webkit-transform-origin:50% 20%; transform-origin:50% 20%; -webkit-animation:shake 2.4s linear infinite; animation:shake 2.4s linear infinite;}
.fixMenu .fxmInner .reservabtn .item em {display:block; height:.28rem; line-height:.28rem; font-size:.22rem; font-weight:bold; text-align:center;}
.fixMenu .fxmInner .reservabtn .item:before,.fixMenu .fxmInner .reservabtn .item:after {content:""; position:absolute; left:50%; border-radius:999rem; display:none;}
.fixMenu .fxmInner .reservabtn .item:before {top:.1rem; width:1rem; height:1rem; margin-left:-.5rem; background:#bd6d31; z-index:-1;}
.fixMenu .fxmInner .reservabtn .item:after {top:0; width:1.2rem; height:1.2rem; margin-left:-.6rem; background:#d19358; z-index:-2;}
.fixMenu .fxmInner .reservabtn .text {display:block; height:.28rem; line-height:.3rem; font-size:.2rem; color:#fff; text-align:center;}
.fixMenu .fxmInner .done .item {-webkit-filter:grayscale(1); filter:grayscale(1);}
.fixMenu .fxmInner .done .item i {-webkit-animation:none; animation:none;}
@-webkit-keyframes shake{0%,100%{-webkit-transform:rotate(0) scale(.9);transform:rotate(0) scale(.9)}
10%{-webkit-transform:rotate(2deg) scale(1);transform:rotate(2deg) scale(1)}
15%,25%,35%{-webkit-transform:rotate(-4deg);transform:rotate(-4deg)}
20%,30%,40%{-webkit-transform:rotate(4deg);transform:rotate(4deg)}
45%{-webkit-transform:rotate(4deg);transform:rotate(4deg)}
50%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}
55%,90%{-webkit-transform:rotate(0);transform:rotate(0)}
}
@keyframes shake{
0%,100%{transform:rotate(0) scale(.9)}
10%{transform:rotate(2deg) scale(1)}
15%,25%,35%{transform:rotate(-4deg)}
20%,30%,40%{transform:rotate(4deg)}
45%{transform:rotate(4deg)}
50%{transform:rotate(2deg)}
55%,90%{transform:rotate(0)}
}

/* module:kbside */
.kb-mod-fixMenu{position:fixed;right:0.18rem;bottom:2rem;z-index:100;-webkit-transition:all 0.8s;transition:all 0.8s}
.kb-mod-fixMenu.fold {right:-1.5rem;}
.kb-mod-fixMenu li {margin-top:0.16rem;}
.kb-mod-fixMenu a {font-size:0.18rem; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-flow:column; flex-flow:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; width:0.96rem; height:0.96rem; -webkit-box-sizing:border-box; box-sizing:border-box; border-radius:0.2rem; border:1px solid #FFF; background:rgba(255,255,255,0.8); -webkit-box-shadow:0 0.04rem 0.08rem 0 rgba(45,39,39,0.25); box-shadow:0 0.04rem 0.08rem 0 rgba(45,39,39,0.25); backdrop-filter:blur(0.04rem); position:relative;}
.kb-mod-fixMenu a:first-child {margin-top:0;}
.kb-mod-fixMenu .toTop {display:none;}
.kb-mod-fixMenu i {display:block; width:0.48rem; height:0.48rem; margin-top:0.04rem; background-repeat:no-repeat; background-size:100% 100%;}
.kb-mod-fixMenu i.i5 {background-image:url(../images/ico-top.png);}

/* module:video */
.vidPlayLoop {width:6.56rem; height:3.56rem; margin:0 auto; border-radius:.1rem; overflow:hidden; position:relative;}
.vidPlayLoop .video-loop-info {width:100%; height:100%; position:relative; overflow:hidden;}
.vidPlayLoop .video-loop-info video {width:100%; height:100%; -o-object-fit:cover; object-fit:cover;}
.vidPlayLoop .video-loop-info:first-child:before {content:""; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.7); z-index:2;}
.vidPlayLoop .video-loop-info i {position:absolute; left:50%; top:50%; width:1.66rem; height:1.66rem; transform:translate(-50%,-50%); z-index:3; background:url(../images/video-icon.png) no-repeat center/100% 100%; cursor:pointer;}
.vidPlayLoop .video-loop-info img {display:block; width:100%; height:100%; -o-object-fit:cover; object-fit:cover;}

/* module:draw */
.cj-btn a {background-image:url(../images/btn-cj.png);}
.cj-btn,.cj-nums {position:absolute; left:50%; transform:translateX(-50%); bottom:1rem;}
.cj-nums {top:auto; bottom:.1rem;}
.cj-nums {font-size:.24rem; color:#fff; text-align:center;}
.cj-nums em {color:#f60;}
.cj-record {color:#fff; font-size:0.24rem; right:0; bottom:1rem; position:absolute; text-decoration:underline;}

/* module:taskList */
.taskList {margin:0 auto;}
.taskList li {margin:0 auto .2rem;padding: .1rem .35rem 0 .25rem;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:space-between;justify-content:space-between;background:url(../images/bg-li.png) no-repeat center/100% 100%;position:relative;-moz-box-sizing:border-box;box-sizing:border-box;}
.taskList dl {-webkit-flex:1;flex:1;min-width:0;padding-right: .1rem;}
.taskList dt {color:#222;font-size: 0.255rem;font-weight:bold;overflow:hidden;display:flex;align-items:center;}
.taskList dt .whao {margin-left:.05rem;width:.24rem;height:.24rem;border-radius:50%;vertical-align: middle;}
.taskList dt .whao:after {content:"?"; font-size:.18rem; font-weight:bold; border-radius:50%; border:1px solid; display:flex; align-items:center; justify-content:center; width:100%; height:100%;}
.taskList dd {color:#1a8f7a;}
.taskList .taskRgt {-webkit-flex-shrink:0; flex-shrink:0; margin-left:.2rem; position:relative;}
.taskList .button {font-size:.26rem; font-weight:bold; color:#fff; display:-webkit-inline-flex; display:inline-flex; -webkit-align-items:center; align-items:center; -webkit-justify-content:center; justify-content:center; background:url(../images/btn-task.png) no-repeat center/100% 100%;}
.taskList .taskRgt .rgtTip {background:#f60; height:.28rem; line-height:.28rem; color:#fff; text-align:center; font-size:.2rem; padding:0 .1rem; position:absolute; top:-.27rem; right:0; z-index:3; border-radius:.08rem;}
.taskList .taskRgt .rgtTip:before {background:#f60; width:.1rem; height:.1rem; position:absolute; right:.2rem; transform:rotateZ(45deg); bottom:-.04rem; content:""; z-index:1;}

/* module:swiper */
.swpBanner {margin:0 auto; position:relative; overflow:hidden;}
.swpBanner .swiper-slide {display:-webkit-flex; display:flex; -webkit-align-items:center; align-items:center; -webkit-justify-content:center; justify-content:center;}
.swpBanner img {display:block; margin:0 auto; -o-object-fit:cover; object-fit:cover; width:100%; height:100%;}
.swpBanner .lb-dots {width:100%; bottom:.2rem;}
.swpBanner .lb-dots span {width:.3rem; height:.04rem; background-color:#fff; opacity:1; border-radius:.1rem; margin:0 .03rem;}
.swpBanner .lb-dots .swiper-pagination-bullet-active {background-color:#b20c0d;}

/*  btns  */
.btns a {width:2.75rem; height:0.82rem;}
.hd-btns .btns a {width:2.96rem; height:0.88rem;}
.hd-sides a {width:0.48rem; height:1.39rem;}
.taskList .button {width:1.61rem; height:0.53rem;}
.cj-btn a {width:3.42rem; height:1.06rem;}
.vidPlayLoop {width:6.14rem; height:3.54rem;}
.vidPlayLoop .video-loop-info i {width:1.06rem; height:1.07rem;}
.fixMenu .fxmInner {width:7.5rem; height:2.01rem;}
.fixMenu .fxmInner .reservabtn .item {width:1.38rem; height:1.39rem;}

/* swpBanner size */
.swpBanner {width:16rem; height:9.6rem;}

/* studio-edit */
.b3 .hd-btns .gameName {color:#ffffff; margin:0rem 0rem 0.85rem;}
.b3 .hd-btns .btns a {margin:0rem 0.2rem 0.13rem;}
.b4 .vidPlayLoop {top:1.55rem;}
.b5 .btns.btns2 a {margin:6.2rem 0.2rem;}
.b2 .hd-tip {bottom:3.3rem;}
.task-list .item {height:1.06rem; padding:0rem 0.35rem; margin:0rem auto; width:6.2rem;}
.b13 .ruleArea dl dd {font-size:0.24rem;}
.b7 .task-list .item dl dd {color:#; font-size:0.21rem;}

.b8 .vidPlayLoop {top:1.75rem;}
.b12 .kb-footer .kbFootWrap .type1 .kbFootAbout .m-inner {padding:0rem 0.12rem 0.48rem;}
.fixMenu .fxmInner .link p {color:#333333;}
.b7 .taskList li {width:6.5rem;margin: 0.1rem auto 0rem;height:0.95rem;}
.b11 .swpBanner {width:6.4rem; height:3.6rem; top:1.3rem;}
.b7 .taskList li .taskRgt .button {color:#353535; font-size:0.24rem;}
.b7 .task-list .item dl dt {font-size:0.3rem;}
.b7 .taskList li dl dd {color:#353535;};}
.b7 .taskList li dl dt {font-size:0.28rem;}
.b7 .taskList {width:6.3rem; margin:0.12rem 0.6rem;}
.b7 .cj-record {display:block; font-size:0; background:url(../images/btn-record.png) no-repeat center center/100% 100%; left:3rem; width:2rem; height:0.44rem;}
.b6 .cj-nums {font-size:0.3rem; bottom:0.15rem;}
.b6 .btns a {top:0.15rem;}
.b12 .kb-footer .kbFootWrap .type1 {margin:0rem;}