html,
body,
main {
    width: 100%;
    height: 100%;
    /* min-width: 1200px; */
    /* background-color: #228dffb6; */
    /* font-family: "PingFangSC", "Microsoft Yahei", "simsun", "arial", "tahoma"; */
}

* {
    margin: 0;
    padding: 0;
    list-style-type: none;
    box-sizing: border-box;
}

.s {
    width: 100%;
    min-width: 1500px;
}

.s .title h3 {
    /* font-family: FZLTTHJW--GB1, FZLTTHJW--GB1; */
    font-size: 36px;
    color: #015afd;
    margin: 0 24px;
}

.s .title img {
    width: 109px;
    height: auto;
}

.s1 {
    width: 100%;
    height: fit-content;
    /* background-image: url("./AIimg/AI-1.png"); */
}

.s1 img {
    width: 100%;
    height: auto;
}

.s2 {
    width: 100%;
    height: fit-content;
    background-image: url("../AIimg/AI-2.png"), url("../AIimg/s2-bg.png");
    background-size: contain, cover;
    background-repeat: no-repeat;
    background-position: bottom, center;
}

.s2 .title {
    margin: 50px 0;
    gap: 24px;
}

.s2 .title img {
    width: 109px;
    height: auto;
}

.s2 .title h3 {
    font-size: 36px;
    color: #015afd;
}

.s2 .box1 {
    width: 1200px;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
    height: fit-content;
}

.s2 .box1 .item {
    width: 366px;
    height: 400px;
    text-align: center;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
}

.s2 .box1 .item:hover {
    transform: translateY(-10px);
}

.s2 .box1 .item h3 {
    font-weight: 600;
    font-size: 24px;
    margin: 178px 0 18px;
}

.s2-title1 {
    color: #3656E0;
}

.s2-title2 {
    color: #F4641B;
}

.s2-title3 {
    color: #138700;
}

.s2 .box1 .item p {
    /* font-family: PingFangSC, PingFang SC; */
    width: 310px;
    font-weight: 400;
    font-size: 18px;
    color: #333333;
}

.s2 .box1 .item .data {
    /* font-family: PingFangSC, PingFang SC; */
    width: 283px;
    font-weight: 400;
    font-size: 12px;
    color: #666666;
    margin-top: 25px;
    text-align: center;
}

.s2 .box1 .item1 {
    background-image: url("../AIimg/s2-item1.png");
    background-size: cover;
}

.s2 .box1 .item2 {
    background-image: url("../AIimg/s2-item2.png");
    background-size: cover;
}

.s2 .box1 .item3 {
    background-image: url("../AIimg/s2-item3.png");
    background-size: cover;
}

.s2 .box2 {
    width: 1482px;
    padding: 50px 140px;
    background-image: url("../AIimg/s2-bg.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.s2 .box2 .content {
    width: 1200px;
    height: 560px;
    background: #ffffff;
    border-radius: 20px;
    padding: 50px 60px;
}

.s2 .box2 .content .title {
    margin: 0 0 50px;
}

.s2 .box2 .content .item-box {}

.s2 .box2 .content .item-box .item {
    width: 495px;
}

.s2 .box2 .content .item-box img {
    width: 90px;
    height: 90px;
}

.s2 .box2 .content .item-box p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 500;
    font-size: 24px;
    color: #333333;
    margin-left: 40px;
}

.s2 .box2 .content .item-box .divir {
    width: 1px;
    height: 140px;
    border: 1px solid #dddddd66;
    margin: 0 43px;
}

.s2 .box2 .content .divir {
    gap: 88px;
    padding: 33px 0;
}

.s2 .box2 .content .divir div {
    width: 496px;
    height: 1px;
    border: 1px solid #dddddd66;
}

.s3 {
    padding: 50px 0 0;
    background-image: url("../AIimg/s3-bg.png");
    background-size: contain;
    background-position: bottom;
    background-repeat: no-repeat;
    position: relative;
}

.s3 .content {
    width: 1200px;
    position: relative;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
}

.s3 .content .item {
    width: 276px;
    height: 330px;
    background: #e7efff;
    border-radius: 20px;
    padding: 0 23px;
    position: absolute;
}

