﻿.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:1156px;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/561/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/561/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/561/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/561/h4-icon-r.png);background-size:cover;background-position:center}.title-h4{display:inline-block;margin:0 13px}.section0{width:1152px;height:509px;position:relative;background-image:url(../image/section0-bg.png);background-size:cover;background-position:center;margin:0 auto;margin-bottom:65px}.section0 .wrap{height:100%}.section0 .wrap .content-box{position:absolute;margin:0 auto;width:100%;box-sizing:border-box;text-align:center;height:100%}.section0 .wrap .content-box .section0-icon{width:197px;height:48px;background-image:url(https://coding.imooc.com/static/module/class/content/img/561/section-icon.png);background-size:cover;background-position:center;margin:-11px auto 21px;font-family:PingFangSC-Medium;font-size:24px;color:#fff;letter-spacing:1.14px;text-align:center;line-height:40px}.section0 .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:6px;margin-top:76px}.section0 .wrap .content-box h4{font-family:PingFangSC-Regular;font-size:16px;color:#1c1e20;text-align:center;line-height:24px;margin-bottom:51px}.section0 .wrap .content-box .section0-main{width:1039px;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-main .section0-main-item{width:244px;height:246px;background-image:url(../image/section0-main-item.jpg);background-size:cover;background-position:center}.section0 .wrap .content-box .section0-main .section0-main-item .p-title{font-family:PingFangSC-Semibold;font-size:16px;color:#fff;line-height:58px;font-weight:600;text-align:center}.section0 .wrap .content-box .section0-main .section0-main-item .p-cont{font-family:PingFangSC-Regular;font-size:14px;color:#545c63;line-height:22px;font-weight:400;text-align:left;margin-top:21px;margin-left:58px}.section0 .wrap .content-box .section0-main .section0-main-item .p-cont p{font-family:PingFangSC-Semibold;font-size:16px;color:#1c1f21;line-height:28px;font-weight:600;margin-bottom:6px}.section0 .wrap .content-box .section0-main .section0-main-item .p-cont span{color:#1c1f21}.section0 .wrap .content-box .section0-main .section0-main-item .footer{font-family:PingFangSC-Medium;font-size:14px;color:#1c1e20;line-height:24px;font-weight:500;text-align:left;margin-top:20px}.section0 .wrap .content-box .section0-main .section0-main-item2 .p-cont{margin-left:22px}.section0 .wrap .content-box .section0-main .section0-main-item3 .p-cont{margin-left:21px}.section0 .wrap .content-box .section0-main .section0-main-item4 .p-cont{margin-left:22px}.section1{width:100%;height:2135px;position:relative;margin:0 auto;background:#f8f6ff;padding-top:72px}.section1 .wrap{height:100%}.section1 .wrap .content-box{position:relative;width:1152px;height:1988px;background-image:url(../image/section1-bg2.png);background-size:cover;background-position:center;background-repeat:no-repeat;background-size:100% 100%;margin:0 auto;padding-top:79px}.section1 .wrap .content-box .section1-icon{width:197px;height:48px;background-image:url(https://coding.imooc.com/static/module/class/content/img/561/section-icon.png);background-size:cover;background-position:center;position:absolute;left:482px;top:-10px;font-family:PingFangSC-Medium;font-size:24px;color:#fff;letter-spacing:1.14px;text-align:center;line-height:40px}.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}.section1 .wrap .content-box h1:nth-of-type(2){margin-top:71px;margin-bottom:48px}.section1 .wrap .content-box h1:nth-of-type(3){margin-top:51px;margin-bottom:48px}.section1 .wrap .content-box .h2{margin-top:77px}.section1 .wrap .content-box h4{font-family:PingFangSC-Regular;font-size:16px;color:#1c1e20;letter-spacing:0;text-align:center;font-weight:400;margin-bottom:37px}.section1 .wrap .content-box h4:nth-of-type(2){margin-bottom:48px}.section1 .wrap .content-box .section1-main1{width:716px;height:416px;background:#f6f5fb;border-radius:16px;margin:0 auto}.section1 .wrap .content-box .section1-main1 .swiper-container{width:100%}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide{background:#f6f5fb;border-radius:16px;box-sizing:border-box}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .gif{width:528px;height:342px;margin:18px auto 0}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .gif1{margin-top:18px;background-image:url(../image/swiper1.png);background-size:cover;background-position:center;background-size:contain;background-repeat:no-repeat;background-position:center center}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .gif2{width:644px;height:268px;margin-top:50px;background-image:url(../image/swiper2.png);background-size:cover;background-position:center;background-size:contain;background-repeat:no-repeat;background-position:center center}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .gif3{width:600px;height:210px;margin-top:80px;background-image:url(../image/swiper3.png);background-size:cover;background-position:center;background-size:contain;background-repeat:no-repeat;background-position:center center}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .gif4{background-image:url(https://coding.imooc.com/static/module/class/content/img/561/swiper4.png);background-size:cover;background-position:center;background-size:contain;background-repeat:no-repeat;background-position:center center}.section1 .wrap .content-box .section1-main1 .swiper-container .swiper-wrapper .swiper-slide .text{font-family:PingFangSC-Medium;font-size:14px;color:#1c1f21;letter-spacing:0;text-align:center;line-height:22px;font-weight:500;margin-top:22px}.section1 .wrap .content-box .section1-main1 .swiper-pagination{top:612px;left:538px}.section1 .wrap .content-box .section1-main1 .swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;background:#d8d8d8}.section1 .wrap .content-box .section1-main1 .swiper-pagination .swiper-pagination-bullet:nth-child(2){margin:0 20px}.section1 .wrap .content-box .section1-main1 .swiper-pagination .swiper-pagination-bullet-active{width:10px;height:10px;background:#5947b8}.section1 .wrap .content-box .section1-main2{width:910px;height:557px;margin:0 auto;background-image:url(../image/section1-main-item12.png);background-size:cover;background-position:center}.section1 .wrap .content-box .section1-main3{width:1039px;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}.section1 .wrap .content-box .section1-main3 .section1-main3-item1{width:478px;height:428px;background-image:url(../image/section1-main-item22.png);background-size:cover;background-position:center}.section1 .wrap .content-box .section1-main3 .section1-main3-item2{width:522px;height:428px;background-image:url(../image/section1-main-item32.png);background-size:cover;background-position:center}.section2{width:100%;height:746px;position:relative}.section2 .wrap{height:100%}.section2 .wrap .content-box{position:relative;margin:0 auto;width:1180px;box-sizing:border-box;text-align:center;height:735px;background-image:url(../image/section2-bg2.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-icon{position:absolute;left:481px;top:-11px;width:197px;height:48px;background-image:url(https://coding.imooc.com/static/module/class/content/img/561/section-icon.png);background-size:cover;background-position:center;font-family:PingFangSC-Medium;font-size:24px;color:#fff;letter-spacing:1.14px;text-align:center;font-weight:500;line-height:40px}.section2 .wrap .content-box .section2-main{width:1152px;height:676px;padding-top:70px;margin:0 auto;border-radius:12px}.section2 .wrap .content-box .section2-main h1{font-family:PingFangSC-Semibold;font-size:32px;color:#1c1e20;text-align:center;line-height:48px;font-weight:600;margin-bottom:4px;position:relative}.section2 .wrap .content-box .section2-main h4{font-family:PingFangSC-Regular;font-size:16px;color:#1c1e20;text-align:center;line-height:24px;font-weight:400;margin-bottom:50px;position:relative}.section2 .wrap .content-box .section2-main .section2-main-top{width:1025px;height:204px;margin:0 auto;margin-top:31px;margin-bottom:30px}.section2 .wrap .content-box .section2-main .section2-main-icon{width:204px;height:204px;float:left;margin-right:26px;background-image:url(../image/section2-main-icon12.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-main .section2-main-icon2{background-image:url(../image/section2-main-icon22.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-main .section2-main-icon3{background-image:url(../image/section2-main-icon32.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-main .section2-main-icon4{background-image:url(../image/section2-main-icon42.png);background-size:cover;background-position:center}.section2 .wrap .content-box .section2-main .section2-main-contBox{width:252px;height:100px;float:left;margin-right:60px;margin-top:24px}.section2 .wrap .content-box .section2-main .section2-main-contBox .title{font-family:PingFangSC-Semibold;font-size:16px;color:#1c1e20;letter-spacing:0;font-weight:600;margin-bottom:18px;text-align:left}.section2 .wrap .content-box .section2-main .section2-main-contBox .content{width:252px;font-family:PingFangSC-Regular;font-size:14px;color:#1c1e20;letter-spacing:0;text-align:justify;line-height:22px;font-weight:400}.section2 .wrap .content-box .section2-main .section2-main-contBox .content a{color:#2996d6}.section2 .wrap .content-box .section2-main .section2-main-contBox .content a:hover{color:red}.section2 .wrap .content-box .section2-main .section2-main-contBox2{margin-right:0}@media only screen and (min-width:768px) and (max-width:1024px){.wrap{transform:scale(.9)}}