* {
    box-sizing: border-box;
}

/* 初始状态：隐藏整个页面，消除加载过程中的样式抖动 */
html,
body {
    margin: 0;
    padding: 0;
    visibility: hidden;
    background-color: #fff;
}

/* 加载完成后添加的类：显示页面 */
html.page-loaded,
html.page-loaded body {
    visibility: visible;
}

.banner {
    width: 100%;
    position: relative;
}

.banner-img {
    display: block;
    width: 100%;
}

.back {
    width: fit-content;
    padding: .1rem .25rem;
    box-sizing: border-box;
    background: #ffffff6e;
    border-radius: .5rem;
    font-size: .26rem;
    color: #FCFCFF;
    position: absolute;
    top: .45rem;
    left: .3rem;
}

.back img {
    width: .15rem;
}

.aboutUs img {
    width: .29rem;
}

.aboutUs {
    width: fit-content;
    padding: .1rem .25rem;
    box-sizing: border-box;
    background: #ffffff6e;
    border-radius: .5rem;
    border-radius: .5rem;
    font-size: .26rem;
    color: #FCFCFF;
    position: absolute;
    top: .45rem;
    right: .3rem;
}

.s1 {
    width: 100%;
    padding: .58rem 0;
    background-image: url(../index-img/m-index/s1-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.s1-t {
    height: 1.01rem;
}

.s1-c {
    width: 100%;

    padding: .35rem 0 0;
}

.s1-swiper {
    display: flex;
    align-items: end;
    width: 100%;
    height: 4.6rem;
    padding: .5rem 1.5rem 0;
    box-sizing: border-box;
    /* border: 1px solid #df0909; */
}

.s1 .swiper-slide {
    width: 2rem;
    height: 100%;
    box-sizing: border-box;
    padding: 0.45rem 0.25rem;
    border-radius: 0.39rem 0.39rem 0.39rem 0.39rem;
    background-image: linear-gradient(to top, #E3ECFF 0%, #f8fdff 100%);
    /* border: 1px solid #df0909; */
}

.s1 .swiper-slide-active {
    background-image: url(../index-img/m-index/s1-b.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform-origin: bottom center;
    transform: scale(1.1);
    transition: transform 1s;
    /* 原尺寸（可调整为1.1放大更多） */
    opacity: 1;
    z-index: 2;
    /* 层级更高，避免被遮挡 */
}

.s1-item-t {
    font-weight: bold;
    font-size: .32rem;
    color: #3276F9;
    margin-bottom: .45rem;
}

.s1 .swiper-slide-active .s1-item-t {
    font-size: .32rem;
    color: #FFFFFF;
}

.s1-item-text {
    font-size: .26rem;
    color: #060606;
    line-height: .38rem;
}

.s1 .swiper-slide-active .s1-item-text {
    font-size: .26rem;
    color: #FFFFFF;
    line-height: .38rem;
}

.s2 {
    padding: .5rem 0 0;

}

.s2-t {
    height: 1.5rem;
}

.s2-c {
    padding: .4rem 0 0 .3rem;
}

.s2-swiper {
    width: 100%;
    padding: 0 0.81rem 1.1rem 0;
    /* border: 1px solid #df0909; */
}

.s2 .swiper-slide {
    height: 8.8rem;
    padding: .45rem .35rem;
    background-color: #F0F5FE;
    border-radius: 16px 16px 16px 16px;
    position: relative;
}

.s2-s-title {
    font-weight: bold;
    font-size: .32rem;
    color: #3276F9;
    margin-bottom: .15rem;
}

.s2-s-text {
    font-size: .26rem;
    color: #4E5572;
    line-height: .38rem;
    margin-bottom: .25rem;

}

.s2-img {
    margin: 0 auto;
    width: 100%;
}

.s2-img3 {
    height: 5.2rem;
}

.s2-note {
    font-size: .2rem;
    color: #4583F7;
    line-height: .26rem;
}

.s2-num {
    width: .65rem;
    position: absolute;
    top: .3rem;
    right: .3rem;
}

.swiper-pagination-bullet-active {
    width: .81rem;
    height: .21rem;
    background-image: linear-gradient(to right, #1E6BFB 0%, #6799F3 100%);
    border-radius: .1rem .1rem .1rem .1rem;
}

.swiper-pagination-bullet {
    background-color: #7496d5;
}

.s3 {
    padding: .5rem 0;
    background-image: url(../index-img/m-index/s3-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.s3-t {
    width: 100%;
}

.s3-c {
    overflow: auto;
    padding-top: .5rem;
}

.s3-tabs {
    width: 220%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 .3rem;
    gap: .2rem;
    white-space: nowrap;
    /* 防止换行 */
    /* overflow: auto; */
    /* border: 1px solid red; */
}

.s3-tab {
    width: fit-content;
    white-space: nowrap;
    /* 防止换行 */
    gap: .1rem;
    padding: .2rem .45rem;
    background: linear-gradient(to left, #D0DEFF 0%, #D5E3FF 100%);
    border-radius: .5rem;
}

.s3-tab.active {
    background-image: linear-gradient(to top, #1C6AFB 0%, #6899F3 100%);
}

.s3-tab-name {
    width: fit-content;
    white-space: nowrap;
    font-size: .32rem;
    color: #6C98FF;

}

.s3-tab-name.active {
    color: #FFFFFF;
}

.tab-img {
    height: .36rem;
}

.tab-img.active {
    display: none;
}

.tab-himg {
    display: none;
}

.tab-himg.active {
    display: block;
}

.s3-swiper {
    width: 100%;
    padding: .5rem .3rem 0;
}

.s3 .swiper-slide {
    width: 100%;
}

.s3 .item-c {
    padding: .4rem .3rem .9rem;
    background-color: #fff;
    /* gap: .2rem; */
}

.s3-item1 {
    width: 2.7rem;
    height: 2.45rem;
    padding: .25rem;
    gap: .15rem;
    background-color: #F5F8FE;
}

.s3-swiper-title {
    font-size: .4rem;
    color: #236EFB;
    font-weight: bold;
}

.s3-line {
    width: 100%;
    height: .01rem;
    background-color: #fff;
}

.s3-note {
    font-size: .26rem;
    color: #2C2F46;
}

.s3 .item-text {
    font-size: .26rem;
    color: #45485D;
    line-height: .5rem;
}

.phone-box {
    padding-bottom: .5rem;
    background-image: url(../index-img/m-index/phone-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.phone {
    height: 5rem;
    margin-top: -0.45rem;
}

.s3-button {
    width: .5rem;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    content: '';
}

.s3 .swiper-button-next {
    right: 0;
}

.s3 .swiper-button-prev {
    left: 0;
}

.s4 {
    padding: .45rem 0 0;
}

.s4-t {
    width: 100%;
}

.s4-c {
    display: grid;
    grid-template: repeat(2, 1fr)/repeat(2, 1fr);
    gap: .3rem .2rem;
    padding: .5rem .25rem 0;
}

.s4-item {
    width: 100%;
    box-shadow: .03rem 0rem .09rem 0rem #C4DBFA;
    border-radius: .16rem 0rem .16rem .16rem;
    background-image: linear-gradient(to top, #E3EDFF 0%, #F3FAFF 100%);
}

.s4-img {
    width: 100%;
}

.s4-item-c {
    padding: 0 .2rem .3rem .2rem;
    gap: .15rem;
    /* background-image: linear-gradient(to top, #E3EDFF 0%, #F3FAFF 100%); */
}

.s4-i-title {
    font-weight: bold;
    font-size: .32rem;
    color: #226EFB;
    /* margin-bottom: .15rem; */
}

.s4-i-text {
    font-size: .26rem;
    color: #060606;
    line-height: .38rem;
}

.s5 {
    width: 100%;
    padding: .6rem 0;
}

.s5-t {
    width: 100%;
}

.s5-c {
    padding: .4rem .3rem 0;
    gap: .2rem;
}

.s5-item {
    width: 100%;
    height: .98rem;
    border-radius: .15rem;
    background-image: url(../index-img/m-index/s5-nbg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0 .2rem 0 .3rem;
}

.s5-item.active {
    display: none;
}

.s5-i-title {
    font-size: .32rem;
    color: #FFFFFF;
    font-weight: bold;
}

.s5-triangle {
    width: .15rem;
}

.s5-item-h {
    display: none;
    width: 100%;
    position: relative;
    padding: .5rem .3rem;
    background-image: url(../index-img/m-index/s5-hbg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: .16rem .16rem .16rem .16rem;
}

.s5-item-h.active {
    display: block;
}

.s5-green {
    width: 4.01rem;
    height: .3rem;
    margin-top: -0.23rem;
    margin-bottom: .2rem;
    background-image: linear-gradient(to left, transparent 0%, #DFFFE4 100%);
}

.s5-i-htitle {
    font-size: .32rem;
    font-weight: bold;
    color: #3A7BFB;
}

.s5-item-list {
    gap: .1rem;
}

.s5-item-list li {
    color: #3276F9;
    list-style-type: disc;
    list-style-position: inside;
    font-size: .08rem;
}

.s5-i-text {
    display: inline-block;
    font-size: .24rem;
    color: #060606;
    line-height: .38rem;
    vertical-align: middle;
}

.s6 {
    padding: .5rem 0;
    background-image: url(../index-img/m-index/s6-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.s6-t {
    width: 100%;
}

.s6-c {
    width: 100%;
    padding: .5rem 0 .2rem;
    overflow: hidden;
}

.s6-list {
    width: fit-content;
    gap: .1rem;
    animation: imgScroll 30s linear infinite;
}

.s6-list1 {
    margin-bottom: .1rem;
}

.s6-list2 {
    margin-left: -0.5rem;
}

.s6-img {
    height: 2.57rem;
}

@keyframes imgScroll {
    0% {
        transform: translatex(0);
        /* 初始位置：顶部对齐 */
    }

    100% {
        transform: translatex(-50%);
        /* 滚动终点：向上移动自身50%（刚好显示第二份列表） */
    }
}


.s7 {
    padding: .55rem 0;
    background-image: url(../index-img/m-index/s7-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.s7-t {
    width: 100%;
}

.s7-swiper {
    width: 100%;
    padding: .4rem .35rem 0;
}

.s7 .swiper-slide {
    width: 100%;
    position: relative;
    padding: .65rem .15rem .4rem;
    background-color: #fff;
    background: linear-gradient(to left top, #F3F7FF 0%, #FBFCFF 100%);
    box-shadow: .04rem 0rem .05rem 0rem #C3CDE5;
    border-radius: .16rem .16rem .16rem .16rem;
}

.s7-swiper-title {
    font-size: .32rem;
    color: #060606;
    font-weight: bold;
    /* margin: .2rem 0; */
}

.s7-note {
    padding: .08rem .15rem;
    background: #DFFFE4;
    font-size: .22rem;
    color: #279F39;
    margin: .15rem 0;

}

.s7 .item-text {
    font-size: .26rem;
    color: #060606;
    line-height: .38rem;
}

.s7-num {
    position: absolute;
    top: .20rem;
    right: .20rem;
}

.s7-num p {
    display: inline-block;
    position: absolute;
    top: -0.12rem;
    left: 2.75rem;
    font-weight: bold;
    font-size: .3rem;
    color: #3276F9;
}

.s7-img {
    height: .32rem;
}

.s7-button {
    width: .28rem;
}

.s7-tabs {
    width: 100%;
    height: 3.4rem;
    display: flex;
    /* transform: translateX(-50%); */
    /* border: .01rem solid rgb(249, 6, 6); */
}

.s7-tab {
    width: .53rem;
    height: .53rem;
    border-radius: 50%;
    font-size: .22rem;
    color: #3377F9;
    background-image: linear-gradient(to top, #D4E1FF 0%, #F7F9FF 100%);
    /* border: .01rem solid #c73232; */
    position: absolute;
    bottom: 0;
    left: 50%;
    transform-origin: center center;
    transform: translateX(-50%);
}

.s7-tab.active {
    width: .53rem;
    height: .53rem;
    font-weight: bold;
    font-size: .26rem;
    color: #FFFFFF;
    background-image: linear-gradient(to bottom, #1C6AFB 0%, #6899F3 100%);
}

.s7-tabs :nth-child(1) {
    transform: translate(-3.67rem, -0.6rem);
}

.s7-tabs :nth-child(2) {
    transform: translate(-3.2rem, -1.8rem);
}

.s7-tabs :nth-child(3) {
    transform: translate(-2.2rem, -2.7rem);
}

.s7-tabs :nth-child(4) {
    transform: translate(-.95rem, -3.2rem);
}

.s7-tabs :nth-child(5) {
    transform: translate(.4rem, -3.2rem);
}

.s7-tabs :nth-child(6) {
    transform: translate(1.6rem, -2.7rem);
}

.s7-tabs :nth-child(7) {
    transform: translate(2.6rem, -1.8rem);
}

.s7-tabs :nth-child(8) {
    transform: translate(3.16rem, -0.6rem);
}

.s7 .swiper-button-next {
    right: -0.13rem;
}

.s7 .swiper-button-prev {
    left: -0.13rem;
}

.s8 {
    width: 100%;
    padding: .5rem 0;
    height: fit-content;
}

.s8-c {
    width: 100%;
    padding: .5rem 0 0;
}

.s8-swiper {
    height: fit-content;
    padding: .35rem .45rem .9rem;
    /* border: 1px solid rgb(240, 11, 11); */
}

.s8 .swiper-slide {
    width: 100%;
    box-shadow: .02rem 0rem 0rem 0rem #EBF1FD, 0rem 0rem .16rem 0rem #D6E2FA;
    border-radius: .16rem .16rem .16rem .16rem;
}

.s8-img {
    width: 100%;
    padding: 0 .2rem 0 .4rem;
    background-image: url(../index-img/m-index/s8-img.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.s8-teacher {
    height: 2.55rem;
    margin-top: -0.35rem;
}

.s8-name {
    width: 100%;
    padding: .05rem .1rem;
    text-align: end;
    font-size: .32rem;
    color: #FFFFFF;
    background-image: linear-gradient(to left, #1C6AFB 0%, transparent 90%);
}

.s8-message {
    width: 100%;
    height: 9.55rem;
    padding: .25rem;
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.s8-m-title {
    width: fit-content;
    padding: .05rem .1rem;
    background: #DFFFE4;
    font-size: .26rem;
    color: #279F39;
    margin-bottom: .2rem;
}

.s8-message li {
    list-style-type: square;
    color: #3377F9;
    font-size: .18rem;
    margin-left: .5rem;
}

.s8-m-text {
    font-size: .22rem;
    color: #060606;
    line-height: .32rem;
}

.s8-button {
    width: .28rem;
}

.s8 .swiper-button-next {
    right: -0.1rem;
}

.s8 .swiper-button-prev {
    left: -0.1rem;
}

.s9 {
    padding: .5rem 0;
    background-image: url(../index-img/m-index/s9-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.s9-tabs-box {
    width: 100%;
    padding: .4rem 0 .2rem;
    overflow: auto;

}

.s9-tabs {
    width: 170%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.s9-tab {
    width: fit-content;
    padding: .14rem .18rem;
    font-size: .26rem;
    color: #060606;
    background: #F5F9FF;
    border-radius: .08rem .08rem .08rem .08rem;
}

.s9-tab.active {
    color: #FFFFFF;
    background-image: linear-gradient(to top, #1C6AFB 0%, #6899F3 100%);
}

.s9-img {
    width: .3rem;
}

.s9-c {
    width: 100%;
    padding: .1rem .2rem;
}

.s9-container {
    display: none;
    width: 100%;
    padding: .35rem .25rem;
    background: #FFFFFF;
    border-radius: .16rem .16rem .16rem .16rem;
}

.s9-container.active {
    display: block;
}

.s9-summary {
    font-size: .22rem;
    color: #060606;
    line-height: .32rem;
}

.s9-summary1 {
    margin: .15rem 0 0;
}

.s9-skills {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);

}

.s9-skills li {
    list-style-type: disc;
    font-size: .16rem;
    margin-left: .25rem;
    color: #0047ED;
}

.s9-skill {
    color: #060606;
    font-size: .22rem;
    line-height: .6rem;
}

.s9-content {
    width: 100%;
    padding: 0 .1rem .15rem;
    background-image: linear-gradient(to bottom, transparent 10px, #F0F3FD 10px);
}

.s9-courses {
    width: 100%;
    padding: .1rem .1rem .2rem;
    background-image: linear-gradient(to top, #1C6AFB 0%, #6899F3 100%);
}


.s9-courses-name {
    font-size: .22rem;
    color: #FFFFFF;
    line-height: .26rem;
}

.s9-triangle {
    width: .15rem;
    height: .12rem;
}

.s9-courses-content {
    display: none;
    width: 100%;
    max-height: 7rem;
    padding: .20rem .2rem .1rem;
    background-color: #fff;
    overflow: auto;
}

.s9-courses-content.active {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.s9-module {
    width: fit-content;
    padding: .05rem .2rem .05rem .1rem;
    background: #F0F3FD;
    clip-path: polygon(0% 0%, 0% 100%, 88% 100%, 100% 50%, 88% 0%);
    font-size: .24rem;
    color: #0047EC;
    line-height: .28rem;
    margin-bottom: .15rem;
}

.s9-m-text {
    font-size: .22rem;
    color: #060606;
    line-height: .26rem;
    margin-bottom: .2rem;
}

.s9-m-more {
    width: 100%;
    margin-bottom: .25rem;
    padding-left: 1em;
}

.s9-m-more li {
    list-style-type: disc;
    font-size: .12rem;
    color: #0047ED;
    align-items: center;
}

.s9-desc {
    color: #060606;
    font-size: .22rem;
    line-height: .26rem;
}



.s9-elective {
    width: 100%;
    padding: .03rem .1rem;
    margin-bottom: .1rem;
    font-weight: bold;
    font-size: .24rem;
    color: #000000;
    background: #F0F3FD;
}

.s9-elective-o {
    font-weight: 400;
}

.s9-e-details {
    display: flex;
    flex-direction: column;
    padding-left: .1rem;
    gap: .1rem;
    font-size: .22rem;
    color: #060606;
    line-height: .35rem;
    margin-bottom: .15rem;
}

.s9-e-note {
    font-size: .22rem;
    color: #0047EC;
    line-height: .26rem;
}

.s9-e-text {
    font-size: .22rem;
    color: #060606;
    line-height: .3rem;
}

.s9-e-more {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding-left: 1em;
    margin-bottom: .3rem;

}

.s9-e-more li {
    list-style-type: disc;
    font-weight: bold;
    font-size: .12rem;
    color: #0047ED;
    line-height: .3rem;
}

.s10 {
    width: 100%;
    padding: .5rem 0 0;
}

.s10-c {
    width: 100%;
}

.s10-swiper {
    width: 100%;
    padding: .3rem .35rem;

}

.s10 .swiper-slide {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 13.8rem;
    padding: .3rem .3rem .15rem;
    position: relative;
    background: #FFFFFF;
    box-shadow: .02rem 0rem 0rem 0rem #EBF1FD, 0rem 0rem .16rem 0rem #D6E2FA;
    border-radius: .16rem .16rem .16rem .16rem;
}

.s10-num {
    width: 1.05rem;
    position: absolute;
    right: .3rem;
    top: .3rem;
}

.s10-c-title {
    font-weight: bold;
    font-size: .26rem;
    color: #3D7DF9;
}

.s10-img {
    width: 100%;
    margin-top: .15rem;
}

.s10-message {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.s10-item {
    width: 100%;
    padding: .25rem;
    background: #F0F3FD;
    margin-bottom: .1rem;
}

.s10-note {
    font-size: .26rem;
    color: #060606;
    font-weight: bold;
    margin-bottom: .15rem;
}

.s10-desc {
    font-size: .22rem;
    color: #595F75;
    line-height: .32rem;
}

.s10-ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 1em;
}

.s10-ul li {
    list-style-type: disc;
    /* list-style-position: inside; */
    font-size: .10rem;
    color: #595F75;
    vertical-align: middle;
}

.s10-list {
    display: inline;
    font-size: .22rem;
    color: #595F75;
    line-height: .4rem;
}

.swiper-button-next {
    right: -0.12rem;
}

.swiper-button-prev {
    left: -0.12rem;
}

.s11 {
    padding: 0 .2rem .5rem;
}

.s11-t {
    width: 2.45rem;
}

.s11-img {
    width: 100%;
    margin-top: .25rem;
}