* {
    margin: 0;
    padding: 0;
    font-family: PingFangSC, Helvetica, 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', STHeiti, 'WenQuanYi Micro Hei', sans-serif;
}

.clearfix:after {
    content: '.';
    width: 0;
    height: 0;
    clear: both;
    overflow: hidden;
    visibility: hidden;
}

.container {
    margin: 0;
    padding: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.swiper-container {
    width: 100%;
    height: 100%;
}

.slider1,
.slider2,
.slider3,
.slier4 {
    width: 100%;
    height: 100%;
    background-size: cover;
}

.slider1 {
    background: url('../img/background1.png') no-repeat center center;
    padding-bottom: 20px;
}

.slider1 .img-box {
    box-sizing: border-box;
    padding: 50px 0 0 150px;
}

.slider1 .img-box img {
    display: block;
    width: 163px;
    height: 37px;
}

.slider1 .first-line {
    width: 47vw;
    margin: 5vw 0 0 calc(50% - 23vw);
}

.slider1 .first-line img {
    box-sizing: border-box;
    display: block;
    width: 100%;
}

.slider1 .second-line {
    width: 47vw;
    margin: -10vw 0 0 calc(50% - 16vw);
}

.slider1 .second-line img {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding-left: 10%;
}

.slider2 {
    background: url('../img/background2.png') no-repeat center center;
}

.slider2 .logo-box {
    box-sizing: border-box;
    width: 240px;
    padding: 3% 0 0 90px;
    display: inline-block;
}

.slider2 .logo-box .back-box {
    width: 40px;
    height: 40px;
    background: #e60012;
    display: inline-block;
    vertical-align: top;
}

.slider2 .logo-box .text-box {
    display: inline-block;
    height: 40px;
    vertical-align: top;
}

.slider2 .logo-box .text-box .ch-text-box {
    font-size: 22px;
    height: 22px;
    line-height: 22px;
    color: #444;
}

.slider2 .logo-box .text-box .en-text-box {
    font-size: 12px;
    height: 12px;
    line-height: 12px;
    margin-top: 6px;
    color: #858585;
}

.slider2 .first-line {
    width: 1160px;
    height: 45%;
    position: absolute;
    left: 50%;
    margin-left: -580px;
    top: 10%;
}

.slider2 .first-line .intro-box {
    float: left;
    width: 33%;
    height: 100%;
    margin-right: 27%;
}

.slider2 .first-line .intro-box .top-part {
    height: 76%;
    width: 100%;
    box-sizing: border-box;
    background: rgba(229, 229, 229, 0.8);
    padding: 18% 8% 0;
}

.slider2 .first-line .intro-box .top-part .back-box {
    width: 16px;
    height: 16px;
    background: #e60012;
}

.slider2 .first-line .intro-box .top-part .ch-text-box {
    font-size: 14px;
    color: #474747;
    line-height: 20px;
    margin-top: 10px;
}

.slider2 .first-line .intro-box .top-part .en-text-box {
    font-size: 10px;
    color: #919191;
    line-height: 14px;
    margin-top: 30px;
}

.slider2 .first-line .intro-box .bottom-part {
    width: 100%;
    height: 24%;
    background: #e60012;
}

.slider2 .first-line .img-box {
    float: right;
    width: 40%;
    height: 100%;
}

.slider2 .first-line .img-box img {
    display: block;
    height: 100%;
}

.slider2 .second-line {
    width: 1160px;
    height: 40%;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -580px;
}

.slider2 .second-line .img1,
.slider2 .second-line .img2,
.slider2 .second-line .img3 {
    overflow: hidden;
    height: 100%;
}

.slider2 .second-line .img1,
.slider2 .second-line .img3 {
    padding: 0;
}

.slider2 .second-line .img1 .top-part {
    width: 100%;
    height: 45%;
    overflow: hidden;
}

.slider2 .second-line .img1 .top-part img {
    display: block;
    max-width: 100%;
    min-height: 100%;
}

.slider2 .second-line .img1 .bottom-part {
    width: 100%;
    height: 55%;
    background: #e5e5e5;
    padding: 5px 3% 0;
}

.slider2 .second-line .img1 .bottom-part .back-box {
    width: 14px;
    height: 14px;
    background: #e60012;
    margin-top: 20px;
}

.slider2 .second-line .img1 .bottom-part .zh-text {
    font-size: 14px;
    color: #474747;
    line-height: 16px;
    margin-top: 20px;
}

.slider2 .second-line .img1 .bottom-part .en-text {
    font-size: 10px;
    color: #919191;
    line-height: 14px;
    margin-top: 20px;
}

.slider2 .second-line .img2 img {
    display: block;
    max-width: 100%;
    min-height: 100%;
}

.slider2 .second-line .img3 .top-part {
    box-sizing: border-box;
    width: 100%;
    height: 50%;
    padding-bottom: 2%;
    overflow: hidden;
}

.slider2 .second-line .img3 .bottom-part {
    box-sizing: border-box;
    width: 100%;
    height: 50%;
    padding-top: 2%;
}

.slider2 .second-line .img3 .top-part img,
.slider2 .second-line .img3 .bottom-part img {
    display: block;
    max-width: 100%;
    min-height: 100%;
}

.slider3 {
    background: url(../img/background3.png) no-repeat center center;
    background-size: cover;
}

.slider3 .logo-box {
    box-sizing: border-box;
    /* width: 240px; */
    padding: 3% 0 0 90px;
    display: inline-block;
}

.slider3 .logo-box .back-box {
    width: 40px;
    height: 40px;
    background: #e60012;
    display: inline-block;
    vertical-align: top;
}

.slider3 .logo-box .text-box {
    display: inline-block;
    height: 40px;
    vertical-align: top;
}

.slider3 .logo-box .text-box .ch-text-box {
    font-size: 22px;
    height: 22px;
    line-height: 22px;
    color: #fff;
}

.slider3 .logo-box .text-box .en-text-box {
    font-size: 12px;
    height: 12px;
    line-height: 12px;
    margin-top: 6px;
    color: #fff;
}

.slider3 .content-box {
    position: absolute;
    left: 20vw;
    top: calc(100%/2 - 30vw/2);
    width: 66vw;
    height: 33vw;
    overflow: hidden;
}

.slider3 .content-box .detail-content-box {
    height: 100%;
}

.slider3 .content-box .detail-content-box .img-box {
    width: 100%;
    height: 80%;
    overflow: hidden;
}

.slider3 .content-box .detail-content-box .img-box img {
    display: block;
    max-width: 100%;
    min-height: 100%;
    position: relative;
}

.slider3 .content-box .detail-content-box .text-box {
    position: absolute;
    /* bottom: 0; */
    top: 80%;
    left: 15px;
    height: 50%;
    width: calc(100% - 30px);
    padding: 0 5%;
    background: #fff;
    box-sizing: border-box;
}

.slider3 .content-box .detail-content-box:hover .text-box {
    top: 50%;
    transition: top 0.6s;
}

.slider3 .content-box .detail-content-box .text-box .back-box {
    width: 16px;
    height: 16px;
    background: #e60012;
    margin-top: 4%;
}

.slider3 .content-box .detail-content-box .text-box .title-box {
    height: 25%;
    margin-top: 3%;
}

.slider3 .content-box .detail-content-box .text-box .title-box .zh-title {
    color: #474747;
    font-size: 20px;
}

.slider3 .content-box .detail-content-box .text-box .title-box .en-title {
    color: #8c8c8c;
    font-size: 10px;
}

.slider3 .content-box .detail-content-box .text-box .detail-box {
    border-top: 2px solid #a3a3a3;
}

.slider3 .content-box .detail-content-box .text-box .detail-box .zh-detail {
    font-size: 14px;
    color: #474747;
    padding-top: 2%;
}

.slider3 .content-box .detail-content-box .text-box .detail-box .en-detail {
    font-size: 8px;
    color: #919191;
}

.slider4 {
    background: url(../img/background4.png) no-repeat center center;
}

.slider4 .logo-box {
    box-sizing: border-box;
    width: 240px;
    padding: 3% 0 0 90px;
    display: inline-block;
}

.slider4 .logo-box .back-box {
    width: 40px;
    height: 40px;
    background: #e60012;
    display: inline-block;
    vertical-align: top;
}

.slider4 .logo-box .text-box {
    display: inline-block;
    height: 40px;
    vertical-align: top;
}

.slider4 .logo-box .text-box .ch-text-box {
    font-size: 22px;
    height: 22px;
    line-height: 22px;
    color: #444;
}

.slider4 .bg-red {
    background: #e60012;
}

.slider4 .bg-gray {
    background: #e5e5e5;
}

.slider4 .logo-box .text-box .en-text-box {
    font-size: 12px;
    height: 12px;
    line-height: 12px;
    margin-top: 6px;
    color: #858585;
}

.slider4 .stage-box {
    position: absolute;
    width: 80vw;
    bottom: calc(100%/2 - 27vw/2);
    height: 27vw;
    left: 10vw;
}

.slider4 .stage-box .col-md-2,
.slider4 .stage-box .col-xs-12,
.slider4 .stage-box .col-xs-6 {
    margin: 0;
    padding: 0;
}

.slider4 .stage-box .stage-mode {
    height: 100%;
}

.slider4 .stage-box .stage-content {
    padding: 11%;
    height: 50%;
    box-sizing: border-box;
}

.slider4 .stage-box .back-box {
    width: 14px;
    height: 14px;
    background: #ffffff;
}

.slider4 .stage-box .bg-red .title-box {
    margin-top: 20px;
}

.slider4 .stage-box .bg-red .title-box .zh-title {
    font-size: 23px;
    color: #ffffff;
    margin-top: 5px;
}

.slider4 .stage-box .bg-red .title-box .en-title {
    font-size: 12px;
    color: #ffffff;
}

.slider4 .stage-box .bg-red .detail-box {
    margin-top: 20px;
}

.slider4 .stage-box .bg-red .detail-box .zh-detail {
    font-size: 14px;
    color: #ffffff;
    margin-top: 5%;
}

.slider4 .stage-box .bg-red .detail-box .en-detail {
    font-size: 12px;
    color: #ffffff;
}

.slider4 .stage-box .bg-gray .detail-box .zh-detail {
    font-size: 14px;
    color: #474747;
}

.slider4 .stage-box .bg-gray .detail-box .en-detail {
    font-size: 12px;
    color: #919191;
    margin-top: 20px;
}

.slider4 .stage-box .stage-fesco {
    overflow: hidden;
}

.slider4 .stage-box .stage-fesco img,
.slider4 .stage-box .stage-imgbox img {
    max-width: 100%;
    min-height: 100%;
}

.slider4 .stage-box .stage-imgbox {
    height: 50%;
    overflow: hidden;
}

@media screen and (max-width: 992px) {
    body {
        overflow: auto;
    }
    .swiper-container {
        height: auto;
        overflow: auto;
    }
    .swiper-wrapper {
        display: block;
        transform: none;
        height: auto;
    }
    div.swiper-slide.slider1,
    div.swiper-slide.slider2,
    div.swiper-slide.slider3,
    div.swiper-slide.slider4 {
        height: auto;
        padding-top: 10px;
    }
    .slider1 .first-line {
        width: 70%;
        margin: 5% 0 0 calc(50% - 40%);
    }
    .slider1 .second-line {
        width: 70%;
        margin: -20% 0 0 calc(50% - 30%);
    }
    .slider1 .img-box {
        padding: 20px 0 0 15px;
        height: 35px;
    }
    .slider1 .img-box img {
        height: 100%;
        width: auto;
    }
    .slider2 {
        background-position: top;
    }
    .slider2 .logo-box {
        padding: 15px;
        padding-top: 30px;
    }
    .slider2 .first-line {
        position: relative;
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    .slider2 .first-line .intro-box {
        float: none;
        width: 100%;
        padding: 15px;
    }
    .slider2 .first-line .intro-box .top-part {
        padding: 15px;
    }
    .slider2 .first-line .img-box {
        text-align: center;
        width: calc(100% - 30px);
        float: none;
        margin: 0 auto;
    }
    .slider2 .first-line .img-box img {
        width: 70%;
        margin: 0 auto;
    }
    .slider2 .second-line {
        width: calc(100% - 30px);
        position: relative;
        margin: 0 auto;
        left: 0;
    }
    .slider2 .second-line img {
        width: 100%;
    }
    .slider2 .second-line .img2,
    .slider2 .second-line .img3 {
        margin-top: 10px;
    }
    .slider2 .second-line .img1 .bottom-part {
        padding: 15px;
    }
    .slider2 .second-line .img3 .bottom-part {
        padding-top: 0;
    }
    .slider2 .second-line .img3 .top-part {
        padding-bottom: 10px;
    }
    .slider2 .second-line .img1 .bottom-part .back-box {
        margin-top: 0;
    }
    .slider2 .first-line .intro-box .top-part .en-text-box {
        margin-top: 20px;
    }
    .slider3 {
        background-position: top;
    }
    .slider3 .logo-box {
        padding: 15px;
    }
    .slider3 .content-box {
        position: relative;
        width: 100%;
        left: 0;
        margin-left: 0;
        margin-top: 0;
        height: auto;
    }
    .slider3 .content-box .detail-content-box .text-box {
        position: relative;
        left: 0;
        width: 100%;
        padding: 15px;
    }
    .slider3 .content-box .detail-content-box .text-box .back-box {
        margin-top: 0;
    }
    .slider3 .content-box .detail-content-box .text-box .detail-box {
        border-top: 1px solid #a3a3a3;
    }
    .slider3 .content-box .detail-content-box {
        margin-top: 15px;
    }
    .slider3 .content-box .detail-content-box:first-child {
        margin-top: 0;
    }
    .slider3 .logo-box .text-box .ch-text-box {
        color: #444;
    }
    .slider3 .logo-box .text-box .en-text-box {
        color: #858585;
    }
    .slider4 {
        background: url(../img/background4.png) no-repeat center top;
    }
    .slider4 .logo-box {
        padding: 30px 15px;
    }
    .slider4 .stage-box {
        position: relative;
        left: 0;
        width: 100%;
        height: auto;
    }
    .slider4 .stage-box .stage-content {
        padding: 5%;
    }
    .gray {
        background: #e5e5e5!important;
    }
    .red {
        background: #e60012;
    }
    .pad0 {
        padding: 0;
    }
}

@media screen and (min-width: 992px) and (max-width: 1370px) {
    .slider1 .first-line {
        margin: 1vw 0 0 calc(50% - 23vw);
    }
    .slider2 .first-line {
        top: 15%;
        height: 38%;
    }
    .slider4 .stage-box .bg-gray .detail-box .zh-detail {
        font-size: 12px;
    }
    .slider2 .first-line .intro-box .top-part {
        padding-top: 10%;
    }
    .slider2 .second-line {
        height: 44%;
    }
    .slider2 .second-line .img1 .bottom-part .back-box {
        margin-top: 0;
    }
    .slider2 .second-line .img1 .bottom-part .zh-text {
        margin-top: 5px;
        font-size: 12px;
    }
    .slider2 .second-line .img1 .bottom-part .en-text {
        margin-top: 5px;
    }
    .slider4 .stage-box .bg-red .detail-box {
        margin-top: 10px;
    }
    .slider4 .stage-box .bg-gray .detail-box .en-detail {
        margin-top: 5px;
    }
    .slider2 .first-line .intro-box .top-part .en-text-box {
        margin-top: 20px;
    }
}