* {
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: 'JDFont';
    src: url('https://jiadidesign.cn/static/jd-web/20250429/font.ttf') format('truetype');
    font-display: swap;
}

body,
html {
    margin: 0;
    padding: 0;
}

#app {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    /* 允许垂直滚动 */
}

#app::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari 和 Opera */
}

#app {
    -ms-overflow-style: none;
    /* IE 和 Edge */
    scrollbar-width: none;
    /* Firefox */
}

/* 导航栏 */
.head {
    display: flex;
    justify-content: space-between;


    .head-left {
        margin: 66px 0 94px 100px;
        width: 293px;
        height: 101px;

        .head-logo {
            width: 64%;
            height: 64%;
        }
    }

    .head-right {
        display: flex;

        .topNav {
            display: flex;

            .clearfix {
                display: flex;
                border-top: 1px solid #666666;
                margin-top: 62px;

                li {
                    margin: 0;
                    padding: 0;
                    list-style: none;
                    margin-top: 25px;
                    margin-right: 60px;

                    a {
                        text-decoration: none;
                        color: #000000;
                        cursor: pointer;
                        margin-bottom: 20px;
                        height: 25px;
                        font-weight: 400;
                        font-size: 18px;
                        line-height: 25px;
                        text-align: left;
                        font-style: normal;
                    }

                    span {
                        flex-wrap: wrap;
                    }

                    .ln {
                        font-weight: 400;
                        font-size: 12px;
                        color: #666666;
                        line-height: 17px;
                        text-align: left;
                        font-style: normal;
                        margin-top: 4px;
                    }

                    .active {
                        color: #27721D;
                    }

                    .actives {
                        color: #27721D;
                        font-size: 12px;
                    }

                    .active-line {
                        width: 36px;
                        height: 2px;
                        background: #000000;
                        margin-bottom: 25px;
                        margin-top: -25px;
                        margin-left: 18px;
                    }

                    .customer {
                        width: 29px;
                        height: 27px;

                        .cus-img {
                            width: 29px;
                            height: 27px;
                        }

                    }

                    .line {
                        width: 139px;
                        height: 1px;
                        background: #000000;
                        margin-top: 30px;
                    }
                }

                li:nth-child(7) {
                    margin-right: 0;
                }
            }
        }
    }
}

