.banner{padding-top:25px}
.banner .area{position:relative}

.menuContent,.menuwrap{height:382px}
.menuwrap{background-color:rgba(7,17,27,.5);opacity:.502;position:absolute;left:0;top:0;width:216px;height:382px;z-index:1}
.submenu{height:382px;background:#fff;position:absolute;left:216px;top:0;width:768px;z-index:581;box-shadow:0 4px 8px 0 rgba(0,0,0,.1);box-sizing:border-box}
.hide{display:none}
.submenu .innerBox{background-color:#fff;padding:26px 36px 32px;position:relative;min-height:150px}
.submenu .innerBox .bkimg{position:absolute;bottom:0;right:-1px}
.submenu{background:#fff;position:absolute;left:216px;top:0;width:768px;height:382px;z-index:581;box-shadow:0 4px 8px 0 rgba(0,0,0,.1);box-sizing:border-box}
.submenu .subinnerBox{overflow:hidden;box-sizing:border-box}
.submenu .banner-line{line-height:22px;margin-bottom:12px}
.submenu .banner-line span{font-size:14px;color:#1c1f21;letter-spacing:0;line-height:22px;font-weight:700}
.submenu .tag-box{font-size:0}
.submenu .tag-box a{margin-bottom:16px;font-size:14px;line-height:22px;margin-right:24px;display:inline-block}
.submenu .tag-box a:last-child{margin-right:0}
.submenu .subinnerBox .title{color:#07111b;font-size:16px;line-height:16px;margin-top:32px;font-weight:700;margin-bottom:13px}
.submenu .subinnerBox .recommend{margin-top:33px;margin-bottom:16px}
.submenu a:hover{color:#f01414!important}
.submenu .subinnerBox .title a:hover{color:#f01414}
.recomment-box{position:absolute;bottom:0;background:#f8fafc;padding:27px 0 0 36px}
.recomment-box a{display:block;width:100%;height:100%}
.recomment-box .webfullstack-box{width:312px;height:64px;background-color:#ccc;border-radius:4px;margin-right:48px}
.recomment-box .banner-course-card{width:312px;margin-right:48px;margin-bottom:27px}
.recomment-box .banner-course-card img{width:70px;height:52px;border-radius:4px;background-color:#ccc}
.recomment-box .banner-course-card .course-card{margin-left:16px}
.recomment-box .banner-course-card .course-card-name{width:226px;font-size:12px;color:#07111b;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recomment-box .banner-course-card .course-card-info,.recomment-box .banner-course-card .course-card-price{font-size:12px;color:#545c63;line-height:18px}
.recomment-box .banner-course-card .course-card-info span{margin-right:12px}
.recomment-box .banner-course-card .course-card-price.sales{color:#f01414}
.recomment-box .banner-course-card .course-card-price.studentsales .sales-tip{padding:0;border:0}
.menuContent .item .box a:hover{color:#f01414!important}
.menuContent .item{height:50px;line-height:50px;font-size:12px;cursor:pointer;padding-left:12px;position:relative}
.menuContent .item>a{display:block;color:rgba(255,255,255,.6);padding:0 16px;border-top-left-radius:4px;border-bottom-left-radius:4px;height:50px;transition:all .1s;text-decoration:none}
.menuContent .item i{position:absolute;right:8px;top:16px;color:rgba(255,255,255,.5);font-size:16px}
.menuContent .item .box a{color:#fff!important}
.menuContent .js-menu-item-on a{color:#fff;background-color:rgba(255,255,255,.3)}
.menuContent{position:relative;float:left;width:216px;height:382px;z-index:2;padding-top:17px;box-sizing:border-box;background:#2581bd;border-bottom-left-radius:4px;font-weight:400}
.menuContent .item .box a:hover{color:#f01414!important}
.menuContent .item{height:50px;line-height:50px;font-size:12px;cursor:pointer;padding-left:12px;position:relative}
.menuContent .item i{position:absolute;right:8px;top:16px;color:rgba(255,255,255,.5);font-size:16px}
.menuContent .item .box a{color:#fff!important}
.banner-box{padding-top:32px}
.g-banner{height:382px;margin:auto;margin-bottom:44px;background-color:#93999f;box-shadow:0 12px 24px 0 rgba(7,17,27,.2);position:relative;overflow:hidden;width:1152px;border-radius:8px}
.g-banner .g-banner-content .g-banner-box{height:382px}
.g-banner .banner-slide{height:382px}
.g-banner .g-banner-content{position:relative;float:left;width:936px}
.g-banner .g-banner-content .g-banner-box{position:relative;height:316px}
.g-banner .g-banner-content .notice{position:absolute;top:8px;left:0;background:#f90;box-shadow:0 2px 4px 0 rgba(7,17,27,.2);padding:6px 12px 6px 8px;z-index:1;border-top-right-radius:20px;border-bottom-right-radius:20px}
.g-banner .g-banner-content .notice .imv2-vol_up{font-size:16px;color:#fff;display:inline-block;line-height:20px;margin-top:1px;margin-right:4px;vertical-align:sub}
.g-banner .g-banner-content .notice .notice-txt{display:inline-block;width:auto;font-size:12px;color:#fff;line-height:20px;z-index:1;white-space:nowrap}
.g-banner .g-banner-content .notice .notice-close{font-size:16px;margin:6px 0 6px 12px;color:rgba(255,255,255,.6);line-height:20px}
.g-banner .g-banner-content .notice .notice-close:hover{color:#fff}
.g-banner .g-banner-content .notice.closed{transition:all .3s;background:rgba(255,153,0,.6);box-shadow:0 2px 4px 0 rgba(7,17,27,.2)}
.g-banner .g-banner-content .notice.closed .notice-txt{overflow:hidden}
.g-banner .g-banner-content .notice.closed .notice-close{display:none}
.g-banner .banner-anchor{position:absolute;top:50%;margin-top:-24px;width:48px;height:48px;overflow:hidden;line-height:48px;background:rgba(28,31,33,.1);border-radius:50%;font-size:32px;color:#fff;text-align:center}
.g-banner .next{right:16px}
.g-banner .prev{left:16px}
.g-banner .next:hover,.g-banner .prev:hover{background:rgba(28,31,33,.5)}
.g-banner .g-banner-box>a:first-child .banner-slide{display:block}
.g-banner .banner-slide{position:absolute;display:none;width:936px;height:316px;left:0;right:0;top:0;bottom:0;background-repeat:no-repeat;background-position:center 0}
.g-banner .banner-slide .festival{position:absolute;top:450px;right:75px}
.g-banner .banner-slide .festival a{display:block;width:190px;height:120px;background:url(../img/index/festival.png) no-repeat 0 -120px}
.g-banner .banner-slide .festival a:hover{background-position:0 0}
.g-banner .banner-slide img{width:100%;height:100%}
.g-banner .inner{position:relative;width:1200px;margin:0 auto}
.g-banner .banner-dots{position:absolute;bottom:20px;left:0;right:0;text-align:right;padding-right:24px;line-height:12px}
.g-banner .banner-dots span{display:inline-block;width:8px;height:8px;border-radius:4px;margin-left:8px;background:rgba(255,255,255,.75);transition:transform .2s;cursor:pointer}
.g-banner .banner-dots span.active{width:20px}
.g-banner .banner-slide{height:382px}
.container-types.container-recommend{padding-top:0;padding-bottom:44px}
.container-types{width:1152px;margin-left:auto;margin-right:auto;position:relative;padding:36px 0 38px}
.container-types .types-title{position:relative;font-size:24px;color:#1c1f21;letter-spacing:0;line-height:32px}
.container-types .types-title span{float:left;font-weight:700}
.container-types .types-title{position:relative;font-size:24px;color:#1c1f21;letter-spacing:0;line-height:32px}
.container-types .types-title .intro{margin-top:6px;margin-left:12px;font-weight:400;font-size:14px;color:#545c63;line-height:20px}
.container-types .types-title span{float:left;font-weight:700}
.path-list{margin-top:24px}
.path-list i{float:left;width:50px;height:50px;margin-left:12px;margin-right:10px}
.path-list .i-web{background-position:center 0}
.path-list .i-java{background-position:center -50px}
.path-list .i-android{background-position:center -150px}
.path-list .i-php{background-position:center -200px}
.path-list .i-python{background-position:center -100px}
.path-list .i-fullstack{background-position:center -200px}
.path-list>a{float:left;margin-left:18px;font-size:0;display:block;width:216px;padding-top:15px;height:65px;overflow:hidden;transition:all .3s;background:#f3f5f6;border-radius:8px;text-decoration:none}
.path-list>a:hover{box-shadow:0 4px 8px #0000001f}
.path-list>a:first-child{margin-left:0}
.path-list .tit{font-size:16px;font-weight:700;color:#1c1f21;letter-spacing:1px;margin-top:4px}
.path-list .desc{font-size:12px;color:#1c1f21;line-height:16px;margin-top:2px;font-weight:400}
.menuContent .item .group{font-size:14px}
.recomment-box{position:absolute;bottom:0;background:#f8fafc;padding:27px 0 0 36px}
.recomment-box a{display:block;width:100%;height:100%}
.recomment-box .webfullstack-box{width:312px;height:64px;background-color:#ccc;border-radius:4px;margin-right:48px}
.recomment-box .banner-course-card{width:312px;margin-right:48px;margin-bottom:27px}
.recomment-box .banner-course-card img{width:70px;height:52px;border-radius:4px;background-color:#ccc}
.recomment-box .banner-course-card .course-card{margin-left:16px}
.recomment-box .banner-course-card .course-card-name{width:226px;font-size:12px;color:#07111b;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recomment-box .banner-course-card .course-card-info,.recomment-box .banner-course-card .course-card-price{font-size:12px;color:#545c63;line-height:18px}
.recomment-box .banner-course-card .course-card-info span{margin-right:12px}
.recomment-box .banner-course-card .course-card-price.sales{color:#f01414}
.recomment-box .banner-course-card .course-card-price.studentsales .sales-tip{padding:0;border:0}
.course-card-container .cost-price{margin-left:5px;color:#4d555d;text-decoration:line-through}
.course-card-container .sales-tip1{color:#fff!important;background:#ff6d00!important}
.l{float:left}
.swiper-slide img{width:936px;height:382px}
.news{padding-bottom:15px}
.news .area{width:1172px;margin-top:15px}
.news a{text-decoration:none}
.news ul{float:left;width:273px;padding:0 10px}
.news ul li{margin:5px 0}
.news span{display:block;width:205px;text-align:left;font-size:14px;color:#7c7c7c;padding-left:10px;padding-right:46px;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.news span:before{content:"";display:block;width:3px;height:3px;background:#7c7c7c;position:absolute;top:8px;left:0;border-radius:3px}
.news span label{position:absolute;right:0;font-size:12px;-webkit-transform-origin-x:0;-webkit-transform:scale(.9)}
.news h3{font-size:18px;color:#2c2c2c;font-weight:700;display:block;padding-left:15px;line-height:15px;border-left:3px solid #0090f5;padding-bottom:10px;border-bottom:1px solid #efefef;margin-bottom:10px}
.course-cate{margin:15px 0}
.flink{background:#f1f1f1;padding:30px}
.flink a{padding-right:2em}


.popup_div{width:100%;height:100%;background:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:99999;display:none}
.popup{width:30%;margin:10% auto 0;background:#fff;padding:20px;border-radius:4px}
.popup .h2{font-weight:700;font-size:30px;color:#333;text-align:center;line-height:56px}
.popup .p{font-size:16px;color:#555;line-height:30px;padding:0 20px}
.popup .button{text-align:center;margin:20px 0}
.popup input{width:32%;padding:13px 0;background:#eee;color:#999;font-size:16px;margin:0 10px;outline:0;border:none;cursor:pointer}
.popup .agree{background:#007aff;color:#fff}
.popup span{color:#ff2300}
.again_Popup_div{width:100%;height:100%;background:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:999999;display:none}
.again_Popup{width:17%;margin:15% auto 0;background:#fff;padding:20px;border-radius:4px}
.again_Popup .h2{font-weight:700;font-size:20px;color:#333;text-align:center;line-height:56px}
.again_Popup .p{font-size:16px;color:#555;line-height:30px;text-align:center}
.again_Popup .p_span{font-size:14px;color:#999;text-align:center}
.again_Popup .button{text-align:center;margin:20px 0}
.again_Popup input{width:40%;padding:10px 0;background:#eee;color:#999;font-size:16px;margin:0 10px;outline:0;border:none;cursor:pointer}
.again_Popup .agree{background:#007aff;color:#fff}