.content-section {
    padding: 120px 300px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    width: 100%;
    box-sizing: border-box;
    background-image: url(/static/images/背景素材-1.svg);
    align-items: center;
}

.block {
    display: flex;
    flex-direction: column;
}
.title{
    font-size: 64px;
    line-height: 100%;
}
.top-left .title {
    text-align: center;
    color: #00479c;
    margin-bottom: 40px;
}

.top-right, .bottom-left {
    border: 30px solid #00479c;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.block-image {
    max-width: 100%;
    height: auto;
}
.top-left{
    width: 519px;
    padding: 10px;
    margin: 0px auto;
    justify-content: center;
}
.bottom-right {
    width: 100%;
    padding: 10px 20px;
    margin: 0px auto;
    justify-content: center;
}
.top-left h3{
    font-size: 24px;
    line-height: 120%;
    text-align: center;
    color: #00479c;
}

.bottom-right p{
    font-size: 24px;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    color: #00479c;
}
.people-section {
    padding: 120px 300px;
    box-sizing: border-box;
    background-image: url(/static/images/背景素材-1.svg);
}

.section-title {
    font-size: 64px;
    line-height: 100%;
    text-align: center;
    margin-bottom: 120px;
    color: #00479c;
}

.block-container {
    display: flex;
    justify-content: center;
    gap: 80px;
}

.block-item {
    width: 221px;
    text-align: center;
}

.item-title {
    font-size: 64px;
    line-height: 100%;
    margin-bottom: 24px;
    color: #fa9405;
}

.separator {
    width: 100%;
    height: 4px;
    background-color: #0056bc;
    margin: 24px 0;
}

.item-heading {
    font-size: 48px;
    line-height: 100%;
    margin-top: 24px;
    color: #0056bc;
}

.new-section-two {
    padding: 60px 300px;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

.content-container {
    margin: 0 auto;
    display: flex;
    position: relative;
}

.section-image {
    flex: 1;
    max-width: 50%;
    height: auto;
}

.text-content {
    flex: 1;
    padding-left: 40px;
    position: relative;
}

.text-content p {
    font-size: 16px;
    line-height: 150%;
    margin: 0 0 20px 0;
}

/* Responsive Design - Mid-Large Screens (1024px to 1919px) */
@media screen and (max-width: 1919px) {
    .content-section {
        padding: 80px 60px;
        justify-content: center;
    }
    .top-left, .bottom-right {
        width: 80%;
    }
    .title, .section-title {
        font-size: 56px;
    }
    .section-title{
        margin-bottom: 40px;
    }
    .top-left h3, .bottom-right h3 {
        font-size: 22px;
    }
    .people-section {
        padding: 80px 60px;
    }
    .block-container {
        gap: 60px;
    }
    .block-item {
        width: 200px;
    }
    .item-title {
        font-size: 56px;
    }
    .item-heading {
        font-size: 40px;
    }
    .new-section-two {
        padding: 40px 60px;
    }
    .new-section-two2 {
        padding: 40px 60px;
    }
    .section-image {
        max-width: 45%;
    }
    .text-content {
        padding-left: 30px;
    }
    .text-content2 {
        padding-right: 30px;
    }
}

/* Responsive Design - Tablet (768px to 1024px) */
@media screen and (max-width: 1024px) {
    .content-section, .people-section, .new-section-two, .new-section-two2 {
        padding: 60px 40px;
    }
    .content-section {
        grid-template-columns: 1fr;
        gap: 40px;
        justify-content: center;
    }
    .top-left, .bottom-right {
        width: 100%;
    }
    .title, .section-title {
        font-size: 48px;
    }
    .section-title{
        margin-bottom: 40px;
    }
    .top-left h3, .bottom-right h3 {
        font-size: 20px;
    }
    .block-container {
        gap: 40px;
    }
    .block-item {
        width: 180px;
    }
    .item-title {
        font-size: 48px;
    }
    .item-heading {
        font-size: 36px;
    }
    .content-container {
        flex-direction: column;
    }
    .section-image {
        max-width: 100%;
        margin-bottom: 20px;
    }
    .text-content, .text-content2 {
        padding: 0;
    }
    .section-button, .section-button2 {
        position: static;
        width: 100%;
        margin-top: 20px;
    }
}

/* Responsive Design - Mobile (below 768px) */
@media screen and (max-width: 768px) {
    .content-section, .people-section, .new-section-two, .new-section-two2 {
        padding: 40px 20px;
    }
    .content-section {
        justify-content: center;
    }
    .title, .section-title {
        font-size: 36px;
    }
    .section-title{
        margin-bottom: 40px;
    }
    .top-left h3, .bottom-right h3 {
        font-size: 18px;
    }
    .block-container {
        flex-direction: column;
        align-items: center;
    }
    .block-item {
        width: 100%;
    }
    .item-title {
        font-size: 36px;
    }
    .item-heading {
        font-size: 24px;
    }
    .content-container {
        flex-direction: column;
    }
    .section-image {
        max-width: 100%;
        margin-bottom: 20px;
    }
    .text-content, .text-content2 {
        padding: 0;
    }
    .section-button, .section-button2 {
        position: static;
        width: 100%;
        margin-top: 20px;
    }
}