/* 内容主体 */
.content {

    .content-img {
        .content-des {
            width: 100vw;
            height: 555px;

            .images {
                width: 100%;
                height: 100%;
                position: relative;
            }

            .detail {
                position: absolute;
                text-align: center;
                margin-top: -200px;
                left: 50%;
                transform: translate(-50%, -50%);

                .des {
                    font-family: 'JDFont', sans-serif;
                    font-weight: 400;
                    font-size: 30px;
                    color: #FFFFFF;
                    line-height: 42px;
                    letter-spacing: 24px;
                    text-align: center;
                    font-style: normal;
                    margin-bottom: 12px;
                    padding-bottom: 20px;
                    padding-left: 20px;
                    border-bottom: 1px solid #FFFFFF;
                }

                .line {
                    width: 195px;
                    height: 1px;
                    background: #FFFFFF;
                }

                .name {
                    font-family: 'JDFont', sans-serif;
                    font-weight: 400;
                    font-size: 20px;
                    color: #FFFFFF;
                    line-height: 28px;
                    text-align: center;
                    font-style: normal;
                    letter-spacing: 24px;
                    margin-top: 6px;
                    margin-left: 20px;
                }
            }
        }
    }

    .items {
        display: flex;
        justify-content: space-between;
        margin: 60px 360px 36px;
        border-top: 1px solid #666666;

        .items-con {
            margin-top: 24px;

            .line {
                width: 36px;
                height: 2px;
                background: #000000;
                margin-top: -24px;
            }

            .name {
                font-weight: 400;
                font-size: 16px;
                color: #333333;
                line-height: 25px;
                text-align: left;
                font-style: normal;
                margin-top: 24px;
            }

            .nameEn {
                font-weight: 400;
                font-size: 12px;
                color: #666666;
                line-height: 17px;
                text-align: left;
                font-style: normal;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                /* 限制显示的行数为2 */
                overflow: hidden;
                /* 隐藏超出部分的内容 */
                text-overflow: ellipsis;
                /* 当内容超出时显示省略号（虽然对于多行文本，这个属性本身不起作用，但写上也无妨） */

            }
        }

    }

    /* 列表 */
    .list-content {

        margin: 0 360px 90px;
        display: flex;
        /* justify-content: space-between; */
        flex-wrap: wrap;

        .list-item {

            border-bottom: 1px solid #9A9A9A;
            margin-right: 11px;

            a {
                text-decoration: none;
            }

            .images {
                width: 285px;
                height: 380px;
                margin-top: 54px;
            }

            .des {
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 14px;
                color: #333333;
                line-height: 20px;
                text-align: left;
                font-style: normal;
                margin-top: 24px;
            }

            .detail {
                width: 285px;
                font-family: PingFangSC, PingFang SC;
                font-weight: 300;
                font-size: 12px;
                color: #666666;
                line-height: 26px;
                text-align: left;
                font-style: normal;
                margin-top: 18px;
                margin-bottom: 17px;
            }
        }
    }

    /* 分页 */
    .pagination {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 80px;
        font-size: 14px;

        .page-item {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 32px;
            height: 32px;
            margin: 0 4px;
            padding: 0 4px;
            border: 1px solid #d9d9d9;
            border-radius: 4px;
            background: #fff;
            cursor: pointer;
            user-select: none;
            transition: all 0.3s;
        }

        .page-item:hover {
            border-color: #3E3E3E;
            color: #BDBDBD;
        }

        .page-item.active {
            border-color: #3E3E3E;
            background: #3E3E3E;
            color: #fff;
        }

        .page-item.disabled {
            cursor: not-allowed;
            color: #d9d9d9;
            border-color: #d9d9d9;
            background: #f5f5f5;
        }

        .ellipsis {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
        }
    }


}

/* 页脚内容 */
.footer {
    width: 100%;
    height: 575px;
    background-image: url(https://ts-platform.oss-cn-hangzhou.aliyuncs.com/web/botbg.png);


    .footer-content {
        display: flex;
        justify-content: space-between;
        color: #000000;
        margin: 0 252px 81px 100px;


        .footer-items-one {
            .title {
                margin-top: 142px;
                font-family: 'JDFont', sans-serif;
                font-weight: 400;
                font-size: 24px;
                color: #FFFFFF;
                line-height: 24px;
                text-align: left;
                font-style: normal;
                margin-bottom: 50px;
            }

            .items {
                font-family: PingFangSC, PingFang SC;
                font-weight: 300;
                font-size: 20px;
                color: #FFFFFF;
                line-height: 28px;
                text-align: left;
                font-style: normal;
                margin-top: 24px;
                opacity: 0.6;
            }

        }

        .footer-items {

            .title {
                margin-top: 142px;
                font-family: 'JDFont', sans-serif;
                font-weight: 500;
                font-size: 24px;
                color: #FFFFFF;
                line-height: 33px;
                text-align: left;
                font-style: normal;
                margin-bottom: 50px;
            }

            .items {
                font-family: PingFangSC, PingFang SC;
                font-weight: 300;
                font-size: 20px;
                color: #FFFFFF;
                line-height: 28px;
                text-align: left;
                font-style: normal;
                margin-top: 24px;
                opacity: 0.6;
            }
        }

        .footer-code {
            width: 193px;
            height: 193px;
            /* background-color: #000000; */
            margin-top: 237px;
        }

        .code-img {
            width: 100%;
            height: 100%;
        }

    }

    .footer-num {
        text-align: center;
        font-family: PingFangSC, PingFang SC;
        font-weight: 500;
        font-size: 14px;
        color: #FFFFFF;
        line-height: 20px;
        font-style: normal;
        margin-bottom: 45px;
    }
}