a {
    text-decoration: none;
}

/* 自定义样式 */
.accessories_banner {
    height: 380rem;
    background-image: url('/static/frontend/pc/images/accessoriesBanner.webp');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
}

.accessoriesBanner_content {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.accessoriesBanner_content-container {
    max-width: 1440rem;
    margin: 0 auto;
    height: 100%;
}

/* 面包屑导航样式 */
.breadcrumb {
    background-color: transparent;
    padding: 0;
    font-size: 14rem;
    margin-top: 16rem;
}

.breadcrumb-item a {
    color: #0D6EFD;
    text-decoration: none;
    font-size: 14rem;
}

.breadcrumb-item+.breadcrumb-item::before {
    padding: 0 6rem;
}

.breadcrumb-item:hover {
    color: #0068D7 !important;
}

.breadcrumb-item.active {
    color: #333333;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: rgba(51, 51, 51, 0.8);
}

/* 主标题样式 */
.banner-title {
    width: 961rem;
    height: 116rem;
    font-size: 48rem;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-align: CENTER;
    color: #333333;
    text-shadow: 0 2rem 2rem 0 rgba(0, 0, 0, 0.45);
    margin: 0 auto;
    margin-top: 63rem;
}

/* 简介文本样式 */
.banner-description {
    width: 1000rem;
    height: 38rem;
    font-size: 16rem;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    text-align: center;
    color: #333333;
    margin: 0 auto;
    margin-top: 16rem;
}

.providing {
    width: 100%;
    height: 516rem;
    background: #f8f9f9;

    .providing-content {
        max-width: 1440rem;
        height: 100%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;

        .left {
            margin-top: 108rem;

            .title {
                width: 656rem;
                height: 116rem;
                font-size: 48rem;
                line-height: 60rem;
                font-family: 'Inter', sans-serif;
                font-weight: 600;
                text-align: left;
                color: #0a1d3d;
            }

            .content {
                width: 597rem;
                height: 160rem;
                font-size: 16rem;
                font-family: 'Inter', sans-serif;
                font-weight: 400;
                text-align: left;
                color: #333333;
                line-height: 24rem;
                margin-top: 32rem;

                p:last-child {
                    margin-top: 20rem;
                }
            }
        }

        .right {
            margin-top: 80rem;

            img {
                width: 620rem;
                height: 372rem;
            }
        }
    }
}

.tailored {
    width: 100%;
    background: #ffffff;

    .tailored-content {
        max-width: 1440rem;
        height: 100%;
        margin: 0 auto;

        .title {
            height: 58rem;
            font-size: 48rem;
            font-family: 'Inter', sans-serif;
            font-weight: 600;
            text-align: center;
            color: #0a1d3d;
            margin-top: 80rem;
        }

        .list {
            display: flex;
            flex-wrap: wrap;
            align-content: space-between;
            align-items: center;

            .list-row {
                margin-top: 32rem;
                display: flex;

                .tailored-component {
                    height: 280rem;
                    width: 336rem;
                    margin-right: 32rem;

                    .img-block {
                        width: 336rem;
                        height: 240rem;
                        background: rgba(14, 42, 88, 0.04);
                        border: 1rem solid #0e2a58;
                        border-radius: 4rem;
                        display: flex;
                        justify-content: center;
                        align-items: center;

                        img {
                            max-width: 90%;
                            max-height: 90%;
                        }
                    }

                    .text {
                        font-size: 16rem;
                        font-family: 'Inter', sans-serif;
                        font-weight: 400;
                        text-align: center;
                        color: #333333;
                        line-height: 24rem;
                        margin-top: 16rem;
                    }
                }

                .tailored-component:last-child {
                    margin-right: 0;
                }
            }
        }
    }
}

.produce {
    width: 100%;
    background: #f8f9f9;
    margin-top: 120rem;
    padding-bottom: 68rem;

    .produce-content {
        max-width: 1440rem;
        margin: 0 auto;
        padding-top: 98rem;

        .desc {
            width: 100%;
            height: 392rem;
            display: flex;
            justify-content: space-between;

            .left {
                .title {
                    width: 656rem;
                    font-size: 48rem;
                    font-family: 'Inter', sans-serif;
                    font-weight: 600;
                    text-align: left;
                    color: #0a1d3d;
                    margin-top: 8rem;
                    line-height: 60rem;
                }

                .text1 {
                    width: 597rem;
                    height: 96rem;
                    font-size: 16rem;
                    font-family: 'Inter', sans-serif;
                    font-weight: 400;
                    text-align: left;
                    color: #333333;
                    line-height: 24rem;
                    margin-top: 32rem;
                }

                .text2 {
                    width: 597rem;
                    height: 24rem;
                    font-size: 16rem;
                    font-family: 'Inter', sans-serif;
                    font-weight: 600;
                    text-align: left;
                    color: #333333;
                    line-height: 24rem;
                    margin-top: 28rem;
                }

                .text3 {
                    width: 597rem;
                    height: 72rem;
                    font-size: 16rem;
                    font-family: 'Inter', sans-serif;
                    font-weight: 400;
                    text-align: left;
                    color: #333333;
                    line-height: 24rem;
                    margin-top: 16rem;
                }
            }

            .right {
                width: 620rem;
                height: 372rem;
            }
        }

        .customization-button {
            width: 272rem;
            height: 52rem;
            border: 2rem solid #0e2a58;
            border-radius: 4rem;
            margin: 100rem auto 0;
            display: flex;
            justify-content: center;
            align-items: center;

            span {
                font-size: 16rem;
                font-family: 'Inter', sans-serif;
                font-weight: 500;
                text-align: center;
                color: #0e2a58;
            }
        }

        .customization-button:hover {
            background: #0e2a58;

            span {
                color: #ffffff;
            }
        }
    }
}

.partner {
    background: #ffffff;
    width: 100%;

    .partner-content {
        max-width: 1440rem;
        height: 424rem;
        background: #ecedef;
        margin: 120rem auto 100rem;
        padding-top: 72rem;

        .title {
            width: 872rem;
            height: 96rem;
            font-size: 48rem;
            font-family: 'Inter', sans-serif;
            font-weight: 600;
            text-align: center;
            color: #333333;
            line-height: 50rem;
            margin: 0 auto;
        }

        .text {
            width: 592rem;
            height: 48rem;
            font-size: 16rem;
            font-family: 'Inter', sans-serif;
            font-weight: 400;
            text-align: center;
            color: #333333;
            line-height: 24rem;
            margin: 20rem auto 0;
        }

        .contact-button {
            width: 240rem;
            height: 60rem;
            background: #0e2a58;
            border-radius: 4rem;
            margin: 60rem auto 0;
            display: flex;
            justify-content: center;
            align-items: center;

            span {
                font-size: 16rem;
                font-family: 'Inter', sans-serif;
                font-weight: 400;
                color: #ffffff;
            }
        }

        .contact-button:hover {
            background: #ffffff;

            span {
                color: #0A1D3D;
            }
        }
    }
}