body.vogue_details,
body.vogue_details.bg-six,
body.vogue_details.bg-five,
body.vogue_details.bg-four,
body.vogue_details.bg-three,
body.vogue_details.bg-two,
body.vogue_details.bg-two.body-only,
body.vogue_details.bg-one,
body.register {
  background: url("../asset/images_sanguo/bg-sanguo.png") no-repeat center;
  background-size: cover; 
  background-attachment: fixed;
}

.character-list.left,
.character-list.right {
    padding-top: 140px;
}

.new-common-box.right,
.new-common-box.left {
    bottom: -37px;
    position: absolute;
}


@media (min-width: 992px) {

    .character-list.left img, .character-list.right img {
        scale: 2.7;
    }

    .character-list.middle {
        scale: 1.3;
    }

    .character-list {
        padding-bottom: 107px;
    }

    .new-common-box.left {
        left: -57px;
    }

}

@media (max-width: 1200px) {

    .new-common-box.right, .new-common-box.left {
        bottom: 0;
    }

}

@media (max-width: 767px) {

    body.vogue_details,
    body.vogue_details.bg-six,
    body.vogue_details.bg-five,
    body.vogue_details.bg-four,
    body.vogue_details.bg-three,
    body.vogue_details.bg-two,
    body.vogue_details.bg-two.body-only,
    body.vogue_details.bg-one,
    body.register {
        background: url(../asset/images_sanguo/bg-sanguo-mobile.png) no-repeat center;
        background-size: cover;
        background-attachment: fixed;
    }

    .character-list.left, .character-list.right {
        padding-top: 80px;
        padding-bottom: 67px;
    }

    .new-common-box.right {
        right: -49px;
    }

    .vip-card-container .center_card_bg {
        height: 100vh;
        display: block;
        overflow-y: auto;
        overflow-x: hidden;
    }
}

.spp_full {
    width: 100%;
}

@media (max-width: 576px) { 

    .character-list.left {
        margin-right: 12px;
    }
}