.banner{
    height: 430px;
}
.banner .customPage{
    color: #fff; 
}
.banner img{
    width: 100%;
    height: 430px;
}

.main{
    width: 100%;
}
.main-top{
    width: 100%;
    height: 340px;
}
.main-left{
    width: 840px;
    height: 340px;
}
.main-list{
    width: 100%;
    height: 180px;
}
.main-list-con{
    width: 120px;
    height: 180px;
    float: left
}
.main-list .main-list-con h3{
    font-size: 18px;
    color: #333;
    padding: 38px 0 5px 0;
    font-weight: bold;
}
.main-list .main-list-con h4{
    font-size: 24px;
    color: #999;
    font-family: "dinCond-Medium";
    line-height: 24px;
    font-weight: 500;
}
.main-list ul{
    /* float: right */
}
.main-list li{
    width: 198px;
    height: 180px;
    float: left;
    transition: all 0.3s;
}
.main-list li:hover{
    background: #f4f4f4;
    transition: all 400ms
}
.main-list li p{
    font-size: 14px;
    color: #666;
    font-weight: bold;
    text-align: center;
    padding-top: 120px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
}
.main-list .main-list1 p{
    background: url('../images/main-list1.png') no-repeat center 50px;
}
.main-list .main-list2 p{
    background: url('../images/main-list2.png') no-repeat center 50px;
}
.main-list .main-list3 p{
    background: url('../images/main-list3.png') no-repeat center 50px;
}
.main-list .main-list4 p{
    background: url('../images/main-list1.png') no-repeat center 50px;
}
.main-list .main-list5 p{
    background: url('../images/main-list2.png') no-repeat center 50px;
}
.main-list .main-list6 p{
    background: url('../images/main-list3.png') no-repeat center 50px;
}
.main-list .main-list7 p{
    background: url('../images/main-list1.png') no-repeat center 50px;
}

.main-global{
    box-sizing: content-box;
    width: 320px;
    height: 160px;
    padding: 0 20px;
    background: url('../images/main-bg2.png') no-repeat center center;
    float: right;
}
.main-global h3{
    font-size: 18px;
    color: #fff;
    padding-top: 38px;
    font-weight: bold;
}
.main-global h4{
    font-size: 24px;
    color: #26a2ae;
    color: #fff;
    font-family: "dinCond-Medium";
    font-weight: 500;
    letter-spacing: -1.5px
}
.main-about{
    box-sizing: content-box;
    width:480px;
    height: 160px;
    padding-left: 360px;
    background: url('../images/main-left.jpg') no-repeat center center / 100% 100%;
    position: absolute;
    left: -360px;
    bottom: 0
}
.main-about h3{
 font-size: 18px;
 color: #fff;
 padding-top: 38px;
 font-weight: bold;
}
.main-about h4{
    font-size: 24px;
    color: #fff;
    font-family: "dinCond-Medium";
    font-weight: 500;
    letter-spacing: -1.5px
}
.main-about-img{
    display: none;
    width: 431px;
    height: 111px;
    position: absolute;
    right: 0;
    bottom: 0;
    animation-delay: 1.8s
}
.main-right{
    box-sizing: content-box;
    width: calc(100% - 840px);
    height: 320px;
    padding: 20px 20px 0 20px;
    position: absolute;
    right: 0;
    bottom: 0;
    background: #f4f4f4;
    z-index: 3
}
.main-right .main-right-img{
    width: 100%;
    height: 200px;
}
.main-right .main-right-img video{
    /* margin-top: 10px; */
    width: 100%;
    height: 200px;
    object-fit: fill;
}
.main-right h3{
    font-size: 18px;
    color: #333;
    padding: 18px 0 5px 0;
    font-weight: bold
}
.main-right p{
    font-size: 12.5px;
    color: #999;
}
.main-top .main-bac {
    /* width: 260px;
    height: 340px;
    background: #eaeaea;
    position: absolute;
    right: -360px;
    bottom: 0;
    z-index: 1; */
    display: none
}
.main-news {
    box-sizing: content-box;
    width: 840px;
    height: 150px;
    padding-top: 40px;
    float: left;
}
.main-news-img {
    width: 200px;
    height: 120px;
    float: left;
}
.main-news-img img {
    width: 100%;
}
.main-news-con {
    width: 600px;
    height: 150px;
    padding: 0 20px;
    float: left;
}
.main-news-con h3 {
    font-size: 16px;
    color: #565656;
    font-weight: bold
}
.main-news-con h4 {
    font-size: 24px;
    color: #0e98a5;
    font-family: "dincond-medium";
    padding: 3px 0;
    font-weight: bold
}
.main-news-con p {
    font-size: 12.5px;
    color: #999999;
    line-height: 22px;
}
.bgy-more {
    font-size: 12.5px;
    color: #f5a100;
    padding-top: 4px;
}
.main-switch {
    width: 358px;
    height: 150px;
    padding-top: 40px;
    /* border-left: 2px #f4f4f4 solid; */
    float: right;
}
.main-switch .main-switch-top {
    border-bottom: 2px #f4f4f4 solid;
    margin-bottom: 20px;
    padding-left: 20px;
    position: relative;
    height: 42px;
}
.main-switch .main-switch-top a {
    font-size: 14px;
    color: #565656;
    margin-right: 18px;
    float: left;
    height: 42px;
    font-weight: bold;
}
.main-switch .main-switch-top a.curr {
    border-bottom: 2px #f5a100 solid;
}
.switch-navslip {
    position: absolute;
    width: 0;
    height: 2px;
    background: #f5a100;
    left: 0;
    bottom: -2px;
}
.main-switch .main-switch-item {
    width: 340px;
    padding-left: 20px;
}

