@charset "UTF-8";
/* 202309062135 */

/* 通用页面配置 */

[class*="container"] {
    padding: 0;
}

.mainstay > .container-fluid {
    width: 75%;
}

.mainstay > .container-fluid > .row > .left-menu {
    padding-right: 0.8rem;
}

/* 左边快捷 */
.mainstay > .container-fluid > .row > .left-menu > .row > div > a {
    display: block;
    width: 100%;
    height: 100%;
}

.mainstay > .container-fluid > .row > .left-menu > .row > div.shortcut {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: left top;
    margin-bottom: 0.3rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > div.shortcut:hover {
    transform: scale(0.95);
}

.mainstay > .container-fluid > .row > .left-menu > .row > .download {
    background-image: url('/assets/img/game-download-shortcut.png');
    height: 10rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .register {
    background-image: url('/assets/img/register-shortcut.png');
    height: 5rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .customer {
    background-image: url('/assets/img/customer-shortcut.png');
    height: 5rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .activity {
    background-image: url('/assets/img/activity-expectation.png');
    border: 0.12rem solid rgb(190, 145, 104);
    height: 10rem;
}

/* 社群入口 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association {
    background-image: url("/assets/img/red-square-bg.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

/* 二维码 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .code {
    height: 12.8rem;
    display: flex;
    flex-flow: row;
    align-items: flex-end;
    justify-content: center;
    margin-bottom: 0.5rem;
}

/* 点击按钮后 切换此处的二维码背景图 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .code:after {
    display: block;
    content: "";
    width: 11.5rem;
    height: 11.5rem;
    background-repeat: no-repeat;
    background-size: 11.5rem 11.5rem;
    background-color: whitesmoke;
    border: 0.15rem solid rgb(190, 145, 104);
}

/* 所有社群按钮 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.755rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn:nth-child(even) {
    padding-left: 1.2rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn:nth-child(odd) {
    padding-right: 1.2rem;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn:after {
    display: block !important;
    content: "";
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 100%;
    width: 7.5rem;
    height: inherit;

}

/* 底部垫片 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.shim {
    height: 1.8rem;
}

/* 官方QQ群 按钮 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-qq:after {
    background-image: url("/assets/img/official-qq.png");
}

/* 官方微信客户 按钮 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vx-customer:after {
    background-image: url("/assets/img/official-vx-customer.png");
}

/* 官方抖音 按钮 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-dy:after {
    background-image: url("/assets/img/official-dy.png");
}

/* 官方微信公众号 按钮 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vxgzh:after {
    background-image: url("/assets/img/official-vxgzh.png");
}

.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn:hover::after {
    transform: scale(1.05);
    cursor: pointer;
}

.mainstay > .container-fluid > .row > .left-menu > .row > .association > div.association-btn:active::after {
    transform: scale(0.95);
    cursor: pointer;
}

/* 官方QQ群 按钮 点击 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-qq.active::after {
    background-image: url("/assets/img/official-qq-active.png");
}

/* 官方微信客户 按钮 点击 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vx-customer.active::after {
    background-image: url("/assets/img/official-vx-customer-active.png");
}

/* 官方抖音 按钮 点击 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-dy.active::after {
    background-image: url("/assets/img/official-dy-active.png");
}

/* 官方微信公众号 按钮 点击 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vxgzh.active::after {
    background-image: url("/assets/img/official-vxgzh-active.png");
}

/* 点击社群入口后给二维码设置相应社群类即可切换二维码 */
/* 官方QQ群 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .code.official-qq-code:after {
    background-image: url("/assets/img/official-qq-code.png");
}

/* 官方微信客户 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vx-customer-code:after {
    background-image: url("/assets/img/official-vx-customer-code.png");
}

/* 官方抖音 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-dy-code:after {
    background-image: url("/assets/img/official-dy-code.png");
}

/* 官方微信公众号 */
.mainstay > .container-fluid > .row > .left-menu > .row > .association > .official-vxgzh-code:after {
    background-image: url("/assets/img/official-vxgzh-code.png");
}

/* 居右主体 */
.mainstay > .container-fluid > .row > .main {
    margin-top: 0.5rem;
}

.mainstay > .container-fluid > .row > .main {
    /* 高度由具体页面来设置 */
    height: auto;
    background-color: black;
    opacity: 0.85;
    border-radius: 0.3rem;
    border: 0.15rem solid rgb(94, 81, 10);
    padding: 0.8rem 1.2rem 11.2rem 1.2rem;
    position: relative;
}

.mainstay > .container-fluid > .row > .main > .title {
    min-height: 6.5rem;
}

.mainstay > .container-fluid > .row > .main > .title > div:first-child {
    background-image: url("/assets/img/sun-bg.png");
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 10.5rem auto;
    display: flex;
    flex-flow: row;
}

.mainstay > .container-fluid > .row > .main > .row.title > div:first-child > div.icon {
    flex: 1;
    background-position: left top;
    background-repeat: no-repeat;
    margin-top: 1.5rem;
    margin-left: 1.8rem;
    background-size: 6rem;
}

.mainstay > .container-fluid > .row > .main > .row.title > div:first-child > div.route {
    color: rgb(253, 240, 117);
    margin-top: 2.4rem;
    font-size: 0.8rem;
}