body, div, img {
    margin: 0;
    padding: 0;
}

body {
    padding-bottom: 238px;
}

.mainbody {
    margin: 0 auto;
    border-radius: 1px;
    width: 100%;
}

.top {
    margin-top: 20px;
    border-radius: 1px;
    width: 100%;
    border-radius: 1px 1px 1px 1px;
}
.toph {
   height: 50px;
   margin-left:20%;
}
/* 轮播图样式 */
.banner-container {
    background-color: rgb(229, 229, 229);
    width: 100%;
    height: 560px;
    overflow: hidden;
}

.banner-slides {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease-in-out;
}

.banner-slide {
    min-width: 100%;
    height: 100%;
}

    .banner-slide img {
        width: 100%;
        height: 560px;
        object-fit: cover;
    }


.banner-controls {
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
}


.banner-indicators {
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
}

.banner-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background-color 0.3s;
}

.banner-indicator.active {
    background-color: white;
}

.content {
    border-radius: 1px;
    width: 100%;
    border-radius: 1px 1px 1px 1px;
    margin-top:140px;
}

.content1 {
    width: 100%;
    text-align: center;
    top: 0px;
}

    .content1 .content1-gr {
        font-size: 26px;
        font-family: "Microsoft YaHei";
        color: rgb(239, 65, 54);
        line-height: 1.115;
        text-align: center;
        margin-top: 20px;
    }

    .content1 .content1-gren {
        font-size: 14px;
        font-family: "Microsoft YaHei";
        color: rgb(119, 119, 119);
        line-height: 2.071;
        text-align: center;
        margin: 20px auto auto auto;
    }

    .content1 .content1-detail {
        font-size: 14px;
        font-family: "Microsoft YaHei";
        color: rgb(119, 119, 119);
        line-height: 2.071;
        text-align: center;
        width: 827px;
        margin: 60px auto auto auto;
    }


.conten2 {
    font-size: 26px;
    font-family: "Microsoft YaHei";
    color: rgb(239, 65, 54);
    line-height: 1.115;
    text-align: center;
}

.content2-img {
    width: 74px;
    height: 87px;
    text-align: center
}

.content2 div {
    text-align: center
}

.skill-list {
    display: flex;
    justify-content: space-between;
    padding: 0 20%;
    margin: 60px auto auto auto;
}

.content2 .grjn {
    font-size: 26px;
    font-family: "Microsoft YaHei";
    color: rgb(239, 65, 54);
    line-height: 1.115;
    text-align: center;
    top: 1148px;
    margin: 140px auto auto auto;
}

.content2 .grjnen {
    font-size: 14px;
    font-family: "Microsoft YaHei";
    color: rgb(119, 119, 119);
    line-height: 2.071;
    text-align: center;
    margin-top: 20px;
}

.content2-app .text1 {
    font-family: MicrosoftYaHei;
    font-size: 18px;
    color: #333333;
    font-style: normal;
    text-transform: none;
    margin: 20px auto auto auto;
}

.content2-app .text2 {
    font-family: MicrosoftYaHei;
    font-size: 14px;
    color: #777777;
    font-style: normal;
    text-transform: none;
    margin: 10px auto auto auto;
    width:218px;
}

.content2-web .text1 {
    font-family: MicrosoftYaHei;
    font-size: 18px;
    color: #333333;
    font-style: normal;
    text-transform: none;
    margin: 20px auto auto auto;
}

.content2-web .text2 {
    font-family: MicrosoftYaHei;
    font-size: 14px;
    color: #777777;
    font-style: normal;
    text-transform: none;
    margin: 10px auto auto auto;
    width: 218px;
}

.content2-ui .text1 {
    font-family: MicrosoftYaHei;
    font-size: 18px;
    color: #333333;
    text-align: center;
    font-style: normal;
    text-transform: none;
    margin: 20px auto auto auto;
}

.content2-ui .text2 {
    font-family: MicrosoftYaHei;
    font-size: 14px;
    color: #777777;
    font-style: normal;
    text-transform: none;
    margin: 10px auto auto auto;
    width: 218px;
}


.content3 {
    font-size: 26px;
    font-family: "Microsoft YaHei";
    color: rgb(239, 65, 54);
    line-height: 1.115;
    text-align: center;
}

    .content3 .maintext {
        width: 130px;
        font-family: MicrosoftYaHei;
        font-size: 26px;
        color: #EF4136;
        text-align: center;
        font-style: normal;
        text-transform: none;
        margin:140px auto auto auto;
    }

    .content3 .detailtext {
        font-family: MicrosoftYaHei;
        font-size: 14px;
        color: #777777;
        text-align: center;
        font-style: normal;
        text-transform: none;
        margin-top: 20px;
    }

.production-list {
    display: flex;
    justify-content: space-between;
    padding: 0 20%;
    margin: 60px auto auto auto;
}

.production-list + .production-list {
    margin-top: 60px;
}

.footer {
    margin-top: 50px;
    border-radius: 1px;
    background-color: rgb(102, 102, 102);
    position: absolute;
    /*bottom: 0;*/
    width: 100%;
    height: 258px;
    text-align: center;
}

.beian {
    font-size: 16px;
    font-family: "Adobe Heiti Std";
    color: rgb(153, 153, 153);
    line-height: 1.063;
    text-align: center;
}

.footer-qq {
    font-size: 16px;
    font-family: "Adobe Heiti Std";
    color: rgb(153, 153, 153);
    line-height: 1.063;
    text-align: center;
}