/* .page-item.scene {
    height : 1889px;
    height : 98.3854166666667vw;
} */




.page-item .page-item-scene {
    /* padding   : 496px/1920 0; */
    box-sizing      : border-box;
    padding         : 90px 0 0;
    width           : 1920px;
    height          : 1080px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    flex-direction  : column;
    transform-origin: left top;
    overflow        : visible;
    position        : absolute;
    top             : 0;
    /* left         : 320px/1920; */
    left            : 0;
    z-index         : 8;
}


.page-item.scene .scene-items {
    padding-top: 90px;
    text-align : center;
}

.page-item.scene .scene-item {
    display        : inline-flex;
    vertical-align : top;
    align-items    : center;
    flex-direction : column;
    justify-content: center;
    width          : 300px;
    height         : 300px;
    border-radius  : 30px;
    background     : rgba(255, 255, 255, 0.6);
}

.page-item.scene .scene-item+.scene-item {
    margin-left: 21px;
}

.page-item.scene .scene-item .scene-item-icon {
    position: relative;
}

.page-item.scene .scene-item .scene-item-icon img {
    display                   : block;
    width                     : 150px;
    height                    : 124px;
    transition                : all 800ms;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.175);
}

.page-item.scene .scene-item .scene-item-icon .tip {
    position : absolute;
    top      : 50%;
    left     : 50%;
    transform: scale(0);
}

.page-item.scene .scene-item .scene-item-title {
    padding-top: 20px;
    font-family: 'SourceHanSansCN-Heavy';
    font-weight: 700;
    font-size  : 32px;
    color      : rgba(51, 51, 51, 0.7);
}

.page-item.scene .scene-item .scene-item-desc {
    padding-top: 10px;
    font-weight: 400;
    font-size  : 18px;
    color      : rgba(51, 51, 51, 0.5);
    position   : absolute;
    bottom     : 20px;
    opacity    : 0;
}




.page-item.scene .scene-item .scene-item-icon,
.page-item.scene .scene-item .scene-item-title,
.page-item.scene .scene-item .scene-item-desc {
    transition                : all 800ms;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.175);
}

.page-item.scene .scene-item:hover .scene-item-icon,
.page-item.scene .scene-item:hover .scene-item-title,
.page-item.scene .scene-item:hover .scene-item-desc {
    transform: translateY(-20px);
}

.page-item.scene .scene-item:hover .scene-item-desc {
    opacity: 1;
}




.page-item.scene-2 .scene-item:hover .scene-item-icon {
    transform: translateY(-50px);
    opacity  : 0;
}

.page-item.scene-2 .scene-item:hover .scene-item-title {
    transform: translateY(-100px);
}

.page-item.scene-2 .scene-item:hover .scene-item-desc {
    transform: translateY(-80px);
    opacity  : 1;
}




.page-item.scene .scene-item.order:hover .scene-item-icon .icon {
    transform: rotate(-20deg);
}

.page-item.scene .scene-item.order .scene-item-icon .tip-101 {
    width : 47px;
    height: 62px;
}

.page-item.scene .scene-item.order .scene-item-icon .tip-102 {
    width : 39px;
    height: 57px;
}

.page-item.scene .scene-item.order .scene-item-icon .tip-103 {
    width : 25px;
    height: 35px;
}

.page-item.scene .scene-item.order:hover .scene-item-icon .tip-101 {
    left     : 9px;
    top      : 53px;
    transform: scale(1);
}

.page-item.scene .scene-item.order:hover .scene-item-icon .tip-102 {
    left     : 90px;
    top      : -5px;
    transform: scale(1);
}

.page-item.scene .scene-item.order:hover .scene-item-icon .tip-103 {
    left     : 0px;
    top      : 43px;
    transform: scale(1);
}



.page-item.scene .scene-item.edm:hover .scene-item-icon .icon {
    transform: rotate(-15deg);
}

.page-item.scene .scene-item.purchase:hover .scene-item-icon .icon {
    z-index: 1;
}

.page-item.scene .scene-item.purchase .scene-item-icon .tip-22587 {
    width    : 62px;
    height   : 52px;
    left     : 58px;
    top      : 7px;
    transform: scale(1);
}

.page-item.scene .scene-item.purchase .scene-item-icon .tip-22588 {
    width    : 52px;
    height   : 43px;
    left     : 107px;
    top      : 7px;
    transform: scale(1);
    z-index  : -1;
}

.page-item.scene .scene-item.purchase:hover .scene-item-icon .tip-22587 {
    left     : 60px;
    top      : -17px;
    transform: scale(1) rotate(-15deg);
}

.page-item.scene .scene-item.purchase:hover .scene-item-icon .tip-22588 {
    left     : 117px;
    top      : -3px;
    transform: scale(1);
}



.page-item.scene .scene-item.cash .scene-item-icon .tip-97 {
    width    : 45px;
    height   : 27px;
    left     : 82px;
    top      : 45px;
    transform: scale(1);
}

.page-item.scene .scene-item.cash:hover .scene-item-icon .tip-97 {
    height: 40px;
    left  : 82px;
    top   : 10px;
}





.page-item .page-item-scene .translate {
    transform: var(--data-transform, translateY(100px));
}




.page-item .page-item-scene.fixed {
    position: fixed;
}

.page-item .page-item-scene.force {
    /* 保证不被后面的元素遮挡 */
    z-index: 9;

}




/* .page-item.scene-2 {} */
.page-item.scene-2 .page-item-scene .page-item-title {
    opacity: 1;
}

.page-item.scene-2 .page-item-scene.scroll .page-item-title {
    opacity: 0;
}