#title2 {
    display: none;
}

#footer2 {
    display: none;
}

#enContainer {
    display: none;
}

.page-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100vh;
    background-color: #FFFCF3;
}


.gradient-underline {
    /*position: absolute;*/
    /*left: 3.8%;*/
    height: 0.76rem;
    margin-top: -4px;

    background: linear-gradient(90deg, #EAD836 0%, rgba(132, 122, 30, 0) 100%);
    z-index: 1;

}

.main-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    /*     background-image: url('./images/bg.png');
         background-size:100% 100%;*/
}

.info-container {
    /*margin:7rem 5.6rem 4% 5.6rem;*/
    /*width: calc(100% - 240px);*/
    /*padding:6.2% 6% 3.5% 6%;*/
    /*padding:6.2% 0 3.5% 0;*/
    width: calc(100% - 10rem);
    /*background: rgba(255,255,255,0.8);*/
    /*border-radius: 56px;*/
    display: flex;
    flex-direction: column;
    justify-content: center;

}


.title-img {
    margin-top: 5.8%;
    width: 60%;
}

.footer-img {
    width: 100%;
}

.change-btn {
    position: absolute;
    right: 2%;
    color: #121590;
}

.chinese {
    padding: 5px 15px;
    background-color: #FFFFFF90;
    border-radius: 8px;
    font-size: 1.5rem;
    cursor: pointer;
}

.english {
    padding: 5px 15px;
    background-color: #FFFFFF90;
    border-radius: 8px;
    font-size: 1.5rem;
    cursor: pointer;
}

.row-box {
    margin: 0px 5.3rem;
    width: calc(100% - 10.6rem);
    display: inline-flex;
    justify-content: space-around;
}

.card-box {
    flex: 1;
    /*width:40%;*/
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    overflow: hidden;
}

.card-title {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /*width:100%;*/
    padding-left: 1.25rem;
    /*position: relative;*/
}

.card-title img {
    height: 2.1rem;
    overflow: hidden;
    width: auto;
    z-index: 2;
    /*height: 23px;*/
    /*max-height: 30px;*/

    /*height: 30px;*/
    /*width:auto;*/
}


#enContainer .card-title img {
    height: 2.75rem;
}

.card-box-bg {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 12.25rem;
    background: white;
    border-radius: 20px;
    margin-top: -4px;
    color: #494B9E;
    /*height: 100%;*/
    align-items: center;
    justify-content: center;
}

/*最后一个*/
.last-box-bg {
    height: 18rem !important;

}

.card-sub-title {
    display: inline-flex;
    align-items: center;
    color: #494B9E;
    font-size: 1.25rem;
}

.item-footer {
    background: #FFFBD9;
    font-size: 1rem;
    height: 3.1rem;
    text-align: center;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-bottom-right-radius: 11px;
    border-bottom-left-radius: 11px;
    /*line-height: 3.1rem;*/
}


.last-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    max-width: 90%;
}

.last-content div {
    width: 100%;

    display: inline-flex;
    align-items: center;
    margin-top: 0.4rem;
    font-size: 1rem;
}

.bg-top-items {
    display: inline-flex;
    justify-content: space-between;
    flex: 1;
    align-items: center;
    width: calc(100% - 4rem);
}

