/* banner */
.course-banner img{
    width: 100%;
    margin-top: 1rem;
}
.slick-slider{
}
.draggable{
    /* margin: 1rem auto 0; */
    /* box-sizing:border-box; */
}
.slick-dots{
    bottom: 0.44rem;
}
.slick-dots li button:before{
    background: #ffffff;
}
.slick-dots li.slick-active button:before{
    background: #E4801E;
}


/* 思维绘画 */
.course-p-tit{
    width: 2.74rem;
    display: block;
    margin: 0.72rem auto 0.5rem;
}
.course-p-con{
    background: url(../images/course-p-bg.png) no-repeat center;
    background-size: 100% 100%;
    padding-top: 1.32rem;
    height: 10rem;
    /* overflow-x: hidden; */
}
.course-p-con1{
    position: relative;
    font-size: 0;

}
.course-p-img1{
    width: 3.84rem;
    margin-left: 0.4rem;
    position: relative;
    z-index: 2;
}
.course-p-div1,.course-p-div2{
    position: absolute;
    color: #ffffff;
    box-sizing: border-box;
}
.course-p-div1{
    background: url(../images/course-p-bg1.png) no-repeat center;
    background-size: 100%;
    width: 4.16rem;
    height: 5.3rem;
    right: 0;
    top: -0.42rem;
    z-index: 1;
    padding: 0.4rem 0 0 0.5rem;
}
.course-p-p1{
    font-size: 0.36rem;
}
.course-p-p2{
    font-size: 0.2rem;
    width: 3.5rem;
    line-height: 0.42rem;
}
.course-p-div2{
    width: 4.56rem;
    top: 3.9rem;
    left: 0;
    background: #fdf0de url(../images/course-p-bg2.png) no-repeat center;
    background-size: 100% 100%;
    height: 5.3rem;
    z-index: 3;
    padding: 0.3rem 0 0 0.3rem;
}
.course-p-div2 p{
    width: 4rem;
}
.course-p-img2{
    width: 2.94rem;
    position: absolute;
    right: -2.94rem;
    bottom: 0;
    padding-top: 0.1rem;
    background: #fdf0de;
    z-index: 0;
}


/* 课程体系 */
.course-tit{
    font-size: 0;
    padding-top: 0.6rem;
}
.course-tit-p1{
    font-size: 0.36rem;
    color: #1A1A1A;
}
.course-tit-p2{
    font-size: 0.2rem;
    color: #333333;
    margin: 0.1rem auto 0.2rem;
}
.course-tit p{
    padding-left: 0.3rem;
}
.course-tit-img{
    width: 100%;
    font-size: 0;
    height: 0.02rem;
}
.course-div1-img{
    width: 6.9rem;
    display: block;
    margin: 0.3rem auto 0.7rem;
}


/* 美学书法 */
.course-div2-tit{
    display: block;
    width: 4.06rem;
    margin: 0 auto 0.5rem;
}
.course-div2-con{
    background: url(../images/course-c-bg.png) no-repeat center;
    background-size: 100%;
    height: 3.68rem;
}
.course-div2-p1{
    color: #ffffff;
    font-size: 0.2rem;
    width: 4.6rem;
    line-height: 0.34rem;
    padding: 0.5rem 0 0 0.55rem;
}
.course-div2-list{
    width: 2.6rem;
    text-align: center;
}
.course-div2-con2{
    background: #f0f2f9;
    box-sizing: border-box;
    padding: 0 0.87rem 0.4rem;
    justify-content: space-between;
    align-items: flex-start;
}
.course-div2-img{
    width: 0.93rem;
    
}
.course-div2-p2{
    font-family: Microsoft YaHei;
    font-size: 0.28rem;
    color: #77AEB8;
    font-weight: bold;
    margin: 0.15rem auto 0.1rem;
}
.course-div2-p3{
    font-size: 0.2rem;
    color: #666666;
}
.course-div2-list:last-of-type .course-div2-p2{
    color: #F37D1E;
}


