@font-face {
    font-family: "SourceHanSans";
    src: url("../img/SourceHanSansCN-Normal.otf") format("opentype");
    font-display: swap;
}
@font-face {
    font-family: "SourceHanSans";
    font-weight: bold;
    src: url("../img/SourceHanSansCN-Medium.otf") format("opentype");
    font-display: swap;
}
@font-face {
    font-family: "ArialEn";
    src: url("../img/arial.ttf") format("truetype");
    font-display: swap;
}
@font-face {
    font-family: "GraphikWide";
    src: url("../img/GraphikWide-Regular.otf") format("opentype");
    font-display: swap;
}
@font-face {
    font-family: "GraphikWide";
    font-weight: bold;
    src: url("../img/GraphikWide-Medium.otf") format("opentype");
    font-display: swap;
}
.gray {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
div,
img {
    user-select: none;
}
textarea,
input,
select {
    -webkit-appearance: none;
    appearance: none;
    position: absolute;
    box-sizing: border-box;
    border: none;
    -webkit-background-size: contain;
    -webkit-border-radius: 0;
    -webkit-box-sizing: border-box;
    border-radius: 0;
    background: transparent center center no-repeat;
    background-size: contain;
    color: rgba(0, 0, 0, 1);
    text-align: left;
    text-indent: 0;
    font-family: "ArialEn", "SourceHanSans";
    font-size: 4.8vw;
    text-align: center;
    font-weight: bold;
    padding: 0;
    margin: 0;
    outline: none;
}
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder {
    color: #808080;
}
.screentip {
    font-family: "ArialEn", "SourceHanSans";
    z-index: 999999999;
}
.swiper-button-disabled {
    display: none;
}
html {
    background: rgb(0, 0, 0);
    color: rgba(0, 0, 0, 0.85);
}

html,
body,
.m-page {
    min-height: 100vh;
    font-size: 4vw;
    font-family: "ArialEn", "SourceHanSans";
    background-color: #000;
}

@media screen and (orientation: landscape) {
    html,
    .m-page {
        font-size: 4vh;
    }
}

.m-alert .d-albutton {
    color: #333;
}
.music {
    top: 3%;
    right: 3%;
    z-index: 9999;
    margin-top: -1%;
    width: 7.2vw;
    height: 7.2vw;
    background: transparent center center no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
    background-image: url(../img/musicoff.png);
}
.music.on {
    /* -webkit-animation: weuiLoading 5s linear infinite;
    animation: weuiLoading 5s linear infinite; */
    background-image: url(../img/musicon.png);
}
.pageLoading {
    background: #fff center center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}
#tvc {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-object-fit: cover;
    object-fit: cover;
    -webkit-object-position: 50% 50%;
    object-position: 50% 50%;
    /* display: none; */
}
/* #tvc::-webkit-media-controls-play-button,
#tvc::-webkit-media-controls-start-playback-button {
    opacity: 0;
    pointer-events: none;
    width: 5px;
} */

.p-index {
    background: transparent center center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}
.mask {
    z-index: 9999999;
    background: rgba(0, 0, 0, 0.75);
}
.loading {
    position: fixed;
    z-index: 999999;
    background: rgba(0, 0, 0, 0.75);
    /* display: none; */
}
.loading .txt {
    margin-top: -10vw;
}

.m-page.active {
}

.bg {
    top: -1vw;
    left: -1vw;
    width: 102vw;
    height: 102vh;
    background: #000 center center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.logo {
    top: 10%;
    margin-top: 3%;
    left: 39.53%;
    width: 20.93%;
    z-index: 9;
    -webkit-touch-callout: none;
    touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
}

.small .logo {
    top: 20%;
    margin-top: -25%;
}

.logo1 {
    top: 70%;
    margin-top: 35%;
    left: 34.2%;
    width: 31.6%;
    z-index: 9;
    -webkit-touch-callout: none;
    touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
}

.name {
    top: 10%;
    right: 9%;
    margin-top: -6%;
    font-size: 3.75vw;
    color: #fff;
    font-weight: bold;
    text-align: right;
    z-index: 9;
    line-height: 1.2;
}

.slogan1 {
    top: 65%;
    left: 34.2%;
    margin-top: 45%;
    width: 31.6%;
    z-index: 9;
    -webkit-touch-callout: none;
    touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
}

.back {
    top: 10%;
    margin-top: -5%;
    left: 9.067%;
    width: 8%;
    z-index: 9;
}

.small .back {
    top: 20%;
    margin-top: -25%;
}

.contentbox {
    top: 50%;
    left: 6%;
    margin-top: -61%;
    width: 88%;
    height: 126vw;
    background: #fafafa;
    border-radius: 4vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.btn,
.tipsbtn {
    top: 50%;
    left: 15.205vw;
    margin-top: 53%;
    font-size: 3.775vw;
    width: 69.59vw;
    height: 9.333vw;
    line-height: 1.05;
    background: #e6542a url(../img/btn.png) no-repeat center center/100% 100%;
    color: #ffffff;
    font-weight: normal;
    text-align: center;
    border-radius: 6vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    box-sizing: border-box;
}

.btn.style1 {
    background: transparent;
    border: 1px solid #000;
    color: #000;
}

.btn.style2 {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
}

.btn.style3 {
    background: #1f4456;
    color: #fff;
}

.btn span {
    position: relative;
}

.btn span:last-child {
    font-size: 2.643vw;
}

.btn::before {
    content: " ";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.btn.act::before,
.btn:hover::before {
    transition: all linear 0.05s;
    opacity: 1;
}

.shadow2 {
    background: transparent center center no-repeat;
    -webkit-background-size: 80% auto;
    background-size: 80% auto;
}

.shadow3 {
    bottom: -4vw;
    left: 0;
    width: 100%;
    height: 32vw;
    background: transparent center center no-repeat;
    -webkit-background-size: 90% auto;
    background-size: 90% auto;
}

.shadow4 {
    top: 44vw;
    left: 0;
    width: 100%;
    height: 62vw;
    background: transparent center center no-repeat;
    -webkit-background-size: 96% auto;
    background-size: 96% auto;
}

@media screen and (max-aspect-ratio: 750/1470) {
    #canvas-wrapper canvas {
        height: 100% !important;
    }
}

.p-home .bg {
    background-image: url(../img/bg1.png);
}

.p-home .slogan {
    top: 40%;
    margin-top: -16.5%;
    left: 9.27%;
    width: 81.46%;
}

.p-home .title {
    top: 60%;
    margin-top: 1.6%;
    left: 20.335%;
    width: 59.33%;
}

.p-home .btn-go {
    top: 80%;
    margin-top: 4%;
    left: 21.87%;
    width: 56.26%;
    background: #e6542a;
}

.slogan1 {
    top: 15%;
    margin-top: 0%;
    left: 28%;
    width: 44%;
}

.small .slogan1 {
    top: 23%;
    margin-top: -17%;
}

.p-menu .menubox,
.p-event-menu .menubox,
.p-event-photo1 .menubox,
.p-event-photo2 .menubox,
.p-event-video1 .menubox {
    top: 50%;
    margin-top: -39%;
    left: 15.27%;
    width: 69.46%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.p-menu .menubox .btnbox {
    width: 100%;
}

.p-menu .menubox .menubtn {
    width: 100%;
    height: 15.733vw;
    background: #1f4456;
    border-radius: 4vw;
    line-height: 1.4;
    border: 0;
    box-sizing: border-box;
    margin-top: 5.333vw;
    text-align: center;
    font-size: 5.333vw;
    color: #ffffff;
    font-weight: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.p-menu .menubox .menubtn span {
    position: relative;
}

.p-menu .menubox .menubtn span:last-child {
    font-size: 3.372vw;
    font-weight: 500;
}

.p-menu .menubox .menubtn::before {
    content: " ";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    /* background: url(../img/btn-act.png) no-repeat right bottom/100% 100%; */
    opacity: 0;
}

.p-menu .menubox .menubtn:hover {
    font-weight: bold;
}

/* .p-menu .menubox .menubtn:hover::before {
    transition: all linear 0.05s;
    opacity: 1;
} */

.p-menu .menubox .menubtn:first-child {
    margin-top: 0;
}

.p-qr .slogan1,
.p-quiz .slogan1 {
    top: 10%;
    margin-top: -5%;
}

.small .p-qr .slogan1,
.small .p-quiz .slogan1 {
    top: 20%;
    margin-top: -25%;
}

.p-qr .poster {
    top: 50%;
    margin-top: -60%;
    left: 10.335%;
    width: 79.33%;
    display: none;
}

.p-qr .qr {
    top: 50%;
    margin-top: 5%;
    left: 17vw;
    width: 19.467vw;
    height: 19.467vw;
    background: #ffffff;
    padding: 1vw;
    box-sizing: border-box;
}

.p-qr .qr * {
    width: 100%;
    height: 100%;
}

.p-qr .tips,
.p-preview .tips {
    top: 60%;
    left: 0;
    margin-top: 41%;
    width: 100%;
    color: #ffffff;
    line-height: 1;
    font-size: 3.75vw;
    font-weight: 500;
    text-align: center;
    font-weight: bold;
}

.p-qr .tips div,
.p-preview .tips div {
    font-size: 2.667vw;
    font-weight: normal;
}

.p-qr .tctext {
    top: 50%;
    margin-top: 38%;
    left: 15.335%;
    width: 69.33%;
}

.p-qr .tc {
    top: 50%;
    margin-top: 38%;
    left: 15.333%;
    width: 69.333%;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.3;
    font-size: 1.692vw;
    font-weight: lighter;
    text-align: center;
}

.p-qr .tc div {
    margin-top: 0.8vw;
    text-align: left;
}

.p-qr .name1 {
    top: 50%;
    margin-top: 4.7%;
    left: 43.6%;
    width: 50%;
    color: #ffffff;
    line-height: 1;
    font-size: 3.466vw;
    font-weight: normal;
    text-align: left;
    display: flex;
    align-items: center;
    display: none;
}

.p-qr .name1 .text {
    top: -0.2vw;
    /* margin-left: 1.6vw; */
    width: 20vw;
}

.p-qr .name2 {
    top: 50%;
    margin-top: 18.9vw;
    left: 49.4%;
    width: 50%;
    color: #ffffff;
    line-height: 1;
    font-size: 2.761vw;
    font-weight: normal;
    text-align: left;
    display: none;
}

.p-qr.gso .poster2 {
    display: none;
}

.p-qr .poster2,
.p-qr.gso .name2,
.p-qr.gso .poster1 {
    display: initial;
}

.p-qr.gso .name1 {
    display: flex;
}

.p-qr.gso .tc {
    margin-top: 39%;
}

.cardimage,
.posterimage {
    filter: alpha(opacity: 0);
    opacity: 0;
    z-index: 9;
}

.p-quiz .popup1 {
    top: 50%;
    margin-top: -56%;
    left: 6%;
    width: 88%;
}

.p-quiz .title {
    top: 50%;
    margin-top: -45.8%;
    left: 15.6%;
    width: 88%;
    line-height: 1.2;
    text-align: left;
    font-size: 8.933vw;
    font-weight: bold;
}

.p-quiz .subtitle {
    top: 50%;
    margin-top: -23%;
    left: 15.6%;
    width: 88%;
    line-height: 1.2;
    text-align: left;
    font-size: 4.573vw;
    font-weight: normal;
    font-family: "GraphikWide";
    color: #4d4d4d;
}

.p-quiz .insttext {
    top: 50%;
    margin-top: -6.8%;
    left: 10.8%;
    width: 78.4%;
}

.p-quiz .inst {
    top: 50%;
    margin-top: -6.8%;
    left: 0%;
    width: 100%;
    line-height: 1.2;
    text-align: center;
    font-size: 3.433vw;
    font-weight: lighter;
    color: rgba(255, 255, 255, 0.9);
}

.p-quiz .inst.en {
    font-size: 2.8vw;
    margin-top: 8.8%;
}

.p-quiz .btn-start {
    margin-top: 48%;
}

.p-quiz .tc {
    top: 50%;
    margin-top: 30.4%;
    left: 34%;
    width: 3.467vw;
    height: 3.467vw;
    background: url(../img/uncheck.png) center center/100% 100% no-repeat;
}

.p-quiz .tc:checked {
    background-image: url(../img/check.png);
}

.p-quiz .tclabel,
.p-quiz .tctext {
    top: 50%;
    margin-top: 29.4%;
    left: 0%;
    width: 100%;
    line-height: 1.5;
    text-align: center;
    font-size: 3.711vw;
    font-weight: lighter;
    color: rgba(255, 255, 255, 0.9);
    text-indent: 5.5vw;
}

.p-quiz .tclabel span {
    text-decoration: underline;
    text-underline-offset: 2vw;
}

.p-quiz .tctext {
    margin-top: 35%;
    text-indent: 0;
}

.p-quiz .line {
    top: 50%;
    margin-top: 40.8%;
    left: 24.6665%;
    width: 50.667%;
    height: 1px;
    line-height: 0;
    font-size: 0;
    background: rgba(255, 255, 255, 0.9);
}

.p-quiz .rulebg {
    top: 15%;
    left: 6%;
    width: 88%;
    height: 70%;
    border-radius: 6vw;
    background: #ffffff;
}

.p-quiz .rulebg .rule {
    top: 12vw;
    bottom: 7vw;
    left: 8%;
    width: 87%;
    line-height: 1.5;
    text-align: left;
    font-size: 3.2vw;
    font-weight: normal;
    color: #333;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-right: 2%;
    box-sizing: border-box;
}
.p-quiz .rulebg .rule::-webkit-scrollbar {
    width: 2px;
}
.p-quiz .rulebg .rule::-webkit-scrollbar-thumb {
    background: #1f4456;
    border-radius: 10px;
}
.p-quiz .rulebg .rule::-webkit-scrollbar-track {
    background: rgba(128, 130, 133, 0.43);
    border-radius: 10px;
}

.p-quiz .rulebg .rule p {
    margin-top: 2vw;
}

.p-quiz .rulebg .rule a {
    color: #1f4456;
    text-decoration: underline;
    text-underline-offset: 20%;
}

.p-quiz .rulebg .close {
    top: 2vw;
    right: 2vw;
    width: 4vw;
    height: 4vw;
    padding: 2vw;
}

.p-qa .popup2 {
    top: 50%;
    margin-top: -58%;
    left: 6%;
    width: 88%;
}

.p-qa .title {
    top: 50%;
    margin-top: -51%;
    left: 15.6%;
    width: 88%;
    line-height: 1.2;
    text-align: left;
    font-size: 4.239vw;
    font-weight: bold;
}

.p-qa .subtitle {
    top: 50%;
    margin-top: -46%;
    left: 15.6%;
    width: 88%;
    line-height: 1.2;
    text-align: left;
    font-size: 2.96vw;
    font-weight: normal;
    font-family: "GraphikWide";
    color: #4d4d4d;
}

.p-qa .qnum {
    top: 50%;
    margin-top: -41%;
    left: 15.6%;
    width: 88%;
    line-height: 1.2;
    text-align: left;
    font-size: 7.277vw;
    font-weight: bold;
    font-family: "GraphikWide";
    color: #000000;
}

.p-qa .qtitle {
    top: 50%;
    margin-top: -31.8%;
    left: 15.6%;
    width: 88%;
    line-height: 1.3;
    text-align: left;
    font-size: 3.676vw;
    font-weight: normal;
}

.p-qa .qtitle.en {
    margin-top: -21.8%;
    font-size: 2.696vw;
    line-height: 1.05;
}

.p-qa .answer {
    top: 50%;
    margin-top: -12%;
    left: 15.6%;
    width: 77.33%;
    height: 52vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

.p-qa .answer .item {
    width: 100%;
    height: auto;
    line-height: 1.2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.p-qa .answer .item .option {
    width: 5.2vw;
    height: 5.2vw;
    background: transparent;
    border: 0.666vw solid #a6a6a6;
    border-radius: 5.2vw;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000000;
    font-weight: bold;
    font-size: 3.2vw;
    box-sizing: border-box;
}

.p-qa .answer .item .text {
    margin-top: 0.5vw;
    width: 70.5vw;
    font-size: 2.833vw;
    line-height: 1.3;
    letter-spacing: -0.16vw;
}

.p-qa .answer .item .text .text-en {
    margin-top: 1vw;
    font-size: 2.33vw;
    line-height: 1.05;
    letter-spacing: -0.04vw;
}

.p-qa .answer .item.act .option {
    background: #e6542a;
    border-color: #e6542a;
}

.p-qa .btn-next {
    margin-top: 44%;
}

.p-result .back,
.p-qa .back,
.p-card .back {
    left: 5.935%;
}

.p-event-video2 .slogan1,
.p-event-video1 .slogan1,
.p-event-photo4 .slogan1,
.p-event-photo3 .slogan1,
.p-event-photo2 .slogan1,
.p-event-photo1 .slogan1,
.p-event-menu .slogan1,
.p-result .slogan1,
.p-qa .slogan1,
.p-card .slogan1,
.p-preview .slogan1 {
    left: initial;
    right: 5.935%;
    top: 10%;
    margin-top: -5%;
}

.small .p-event-video2 .slogan1,
.small .p-event-video1 .slogan1,
.small .p-event-photo4 .slogan1,
.small .p-event-photo3 .slogan1,
.small .p-event-photo2 .slogan1,
.small .p-event-photo1 .slogan1,
.small .p-event-menu .slogan1,
.small .p-result .slogan1,
.small .p-qa .slogan1,
.small .p-card .slogan1,
.small .p-preview .slogan1 {
    top: 20%;
    margin-top: -25%;
}

.p-card .popup3,
.p-preview .popup4 {
    top: 50%;
    margin-top: -63%;
    left: 5.935%;
    width: 88.13%;
}

.p-card .header {
    top: 50%;
    margin-top: -34%;
    left: 18.835%;
    width: 65vw;
    color: #000;
    line-height: 1.1;
    font-size: 2.933vw;
    text-align: left;
    font-weight: bold;
}

.p-card .text {
    top: 50%;
    margin-top: -28%;
    left: 18.835%;
    width: 65vw;
    height: 47vw;
    font-size: 2.8vw;
    text-align: left;
    font-weight: normal;
    line-height: 1.45;
}

.p-card .text::-webkit-scrollbar {
    display: none;
    width: 0;
}
.p-card .text::-webkit-scrollbar-thumb {
    display: none;
    background: transparent;
    border-radius: 10px;
}
.p-card .text::-webkit-scrollbar-track {
    display: none;
    background: transparent;
    border-radius: 10px;
}

.p-card .name,
.p-card .hotel {
    top: 50%;
    margin-top: 26.5%;
    left: 18.835%;
    width: 65vw;
    height: 9.333vw;
    font-size: 4.5vw;
    text-align: left;
    font-weight: 500;
    line-height: 1.45;
    color: #000;
    font-weight: bold;
}

.p-card .hotel {
    margin-top: 38.45%;
}

.p-card .title,
.p-preview .title {
    top: 50%;
    margin-top: -55%;
    left: 0;
    width: 100%;
    color: #000;
    line-height: 1.2;
    font-size: 5.51vw;
    font-weight: bold;
    text-align: center;
    font-family: "SourceHanSans";
}

.p-card .subtitle,
.p-preview .subtitle {
    font-size: 3.02vw;
    font-weight: normal;
    font-family: "GraphikWide";
}

.p-preview .tips {
    top: 50%;
    left: 0;
    margin-top: 40.8%;
    width: 100%;
    color: #333333;
}

.p-preview .textimage {
    top: 50%;
    margin-top: -30.5%;
    left: 24.4135vw;
    width: 51.172vw;
}

.p-preview .text {
    top: 50%;
    margin-top: -31%;
    left: 25%;
    width: 50%;
    height: 49vw;
    overflow: hidden;
    color: #1f4456;
    line-height: 1.5;
    font-size: 2.667vw;
    font-weight: normal;
    text-align: left;
    white-space: pre-line;
}

.p-preview .text div {
    text-align: right;
    line-height: 1.4;
}

.p-preview .text .hotel {
    font-size: 2vw;
}

.p-preview .btn-back {
    z-index: 9;
}

.p-result .logo {
    left: 5.935%;
    top: 10%;
    margin-top: -5%;
}

.small .p-result .logo {
    top: 20%;
    margin-top: -25%;
}

.p-result .result {
    top: 50%;
    margin-top: -64%;
    left: 6%;
    width: 88%;
}

.p-result .tips {
    top: 65%;
    margin-top: 50%;
    left: 0;
    width: 100%;
    color: #ffffff;
    line-height: 1.2;
    font-size: 1.973vw;
    font-weight: bold;
    text-align: center;
}

.p-result .tips.en {
    margin-top: 55%;
    font-size: 1.6vw;
}

.p-result .circle {
    top: 50%;
    margin-top: 53%;
    left: 39.4665vw;
    width: 21.066vw;
    height: 21.066vw;
    background: #ffffff;
    border-radius: 20vw;
}

.p-result .qr {
    top: 50%;
    margin-top: 56.933%;
    left: 43.4vw;
    width: 13.2vw;
    height: 13.2vw;
}

.p-result .btn-recommend {
    top: 50%;
    margin-top: -15.3%;
    left: 26%;
    width: 48%;
    height: 9vw;
    cursor: pointer;
}

.p-result .btn-new {
    top: 50%;
    margin-top: 1.8%;
    left: 29%;
    width: 42%;
    height: 4vw;
    cursor: pointer;
}

.p-result .btn-store {
    top: 50%;
    margin-top: 9.3%;
    left: 29%;
    width: 42%;
    height: 4vw;
    cursor: pointer;
}

.p-result.result2 .btn-recommend {
    margin-top: 1.8%;
    left: 29%;
    width: 22%;
    height: 4vw;
}

.p-result.result2 .btn-new {
    margin-top: -15.3%;
    left: 16%;
    width: 68%;
    height: 9vw;
}

.p-result.result2 .btn-store {
    margin-top: 9.3%;
    left: 29%;
    width: 42%;
    height: 4vw;
}

.p-result.result3 .btn-recommend {
    margin-top: -15%;
    left: 18%;
    width: 38%;
    height: 8vw;
}

.p-result.result3 .btn-new {
    margin-top: -4.7%;
    left: 18%;
    width: 63%;
    height: 8vw;
}

.p-result.result3 .btn-store {
    margin-top: 5.6%;
    left: 18%;
    width: 63%;
    height: 8vw;
}

.p-result.result4 .btn-recommend {
    margin-top: 1.8%;
    left: 29%;
    width: 22%;
    height: 4vw;
}

.p-result.result4 .btn-new {
    margin-top: 9.3%;
    left: 29%;
    width: 42%;
    height: 4vw;
}

.p-result.result4 .btn-store {
    margin-top: -15.3%;
    left: 16%;
    width: 68%;
    height: 9vw;
}

.p-result .btn-share {
    top: 50%;
    margin-top: 16%;
    left: 15%;
    width: 70%;
    height: 9vw;
    cursor: pointer;
}

.p-result .btn-again {
    top: 50%;
    margin-top: 27.5%;
    left: 33%;
    width: 34%;
    height: 4vw;
    cursor: pointer;
}

.p-result .share {
    top: 5vw;
    right: 8%;
    width: 41.733%;
}

.p-result .gsocontent {
    display: none;
}

.p-result .resultbox {
    margin-top: 6%;
}

.p-result.gso .gsocontent {
    display: block;
}

.p-result.gso .resultbox {
    margin-top: 0;
}

.p-write .action {
    outline: 0 none;
    text-decoration: underline;
    text-underline-offset: 20%;
    overflow: hidden;
}

.p-prob {
    --swiper-pagination-bullet-horizontal-gap: -10px;
    --swiper-pagination-bullet-border-radius: 5px;
}

.contentbox .title,
.p-prob .probtitle,
.p-prob-result .probtitle {
    top: 20%;
    left: 24.07%;
    margin-top: -22%;
    width: 51.86%;
    left: 0;
    width: 100%;
    color: #333;
    line-height: 1.2;
    font-size: 5.51vw;
    font-weight: bold;
    text-align: center;
}

.contentbox .title .subtitle,
.p-prob .probtitle .subtitle,
.p-prob-result .probtitle .subtitle {
    font-size: 3.02vw;
    font-weight: 500;
}

.btmbg1,
.p-prob .btmbg1,
.p-prob-result .btmbg1 {
    top: 75%;
    left: 23.87%;
    margin-top: 20%;
    width: 52.26%;
}

.p-prob .btn-back,
.p-prob-result .btn-back {
    top: 70%;
    left: 23.87%;
    margin-top: 13%;
    width: 52.26%;
}

.p-prob .probbox {
    top: 50%;
    left: 7.45vw;
    margin-top: -34vw;
    width: 67.56vw;
    height: 67.56vw;
}

.p-prob .probbox .swiper-wrapper {
    height: 67.56vw;
}

.p-prob .swiper-pagination {
    top: 50%;
    bottom: initial;
    margin-top: 44%;
    height: 12px;
    line-height: 12px;
}

.p-prob .swiper-pagination-bullet {
    position: relative;
    width: 30px;
    height: 5px;
    opacity: 1;
    background: #ccc;
}

.p-prob .swiper-pagination-bullet-active {
    background: #666;
    z-index: 10;
}

.p-prob .probbox .swiper-slide {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
}

.p-prob .probbox .probitem {
    width: 19.733vw;
    height: 19.733vw;
    /* margin-right: 1.2vw; */
    margin-top: 4.12vw;
}

.p-prob .probbox .probitem:nth-child(1),
.p-prob .probbox .probitem:nth-child(2),
.p-prob .probbox .probitem:nth-child(3) {
    margin-top: 0;
}

.p-prob .probbox .probitem:nth-child(3n) {
    margin-right: 0;
}

.p-prob .probbox .probitem .itembg {
    width: 100%;
    height: 100%;
    padding: 0;
    box-sizing: border-box;
    background: #fff;
    border-radius: 4vw;
}

.p-prob .probbox .probitem .itembox {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    box-sizing: border-box;
    border-radius: 4vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.p-prob .probbox .probitem .itembox::before {
    content: " ";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url(../img/prob-act1.png) no-repeat right bottom/100% 100%;
    opacity: 0;
}

.p-prob .probbox .probitem.act .itembox::before,
.p-prob .probbox .probitem .itembox:hover::before {
    transition: all linear 0.05s;
    opacity: 1;
}

.p-prob .probbox .probitem .probimage {
    position: relative;
    max-width: 16.38vw;
    max-height: 16.38vw;
}

.p-prob .probbox .probitem.active .itembg {
    background: #333;
}

.p-prob-result .probbox {
    top: 50%;
    left: 7.33vw;
    margin-top: -34vw;
    width: 68vw;
    height: 68vw;
    background: #fff;
    /* border: 0.267vw solid #103346; */
    box-sizing: border-box;
    border-radius: 5.33vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.p-prob-result .probbox .probimage {
    max-width: 56.44vw;
    max-height: 56.44vw;
    user-select: initial;
}

.probtips {
    top: 50%;
    left: 0;
    margin-top: 47%;
    width: 100%;
    line-height: 1.1;
    text-align: center;
    color: #333;
    font-size: 4vw;
    font-weight: bold;
    border-radius: 9.067vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.probtips span {
    font-size: 2.643vw;
}

.p-event .eventbox {
    top: 50%;
    left: 6.13vw;
    margin-top: -50%;
    width: 70.4vw;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.p-event .eventbox .btn-day {
    width: 100%;
    height: 17.2vw;
    margin-bottom: 3%;
    background: transparent center center no-repeat;
    background-size: 100% 100%;
}

/* .p-event .eventbox .btn-day::before {
    content: " ";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url(../img/event-act.png) no-repeat right bottom/100% 100%;
    opacity: 0;
}

.p-event .eventbox .btn-day:hover::before {
    transition: all linear 0.05s;
    opacity: 1;
} */

.p-event-menu .popupbox {
    background: rgba(0, 0, 0, 0.75);
    z-index: 10;
}

.hotelpopup {
    top: 50%;
    left: 13.735%;
    margin-top: -42%;
    width: 72.53%;
    background: #fff;
    /* border: 0.267vw solid #103346; */
    box-sizing: border-box;
    border-radius: 2.67vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5vw 0 6vw;
}

.hotelpopup .popuptitle {
    margin-bottom: 5vw;
    width: 100%;
    text-align: center;
    color: #333;
    line-height: 1;
    font-size: 6.53vw;
    font-weight: bold;
}

.hotelpopup .hotels {
    width: 100%;
}

.hotelpopup .hotel {
    margin-top: 0.5vw;
    width: 100%;
    text-align: center;
    color: #333;
    line-height: 2.4;
    font-size: 3.2vw;
    font-weight: bold;
}

.hotelpopup .hotel.active {
    background: #333;
    color: #fff;
}

.hotelpopup .btn-ok {
    margin-top: 6vw;
    width: 34.4vw;
    height: 7.2vw;
    line-height: 7.2vw;
    background: #333;
    border-radius: 6.4vw;
    color: #fff;
    font-size: 4.27vw;
    font-weight: bold;
    text-align: center;
}

.p-event-menu .shadow2 {
    background-position-y: 33%;
}

.p-event-menu .btn-photo {
    top: 50%;
    left: 9.135vw;
    margin-top: -47%;
    width: 69.73vw;
    height: 28.666vw;
    background: transparent center center no-repeat;
    background-size: 100% 100%;
}

.p-event-menu .btn-video {
    top: 50%;
    left: 9.135vw;
    margin-top: -12.5%;
    width: 69.73vw;
    height: 28.666vw;
    background: transparent center center no-repeat;
    background-size: 100% 100%;
}

.p-event-menu .btn-photo::before,
.p-event-menu .btn-video::before {
    content: " ";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url(../img/event-act1.png) no-repeat left bottom/100% 100%;
    opacity: 0;
}

.p-event-menu .btn-photo.act::before,
.p-event-menu .btn-video.act::before
/* .p-event-menu .btn-photo:hover::before,
.p-event-menu .btn-video:hover::before  */ {
    transition: all linear 0.05s;
    opacity: 1;
}

.p-event-menu .eventtitle {
    top: 10%;
    left: 6%;
    color: #333;
    line-height: 1.05;
    font-size: 4.8vw;
    font-weight: bold;
    text-align: left;
}

.p-event-menu .eventtitle div {
    font-size: 3.02vw;
}

.p-event-menu .eventtips {
    top: 47%;
    left: 6%;
    color: #333333;
    line-height: 1.05;
    font-size: 2.22vw;
    font-weight: normal;
    text-align: left;
}

.p-event-menu .eventnotice {
    top: 50%;
    margin-top: 25%;
    left: 9.2vw;
    width: 69.6vw;
    color: #333333;
    line-height: 1.3;
    font-size: 2.46vw;
    font-weight: normal;
    text-align: justify;
}

.p-event-menu .text3 {
    top: 50%;
    margin-top: 22.5%;
    left: 10.495%;
    width: 79.01%;
}

.p-event-video2 .btn-create,
.p-event-video1 .btn-preview,
.p-event-photo3 .btn-create,
.p-event-photo2 .btn-next,
.p-event-photo1 .btn-upload1,
.p-event-menu .btn-next {
    margin-top: 52%;
}

.p-event-photo1 .photo1 {
    top: 50%;
    left: 49.53vw;
    margin-top: -43%;
    width: 36vw;
}

.p-event-photo1 .photo2 {
    top: 50%;
    left: 3%;
    margin-top: -25%;
    width: 46.667vw;
}

.p-event-photo1 .photo-opt {
    top: 50%;
    left: 73%;
    margin-top: 12%;
    width: 4.267vw;
    height: 4.267vw;
    background: transparent center center no-repeat;
    background-size: contain;
    background-image: url(../img/opt1.png);
}

.p-event-photo1 .photo-opt.p2 {
    left: 30%;
}

.p-event-photo1 .photo-opt.act {
    background-image: url(../img/opt2.png);
}

.p-event-photo1 .phototips {
    bottom: 50%;
    left: 0;
    margin-bottom: -53%;
    width: 100%;
    text-align: center;
    color: #333333;
    line-height: 1.3;
    font-size: 2.488vw;
    font-weight: normal;
    text-align: center;
}

/* .p-event-video2 .btn-create,
.p-event-video1 .btn-preview,
.p-event-photo3 .btn-create,
.p-event-photo2 .btn-next,
.p-event-photo1 .btn-upload1 {
    top: 50%;
    left: 6.465vw;
    margin-top: 51%;
    width: 69.73vw;
    height: 9.067vw;
    line-height: 9.067vw;
    text-align: center;
    background: #fff;
    color: #333;
    font-size: 4.8vw;
    font-weight: bold;
    border-radius: 9.067vw;
} */

.btn-back1 {
    top: 70%;
    right: 14.13%;
    margin-top: 13%;
    width: 33.2%;
}

.btmbg2 {
    top: 75%;
    left: 22.87%;
    margin-top: 15%;
    width: 54.26%;
}

.p-event-photo2 .shadow2 {
    background-position: center 34%;
}

.p-event-photo2 .photobox {
    top: 50%;
    left: 7.45vw;
    margin-top: -42vw;
    width: 67.56vw;
    height: 67.56vw;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
}

.p-event-photo2 .photobox .btn-plus {
    width: 19.733vw;
    height: 19.733vw;
    background: transparent center center/contain no-repeat;
}

.p-event-photo2 .photobox .plusbox {
    overflow: hidden;
}
.p-event-photo2 .photobox .f-photo {
    font-size: 80px;
    overflow: hidden;
    filter: alpha(opacity: 0);
    opacity: 0;
    z-index: 9999;
}
input[type="file"]::-webkit-file-upload-button {
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
}
input[type="file"]::-o-file-upload-button {
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
}
input[type="file"]::-ms-file-upload-button {
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
}
input[type="file"]::-moz-file-upload-button {
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
}
.p-event-photo2 .tips,
.p-event-photo3 .tips {
    bottom: 50%;
    left: 0;
    margin-bottom: -52%;
    width: 100%;
    text-align: center;
    color: #333333;
    line-height: 1.25;
    font-size: 2.4vw;
    font-weight: normal;
    text-align: center;
}

.btmbg3 {
    top: 80%;
    left: 16.935%;
    margin-top: 18%;
    width: 66.13%;
}

.p-event-photo3 .editbox {
    top: 50%;
    margin-top: -52%;
    left: 21.8085vw;
    width: 44.383vw;
    height: 59vw;
}

.p-event-photo3 .editbox .canvas {
    top: 5%;
    left: 5%;
    width: 90%;
    height: 90%;
}

.p-event-photo3 .editbox .text {
    top: 84.8954%;
    left: 15.4667%;
    height: 6.2742%;
}

.p-event-photo3.p2 .editbox .text {
    top: 85.48%;
    left: 11.11%;
    height: 10.231%;
}

.p-event-photo3 .editbox .hotel {
    top: 71.9%;
    left: 18.6%;
    text-align: left;
    color: #ffffff;
    line-height: 1;
    /* font-weight: bold; */
    /* -webkit-text-size-adjust: none; */
    font-size: 5.95vw;
    transform: scale(0.2);
    transform-origin: left top;
    white-space: nowrap;
    top: 75.6%;
    font-size: 6vw;
}

.p-event-photo3 .editbox .hotel_en {
    top: 77.9%;
    left: 18.6%;
    text-align: left;
    color: #ffffff;
    line-height: 1;
    /* font-weight: bold; */
    /* -webkit-text-size-adjust: none; */
    font-size: 3.92vw;
    transform: scale(0.2);
    transform-origin: left top;
    white-space: nowrap;
    font-size: 3.8vw;
    font-family: "GraphikWide", "SourceHanSans";
}

.p-event-photo3 .editbox .city {
    top: 80.5%;
    left: 18.6%;
    text-align: left;
    color: #ffffff;
    line-height: 1;
    /* font-weight: bold; */
    /* -webkit-text-size-adjust: none; */
    font-size: 6.25vw;
    transform: scale(0.2);
    transform-origin: left top;
    white-space: nowrap;
    font-size: 6vw;
}

.p-event-photo3 .editbox .city_en {
    margin-left: 3.2vw;
    font-size: 3.8vw;
    font-family: "GraphikWide", "SourceHanSans";
}

.p-event-photo3.ihg .editbox .hotel {
    top: 78.8%;
    left: 18.6%;
}
.p-event-photo3.ihg .editbox .hotel_en {
    top: 81.4%;
    left: 18.6%;
}
.p-event-photo3.ihg .editbox .city_en {
    margin-left: 0;
}

/* .p-event-photo3.hk .editbox .hotel_en {
    top: 74.9%;
    font-size: 5.95vw;
    top: 75%;
    font-size: 5.4vw;
}
.p-event-photo3.hk .editbox .city {
    top: 77.3%;
    font-size: 5.95vw;
    font-size: 5.4vw;
} */

.p-event-photo3.p2 .editbox .hotel {
    top: 71.4%;
    left: 10.5%;
    font-size: 5.74vw;
    top: 71.1%;
    font-size: 6.4vw;
}

.p-event-photo3.p2 .editbox .hotel_en {
    top: 73.8%;
    left: 10.5%;
    font-size: 3.79vw;
    top: 73.8%;
    font-size: 4.02vw;
}

.p-event-photo3.p2 .editbox .city {
    top: 76.9%;
    left: 10.5%;
    font-size: 6vw;
}

.p-event-photo3.p2 .editbox .city_en {
    margin-left: 4.2vw;
    font-size: 4vw;
}

.p-event-photo3.p2.ihg .editbox .hotel {
    top: 73.8%;
    font-size: 6.4vw;
}
.p-event-photo3.p2.ihg .editbox .hotel_en {
    top: 76.9%;
}
.p-event-photo3.p2.ihg .editbox .city_en {
    margin-left: 0;
}
/* .p-event-photo3.p2.hk .editbox .hotel_en {
    top: 74.5%;
    font-size: 5.74vw;
}
.p-event-photo3.p2.hk .editbox .city {
    top: 77%;
    font-size: 5.74vw;
} */

.p-event-photo3 .editbox .frame {
    background: transparent center center/100% 100% no-repeat;
}

.p-event-photo3 .thumblist {
    top: 50%;
    left: 11.33vw;
    margin-top: 17.8%;
    width: 60vw;
    height: 13.6vw;
}

.p-event-photo3 .swiper-slide {
    width: auto;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

.p-event-photo3 .swiper-slide img {
    width: 9.04vw;
    height: 13.6vw;
    margin: 0 1.9vw;
    object-fit: cover;
}

.p-event-photo3.p2 .editbox {
    top: 50%;
    margin-top: -52%;
    left: 12.533vw;
    width: 62.933vw;
    height: 55.008vw;
}

.p-event-photo3 .frame2,
.p-event-photo3 .frame1 {
    /* height: 101%; */
}

.p-event-photo3 .frame2,
.p-event-photo3.p2 .frame1 {
    display: none;
}

.p-event-photo3.p2 .frame2 {
    display: block;
}

.p-event-photo3.p2 .thumblist {
    top: 50%;
    margin-top: 13%;
    left: 12.533vw;
    width: 62.933vw;
    height: 18.4vw;
}

.p-event-photo3.p2 .swiper-slide img {
    width: 27.57vw;
    height: 18.4vw;
    margin: 0 1.6vw;
}

.p-event-photo3 .swiper-slide img:first-child {
    margin-left: 0;
}

.p-event-photo3 .swiper-slide img:last-child {
    margin-right: 0;
}

.p-event-photo3 .swiper-scrollbar {
    top: 50%;
    left: 31.33vw;
    bottom: initial;
    margin-top: 37%;
    width: 20vw;
    height: 5px;
    line-height: 5px;
    background: #ccc;
}

.p-event-photo3 .swiper-scrollbar .swiper-scrollbar-drag {
    background: #666;
}

.p-event-photo4 .thumblist {
    top: 40%;
    left: 15.715vw;
    margin-top: -34%;
    width: 56.57vw;
    height: 75.2vw;
}

.p-event-photo4 .thumblist .swiper-slide {
    /* border-radius: 5vw;
    overflow: hidden; */
}

.p-event-photo4 .thumblist .photo {
    width: 100%;
    user-select: initial;
    border-radius: 5vw;
    overflow: hidden;
}

.p-event-photo4 .tips {
    top: 65%;
    left: 0;
    margin-top: 19%;
    width: 100%;
    text-align: center;
    color: #333;
    line-height: 1.3;
    font-size: 3.15vw;
    font-weight: bold;
    text-align: center;
}

.p-event-photo4 .btn-back {
    margin-top: 17%;
}

.p-event-photo4 .left,
.p-event-photo4 .right {
    top: 50%;
    left: 4%;
    margin-top: -10%;
    width: 5.46%;
    padding: 0 2vw;
}

.p-event-photo4 .right {
    left: initial;
    right: 4%;
}

.p-event-photo4.p2 .thumblist {
    top: 50%;
    margin-top: -38%;
    left: 12.533vw;
    width: 62.933vw;
    height: 55.008vw;
}

.p-event-photo4.p2 .left {
    left: 1%;
}

.p-event-photo4.p2 .right {
    right: 1%;
}

.p-event-photo4.p2 .right {
    right: 1%;
}

.p-event-photo4.p2 .probtips {
    margin-top: 40%;
}

.p-event-video1 .shadow4 {
    top: 21vw;
    background-size: 100% 100%;
    height: 42vw;
}

.p-event-video1 .shadow4:nth-child(2) {
    top: 58vw;
}

.p-event-video1 .btn-video1,
.p-event-video1 .btn-video2 {
    top: 50%;
    left: 9.133vw;
    margin-top: -44%;
    width: 69.734vw;
    height: 30.067vw;
    background: transparent center center/contain no-repeat;
}
.p-event-video1 .btn-video2 {
    margin-top: -2%;
}
.p-event-video1 .f-video {
    font-size: 120px;
    overflow: hidden;
    filter: alpha(opacity: 0);
    opacity: 0;
    z-index: 9999;
}

.p-event-video1 .videotitle {
    top: 10%;
    left: 10%;
    color: #333;
    line-height: 1.05;
    font-size: 4.8vw;
    font-weight: bold;
    text-align: left;
}

.p-event-video1 .videotitle div {
    font-size: 3.02vw;
}

.p-event-video1 .videotips {
    top: 46%;
    left: 10%;
    color: #333333;
    line-height: 1.2;
    font-size: 2.4vw;
    font-weight: normal;
    text-align: left;
}

.p-event-video1 .tips {
    top: 40%;
    left: 0;
    margin-top: 13.5%;
    width: 100%;
    text-align: center;
    color: #333;
    line-height: 1.3;
    font-size: 3.15vw;
    font-weight: bold;
    text-align: center;
}

.p-event-video2 .video,
.p-event-video1.hasvideo .btn-video1,
.p-event-video1.hasvideo .btn-video2 {
    top: 50%;
    left: 6.2vw;
    margin-top: -29%;
    width: 75.6vw;
    height: 42.5376vw;
    background: transparent url(../img/kv.jpg) center center/contain no-repeat !important;
    border-radius: 4vw;
    overflow: hidden;
}

.p-event-video1.hasvideo .videotitle,
.p-event-video1.hasvideo .videotips {
    display: none;
}

.p-event-video1.hasvideo .tips {
    margin-top: 30.5%;
}

.p-event-video2 .mask .popupbox {
    top: 50%;
    left: 10%;
    width: 80%;
    background: #333;
    transform: translateY(-50%);
    border-radius: 6.4vw;
    color: #fff;
    font-size: 3.2vw;
    padding: 9.6vw 0 6.4vw;
}

.p-event-video2 .mask .popupbox .boxborder {
    top: 1vw;
    left: 1vw;
    right: 1vw;
    bottom: 1vw;
    border: 1px solid #999;
    border-radius: 5.4vw;
}

.p-event-video2 .mask .popupbox .linktitle {
    text-align: center;
    font-size: 4.8vw;
    font-weight: 500;
    line-height: 1.1;
}

.p-event-video2 .mask .popupbox .linktitle div {
    font-size: 3.02vw;
    font-weight: normal;
}

.p-event-video2 .mask .popupbox .link {
    background: #fff;
    width: 90%;
    margin: 5% 0 0 5%;
    padding: 6.4vw 1.6vw;
    border-radius: 4.8vw;
    box-sizing: border-box;
    color: #333;
    word-break: break-all;
}

.p-event-video2 .mask .popupbox .linktips {
    font-size: 2.4vw;
    margin: 2% 0 0 10%;
    width: 80%;
}

.p-event-video2 .mask .popupbox .btns {
    margin: 5% 0 0 0;
    padding: 0 10%;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

.p-event-video2 .mask .popupbox .btn-cancel {
    width: 40%;
    height: 8.8vw;
    line-height: 1.05;
    border: 1px solid #fff;
    border-radius: 8.8vw;
    font-size: 3.6vw;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.p-event-video2 .mask .popupbox .btn-copy {
    width: 50%;
    height: 8.8vw;
    line-height: 1.05;
    border: 1px solid #fff;
    border-radius: 8.8vw;
    background: #fff;
    font-size: 3.78vw;
    color: #333;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.p-event-video2 .mask .popupbox .btn-cancel div,
.p-event-video2 .mask .popupbox .btn-copy div {
    font-size: 2.64vw;
}

.btmbg4 {
    top: 70%;
    left: 19.535%;
    margin-top: 32%;
    width: 60.93%;
}

.p-list .shadow4 {
    /* top: 20vw; */
    /* left: -7.235vw; */
    /* width: 100vw; */
    background-size: 100% 100%;
}

.p-list .slogan1 {
    margin-top: 54%;
}

.p-list.group .slogan1 {
    margin-top: 45%;
}

.p-list .tips {
    top: 50%;
    margin-top: 84%;
    left: 12%;
    width: 88%;
    color: #fff;
    font-size: 2.4vw;
    font-weight: normal;
    line-height: 1.4;
    text-align: left;
}

.p-list .listcontentbox {
    top: 50%;
    left: 7.235%;
    margin-top: -61%;
    width: 85.53%;
    border-radius: 4vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.p-list .menubox {
    top: 50%;
    margin-top: -84%;
    left: 4.93vw;
    width: 90.13vw;
    padding-bottom: 3.5vw;
    background: transparent;
    border-radius: 3.2vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.p-list .menubox .title {
    margin-top: 3.735vw;
    width: 100%;
    color: #333;
    line-height: 1.2;
    font-size: 5.51vw;
    font-weight: bold;
    text-align: center;
}

.p-list .menubox .title .subtitle {
    font-size: 3.02vw;
    font-weight: 500;
}

.p-list .menulist {
    width: 90.13vw;
    height: 13.333vw;
    color: #fff;
    background: #333;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    border-radius: 4.267vw;
}

.p-list .menulist .menu {
    padding: 0;
    margin: 0;
    width: 30.0433vw;
    height: 13.333vw;
    line-height: 1.4;
    text-align: center;
    font-size: 3.733vw;
    font-weight: normal;
    border-radius: 3.2vw;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}

.p-list .menulist .menu.active {
    font-weight: bold;
    background: #e8542a;
}

.p-list .menulist.groupmenu .menu {
    width: 17.51vw;
}

.p-list .info {
    padding: 2.4vw 0 1.866vw;
    width: 94%;
    color: #ffffff;
    font-size: 2.35vw;
    font-weight: normal;
    line-height: 1.4;
    text-align: left;
    /* min-height: 11.635vw; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 0.133vw solid rgba(255, 255, 255, 0.4);
}

.p-list .regionlist {
    margin-top: 3.733vw;
    width: 84%;
    display: flex;
    align-items: flex-start;
    color: #ffffff;
    font-size: 3.2vw;
    font-weight: normal;
    line-height: 1;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.p-list .regionlist .region {
    text-align: left;
    height: 6.133vw;
    line-height: 6.133vw;
}

.p-list .regionlist .region:nth-child(1) {
    width: 32%;
}

.p-list .regionlist .region:nth-child(3) {
    width: 32%;
}

.p-list .regionlist .region.active {
    font-weight: bold;
    color: #e8542a;
}

.p-list .regionlist .region .regionname {
    display: inline-block;
    height: 100%;
}

.p-list .regionlist .region.active .regionname::after {
    position: absolute;
    bottom: 0.2vw;
    left: 50%;
    width: 6.4vw;
    height: 0.266vw;
    transform: translateX(-50%);
    content: " ";
    background: #e8542a;
}

.p-list .regionlist .line:nth-child(1) .region:nth-child(1).active::after,
.p-list .regionlist .line:nth-child(1) .region:nth-child(2).active::after {
    width: 4.4vw;
}

.p-list .mybox {
    top: 50%;
    margin-top: -41%;
    left: 7.465vw;
    width: 85.06vw;
    background: #fafafa;
    border-radius: 4vw;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    color: #000;
}

.p-list .mybox .item {
    margin: 1.5vw 5vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.p-list .mybox .item .avatar,
.p-list .mybox .item .mytitle {
    height: 3.6vw;
    font-size: 2.4vw;
    line-height: 1;
    display: flex;
    align-items: center;
    color: #808080;
    font-weight: bold;
}
.p-list .mybox .item .myname,
.p-list .mybox .item .mypoint {
    margin-top: 0.6vw;
    font-size: 3.289vw;
    line-height: 1;
    font-weight: bold;
}
.p-list .mybox .item .myrank {
    margin-top: 0.6vw;
    font-size: 3.289vw;
    line-height: 1;
    font-weight: bold;
}
.p-list .mybox .item .myrank::after {
    content: " ";
    position: absolute;
    top: 0;
    right: -4vw;
    width: 2.267vw;
    height: 100%;
    background: url(../img/icon-1.png) no-repeat center center/contain;
}
.p-list .mybox .item .myrank.none::after {
    display: none;
}
.p-list .mybox .item .myrank.down {
    color: #a7c4c6;
}
.p-list .mybox .item .myrank.down::after {
    background-image: url(../img/icon-2.png);
}
.p-list .mybox .item .myrank.up {
    color: #d65e39;
}
.p-list .mybox .item .myrank.up::after {
    background-image: url(../img/icon-3.png);
}

.p-list .listbox {
    top: 50%;
    margin-top: -28.5%;
    left: 7.465vw;
    width: 85.06vw;
    height: 107.067vw;
    background: transparent;
    /* border-radius: 2vw; */
    display: flex;
    align-items: flex-start;
    color: #fff;
    padding: 2vw 0;
    justify-content: flex-start;
    flex-direction: column;
}

.p-list .listbox .listtitle {
    top: 0;
    left: 13.2vw;
    width: 65.33vw;
    height: 7.2vw;
    font-size: 3.2vw;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.p-list .listbox .listcontent {
    width: 100%;
}

.p-list .listbox .listcontent .item {
    width: 100%;
    height: 7.867vw;
    display: flex;
    align-items: center;
    font-size: 2.4vw;
    line-height: 1.1;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    box-sizing: content-box;
}

.p-list .listbox .listcontent .item:last-child {
    border: none;
}

.p-list .listbox .listcontent .item:nth-child(1) {
    margin-top: 0;
    font-size: 3.2vw;
}

.p-list .listbox .listcontent .item.rk1,
.p-list .listbox .listcontent .item.rk2,
.p-list .listbox .listcontent .item.rk3,
.p-list .listbox .listcontent .item.rk4,
.p-list .listbox .listcontent .item.rk5 {
    /* font-weight: bold; */
}

.p-list .listbox .listcontent .item .num {
    padding-top: 2px;
    width: 13.2vw;
    /* height: 6.67vw;
    line-height: 6.8vw; */
    text-align: center;
    box-sizing: border-box;
}
.p-list .listbox .listcontent .item.rk1 .num,
.p-list .listbox .listcontent .item.rk2 .num,
.p-list .listbox .listcontent .item.rk3 .num,
.p-list .listbox .listcontent .item.rk4 .num,
.p-list .listbox .listcontent .item.rk5 .num {
    height: 6.4vw;
    line-height: 2.5;
    background: transparent center center no-repeat;
    background-size: auto 100%;
    /* margin-bottom: 0.8vw; */
}

.p-list .listbox .listcontent .item.rk1 .num {
    background-image: url(../img/r1.png);
}

.p-list .listbox .listcontent .item.rk2 .num {
    background-image: url(../img/r2.png);
}

.p-list .listbox .listcontent .item.rk3 .num {
    background-image: url(../img/r3.png);
    color: #000;
}

.p-list .listbox .listcontent .item.rk4 .num {
    background-image: url(../img/r4.png);
}

.p-list .listbox .listcontent .item.rk5 .num {
    background-image: url(../img/r5.png);
}

.p-list .listbox .listcontent .item .right {
    padding-top: 2px;
    width: 69vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
}

.p-list .listbox .listcontent .item .sales {
    width: 31%;
    padding-right: 2vw;
    box-sizing: border-box;
}

.p-list .listbox .listcontent .item .hotel {
    width: 57%;
    text-align: left;
}

.p-list .listbox .listcontent .item .score {
    width: 12%;
    text-align: center;
}

.p-list.group .menubox {
    padding-bottom: 1vw;
}

.p-list.group .regionlist {
    display: none;
}

.p-list.group .info {
    margin-top: -1vw;
}

/* .p-list.type4 .listbox .listcontent .item .sales, */
.p-list.group .listbox .listcontent .item .hotel {
    display: none;
}

/* .p-list.type4 .listbox .listcontent .item .hotel, */
.p-list.group .listbox .listcontent .item .sales {
    width: 88%;
}

.p-list .groupmenu,
.p-list.group .hotelmenu {
    display: none;
}
.p-list .hotelmenu,
.p-list.group .groupmenu {
    display: flex;
}

.p-list.type3 .info,
.p-list.type3 .tips,
.p-list.type3 .regionlist,
.p-list.type3 .mybox {
    display: none;
}

.p-list.type3 .listbox {
    margin-top: -48.5%;
    height: 127.067vw;
}

/* .p-list.type3 .listbox .item,
.p-list.type4 .listbox .item {
    height: 8.05vw;
} */

.p-list.group .listbox,
.p-list.type3 .listbox {
    padding-left: 5vw;
    width: 80vw;
    /* box-sizing: border-box; */
}
.p-list.group .listbox .listcontent,
.p-list.type3 .listbox .listcontent {
    width: 75vw;
    height: 99.88vw;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-right: 2vw;
    box-sizing: border-box;
}
.p-list.group .listbox .listcontent::-webkit-scrollbar,
.p-list.type3 .listbox .listcontent::-webkit-scrollbar {
    margin-right: -5vw;
    width: 3px;
}
.p-list.group .listbox .listcontent::-webkit-scrollbar-thumb,
.p-list.type3 .listbox .listcontent::-webkit-scrollbar-thumb {
    background: #1f4456;
    border-radius: 10px;
}
.p-list.group .listbox .listcontent::-webkit-scrollbar-track,
.p-list.type3 .listbox .listcontent::-webkit-scrollbar-track {
    background: rgba(128, 130, 133, 0.43);
    border-radius: 10px;
}

.p-list.type3 .listbox .listcontent .item:nth-child(1) {
    margin-top: 0;
    font-size: 2.4vw;
}

.p-list.type3 .listbox .listcontent .item .num,
.p-list.type3 .listbox .cmtxtitle .num {
    padding: 2px 4vw;
    width: 38%;
    text-align: left;
    box-sizing: border-box;
}

.p-list.type3 .listbox .listcontent .item .right,
.p-list.type3 .listbox .cmtxtitle .right {
    padding-top: 2px;
    width: 58%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
}

.p-list .tabs {
    top: 10%;
    left: 21.5%;
    margin-top: -5.9%;
    width: 38.8vw;
    height: 7.8vw;
    border-radius: 7.8vw;
    font-size: 2.933vw;
    font-weight: 400;
    color: #284354;
    z-index: 9;
    line-height: 1;
    background: #fafafa;
    display: flex;
    align-items: center;
    justify-content: center;
}

.p-list .tabs.hide {
    display: none;
}

.p-list .tabs .tab {
    width: 18vw;
    height: 6vw;
    line-height: 1;
    text-align: center;
    border-radius: 6vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.p-list .tabs .tab.act {
    background: #284354;
    color: #fafafa;
    font-weight: bold;
}

.p-list .btn-back2 {
    top: 50%;
    left: 28vw;
    margin-top: 68%;
}

.p-list .cmtx {
    margin-top: 9%;
    width: 100%;
    color: #e8542a;
    font-size: 6.133vw;
    text-align: center;
    line-height: 1.2;
    display: none;
}

.p-list .cmtx .subtitle {
    color: #ffffff;
    font-size: 2.35vw;
    font-weight: normal;
}

.p-list .cmtxtitle {
    width: 72vw;
    height: 7.867vw;
    display: none;
    align-items: center;
    font-size: 3.2vw;
    line-height: 1.1;
    border-bottom: 2px solid rgba(255, 255, 255, 0.4);
    /* padding-right: 2vw; */
    box-sizing: content-box;
}

.p-list.type3 .cmtx {
    display: block;
}
.p-list.type3 .cmtxtitle {
    display: flex;
}

.p-event-menu .title,
.p-event-photo1 .title,
.p-event-photo2 .title,
.p-event-photo3 .title,
.p-event-photo4 .title,
.p-event-video1 .title,
.p-event-video2 .title {
    font-family: "SourceHanSans";
}

.p-event-menu .subtitle,
.p-event-photo1 .subtitle,
.p-event-photo2 .subtitle,
.p-event-photo3 .subtitle,
.p-event-photo4 .subtitle,
.p-event-video1 .subtitle,
.p-event-video2 .subtitle {
    font-family: "GraphikWide";
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
}

@-webkit-keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-webkit-keyframes zoominout {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    30% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    45% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    60%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes zoominout {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    30% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    45% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    60%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes hand {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes hand {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes moveLeftIn {
    0% {
        opacity: 1;
        -webkit-transform: translate(-100vw, 0);
        transform: translate(-100vw, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes moveLeftIn {
    0% {
        opacity: 1;
        -webkit-transform: translate(-100vw, 0);
        transform: translate(-100vw, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@-webkit-keyframes moveRightIn {
    from {
        opacity: 1;
        -webkit-transform: translate(100vw, 0);
        transform: translate(100vw, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes moveUpIn {
    0% {
        opacity: 1;
        -webkit-transform: translate(0, -100vw);
        transform: translate(0, -100vw);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@-webkit-keyframes moveUpIn {
    from {
        opacity: 1;
        -webkit-transform: translate(0, -100vw);
        transform: translate(0, -100vw);
    }
    to {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes moveRightIn {
    from {
        opacity: 1;
        -webkit-transform: translate(100vw, 0);
        transform: translate(100vw, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}