home.css 4.08 KB
.home-container {
    width: 100%;
    min-width: 1200px;
    margin: 50px 0 0 0;
    background: #fff;
}

.swiper-container img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.home-panel {
    width: 100%;
    height: 210px;
    background: #fff;
}

.news-tab {
    width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    font-size: 18px;
}

.news-tab .tab {
    width: 180px;
    text-align: center;
    height: 50px;
    line-height: 50px;
}

.news-tab .tab-active {
    color: #3287FE;
    border-bottom: 3px solid #3287FE;
}

.news-container {
    background: #F5F5F5;
}

.news-container .news-list {
    width: 1200px;
    margin: 0 auto;
    padding: 20px 0;
}

.news-list .empty {
    width: 100%;
    text-align: center;
    height: 200px;
    line-height: 200px;
}

.news-list .button-group {
    text-align: center;
    margin: 10px 0 20px 0;
}

.news-list .more-button {
    display: inline-block;
    width: 220px;
    height: 50px;
    line-height: 50px;
    background: #3287FE;
    border-radius: 4px;
    color: #fff;
}

.news-list .news-item {
    width: 100%;
    height: 224px;
    box-sizing: content-box;
    padding: 15px 0;
}

.news-item a {
    display: flex;
    height: 100%;
    background: #fff;
}

.news-item .image {
    width: 336px;
    height: 100%;
}

.news-item .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-item .right {
    width: calc(100% - 336px);
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.news-item .right .title {
    font-size: 24px;
    font-weight: 400;
    color: #292929;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}

.news-item .right .desc {
    height: 82px;
    line-height: 26px;
}

.news-item .right .time {
    color: #999999;
    line-height: 20px;
}

.news-item .right .time img {
    margin: 2px 4px 0 0;
}

.company-info {
    /*width: 100%;*/
    /*background: #fff;*/
    position: relative;
    /*height: 820px;*/
    /*overflow: hidden;*/
}

.company-info .company-bg {
    /*position: absolute;*/
    /*left: 0;*/
    /*top: 0;*/
    /*z-index: 10;*/
    /*width: 100%;*/
    /*height: auto;*/
    /*object-fit: cover;*/
    width: 100%;
    height: auto;
}

.company-info .text-container {
   width: 1200px;
   height: 100%;
   margin: 0 auto;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   z-index: 20;
}

.text-container .info {
    position: absolute;
    width: 500px;
    top: 200px;
    left: 10px;
}

.text-container .info .title {
    height: 23px;
    font-size: 24px;
    font-weight: 500;
    color: #292929;
    position: relative;
}

.text-container .info .title::after {
    content: ' ';
    width: 70px;
    height: 2px;
    background: #3287FE;
    position: absolute;
    left: 0;
    bottom: -20px;
}

.text-container .info .desc {
    margin: 50px 0 0 0;
    font-size: 16px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #4D4D4D;
    line-height: 32px;
}

.company-business {
}

.company-business .text-container .info {
    width: 400px !important;
    top: 300px;
    left: 780px !important;
}

.partner-container {
    height: 500px;
}

.partner-container .partners {
    width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.partners .item {
    width: 224px;
    height: 84px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0 20px 0;
    border: 1px solid #EDEDED;
}

.partners .item img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.partners .item .title {
    position: relative;
    z-index: 2;
    font-size: 16px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #4D4D4D;
    width: 70%;
    margin: 0 auto;
    text-align: center;
}

.clear {
  clear: both;
}

@media (max-width: 1560px) {
    .company-business .text-container .info {
        top: 200px !important;
        left: 740px !important;
    }
}