@charset "UTF-8";body,html{margin:0 auto;max-width:750px}*{box-sizing:border-box;font-family:'PingFang SC','Microsoft Yahei',sans-serif}a:hover{text-decoration:none}a:active,a:focus,a:link{background:0 0;border:none;outline:0;text-decoration:none;-webkit-tap-highlight-color:transparent}.fl{float:left}.nav{font-size:0;border-bottom:1px solid #cecece;padding:.15rem .2rem;padding-bottom:0;background-color:#fff}.nav__item{text-align:center!important;width:20%;display:inline-block;font-size:.28rem;position:relative;padding-bottom:.25rem;color:#222;margin-right:6.6%}.nav__item:last-child{margin-right:0}.nav__item:last-child:after{border-left:none}.nav__item:after{display:inline-block;content:'';vertical-align:middle;width:0rem;height:.25rem;position:absolute;left:auto;right:-.26rem;top:.1rem;bottom:auto;border-left:1px solid #ddd}.nav__item.on,.nav__item.router-link-active.router-link-exact-active{color:#27cdb0;border-bottom:2px solid #27cdb0}.nav__close{float:right;display:block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -1.28rem no-repeat;background-size:6.2rem 23.11rem;width:.28rem;height:.29rem}.section-1{position:relative;background-color:#f3f3f3}.section-1 header{overflow:hidden;position:relative}.section-1 header h2{font-size:.3rem;color:#222;float:left;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;width:100%}.detail-dialog ul li.crowd p,.detail-dialog ul li.target p,.section-1 .art-3 .tea-list .tea .tea-intro dd.unfolded{-webkit-line-clamp:4;display:-webkit-box}.section-1 header h2.short{width:6rem}.section-1 header i{float:right;display:block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem 0rem no-repeat;background-size:6.2rem 23.11rem;width:.12rem;height:.22rem;position:absolute;left:auto;right:0rem;top:auto;bottom:.05rem}.section-1 article{background-color:#fff}.section-1 .art-1{padding:.3rem .2rem;position:relative}.section-1 .art-1 .intro{overflow:hidden;margin:.3rem 0}.section-1 .art-1 .intro li{line-height:.36rem;vertical-align:bottom;color:#787878;font-size:.26rem}.section-1 .art-1 .intro .left{float:left;margin-right:1.3rem;margin-top:.06rem}.section-1 .art-1 .intro .left:before{display:inline-block;content:'';vertical-align:top;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -.99rem no-repeat;background-size:6.2rem 23.11rem;width:.28rem;height:.28rem;margin-right:.1rem}.section-1 .art-1 .intro .right{float:left;position:relative}.section-1 .art-1 .intro .right span{display:inline-block;position:relative;top:.05rem}.section-1 .art-1 .intro .right:before{display:inline-block;content:'';vertical-align:top;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -3.92rem no-repeat;background-size:6.2rem 23.11rem;width:.38rem;height:.37rem;margin-right:.1rem}.section-1 .art-1>a{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -6.81rem no-repeat;background-size:6.2rem 23.11rem;width:1.1rem;height:1.1rem;position:absolute;left:auto;right:.2rem;top:.3rem;bottom:auto}.section-1 .art-1>a.collected{background-position:0 -7.92rem}.section-1 .art-2{padding:.2rem;margin-top:.15rem}.section-1 .art-2 .detail a{display:inline-block;width:100%;height:1.67rem;background:url("/project/b-wliter-wap/2.x/i/detail-bg.png?a61192") center center/7.1rem 1.4rem no-repeat;margin:.25rem 0}.section-1 .art-3{padding:.2rem;margin-top:.15rem}.section-1 .art-3 .tea-list .tea{overflow:hidden;padding:.2rem 0;margin-bottom:.2rem;border-bottom:1px solid #ddd}.section-1 .art-3 .tea-list .tea:last-child{border-bottom:none}.section-1 .art-3 .tea-list .tea .tea-img{border-radius:100%;overflow:hidden;width:1.1rem;height:1.1rem}.section-1 .art-3 .tea-list .tea .tea-img img{width:1.1rem;height:1.1rem}.section-1 .art-3 .tea-list .tea .tea-intro{width:5.8rem;margin-left:.2rem}.section-1 .art-3 .tea-list .tea .tea-intro dt{font-size:.3rem;color:#222;line-height:.5rem;vertical-align:middle;position:relative}.section-1 .art-3 .tea-list .tea .tea-intro dt i{float:right;display:block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -.74rem no-repeat;background-size:6.2rem 23.11rem;width:.22rem;height:.12rem;position:absolute;left:auto;right:0rem;top:auto;bottom:.1rem;transition-duration:.3s;transition-property:all}.section-1 .art-3 .tea-list .tea .tea-intro dt i.unfolded{background-position:0 -.86rem}.section-1 .art-3 .tea-list .tea .tea-intro dd{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;font-size:.22rem;margin-top:.15rem;color:#787878}.detail-dialog ul li p,.detail-dialog ul li.crowd p,.detail-dialog ul li.target p,.section-1 .art-3 .tea-list .tea .tea-intro dd.unfolded,.section-4 .course-list .course .course-intro dt{-webkit-box-orient:vertical;white-space:normal;overflow:hidden}.section-1 .art-3 .tea-list .tea .tea-intro dd.unfolded{background-position:0 -.86rem;text-overflow:inherit;transition-duration:.3s;transition-property:all}.detail-dialog{background-color:#fff;box-shadow:0 0 8px rgba(0,0,0,.1);z-index:999;padding:0 .2rem 1rem;position:absolute;left:auto;right:auto;top:-.91rem;bottom:auto;width:100%;height:120%}.detail-dialog ul{padding:.15rem 0}.detail-dialog ul li{padding-left:.3rem;padding-bottom:.35rem;background:url("/project/b-wliter-wap/2.x/i/nav-line.png?46dd41") 0rem .15rem no-repeat;background-size:.15rem 12.91rem}.detail-dialog ul li.target{background-position:0 -4rem}.detail-dialog ul li.crowd{background-position:0 -8.12rem}.detail-dialog ul li h2{font-size:.28rem;color:#222;padding-bottom:.22rem}.detail-dialog ul li p{font-size:.24rem;color:#787878;line-height:.45rem;display:-webkit-box;-webkit-line-clamp:7;word-break:break-all}.slide-fade-enter-active{transition:all .5s ease}.slide-fade-leave-active{transition:all .5s cubic-bezier(1,.5,.8,1)}.slide-fade-enter,.slide-fade-leave-to{transform:translateY(90px);opacity:1}.section-2{padding:0 .2rem}.section-2 article{padding:.3rem 0}.section-2 ul li{line-height:.6rem;position:relative}.section-2 ul li.root{padding-left:.5rem}.section-2 ul li .index{position:absolute;left:0rem;right:auto;top:auto;bottom:auto;font-size:.3rem;color:#bbb;font-style:normal}.section-2 ul li div a{font-size:.3rem;color:#222}.section-2 ul li div .icon.folded,.section-2 ul li div .icon.unfolded{float:right;display:block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -.74rem no-repeat;background-size:6.2rem 23.11rem;width:.22rem;height:.12rem;transition-duration:.3s;transition-property:all;margin-top:.3rem;margin-right:.05rem}.section-2 ul li div .icon.unfolded{background-position:0 -.86rem}.section-2 ul li div.leaf-node{margin-left:-.18rem}.section-2 ul li div.leaf-node a{display:inline-block;font-size:.26rem;color:#222}.section-2 ul li div.leaf-node a:before{display:inline-block;content:'';vertical-align:middle;width:.42rem;height:.31rem;background:url("/project/b-wliter-wap/2.x/i/play.png?45c122") center center no-repeat;background-size:.41rem .3rem;margin-right:.2rem}.section-2 ul li div.leaf-node a.played,.section-2 ul li div.leaf-node a:visited{color:#aaa}.section-2 ul li div.leaf-node a.played:before,.section-2 ul li div.leaf-node a:visited:before{background:url("/project/b-wliter-wap/2.x/i/played.png?8cb953") center center no-repeat;background-size:.41rem .3rem}.section-2 ul li div.leaf-node a.on{color:#27cdb0}.section-2 ul li div.leaf-node .icon{display:block;float:right;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -2.19rem no-repeat;background-size:6.2rem 23.11rem;width:.3rem;height:.3rem}.section-2 ul li div.leaf-node .icon.added{background-position:0 -1.88rem}.section-2 ul li ul{padding-left:.2rem}.section-3{background-color:#f3f3f3}.section-3 article{background:#fff}.section-3 .note-form{padding:.3rem .2rem;text-align:center}.section-3 .note-form textarea{width:100%;background-color:#f7f6f6;color:#000;border-radius:8px;border:none;outline:0;padding:.1rem;font-size:.28rem}.section-3 .note-form ::-webkit-input-placeholder{font-size:.28rem;color:#aaa}.section-3 .note-form :-moz-placeholder{font-size:.28rem;color:#aaa}.section-3 .note-form ::-moz-placeholder{font-size:.28rem;color:#aaa}.section-3 .note-form a{display:inline-block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -22.21rem no-repeat;background-size:6.2rem 23.11rem;width:6.2rem;height:.9rem;text-align:center;color:#fff;line-height:.9rem;vertical-align:middle;margin-top:.2rem;font-size:.3rem}.section-3 .note-list{margin-top:.15rem}.section-3 .note-list header{border-bottom:1px solid #ddd;padding:.2rem;overflow:hidden}.section-3 .note-list header h2{float:left;color:#222;font-size:.28rem}.section-3 .note-list header a{color:#787878;font-size:.24rem;float:right}.section-3 .note-list ul{padding:0 .2rem}.section-3 .note-list ul li{margin-top:.3rem;border-bottom:1px solid #ddd}.section-3 .note-list ul li .title{font-size:.3rem;color:#222;position:relative}.section-3 .note-list ul li .title i{display:inline-block;content:'';background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -.74rem no-repeat;background-size:6.2rem 23.11rem;width:.22rem;height:.12rem;position:absolute;left:auto;right:0rem;top:auto;bottom:.1rem;transition-duration:.3s;transition-property:all}.section-3 .note-list ul li .title i.unfolded{background-position:0 -.86rem}.section-3 .note-list ul li .intro{position:relative;padding-left:.35rem;margin:.1rem 0 .3rem}.section-3 .note-list ul li .intro span{display:inline-block;margin-right:.15rem;color:#787878;font-size:.24rem}.section-3 .note-list ul li .intro span:first-child{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -1.58rem no-repeat;background-size:6.2rem 23.11rem;width:.3rem;height:.29rem;position:absolute;left:0rem;right:auto;top:.05rem;bottom:auto}.section-3 .note-list ul li .desc{font-size:.26rem;color:#787878;text-indent:.35rem;display:none;transition-duration:.3s;transition-property:all}.section-3 .note-list ul li .desc.unfolded{display:block}.no-login{padding:.8rem .3rem;text-align:center}.no-login span{display:inline-block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -15.02rem no-repeat;background-size:6.2rem 23.11rem;width:3.04rem;height:2.01rem;clear:both}.no-login p{font-size:.28rem;color:#222;margin:20px 0}.no-login a{display:inline-block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -22.21rem no-repeat;background-size:6.2rem 23.11rem;width:6.2rem;height:.9rem;text-align:center;color:#fff;line-height:.9rem;vertical-align:middle;margin-top:.2rem;font-size:.3rem}.section-4 article{padding:.2rem}.section-4 article header{overflow:hidden}.section-4 article header h2{float:left;font-size:.28rem;color:#787878}.section-4 article header h2 span{color:#27cdb0}.section-4 article header .btns{float:right}.section-4 article header .btns a{display:inline-block;margin:.1rem}.section-4 article header .btns .edit{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -3.2rem no-repeat;background-size:6.2rem 23.11rem;width:.34rem;height:.34rem}.section-4 article header .btns .edit.editable{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -2.5rem no-repeat;background-size:6.2rem 23.11rem;width:.32rem;height:.34rem}.section-4 article header .btns .cancel{color:#27cdb0;font-size:.26rem;vertical-align:top}.section-4 article header .btns .my-icon{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -2.85rem no-repeat;background-size:6.2rem 23.11rem;width:.34rem;height:.34rem}.section-4 .no-data{padding:.8rem .3rem;text-align:center}.section-4 .no-data span{display:inline-block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -13.27rem no-repeat;background-size:6.2rem 23.11rem;width:2.55rem;height:1.74rem;clear:both}.section-4 .no-data p{font-size:.28rem;color:#222}.section-4 .edit-ctrl{position:fixed;background-color:#fff;bottom:0;left:0;box-shadow:0 0 8px rgba(0,0,0,.2);width:100%;height:1rem;padding-top:.35rem}.section-4 .edit-ctrl span{vertical-align:top;margin-right:.2rem}.section-4 .edit-ctrl span.check{display:inline-block;width:.36rem;height:.36rem;background:url("/project/b-wliter-wap/2.x/i/no-check.png?cfd696") center center/.36rem .36rem no-repeat;left:0;margin-left:.2rem}.section-4 .edit-ctrl span.check.checked{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -3.55rem no-repeat;background-size:6.2rem 23.11rem;width:.38rem;height:.375rem}.section-4 .edit-ctrl a{display:block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -17.04rem no-repeat;background-size:6.2rem 23.11rem;width:3.1rem;height:1rem;float:right;color:#fff;line-height:1rem;text-align:center;font-size:.3rem;margin-top:-.35rem}.section-4 .course-list.editting .course{position:relative;padding-left:.5rem}.section-4 .course-list.editting .course span{display:block;position:absolute;top:0;bottom:0;margin-top:auto;margin-bottom:auto;width:.36rem;height:.36rem;background:url("/project/b-wliter-wap/2.x/i/no-check.png?cfd696") center center/.36rem .36rem;left:0}.section-4 .course-list.editting .course span.checked{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -3.55rem no-repeat;background-size:6.2rem 23.11rem;width:.38rem;height:.375rem}.section-4 .course-list.editting .course .course-intro{width:3.5rem}.section-4 .course-list .course{overflow:hidden;padding:.2rem 0;margin-bottom:.2rem;border-bottom:1px solid #ddd}.section-4 .course-list .course:last-child{border-bottom:none}.section-4 .course-list .course .course-img,.section-4 .course-list .course .course-img img{width:2.8rem;height:1.77rem}.section-4 .course-list .course .course-intro{width:4.1rem;margin-left:.2rem}.section-4 .course-list .course .course-intro dt{font-size:.3rem;color:#222;line-height:.5rem;vertical-align:middle;display:-webkit-box;-webkit-line-clamp:2}.section-4 .course-list .course .course-intro dt.on{color:#27cdb0}.section-4 .course-list .course .course-intro dd{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;font-size:.26rem;margin-top:.6rem;color:#787878}.section-4 .course-list .course .course-intro dd:before{display:inline-block;content:'';background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -4.91rem no-repeat;background-size:6.2rem 23.11rem;width:.69rem;height:.3rem;position:relative;top:.05rem}.section-4 .bottom-stay{width:100%;height:1rem}#walkthrough-wrapper{left:0rem;right:0rem;top:0rem;bottom:0rem;position:fixed;background:rgba(0,0,0,.6)}#walkthrough-wrapper .walkthrough p{text-align:center;font-size:.3rem;color:#fff;padding-bottom:.4rem;line-height:.4rem}#walkthrough-wrapper .walkthrough div{text-align:center}#walkthrough-wrapper .walkthrough span{display:inline-block;background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -10.6rem no-repeat;background-size:6.2rem 23.11rem;width:1.91rem;height:.9rem}#walkthrough-wrapper #walkthrough-1{margin-top:4.75rem}#walkthrough-wrapper #walkthrough-1 .highlight-icon{background:url("/project/b-wliter-wap/2.x/i/course-sprite.png?e6c438") 0rem -18.05rem no-repeat;background-size:6.2rem 23.11rem;width:4.14rem;height:4.15rem;margin:0 auto}#walkthrough-wrapper #walkthrough-2{margin-top:5rem}#walkthrough-wrapper #walkthrough-2 .highlight-icon{width:100%;height:2.06rem;background:url("/project/b-wliter-wap/2.x/i/lead.png?15d645") right center/3.02rem 2.06rem no-repeat}.p-course-cover{position:relative}.p-course-cover .cover{display:block}.p-course-cover .play{position:absolute;top:50%;left:50%;display:inline-block;margin-top:-.53rem;margin-left:-.53rem;width:.98rem;height:.98rem;background:url("/project/b-wliter-wap/2.x/i/icon-play.png?378af4") center center no-repeat;background-size:100% 100%;border:.06rem solid #fff;border-radius:50%}.videoBox{width:100%;height:4.2rem}.videoBox .videoClass{width:100%;height:100%;background-color:#000}.fixed{position:fixed;top:0;left:0;right:0;z-index:999}.icon-back{position:absolute;top:.2rem;left:.2rem;z-index:99999!important;width:.5rem;height:.5rem;background:url("/project/b-wliter-wap/2.x/i/icon_back.png?17e33d") center center no-repeat;background-size:100% 100%;opacity:.9}.fixed-stay{width:100%;height:.9rem}