/* Reset CSS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.bacls{
    margin-right: 25px;
}
/* Body Styling */
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #ffffff;
    overflow-x: hidden;
}

/* Header Styling */
header {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    /* 确保 header 在最上层 */
    /* background: #052d84; */
    color: #ffffff;
    /* padding: 20px 0; */
    text-align: center;
    display: flex;
    align-items: center;
    /* 垂直居中 */
    justify-content: center;
    /* 水平居中 */
    /* gap: 20px; */
    transition: background-color 0.3s;
    height: 50px;
}

.company-name {
    max-width: 414px;
    min-width: 162px;
    font-size: 0.9rem;
    margin-left: 20vh;
    text-decoration: none;
    /* padding: 10px 20vh; */
    color: #ffffff;
    border-radius: 5px;
}

#navbar.transparent {
    background: transparent;
}

#navbar.scrolled {
    background-color: #052d84;
    color: white;
}
.tabs{
    width:100%;
    overflow: hidden;
}
.tabs ul {
    font-size: 0.7rem;
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.tabs ul li {
    margin: 5px 5px;
}

.tabs ul li a {
    text-decoration: none;
    padding: 10px 15px;
    color: #ffffff;
    border-radius: 5px;
}

.tabs ul li a:hover,
.tabs ul li a.active {
    background-color: #ffffff;
    color: #052d84;
}

/* 选中状态 */
.menu ul li a.active,
.menu ul li a:hover {
    color: #fff;
    /* 选中或悬停时字体颜色 */
}

.menu ul li a.active::after,
.menu ul li a:hover::after {
    content: '';
    display: block;
    width: 40px;
    /* 下划线宽度 */
    height: 3px;
    /* 下划线厚度 */
    background-color: #fff;
    /* 下划线颜色 */
    position: absolute;
    bottom: -5px;
    /* 下划线距离文字的距离 */
    left: 50%;
    transform: translateX(-50%);
}

.language-switcher {
    margin-left: auto;
    /* 将语言切换器推到最右边 */
}

.language-switcher select {
    padding: 5px 10px;
    font-size: 0.7rem;
    border: none;
}

.hometitle {
    font-weight: bold;
    font-size: 1.2rem;
    text-align: left;
    min-width: 195px;
    margin-left: 30%;
}

.hometitle2 {
    margin-bottom: 20px;
    height: 50px;
    font-size: 1.5rem;
    font-family: PingFang SC, PingFang SC-Medium;
    font-weight: Medium;
    text-align: left;
    color: #131e62;
    letter-spacing: 0.02px;
    /* margin-left: 30%; */
}

.homemessage {
    font-weight: bold;
    font-size: 1.5rem;
    text-align: left;
    min-width: 228px;
    margin-left: 30%;
}
@media (max-width: 400px) {
    .company-name {
        margin-left: 10vh;
    }
}
/* 媒体查询：在移动端纵向排列菜单 */
@media (max-width: 1080px) {
    .company-name {
        /* padding: 10px 40vh; */
    }
    .homeTitle {
        margin-bottom: 50px;
    }

    .tabs ul {
        flex-direction: column;
        align-items: center;
    }

    .tabs ul li {
        margin: 8px 0;
    }

    .service-content {
        flex-direction: column;
    }

    .service-left {
        transform: translateY(-50px);
        /* 初始位置在上方 */
    }

    .service-right {
        transform: translateY(50px);
        /* 初始位置在下方 */
    }

    .service-left.show,
    .service-right.show {
        transform: translateY(0);
        /* 渐入效果 */
    }

    .service-item2 {
        flex-direction: column;
        align-items: center;
        overflow-x: hidden;
    }

 

    .hero h2 {
        height: 50px;
        font-size: 1.1rem;
        /* margin-bottom: 50px; */
    }



    .form_cls {
        margin-top: calc(15vh + 50px);
    }

    .select_lable {
        color: #999;
        font-style: normal;
        opacity: 1;
    }
}

/*  */

/* Main Section Styling */
main {
    background-color: #ffffff;
    border: 2px rgba(255, 255, 255, 0.00);
}

/* Hero Section */
.hero {
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    /* 防止背景图片重复 */
    /* 添加一些内边距 */
    color: #ffffff;
    /* 设置文本颜色为白色，以便在深色背景上可见 */
    /* padding: 120px 250px 120px 250px; */
    padding: 30vh 205px 0px 30px;
    text-align: center;
    align-items: center;
}

.home {
    background-image: url('../images/home_bg1.webp');
    /* 替换为你的图片路径 */
    /* background-size: 100% auto; */
    /* 使背景图片宽度100%，高度等比例自动调整 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    min-height: 470px;
    width: 100%;
}

.ai {
    background-image: url('../images/ai_bg1.webp');
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    min-height: 470px;
    width: 100%;
    /* 防止背景图片重复 */
    /* 添加一些内边距 */
    color: #ffffff;
    padding-top: 140px;

    /* 设置文本颜色为白色，以便在深色背景上可见 */
    /* padding: 120px 250px 120px 250px; */


}

.container {
    display: flex;
    flex-direction: column;
    /* 垂直排列子元素 */
    justify-content: center;
    /* 垂直居中 */
    align-items: self-start;
    padding: 1% 52% 1% 15%;
}

.container_par {
    display: flex;
    flex-direction: column;
    /* 垂直排列子元素 */
    justify-content: center;
    /* 垂直居中 */
    align-items: self-start;
    padding: 1% 52% 1% 15%;
}

.container_join {
    display: flex;
    flex-direction: column;
    /* 垂直排列子元素 */
    justify-content: center;
    /* 垂直居中 */
    align-items: center;
    padding: 1% 15% 1% 15%;
}

.stitle {
    margin-left: 30px;
    font-weight: bold;
    font-size: 1.5rem;
    text-align: left;
    /* width: 400px; */
}

.sp {
    margin-left: 30px;
    display: flex;
    margin-top: 10px;
    font-size: 0.8rem;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: justify;
    color: #ffffff;
    line-height: 28px;
    letter-spacing: 0.02px;
    margin-bottom: 30px;
    width: 400px;
}

.aititle {
    font-weight: bold;
    font-size: 1.5rem;
    text-align: center;
    max-width: 580px;
    min-width: 200px;
}

.aip {
    display: flex;
    margin-top: 10px;
    font-size: 0.8rem;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: justify;
    color: #ffffff;
    line-height: 23px;
    letter-spacing: 0.02px;
    margin-bottom: 30px;
    max-width: 581px;
    min-width: 200px;
}

.parents,
.parents-cn {
    background-image: url('../images/parents_bg.webp');
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    height: 470px;
    width: 100%;
    color: #ffffff;
    padding-top: 110px;
}

.school {
    background-image: url('../images/school_bg.webp?v=202409101801');
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    min-height: 470px;
    width: 100%;
}



.company {
    background-image: url('../images/banner.webp');
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    min-height: 470px;
    width: 100%;
}

.jobs {
    background-image: url('../images/jobs_bg.webp?v=202409101801');
    min-height: 470px;
    width: 100%;
}

.contact {
    background-image: url('../images/contact_bg.webp');
    min-height: 470px;
    width: 100%;
}

.yj {
    background-image: url('../images/bg_img.jpeg');
    color: #131e62;
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    width: 100%;
    height: auto;
}

.history {
    background-image: url('../images/history_img.jpeg');
    color: #ffffff;
    padding: 0px 20vh 0 65vh;
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    width: 100%;
    height: auto;
}

.change {
    /* background-color: #ffffff; */
    background-image: url('../images/bg_img.jpeg');
    color: #131e62;
}



h2 {
    font-size: 1.5rem;
    margin-bottom: 10px;
    text-align: left;
    height: 50px;
    font-family: PingFang SC, PingFang SC-Medium;
    font-weight: Medium;
    text-align: left;
    line-height: 50px;
    letter-spacing: 0.02px;
}


/* .hero p {
    font-size: 0.8rem;
    text-align: left;
    width: 100%;
} */


.hero2 {
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    /* 防止背景图片重复 */
    padding: 5% 15% 1% 15%;
    text-align: center;
    align-items: center;
}

h3 {
    height: 50px;
    font-size: 1.2rem;
    font-family: PingFang SC, PingFang SC-Medium;
    font-weight: Medium;
    text-align: left;
    color: #131e62;
    line-height: 50px;
    letter-spacing: 0.02px;
}

.div_his h3 {
    font-size: 1.2rem;
    text-align: center;
    width: 100%;
    color: #ffffff;
}

.hero2 h3 {
    font-size: 1.2rem;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: center;
    /* color: #5f7395; */
    /* line-height: 28px; */
    letter-spacing: 0.02px;
    width: 100%;
    /* min-width: 600px; */
}

.homep {
    margin-top: 10px;
    font-size: 0.8rem;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: justify;
    color: #5f7395 !important;
    line-height: 28px;
    letter-spacing: 0.02px;
    margin-bottom: 30px;
}

p {
    font-size: 0.8rem;
    text-align: left;
    width: 100%;
}

.div_his {
    margin-left: 20vh;
    max-width: 300px;
    height: 240px;
    opacity: 0.6;
    color: #FFFFFF;
    /* background: #032c83; */
    background: radial-gradient(circle, #4a90e2, #1c3b70);
    /* background: radial-gradient(#032c83, rgba(51, 89, 205, 0.8)); */
}

.div_his h2 {
    font-size: 1rem;
    margin-bottom: 10px;
    text-align: center;
    width: 100%;
}


.div_his p {
    font-size: 0.7rem;
    text-align: left;
    width: 90%;
    margin: 0 10px 10px 10px;
}

.services2 {
    /* display: flex; */
    justify-content: center;
    align-items: center;
    overflow: hidden;
    padding: 20px 0;
    overflow-x: hidden;
}

.service-item2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.card {
    display: inline-block;
    max-width: 357px;
    /* max-width: 500px;
    min-width: 350px; */
    height: 457px;
    margin-right: 5px;
    margin-left: 5px;
    background-size: cover;
    background-position: center;
    color: white;
    padding: 10px;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
    border-radius: 5px;
    text-align: center;
}


.card h2 {
    padding: 260px 0 0 30px;
    font-size: 1.2rem;
    margin-bottom: 10px;
    text-align: left;
    width: 100%;
}

.card p {
    margin-top: 50px;
    padding: 0 30px 0 30px;
    font-size: 0.8rem;
    text-align: left;
    width: 100%;
}


/* Services Section */
.services {
    /* margin: 20px 0 10px 0; */
}

.services h2 {
    text-align: left;
    margin: 20px;
    font-size: 2rem;
}

.service-item {
    display: flex;
    flex-wrap: wrap;
}

.service-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1% 15% 1% 15%
}

.bgcolor1 {
    /* background-color: #f0f0f0; */
    background-image: url('../images/home_bg2.jpeg');
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    /* 防止背景图片重复 */
}

.bgcolor2 {
    background-color: #ffffff;
}

.service-left,
.service-right {
    opacity: 0;
    transition: opacity 1s ease, transform 1s ease;
}

.service-left {
    flex: 1;
    padding: 20px;
    transform: translateX(-300px);
    /* 初始位置在左侧 */
}

.service-right {
    flex: 1;
    padding: 20px;
    transform: translateX(300px);
    /* 初始位置在右侧 */
}

.service-left p,
.service-right p {
    margin-top: 10px;
    /* text-indent: 2em; */
    font-size: 0.8rem;
    max-width: 581px;
    min-width: 300px;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: justify;
    color: #5f7395;
    line-height: 28px;
    /* letter-spacing: 0.02px; */
}

.service-left img,
.service-right img {
    max-width: 100%;
    min-width: 250px;
    height: auto;
    border-radius: 8%;
}

.service-left.show,
.service-right.show {
    opacity: 1;
    transform: translateX(0);
    /* 渐入效果 */
}

.service-left h3,
.service-right h3 {
    margin-bottom: 20px;
    height: 50px;
    font-size: 1.2rem;
    font-family: PingFang SC, PingFang SC-Medium;
    font-weight: Medium;
    text-align: left;
    color: #131e62;
    letter-spacing: 0.02px;
}

.titleCls {
    line-height: 30px;
}

/* CTA Section */
.cta {
    text-align: center;
    margin: 30px 0;
}

.cta .button {
    background: #35424a;
    color: #ffffff;
    padding: 15px 30px;
    text-decoration: none;
    font-size: 1.2rem;
    border-radius: 5px;
}

.cta .button:hover {
    background: #1a1a1a;
}

.hero3 {
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    background-position: center;
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    /* 防止背景图片重复 */
    padding: 10% 15% 10% 15%;
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center;
    /* 水平居中 */
}


.hero3 h3 {
    line-height: 25px;
    font-size: 1.2rem;
    margin-bottom: 5px;
    text-align: center;
    width: 100%;
    max-width: 600px;
}


.hero3 p {
    font-size: 0.8rem;
    text-align: left;
    width: 100%;
    max-width: 600px;
}

/* Footer Styling */

footer {
    background-image: url('../images/foot_img.jpeg');
    /* 替换为你的图片路径 */
    background-size: cover;
    /* 使背景图片覆盖整个区域 */
    /* background-position: center; */
    /* 使背景图片居中 */
    background-repeat: no-repeat;
    color: #ffffff;
    padding: 20px 0;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    font-size: 16px;
    width: 100%;
    /* height: 319px; */
}

.footer-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 100vh;
    margin: 0 auto;
    padding: 0 12vh;
    font-size: 12px;
}