.s3 .content .item:hover {
    transform: translateY(-10px);
}

.s3 .content .item img {
    width: 70px;
    height: 70px;
}

.s3 .content .item .site {
    width: 18px;
    height: auto;
    position: absolute;
    bottom: -39px;
    left: 50%;
    transform: translateX(-50%);
}

.s3 .content .item h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 24px;
    color: #228dff;
    margin: 30px 0 16px;
}

.s3 .content .item p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 18px;
    color: #333333;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
}

.s3 .content .item1 {
    left: 10px;
    top: 110px;
}

.s3 .content .item2 {
    left: 313px;
    top: 50px;
}

.s3 .content .item3 {
    left: 616px;
    top: 96px;
}

.s3 .content .item4 {
    left: 920px;
    top: 82px;
}

.s3 .bolang-img {
    /* width: 1129px; */
    height: 101px;
    margin: 415px 0 50px;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
}

.s4 {
    /* height: 800px; */
    background-image: url("../AIimg/s4-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 50px 0 70px;
}

.s4 .title h3 {
    width: 536px;
    height: 45px;
    /* font-family: FZLTTHJW--GB1, FZLTTHJW--GB1; */
    font-size: 36px;
    color: #ffffff;
}

.s4 .content {
    width: 1200px;
    height: fit-content;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 70px 40px;
    margin-top: 75px;
}

.s4 .content .item {
    width: 580px;
    height: 180px;
    background: linear-gradient(270deg,
            rgba(85, 130, 212, 0.14) 0%,
            rgba(85, 130, 212, 0.5) 100%);
    border-radius: 20px;
    position: relative;
}

.s4 .content .item:hover {
    transform: translateY(-10px);
    background: linear-gradient(315deg, #0045C3 0%, #1769FF 100%);
}

.s4 .content .item img {
    width: 190px;
    height: 190px;
    position: absolute;
    top: -50px;
    left: -40px;
}

.s4 .content .item p {
    width: 360px;
    height: 50px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 18px;
    color: #ffffff;
    margin-left: 160px;
}

.s4 .content .item h3 {
    height: 33px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 24px;
    color: #ffffff;
    margin-left: 160px;
    margin-bottom: 16px;
    /* border: 1px solid rgba(231, 21, 21, 0.965); */
}

.s5 {
    padding: 50px 0;
    /* background-image: url("../AIimg/s5-bottom.png"); */
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
}

.s5 .content {
    width: 1200px;
    height: fit-content;
    margin-top: 105px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 75px 38px;
}

.s5 .content .item {
    width: 375px;
    height: 220px;
    padding: 0 19px;
    /* position: relative; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background-color: #f5f5f5;
}


.s5 .content .item img {
    height: 120px;
    margin-top: -85px;
    /* border: 1px solid rgba(238, 67, 67, 0.962); */
}

.s5 .content .item:hover {
    transform: translateY(-10px);
}

.s5 .content .item h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 24px;
    color: #228dff;
    margin: 22px 0 12px;
}

.s5 .content .item p {
    /* width: 315px; */
    height: 75px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 18px;
    color: #333333;
    line-height: 25px;
    text-align: center;
}


.s6 {
    /* height: 578px; */
    padding: 50px 0;
    background-image: url("../AIimg/s6-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.s6 .content {
    width: 1200px;
    height: 579px;
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-template-areas:
        "a a b b c c"
        /* 第一行：a、b、c 各占1列 */
        "d d d e e e";
    /* 第二行：d占2列，e占2列（但总列数是3，实际会自动平分3列宽度） */
    background-image: url("../AIimg/s6-img.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

}

.s6 .content .item {
    padding: 23px;
}

.s6 .content .item1 {
    grid-area: a;
    /* border: 1px solid rgb(232, 29, 29); */
}

.s6 .content .item2 {
    grid-area: b;
}

.s6 .content .item3 {
    grid-area: c;
}

.s6 .content .item4 {
    grid-area: d;
}

.s6 .content .item5 {
    grid-area: e;
}

.s6 .item h3 {
    /* width: 370px; */
    height: 33px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 24px;
    color: #FFFFFF;
    margin-bottom: 47px;
    /* border: 1px solid rgb(232, 29, 29); */
}

.s6 .content .item p {
    /* width: 324px; */
    height: 25px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
}

.s6 .item4 h3 {
    margin-bottom: 14px;
}

.s6 .item5 h3 {
    margin-bottom: 14px;

}

.s7 {
    padding: 50px 0;
    background-image: url("../AIimg/s7-bg.png");
    background-position: center;
    background-size: contain;

}

.s7 img {
    width: 1200px;
    /* height: 659px; */
    margin-top: 16px;
}

.s8 {
    padding: 50px 0;
    background-color: #eef0f8;
}

.s8 .content {
    width: 1200px;
    height: fit-content;
    /* border: 1px solid rgba(213, 54, 54, 0.965); */
    margin-top: 50px;
}

.s8 .content .item {
    width: 380px;
    height: 730px;
    background-color: #F9FAFB;
}

.s8 .content .item .type {
    width: 160px;
    height: 50px;
    background: #F46D2D;
    border-radius: 0px 0px 10px 0px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 500;
    font-size: 20px;
    color: #FFFFFF;
    gap: 6px;
}

.s8 .content .item .type img {
    width: 26px;
    height: 26px;
}

.s8-img {
    width: 380px;
    /* border: 1px solid rgba(1, 90, 253, 0.3); */
}

.s8 .content .item .details {
    padding: 20px 26px 0;
    /* border: 1px solid rgba(1, 90, 253, 0.3); */
}

.s8 .content .item .details h3 {
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    color: #228DFF;
}

.s8 .content .item .details p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    padding: 10px 0 30px;
}

.teacher {
    padding: 50px 0 0;
}

.teacher-content {
    width: 100%;
    height: fit-content;
    /* padding: 50px 0 0 ; */
    /* border: 1px solid rgba(1, 90, 253, 0.3); */
}

.teacher-item1 {
    width: 1200px;
    padding: 0 0 50px;
    gap: 55px;
    /* border: 1px solid rgb(253, 135, 1); */
}

.teacher-item2 {
    width: 1200px;
    /* padding: 0 0 50px; */
    /* border: 1px solid rgb(253, 135, 1); */
}

.teacher-img {
    height: 360px;
    /* border: 1px solid rgba(1, 90, 253, 0.3);     */
}

/* .teacher-text-box{
    padding: 0 0 0 60px;
} */
.teacher-name {
    font-weight: 600;
    font-size: 24px;
    color: #333333;
    line-height: 33px;
    /* text-stroke: 1px #333333; */
    text-align: left;
    font-style: normal;
    margin-right: 20px;
}

.teacher-tips {
    font-weight: 500;
    font-size: 20px;
    color: #228DFF;
    line-height: 28px;
    text-align: left;
    font-style: normal;
}

.teacher-detials {
    height: fit-content;
    padding-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    /* border: 1px solid rgba(1, 90, 253, 0.3); */
}

.teacher-detials .type {
    width: 98px;
    font-weight: 500;
    font-size: 18px;
    color: #666666;
    line-height: 25px;
    text-align: left;
    font-style: normal;
    /* border: 1px solid rgb(253, 135, 1); */
}

.teacher-detials .type-details {
    width: 710px;
    font-weight: 400;
    font-size: 18px;
    color: #666666;
    line-height: 25px;
    text-align: left;
    font-style: normal;
    /* border: 1px solid rgb(140, 253, 1); */
}

.s9 {
    padding-top: 50px;
    background-color: #fff;
    background-image: url("../AIimg/s9-bg.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;
}

.s9 .content {
    width: 1200px;
    height: 808px;
    background: #EBF0FA;
    border-radius: 20px;
    border: 2px solid rgba(1, 90, 253, 0.3);
    padding: 40px 0 0;
    margin-top: 50px;
}

.s9 .content .type {
    width: 1080px;
    height: fit-content;
    /* margin-top: 45px; */
    /* border: 1px solid rgba(1, 89, 253, 0.952); */
}

.s9 .content .type img {
    width: 320px;
}

.s9 .content .type-content {
    width: 1080px;
}

.s9 .content .type-content .module {
    height: 90px;
    background: #FDEFDA;
    border-radius: 20px 20px 0px 0px;
    border: 1px solid rgba(255, 159, 0, 0.29);
    padding: 20px 0 20px 24px;
    margin-top: 28px;
    display: flex;
}

.s9 .content .type-content .module .text h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 18px;
    color: #EF4300;
}

.s9 .content .type-content .module .text p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 14px;
    color: #FC510E;
    margin-top: 6px;
}

.s9 .content .type-content .module img {
    width: 200px;
    margin: -30px -15px;
}

/* 1. 外层容器：限制尺寸，隐藏原生滚动条 */
.s9 .content .type-content .custom-scroll-container {
    width: 1140px;
    height: 500px;
    margin-top: 25px;
    /* border: 1px solid #eb3838; */
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    /* 隐藏原生滚动条 */
}

/* 2. 内容容器：承载滚动内容，保留原生滚动逻辑（用于JS监听） */
.s9 .content .type-content .details-box {
    width: 1080px;
    height: 500px;
    /* margin-top: 24px; */
    overflow-y: auto;
    /* 只显示垂直滚动 */
    scrollbar-width: none;
    /* 隐藏 Firefox 原生滚动条 */
}

.s9 .content .type-content .details-box::-webkit-scrollbar {
    display: none;
}

/* 3. 自定义滚动条轨道 */
.custom-scrollbar-track {
    position: absolute;
    right: 40px;
    /* 距离容器右侧距离 */
    top: 45px;
    bottom: 45px;
    width: 6px;
    /* 轨道宽度 */
    border-radius: 8px;
    background: #0159fd12;
    /* 轨道背景色 */
    /* 初始隐藏，hover时显示 */
    /* transition: opacity 0.3s; */
}

/* 容器hover时显示轨道 */
/* .custom-scroll-container:hover .custom-scrollbar-track {
    opacity: 1;
} */

/* 4. 自定义滚动条滑块 */
.custom-scrollbar-thumb {
    position: absolute;
    right: -1px;
    width: 8px;
    height: 45px !important;
    /* 滑块宽度 = 轨道宽度 */
    border-radius: 8px;
    background: #015AFD;
    /* 滑块颜色 */
    cursor: pointer;
    opacity: 1;
    /* transition: background 0.2s; */
}

.s9 .content .type-content .details {
    width: 1080px;
    height: fit-content;
    background: #F9FAFB;
    box-shadow: inset -4px 4px 0px 0px #FFFFFF, inset 4px -4px 7px 0px rgba(0, 55, 155, 0.1);
    border-radius: 10px;
    border: 1px solid rgba(1, 90, 253, 0.15);
    margin: 35px 0 85px;
    padding: 20px 24px;
    position: relative;
}

.s9 .content .details-box :last-child {
    margin-bottom: 0;
}

.s9 .content .type-content .details h2 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 20px;
    color: #228DFF;
    line-height: 28px;
    position: absolute;
    top: -40px;
    left: 0;
}

