body {
    background-color: #f9f9f9;
}

.wd1000 {
    width: 1000px;
    margin: 0 auto;
}
.common-header {
    background: #fff;
    position: fixed;
    z-index: 1;
    top: 0;
    width: 100%;
    transition: all 0.2s;
}
.index {
    background: transparent;
    color: #fff;
}
.index a,.index i {
    color: #fff;
}
.bg-header {
    background: #fff;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.1);
}
.bg-header a,.bg-header i {
    color: #000000;
}
.bg-header .to-search i {
    color: #ffffff;
}

.user-simple i {
    color: #0a0a0a;
}
.personal-base {
    width: 1200px;
    margin: 0 auto;
}
.personal-header {
    display: flex;
}

.nav-cate {
    margin-left: 70px;
}
.nav-cate a {
    margin-right: 20px;
    font-weight: bold;
}
.nav-cate a:hover {
    color:dodgerblue;
}
.nav-cate a:hover i {
    color:dodgerblue;
}
.to-search {
    margin-right: 25px;
}
.banner {
    margin-top: -70px;
    height: 350px;
    position: relative;
}
.black-banner {
    height: 80px;
    background: #262626;
    text-align: center;
    line-height: 80px;
    font-size: 20px;
    color: #fff;
}
.black-banner span {
    color: #d9534f;
    font-size: 22px;
    font-weight: bold;
}
.fixed-height {
    height: 70px;
}
.select-box {
    padding: 20px;
    margin: 20px 0 20px 0;
    background: #fff;
}
.item-list {
    display: flex;
    flex-wrap: wrap;
}
.item-list a {
    color: #666;
    margin-right: 10px;
    padding: 5px 10px;
    margin-bottom: 10px;
}
.item-list .active,.item-list a:hover {
    color: #fff;
    background: #4a77d4;
    border-radius: 20px;
}
.main {
    background: #fff;
    margin-top: 20px;
    padding: 0 20px;
}


.tip-box {
    padding: 10px 20px;
    background: #f5f5f5;
    border: none;
    font-size: 14px;
    line-height: 1.5;
    position: relative;
    border-radius: 5px;
    color: #666;
    text-align: center;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left:-20px;
    margin-right:-20px;
}
.tip-box span {
    color: #4a77d4;
    font-size: 20px;
    font-weight: bold;
}
.tip-box .download {
    display: block;
    border-radius: 5px;
    padding: 5px 10px;
    text-align: center;
    background: #4a77d4;
    color: #fff;
}
.tip-box .download i {
    color: #fff;
}


.main .img-item {
    margin: 20px -20px 0 -20px;
    text-align: center;
}
.main .img-item img {
    margin-bottom: 10px;
}

.needvip {
    padding: 20px;
    background: #f5f5f5;
    border: none;
    font-size: 15px;
    line-height: 1.5;
    text-align: center;
}
.needvip a {
    color:#4a77d4;
    font-weight: bold;
    font-size: 20px;
    margin: 0 5px;
}

.left-radius {
    position: fixed;
    left: 10px;
    bottom: 10px;
    width: 53px;
    height: 53px;
    line-height: 53px;
    text-align: center;
    background: #eeeeee;
    border-radius: 50%;
    z-index: 99;
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 20%);
    display: none;
}

.down-box {
    padding: 15px;
}

.down-box .p-line {
    margin-bottom: 15px;
    font-size: 15px !important;
}
.down-box .p-line span {
    color: #4a77d4;
    font-size: 18px !important;
    font-weight: bold;
}
.down-box .b-button {
    border: none;
    width: 100%;
    border-radius: 5px;
    padding: 10px 0;
    text-align: center;
    background: #4a77d4;
    color: #fff;
}
.down-box .b-button i {
    color: #fff;
}
.pagination {
    margin-top: 20px;
}
.pagination ul > li > a, .pagination ul > li > span,.pagination ul li input {
    background: #fff;
}
.select-row {
    padding: 10px 0 10px 80px;
    position: relative;
}
.select-row:last-child {
    padding-bottom: 0;
}
.select-row span {
    position: absolute;
    top: 12px;
    left: 10px;
    font-weight: bold;
    font-size: 17px;
    color: #666;
}
.sky-gradient {
    float: left;
    width: 4%;
    height: 100%;
    cursor: pointer;
    transition: box-shadow 150ms, z-index 0ms;
}



.sky-gradient:nth-child(1)::after {
    left: 0%;
}

.sky-gradient:nth-child(2)::after {
    left: -100%;
}

.sky-gradient:nth-child(3)::after {
    left: -200%;
}

.sky-gradient:nth-child(4)::after {
    left: -300%;
}

.sky-gradient:nth-child(5)::after {
    left: -400%;
}

.sky-gradient:nth-child(6)::after {
    left: -500%;
}

.sky-gradient:nth-child(7)::after {
    left: -600%;
}

.sky-gradient:nth-child(8)::after {
    left: -700%;
}

.sky-gradient:nth-child(9)::after {
    left: -800%;
}

.sky-gradient:nth-child(10)::after {
    left: -900%;
}

