html {
    margin: 0;
    padding: 0;
    /* 使用 clamp() 函数实现流体排版，自动适应不同屏幕尺寸 */
    /* 在 320px 屏幕上为 14px，在 1920px 屏幕上为 18px */
    font-size: clamp(14px, 1.5vw, 18px);
}

/* 针对超小屏幕设备 */
@media screen and (max-width: 359px) {
    html {
        font-size: 12px;
    }
}

/* 针对小屏幕手机 */
@media screen and (min-width: 360px) and (max-width: 413px) {
    html {
        font-size: 13px;
    }
}

/* 针对大屏手机 */
@media screen and (min-width: 414px) and (max-width: 539px) {
    html {
        font-size: 14px;
    }
}

/* 针对小尺寸平板（竖屏） */
@media screen and (min-width: 540px) and (max-width: 767px) {
    html {
        font-size: 14px;
    }
}

/* 针对中等尺寸平板（横屏） */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    html {
        font-size: 15px;
    }
}

/* 针对小屏幕笔记本电脑和大平板 */
@media screen and (min-width: 1024px) and (max-width: 1279px) {
    html {
        font-size: 16px;
    }
}

/* 针对中等屏幕桌面电脑 */
@media screen and (min-width: 1280px) and (max-width: 1439px) {
    html {
        font-size: 16px;
    }
}

/* 针对大屏幕桌面电脑 */
@media screen and (min-width: 1440px) and (max-width: 1919px) {
    html {
        font-size: 17px;
    }
}

/* 针对超大屏幕 */
@media screen and (min-width: 1920px) {
    html {
        font-size: 18px;
    }
}

body {
    margin: 0;
    padding: 0;
}

#app {
    width: 100%;
    margin: 0 auto;
}

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

.content {
    max-width: 120rem; /* 1920px / 16px = 120rem */
    min-width: 16rem; /* 256px / 16px = 16rem */
}

.row {
    width: 100%;
}
.row img {
    max-width: 100%;
    height: auto;
    width: 100%;
}

/*#region 顶部栏 */
.header-row {
    width: 100%;
    height: 6.25rem; /* 100px / 16px = 6.25rem */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-row .logo {
    flex: 1;
    display: flex;
    margin-left: 8em;
}

.header-row .logo img {
    width: 3.125rem; /* 50px / 16px = 3.125rem */
    height: 3.125rem;
}

.header-row .logo .title {
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-row .logo .title span {
    font-size: 2.25rem; /* 36px / 16px = 2.25rem */
    font-weight: bold;
    color: #333;
    margin-left: 1.25rem; /* 20px / 16px = 1.25rem */
}

.header-row .download-box {
    margin-right: 3.375rem; /* 54px / 16px = 3.375rem */
}

.header-row .download-box button {
    width: 7.8125rem; /* 125px / 16px = 7.8125rem */
    height: 3.25rem; /* 52px / 16px = 3.25rem */
    background: #FE7509;
    border: none;
    color: white;
    border-radius: 2.9375rem; /* 47px / 16px = 2.9375rem */
    font-size: 1.25rem; /* 20px / 16px = 1.25rem */
    font-weight: 600;
}
/*#endregion*/

/*#region 第一部分*/
.one-row {
    display: flex;
    align-items: center;
}

.one-row .one-row-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding-left: 13rem; /* 280px / 16px = 17.5rem */
    margin-top: -5.5rem; /* 88px / 16px = 5.5rem */
}

.one-row .one-row-left .tag {
    width: 15.625rem; /* 250px / 16px = 15.625rem */
    height: 3.5rem; /* 56px / 16px = 3.5rem */
}

.one-row .one-row-left .description {
    margin-top: 2.3125rem; /* 37px / 16px = 2.3125rem */
    font-size: 4.625rem; /* 74px / 16px = 4.625rem */
    font-weight: 600;
}

.one-row .one-row-left .download-button {
    width: 20rem; /* 320px / 16px = 20rem */
    height: 5.5rem; /* 88px / 16px = 5.5rem */
    margin-top: 3rem; /* 48px / 16px = 3rem */
    background-image: url("../static/images/one-3.webp");
    background-size: cover;
}

.one-row .one-row-left ul {
    margin-top: 4.3125rem; /* 69px / 16px = 4.3125rem */
    display: flex;
    align-items: center;
    list-style: none;
    padding-left: 0;
}

.one-row .one-row-left ul li {
    margin-left: 3rem; /* 48px / 16px = 3rem */
    font-size: 1.25rem; /* 20px / 16px = 1.25rem */
    font-weight: 400;
    color: #666;
    position: relative;
    padding-left: 1.625rem; /* 26px / 16px = 1.625rem */
}

.one-row .one-row-left ul li:first-child {
    margin-left: unset;
}

.one-row .one-row-left ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.8em;
    width: 1rem; /* 16px / 16px = 1rem */
    height: 1rem;
    background-color: #4FC65F;
    border-radius: 50%; /* 圆形标记 */
    transform: translateY(-50%);
}