/* 行业发展趋势 */
.course-div3{
    background: url(../images/course-in-bg.png) no-repeat center;
    background-size: 100%;
    height: 11.4rem;
}
.course-tit1 p{
    color: #ffffff;
}
.course-div3-con1{
    font-family: Microsoft YaHei;
    margin-top: 0.6rem;
}
.course-div3-p1{
    font-size: 0.26rem;
    color: #27CCD5;
    text-align: center;
}
.course-div3-p2{
    font-size: 0.2rem;
    width: 6.4rem;
    margin: 0 auto;
    color: #ffffff;
    margin-top: 0.18rem;
}
.course-div3-img1{
    width: 5.86rem;
    display: block;
    margin: 0 auto;
}
.course-div3-con2{
    justify-content: space-between;
    width: 6.4rem;
    margin: 0 auto;
}
.course-div3-con2> div{
    width: 2.2rem;
}
.course-div3-con2-l:nth-of-type(1) p{
    text-align: right;
    width: 100%;
}
.course-div3-con2-l .course-div3-p2{
    margin-top: 0;
    width: auto;
}
.course-div3-p3{
    font-size: 0.24rem;
    color: #1CABE2;
}
.course-div4{
    background: #f0f2f9;
    padding: 0.74rem 0 0.6rem;
}
.course-div4-row{
    width: 6rem;
    margin: 0 auto;
    justify-content: space-between;
    align-items: flex-start;
}
.course-div4-img1{
    width: 3.04rem;
}
.course-div4-img2{
    width: 2.22rem;
    margin-bottom: 0.9rem;
}
.course-div4-img3{
    width: 2.43rem;
}
.course-div4-img4{
    width: 2.64rem;
}


/* 立体美工 */
.course-div5-tit{
    width: 6.46rem;
    display: block;
    margin: 0 auto 0.3rem;
}
.course-div5-con{
    background: url(../images/course-div5-bg.png) no-repeat center;
    background-size: 100%;
    height: 3rem;
}
.course-div5-p1{
    font-size: 0.2rem;
    width: 5.1rem;
    margin: 0 auto;
    color: #ffffff;
    padding-top: 0.65rem;
    line-height: 0.36rem;
}
.course-div5-con1{
    background: #333333;
}
.course-tit2 .course-tit-p1{
    color: #F6921E;
}
.course-tit2 .course-tit-p2{
    color: #ffffff;
}
.course-div5-group{
    justify-content: space-between;
    padding: 0.3rem 0.6rem 0.53rem;
    box-sizing: border-box;
}
.course-div5-img1{
    width: 0.5rem;
}
.course-div5-img2{
    width: 0.4rem;
}
.course-div5-img3{
    width: 0.6rem;
}
.course-div5-img4{
    width: 0.64rem;
}
.course-div5-img5{
    width: 0.63rem;
}
.course-div5-con2{
    margin: auto 0.32rem;
}
.course-div5-p2{
    font-size: 0.36rem;
    color: #1A1A1A;
    margin: 0.75rem auto 0.2rem;
}
.course-div5-p3{
    font-size: 0.2rem;
    color: #1A1A1A;
}
.course-div5-p4{
    width: 0.8rem;
    height: 0.04rem;
    background: #F6921E;
    margin: 0.2rem 0 0.3rem;
}
.course-div5-p5{
    font-size: 0.2rem;
    color: #808080;
    margin-left: 0.25rem;
    width: 6.34rem;
}
.course-div5-p6{
    width: 1.18rem;
    height: 0.28rem;
    background: #4d4d4d;
    margin: 0.35rem 0 0.8rem;
}
.course-div5-con3{
    background: url(../images/course-div5-bg2.png) no-repeat center;
    background-size: 100% ;
    height: 7.73rem;
}
.course-tit-p3{
    width: 0.8rem;
    height: 0.04rem;
    background: #F6921E;
    margin-left: 0.3rem;
}
.course-div5-con3 .course-tit-p1{
    margin-top: 0.4rem;
}
.course-div5-txt-list{
    margin-bottom: 0.4rem;
}
.course-div5-txt-list:last-of-type{
    margin-bottom: 0;
}
.course-div5-txt{
    margin: 0.4rem auto 1rem 0.58rem;
}
.course-div5-txt-p1{
    font-size: 0.22rem;
    font-family: PingFang-SC-Bold;
    color: #ffffff;
}
.course-div5-txt-p2{
    font-size: 0.2rem;
    color: #FFA308;
    width: 4.5rem;
    border-bottom: 0.02rem solid rgba(255,255,255,0.3);
    padding-bottom: 0.07rem;
    margin-top: 0.1rem;
}
.course-div5-line1{
    width: 4.11rem;
    margin: -2.4rem auto auto 0.83rem;
    position: relative;
    z-index: -1;
}
.course-div5-con4{
    background: url(../images/course-div5-4-bg1.png) no-repeat center;
    background-size: 100% 100%;
    height: 3.24rem;
    padding: 0.7rem 0 0 1.5rem;
    align-items: flex-start;
    box-sizing: border-box;
    margin-top: -2.2rem;
}
.course-div5-con4 p,.course-div5-con5-r p{
    width: 1rem;
    font-size: 0.24rem;
    color: #ffffff;
    text-align: left;
    line-height: 0.4rem;
}
.course-div5-con5-img{
    width: 3.45rem;
}
.course-div5-con5{
    align-items: flex-start;
}
.course-div5-con5-r{
    background: url(../images/course-div5-con5-bg.png) no-repeat center;
    background-size: 100%;
    height: 6rem;
    box-sizing: border-box;
    width: 4.05rem;
    padding: 1.7rem 0 0 0.8rem;
    position: relative;
    margin-top: -0.03rem;
}
.course-div5-con5-r p{
    width: 1.5rem;
    line-height: 0.6rem;
}
.course-div5-con5-r-icon{
    position: absolute;
    width: 3.35rem;
    left: -2.21rem;
    bottom: 0.1rem;
    z-index: -1;
}

