.filter-box { padding-top: 30px; } .top-banner { position: relative; width: 100%; min-width: 1200px; } .top-banner .swiper-container .swiper-slide img { width: 100%; } .top-banner.pc { display: block; } .top-banner.mobile { display: none; } .top-banner .hotel-name-group { position: absolute; top: 48%; left: 0; width: 100%; text-align: center; z-index: 11; } .top-banner .hotel-name-group h2 { font-size: 40px; font-weight: 200; color: #fff; letter-spacing: 28px; } .top-banner .hotel-name-group h4 { margin-top: 12px; font-size: 14px; font-weight: 200; color: #fff; letter-spacing: 14px; } .top-banner .mask { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); z-index: 10; } .part-title { width: 100%; display: flex; align-items: flex-end; padding: 20px auto; } .part-title h2 { font-weight: bold; line-height: 42px; font-size: 38px; color: #b3906a; } .part-title h4 { margin-left: 19px; line-height: 32px; font-size: 26px; color: #b3906a; font-weight: 300; } .part-title .line { position: relative; top: -15px; display: block; margin-left: 20px; flex: 1; height: 1px; background-color: rgba(255, 255, 255, 0.2); } .hotel-part-one { margin-top: 100px; } .hotel-part-one .my-container .destination-swiper-container { padding-bottom: 70px; } .hotel-part-one .my-container .destination-swiper-container .destination-list { width: 394px; height: 420px; margin-top: 30px; border: 1px solid rgba(255, 255, 255, 0.2); } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-pic { width: 100%; height: 222px; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main { padding: 20px 30px; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-tit { font-size: 22px; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 1; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 10px; font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 20px; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: space-between; margin-top: 25px; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 140px; height: 46px; font-size: 16px; font-weight: bold; color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.3); } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address { padding-left: 20px; font-size: 14px; font-weight: 300; color: #999999; line-height: 48px; display: flex; align-items: center; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; padding-left: 20px; background-image: url(/static/cn/images/hotel/position_icon.png); background-repeat: no-repeat; background-position: left center; background-size: 14px auto; color: rgba(255, 255, 255, 0.3); } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover { background-color: #152b49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #b3906a; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #b3906a; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: #b3906a; background-image: url(/static/cn/images/hotel/position_icon_active.png); } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 140px; height: 46px; font-size: 16px; font-weight: bold; color: #fff; border: 1px solid #b3906a; background-image: url(/static/cn/images/hotel/part2_bgcolor.png); background-repeat: no-repeat; background-position: center; background-size: 110% 110%; } .hotel-part-one .my-container .destination-swiper-container .swiper-pagination-bullet { width: 15px; height: 15px; border: 2px solid #d2d2d2; background-color: transparent; opacity: 0.2; } .hotel-part-one .my-container .destination-swiper-container .swiper-pagination-bullet-active { background: #b98c56; border: none; opacity: 1; } .hotel-part-two { margin-top: 75px; } .hotel-part-two .introduction-box { display: flex; justify-content: space-between; margin-top: 30px; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.17); overflow: hidden; } .hotel-part-two .introduction-box .left-box { width: 868px; height: 488px; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide { position: relative; cursor: pointer; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide img { display: block; width: 100%; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide .facilities-more { position: absolute; bottom: 15px; left: 15px; display: none; flex-wrap: wrap; width: 96%; padding: 10px 10px; border-radius: 6px; background-color: rgba(21, 43, 73, 0.5); } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide .facilities-more .more-item { display: flex; align-items: center; margin-right: 15px; margin-bottom: 5px; height: 26px; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide .facilities-more .more-item img { display: block; width: 25px; height: 25px; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide .facilities-more .more-item h4 { margin-left: 5px; font-size: 14px; line-height: 16px; color: #b3906a; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-next, .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-prev { top: 48%; width: 48px; height: 67px; background-size: 48px 67px; outline: 0; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-next { right: 20px; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-prev { left: 20px; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-two .introduction-box .right-box { padding-left: 50px; padding-top: 70px; width: 332px; height: 488px; background: #152b49; } .hotel-part-two .introduction-box .right-box .content-item { display: none; } .hotel-part-two .introduction-box .right-box .content-item.show { display: block; } .hotel-part-two .introduction-box .right-box .content-item .title { font-size: 20px; color: #b3906a; } .hotel-part-two .introduction-box .right-box .content-item .info-group { display: flex; flex-wrap: wrap; margin-top: 47px; } .hotel-part-two .introduction-box .right-box .content-item .info-group li { display: flex; flex-direction: column; width: 50%; margin-bottom: 15px; } .hotel-part-two .introduction-box .right-box .content-item .info-group li .attribute { font-size: 14px; line-height: 22px; color: #b3906a; opacity: 0.6; } .hotel-part-two .introduction-box .right-box .content-item .info-group li .value { font-size: 16px; line-height: 26px; color: #b3906a; } .hotel-part-two .introduction-box .right-box .content-item .info-group li:nth-child(2n) { width: 50%; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities { margin-top: 20px; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities h4 { font-size: 14px; line-height: 22px; color: #b3906a; opacity: 0.6; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group { display: flex; justify-content: center; flex-direction: column; margin-top: 10px; padding-right: 30px; height: 75px; overflow: hidden; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .ul-list { display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .ul-list li { width: 48%; font-size: 14px; line-height: 26px; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .arrow { margin-top: 10px; width: 70%; height: 30px; background-image: url(/static/cn/images/hotel/open_more_icon1.png); background-repeat: no-repeat; background-position: center center; background-size: auto 10px; box-sizing: border-box; } .hotel-part-two .introduction-box .right-box .content-item .reserve-box { margin-top: 25px; } .hotel-part-two .introduction-box .right-box .content-item .reserve-box .reserve-btn { position: relative; display: block; width: 140px; height: 38px; text-align: center; font-size: 16px; line-height: 38px; color: #B3906A; background-image: url(/static/cn/images/hotel/reserve_btn.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; } .hotel-part-three { margin-top: 100px; } .hotel-part-three .restaurant-box { position: relative; margin-top: 30px; } .hotel-part-three .restaurant-box .swiper-container .swiper-slide img { width: 100%; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination { padding-right: 30px; text-align: right; bottom: 42px; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; border: 1px solid rgba(255, 255, 255, 0.5); background: none; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination .swiper-pagination-bullet-active { background-color: #fff; } .hotel-part-three .restaurant-box .restaurant-info-right { position: absolute; left: 30px; top: calc(50% - 205px); width: 400px; height: 410px; padding: 56px 32px; background: rgba(21, 43, 73, 0.9); z-index: 100; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item { display: none; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item.show { display: block; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .title { font-size: 24px; line-height: 26px; color: #b3906a; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .desc { margin-top: 20px; font-size: 14px; line-height: 26px; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .line { display: block; margin: 50px 0; width: 100%; height: 1px; background-color: #fff; opacity: 0.2; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .bottom-text h4 { font-size: 14px; line-height: 24px; color: #b3906a; } .hotel-part-four { margin-top: 100px; } .hotel-part-four .meeting-box { position: relative; margin-top: 30px; } .hotel-part-four .meeting-box .swiper-container .swiper-slide img { display: block; width: 100%; } .hotel-part-four .meeting-box .swiper-container .swiper-slide .title { position: absolute; bottom: 30px; left: 30px; font-size: 26px; font-weight: bold; color: #fff; } .hotel-part-four .meeting-box .swiper-container .swiper-button-next, .hotel-part-four .meeting-box .swiper-container .swiper-button-prev { top: 48%; width: 34px; height: 60px; background-size: 34px 60px; outline: 0; } .hotel-part-four .meeting-box .swiper-container .swiper-button-next { right: 20px; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-four .meeting-box .swiper-container .swiper-button-prev { left: 20px; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-four .meeting-box .meeting-info-right { width: 100%; padding-top: 15px; } .hotel-part-four .meeting-box .meeting-info-right .content-item { display: none; } .hotel-part-four .meeting-box .meeting-info-right .content-item .title { display: block; font-size: 24px; margin-bottom: 10px; color: #b3906a; } .hotel-part-four .meeting-box .meeting-info-right .content-item .line { display: none; } .hotel-part-four .meeting-box .meeting-info-right .content-item p { font-size: 14px; line-height: 30px; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .hotel-part-four .meeting-box .meeting-info-right .content-item.show { display: block; } .hotel-part-five { margin-top: 100px; } .hotel-part-five .more-marvellous { margin-top: 30px; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-slide img { display: block; width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-slide video { width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-next, .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-prev { top: 48%; width: 48px; height: 67px; background-size: 48px 67px; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-next { right: 20px; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-prev { left: 20px; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs { margin-top: 10px; } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide { opacity: 0.6; } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide img { display: block; width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide-thumb-active { opacity: 1; } .hotel-part-six { margin-top: 100px; } .hotel-part-six .service-box .item-row { margin-top: 40px; } .hotel-part-six .service-box .item-row.hide { display: none; } .hotel-part-six .service-box .item-row h2 { font-size: 22px; font-weight: bold; line-height: 32px; color: #B3906A; } .hotel-part-six .service-box .item-row > ul { display: flex; flex-wrap: wrap; margin-top: 5px; } .hotel-part-six .service-box .item-row > ul > li { display: flex; align-items: center; width: 20%; margin-right: 6.3%; margin-top: 5px; } .hotel-part-six .service-box .item-row > ul > li.mr-0 { margin-right: 0; } .hotel-part-six .service-box .item-row > ul > li img { width: 42px; height: 42px; } .hotel-part-six .service-box .item-row > ul > li span { padding-left: 12px; font-size: 16px; line-height: 50px; color: #B3906A; } .hotel-part-six .open-more-box { display: flex; justify-content: center; align-items: center; flex-direction: column; margin-top: 42px; } .hotel-part-six .open-more-box a { font-size: 14px; line-height: 32px; color: #B3906A; opacity: 0.5; } .hotel-part-six .open-more-box img { display: block; width: 20px; height: 10px; cursor: pointer; } .hotel-part-seven { position: relative; margin-top: 100px; margin-bottom: -100px; min-width: 1200px; overflow: hidden; } .hotel-part-seven .map-container { width: 100%; height: 800px; } .hotel-part-seven .tagging-icon { width: 34px; height: 47px; background-image: url(/static/cn/images/hotel/tagging-icon1.png); background-repeat: no-repeat; background-position: center; background-size: 32px 45px; } .hotel-part-seven .info-box { position: absolute; top: 7%; right: 16%; width: 600px; padding: 80px 70px; background: rgba(4, 21, 43, 0.85); } .hotel-part-seven .info-box .title { font-size: 24px; line-height: 32px; color: #B3906A; } .hotel-part-seven .info-box .position-info { margin-top: 22px; font-size: 14px; line-height: 30px; color: rgba(179, 144, 106, 0.6); max-height: 210px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 7; overflow: hidden; } .hotel-part-seven .info-box .trip-list { margin-top: 60px; max-height: 324px; overflow: hidden; } .hotel-part-seven .info-box .trip-list li { display: flex; margin-top: 16px; } .hotel-part-seven .info-box .trip-list li img { display: block; width: 38px; height: 38px; } .hotel-part-seven .info-box .trip-list li h4 { padding-left: 20px; font-size: 14px; line-height: 27px; color: #B3906A; opacity: 0.8; } .hotel-part-seven .info-box .bottom-text { margin-top: 50px; } .hotel-part-seven .info-box .bottom-text p { font-size: 14px; line-height: 32px; color: #B3906A; opacity: 0.8; } .footer { margin-top: 100px; padding-top: 100px; width: 100%; height: 512px; background-color: #05162c; } .footer .content-box { display: flex; justify-content: space-between; } .footer .content-box .left { width: 50%; } .footer .content-box .left .title { font-size: 28px; line-height: 30px; font-weight: bold; color: #b3906a; } .footer .content-box .left .info-group { margin-top: 40px; } .footer .content-box .left .info-group .info-row { width: 100%; display: flex; } .footer .content-box .left .info-group .info-row + .info-row { margin-top: 10px; } .footer .content-box .left .info-group .info-row .info { width: 50%; display: flex; align-items: center; } .footer .content-box .left .info-group .info-row .info h4 { font-size: 16px; line-height: 24px; color: #b3906a; } .footer .content-box .left .info-group .info-row .info h5 { font-size: 16px; line-height: 24px; color: #b3906a; } .footer .content-box .left .info-group .info-row .info a { font-size: 16px; line-height: 24px; color: #b3906a; } .footer .content-box .left .info-group .info-row .info a:hover { text-decoration: underline; } .footer .content-box .left .info-group .info-row .info .gf-icon { display: block; margin-left: 20px; width: 25px; height: 22px; background-repeat: no-repeat; background-position: center center; background-size: 24px auto; cursor: pointer; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx { position: relative; background-image: url(/static/cn/images/hotel/footer_wx_icon.png); } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx img { position: absolute; top: 20px; left: -65px; display: none; width: 150px; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx:hover img { display: block; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wb { background-image: url(/static/cn/images/hotel/footer_wb_icon.png); } .footer .content-box .left .info-group .info-row .info .gf-icon:hover.icon-wx { background-image: url(/static/cn/images/hotel/footer_wx_icon_white.png); } .footer .content-box .left .info-group .info-row .info .gf-icon:hover.icon-wb { background-image: url(/static/cn/images/hotel/footer_wb_icon_white.png); } .footer .content-box .left .logo-list { display: flex; flex-wrap: wrap; margin-top: 80px; } .footer .content-box .left .logo-list li { display: flex; align-items: center; justify-content: center; margin-right: 25px; margin-bottom: 20px; width: 74px; } .footer .content-box .left .logo-list li img { width: 100%; } .footer .content-box .right { width: 50%; } .footer p { margin-top: 75px; text-align: center; font-size: 14px; line-height: 26px; color: #999; opacity: 0.5; } .hotel-room-frame { position: fixed; top: 25%; left: calc(50% - 434px); display: none; width: 868px; z-index: 999999999; } .hotel-room-frame .swiper-container .swiper-slide img { width: 100%; } .hotel-room-frame .swiper-container .swiper-button-next, .hotel-room-frame .swiper-container .swiper-button-prev { top: 48%; width: 48px; height: 67px; background-size: 48px 67px; } .hotel-room-frame .swiper-container .swiper-button-next { right: 20px; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-room-frame .swiper-container .swiper-button-prev { left: 20px; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-room-frame .guest-room-box { display: flex; flex-wrap: wrap; padding: 20px 20px; width: 100%; min-width: 200px; background-color: #05162C; } .hotel-room-frame .guest-room-box h2 { margin-right: 20px; font-size: 16px; line-height: 32px; color: #b3906a; } .mask { position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 99999999; } @media only screen and (max-width: 600px) { .top-banner { width: 100%; min-width: 100%; } .top-banner.pc { display: none; } .top-banner.mobile { display: block; } .top-banner .hotel-name-group { position: absolute; top: 40%; left: 0; width: 100%; text-align: center; z-index: 11; } .top-banner .hotel-name-group h2 { font-size: 0.45rem; font-weight: 200; color: #fff; letter-spacing: 0.1rem; } .top-banner .hotel-name-group h4 { margin-top: 0.16rem; font-size: 0.24rem; font-weight: 200; color: #fff; letter-spacing: 0.07rem; } .part-title { width: 100%; display: flex; align-items: flex-end; padding: 20px auto; } .part-title h2 { font-weight: bold; line-height: 0.42rem; font-size: 0.38rem; color: #b3906a; } .part-title h4 { margin-left: 0.19rem; line-height: 0.32rem; font-size: 0.26rem; color: #b3906a; font-weight: 300; } .part-title .line { position: relative; top: -0.1rem; display: block; margin-left: 0.2rem; flex: 1; height: 1px; background-color: rgba(255, 255, 255, 0.2); } .hotel-part-one { margin-top: 0.82rem; } .hotel-part-one .my-container { padding: 0; } .hotel-part-one .my-container .part-title { padding: 0 0.3rem; } .hotel-part-one .my-container .destination-swiper-container { padding-bottom: 0.7rem; padding-left: 0.3rem; } .hotel-part-one .my-container .destination-swiper-container .destination-list { width: 4.92rem; height: 5.4rem; margin-top: 0.38rem; border: 1px solid rgba(255, 255, 255, 0.2); } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-pic { width: 100%; height: unset; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main { padding: 0.29rem 0.39rem; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-tit { font-size: 0.28rem; font-weight: bold; color: rgba(255, 255, 255, 0.3); line-height: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-desc { margin-top: 0.1rem; font-size: 0.22rem; font-weight: 400; color: rgba(255, 255, 255, 0.3); line-height: 0.34rem; height: 0.7rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom { display: flex; align-items: center; justify-content: space-between; margin-top: 0.25rem; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 1.6rem; height: 0.55rem; font-size: 0.2rem; font-weight: bold; color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.3); } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address { padding-left: 20px; font-size: 14px; font-weight: 300; color: #999999; line-height: 48px; display: none; align-items: center; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-icon { display: block; width: 14px; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-icon img { width: 100%; } .hotel-part-one .my-container .destination-swiper-container .destination-list .list-main .list-buttom .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: rgba(255, 255, 255, 0.3); } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover { background-color: #152b49; box-shadow: 0px 10px 25px 7px rgba(27, 23, 19, 0.2); } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-tit { color: #b3906a; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-desc { color: #b3906a; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-icon { display: block; width: 14px; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-icon img { width: 100%; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-address .position-text { margin-left: 5px; font-size: 14px; line-height: 48px; color: #b3906a; } .hotel-part-one .my-container .destination-swiper-container .destination-list:hover .list-main .list-buttom-more { display: flex; justify-content: center; align-items: center; width: 1.6rem; height: 0.55rem; font-size: 0.2rem; font-weight: bold; color: #fff; border: 1px solid rgba(179, 144, 106, 0); background-image: url(/static/cn/images/hotel/part2_bgcolor.png); background-repeat: no-repeat; background-position: center; background-size: 110% 110%; } .hotel-part-one .my-container .destination-swiper-container .swiper-pagination { bottom: -5px; } .hotel-part-one .my-container .destination-swiper-container .swiper-pagination-bullet { width: 0.18rem; height: 0.18rem; border: 1px solid #d2d2d2; background-color: transparent; opacity: 0.2; } .hotel-part-one .my-container .destination-swiper-container .swiper-pagination-bullet-active { background: #b98c56; border: none; opacity: 1; } .hotel-part-two { margin-top: 0.82rem; } .hotel-part-two .introduction-box { display: flex; justify-content: center; align-items: center; flex-direction: column; margin-top: 0.3rem; box-shadow: 0 0.1rem 0.25rem 0.07rem rgba(27, 23, 19, 0.17); } .hotel-part-two .introduction-box .left-box { width: 100%; height: auto; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide img { display: block; width: 100%; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-slide .facilities-more { width: 92%; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-next, .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-prev { top: 50%; width: 0.52rem; height: 0.72rem; background-size: 0.5rem 0.7rem; outline: 0; } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-next { right: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-two .introduction-box .left-box .swiper-container .swiper-button-prev { left: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-two .introduction-box .right-box { padding-left: 0.4rem; padding-right: 0.6rem; padding-top: 0.5rem; padding-bottom: 0.5rem; width: 100%; height: auto; background: #152b49; } .hotel-part-two .introduction-box .right-box .content-item { display: none; } .hotel-part-two .introduction-box .right-box .content-item.show { display: block; } .hotel-part-two .introduction-box .right-box .content-item .title { font-size: 0.3rem; color: #b3906a; } .hotel-part-two .introduction-box .right-box .content-item .info-group { display: flex; justify-content: space-between; flex-wrap: nowrap; margin-top: 0.4rem; } .hotel-part-two .introduction-box .right-box .content-item .info-group li { display: flex; flex-direction: column; width: auto; margin-bottom: 0.15rem; } .hotel-part-two .introduction-box .right-box .content-item .info-group li .attribute { font-size: 0.24rem; line-height: 0.32rem; color: #b3906a; opacity: 0.6; } .hotel-part-two .introduction-box .right-box .content-item .info-group li .value { margin-top: 0.1rem; font-size: 0.26rem; line-height: 0.32rem; color: #b3906a; } .hotel-part-two .introduction-box .right-box .content-item .info-group li:nth-child(2n) { width: auto; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities { margin-top: 0.1rem; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities h4 { font-size: 0.24rem; line-height: 0.32rem; color: #b3906a; opacity: 0.6; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group { display: flex; justify-content: center; flex-direction: column; margin-top: 0.1rem; padding-right: 0.3rem; padding-bottom: 0.2rem; height: auto; overflow: hidden; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .ul-list { display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .ul-list li { width: 46%; font-size: 14px; line-height: 26px; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .hotel-part-two .introduction-box .right-box .content-item .other-facilities .facilities-group .arrow { width: 70%; height: 30px; background-image: url(/static/cn/images/hotel/open_more_icon1.png); background-repeat: no-repeat; background-position: center center; background-size: auto 10px; } .hotel-part-two .introduction-box .right-box .content-item .reserve-box { margin-top: 0; } .hotel-part-two .introduction-box .right-box .content-item .reserve-box .reserve-btn { position: relative; display: block; width: 1.59rem; height: 0.55rem; text-align: center; font-size: 0.22rem; line-height: 0.55rem; color: #B3906A; background-image: url(/static/cn/images/hotel/reserve_btn.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; } .hotel-part-three { margin-top: 0.82rem; } .hotel-part-three .restaurant-box { position: relative; margin-top: 0.4rem; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination { padding-right: 0.3rem; text-align: right; bottom: 0.3rem; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; border: 1px solid rgba(255, 255, 255, 0.5); background: none; } .hotel-part-three .restaurant-box .swiper-container .swiper-pagination .swiper-pagination-bullet-active { background-color: #fff; } .hotel-part-three .restaurant-box .restaurant-info-right { position: unset; left: 0; top: 0; width: 100%; height: auto; padding: 0.49rem 0.39rem; background: rgba(21, 43, 73, 0.9); z-index: 100; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item { display: none; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item.show { display: block; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .title { font-size: 0.3rem; line-height: 0.32rem; color: #b3906a; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .desc { margin-top: 0.29rem; font-size: 0.24rem; line-height: 0.4rem; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .line { display: block; margin: 0.49rem 0; width: 100%; height: 1px; background-color: #fff; opacity: 0.2; } .hotel-part-three .restaurant-box .restaurant-info-right .content-item .bottom-text h4 { font-size: 0.24rem; line-height: 0.4rem; color: #b3906a; } .hotel-part-four { margin-top: 0.82rem; } .hotel-part-four .meeting-box { position: relative; margin-top: 0.39rem; } .hotel-part-four .meeting-box .swiper-container .swiper-slide img { display: block; width: 100%; } .hotel-part-four .meeting-box .swiper-container .swiper-slide .title { position: absolute; bottom: 0.3rem; left: 0.3rem; font-size: 0.3rem; font-weight: bold; color: #fff; } .hotel-part-four .meeting-box .swiper-container .swiper-button-next, .hotel-part-four .meeting-box .swiper-container .swiper-button-prev { top: 48%; width: 0.42rem; height: 0.72rem; background-size: 0.4rem 0.7rem; outline: 0; } .hotel-part-four .meeting-box .swiper-container .swiper-button-next { right: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-four .meeting-box .swiper-container .swiper-button-prev { left: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-four .meeting-box .meeting-info-right { width: 100%; padding-top: 15px; padding: 0.49rem 0.39rem; background: rgba(21, 43, 73, 0.9); } .hotel-part-four .meeting-box .meeting-info-right .content-item { display: none; } .hotel-part-four .meeting-box .meeting-info-right .content-item .title { display: block; margin-bottom: 0.2rem; font-size: 0.3rem; line-height: 0.34rem; color: #b3906a; } .hotel-part-four .meeting-box .meeting-info-right .content-item .line { display: block; width: 100%; height: 1px; margin: 0.49rem 0; background-color: rgba(255, 255, 255, 0.2); } .hotel-part-four .meeting-box .meeting-info-right .content-item p { font-size: 0.24rem; line-height: 0.4rem; color: #b3906a; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .hotel-part-four .meeting-box .meeting-info-right .content-item.show { display: block; } .hotel-part-five { margin-top: 0.82rem; } .hotel-part-five .more-marvellous { margin-top: 0.41rem; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-slide img { display: block; width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-slide video { width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-next, .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-prev { top: 50%; width: 0.52rem; height: 0.72rem; background-size: 0.5rem 0.7rem; outline: 0; } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-next { right: 20px; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-part-five .more-marvellous .swiper-container.gallery-top .swiper-button-prev { left: 20px; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide { opacity: 0.6; } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide img { display: block; width: 100%; } .hotel-part-five .more-marvellous .swiper-container.gallery-thumbs .swiper-slide-thumb-active { opacity: 1; } .hotel-part-six { margin-top: 0.7rem; } .hotel-part-six .service-box .item-row { margin-top: 0.5rem; } .hotel-part-six .service-box .item-row.hide { display: none; } .hotel-part-six .service-box .item-row h2 { font-size: 0.28rem; font-weight: bold; line-height: 0.32rem; color: #B3906A; } .hotel-part-six .service-box .item-row > ul { display: flex; flex-wrap: wrap; margin-top: 0.25rem; } .hotel-part-six .service-box .item-row > ul > li { display: flex; align-items: center; width: 50%; margin-right: 0; margin-top: 0.12rem; } .hotel-part-six .service-box .item-row > ul > li.mr-0 { margin-right: 0; } .hotel-part-six .service-box .item-row > ul > li img { width: 0.5rem; height: 0.5rem; } .hotel-part-six .service-box .item-row > ul > li span { flex: 1; padding-left: 0.09rem; padding-right: 0.1rem; font-size: 0.24rem; line-height: 0.4rem; color: #B3906A; } .hotel-part-six .open-more-box { display: flex; justify-content: center; align-items: center; flex-direction: column; margin-top: 0.5rem; } .hotel-part-six .open-more-box a { font-size: 0.24rem; line-height: 0.32rem; color: #B3906A; opacity: 0.5; } .hotel-part-six .open-more-box img { display: block; margin-top: 0.08rem; width: 0.2rem; height: 0.1rem; cursor: pointer; } .hotel-part-seven { position: relative; margin-top: 0.7rem; margin-bottom: -0.55rem; min-width: 100%; } .hotel-part-seven .map-container { width: 100%; height: 4rem; } .hotel-part-seven .tagging-icon { width: 34px; height: 47px; background-image: url(/static/cn/images/hotel/tagging-icon1.png); background-repeat: no-repeat; background-position: center; background-size: 32px 45px; } .hotel-part-seven .info-box { position: unset; top: 0; right: 0; width: 100%; padding: 0.39rem 0.5rem; background: none; } .hotel-part-seven .info-box .title { font-size: 0.3rem; line-height: 0.32rem; color: #B3906A; } .hotel-part-seven .info-box .position-info { margin-top: 0.3rem; font-size: 0.24rem; line-height: 0.4rem; color: rgba(179, 144, 106, 0.6); } .hotel-part-seven .info-box .trip-list { margin-top: 0.5rem; } .hotel-part-seven .info-box .trip-list li { display: flex; margin-top: 0.24rem; } .hotel-part-seven .info-box .trip-list li img { display: block; width: 0.37rem; height: 0.37rem; } .hotel-part-seven .info-box .trip-list li h4 { padding-left: 0.2rem; font-size: 0.24rem; line-height: 0.3rem; color: #B3906A; opacity: 0.8; } .hotel-part-seven .info-box .bottom-text { margin-top: 0.49rem; } .hotel-part-seven .info-box .bottom-text p { font-size: 0.24rem; line-height: 0.4rem; color: #B3906A; opacity: 0.8; } .footer { margin-top: 0.55rem; padding-top: 0.67rem; padding-bottom: 0.62rem; width: 100%; height: auto; background-color: #05162c; } .footer .content-box { display: flex; justify-content: space-between; flex-direction: column; } .footer .content-box .left { width: 100%; } .footer .content-box .left .title { padding: 0 0.12rem; font-size: 0.36rem; line-height: 0.4rem; font-weight: bold; color: #b3906a; } .footer .content-box .left .info-group { margin-top: 0.4rem; padding: 0 0.12rem; } .footer .content-box .left .info-group .info-row { width: 100%; display: flex; flex-direction: column; } .footer .content-box .left .info-group .info-row + .info-row { margin-top: 0; } .footer .content-box .left .info-group .info-row .info { width: 100%; display: flex; align-items: center; margin: 0.1rem 0; } .footer .content-box .left .info-group .info-row .info h4 { font-size: 0.24rem; line-height: 0.36rem; color: #b3906a; } .footer .content-box .left .info-group .info-row .info h5 { font-size: 0.24rem; line-height: 0.36rem; color: #b3906a; } .footer .content-box .left .info-group .info-row .info a { font-size: 0.24rem; line-height: 0.36rem; color: #b3906a; } .footer .content-box .left .info-group .info-row .info a:hover { text-decoration: underline; } .footer .content-box .left .info-group .info-row .info .gf-icon { display: block; margin-left: 0.2rem; width: 0.32rem; height: 0.32rem; background-repeat: no-repeat; background-position: center center; background-size: 0.31rem auto; cursor: pointer; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wx img { top: 0.2rem; left: -1.15rem; } .footer .content-box .left .info-group .info-row .info .gf-icon.icon-wb { background-image: url(/static/cn/images/hotel/footer_wb_icon.png); } .footer .content-box .left .logo-list { display: flex; flex-wrap: wrap; margin-top: 0.5rem; } .footer .content-box .left .logo-list li { display: flex; align-items: center; justify-content: center; margin-right: 0.26rem; margin-bottom: 0.3rem; width: 0.9rem; } .footer .content-box .left .logo-list li img { width: 100%; } .footer .content-box .right { width: 100%; margin-top: 0.5rem; } .footer .content-box .right img { width: 100%; } .footer p { margin-top: 0.66rem; text-align: center; font-size: 0.2rem; line-height: 0.26rem; color: #999; opacity: 0.5; } .hotel-room-frame { position: fixed; top: 35%; left: 0; width: 100%; z-index: 999999999; } .hotel-room-frame .swiper-container .swiper-button-next, .hotel-room-frame .swiper-container .swiper-button-prev { top: 48%; width: 0.48rem; height: 0.67rem; background-size: 0.48rem 0.67rem; } .hotel-room-frame .swiper-container .swiper-button-next { right: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_next_icon.png); } .hotel-room-frame .swiper-container .swiper-button-prev { left: 0.2rem; background-image: url(/static/cn/images/hotel/introduction_prev_icon.png); } .hotel-room-frame .guest-room-box { display: flex; flex-wrap: wrap; padding: 0.2rem 0.2rem; width: 100%; min-width: 2rem; background-color: #05162C; } .hotel-room-frame .guest-room-box h2 { margin-right: 0.2rem; font-size: 0.16rem; line-height: 0.4rem; color: #b3906a; } }