.one-row .one-row-right {
    width: 60%;
}

.one-row .one-row-right img {
    width: 100%;
    height: auto;
}
/*#endregion*/

/*第二部分*/
/*第三部分*/
.three-row {
    background-color: #FFFAF5;
}

/*第四部分*/

/*#region 页脚*/
.footer-row {
    width: 100%;
    box-sizing: border-box;
    /* 60px / 16px = 3.75rem */
    /* 260px / 16px = 16.25rem */
    /* 166px / 16px = 10.375rem */
    /* 22px / 16px = 1.375rem */
    padding: 3.75rem 10.375rem 1.375rem 16.25rem;
    display: flex;
    justify-content: space-between;
    background-color: #F5F5F5;
}

.footer-row .footer-left {
}

.footer-row .footer-left .footer-item {
    margin-top: 3rem; /* 48px / 16px = 3rem */
    font-size: 1.25rem; /* 20px / 16px = 1.25rem */
    font-weight: 400;
    color: #666;
}

.footer-row .footer-right {
    display: flex;
    justify-content: flex-end;
}

.footer-row .footer-right .footer-item {
    margin-right: 3.75rem; /* 60px / 16px = 3.75rem */
}

.footer-row .footer-right .footer-item a {
    font-size: 1.25rem; /* 20px / 16px = 1.25rem */
    font-weight: 400;
    color: #333;
    text-decoration: none;
}

.footer-row .footer-right .footer-item:last-child {
    margin-right: unset;
}

.footer-beian {
    width: 100%;
    height: 5.125rem; /* 82px / 16px = 5.125rem */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #EBEBEB;
    font-size: 1.25rem; /* 20px / 16px = 1.25rem */
    color: #666;
    font-weight: 400;
}
/*#endregion*/



/*#region 媒体查询*/
/* 针对超小屏幕设备 */
@media screen and (max-width: 359px) {
    .header-row {
        height: 3.75rem;
    }
    .header-row .logo {
        margin-left: 4.8em;
    }
    .header-row .logo img {
        width: 1.875rem;
        height: 1.875rem;
    }
    .header-row .logo .title span {
        font-size: 1.25rem;
        margin-left:.6rem;
    }
    .header-row .download-box button {
        width: 4.6875rem;
        height: 1.95rem;
        font-size: .75rem;
    }


    .one-row .one-row-left {
        padding-left: 4rem;
        margin-top: unset;
    }
    .one-row .one-row-left .tag {
        width: 5.625rem;
        height: 1.26rem;
    }
    .one-row .one-row-left .description {
        margin-top: .2rem; /* 37px / 16px = 2.3125rem */
        font-size: 2rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 12rem; /* 320px / 16px = 20rem */
        height: 3.3rem; /* 88px / 16px = 5.5rem */
        margin-top: .6rem; /* 48px / 16px = 3rem */
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: .2rem; /* 69px / 16px = 4.3125rem */
        display: flex;
        align-items: center;
        list-style: none;
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .4rem; /* 48px / 16px = 3rem */
        padding-left: 1rem;
        font-size: .6rem;
    }
    .one-row .one-row-left ul li::before {
        top: 0.8em;
        width: .6rem; /* 16px / 16px = 1rem */
        height: .6rem;
    }


    .footer-row {
        padding: 0.9rem 2.49rem 0.33rem 3.9rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 6.55rem;
        height: 2.7rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: .4rem;
        font-size: .5rem;
    }
}

