@charset "utf-8";

/* CSS Document */

html {
    font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-size: 62.5%;
    background: #fff;
    background-size: 100% auto;
}

* {
    padding: 0;
    margin: 0;
}

body {
    position: relative;
    color: #6f6f6f;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    background: none;
    width: 10.8rem;
    margin: 0 auto;
}

img {
    width: auto \9;
    max-width: 100%;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic
}

a {
    background: transparent;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    color: #333
}

a:active {
    outline: 0
}

a i {
    display: none;
}

img {
    display: block;
    outline: none;
    border: none;
    max-width: 100%
}

ul,
li {
    list-style: none;
}

body>* {
    width: 10.80rem;
    margin: auto;
}

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: " ";
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

.mt30 {
    margin-top: 0.42rem;
}

.mt50 {
    margin-top: 0.69rem;
}

.ovh {
    overflow: hidden;
}

.pr {
    position: relative;
}

#ios {
    display: none;
    text-align: center;
    background-color: #000;
    padding: 0.3rem 0;
    color: #fff;
    font-size: 10px;
    width: 100%;
}

*::-webkit-scrollbar {
    width: 0.1rem;
}

*::-webkit-scrollbar-thumb {
    background: #56CBB0;
    border-radius: 0.05rem;
}

*::-webkit-scrollbar-track {
    border-radius: 0.1rem;
    background-color: #B1EEDC;
}


/* 页面样式 */

/* 背景图 */

