@charset "UTF-8";
.app-teaching-process-container { position: relative;  background: #fff; }
.app-teaching-process-container .head-title { font-size: var(--app-fs-42); color: #333; text-align: center; }
.app-teaching-process-container .backend { position: absolute; top: 0; font-size: var(--app-fs-280); font-weight: normal; color: rgba(51,51,51,.03); white-space: nowrap; animation: marquee 60s linear infinite; }

.app-course-process-description { position: relative; z-index: 1; padding: var(--app-fs-120) 0; }
.app-course-process-description + .app-course-process-description { padding-top: 0; }
.app-course-process-description .wrapper { padding: var(--app-fs-44); margin-top: var(--app-fs-40); border-radius: 16px; background: #F3F3F3; }
.app-course-process-description .item { padding: 0 var(--app-fs-46); border-radius: 16px; background: #fff; }
.app-course-process-description .item + .item { margin-top: var(--app-fs-22); }
.app-course-process-description .item .head { padding: var(--app-fs-30) 0; }
.app-course-process-description .item .head .title { font-size: var(--app-fs-20); color: #333; font-weight: 700; }
.app-course-process-description .item .head .icon { margin-left: auto; }
.app-course-process-description .item .head .iconfont { font-size: var(--app-fs-18); font-weight: 700; color: #b2b2b2; }
.app-course-process-description .item .main { height: 0; overflow: hidden; }
.app-course-process-description .item .main .wrap { padding: var(--app-fs-30) 0; border-top: 1px dashed #cccccc; }
.app-course-process-description .item.on .head .title { color: var(--app-color-main); }
.app-course-process-description .item.on .head .icon { transform: rotate(-90deg); }
.app-course-process-description .item.on .head .iconfont { color: #333; }
.app-course-process-description .item.on .main { height: auto; }

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}