.footer-column {
    font-weight: inherit !important;
}

.footer-column h2 {
    margin-bottom: 20px;
    font-size: 0.7rem;
    font-weight: bold;
    width: 128px;
    /* line-height: 25px; */
}

.footer-column h3,
.footer-column .coc a {
    font-size: 0.7rem;
    font-weight: bold;
    color: #ffffff;
}

.footer-column p {
    margin-bottom: 20px;
    font-size: 0.6rem;
    color: #ffffff;
}

.footer-column ul {
    list-style-type: none;
    padding: 0;
}

.footer-column ul li {
    margin-bottom: 10px;
    font-size: 0.6rem;
}

.footer-column ul li a,
.footer-column h3 a
 {
    text-decoration: none;
    font-size: 0.6rem;
    color: #ffffff;
}

.footer-column ul li a:hover {
    text-decoration: underline;
}

.footer-bottom {
    text-align: center;
    margin-top: 20px;
    border-top: 1px solid #2a3a5f;
    padding-top: 13px;
}


.footer-bottom p {
    margin: 5px 0;
    font-size: 0.6rem;
    text-align: center;
}

.footer-bottom a {
    color: #ffffff;
    text-decoration: none;
}

.footer-bottom a:hover {
    text-decoration: underline;
}

.line {
    width: 2px;
    height: 165px;
    opacity: 0.31;
    background: radial-gradient(#ffffff, rgba(255, 255, 255, 0.00));
}

.line2 {
    width: 1920px;
    height: 1px;
    opacity: 0.3;
    border: 1px solid #6e7bc6;
}

.yinsi {
    /* width: 200px; */
    font-size: 0.7rem;
    font-weight: lighter;
}

@media (max-width: 480px) {
    .footer-column h2 {
        width:63px;
        line-height: 25px;
        margin-top: 12px;
    }
}
@media (max-width: 430px) {
    .footer-column ul li,
    .footer-column ul li a,
    .footer-column h3 a,
    .footer-bottom p {
        font-size: 0.4rem;
    }
    .footer-column h3,
    .footer-column .coc a{
        font-size: 0.5rem;
    }
    .footer-column h2 {
        font-size: 0.6rem;
    }
}




input[type="text"]::placeholder,
input[type="email"]::placeholder,
textarea::placeholder {
    color: #999;
    font-style: normal;
    opacity: 1;
    font-size: 0.8rem;
}



.floating-image {
    position: absolute;
    top: 280px;
    left: 50%;
    transform: translateX(-50%);
    width: 70%;
    max-width: 900px;
    border-radius: 10px;
    display: flex;
    overflow: hidden;
}

.floating-image .content {
    flex: 1;
    padding: 20px;
}

.floating-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 10px;
}