.s9 .content .type-content .details .divir {
    width: 4px;
    height: 24px;
    background: #333333;
    border-radius: 0px 2px 2px 0px;
    position: absolute;
    left: -24px;
}

.s9 .content .type-content .details h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 20px;
    color: #333333;
}

.s9 .content .type-content .details .subtitle {
    /* font-family: PingFangSC, PingFang SC; */
    width: fit-content;
    font-weight: 500;
    font-size: 20px;
    color: #333333;
    margin: 15px 0 14px;
}

.s9 .content .type-content .details p {
    width: fit-content;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    margin-top: 12px;
    /* border: 1px solid rgb(253, 64, 1); */
}

.s9 .content .type-content .details .p-text::before {
    content: "";
    display: inline-block;
    /* 改为行内块，支持宽高 */
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 25px;
    /* 与文本保持间距 */
    vertical-align: middle;
    /* 与文本垂直居中对齐 */
    background-color: #015AFD;
}

.s9 .bottom {
    width: 1200px;
    padding: 50px 0 0;
    /* border: 1px solid rgb(253, 135, 1); */

}

.s9 .bottom .tips {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    margin-top: 20px;
    line-height: 22px;
    font-style: normal;
}

.s9 .bottom .change-box {
    width: 1200px;
    gap: 90px;
    margin-top: 50px;

}

