.mobile-inner{
    display: none;
}

#main {
    overflow: hidden;
    background: #1A1F33;
    color: #fff;
    margin-top: -70px;
    padding-bottom: 20px;
}

.main-wrap .background{
    width: 100%;
    position: relative;
}

.main-wrap .background img{
    width: 100%;
}

.main-wrap .tit-box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1200px;
    height: 120px;
    transform: translate(-50%,-50%);
}

.main-wrap .tit-box .tit {
    color: #FFFFFF;
    font-size: 48px;
    line-height: 2;
    font-weight: bold;
    text-shadow: 2px 2px 2px rgba(0,0,0,.3);
}

.main-wrap .tit-box .aline{
    width: 60px;
    height: 2px;
    background-color: #fff;
}

.main-wrap .tit-box .dec {
    color: #e6e7ee;
    font-size: 24px;
    line-height: 3;
}

.tab-box {
    border-bottom: 1px solid #313648;
    margin-bottom: 20px;
}
.tab-box .tab {
    display: flex;
    justify-content: center;
}
.tab-box .tab li {
    padding: 15px 8.5px;
    font-size: 16px;
    cursor: pointer;
    margin-bottom: -1px;
}
.tab-box .tab li:hover {
    color: #409eff;
}
.tab-box .tab li.active {
    color: #409eff;
    border-bottom: 1px solid #409eff;
}

.tab-con {
    margin-top: 50px;
}
.tab-con .item {
    display:none;
    width: 100%;
    overflow: hidden;
}
.tab-con .item .pic {
    float: left;
    width: 900px;
    height: 500px;
    position: relative;
}
.tab-con .item .pic img{
    width: 100%;
  	height: 100%;
}

.tab-con .item .pic .item-l {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 36px;
    color: #fff;
}
.tab-con .item-info {
    float: right;
    width: 300px;
    height: 500px;
    background: rgba(31, 56, 95, 0.7);
}

.tab-con .item-info .item-r {
    padding: 20px;
}

.tab-con .item-info .item-r .dec {
    font-size: 15px;
    color: #fff;
    line-height: 25px;
}
.tab-con .item-info .item-r .dec p {
    padding-bottom: 10px;
}
.tab-con .item-info .item-r .more {
    display: block;
    font-size: 16px;
    color: #fff;
    padding: 10px 15px;
    border: 1px solid #fff;
    margin-top: 30px;
}
#footer {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    line-height: 1;
    font-size: 14px;
    color: #fff;
    background: #1a8a69;
}

#footer .icon {
    width: 20px;
    height: 20px;
    margin-left: 15px;
}

@media screen and (max-width: 1200px) {
    #header {display: block;}
    .mobile-inner{
        display: block;
    }
    .w {
        width: 100% !important;
        padding: 10px;
    }
    .main-wrap .background{
        height: 250px;
    }
    .tab-box .tab {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .tab-con .item-info {
        flex-wrap: wrap;
    }
    .tab-con .item-info .item-l, .tab-con .item-info .item-r {
        width: 100% !important;
        flex: auto;
    }
    .tab-con .item-info .item-r .dec p {
        width: 100%;
        padding-bottom: 0px;
    }
    .tab-con .item-info .item-r .more {
        display: inline-block;
        position: static;
        margin-top: 15px;
    }
    #footer {
        flex-wrap: wrap;
        padding: 10px;
        height: auto;
        line-height: 1.2;
    }
}