.sky-gradient:nth-child(11)::after {
    left: -1000%;
}

.sky-gradient:nth-child(12)::after {
    left: -1100%;
}

.sky-gradient:nth-child(13)::after {
    left: -1200%;
}

.sky-gradient:nth-child(14)::after {
    left: -1300%;
}

.sky-gradient:nth-child(15)::after {
    left: -1400%;
}

.sky-gradient:nth-child(16)::after {
    left: -1500%;
}

.sky-gradient:nth-child(17)::after {
    left: -1600%;
}

.sky-gradient:nth-child(18)::after {
    left: -1700%;
}

.sky-gradient:nth-child(19)::after {
    left: -1800%;
}

.sky-gradient:nth-child(20)::after {
    left: -1900%;
}

.sky-gradient:nth-child(21)::after {
    left: -2000%;
}

.sky-gradient:nth-child(22)::after {
    left: -2100%;
}

.sky-gradient:nth-child(23)::after {
    left: -2200%;
}

.sky-gradient:nth-child(24)::after {
    left: -2300%;
}

.sky-gradient:nth-child(25)::after {
    left: -2400%;
}

/* Gradients */
.sky-gradient-00, .sky-gradient-24 {
    background: #00000c;
}

.sky-gradient-01 {
    background: linear-gradient(to bottom, #020111 85%, #191621 100%);
}

.sky-gradient-02 {
    background: linear-gradient(to bottom, #020111 60%, #20202c 100%);
}

.sky-gradient-03 {
    background: linear-gradient(to bottom, #020111 10%, #3a3a52 100%);
}

.sky-gradient-04 {
    background: linear-gradient(to bottom, #20202c 0%, #515175 100%);
}

.sky-gradient-05 {
    background: linear-gradient(to bottom, #40405c 0%, #6f71aa 80%, #8a76ab 100%);
}

.sky-gradient-06 {
    background: linear-gradient(to bottom, #4a4969 0%, #7072ab 50%, #cd82a0 100%);
}

.sky-gradient-07 {
    background: linear-gradient(to bottom, #757abf 0%, #8583be 60%, #eab0d1 100%);
}

.sky-gradient-08 {
    background: linear-gradient(to bottom, #82addb 0%, #ebb2b1 100%);
}

.sky-gradient-09 {
    background: linear-gradient(to bottom, #94c5f8 1%, #a6e6ff 70%, #b1b5ea 100%);
}

.sky-gradient-10 {
    background: linear-gradient(to bottom, #b7eaff 0%, #94dfff 100%);
}

.sky-gradient-11 {
    background: linear-gradient(to bottom, #9be2fe 0%, #67d1fb 100%);
}

.sky-gradient-12 {
    background: linear-gradient(to bottom,#90dffe 0%, #38a3d1 100%);
}

.sky-gradient-13 {
    background: linear-gradient(to bottom, #57c1eb 0%, #246fa8 100%);
}

.sky-gradient-14 {
    background: linear-gradient(to bottom, #2d91c2 0%, #1e528e 100%);
}

.sky-gradient-15 {
    background: linear-gradient(to bottom, #2473ab 0%, #1e528e 70%, #5b7983 100%);
}

.sky-gradient-16 {
    background: linear-gradient(to bottom, #1e528e 0%, #265889 50%, #9da671 100%);
}

.sky-gradient-17 {
    background: linear-gradient(to bottom, #1e528e 0%, #728a7c 50%, #e9ce5d 100%);
}

.sky-gradient-18 {
    background: linear-gradient(to bottom, #154277 0%, #576e71 30%, #e1c45e 70%, #b26339 100%);
}

.sky-gradient-19 {
    background: linear-gradient(to bottom, #163C52 0%, #4F4F47 30%, #C5752D 60%, #B7490F 80%, #2F1107 100%);
}

.sky-gradient-20 {
    background: linear-gradient(to bottom, #071B26 0%, #071B26 30%, #8A3B12 80%, #240E03 100%);
}

.sky-gradient-21 {
    background: linear-gradient(to bottom, #010A10 30%, #59230B 80%, #2F1107 100%);
}

.sky-gradient-22 {
    background: linear-gradient(to bottom, #090401 50%, #4B1D06 100%);
}

.sky-gradient-23 {
    background: linear-gradient(to bottom, #00000c 80%, #150800 100%);
}


.f-m-t {
    margin-top: 30px;
}


.cate-item {
    margin-bottom: 30px;
}

.cate-item h1 {
    font-size: 25px;
    font-weight: normal;
}


.m-list {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
}
.m-list .a-box {
    width: calc((100% - 50px)/ 5);
    border: 0 solid #fff;
    margin: 10px 5px 10px 5px;
    background: #fff;
    border-radius: 9px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.075);
}
.m-list .a-box .scale {
    overflow: hidden;
    border-top-right-radius: 9px;
    border-top-left-radius: 9px;
}
.m-list .a-box .b-box img {
    width: 100%;
    height: 300px;
    transition: all .3s ease-in-out;
}
.m-list .a-box .b-box:hover img {
    -webkit-transform:scale(1.07);-moz-transform:scale(1.07);-o-transform:scale(1.07);transform:scale(1.07);-ms-transform:scale(1.07)
}

.m-list .a-box .info {
    padding: 10px;
}

.m-list .a-box .info .title {
    font-weight: bold;
    line-height: 20px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    height: 40px;
    word-break: break-all;
    display: inline-block;
}

.m-list .a-box .info .title:hover {
    color: dodgerblue;
}

.m-list .a-box .info .line-line {
    height: 1px;
    background: #eee;
    margin: 5px 0;
}

.m-list .a-box .info .row {
    display: flex;
    justify-content: space-between;
}

.m-list .a-box .info .row span {
    display: inline-block;
}
.no-close {
    color:red
}
.search-class {
    width: 500px !important;
    padding: 0 !important;
    display: flex !important;
}
.search-box {

}
.search-box input {
    width: 85%;
    height: 50px;
    padding-left: 10px;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
}
.search-box button {
    width: 15%;
    height: 50px;
    border: none;
    vertical-align: middle;
    cursor: pointer;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.no-data {
    text-align: center;
    line-height: 400px;
    font-size: 30px;
}

.vip-main {
    padding: 40px 0;
    background-image: url(../images/vipbg.png);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.vip-container h1 {
    text-align: center;
    font-size: 28px;
    font-weight: normal;
}
.vip-container h2 {
    text-align: center;
    font-size: 14px;
    font-weight: normal;
    color: #999;
    margin: 20px 0;
}

.vip-box {
    display: flex;
    justify-content: center;
    padding-top: 20px;
}
.vip-box .vip-item {
    width: 300px;
    background: #fff;
    border-radius: 10px;
    margin-right: 50px;
    text-align: center;
    padding-bottom: 20px;
}
.vip-box .vip-item h3 {
    font-size: 20px;
    padding: 15px 0;
    font-weight: normal;
    color: #fff;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.vip-box .v-blue {
    background: #0ec0e6;
}
.vip-box .v-gray {
    background: #ccc;
}
.vip-box .v-yellow {
    background: #d2c55d;
}

.vip-box .vip-item h4 {
    text-align: center;
    font-size: 30px;
    margin: 20px 0;
}
.vip-box .vip-item p {
    margin-bottom: 25px;
}
.question-box {
    padding-top: 70px;
}

.question-box .ask {
    margin-bottom: 20px;
    position: relative;
    padding-left: 40px;
    line-height: 30px;
    font-size: 20px;
    color: red;
}
.question-box .ask span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: #4a77d4;
    text-align: center;
    line-height: 30px;
    color: #fff;
    border-radius: 5px;
}
.question-box .answer {
    margin-bottom: 20px;
    position: relative;
    padding-left: 40px;
    line-height: 30px;
    font-size: 20px;
    color: #4a77d4;
}
.p-0 {
    background: #e74c3c !important;
}
.p-2 {
    background: #f2994b !important;
}
.user-headimg img {
    border: 2px solid #956b30;
}
/********小于1200px的时候**********/
@media (max-width: 1000px) {
    .wd1000 {
        width: 100%;
    }
}



/********小于1200px的时候**********/
@media (max-width: 1200px) {
    .wd1200 {
        width: 100%;
        padding: 0 5px;
    }
    .personal-base {
        width: auto;
    }
    .to-search {
        margin-right: 10px;
    }
    .f-m-t {
        margin-top: 20px;
    }
    .m-list {
        margin-top: 10px;
    }
    .m-list .a-box {
        width: 49%;
        margin: 10px 2% 0 0;
    }
    .m-list .a-box:nth-child(2n){
        margin-right: 0;
    }
    .cate-item {
        margin-bottom: 20px;
    }
    .black-banner {
        height: 50px;
        line-height: 50px;
    }
    .select-box {
        margin: 10px 0 0 0;
        padding:5px;
    }
    .select-row {
        padding: 5px 0 5px 50px;
    }
    .select-row span {
        top: 10px;
    }
    .item-list a {
        margin-right: 0;
        margin-bottom: 5px;
    }
    .cate-item h1 {
        font-size: 15px !important;
    }
    .banner {
        height: 300px;
    }
    .m-list .a-box .b-box img {
        height: 250px;
    }
    .to-search, .menu-open i {
        color: #fff;
    }
    .menu-close i,.one-type a i,.menu-open i{
        color: #000000;
    }
    .fixed-height {
        height: 50px;
    }
    .index .menu-open i {
        color: #fff;
    }
    .bg-header .menu-open i {
        color: #000000;
    }
    .main {
        margin: 0;
    }
    .main .img-item {
        margin: 0 -20px;
    }
    .search-class {
        width: 95% !important;
    }
    .search-box input {
        height: auto;
    }
    .no-data {
        line-height: 200px;
        font-size: 25px !important;
    }
    .question-box {
        padding-top: 20px;
    }
    .vip-container h1 {
        font-size: 20px !important;
    }
    .question-box .ask,.question-box .answer {
        margin-bottom: 10px;
    }
}