/* 针对小屏幕手机 */
@media screen and (min-width: 360px) and (max-width: 413px) {
    .header-row {
        height: 3.75rem;
    }
    .header-row .logo {
        margin-left: 4.8em;
    }
    .header-row .logo img {
        width: 1.875rem;
        height: 1.875rem;
    }
    .header-row .logo .title span {
        font-size: 1.25rem;
        margin-left:.6rem;
    }
    .header-row .download-box button {
        width: 4.6875rem;
        height: 1.95rem;
        font-size: .75rem;
    }

    .one-row .one-row-left {
        padding-left: 4rem;
        margin-top: unset;
    }
    .one-row .one-row-left .tag {
        width: 5.625rem;
        height: 1.26rem;
    }
    .one-row .one-row-left .description {
        margin-top: .2rem; /* 37px / 16px = 2.3125rem */
        font-size: 2rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 12rem; /* 320px / 16px = 20rem */
        height: 3.3rem; /* 88px / 16px = 5.5rem */
        margin-top: .6rem; /* 48px / 16px = 3rem */
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: .2rem; /* 69px / 16px = 4.3125rem */
        display: flex;
        align-items: center;
        list-style: none;
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .4rem; /* 48px / 16px = 3rem */
        padding-left: 1rem;
        font-size: .6rem;
    }
    .one-row .one-row-left ul li::before {
        top: 0.8em;
        width: .6rem; /* 16px / 16px = 1rem */
        height: .6rem;
    }

    .footer-row {
        padding: 0.9rem 2.49rem 0.33rem 3.9rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 6.55rem;
        height: 2.7rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: .4rem;
        font-size: .5rem;
    }
}

/* 针对大屏手机 */
@media screen and (min-width: 414px) and (max-width: 539px) {
    .header-row {
        height: 3.75rem;
    }
    .header-row .logo {
        margin-left: 4.8em;
    }
    .header-row .logo img {
        width: 1.875rem;
        height: 1.875rem;
    }
    .header-row .logo .title span {
        font-size: 1.25rem;
        margin-left:.6rem;
    }
    .header-row .download-box button {
        width: 4.6875rem;
        height: 1.95rem;
        font-size: .75rem;
    }


    .one-row .one-row-left {
        padding-left: 4rem;
        margin-top: unset;
    }
    .one-row .one-row-left .tag {
        width: 9.375rem; /* 250px / 16px = 15.625rem */
        height: 2.1rem; /* 56px / 16px = 3.5rem */
    }
    .one-row .one-row-left .description {
        margin-top: .2rem; /* 37px / 16px = 2.3125rem */
        font-size: 2rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 12rem; /* 320px / 16px = 20rem */
        height: 3.3rem; /* 88px / 16px = 5.5rem */
        margin-top: .6rem; /* 48px / 16px = 3rem */
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: .2rem; /* 69px / 16px = 4.3125rem */
        display: flex;
        align-items: center;
        list-style: none;
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .4rem; /* 48px / 16px = 3rem */
        padding-left: 1rem;
        font-size: .6rem;
    }
    .one-row .one-row-left ul li::before {
        top: 0.8em;
        width: .6rem; /* 16px / 16px = 1rem */
        height: .6rem;
    }


    .footer-row {
        padding: 0.9rem 2.49rem 0.33rem 3.9rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 6.55rem;
        height: 2.7rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: .4rem;
        font-size: .5rem;
    }
}

/* 针对小尺寸平板（竖屏） */
@media screen and (min-width: 540px) and (max-width: 767px) {
    .one-row .one-row-left {
        padding-left: 7rem;
        margin-top: unset;
    }
    .one-row .one-row-left .tag {
        width: 9.375rem; /* 250px / 16px = 15.625rem */
        height: 2.1rem; /* 56px / 16px = 3.5rem */
    }
    .one-row .one-row-left .description {
        margin-top: .2rem; /* 37px / 16px = 2.3125rem */
        font-size: 2rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 12rem; /* 320px / 16px = 20rem */
        height: 3.3rem; /* 88px / 16px = 5.5rem */
        margin-top: 1rem; /* 48px / 16px = 3rem */
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: 1rem; /* 69px / 16px = 4.3125rem */
        display: flex;
        align-items: center;
        list-style: none;
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .4rem; /* 48px / 16px = 3rem */
        padding-left: 1rem;
        font-size: .6rem;
    }
    .one-row .one-row-left ul li::before {
        top: 0.8em;
        width: .6rem; /* 16px / 16px = 1rem */
        height: .6rem;
    }

    .footer-row {
        padding: 0.9rem 2.49rem 0.33rem 3.9rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 9.432rem;
        height: 3.888rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: .576rem;
        font-size: .72rem;
    }
}

