@charset "UTF-8";.thom_picture{background-image:url(/image/thom.jpg)}.jonny_picture{background-image:url(/image/jonny.jpg)}.colin_picture{background-image:url(/image/colin.jpg)}.phil_picture{background-image:url(/image/phil.jpg)}html{height:100%}body{min-height:100%}body div.hex-teaching-courseLine{min-height:100%;padding-top:50px;padding-bottom:110px}body div.hex-teaching-courseLine>.nav{height:40px}body div.hex-teaching-courseLine>.nav>a{display:block;margin:6px 5px 2px;padding:0 10px;float:left;border-radius:5px;line-height:30px;font-size:14px;background-color:#4A90E2;color:#FFF}body div.hex-teaching-courseLine>.nav>div.breadcrumb{margin-left:20px;float:left;padding:5px 0;line-height:30px}body div.hex-teaching-courseLine>.nav>div.breadcrumb span,body div.hex-teaching-courseLine>.nav>div.breadcrumb>a{line-height:30px}body div.hex-teaching-courseLine>.list{overflow:hidden}body div.hex-teaching-courseLine>.list>div.empty{float:left;width:100%;height:100px;position:relative;margin:20px 0 10px}body div.hex-teaching-courseLine>.list>div.empty>i{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:block;width:100px;height:100px;background-position:center;background-size:contain;background-repeat:no-repeat}body div.hex-teaching-courseLine>.list>div.splitLine{margin:10px 0;width:100%;height:0;float:left}body div.hex-teaching-courseLine>.list>.title{display:-webkit-box;display:flex;width:100%;height:30px;position:relative}body div.hex-teaching-courseLine>.list>.title>div{display:-webkit-box;display:flex;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}body div.hex-teaching-courseLine>.list>.title>div>i{display:block;width:4px;height:4px;border-radius:50%;margin:13px 6px 0}body div.hex-teaching-courseLine>.list>.title>div>span{line-height:30px}body div.hex-teaching-courseLine>.list .onlineLesson,body div.hex-teaching-courseLine>.list>a{display:block;border-radius:3px;width:calc(16.6% - 20px);height:160px;margin:10px;float:left;position:relative}body div.hex-teaching-courseLine>.list .onlineLesson.offline,body div.hex-teaching-courseLine>.list>a.offline{opacity:.6}body div.hex-teaching-courseLine>.list .onlineLesson.catalog,body div.hex-teaching-courseLine>.list>a.catalog{background-position:bottom;background-repeat:no-repeat}body div.hex-teaching-courseLine>.list .onlineLesson:not(.catalog),body div.hex-teaching-courseLine>.list>a:not(.catalog){background-position:right 10px top 10px;background-repeat:no-repeat;background-size:38px auto}@media (max-width:1450px){body div.hex-teaching-courseLine>.list .onlineLesson,body div.hex-teaching-courseLine>.list>a{width:calc(20% - 20px)}}@media (max-width:1225px){body div.hex-teaching-courseLine>.list .onlineLesson,body div.hex-teaching-courseLine>.list>a{width:calc(25% - 20px)}}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag,body div.hex-teaching-courseLine>.list>a>i.tag{display:block;width:25px;height:25px;border-radius:3px;position:absolute;top:16px;right:13px;text-align:center}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.class,body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.course,body div.hex-teaching-courseLine>.list>a>i.tag.class,body div.hex-teaching-courseLine>.list>a>i.tag.course{display:none}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag::before,body div.hex-teaching-courseLine>.list>a>i.tag::before{line-height:25px;font-size:14px;color:#15B0B7}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.course::before,body div.hex-teaching-courseLine>.list>a>i.tag.course::before{content:'课'}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.class::before,body div.hex-teaching-courseLine>.list>a>i.tag.class::before{content:'班'}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.tier::before,body div.hex-teaching-courseLine>.list>a>i.tag.tier::before{content:'层'}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.personal::before,body div.hex-teaching-courseLine>.list>a>i.tag.personal::before{content:'靶'}body div.hex-teaching-courseLine>.list .onlineLesson>i.tag.media::before,body div.hex-teaching-courseLine>.list>a>i.tag.media::before{content:'媒'}body div.hex-teaching-courseLine>.list .onlineLesson>div,body div.hex-teaching-courseLine>.list>a>div{height:100%;width:100%;border-radius:4px;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.title,body div.hex-teaching-courseLine>.list>a>div>div.title{-webkit-box-flex:1;flex:1;overflow:hidden;position:relative}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.title>div>*,body div.hex-teaching-courseLine>.list>a>div>div.title>div>*{display:block;width:calc(100% - 20px);position:absolute;left:11px}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.title>div>strong,body div.hex-teaching-courseLine>.list>a>div>div.title>div>strong{top:48px;font-size:14px;font-weight:400}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.title>div>span,body div.hex-teaching-courseLine>.list>a>div>div.title>div>span{top:66px;font-size:18px;word-break:break-word;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.progressBar,body div.hex-teaching-courseLine>.list>a>div>div.progressBar{position:absolute;left:10px;top:10px;width:54px;height:24px;padding:0}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.progressBar>span,body div.hex-teaching-courseLine>.list>a>div>div.progressBar>span{display:block;border-radius:3px;border:1px solid #676767;height:100%;position:relative}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.progressBar>span>i,body div.hex-teaching-courseLine>.list>a>div>div.progressBar>span>i{display:block;height:100%;overflow:hidden;position:relative;z-index:2}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.progressBar>span>i>span,body div.hex-teaching-courseLine>.list>a>div>div.progressBar>span>i>span{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);position:absolute;left:0;top:50%;width:52px;font-size:14px;text-align:center}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.progressBar>span>span,body div.hex-teaching-courseLine>.list>a>div>div.progressBar>span>span{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:52px;font-size:14px;text-align:center;z-index:1}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.child,body div.hex-teaching-courseLine>.list>a>div>div.child{height:44px;display:-webkit-box;display:flex;padding:5px}body div.hex-teaching-courseLine>.list .onlineLesson>div>div.child>span,body div.hex-teaching-courseLine>.list>a>div>div.child>span{line-height:25px;font-size:14px;-webkit-box-flex:1;flex:1;text-align:center;margin:5px;border-radius:3px}body div.hex-teaching-courseLine>.list .onlineLesson.book>div>div.title>div>strong,body div.hex-teaching-courseLine>.list>a.book>div>div.title>div>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body div.hex-teaching-courseLine>.list .onlineLesson{animation:leftEaseInAnimate 1s ease 1;-webkit-animation:leftEaseInAnimate 1s ease 1;animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards}body div.hex-teaching-courseLine>.list .onlineLesson .online{position:relative;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;padding:0 10px;color:#D8D8D8}body div.hex-teaching-courseLine>.list .onlineLesson .online i{position:absolute;top:20px;right:20px;display:block;width:56px;height:24px;background-image:url(../../../../image/courseLie_dark/live.svg);background-repeat:no-repeat;background-size:cover}body div.hex-teaching-courseLine>.list .onlineLesson .online .onlineTitle{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:95%;margin-top:30px;font-size:18px;font-weight:700}body div.hex-teaching-courseLine>.list .onlineLesson .online .onlineDes{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:95%;display:block;margin-top:10px}body div.hex-teaching-courseLine>.list .onlineLesson .online .onlineTime{font-size:14px;margin-top:35px}body div.hex-teaching-courseLine>.list .onlineLesson .online .onlineBtn{position:absolute;right:10px;bottom:18px;width:108px;height:34px;text-align:center;line-height:34px;background-color:#4A90E2;border-radius:17px;font-size:14px}body div.hex-teaching-courseLine>.list .onlineLesson .relation{position:relative;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;padding:0 10px;color:#D8D8D8}body div.hex-teaching-courseLine>.list .onlineLesson .relation i{position:absolute;top:20px;right:20px;display:block;width:56px;height:24px;background-image:url(../../../../image/courseLie_dark/live.svg);background-repeat:no-repeat;background-size:cover}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationTitle{width:95%;margin-top:30px;font-size:14px}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationTopic{width:95%;margin-top:5px;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationDes{display:block;margin-top:8px;font-size:14px}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationBtn{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-pack:end;justify-content:flex-end;-webkit-box-align:center;align-items:center;margin-top:7px}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationBtn div{font-size:14px}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationBtn .jump{margin-right:30px}body div.hex-teaching-courseLine>.list .onlineLesson .relation .relationBtn .determine{height:34px;line-height:34px;text-align:center;background-color:#4A90E2;border-radius:17px;padding:0 10px}body div.hex-teaching-courseLine>.list>strong{text-align:center;font-size:40px;display:block;margin:0 auto;padding:100px 0 0}body>div.modals>div{position:fixed;width:100%;height:100%;left:0;top:0;z-index:7}body>div.modals>div>div{width:986px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:fixed;border-radius:6px;padding:10px;background-color:#4A90E2;-webkit-transition:all .5s ease-out;transition:all .5s ease-out}body>div.modals>div>div>div.loading{width:100%;height:400px;background-color:#FFF;border-radius:6px;background-image:url(../../../image/loading_blue.gif);background-size:100px auto;background-position:center;background-repeat:no-repeat}body>div.modals>div>div>div:not(.loading){border-radius:6px;overflow:auto;background-color:#FFF}body>div.modals>div>div>div:not(.loading):nth-of-type(2){margin-top:10px}body>div.modals>div>div>div:not(.loading).true>div.list>span{background-color:#6fd855}body>div.modals>div>div>div:not(.loading).true>div.list>span>span{color:#FFF}body>div.modals>div>div>div:not(.loading).wrong>div.list>span>span{color:#E43333}body>div.modals>div>div>div:not(.loading)>div.list{display:-webkit-box;display:flex}body>div.modals>div>div>div:not(.loading)>div.list>span{width:70px;position:relative}body>div.modals>div>div>div:not(.loading)>div.list>span>span{width:100%;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-size:28px;text-align:center}body>div.modals>div>div>div:not(.loading)>div.list>div{-webkit-box-flex:1;flex:1;max-height:300px;overflow-x:hidden;overflow-y:auto}body>div.modals>div>div>div:not(.loading)>div.list>div>span{display:block;float:left;width:calc(20% - 14px);height:44px;line-height:44px;background-color:#4A90E2;color:#FFF;font-size:32px;margin:7px;text-align:center;border-radius:6px}body>div.tip-popup-warp{display:none;height:284px;width:544px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:fixed;padding:10px;background-color:#CDCDCD;border-radius:6px}body>div.tip-popup-warp>div.tip-popup{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-align:center;align-items:center;justify-content:space-around;height:100%;padding:0 40px;background-color:#FFF;border-radius:6px}body>div.tip-popup-warp>div.tip-popup>.popup-title{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between;-webkit-box-align:center;align-items:center}body>div.tip-popup-warp>div.tip-popup>.popup-title>.title-left,body>div.tip-popup-warp>div.tip-popup>.popup-title>.title-right{height:1px;width:148px;background-color:#E2E2E2}body>div.tip-popup-warp>div.tip-popup>.popup-title>.title-center{font-size:18px;font-weight:700;color:#333;margin:0 50px;white-space:nowrap}body>div.tip-popup-warp>div.tip-popup>.popup-content{font-size:16px;color:#333;margin-bottom:60px}body>div.tip-popup-warp>div.tip-popup>.popup-footer>a{display:block;height:40px;width:120px;border-radius:6px;line-height:40px;text-align:center;font-size:16px;background-color:#4A90E2;color:#fff}@keyframes leftEaseInAnimate{0%{-webkit-transform:translateX(-2000px);transform:translateX(-2000px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@-webkit-keyframes leftEaseInAnimate{0%{-webkit-transform:translateX(-2000px);transform:translateX(-2000px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade1-enter-active,.fade1-leave-active{-webkit-transition:opacity .5s;transition:opacity .5s}.fade1-enter,.fade1-leave-to{opacity:0}.slide-fade1-enter-active{-webkit-transition:all .5s ease;transition:all .5s ease}.slide-fade1-leave-active{-webkit-transition:all .5s cubic-bezier(1,.5,.8,1);transition:all .5s cubic-bezier(1,.5,.8,1)}.slide-fade1-enter,.slide-fade1-leave-to{-webkit-transform:translateX(10px);transform:translateX(10px);opacity:0}.fade2-enter-active,.fade2-leave-active{-webkit-transition:opacity .5s;transition:opacity .5s}.fade2-enter,.fade2-leave-to{opacity:0}.slide-fade2-enter-active{-webkit-transition:all .5s ease;transition:all .5s ease}.slide-fade2-leave-active{-webkit-transition:all .5s cubic-bezier(1,.5,.8,1);transition:all .5s cubic-bezier(1,.5,.8,1)}.slide-fade2-enter,.slide-fade2-leave-to{-webkit-transform:translateX(10px);transform:translateX(10px);opacity:0}