.s9 .bottom .change-box .item,
.item-blue {
    /* border: 1px solid rgb(253, 135, 1); */
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}

.s9 .bottom .img {
    width: 36px;
    height: 36px;
}

.s9 .bottom .change-box .item h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 20px;
    color: #333333;
    margin: 10px 0 4px;

}

.s9 .bottom .change-box .item-blue h3 {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 20px;
    margin: 10px 0 4px;

    color: #228DFF;
}

.s9 .bottom .change-box .item p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    margin-bottom: 33px;
}

.s9 .bottom .change-box .item-blue p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #228DFF;
    margin-bottom: 0px;
}

.s9 .bottom .change-box .item-blue .triangle {
    width: 0;
    height: 0;
    margin-top: 15px;
    border: 10px solid transparent;
    border-bottom: 10px solid #1F2648;
    margin-left: 50%;
    transform: translateX(-50%);
}

.s10 {
    width: 100%;
    height: fit-content;
    padding: 40px 0 50px;
    background: linear-gradient(153deg, #1E284C 0%, #281C2F 100%);
}

.s10 .title {
    /* font-family: FZLTTHJW--GB1, FZLTTHJW--GB1; */
    font-weight: normal;
    font-size: 28px;
    color: #FFFFFF;
}

.s10 .content {
    width: 1200px;
    height: 500px;
    /* background: #D8D8D8; */
    border-radius: 10px;
    /* border: 1px solid rgb(253, 1, 1); */
    margin-top: 40px;
    position: relative;
}

.s10 .content .carousel-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    /* 横向排列轮播项 */
    overflow: hidden;
    /* 隐藏超出容器的内容 */
    /* border: 1px solid rgb(249, 253, 1); */
}