.contact-box {
    margin-top: 4.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.card-desc {
    font-size: 1rem;
    margin-top: 0.5rem;
    max-width: 90%;
    color: #494B9E;
}

.contact_cn {
    width: auto;
    height: 2.1rem;
    margin-bottom: 0.6rem;
}


.contact_en {
    width: auto;
    height: 2.1rem;
    margin-bottom: 0.6rem;
}

.contact_en_phone {
    font-size: 1.8rem;
    color: #494B9E;
    text-decoration: underline;
}


/* 当屏幕宽度小于1080像素时应用这些样式 */
@media screen and (max-width: 900px) {
    .page-container {
        height: auto;
        min-height: 100vh;
        /* 小于1080像素时的另一套样式 */
    }


    #footer {
        content: url('./images/mobile/pcc/pic_connection.png');
    }

    .main-container {
        background-size: 100% auto;
    }

    #headerDiv {
        background-image: url('./images/mobile/acc/bg_head1.png');
        /*height: 3.8rem;*/
        background-size: cover;
    }

    #pccHeader {
        content: url('./images/mobile/pcc/bg_head2.png');
    }

    #pccHeaderEn {
        content: url('./images/mobile/pcc/en/bg_head2.png');
    }

    #accHeader {
        content: url('./images/mobile/acc/bg_head2.png') !important;
    }

    #accHeaderEn {
        content: url('./images/mobile/acc/en/bg_head2.png') !important;
    }

    #courseTitle {
        width: 80% !important;
        content: url('./images/mobile/pcc/pic_course.png');
    }

    #courseTitleEn {
        width: 80% !important;
        content: url('images/mobile/pcc/en/pic_course.png');
    }

    #footer {
        content: url('./images/mobile/pcc/pic_connection.png');
    }

    #footer2 {
        content: url('./images/mobile/pcc/en/pic_connection.png');
    }

    #teacherTitle {
        width: 80% !important;
        content: url('./images/mobile/pcc/pic_supervisor.png');
    }

    #teacherTitleEn {
        width: 80% !important;
        content: url('./images/mobile/pcc/en/pic_supervisor.png');
    }

    .course-type-btn {
        width: 78px !important;
        height: 26px !important;
        font-size: 12px !important;
        line-height: 26px !important;
    }

    .btn-split {
        width: 10px !important;
    }

    .teacher-introduct {
        width: 100%;
        margin:0 !important;
        padding:0 !important;
        display: flex;
        flex-direction: column !important;
        align-items: center !important;
        img {
            width: 93.6% !important;
            margin-right:0px !important;
        }

        #pccTeacher1 {
            content: url('./images/mobile/pcc/pic_supervisor1.png');
        }

        #pccTeacher2 {
            content: url('./images/mobile/pcc/pic_supervisor2.png');
        }

        #pccTeacher3 {
            content: url('./images/mobile/pcc/pic_supervisor3.png');
        }

        #pccTeacher4 {
            content: url('./images/mobile/pcc/pic_supervisor4.png');
        }


        #accTeacher1 {
            content: url('./images/mobile/acc/pic_supervisor1.png');
        }

        #accTeacher2 {
            content: url('./images/mobile/acc/pic_supervisor2.png');
        }

        #accTeacher3 {
            content: url('./images/mobile/acc/pic_supervisor3.png');
        }

        #accTeacher4 {
            content: url('./images/mobile/acc/pic_supervisor4.png');
        }

        #accTeacher1En {
            content: url('./images/mobile/acc/en/pic_supervisor1.png');
        }

        #accTeacher2En {
            content: url('./images/mobile/acc/en/pic_supervisor2.png');
        }

        #accTeacher3En {
            content: url('./images/mobile/acc/en/pic_supervisor3.png');
        }

        #accTeacher4En {
            content: url('./images/mobile/acc/en/pic_supervisor4.png');
        }

    }

    .course-introduct {
        width: 100%;
        margin:0 !important;
        display: flex;
        flex-direction: column !important;
        align-items: center !important;
        img {
            width: 93.6%;
            margin-right:0px;
        }

        /*移动端资源替换*/
        #pccCourse1 {
            content: url('./images/mobile/pcc/pic_module1.png');
        }

        #pccCourse2 {
            content: url('./images/mobile/pcc/pic_module2.png');
        }

        #pccCourse3 {
            content: url('./images/mobile/pcc/pic_module3.png');
        }

        #pccCourse4 {
            content: url('./images/mobile/pcc/pic_module4.png');
        }

        #pccCourse5 {
            content: url('./images/mobile/pcc/pic_module5.png');
            width: 93.5% !important;
        }

        #pccCourse1En {
            content: url('./images/mobile/pcc/en/pic_module1.png');
        }

        #pccCourse2En {
            content: url('./images/mobile/pcc/en/pic_module2.png');
        }

        #pccCourse3En {
            content: url('./images/mobile/pcc/en/pic_module3.png');
        }

        #pccCourse4En {
            content: url('./images/mobile/pcc/en/pic_module4.png');
        }

        #pccCourse5En {
            content: url('./images/mobile/pcc/en/pic_module5.png');
            width: 93.6% !important;
        }

        #accCourse1 {
            content: url('./images/mobile/acc/pic_module1.png');
        }

        #accCourse2 {
            content: url('./images/mobile/acc/pic_module2.png');
        }

        #accCourse3 {
            content: url('./images/mobile/acc/pic_module3.png');
        }

        #accCourse4 {
            content: url('./images/mobile/acc/pic_module4.png');
        }

        #accCourse5 {
            content: url('./images/mobile/acc/pic_module5.png');
            width: 93.5%;
        }

        #accCourse1En {
            content: url('./images/mobile/acc/en/pic_module1.png');
        }

        #accCourse2En {
            content: url('./images/mobile/acc/en/pic_module2.png');
        }

        #accCourse3En {
            content: url('./images/mobile/acc/en/pic_module3.png');
        }

        #accCourse4En {
            content: url('./images/mobile/acc/en/pic_module4.png');
        }

        #accCourse5En {
            content: url('./images/mobile/acc/en/pic_module5.png');
            width: 93.5%;
        }
    }




    .card-title {
        padding-left: 1rem;
    }


    .row-box {
        margin: 0px 1.2rem !important;
        width: calc(100% - 2.4rem);
        display: flex;
        flex-direction: column;

    }


    .row-box .card-box {
        margin-top: 3.75rem !important;
    }

    .row-box .first-card-box {
        margin-top: 1rem !important;
    }


    .card-desc {
        font-size: 1rem;
        margin-top: 0.5rem;
        color: #494B9E;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        text-align: center;
    }

    #title2 {
        width: 80%;
        height: auto;
        /*margin-top: 6rem;*/
    }

    .card-title img {
        max-width: 100% !important;
        height: auto !important;
        /*height: 1rem;*/
    }


    .card-title .small-title {
        width: auto;
        height: 0.8rem !important;
    }


    .card-title .small-title-cn {
        width: auto;
        height: 1rem !important;
    }

    .gradient-underline {
        width: auto !important;
    }

    .bg-top-items {
        width: calc(100% - 2rem);

        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }

    .bg-top-items div:first-of-type {
        margin-top: 0.8rem;

    }

    .bg-top-items div:last-of-type {
        margin-bottom: 0.8rem;

    }

    .bg-top-items .no-margin {
        margin-top: 0rem !important;
    }


    .card-box-bg {
        min-height: 12.25rem;
        height: auto;
    }

    .item-footer {
        min-height: 4rem;
        height: auto;
        padding: 0px 0.8rem;
        width: calc(100% - 1.6rem);
    }

    .contact_cn {
        width: 50%;
        height: auto;
    }

    .contact_en {
        width: 80%;
        height: auto;
    }

    .contact_en_phone {
        font-size: 1.2rem;
    }

    .chinese {
        font-size: 1rem;
    }

    .english {
        font-size: 1rem;
    }
}