.main-switch .main-switch-item div {
    font-size: 12.5px;
    color: #999999;
    font-weight: bold;
    display: block;
    cursor: pointer;
    width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 20px;
}
.none {
    display: none;
}
.waiting{
    height: 100%;
    font-weight: normal !important;
}
.main-list li.waiting p{
    padding-top: 100px;
    font-size: 12px;
    font-weight: normal
}



@media (max-width: 1011px){
    .banner{
        height: auto;
        margin-top: 55px
    }
    .banner img{
        width: 100%;
        height: 100px;
    }
    .main-list li.waiting p{
        padding-top: 40px;
        font-size: 12px;
        font-weight: normal
    }
}
@media (max-width: 1011px){
    .main-top{
        height: auto;
    }
    .main-left{
        width: 100%;
        height: auto;
    }
    .main-right{
        width: 100%;
        position: relative;
        padding: 16px;
        height: auto;
        box-sizing: border-box;
    }
    .main-list{
        height: auto
    }
    .main-list-con{
        display: none
    }
    .main-list li{
        width: 30%;
        height: 100px;
        float: none;
    }
    .main-list ul{
        width: 100%;
        display: flex;
        align-items: center;
        height: 100px;
        justify-content: space-around;
    }
    .main-list li p{
        padding-top: 70px
    }
    .main-list .main-list1 p{
        background: url(../images/main-list1.png) no-repeat center 16px;
    }
    .main-list .main-list2 p{
        background: url(../images/main-list2.png) no-repeat center 16px;
    }
    .main-list .main-list3 p{
        background: url(../images/main-list3.png) no-repeat center 16px;
    }
}

@media (max-width: 1011px) {
    .main-global{
        display: block;
        width: 100%;
        padding: 20px;
        height: auto;
        float: none;
        background: url('../images/main-bg2.png') no-repeat center center / 100% auto;
    }
}
@media (max-width: 1011px) {
    .main-about{
        display: block;
        position: relative;
        background: url('../images/main-left.jpg') no-repeat center center/ 100% auto;
        /* padding: 20px; */
        /* left: 0; */
        width: 100%;
        height: auto;;
    }
    .main-about h3{
        padding-left: 20px;
    }
    .main-about h4{
        padding-left: 20px;
        padding-bottom: 20px;
    }
    .main-right .main-right-img{
        height: auto;
    }
    .main-right .main-right-img video{
        height: auto;
        margin: 0;
    }
}

@media (max-width: 1011px) {
    .main-news{
        display: none
    }
    .main-switch{
        float: none;
        padding-top: 14px;
        height: auto;
        width: 100%;
    }
    .main-switch .main-switch-item{
        width: 100%;
        padding:  0 20px
    }
    .main-switch .main-switch-item div{
        margin-bottom: 8px
    }
}