.s10 .content .carousel-wrapper .item-box {
    display: flex;
    justify-content: flex-start;
    /* border: 1px solid rgb(253, 1, 1); */
}

.carousel-item {
    /* min-width: 100%; */
    width: 1200px;
    /* 每个项占满容器宽度 */
    height: 100%;
    position: relative;
    /* border: 1px solid rgb(253, 1, 207); */

}

.carousel-item img {
    width: 1200px;
    height: 100%;
    object-fit: cover;
    /* 图片自适应容器 */
}

.s10 .title {
    font-weight: bold;
}

.s10 .content .text {
    width: 800px;
    height: 500px;
    background: #ffffffee;
    box-shadow: -20px 0px 60px 0px rgba(0, 0, 0, 0.5);
    border-radius: 0px 10px 10px 0px;
    /* opacity: 0.4; */
    padding: 37px 0 0 40px;
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(100%);
    opacity: 0;
    transition: transform 1s linear, opacity 1s linear;
}

.s10 .content .text.active {
    opacity: 1;
    transform: translateX(0);
}

.s10 .content .text .title {
    margin-bottom: 40px;
    /* border: 1px solid rgb(253, 1, 1); */
}

.s10 .content .text .title img {
    width: 22px;
    margin-right: 12px;
    /* border: 1px solid rgb(253, 1, 1); */
}

.s10 .content .text .title p {
    /* border: 1px solid rgb(253, 1, 1); */
    margin: 0;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 600;
    font-size: 24px;
    color: #333333;
    text-shadow: -20px 0px 60px rgba(0, 0, 0, 0.5);
}

.s10 .content .text .tip {
    width: 84px;
    height: 30px;
    background: #FFD7A7;
    box-shadow: -20px 0px 60px 0px rgba(0, 0, 0, 0.5);
    border-radius: 4px;
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 500;
    font-size: 16px;
    color: #FE7300;
    /* text-shadow: -20px 0px 60px rgba(0, 0, 0, 0.5); */
    margin-bottom: 8px;
}

.s10 .content .text p {
    /* font-family: PingFangSC, PingFang SC; */
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    text-shadow: -20px 0px 60px rgba(0, 0, 0, 0.5);
    margin-bottom: 35px;
}

/* 切换按钮 */
.carousel-btn {
    position: absolute;
    width: 60px;
    height: 60px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    cursor: pointer;
    z-index: 10;
}

.prev {
    left: -100px;
}

.next {
    right: -100px;
}

.rgt-slide {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
}