.floating-image .text {
    flex: 1;
    padding: 20px;
}

.form_cls {
    /* margin-top: 90px; */
    margin-top: calc(25vh + 90px);
}

.dark-background {
    /* background-color: rgba(0, 0, 0, 0.3);  */
    color: white;
    /* 白色文字 */
    padding: 10px;
    /* 内边距 */
    border-radius: 5px;
    /* 圆角 */
    font-size: 0.8rem;
}

@media (max-width: 690px) {
    .form_cls {
        margin-top: 90px;
        /* margin-top: calc(25vh + 50px); */
    }
}

@media (min-width: 690px) and (max-width: 1090px) {
    .form_cls {
        margin-top: calc(25vh + 50px);
    }
}

@media (min-width: 970px) {
    .hero {
        padding: 166px 533px 80px 120px;
    }
    .footer-column h2{
        line-height: 46px;
    }

    h2 {
        line-height: 35px;
    }
    .service-left h3, .service-right h3 {
        line-height: 26px;
    }
}

@media (min-width: 660px) and (max-width: 1080px) {
    .hometitle2 {
        line-height: 35px;
    }
}

@media (max-width: 510px) {
    .hometitle2 {
        line-height: 30px;
        margin-bottom: 80px;
    }
    .footer-container {
        padding: 0 1vh;
    }
    .stitle {
        min-width: 290px;
    }
    .service-left h3, .service-right h3 {
        line-height: 26px;
    }
}