.cn-container {
    background-image: url('./images/bg_texture.png');
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    background-color: #FFFCF3;
}


.header-div {
    height: 5.15625rem;
    width: 100%;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-image: url('./images/bg_head1.png');
    background-size: cover;
    background-repeat: no-repeat;


    .change-course-btn {
        height: 5.15625rem;
        display: inline-flex;
        align-items: center;

    }
}

.bg_head2 {
    width: 100%;
    height: auto;
}

.course-type-btn {
    width: 8rem;
    height: 2.6rem;
    line-height: 2.6rem;
    background: #F7F7F7;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    font-size: 1.146rem;
}

.selected {
    background: #D39A07;
    color: white;
}


.web-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.small-introduct-img {
    width: calc(95% / 2);
    margin-right: 5%;
}

.course-introduct {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin:0px 5%;
}

.course-introduct .small-introduct-img:nth-child(2n+2) {
    margin-right: 0px;
}

.teacher-introduct-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background: linear-gradient(180deg, #FFFCF3 0%, #FFF4D3 56%);
}

#courseTitle {
    width: 31.3%;
    margin-top: 6.25%;
    margin-bottom: 3.6%;
}

#teacherTitle {
    width: 31.3%;
    margin-top: 6.25%;
    margin-bottom: 3.6%;
}

#courseTitleEn {
    width: 31.3%;
    margin-top: 6.25%;
    margin-bottom: 3.6%;
}

#teacherTitleEn {
    width: 31.3%;
    margin-top: 6.25%;
    margin-bottom: 3.6%;
}


.teacher-introduct {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0px 7.7% 3% 7.7%;
    justify-content: center;

    .small-teacher-introduct-img {
        width: calc((100% - 15.4%) / 2);
        margin-right: 8.2%;
        margin-bottom: 4.1%;
    }

    .small-teacher-introduct-img:nth-child(2n+2) {
        margin-right: 0px;
    }
}


.btn-split {
    width: 2rem;
}

#accCourse5 {
    width: 100%;
}

#accCourse5En {
    width: 100%;
}

#pccCourse5 {
    width: 100%;
}