/* 针对中等尺寸平板（横屏） */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .one-row .one-row-left {
        padding-left: 8rem;
        margin-top: unset;
    }
    .one-row .one-row-left .tag {
        width: 11.25rem;
        height: 2.52rem;
    }
    .one-row .one-row-left .description {
        margin-top: .6rem; /* 37px / 16px = 2.3125rem */
        font-size: 2.4rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 16rem;
        height: 3.85rem;
        margin-top: 1.4rem;
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: 1rem;
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .2rem;
        padding-left: 1.4rem;
        font-size: .8rem;
    }

    .footer-row {
        padding: 1.26rem 3.486rem 0.462rem 8rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 13.2048rem;
        height: 5.4432rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: 0.8064rem;
        font-size: 1.008rem;
    }
}

/* 针对小屏幕笔记本电脑和大平板 */
@media screen and (min-width: 1024px) and (max-width: 1279px) {
    .one-row .one-row-left {
        padding-left: 11rem;
        margin-top: unset;
    }
    .one-row .one-row-left .description {
        margin-top: 1.8rem; /* 37px / 16px = 2.3125rem */
        font-size: 2.4rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left .download-button {
        width: 16rem; /* 320px / 16px = 20rem */
        height: 4.4rem; /* 88px / 16px = 5.5rem */
        margin-top: 2rem; /* 48px / 16px = 3rem */
        background-image: url("../static/images/one-3.webp");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .one-row .one-row-left ul {
        margin-top: 1rem; /* 69px / 16px = 4.3125rem */
        padding-left: 0;
    }
    .one-row .one-row-left ul li {
        margin-left: .2rem; /* 48px / 16px = 3rem */
        padding-left: 1.4rem;
        font-size: 1rem;
    }

    .footer-row {
        padding: 1.26rem 3.486rem 0.462rem 8rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 13.2048rem;
        height: 5.4432rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: 0.8064rem;
        font-size: 1.008rem;
    }
}

/* 针对中等屏幕桌面电脑 */
@media screen and (min-width: 1280px) and (max-width: 1439px) {
    .one-row .one-row-left {
        padding-left: 11rem;
        margin-top: unset;
    }
    .one-row .one-row-left .description {
        margin-top: 1.8rem; /* 37px / 16px = 2.3125rem */
        font-size: 3.5rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left ul li {
        margin-left: .2rem; /* 48px / 16px = 3rem */
        padding-left: 1.4rem;
    }


    .footer-row {
        padding: 1.26rem 3.486rem 0.462rem 10rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 13.2048rem;
        height: 5.4432rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: 0.8064rem;
        font-size: 1.008rem;
    }
}

/* 针对中等屏幕桌面电脑 */
@media screen and (min-width: 1440px) and (max-width: 1659px) {
    .one-row .one-row-left {
        padding-left: 11rem;
        margin-top: unset;
    }
    .one-row .one-row-left .description {
        margin-top: 1.8rem; /* 37px / 16px = 2.3125rem */
        font-size: 3.5rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left ul li {
        margin-left: .6rem; /* 48px / 16px = 3rem */
        padding-left: 1.4rem;
    }

    .footer-row {
        padding: 1.26rem 3.486rem 0.462rem 11rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 13.2048rem;
        height: 5.4432rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: 0.8064rem;
        font-size: 1.008rem;
    }
}

/* 针对大屏幕桌面电脑 */
@media screen and (min-width: 1660px) and (max-width: 1919px) {
    .one-row .one-row-left {
        padding-left: 11rem;
        margin-top: unset;
    }
    .one-row .one-row-left .description {
        margin-top: 2rem; /* 37px / 16px = 2.3125rem */
        font-size: 4rem; /* 74px / 16px = 4.625rem */
        font-weight: 600;
    }
    .one-row .one-row-left ul li {
        margin-left: 2rem; /* 48px / 16px = 3rem */
    }

    .footer-row {
        padding: 1.26rem 3.486rem 0.462rem 14rem;
    }

    .footer-row .footer-left .footer-logo img {
        width: 13.2048rem;
        height: 5.4432rem;
    }

    .footer-row .footer-left .footer-item {
        margin-top: 0.8064rem;
        font-size: 1.008rem;
    }
}

/* 针对超大屏幕 */
@media screen and (min-width: 1920px) {
}

/*#endregion*/