@charset "utf-8";

* {
    margin: 0px;
    padding: 0px;
    font-family: "微软雅黑", "Microsoft Yahei", "Source Han Sans", "Source Han Sans CN", Arial;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box;
}

body,
html {
    width: 100%;
    /* height: 100%; */
    position: relative;
}

/* body {
    padding-bottom: 1.5rem;
} */

/* ============================= 网页宽度 开始 ============================= */
.width1660 {
    max-width: 100%;
    margin: 0px auto;
    position: relative;
}

.width1600 {
    width: 100%;
    max-width: 16rem;
    margin: 0px auto;
    position: relative;
}

.width1500 {
    width: 100%;
    max-width: 15rem;
    margin: 0px auto;
    position: relative;
}

.width1200 {
    width: 100%;
    max-width: 12rem;
    margin: 0px auto;
    position: relative;
}

/* ============================= 网页宽度 结束 ============================= */
/* 富文本 */
.richText {
    overflow: hidden;
}

.richText img {
    max-width: 100%;
}



/* ========== 限制文本行数 开始 ========== */
/* 文字一行，多余省略号 */
.clamp1 {
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
}

/* 文字多行，多余省略号 */
.clamp2,
.clamp3,
.clamp4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.clamp2 {
    -webkit-line-clamp: 2;
}

.clamp3 {
    -webkit-line-clamp: 3;
}

.clamp4 {
    -webkit-line-clamp: 4;
}

/* ========== 限制文本行数 结束 ========== */


.goldenBox {
    background: url(../images/goldenBg1.jpg) no-repeat;
    background-size: cover;
    padding: 2rem 1rem;
}

.goldenIntro {
    width: 50%;
    color: #fff;
}

.goldenIntro h2 {
    margin: 0.3rem 0rem;
}

.goldenIntro p {
    line-height: 2;
}

.goldenAdv {
    background: url(../images/goldenBg2.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.goldenAdv .goldenIntro {
    width: 80%;
}

.goldenCircle {
    background: url(../images/goldenBg3.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
}

/* 尊龙时凯人生就是搏时代 */
.timeOne {
    background: url(../images/timeBg1.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.timeTwo {
    background: url(../images/timeBg2.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.timeThree {
    background: url(../images/timeBg3.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.timeFour {
    background: url(../images/timeBg4.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.timeFive {
    background: url(../images/timeBg5.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.timeFive .goldenIntro {
    width: 100%;
    text-align: center;
}


/* 美多科技 */
.beautyOne {
    background: url(../images/beautyBg1.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
    display: flex;
    justify-content: flex-end;
}

.beautyTwo {
    background: url(../images/beautyBg2.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
}

.beautyThree {
    background: url(../images/beautyBg3.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 3.5rem;
    display: flex;
    justify-content: flex-end;
}

.beautyThree .goldenIntro {
    width: 30%;
    color: #333;
}

.beautyFour {
    background: url(../images/beautyBg4.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 2.5rem;
}

.beautyFour .goldenIntro {
    text-align: center;
    margin: auto;
    margin-top: 2rem;
}

.beautyFive {
    background: url(../images/beautyBg5.jpg) no-repeat;
    background-size: cover;
    padding: 1rem 1rem;
    padding-bottom: 2.5rem;
    display: flex;
    justify-content: flex-end;
}


/* 返回按钮 */
.returnBack {
    position: fixed;
    right: 0.6rem;
    top: 0.3rem;
    z-index: 999;
}

.returnBack a {
    display: block;
    width: 1.2rem;
    height: 0.5rem;
    line-height: 0.5rem;
    background: green;
    color: #fff;
    text-align: center;
}



/* ============================= 公共样式 结束 ============================= */


@media (max-width: 800px) {

    .goldenBox,
    .goldenAdv {
        padding: 2rem 0.3rem;
    }

    .goldenIntro {
        width: 100%;
    }

    .goldenAdv .goldenIntro {
        width: 100%;
    }

    .goldenCircle {
        padding: 1rem 0.3rem;
    }

    .goldenBox {
        background: url(../images/goldenMobBg1.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
    }

    .goldenAdv {
        background: url(../images/goldenMobBg2.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
    }

    .goldenCircle {
        background: url(../images/goldenMobBg3.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
    }


    /* 尊龙时凯人生就是搏时代 */
    .timeOne {
        padding: 1rem 0.3rem;
    }

    .timeTwo {
        background: url(../images/timeMobBg2.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
        padding-bottom: 5rem;
    }

    .timeThree {
        background: url(../images/timeMobBg3.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
        padding-bottom: 2rem;
    }

    .timeFour {
        background: url(../images/timeMobBg4.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
        padding-bottom: 3rem;
    }

    .timeFive {
        background: url(../images/timeMobBg5.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.3rem;
        padding-bottom: 4rem;
    }

    /* 美多科技 */
    .beautyOne {
        background: url(../images/beautyMobBg1.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.4rem;
    }

    .beautyTwo {
        background: url(../images/beautyMobBg2.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.4rem;
    }

    .beautyThree {
        background: url(../images/beautyMobBg3.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.4rem;
    }

    .beautyThree .goldenIntro {
        width: 100%;
    }

    .beautyFour {
        background: url(../images/beautyMobBg4.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.4rem;
    }

    .beautyFour .goldenIntro {
        text-align: center;
        margin: auto;
        margin-top: 0rem;
    }


    .beautyFive {
        background: url(../images/beautyMobBg5.jpg) no-repeat;
        background-size: cover;
        padding: 1rem 0.4rem;
    }

    .beautyFive .goldenIntro {
        width: 60%;
    }





}