@media (min-width: 510px) and (max-width: 650px) {
    .hometitle2 {
        line-height: 30px;
        margin-bottom: 40px;
    }

    .service-left h3,
    .service-right h3 {
        line-height: 35px;
    }

    .footer-container {
        padding: 0 10vh;
    }
}

@media (min-width: 500px) {
    .container {
        align-items: center;
        padding: 1% 15% 1% 15%;
    }
} 
@media (max-width: 500px) {
    /* .container {
        padding: 1vh 0 0 17vh;
    } */
    .aip{
        min-width: 290px;
       }
}


@media (min-height: 1000px) {
    .form_cls {
        margin-top: 0;
    }
}

@media (min-height: 738px) and (max-height: 1000px) {
    .form_cls {
        margin-top: calc(10vh + 50px);
    }
}

@media (min-height: 600px) and (max-height: 738px) {
    .form_cls {
        margin-top: calc(15vh + 50px);
    }
}

@media (max-height: 600px) {
    .form_cls {
        margin-top: calc(6vh + 50px);
    }
}

@media (min-width: 600px) and (max-width: 1000px) {
    .form_cls {
        margin-top: calc(6vh + 30px);
    }
}

@media (max-width: 600px) {
    .form_cls {
        margin-top: calc(6vh + 0px);
    }
    .div_his {
        margin-left: 2vh;
    }
    .div_his p {
        font-size: 0.5rem;
    }
    .history {
        padding: 0px 2vh 0 0vh;
    }
}

@media (max-width: 750px) {
    .floating-image {
        top: 350px;
    }
}

@media (min-width: 600px)  and (max-width: 900px) {
    .history {
        padding: 0px 20vh 0 25vh;
    }
}

@media (max-width: 1100px) {
    .container_par {
        padding: 0% 15% 0% 10%;
    }
    .parents{
        padding-top: 80px;
    }
    .parents-cn{
        padding-top: 150px;
    }
}

/* @media (max-width: 480px) {
    .card {
        display: block;
        border-radius: 5px;
    }

    .card img {
        width: 200px;
        height: 247px;
    }
} */

.valcls{
    width:100px;
    font-size: 1.4rem;
    font-weight: bold;
}

.btn_join {
    cursor: pointer;
    margin-bottom: 40px;
    margin-top: 20px;
    border: none;
    color: #FFFFFF;
    width: 106px;
    height: 43px;
    background: linear-gradient(169deg, #339be3 0%, #032c83 100%);
    border-radius: 7px;
}
.monval {
    padding: 5% 15% 2% 15%;
    text-align: center;
}