.limit-width {
    width: 1200px;
}

.gray a {
    color: #989EA6;
}

.header-top {
    background-color: #12171D;
}

.header-middle {
    height: 137px;
    background-color: #1F222C;
}

.header-middle .middle {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.header-middle .middle-ad {
    width: 100%;
    height: 100%;
}

.header-middle .ad-bg {
    height: 100%;
    width: 100%;
    background-color: #1F222C;
    position: absolute;
    top: 0;
    z-index: 0;
}

.header-bottom {
    background-color: #242A34;
}

.header-top ul li {
    border-right: 1px solid #353F4A;
    padding: 0 14px;
}
.header-top ul li:not(.blue-unset) a:hover {
    color: #f30;
}
.header-bottom ul li:not(.blue-unset) a:hover {
    color: #f30;
}
.header-top li.unset,
.header-top li.blue-unset {
    border-right: unset;
}

.header-top li.blue-unset a {
    color: #5EAEFF;
}

.header-middle .logo-hover {
    width: 215px;
    height: 57px;
    position: absolute;
    top: 40px;
    right: 420px;
}

.header-middle .logo {
    width: 215px;
    height: 57px;
    transition: transform 0.3s;
}

.header-middle .logo:hover {
    transform: scale(1.05);
}

.input-area {
    width: 518px;
    position: absolute;
    top: 40px;
    left: 66px;
}

.input-area .area input {
    width: 427px;
    height: 38px;
    border: 1px solid #2E89E6;
}

.input-area .area input::placeholder {
    color: #999;
}

.input-area .area .search {
    background-color: #2E89E6;
}

.input-area .hot-search li {
    padding: 8px 18px 0 0;
    white-space: nowrap;
}

.input-area .hot-search li a:hover {
    color: #f30;
}

.header-bottom li {
    padding: 10px 25px;
}

.header-bottom li a {
    color: #C0C0C0;
}

.header-bottom li.active {
    border-top: 2px solid #5EAEFF;
}

.header-bottom li.active a {
    color: #fff;
}

.qrcode {
    height: 220px;
    position: absolute;
    top: 14px;
    left: -48px;
    z-index: 1000;
}