body {
    color: #fff;
    overflow: hidden;
    background: url(../../images/backgroundImage-20190419.jpg) no-repeat center top;
    background-size: cover;
}

.container {
    /*top: 48%;
    transform: translateY(-50%);*/
    width: 100%;
    min-width:1100px;
}

/*-------2019.1.3---------*/

.header {
    text-align: left;
    width: 100%;
    height: 100%;
    /* line-height: 10rem; */
    margin-bottom: 4%;
    margin-top: 4%;
    /*animation: pMove 1s linear;*/
    /* position: relative; */
}

    .header ul {
        /* position: absolute; */
        /*opacity: 0;*/
        opacity: 1;
    }

        .header ul li {
            margin-bottom: 5px;
        }

            .header ul li p {
                /*position: relative;*/
                /*left: 50%;*/
                /*transform: translateX(-30%);*/
                text-align: left;
                /*padding-left: 20%;*/
            }



    .header span {
        color: red;
        font-weight: 700;
        font-size: 1.5rem;
    }

    .header b {
        font-size: 1rem;
    }


/*@keyframes pMove {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}*/

/*==================================================================================
*/
.middle-main {
    width: 60%;
    height: 100%;
    margin: 0 auto;
}

.middle {
    /* background: url(../images/starspace.png) no-repeat; */
    background-size: cover;
    text-align: center;
    width: 100%;
    /* border-top: 4px solid #3f5165; */
    /* border-bottom: 4px solid #3f5165; */
}

.middle-box {
    /*top: 70%;*/
    /*left: 50%;*/
    height: 100%;
    /*transform: translate(-50%, -50%);*/
}

    .middle-box li {
        height: 100%;
        line-height: 100%;
        /* margin-top: 20%; */
        padding-top: 13%;
        float: left;
        /*opacity: 1;*/
        /*filter: alpha(opacity=100);*/
        /*animation: liFadeIn 1s linear 1s forwards;*/
        /* display: none; */
        /*opacity: 0;*/
        opacity: 1;
    }

        /*@keyframes liFadeIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;        
        transform: translateY(0px);
    }
}*/

        .middle-box li div {
            width: 75%;
            height: 50%;
            margin: 0 auto 0 auto;
            border-radius: 2rem;
            transition: all 0.3s;
        }

            .middle-box li div a {
                display: block;
                padding-top: 5%;
                background-color: rgba(17, 30, 38, 0);
                border-radius: 2rem;
                color: rgba(255, 255, 255, .9);
                transition: all 0.3s;
            }

                .middle-box li div a:hover {
                    background-color: rgba(17, 30, 38, 0.5);
                    margin-top: -5px;
                    box-shadow: 0 0 25px rgba(255, 255, 255, 1);
                    color: rgba(255, 255, 255, 1);
                    text-shadow: 0 0 15px rgba(255, 255, 255, 0.5);
                }

    .middle-box p:last-child {
        font-size: 1.8rem;
        height: 2.4rem;
        line-height: 2rem;
        /*margin-bottom: 5%;*/
    }

    .middle-box .fonticon {
        font-size: 8rem;
        line-height: 10rem;
    }

/*--------------------------------------------------------------*/
.more-items {
    width: 100%;
    bottom: 10%;
    /*left: -50%;*/
    /*transform: translateX(-50%);*/
    text-align: center;
    /*filter: alpha(opacity=100);*/
    /*opacity: 0;*/
    opacity: 1;
    /*animation: moreItems 1s linear 2.2s forwards;*/
}

    /*@keyframes moreItems {
    from {
        opacity: 0;
        width: 40%;
    }

    to {
        opacity: 1;
        width: 100%;
    }
}*/

    .more-items a {
        display: inline-block;
        width: auto;
        height: auto;
        font-size: 1.4rem;
        color: #fff;
        border-radius: 1rem;
        padding: 5px;
        transition: all 0.3s;
    }

        .more-items a:hover {
            box-shadow: 0 0 25px rgba(255, 255, 255, 1);
            background-color: rgba(17, 30, 38, 0.5);
        }

    .more-items span {
        padding: 0 1%;
    }


/*==================================================================================*/

.bottom {
    font-size: 1rem;
    line-height: 2rem;
    text-align: center;
    padding-top: 10px;
}

    .bottom a {
        color: #fff;
        font-size: 1rem;
    }

        .bottom a:hover {
            text-decoration: underline;
        }

/*==================================*/

/*登录框样式修改2018.12.19*/
/*表单样式*/
.data-form input[type=text],
.data-form textarea,
.data-form input[type=password] {
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, .075);
    border-radius: 4px;
    transition: all 0.4s;
}

    .data-form input[type=text]:hover,
    .data-form textarea:hover,
    .data-form input[type=password]:hover {
        border: 1px solid #0090ff;
    }

    .data-form input[type=text]:focus,
    .data-form textarea:focus,
    .data-form input[type=password]:focus {
        border: 1px solid #0090ff;
        box-shadow: 0 0 10px 0 rgba(24, 153, 253, .5);
    }



/*按钮*/
#dialog-confirm .btn {
    display: inline-block;
    height: 28px;
    border-radius: 4px;
    color: #fff;
    font-size: 1rem;
    padding: 5px 10px;
    background-color: #3e8ef7;
    transition: all 0.3s;
    margin-left: 10px;
    border: 0;
}

#dialog-confirm .btn:hover {
    background-color: #79b2fc;
}
.btn {
    display: inline-block;
    height: 28px;
    border-radius: 4px;
    color: #fff;
    font-size: 1rem;
    padding: 5px 10px;
    background-color: #3e8ef7;
    transition: all 0.3s;
    margin-left: 10px;
    border: 0;
}
.btn:hover {
    background-color: #79b2fc;
}