/* 艺术展览 */
.course-div6-tit{
    width: 3.17rem;
    display: block;
    margin: 1.3rem auto auto;
}
.course-div6-v{
    width: 6.4rem;
    height: 3.7rem;
    margin: 0.44rem auto 0.33rem;
    /* margin: 0 auto; */
    position: relative;
    box-sizing: border-box;
}
.course-div6-v video{
    width: 6.3rem;
}
.course-div6-c{
    width: 100%;
    position: absolute;
    left: -0.02rem;
    top: 0;
    z-index: 1;
}
.course-div6-txt{
    width: 6.35rem;
    color: #808080;
    font-size: 0.2rem;
    margin: 0 auto;
}
.course-div6-c1{
    background: url(../images/course-c-bg1.jpg) no-repeat center;
    background-size: 100%;
    height: 3.95rem;
    position: relative;
    margin: 0.6rem auto -0.02rem;
}
.course-div6-f{
    position: absolute;
    left: 0;
    top: 1.2rem;
    width: 100%;
    background: rgba(255,152,51,.7);
    padding: 0.5rem 1.3rem 0.5rem 0.88rem;
    z-index: 2;
    font-family: Microsoft YaHei;
    font-size: 0.2rem;
    color: #ffffff;
    box-sizing: border-box;
    transition: transform 1s ease,opacity .8s ease;
    transition: transform 1s ease,opacity .8s ease,-webkit-transform 1s ease
}
.course-div6-btn{
    position: absolute;
    bottom: 0.2rem;
    right: 0.43rem;
    width: 1.26rem;
    height: 0.34rem;
    background: #333;
    color: #fff;
    text-align: center;
    font-size: 0.2rem;
    line-height: 0.38rem;
}
.course-div6-l{
    position: absolute;
    bottom: 0.2rem;
    left: 0.5rem;
    width: 6.5rem;
    height: 3.45rem;
    background: rgba(0,0,0,0.7);
    opacity: 0;
    -webkit-transition: opacity .8s ease,-webkit-transform 1s ease;
    transition: opacity .8s ease,-webkit-transform 1s ease;
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}
.course-div6-l{
}
.course-div6-l-p1{
    font-size: 0.18rem;
    color: #FF9833;
    text-align: center;
    margin-top: 0.5rem;
}
.course-div6-l-p2{
    font-size: 0.12rem;
    color: #ffffff;
    width: 5.2rem;
    margin: 0 auto;
}
.course-div6-l-img{
    width: 5.4rem;
    display: block;
    margin: 0.2rem auto;
}
.course-div6-close{
    position: absolute;
    top: 0.05rem;
    right: 0.05rem;
    width: 0.4rem;
    height: 0.4rem;
    justify-content: center;
}
.course-div6-close img{
    width: 0.24rem;
    height: 0.24rem;
}   
.activeBtn1{
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    opacity: 0;
}
.activeBtn2{
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    opacity: 1;
    z-index: 1;
}