﻿.getflex{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex}.space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.flex-wrap{-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap}.wrap{width:1152px;margin:0 auto}.introduce-content{padding-top:20px}.after-icon,.before-icon{display:inline-block;width:23px;height:44px;background-image:url(https://coding.imooc.com/static/module/class/content/img/853/h1-icon-l.png);background-size:cover;background-position:center;vertical-align:top}.after-icon{background-image:url(https://coding.imooc.com/static/module/class/content/img/853/h1-icon-r.png);background-size:cover;background-position:center}.after-icon-h4,.before-icon-h4{display:inline-block;width:69px;height:4px;background-image:url(https://coding.imooc.com/static/module/class/content/img/853/h4-icon-l.png);background-size:cover;background-position:center;vertical-align:middle;line-height:4px}.after-icon-h4{background-image:url(https://coding.imooc.com/static/module/class/content/img/853/h4-icon-r.png);background-size:cover;background-position:center}.title-h4{display:inline-block;margin:0 13px}.section0{width:100%;background:#fff;margin:0 auto}.section0 .wrap{height:100%}.section0 .wrap .content-box{padding:64px 0 60px;margin:0 auto;width:100%;box-sizing:border-box;text-align:center;height:100%}.section0 .wrap .content-box h1{font-family:PingFangSC-Semibold;font-size:32px;color:#1c1e20;text-align:center;line-height:48px;font-weight:600;margin-bottom:43px}.section0 .wrap .content-box .section0-main1{width:1152px;margin:0 auto;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.section0 .wrap .content-box .section0-main1 .item{width:335px;height:224px;box-sizing:border-box;text-align:center}.section0 .wrap .content-box .section0-main1 .item .tit{font-family:PingFangSC-Semibold;font-size:16px;color:#fff;line-height:50px;font-weight:600;height:50px}.section0 .wrap .content-box .section0-main1 .item .con{margin-top:16px;font-family:PingFangSC-Regular;font-size:14px;padding:32px 18px 0;color:#1c1f21;line-height:24px;font-weight:400;text-align:left}.section0 .wrap .content-box .section0-main1 .item1{background-image:url(../image/section0-main-item11.png);background-size:cover;background-position:center}.section0 .wrap .content-box .section0-main1 .item2{background-image:url(../image/section0-main-item21.png);background-size:cover;background-position:center}.section0 .wrap .content-box .section0-main1 .item3{background-image:url(../image/section0-main-item3.png);background-size:cover;background-position:center}.section1{width:100%;position:relative;margin:0 auto;background:#f8fafc}.section1 .wrap{height:100%}.section1 .wrap .content-box{width:100%;padding:64px 0 107px;box-sizing:border-box}.section1 .wrap .content-box h1{font-family:PingFangSC-Semibold;font-size:32px;color:#1c1e20;letter-spacing:0;text-align:center;line-height:48px;font-weight:600;margin-bottom:56px}.section1 .wrap .content-box .section1-video{margin:0 auto;width:960px;height:540px;text-align:center;position:relative}.section1 .wrap .content-box .section1-video video{width:100%;height:100%}.section1 .wrap .content-box .section1-video .mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.63)}.section1 .wrap .content-box .section1-video .mask span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:36px}.section2{width:100%;background:#fff}.section2 .wrap{height:100%}.section2 .wrap .content-box{width:100%;box-sizing:border-box;padding:64px 0 46px}.section2 .wrap .content-box h1{font-family:PingFangSC-Semibold;font-size:32px;color:#1c1e20;letter-spacing:0;text-align:center;line-height:48px;font-weight:600;margin-bottom:58px}.section2 .wrap .content-box h1 span{color:#0967db}.section2 .wrap .content-box .section2-main1{width:1152px;height:599px;margin:0 auto;background-image:url(../image/section2-main-1.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-main2{margin:24px auto 0;width:1124px;height:285px;padding:24px 44px 0;box-sizing:border-box;background:#fff;box-shadow:0 0 14px 0 rgba(43,47,50,.08);border-radius:16px}.section2 .wrap .content-box .section2-main2 p{font-family:PingFangSC-Regular;font-size:16px;color:#545c63;line-height:22px;font-weight:400;margin-bottom:24px}.section3{width:100%;background:#f8fafc}.section3 .wrap{height:100%}.section3 .wrap .content-box{width:100%;box-sizing:border-box;padding:64px 0 43px}.section3 .wrap .content-box h1{font-family:PingFangSC-Semibold;font-size:32px;color:#1c1e20;letter-spacing:0;text-align:center;line-height:48px;font-weight:600;margin-bottom:50px}.section3 .wrap .content-box .section3-main{width:1152px;margin:0 auto;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;flex-wrap:wrap}.section3 .wrap .content-box .section3-main .item{width:335px;height:135px;text-align:left;padding:15px 20px 0 35px;box-sizing:border-box;display:flex;align-items:center;font-family:PingFangSC-Regular;font-size:14px;color:#545c63;line-height:24px;font-weight:400;background-image:url(../image/section3-main.png);background-size:cover;background-position:center;margin-bottom:48px}.section4{width:100%;background:#fff}.section4 .wrap{height:100%}.section4 .wrap .content-box{position:relative;margin:0 auto;width:100%;box-sizing:border-box;text-align:center;box-shadow:0 0 12px 0 rgba(0,0,0,.1);border-radius:12px;height:100%}.section4 .wrap .content-box .outline-title{position:absolute;left:50%;color:#fff;letter-spacing:1.14px;text-align:center}.section4 .wrap .content-box .section4-main{width:1152px;height:704px;margin:0 auto;padding-top:28px;box-sizing:border-box}.section4 .wrap .content-box .section4-main .section3-icon{width:238px;height:48px;background-image:url(https://coding.imooc.com/static/module/class/content/img/853/section0-icon.png);background-size:cover;background-position:center;position:absolute;top:-13px;left:493px;font-family:PingFangSC-Medium;font-size:24px;color:#fff;letter-spacing:1.14px;text-align:center;line-height:48px}.section4 .wrap .content-box .section4-main h1{font-size:32px;color:#333;text-align:center;line-height:48px;font-weight:700;margin-bottom:4px;margin-top:40px}.section4 .wrap .content-box .section4-main h4{font-family:PingFangSC-Regular;font-size:16px;color:#1c1e20;text-align:center;line-height:24px;margin-bottom:50px}.section4 .wrap .content-box .section4-main .section3-main-top{width:1025px;height:204px;margin:0 auto;margin-top:60px;margin-bottom:30px}.section4 .wrap .content-box .section4-main .section3-main-icon{width:204px;height:204px;float:left;margin-right:26px;background-image:url(../image/da.png);background-size:cover;background-position:center}.section4 .wrap .content-box .section4-main .section3-main-icon2{background-image:url(../image/code.png);background-size:cover;background-position:center}.section4 .wrap .content-box .section4-main .section3-main-icon3{background-image:url(../image/cai.png);background-size:cover;background-position:center}.section4 .wrap .content-box .section4-main .section3-main-icon4{background-image:url(../image/wen.png);background-size:cover;background-position:center}.section4 .wrap .content-box .section4-main .section3-main-contBox{width:252px;height:100px;float:left;margin-right:60px;margin-top:24px}.section4 .wrap .content-box .section4-main .section3-main-contBox .title{font-family:PingFangSC-Semibold;font-size:16px;color:#1c1e20;letter-spacing:0;margin-bottom:18px;text-align:left;font-weight:700}.section4 .wrap .content-box .section4-main .section3-main-contBox .content{width:252px;font-family:PingFangSC-Regular;font-size:14px;color:#1c1e20;letter-spacing:0;text-align:justify;line-height:22px}.section4 .wrap .content-box .section4-main .section3-main-contBox .content a{color:#2996d6}.section4 .wrap .content-box .section4-main .section3-main-contBox .content a:hover{color:red}.section4 .wrap .content-box .section4-main .section3-main-contBox2{margin-right:0}@media only screen and (min-width:768px) and (max-width:1024px){.wrap{transform:scale(.9)}}.course-infos-t{padding-top:86px!important}.introduce-content{padding-top:0!important}