.bg1 {
    background: url(../images/bg/1.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 13.2rem;
    margin-top: -0.01rem;
}

.bg2 {
    background: url(../images/bg/2.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 12.2rem;
    margin-top: -0.01rem;
}

.bg3 {
    background: url(../images/bg/3.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 13.1rem;
    margin-top: -0.01rem;
}

.bg4 {
    background: url(../images/bg/4.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 14.5rem;
    margin-top: -0.01rem;
}

.bg5 {
    background: url(../images/bg/5.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 15rem;
    margin-top: -0.01rem;
}

.bg6 {
    background: url(../images/bg/6.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 15rem;
    margin-top: -0.01rem;
}

/* .bg7 {
    background: url(../images/bg/7.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 10rem;
    margin-top: -0.01rem;
}

.bg8 {
    background: url(../images/bg/8.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 13.5rem;
    margin-top: -0.01rem;
} */

.color_block {
    width: 10.8rem;
    height: 23.5rem;
    background-color: #4ebfff;
}

.bg9 {
    background: url(../images/bg/9.jpg) no-repeat center;
    background-size: 100% 100%;
    height: 5.83rem;
    margin-top: -0.01rem;
}

.swiper-pagination.swiper-pagination-bullets {
    bottom: 0;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 0.05rem;
}

@keyframes rotate {
    0% {
        transform: rotate(0);
    }

    20% {
        transform: rotate(-2deg);
    }

    60% {
        transform: rotate(0);
    }

    80% {
        transform: rotate(2deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes barrage {
    from {
        left: 100%;
        transform: translateX(0);
    }

    to {
        left: 0;
        transform: translateX(-300%);
    }
}

.rule {
    position: fixed;
    top: 2.02rem;
    right: 0;
    width: 0.51rem;
    height: 2.14rem;
    z-index: 999;
}

.p1 {
    position: absolute;
    top: 13.52rem;
}

.p1 .bg {
    background: url(../images/p1/bg.png?v=1762849464) no-repeat center;
    background-size: 100% 100%;
    position: relative;
    width: 9.78rem;
    height: 3.88rem;
    margin: 0 auto;
}

.p1 .bg .btn1 {
    position: absolute;
    top: 2.42rem;
    left: 0.98rem;
    width: 2.12rem;
    height: 0.86rem;
}

.p1 .bg .btn2 {
    position: absolute;
    top: 2.42rem;
    left: 3.84rem;
    width: 2.12rem;
    height: 0.86rem;
}

.p1 .bg .btn3 {
    position: absolute;
    top: 2.38rem;
    left: 6.65rem;
    width: 2.12rem;
    height: 0.86rem;
}

.p2 {
    position: absolute;
    top: 17.94rem;
}

.p2 .bg {
    background: url(../images/p2/bg.png) no-repeat center;
    background-size: 100% 100%;
    position: relative;
    width: 9.78rem;
    height: 19.8rem;
    margin: 0 auto;
}

.p2 .bg .title1 {
    position: absolute;
    top: 0.24rem;
    left: 2.02rem;
    width: 5.74rem;
    height: 1.65rem;
    animation: rotate 0.5s ease infinite;
}

.p2 .bg .coupon1 {
    position: absolute;
    top: 3.68rem;
    left: 0.44rem;
    width: 9rem;
    height: 2.02rem;
}

.p2 .bg .coupon2 {
    position: absolute;
    top: 6.03rem;
    left: 0.44rem;
    width: 9rem;
    height: 2.02rem;
}

.p2 .bg .title2 {
    position: absolute;
    top: 8.8rem;
    left: 2.02rem;
    width: 5.74rem;
    height: 1.65rem;
    animation: rotate 0.5s ease infinite;
}

.p2 .bg .coupon3 {
    position: absolute;
    top: 12.13rem;
    left: 0.34rem;
    width: 9.11rem;
    height: 2.11rem;
}

.p2 .bg .coupon4 {
    position: absolute;
    top: 14.49rem;
    left: 0.34rem;
    width: 9.11rem;
    height: 2.11rem;
}

.p2 .bg .coupon5 {
    position: absolute;
    top: 16.86rem;
    left: 0.34rem;
    width: 9.11rem;
    height: 2.11rem;
}

.p3 {
    position: absolute;
    top: 38.78rem;
}

.p3 .title {
    width: 5.2rem;
    height: 1.31rem;
    margin-left: 2.77rem;
}

.p3 .bg {
    background: url(../images/p3/bg.png) no-repeat center;
    background-size: 100% 100%;
    position: relative;
    width: 9.78rem;
    height: 21.93rem;
    margin: 0 auto;
    margin-top: 0.58rem;
    overflow: hidden;
}

.p3 .bg .barrage {
    position: absolute;
    top: 0;
    left: 0;
    width: 9.78rem;
    height: 7.25rem;
    animation: barrage 20s linear infinite;
}

.p3 .bg .barrage img {
    width: 4.72rem;
    height: 1.86rem;
}

.p3 .bg .barrage .barrage1 {
    position: absolute;
    top: 0.25rem;
    left: 0.28rem;
}

.p3 .bg .barrage .barrage2 {
    position: absolute;
    top: 1.15rem;
    left: 10rem;
}

.p3 .bg .barrage .barrage3 {
    position: absolute;
    top: 1.31rem;
    left: 5.1rem;
}

.p3 .bg .barrage .barrage4 {
    position: absolute;
    top: 3.31rem;
    left: 1.3rem;
}

.p3 .bg .barrage .barrage5 {
    position: absolute;
    top: 3.24rem;
    left: 6.52rem;
}

.p3 .bg .barrage .barrage6 {
    position: absolute;
    top: 5.24rem;
    left: 0.35rem;
}

.p3 .bg .barrage .barrage7 {
    position: absolute;
    top: 5.3rem;
    left: 5.7rem;
}

.p3 .bg .barrage .barrage8 {
    position: absolute;
    top: 3.3rem;
    left: 11.5rem;
}

.p3 .bg .barrage .barrage9 {
    position: absolute;
    top: 5.3rem;
    left: 10.62rem;
}

.p3 .bg .barrage .barrage10 {
    position: absolute;
    top: 0.98rem;
    left: 14.95rem;
}

.p3 .bg .barrage .barrage11 {
    position: absolute;
    top: 5.4rem;
    left: 15.5rem;
}

.p3 .bg .barrage .barrage12 {
    position: absolute;
    top: 0.25rem;
    left: 19.9rem;
}

.p3 .bg .barrage .barrage13 {
    position: absolute;
    top: 0.25rem;
    left: 24.9rem;
}

.p3 .bg .barrage .barrage14 {
    position: absolute;
    top: 3.31rem;
    left: 16.6rem;
}

.p3 .bg .barrage .barrage15 {
    position: absolute;
    top: 3.31rem;
    left: 21.6rem;
}

.p3 .bg .barrage .barrage16 {
    position: absolute;
    top: 5.31rem;
    left: 20.6rem;
}

.p3 .bg .barrage .barrage17 {
    position: absolute;
    top: 2.31rem;
    left: 26.6rem;
}

.p3 .bg .barrage .barrage18 {
    position: absolute;
    top: 4.31rem;
    left: 26.6rem;
}

.p3 .bg .barrage .barrage19 {
    position: absolute;
    top: 5.31rem;
    left: 31.6rem;
}

.p3 .bg .barrage .barrage20 {
    position: absolute;
    top: 0.31rem;
    left: 30.1rem;
}

.p3 .bg .title1 {
    position: absolute;
    top: 7.68rem;
    left: 0.28rem;
    width: 5.71rem;
    height: 1.42rem;
    z-index: 99;
    animation: rotate 0.5s ease infinite;
}

.p3 .bg1 {
    background: url(../images/p3/bg1.png) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    top: 8.3rem;
    left: 0.3rem;
    width: 9.2rem;
    height: 7.21rem;
}

.p3 .bg .title2 {
    position: absolute;
    top: 16.23rem;
    left: 0.28rem;
    width: 5.71rem;
    height: 1.42rem;
    z-index: 99;
    animation: rotate 0.5s ease infinite;
}

.p3 .bg2 {
    background: url(../images/p3/bg2.png?v=1762849464) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    top: 16.85rem;
    left: 0.3rem;
    width: 9.2rem;
    height: 4.38rem;
}

.p3 .bg2 .btn1 {
    position: absolute;
    top: 2.91rem;
    left: 0.83rem;
    width: 1.57rem;
    height: 0.55rem;
}

.p3 .bg2 .btn2 {
    position: absolute;
    top: 2.91rem;
    left: 3.78rem;
    width: 1.57rem;
    height: 0.55rem;
}

.p4 {
    position: absolute;
    top: 63.65rem;
}

.p4 .title {
    width: 3.5rem;
    height: 1.29rem;
    margin-left: 3.63rem;
}

.p4 .bg {
    background: url(../images/p4/bg.png) no-repeat center;
    background-size: 100% 100%;
    position: relative;
    width: 9.78rem;
    height: 10.42rem;
    margin: 0 auto;
    margin-top: 0.6rem;
}

.p4 .bg .tab {
    position: absolute;
    top: 2.49rem;
    left: 0.86rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.p4 .bg .tab img {
    width: 2.25rem;
    height: 0.79rem;
    margin: 0 0.22rem;
}

.p4 .bg1 {
    background: url(../images/p4/bg1.png?v=1762849464) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    top: 3.78rem;
    left: 0.3rem;
    width: 9.2rem;
    height: 5.94rem;
}

.p4 .bg2 {
    background: url(../images/p4/bg2.png?v=1762849464) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    top: 3.78rem;
    left: 0.3rem;
    width: 9.2rem;
    height: 5.94rem;
}

.p4 .bg3 {
    background: url(../images/p4/bg3.png?v=1762849464) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    top: 3.78rem;
    left: 0.3rem;
    width: 9.2rem;
    height: 5.94rem;
}

.p4 .bg1 .time,
.p4 .bg2 .time,
.p4 .bg3 .time {
    position: absolute;
    top: 0.54rem;
    left: 0.66rem;
    width: 7.89rem;
    height: 1.74rem;
}

.p4 .bg1 .btn1,
.p4 .bg2 .btn1,
.p4 .bg3 .btn1 {
    position: absolute;
    top: 2.78rem;
    left: 1.46rem;
    width: 6.34rem;
    height: 0.85rem;
}

.p4 .bg1 .btn2,
.p4 .bg2 .btn2,
.p4 .bg3 .btn2 {
    position: absolute;
    top: 3.79rem;
    left: 1.46rem;
    width: 6.34rem;
    height: 0.85rem;
}

.p5 {
    position: absolute;
    top: 76.97rem;
}

.p5 .title {
    width: 5.15rem;
    height: 1.27rem;
    margin-left: 2.82rem;
}

.p5 .tab-top {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.7rem;
}

.p5 .tab-bottom {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.2rem;
}

.p5 .tab-top img {
    width: 1.82rem;
    height: 0.65rem;
    margin: 0 0.21rem;
}

.p5 .tab-bottom img {
    width: 1.82rem;
    height: 0.65rem;
    margin: 0 0.18rem;
}

.p5 .sight {
    margin-top: 0.82rem;
}

.p5 .sight .items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 9.6rem;
    margin: 0 auto;
}

.p5 .sight .items .item {
    position: relative;
    width: 4.3rem;
    height: 5.59rem;
    margin: 0.15rem 0.25rem;
    z-index: 0;
}

.p5 .sight .items .item .jump {
    position: absolute;
    top: 0;
    left: 0;
    width: 4.3rem;
    height: 5.59rem;
    z-index: 999;
}

.p5 .sight .items .item:nth-child(1),
.p5 .sight .items .item:nth-child(2) {
    margin-top: 0;
}

.p5 .sight .items .item:nth-child(7),
.p5 .sight .items .item:nth-child(8) {
    margin-bottom: 0;
}

.p5 .sight .items .item .tag {
    position: absolute;
    top: 0.12rem;
    left: 0.12rem;
    width: 0.97rem;
    height: 0.48rem;
    line-height: 0.48rem;
    text-align: center;
    border-radius: 0.48rem;
    background-color: rgba(0, 0, 0, 0.65);
    font-size: 0.28rem;
    color: #fff;
}

.p5 .sight .items .item .sight-img {
    width: 4.3rem;
    height: 5.59rem;
    margin: 0 auto;
}

.p5 .sight .items .item .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 4.3rem;
    height: 3.32rem;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    object-fit: cover;
}

.p5 .sight .items .item .name {
    position: absolute;
    top: 3.5rem;
    left: 0.23rem;
    font-size: 0.38rem;
    color: #000;
    width: 3.95rem;
    line-height: 1.2;
    /* 限制容器宽度 */
    display: -webkit-box;
    /* 设置为WebKit内核的弹性盒子模型 */
    -webkit-box-orient: vertical;
    /* 垂直排列 */
    -webkit-line-clamp: 2;
    /* 限制显示两行 */
    overflow: hidden;
    /* 隐藏超出范围的内容 */
    text-overflow: ellipsis;
    /* 使用省略号 */
}

.p5 .sight .items .item .address {
    position: absolute;
    top: 2.54rem;
    left: 0.12rem;
    width: 1.38rem;
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: rgba(0, 0, 0, 0.65);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.p5 .sight .items .item .address .icon {
    height: 0.3rem;
}

.p5 .sight .items .item .address .text {
    font-size: 0.28rem;
    margin-left: 0.16rem;
}

.p5 .sight .items .item .score {
    position: absolute;
    bottom: 0.15rem;
    left: 0.25rem;
    font-size: 0.38rem;
}

.p5 .sight .items .item .price {
    position: absolute;
    bottom: 0.15rem;
    /* left: 1.7rem; */
    left: 2.8rem;
}

.p5 .sight .items .item .price .text {
    font-size: 0.38rem;
    color: #999;
}

.p5 .sight .items .item .price .currency {
    font-size: 0.28rem;
    font-weight: 600;
    color: #f83a13;
}

.p5 .sight .items .item .price .num {
    font-size: 0.4rem;
    font-weight: 600;
    color: #f83a13;
}

.p5 .sight .items .item .price .unit {
    font-size: 0.22rem;
    color: #999;
}

.p5 .more {
    width: 3.78rem;
    height: 0.65rem;
    margin: 0 auto;
    margin-top: 0.92rem;
}

.popupRule-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10000;
}

.popup-rule {
    margin: auto;
    z-index: 1;
}

.popup-rule,
.popup-rule_mask {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.popup-rule_mask {
    background: rgba(0, 0, 0, .6);
}

.popRule-ani-zoomIn {
    animation: "popupRuleZoomIn";
    animation-iteration-count: 1;
    animation-duration: .3s;
}

.popupRule-container {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: flex;
    flex-direction: column;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 90%;
    min-height: 10%;
    max-height: 80%;
    text-align: center;
    border-radius: 0.05rem;
    overflow: hidden;
    padding: 0 0.05rem 0.05rem;
}

.popupRule-title {
    position: relative;
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    color: #000;
    font-weight: bold;
}

.popupRule-title:before {
    content: "X";
    transform: scaleX(1.4);
    font-weight: 100;
    position: absolute;
    right: 10px;
    font-family: arial;
}

.popupRule-div {
    height: calc(100% - 40px);
}

.popupRule-div,
.popupRule-div>ol {
    overflow: auto;
}

.popupRule-div ol {
    flex: 1;
    margin: 0;
    background: #fff;
    text-align: left;
    padding: 5px;
}

.popupRule-div ol li {
    color: #000;
    font-size: 14px;
    list-style: none;
    line-height: 1.5;
    text-align: justify;
}