@charset "utf-8";
	
:root{
	--calc:0.75;
	--calc2:0.95;
	--calc3:0.95;
}
* {
	margin: 0;
	padding: 0;
}
li {
	list-style: none;
}
.both {
	clear: both;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
	border: 0;
}
a {
	text-decoration: none;
	cursor: pointer;
}
select, input, textarea {
	-webkit-appearance: none;
	border-radius: 0;
}
select option {
  background-color: #000; /* 设置选项背景颜色 */
}
input::-webkit-input-placeholder {
 color: #fff;
}
input::-moz-placeholder {
 color: #fff;
}
input:-moz-placeholder {
 color: #fff;
}
input:-ms-input-placeholder {
 color: #fff;
}
input[type=number] {
	-moz-appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
 -webkit-appearance: none;
}
body {
	font-size: 0.24rem;
	-webkit-text-size-adjust: none;
	background: #fff;
	color: #000;
}
body a {
	-webkit-transition: all .3s;
	transition: all .3s;
}
.main {
	position: relative;
	margin: 0 auto;
	overflow: hidden;
	max-width: 1900px;
	min-width: 320px;
}
.pc-bg {
    height: 100%;
    width: 100%;
    max-width: 1920px;
    position: fixed;
    left: 0;
    z-index: 0;
    background: url(../images/bg.jpg) top / cover no-repeat;
    /* background-size: 19.2rem 10.8rem; */
}
.wrapper {
	margin: 0 auto;
	position: relative;
	width: 7.5rem;
}
.container1 {
	height: 13.2rem;
	background: url(../images/bg1.jpg) no-repeat center top;
	background-size: 7.5rem 13.2rem;
}
.container2 {
	margin: 0 auto;
	width: 7.5rem;
	overflow: hidden;
	margin-top: -0.02rem;
	height: 16.49rem;
	background: url(../images/bg2.jpg) no-repeat center top;
	background-size: 7.5rem 16.49rem;
}
.container3 {
	margin: 0 auto;
	overflow: hidden;
	margin-top: -0.02rem;
	height: 12.49rem;
	background: url(../images/bg3.jpg) no-repeat center top;
	background-size: 7.5rem 12.49rem;
}
.container4 {
	margin: 0 auto;
	overflow: hidden;
	margin-top: -0.02rem;
	height: 13.43rem;
	background: url(../images/bg4.jpg) no-repeat center top;
	background-size: 7.5rem 13.43rem;
}
.container5 {
	margin: 0 auto;
	overflow: hidden;
	margin-top: -0.02rem;
	height: 12.36rem;
	background: url(../images/bg5.jpg) no-repeat center top;
	background-size: 7.5rem 12.36rem;
}
.container6 {
	margin: 0 auto;
	overflow: hidden;
	margin-top: -0.02rem;
	height: 10.67rem;
	background: url(../images/bg6.jpg) no-repeat center top;
	background-size: 7.5rem 10.67rem;
}
.wrap {
	position: relative;
	z-index: 99;
	margin: 0 auto;
	width: 7.5rem;
}
.floattop{
	position: fixed;
	top: 0;
	z-index: 999;
	width: 7.5rem;
	height: 1.06rem;
	background: url(../images/floattop_bg.png) no-repeat;
	background-size: 7.5rem 1.06rem;
}
.logo{
	float: left;
	margin-left: .2rem;
	margin-top: .07rem;
	width: 1.79rem;
	height: .91rem;
	background: url(../images/logo.png) no-repeat;
	background-size: 1.79rem .91rem;
}
.btn-top-news{
	float: left;
	margin-left: 1.5rem;
	margin-top: .25rem;
	width: 1.81rem;
	height: .53rem;
	background: url(../images/btn_top_news.png) no-repeat;
	background-size: 1.81rem .53rem;
}
.btn-top-search{
	float: left;
	margin-left: .1rem;
	margin-top: .25rem;
	width: 1.81rem;
	height: .53rem;
	background: url(../images/btn_top_search.png) no-repeat;
	background-size: 1.81rem .53rem;
}
.kv-reservation{
	position: absolute;
	top: 10.7rem;
	left: .9rem;
	width: 6.01rem;
	height: 2.05rem;
	background: url(../images/kv_reservation.png) no-repeat;
	background-size: 6.01rem 2.05rem;
	-webkit-animation: magnify .6s linear infinite alternate;
	-moz-animation: magnify .6s linear infinite alternate;
	animation: magnify .6s linear infinite alternate;
}
.kv-reservation2{
	position: absolute;
	top: 10.7rem;
	left: .9rem;
	width: 6.01rem;
	height: 2.05rem;
	background: url(../images/kv_reservation2.png) no-repeat;
	background-size: 6.01rem 2.05rem;
	-webkit-animation: magnify .6s linear infinite alternate;
	-moz-animation: magnify .6s linear infinite alternate;
	animation: magnify .6s linear infinite alternate;
}
.gift-num{
	position: absolute;
	top: 10.1rem;
	left: 1.7rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	width: 4.36rem;
	height: .4rem;
	background: url(../images/kv_numbg.png) no-repeat;
	background-size: 4.36rem .4rem;
}
.num{
	font-size: .26rem;
	font-weight: bold;
	color: #feef32;
}
.title1{
	margin: 0 auto;
	margin-top: 1.18rem;
	width: 6.18rem;
	height: 1.14rem;
	background: url(../images/title1.png) no-repeat;
	background-size: 6.18rem 1.14rem;
}
.title2{
	margin: 0 auto;
	margin-top: .6rem;
	width: 6.36rem;
	height: 1.18rem;
	background: url(../images/title2.png) no-repeat;
	background-size: 6.36rem 1.18rem;
}
.title3{
	margin: 0 auto;
	margin-top: .9rem;
	width: 6.34rem;
	height: .96rem;
	background: url(../images/title3.png) no-repeat;
	background-size: 6.34rem .96rem;
}
.title4{
	margin: 0 auto;
	margin-top: .8rem;
	width: 6.36rem;
	height: 1.18rem;
	background: url(../images/title4.png) no-repeat;
	background-size: 6.36rem 1.18rem;
}
.title5{
	margin: 0 auto;
	margin-top: .7rem;
	width: 6.34rem;
	height: 1.14rem;
	background: url(../images/title5.png) no-repeat;
	background-size: 6.34rem 1.14rem;
}
/*part2 预约 */
.reservation-box {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-top: 1.2rem;
}
.step1{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.step1-t{
	width: 5.53rem;
	height: .45rem;
	background: url(../images/p2_step1.png) no-repeat;
	background-size: 5.53rem .45rem;
}
.info-box {
    display: flex;
	align-items: center;
	margin-top: .2rem;
	width: 6.06rem;
	height: .7rem;
	background: url(../images/info_boxbg.png) no-repeat;
	background-size: 6.06rem .7rem;
}
.area {
    float: left;
	margin-left: .85rem;
    padding-left: 0.1rem;
    width: 1.71rem;
    height: 0.6rem;
    /* background: url(../images/area.png) no-repeat right;
	background-size: .41rem 0.32rem; */
	background-color: #f3f7fa00;
    border: none;
	border-radius: .1rem;
    outline: medium;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    font-size: 0.2rem;
    color: #fff;
}
.input-in {
    display: inline;
    outline: none;
	border: none;
	margin-left: .1rem;
    padding-left: 0.05rem;
    padding-right: 0.05rem;
    width: 2.6rem;
    height: 0.6rem;
    line-height: 0.5rem;
    font-size: 0.2rem;
    /* text-align: center; */
    color: #fff;
	background-color: #f3f7fa00;
}
.pop-info-box {
    display: flex;
	align-items: center;
    margin-top: 0.02rem;
	margin-left: .3rem;
    width: 4.2rem;
	height: .5rem;
	background-color: #362813;
	border: 1px solid #362813;
	border-radius: .1rem;
}
.pop-area {
    float: left;
    padding-left: 0.1rem;
    width: 2rem;
    height: 0.2rem;
    background: #362813 url(../images/area.png) no-repeat right;
	background-size: .25rem 0.21rem;
    border: none;
	border-radius: .1rem;
    outline: medium;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    font-size: 0.14rem;
    color: #fff;
    
}
.pop-input-in {
    display: inline;
    outline: none;
	border: none;
	margin-left: .1rem;
    padding-left: 0.05rem;
    padding-right: 0.05rem;
    width: 3rem;
    height: 0.35rem;
    line-height: 0.52rem;
    font-size: 0.16rem;
    /* text-align: center; */
	/* background-color: #fff; */
	border-radius: .1rem;
    color: #fff;
	background-color: #362813;
}
.btn-reservation {
	float: left;
	margin-top: .02rem;
	width: 5.21rem;
	height: 1.79rem;
	background: url(../images/btn_reservation.png) no-repeat;
	background-size: 5.21rem 1.79rem;
	-webkit-animation: magnify .6s linear infinite alternate;
	-moz-animation: magnify .6s linear infinite alternate;
	animation: magnify .6s linear infinite alternate;
}
.btn-reservation2{
	float: left;
	margin-left: .1rem;
	margin-top: -.1rem;
	width: 5.21rem;
	height: 1.79rem;
	background: url(../images/btn_reservation2.png) no-repeat;
	background-size: 5.21rem 1.79rem;
	-webkit-animation: magnify .6s linear infinite alternate;
	-moz-animation: magnify .6s linear infinite alternate;
	animation: magnify .6s linear infinite alternate;
}
.step2{
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	margin-top: .1rem;
}
.step2-t{
	width: 6.21rem;
	height: .46rem;
	background: url(../images/p2_step2.png) no-repeat;
	background-size: 6.21rem .46rem;
}
.step2-gift{
	margin: 0 auto;
	margin-top: .2rem;
	width: 6.03rem;
	height: 1.82rem;
	background: url(../images/p2_step2_gift.png) no-repeat;
	background-size: 6.03rem 1.82rem;
}
.store-box {
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: .3rem;
}
.btn-gp {
	margin-left: .1rem;
	margin-right: .1rem;
	width:calc(2.27rem*1);
	height:calc(0.7rem*1);
	background: url(../images/btn_gp.png) no-repeat;
	background-size: calc(2.27rem*1) calc(0.7rem*1);
}
.btn-ios {
	margin-left: .1rem;
	margin-right: .1rem;
	width:calc(2.27rem*1);
	height:calc(0.7rem*1);
	background: url(../images/btn_ios.png) no-repeat;
	background-size: calc(2.27rem*1) calc(0.7rem*1);
}
.hover{
	/* margin-top: -.2rem;
	margin-left: -.1rem;
	width: calc(2.78rem*1.1);
	height:calc(1.32rem*1.1);
	background: url(../images/hover.png) no-repeat;
	background-size:calc(2.78rem*1.1) calc(1.32rem*1.1); */
}
.btn-ios span, .btn-gp span {
	float: left;
	position: relative;
	border-radius: 0.1rem;
	display: inline;
	overflow: hidden;
	width:calc(2.27rem*1);
	height:calc(0.7rem*1);
}
.btn-ios span .effect, .btn-gp span .effect {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: linear-gradient( 90deg, transparent, transparent, rgba(247, 194, 3, 0.886), transparent, transparent );
	background-size: 100%;
	transition: all 650ms;
	-webkit-animation: sg 2s linear infinite;
	-moz-animation: sg 2s linear infinite;
	-ms-animation: sg 2s linear infinite;
	animation: sg 2s linear infinite;
}
.step3{
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: .5rem;
}
.step3-t{
	width: 5.22rem;
	height: .44rem;
	background: url(../images/p2_step3.png) no-repeat;
	background-size: 5.22rem .44rem;
}
.step3-gift{
	margin-top: .1rem;
	width: 6.06rem;
	height: 1.92rem;
	background: url(../images/p2_step3_gift.png) no-repeat;
	background-size: 6.06rem 1.92rem;
	/* -webkit-animation: shake .8s linear infinite alternate;
    -moz-animation: shake .8s linear infinite alternate;
    animation: shake .8s linear infinite alternate; */
}
.step3-btn{
	width: 100%;
	margin-top: .2rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.step3-fb{
	width:calc(2.45rem*1);
	height:calc(.85rem*1);
	background: url(../images/step3_fb.png) no-repeat;
	background-size: calc(2.45rem*1) calc(.85rem*1);
}
.step3-group{
	width:calc(2.45rem*1);
	height:calc(.85rem*1);
	background: url(../images/step3_group.png) no-repeat;
	background-size: calc(2.45rem*1) calc(.85rem*1);
}
/*part3 抽奖 */
.draw-giftbox{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 2.8rem;
}
.draw-gift {
	position: relative;
	width: 7.5rem;
}
.draw-container {
	margin: 0 auto;
	overflow: hidden;
	width: 5.2rem;
}
.draw-container .swiper-wrapper .swiper-slide{
	width: 1.71rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
.draw-container img {
	display: block;
	width: 1.71rem;
}
.draw-numbox{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: .65rem;
	margin-bottom: 0rem;
	color: #fff;
}
.draw-num{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: .24rem;
	width: 3.06rem;
	height: .43rem;
}
.draw-num span{
	color: red;
}
.btn-explain{
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: underline;
	cursor: pointer;
	font-size: .24rem;
	width: 3.06rem;
	height: .43rem;
}
.draw-btn{
	margin: 0 auto;
	margin-top: 1rem;
	margin-bottom: .2rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: 86%;
}
.btn-mycards{
	width: 1.6rem;
	height: .63rem;
	background: url(../images/btn_mycards.png) no-repeat;
	background-size: 1.6rem .63rem;
}
.btn-draw{
	width: 2.89rem;
	height: 1.04rem;
	background: url(../images/btn_draw.png) no-repeat;
	background-size: 2.89rem 1.04rem;
	-webkit-animation: magnify .6s linear infinite alternate;
    -moz-animation: magnify .6s linear infinite alternate;
    animation: magnify .6s linear infinite alternate;
}
.btn-add{
	width: 1.6rem;
	height: .63rem;
	background: url(../images/btn_add.png) no-repeat;
	background-size: 1.6rem .63rem;
}
.draw-bide{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: .2rem;
}
.bide1,.bide2,.bide3{
	width: 2.06rem;
	height: 2.29rem;
}
.bide1{
	background: url(../images/bide1.png) no-repeat;
	background-size: 2.06rem 2.29rem;
}
.bide2{
	background: url(../images/bide2.png) no-repeat;
	background-size: 2.06rem 2.29rem;
}
.bide3{
	background: url(../images/bide3.png) no-repeat;
	background-size: 2.06rem 2.29rem;
}
/*part4 游戏角色 */
.role-box{
	float: left;
	position: relative;
	width: 100%;
	height: 100%;
	margin-top: -.2rem;
}
.role-info{
    height: 11.27rem;
	margin: 0 auto;
	overflow: hidden;
}
.role-container.swiper-container{
	height: 100%;
}
.role-prev:after, .swiper-container-rtl .role-next:after {
	content: ''
}
.role-next:after, .swiper-container-rtl .role-prev:after {
	content: ''
}
.role-info .role-next, .role-info .role-prev {
	position: absolute;
	top: 35%;
	margin-top: 0;
	outline: none;
	width: .43rem;
	height: .67rem;
}
.role-info .role-next {
	right: .3rem;
	background: url(../images/pic_next.png) no-repeat;
	background-size: .43rem .67rem;
}
.role-info .role-prev {
	left: .3rem;
	background: url(../images/pic_pre.png) no-repeat;
	background-size: .43rem .67rem;
}
.role-thumbs{
	position: absolute;
	top: 9.4rem;
	right: .2rem;
	z-index: 11;
	overflow: hidden;
	width: 3rem;
}
.role-thumbs .swiper-wrapper{ 
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	width: 3rem;
}
.role-thumbs .swiper-slide{
	width: .95rem !important;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: .1rem;
}
.small-img {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	display: flex;
	align-items: center;
	justify-content: center;
}
.s1 {
	background: url(../images/role1_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.s2 {
	background: url(../images/role2_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.s3 {
	background: url(../images/role3_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.s4 {
	background: url(../images/role4_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.s5 {
	background: url(../images/role5_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.s6 {
	background: url(../images/role6_off.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s1 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role1_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s2 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role2_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s3 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role3_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s4 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role4_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s5 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role5_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role-thumbs .swiper-slide-thumb-active .s6 {
	width: calc(.95rem* var(--calc3));
	height: calc(.89rem*var(--calc3));
	background: url(../images/role6_on.png) no-repeat;
	background-size: calc(.95rem*var(--calc3)) calc(.89rem*var(--calc3));
}
.role {
	width: 7.5rem;
    z-index: 10;
}
.role1 {
    height: 11.27rem;
	background: url(../images/role1.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
.role2 {
	height: 11.27rem;
	background: url(../images/role2.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
.role3 {
   	height: 11.27rem;
	background: url(../images/role3.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
.role4 {
    height: 11.27rem;
	background: url(../images/role4.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
.role5 {
    height: 11.27rem;
	background: url(../images/role5.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
.role6 {
    height: 11.27rem;
	background: url(../images/role6.png) no-repeat;
	background-size: 7.5rem 11.27rem;
}
/* part5 人数达成 */
.gift-box{
	position: relative;
	margin-top: 2.7rem;
	margin-left: .85rem;
	width: 5.37rem;
	height: 5.73rem;
	background: url(../images/gift_box.png) no-repeat;
	background-size: 5.37rem 5.73rem;
}
.btn-more{
	position: absolute;
	cursor: pointer;
	z-index: 10;
}
.btn-more div {
    display: none;
    position: absolute;
    top: .5rem;
	left:0rem;
    width: 1.6rem;
    text-align: center;
    border: 1px solid #112a2f;
    background-color: #141c1ea8;
    color: #fff;
    font-size: .2rem;
    padding: .1rem 0;
    z-index: 10;
}
.m1{
	top: .1rem;
	left: 0.05rem;
	width: 1.6rem;
	height: 2.1rem;
}
.m2{
	top: .1rem;
	left: 1.85rem;
	width: 1.6rem;
	height: 2.1rem;
}
.m3{
	top: .1rem;
	right: .07rem;
	width: 1.6rem;
	height: 2.1rem;
}
.m4{
	top: 3.1rem;
	left: .05rem;
	width: 2.5rem;
	height: 2.6rem;
}
.m5{
	top: 3.1rem;
	right: .07rem;
	width: 2.5rem;
	height: 2.6rem;
}	
.complete {
	position: absolute;
	z-index: 6;
	display: none;
	width: 1.26rem;
	height: 1.23rem;
	background: url(../images/complete.png) no-repeat;
	background-size: 1.26rem 1.23rem;
}
.comp1 {
	top: 1rem;
	left: .7rem;
}
.comp2 {
	top: 1rem;
	left: 2.5rem;
}
.comp3 {
	top: 1rem;
	left: 4.3rem;
}
.comp4 {
	top: 4.3rem;
	left: 1.4rem;
}
.comp5 {
	top: 4.3rem;
	left: 4.2rem;
}
.gift-percent{
	position: absolute;
	top: 2rem;
	right: .35rem;
	width: .51rem;
	height: 6.97rem;
	background: url(../images/gift_percent.png) no-repeat;
	background-size: .51rem 6.97rem;
}
.percent-box{
	position: absolute;
	bottom: 1.21rem;
	margin-left: .117rem;
    width: .24rem;
	height: 5.5rem;
}
.percent {
    position: absolute;
	bottom: 0rem;
    width: .24rem; 
    height: 1%; 
	max-height: 5.5rem;
    border-radius: .2rem;
	border: 1px solid #000;
    overflow: hidden; 
	background-image: linear-gradient(to top, #b77bf2,#8d73e9); 
}
/*part6 游戏商店图 */
.intro {
	position: relative;
	width: 7.5rem;
	margin-top: .3rem;
}
.intro-container {
	margin: 0 auto;
	overflow: hidden;
	width: 6.85rem;
}
.intro-container img {
	display: block;
	width: 6.85rem;
}
.intro .intro-pagination {
	position: absolute;
	left: 0;
	bottom: -0.6rem;
	z-index: 2;
	text-align: center;
	width: 100%;
}
.intro .intro-next, .intro .intro-prev {
	position: absolute;
	top: 48%;
	margin-top: 0;
	outline: none;
	width: 0.43rem;
	height: 0.67rem;
}
.intro .intro-next {
	right: .1rem;
	background: url(../images/pic_next.png) no-repeat;
	background-size: 0.43rem 0.67rem;
}
.intro .intro-prev {
	left: .1rem;
	background: url(../images/pic_pre.png) no-repeat;
	background-size: 0.43rem 0.67rem;
}
.intro .intro-pagination .swiper-pagination-bullet {
	margin-left: 0.1rem;
	margin-right: 0.1rem;
	display: inline-block;
	/* border-radius: 100%;
	width: 0.2rem;
	height: 0.2rem;
	background: transparent; */
	opacity: 1;
	cursor: pointer;
	width: .42rem;
	height: .22rem;
	background: url(../images/introbullet.png) no-repeat;
	background-size: .42rem .22rem;
}
.intro .intro-pagination .swiper-pagination-bullet-active {
	opacity: 1;
	width: .99rem;
	height: .16rem;
	background: url(../images/introbullet_active.png) no-repeat;
	background-size: .99rem .16rem;
	border-radius: 0;
}
.intro-prev:after, .swiper-container-rtl .intro-info .role-next:after {
	content: ''
}
.intro-next:after, .swiper-container-rtl .intro-prev:after {
	content: ''
}
.p7-icon{
	display: flex;
	justify-content: space-around;
	align-items: end;
	margin-top: .9rem;
}
.p7-fb{
	width: 2rem;
	height: .96rem;
	background: url(../images/facebook.png) no-repeat;
	background-size: 2rem .96rem;
}
.p7-groups{
	width: 2rem;
	height: .96rem;
	background: url(../images/groups.png) no-repeat;
	background-size: 2rem .96rem;
}
.p7-explain{
	width: 2rem;
	height: .96rem;
	background: url(../images/explain.png) no-repeat;
	background-size: 2rem .96rem;
}
.p7-footer{
	display: block;
	margin-top: .4rem;
	margin-left: 5.4rem;
	padding-bottom: 1.5rem;
	width: 1.54rem;
	height: .25rem;
	background: url(../images/btn_footer.png) no-repeat;
	background-size: 1.54rem .25rem;
}
.foot1{
    width: .6rem;
	height: 0.6rem;
	background: url(../images/y_logo.jpg) no-repeat;
	background-size: .6rem 0.6rem;
    margin-right: .1rem;
}
.foot2{
	width: .6rem;
	height: 0.6rem;
	background: url(../images/class.png) no-repeat;
	background-size: .6rem .6rem;
}
.foot-left{
    display: flex;
    align-items: center;
	justify-content: center;
    margin-bottom: .1rem;
}
/* 版權*/
.footer {
	display: none;
	margin: 0 auto;
	padding-top: 0.2rem;
	padding-bottom: 1.7rem;
	position: relative;
	overflow: hidden;
	width: 7.5rem;
	background: #383838;
	color: #fff;
}
.footer-wrap {
	margin: 0 auto;
	width: 7.5rem;
	font-size: 0.18rem;
	text-align: center;
}
.footer-rule p {
	line-height: 0.3rem;
}
.footer-rule p a{
	color: #fff;
}


.pop4 {
	position: relative;
	display: none;
	width: calc(6.41rem* var(--calc));
	height: calc(9.44rem*var(--calc));
	background: url(../images/pop4.png) no-repeat;
	background-size:calc(6.41rem* var(--calc)) calc(9.44rem*var(--calc));
}
.pop5{
	position: relative;
	display: none;
	width: 7rem;
	height: 7.3rem;
}
.pop6{
	position: relative;
	display: none;
	width: calc(6.7rem* var(--calc));
	height: calc(8.76rem*var(--calc));
	background: url(../images/pop_cards.png) no-repeat;
	background-size:calc(6.7rem* var(--calc)) calc(8.76rem*var(--calc));
}
.pop7{
	position: relative;
	display: none;
	width: 6.41rem;
	height: 6.94rem;
	background: url(../images/pop7.png) no-repeat;
	background-size: 6.41rem 6.94rem;
}
.pop8{
	position: relative;
	display: none;
}
.pop12{
	position: relative;
	display: none;
	width: calc(6.88rem* 1.1);
	height: calc(6.21rem*1.1);
	background: url(../images/pop12.png) no-repeat;
	background-size:calc(6.88rem* 1.1) calc(6.21rem*1.1);
}
.pop13{
	position: relative;
	display: none;
	width: calc(6.41rem* var(--calc));
	height: calc(10.14rem*var(--calc));
	background: url(../images/pop13.png) no-repeat;
	background-size:calc(6.41rem* var(--calc)) calc(10.14rem*var(--calc));
}
.pop18{
	position: relative;
	display: none;
	width: 6.41rem;
	height: 8.24rem;
	background: url(../images/pop18.png) no-repeat;
	background-size: 6.41rem 8.24rem;
}
.pop19{
	position: relative;
	display: none;
	width: calc(7.5rem*0.7);
	height: calc(13.11rem*0.7);
	background: url(../images/pop19.png) no-repeat;
	background-size: calc(7.5rem*0.7) calc(13.11rem*0.7);
}
.pop20{
	position: relative;
	display: none;
	width: calc(7.5rem*0.85);
	height: calc(9.17rem*0.85);
	background: url(../images/pop20.png) no-repeat;
	background-size: calc(7.5rem*0.85) calc(9.17rem*0.85);
}
.pop_msg{
	position: relative;
	display: none;
	width: 6.41rem;
	height: 3.67rem;
	width: calc(6.41rem*0.7);
	height: calc(3.67rem*0.7);
	background: url(../images/pop_msg.png) no-repeat;
	background-size: calc(6.41rem*0.7) calc(3.67rem*0.7);
}
.pop-fb{
	position: absolute;
	top: 5.6rem;
	left: 1.95rem;
	width: calc(3.73rem* 1);
	height: calc(.96rem*1);
	background: url(../images/pop_fb.png) no-repeat;
	background-size:calc(3.73rem* 1) calc(.96rem*1);
}
.close {
	position: absolute;
	left: 48%;
	bottom: -0.4rem;
	z-index: 2;
	width: 0.3rem;
	height: 0.3rem;
	background: url(../images/close.png) no-repeat;
	background-size: 0.3rem 0.3rem;
}
.close-r {
	position: absolute;
	right: 0rem;
	top: 0.2rem;
	z-index: 2;
	width: 0.3rem;
	height: 0.3rem;
	background: url(../images/close.png) no-repeat;
	background-size: 0.3rem 0.3rem;
}
.add-box{
	position: absolute;
	top: .45rem;
	left: .25rem;
	display: flex;
	flex-direction: column;
}
.rw1,.rw2,.rw3,.rw4{
    position: relative;
	margin-bottom: .1rem;
	width: calc(5.61rem* var(--calc));
	height: calc(1.06rem* var(--calc));
}
.rw1{
	background: url(../images/rw1.png) no-repeat;
	background-size: calc(5.61rem* var(--calc)) calc(1.06rem* var(--calc));
}
.rw2{
	background: url(../images/rw2.png) no-repeat;
	background-size: calc(5.61rem* var(--calc)) calc(1.06rem* var(--calc));
}
.rw3{
	background: url(../images/rw3.png) no-repeat;
	background-size: calc(5.61rem* var(--calc)) calc(1.06rem* var(--calc));
}
.rw4{
	background: url(../images/rw4.png) no-repeat;
	background-size: calc(5.61rem* var(--calc)) calc(1.06rem* var(--calc));
}
.rw5{
	position: relative;
	margin-bottom: .1rem;
	width: calc(5.61rem* var(--calc));
	height: calc(3.35rem* var(--calc));
	background: url(../images/rw5.png) no-repeat;
	background-size: calc(5.61rem* var(--calc)) calc(3.35rem* var(--calc));
}
.task{
	display: none;
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/task.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.add-login{
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/add_login.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.add-share{
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/add_share.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.add-like{
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/add_like.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.add-jion{
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/add_jion.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.add-invite,.add-collect{
	display: flex;
	justify-content: center;
	font-family: serif;
	font-size: .2rem;
	line-height: calc(.6rem* var(--calc));
	font-weight: bold;
	color: #fff;
	position: absolute;
	right: .1rem;
	top: .15rem;
	width: calc(1.88rem* var(--calc));
	height: calc(.63rem* var(--calc));
	background: url(../images/add_ever.png) no-repeat;
	background-size: calc(1.88rem* var(--calc)) calc(.63rem* var(--calc));
}
.r-icon{
	margin: 0 auto;
	margin-top: .7rem;
}
.rw5-n0{
	width: calc(5.5rem* var(--calc));
	height: calc(1.94rem* var(--calc));
	background: url(../images/rw5_0.png) no-repeat;
	background-size: calc(5.5rem* var(--calc)) calc(1.94rem* var(--calc));
}
.rw5-n1{
	width: calc(5.5rem* var(--calc));
	height: calc(1.94rem* var(--calc));
	background: url(../images/rw5_1.png) no-repeat;
	background-size: calc(5.5rem* var(--calc)) calc(1.94rem* var(--calc));
}
.rw5-n2{
	width: calc(5.5rem* var(--calc));
	height: calc(1.94rem* var(--calc));
	background: url(../images/rw5_2.png) no-repeat;
	background-size: calc(5.5rem* var(--calc)) calc(1.94rem* var(--calc));
}
.rw5-n3{
	width: calc(5.5rem* var(--calc));
	height: calc(1.94rem* var(--calc));
	background: url(../images/rw5_3.png) no-repeat;
	background-size: calc(5.5rem* var(--calc)) calc(1.94rem* var(--calc));
}
.rw5-t{
	margin-left: 1rem;
	margin-top: .05rem;
	width: calc(3.35rem* var(--calc));
	height: calc(.23rem* var(--calc));
	background: url(../images/rw5_t.png) no-repeat;
	background-size: calc(3.35rem* var(--calc)) calc(.23rem* var(--calc));
}
/* .r6-n1,.r6-n2,.r6-n3,.r6-n4,.r6-n5{
	width: calc(.89rem* var(--calc));
	height: calc(.89rem* var(--calc));
}
.r6-n1{
	background: url(../images/r6_n1_off.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n2{
	background: url(../images/r6_n2_off.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n3{
	background: url(../images/r6_n3_off.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n4{
	background: url(../images/r6_n4_off.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n5{
	background: url(../images/r6_n5_off.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n1-on,.r6-n2-on,.r6-n3-on,.r6-n4-on,.r6-n5-on{
	width: calc(.89rem* var(--calc));
	height: calc(.89rem* var(--calc));
}
.r6-n1-on{
	background: url(../images/r6_n1.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n2-on{
	background: url(../images/r6_n2.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n3-on{
	background: url(../images/r6_n3.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n4-on{
	background: url(../images/r6_n4.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r6-n5-on{
	background: url(../images/r6_n5.png) no-repeat;
	background-size:  calc(.89rem* var(--calc)) calc(.89rem* var(--calc));
}
.r-icon2{
	margin: 0 auto;
	margin-top: .88rem;
	width: 4rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
} */
.btn-pop-reservation {
	margin: 0 auto;
	margin-left: .15rem;
	display: block;
	width: calc(6.05rem* var(--calc));
	height: calc(2.42rem* var(--calc));
	background: url(../images/btn_pop_reservation.png) no-repeat;
	background-size: calc(6.05rem* var(--calc)) calc(2.42rem* var(--calc));
	-webkit-animation: magnify .8s linear infinite alternate;
    -moz-animation: magnify .8s linear infinite alternate;
    animation: magnify .8s linear infinite alternate;
}
.pop-info{
	position: absolute;
	top: 4.2rem;
	left: .2rem;
}
.waring-box{
	position: absolute;
	top: 3.7rem;
	left: .5rem;
	width: 4rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: .2rem;
	color: #fdce6f;
}
.waring-t span{
	color: #f55909;
	width: .4rem;
	text-align: center;
	display: inline-block;
}
.waring{
	width: calc(.35rem* var(--calc));
	height: calc(.35rem* var(--calc));
	background: url(../images/waring.png) no-repeat;
	background-size: calc(.35rem* var(--calc)) calc(.35rem* var(--calc));
}
.pop-countdown{
	position: absolute;
	left: 2.3rem;
	top: 4.1rem;
	font-size: .22rem;
	font-family: system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Helvetica,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol;;
	width: 1.7rem;
	height: .44rem;
	color: #fff;
}
.pop-countdown .pop-hour{
	position: absolute;
	top: .09rem;
	left: .15rem;
}
.pop-countdown .pop-minute{
	position: absolute;
	top: .09rem;
	left: .74rem;
}
.pop-countdown .pop-second{
	position: absolute;
	top: .09rem;
	left: 1.31rem;
}
.em {
	text-indent: 1em;
	padding-bottom: 0.2rem;
}
.pop-store{
	position: absolute;
	top: 3.9rem;
	left: .6rem;
	width: 4rem;
	display: flex;
	align-items: center;
	justify-content: space-around;
}
.btn-pop-ios,.btn-pop-ios2 {
	width: calc(3.42rem* var(--calc));
	height: calc(1.23rem* var(--calc));
	background: url(../images/pop_ios.png) no-repeat;
	background-size: calc(3.42rem* var(--calc)) calc(1.23rem* var(--calc));
}
.btn-pop-gp,.btn-pop-gp2 {
	width: calc(3.42rem* var(--calc));
	height: calc(1.23rem* var(--calc));
	background: url(../images/pop_gp.png) no-repeat;
	background-size: calc(3.42rem* var(--calc)) calc(1.23rem* var(--calc));
}
.btn-pop-ios span, .btn-pop-gp span,.btn-pop-ios2 span, .btn-pop-gp2 span {
	float: left;
	position: relative;
	margin-left: 0.15rem;
	margin-top: 0.16rem;
	border-radius: 0.04rem;
	display: inline;
	overflow: hidden;
	width: calc(3.18rem* var(--calc));
	height: calc(1rem* var(--calc));
}
.btn-pop-ios span .effect, .btn-pop-gp span .effect,.btn-pop-ios2 span .effect, .btn-pop-gp2 span .effect {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: linear-gradient( 90deg, transparent, transparent, rgba(247, 194, 3, 0.886), transparent, transparent );
    background-size: 100%;
	transition: all 650ms;
	-webkit-animation: sg 2s linear infinite;
	-moz-animation: sg 2s linear infinite;
	-ms-animation: sg 2s linear infinite;
	animation: sg 2s linear infinite;
}
.pop-cont1{
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.pop-cont1 img{
	width: 6.84rem;
	/* height: 5.36rem; */
}
.pop-cont2{
	margin: 0 auto;
	color: #fff;
	width: 85%;
	max-height: 5.8rem;
	overflow: hidden;
	overflow-y: auto;
	margin-top: 1.2rem;
	font-size: 0.18rem;
	line-height: .28rem;
}
.pop-cont3{
	color: #fff;
	width: 90%;
	height: calc(3.67rem*.7);
	margin: 0 auto;
	font-size: 0.24rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.pop-cont4{
	width: 5.1rem;
	height: 6.6rem;
	margin: 0 auto;
	margin-top: .6rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	overflow-y: auto;
    overflow-x: hidden;
}
.cards-box{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
	margin-top: 1.1rem;
}
.cards-box div{
	width: calc(2.09rem* .7);
	height: calc(2.15rem* .7);
	margin: .05rem .05rem;
}
.card_item_1{
	background: url(../images/card_item_1.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_2{
	background: url(../images/card_item_2.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_3{
	background: url(../images/card_item_3.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_4{
	background: url(../images/card_item_4.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_5{
	background: url(../images/card_item_5.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_6{
	background: url(../images/card_item_6.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_7{
	background: url(../images/card_item_7.png) no-repeat center;
	background-size: 100% 100%;
}
.card_item_8{
	background: url(../images/card_item_8.png) no-repeat center;
	background-size: 100% 100%;
}
.copy-link{
	opacity: 0;
}
.mask {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: #000;
	filter: alpha(opacity=0.7);
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
}
.floatbottom {
	position: fixed;
	bottom: 0;
	/* left: 5.85rem; */
	z-index: 999;
	width: 7.5rem;
	height: .99rem;
	background: url(../images/floatbottom.png) no-repeat center top;
	background-size: 7.5rem .99rem;
}
.floatimg {
	position: absolute;
	top: -.75rem;
	left: 0rem;
	z-index: 999;
	width: 4.68rem;
	height: 1.76rem;
}
.gift-img {
	position: absolute;
	left: 0rem;
	top: 0rem;
	width: 100%;
}
.gift-img img {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	opacity: 0;
	width: 4.68rem;
}
.gift-img img:first-of-type {
	opacity: 1;
}
.btn-nav-reversation{
	float: right;
	margin-top: .2rem;
	margin-right: .4rem;
	left: .1rem;
	width: 2.32rem;
	height: 0.67rem;
	background: url(../images/btn_bottom.png) no-repeat;
	background-size: 2.32rem 0.67rem;
}
.record-box {
	margin: 0 auto;
	/* margin-top: 0.3rem;
	margin-bottom: 0.2rem; */
	width:7rem;
	font-size: 0.2rem;
	max-height: 10rem;
	overflow: hidden;
	overflow-y: auto;
}
.record-box table {
	margin: 0 auto;
	width: 100%;
	text-align: center;
}
.record-box table td {
	height: .5rem;
	padding: .01rem;
	border: 1px solid #42618f;
	line-height: .3rem;
	word-break: break-all;
	word-wrap: break-word;
	background: #fff;
	color: #7b8ab3;
}
.record-box table th {
	padding: .1rem;
	border: 1px solid #42618f;
	line-height: .3rem;
	font-weight: normal;
	background: #004e90;
	color: #fff;
}
.record-box table th.t-bg1 {
	background: #004e90;
}
.record-box table td.t-bg2 {
	background: #fff;
}
.record-box table td.t-bg2 a{
	text-decoration: underline;
	color: #7b8ab3;
}
.record-title{
	margin: 0 auto;
	margin-top: .1rem;
	width: 3.43rem;
	height: 1.11rem;
	background: url(../images/record_title.png) no-repeat;
	background-size: 3.43rem 1.11rem;
}
.record-list{
	width: 86%;
	margin: 0 auto;
	margin-top: .1rem;
	max-height: 6.6rem;
	overflow: hidden;
	overflow-y: scroll;
}
.record-list ul li{
	display: flex;
	align-items: center;
	margin-bottom: .15rem;
	padding: 0 .1rem;
	font-size: .18rem;
}
.record-list ul li div:nth-child(1){
	width: 50%;
	height: .8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border: 1px solid #110e0b73;
	background: #110e0b73;
	overflow: hidden;
	padding: 0 .1rem;
	color: #fff;
}
.record-list ul li div:nth-child(2){
	width: 30%;
	height: .8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border: 1px solid #110e0b73;
	background: #110e0b73;
	overflow: hidden;
	margin-left: .1rem;
	margin-right: .1rem;
	padding: 0 .1rem;
	color: #fff;
}
.record-list ul li div:nth-child(3){
	width: 20%;
	text-align: center;
}
.record-list ul li div:nth-child(3) a{
	/* text-decoration: underline; */
	color: #fff;
}
.btn-copy{
	text-decoration: underline;
	color: #7b8ab3;
}
.isget{
	width: 1rem;
	height: .6rem;
	border-radius: .1rem;
	background: #03387d;
	display: flex;
	justify-content: center;
	align-items: center;
}
.todo{
	width: 1rem;
	height: .6rem;
	border-radius: .1rem;
	background: #881a02;
	display: flex;
	justify-content: center;
	align-items: center;
}
.scroll-w{
	position: absolute;
	top: 2rem;
	left: .89rem;
	width: 75%;
	height: .6rem;
	overflow: hidden;
}
.infinite-scroll {
    z-index: 99;
    top: 0rem;
    left: 0;
    display: flex;
    align-items: center;
    position: absolute;
    transform: translate(0);
    animation: infinite-scroll 100s linear;
    animation-iteration-count: infinite;
}
.infinite-scroll div{
    position: relative;
    padding: 0.1333333rem 0.2666667rem;
    margin: 0 0.1rem;
    /* background: #00000030; */
    border-radius: 0.2266667rem;
    font-size: .2666667rem;
    font-family: SourceHanSans-Regular;
    font-weight: 400;
    color: #fff;
    white-space: nowrap;
}
.infinite-scroll div span:nth-child(1){
    color: #f55909;
}
.infinite-scroll div span:nth-child(2){
    color: #fdce6f;
}
.infinite-scroll div:nth-child(odd){
    top: 0rem;
}
.infinite-scroll div:nth-child(2n){
    top: 0rem;
}
.scroll2-w{
	position: absolute;
	left: .58rem;
	top: 4.48rem;
	width: 4rem;
	height: .48rem;
	overflow: hidden;
}
.infinite-scroll2 {
    z-index: 99;
    top: 0rem;
    left: 0;
    display: flex;
    align-items: center;
    position: absolute;
    transform: translate(0);
    animation: infinite-scroll 100s linear;
    animation-iteration-count: infinite;
}
.infinite-scroll2 div{
    position: relative;
    padding: 0.1333333rem 0.2666667rem;
    margin: 0 0.1rem;
    /* background: #00000030; */
    border-radius: 0.2266667rem;
    font-size: .18rem;
    font-family: SourceHanSans-Regular;
    font-weight: 400;
    color: #fff;
    white-space: nowrap;
}
.infinite-scroll2 div span:nth-child(1){
    color: #f55909;
}
.infinite-scroll2 div span:nth-child(2){
    color: #fdce6f;
}
.infinite-scroll2 div:nth-child(odd){
    top: 0rem;
}
.infinite-scroll2 div:nth-child(2n){
    top: 0rem;
}
.noborder-div{
	position: absolute;
	top: 4.8rem;
	width: 100%;
}
.waring-num{
	position: absolute;
	top: 3.35rem;
	right: 1.09rem;
	font-size: .48rem;
	font-weight: bold;
	color: #31ffe5;
	width: .9rem;
	text-align: center;
}
.pop-info2{
	margin-top: .2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.pop-info2 .pop-info-box {
    display: flex;
    align-items: center;
    margin-top: 0.02rem;
	margin-left: 0;
    width: 4rem;
    height: .45rem;
	background: #000;
    border: 1px solid #9139c6;
    border-radius: 0rem;
	color: #fff;
}
.pop-info2 .pop-info-box .pop-area{
	float: left;
    padding-left: 0.1rem;
    width: 1.8rem;
	height: .45rem;
    background: url(../images/area.png) no-repeat right;
	background-size: .25rem 0.21rem;
    border: none;
	border-radius: .1rem;
    outline: medium;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    font-size: 0.14rem;
    color: #fff;
}
.pop-info2 .pop-info-box .pop-input-in{
	background: #f3f7fa00;
	color: #fff;
}
.btn-pop-new-reservation{
	margin: 0 auto;
    display: block;
    width: calc(4.61rem* var(--calc));
    height: calc(1.17rem* var(--calc));
    background: url(../images/btn_pop_reservation.png) no-repeat;
    background-size: calc(4.61rem* var(--calc)) calc(1.17rem* var(--calc));
    -webkit-animation: magnify .8s linear infinite alternate;
    -moz-animation: magnify .8s linear infinite alternate;
    animation: magnify .8s linear infinite alternate;
}
.pop-new-store{
	position: absolute;
	top: 5.9rem;
	left: 1.9rem;
	display: flex;
	justify-content: space-around;
}
.btn-pop-new-ios,.btn-pop-new-ios2 {
	width: calc(2.84rem* var(--calc2));
	height: calc(1.4rem* var(--calc2));
	background: url(../images/new_ios.png) no-repeat;
	background-size: calc(2.84rem* var(--calc2)) calc(1.4rem* var(--calc2));
}
.btn-pop-new-gp,.btn-pop-new-gp2 {
	width: calc(2.79rem* var(--calc2));
	height: calc(.96rem* var(--calc2));
	background: url(../images/new_gp.png) no-repeat;
	background-size: calc(2.79rem* var(--calc2)) calc(.96rem* var(--calc2));
}
.btn-pop-new-ios span, .btn-pop-new-gp span,.btn-pop-new-ios2 span, .btn-pop-new-gp2 span {
	float: left;
	position: relative;
	margin-left: 0rem;
	margin-top: 0.01rem;
	border-radius: 0.1rem;
	display: inline;
	overflow: hidden;
	width: calc(2.79rem* var(--calc2));
	height: calc(.96rem* var(--calc2));
}
.btn-pop-new-ios span .effect, .btn-pop-new-gp span .effect,.btn-pop-new-ios2 span .effect, .btn-pop-new-gp2 span .effect {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: linear-gradient( 90deg, transparent, transparent, rgba(247, 194, 3, 0.886), transparent, transparent );
    background-size: 100%;
	transition: all 650ms;
	-webkit-animation: sg 2s linear infinite;
	-moz-animation: sg 2s linear infinite;
	-ms-animation: sg 2s linear infinite;
	animation: sg 2s linear infinite;
}
.mb-btn-gp {
	position: absolute;
	right: 0.2rem;
	bottom: 0.12rem;
	width: 2.43rem;
	height: 0.73rem;
	background: url(../images/mb_gp.png) no-repeat center top;
	background-size: 2.43rem 0.73rem;
}
.mb-btn-ios {
	position: absolute;
	right: 0.2rem;
	bottom: .95rem;
	width: 2.43rem;
	height: 0.73rem;
	background: url(../images/mb_ios.png) no-repeat center top;
	background-size: 2.43rem 0.73rem;
}
.mb-btn-ios span, .mb-btn-gp span {
	float: left;
	position: relative;
	margin-left: 0.01rem;
	margin-top: 0.01rem;
	border-radius: 0.1rem;
	display: inline;
	overflow: hidden;
	width: 2.43rem;
	height: 0.73rem;
}
.mb-btn-ios span .effect, .mb-btn-gp span .effect {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: linear-gradient( 90deg, transparent, transparent, rgba(247, 194, 3, 0.886), transparent, transparent );
	background-size: 100%;
	transition: all 650ms;
	-webkit-animation: sg 2s linear infinite;
	-moz-animation: sg 2s linear infinite;
	-ms-animation: sg 2s linear infinite;
	animation: sg 2s linear infinite;
}
@keyframes infinite-scroll {
    0% {
        transform: translate(0);
    }
    100% {
        transform: translate(-50%);
    }
    }

@media (max-width:750px) {
	.mb-btn-gp {
		bottom: 0.12rem;
	}
	.mb-btn-ios {
		bottom: .12rem;
	}
.btn-gp,.btn-ios{
	top: .3rem;
	width: calc(2.27rem * 1.4);
    height: calc(0.7rem * 1.4);
    background-size: calc(2.27rem * 1.4) calc(0.7rem * 1.4);
}
.btn-ios span, .btn-gp span {
    width: calc(2.27rem * 1.4);
    height: calc(0.7rem * 1.4);
}
.scroll-w{
	/* top: .4rem; */
}
.close {
	position: absolute;
	left: 47%;
	bottom: -0.5rem;
	z-index: 2;
	width: 0.4rem;
	height: 0.4rem;
	background-size: 0.4rem 0.4rem;
}
.close-r{
	right: 0.2rem;
	width: 0.5rem;
	height: 0.5rem;
	background-size: 0.5rem 0.5rem;
}
.floatbottom {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: .99rem;
	background: url(../images/floatbottom.png) no-repeat center top;
	background-size: 7.5rem .99rem;
}
.footer {
	padding-bottom: 1.5rem;
}
.p7-footer{
	padding-bottom: 1.5rem;
}
.pop1 {
	position: relative;
	display: none;
	width: 7.05rem;
	height: 11.48rem;
	background: url(../images/pop.png) no-repeat;
	background-size: 7.05rem 11.48rem;
}
.pop2 {
	position: relative;
	display: none;
	width: calc(6.9rem* var(--calc2));
	height: calc(9.17rem* var(--calc2));
	background: url(../images/pop1.png) no-repeat;
	background-size:calc(6.9rem*var(--calc2)) calc(9.17rem*var(--calc2));
}
.pop4 {
	position: relative;
	display: none;
	width: calc(6.41rem*var(--calc2));
	height: calc(9.44rem*var(--calc2));
	background-size:calc(6.41rem*var(--calc2)) calc(9.44rem*var(--calc2));
}
.pop12{
	position: relative;
	display: none;
	width: calc(6.88rem* 1);
	height: calc(6.21rem*1);
	background-size:calc(6.88rem* 1) calc(6.21rem*1);
}
.pop6{
	position: relative;
	display: none;
	width: calc(6.7rem* 1);
	height: calc(8.76rem*1);
	background-size:calc(6.7rem* 1) calc(8.76rem*1);
}
.pop7{
	position: relative;
	display: none;
	width: 6.41rem;
	height: 6.94rem;
	background-size: 6.41rem 6.94rem;
}
.pop13{
	position: relative;
	display: none;
	width: calc(6.41rem* var(--calc2));
	height: calc(10.14rem*var(--calc2));
	background-size:calc(6.41rem* var(--calc2)) calc(10.14rem*var(--calc2));
}
.pop19{
	position: relative;
	display: none;
	width: calc(7.5rem*.9);
	height: calc(13.11rem*.9);
	background-size: calc(7.5rem*.9) calc(13.11rem*.9);
}
.pop20{
	position: relative;
	display: none;
	width: calc(7.5rem*var(--calc3));
	height: calc(9.17rem*var(--calc3));
	background-size: calc(7.5rem*var(--calc3)) calc(9.17rem*var(--calc3));
}
.pop-fb{
	position: absolute;
	top: 4.9rem;
	left: 1.7rem;
	width: calc(3.73rem* 1);
	height: calc(.96rem*1);
	background-size:calc(3.73rem* 1) calc(.96rem*1);
}
.pop-info{
	position: absolute;
	top: 5.6rem;
	left: .2rem;
}
.waring-box{
	position: absolute;
	top: 5rem;
	left: .5rem;
	width: 5.6rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: .26rem;
	color: #fdce6f;
}
.waring{
	width: calc(.35rem* var(--calc));
	height: calc(.35rem* var(--calc));
	background: url(../images/waring.png) no-repeat;
	background-size: calc(.35rem* var(--calc)) calc(.35rem* var(--calc));
}
.pop-info-box {
    display: flex;
	align-items: center;
    margin-top: 0.02rem;
	margin-left: .3rem;
    width: 5.9rem;
	height: .7rem;
	background-color: #362813;
	border: 1px solid #362813;
	border-radius: .1rem;
}
.pop-area {
    float: left;
    padding-left: 0.1rem;
    width: 2rem;
    height: 0.5rem;
    background: #362813 url(../images/area.png) no-repeat right;
	background-size: .33rem 0.28rem;
    border: none;
	border-radius: .1rem;
    outline: medium;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    font-size: 0.22rem;
    color: #fff;
    
}
.pop-input-in {
    display: inline;
    outline: none;
	border: none;
	margin-left: .1rem;
    padding-left: 0.05rem;
    padding-right: 0.05rem;
    width: 3rem;
    height: 0.5rem;
    line-height: 0.52rem;
    font-size: 0.22rem;
	border-radius: .1rem;
    color: #fff;
	background-color: #362813;
}
.btn-pop-reservation {
	margin: 0 auto;
	margin-left: .4rem;
	margin-top: .15rem;
	display: block;
	width: calc(6.05rem*var(--calc2));
	height: calc(2.42rem*var(--calc2));
	background: url(../images/btn_pop_reservation.png) no-repeat;
	background-size: calc(6.05rem*var(--calc2)) calc(2.42rem*var(--calc2));
}
.pop-countdown{
	position: absolute;
	left: 3rem;
	top: 5.29rem;
	font-size: .3rem;
	font-family: system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Helvetica,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol;;
	width: 2.1rem;
	height: .55rem;
	color: #fff;
}
.pop-countdown .pop-hour{
	position: absolute;
	top: .09rem;
	left: .13rem;
}
.pop-countdown .pop-minute{
	position: absolute;
	top: .09rem;
	left: .89rem;
}
.pop-countdown .pop-second{
	position: absolute;
	top: .09rem;
	left: 1.62rem;
}
.pop-store{
	position: absolute;
	bottom: 1.5rem;
	left: 1.8rem;
	width: 3.5rem;
	display: flex;
}
.btn-pop-ios,.btn-pop-ios2 {
	width: calc(3.42rem*var(--calc2));
	height: calc(1.23rem* var(--calc2));
	background-size: calc(3.42rem* var(--calc2)) calc(1.23rem* var(--calc2));
}
.btn-pop-gp,.btn-pop-gp2 {
	width: calc(3.42rem* var(--calc2));
	height: calc(1.23rem* var(--calc2));
	background-size: calc(3.42rem* var(--calc2)) calc(1.23rem* var(--calc2));
}
.btn-pop-ios span, .btn-pop-gp span,.btn-pop-ios2 span, .btn-pop-gp2 span {
	margin-left: 0.15rem;
	margin-top: 0.19rem;
	width: calc(3.25rem* var(--calc2));
	height: calc(1rem* var(--calc2));
}
/* .finger{
	top: .7rem;
	right: .1rem;
	width: calc(.67rem* var(--calc2));
	height: calc(.76rem* var(--calc2));
	background-size: calc(.67rem* var(--calc2)) calc(.76rem* var(--calc2));
} */
.pop-new-store{
	top: 6.6rem;
	left: 2.3rem;
}
.btn-pop-new-ios,.btn-pop-new-ios2 {
	width: calc(2.84rem* var(--calc2));
	height: calc(1.4rem* var(--calc2));
	background-size: calc(2.84rem* var(--calc2)) calc(1.4rem* var(--calc2));
}
.btn-pop-new-gp,.btn-pop-new-gp2 {
	width: calc(2.79rem* var(--calc2));
	height: calc(.96rem* var(--calc2));
	background-size: calc(2.79rem* var(--calc2)) calc(.96rem* var(--calc2));
}
.btn-pop-new-ios span, .btn-pop-new-gp span,.btn-pop-new-ios2 span, .btn-pop-new-gp2 span {
	margin-left: 0rem;
	margin-top: 0.01rem;
	width: calc(2.79rem* var(--calc2));
	height: calc(.96rem* var(--calc2));
}
.add-box{
	position: absolute;
	top: .6rem;
	left: .33rem;
	display: flex;
	flex-direction: column;
}
.rw1,.rw2,.rw3,.rw4{
    position: relative;
	margin-bottom: .1rem;
	width: calc(5.61rem* var(--calc2));
	height: calc(1.06rem* var(--calc2));
}
.rw1{
	background: url(../images/rw1.png) no-repeat;
	background-size: calc(5.61rem* var(--calc2)) calc(1.06rem* var(--calc2));
}
.rw2{
	background: url(../images/rw2.png) no-repeat;
	background-size: calc(5.61rem* var(--calc2)) calc(1.06rem* var(--calc2));
}
.rw3{
	background: url(../images/rw3.png) no-repeat;
	background-size: calc(5.61rem* var(--calc2)) calc(1.06rem* var(--calc2));
}
.rw4{
	background: url(../images/rw4.png) no-repeat;
	background-size: calc(5.61rem* var(--calc2)) calc(1.06rem* var(--calc2));
}
.rw5{
	position: relative;
	margin-bottom: .1rem;
	width: calc(5.61rem* var(--calc2));
	height: calc(3.35rem* var(--calc2));
	background: url(../images/rw5.png) no-repeat;
	background-size: calc(5.61rem* var(--calc2)) calc(3.35rem* var(--calc2));
}
.task{
	top: .2rem;
	width: calc(1.88rem* var(--calc2));
	height: calc(.63rem* var(--calc2));
	background-size: calc(1.88rem* var(--calc2)) calc(.63rem* var(--calc2));
}
.add-login,.add-share,.add-like,.add-jion{
	right: .1rem;
    top: .2rem;
	width: calc(1.88rem* var(--calc2));
	height: calc(.63rem* var(--calc2));
	background-size: calc(1.88rem* var(--calc2)) calc(.63rem* var(--calc2));
}
.add-invite,.add-collect{
	display: flex;
	justify-content: center;
	font-family: serif;
	font-size: .22rem;
	line-height: calc(.6rem* var(--calc2));
	font-weight: bold;
	color: #fff;
	position: absolute;
	right: .1rem;
    top: .2rem;
	width: calc(1.88rem* var(--calc2));
	height: calc(.63rem* var(--calc2));
	background-size: calc(1.88rem* var(--calc2)) calc(.63rem* var(--calc2));
}
.r-icon{
	margin: 0 auto;
	margin-top: .9rem;
}
.rw5-n0,.rw5-n1,.rw5-n2,.rw5-n3{
	width: calc(5.5rem* var(--calc2));
	height: calc(1.94rem* var(--calc2));
	background-size: calc(5.5rem* var(--calc2)) calc(1.94rem* var(--calc2));
}
.rw5-t{
	margin-left: 1rem;
	margin-top: .1rem;
	width: calc(3.35rem* var(--calc2));
	height: calc(.23rem* var(--calc2));
	background-size: calc(3.35rem* var(--calc2)) calc(.23rem* var(--calc2));
}
/* .r6-n1,.r6-n2,.r6-n3,.r6-n4,.r6-n5{
	width: calc(.95rem* var(--calc2));
	height: calc(.95rem* var(--calc2));
	background-size:  calc(.95rem* var(--calc2)) calc(.95rem* var(--calc2));
}
.r6-n1-on,.r6-n2-on,.r6-n3-on{
	width: calc(.95rem* var(--calc2));
	height: calc(.95rem* var(--calc2));
	background-size:  calc(.95rem* var(--calc2)) calc(.95rem* var(--calc2));
} 
.r-icon2{
	margin: 0 auto;
	margin-top: 1.05rem;
	width: 4.8rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
} */
.cards-box{
	margin-top: 1.3rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.cards-box div{
	width: calc(2.09rem* 1);
	height: calc(2.15rem* 1);
	margin: .05rem .05rem;
}
.pop-cont2{
	font-size: .24rem;
	line-height: .29rem;
	max-height: 7rem;
	margin-top: 1.5rem;
}
.record-box {
	margin: 0 auto;
	margin-top: 0.3rem;
	margin-bottom: 0.2rem;
	width:7rem;
	font-size: 0.22rem;
	/* max-height: 4.2rem;
	overflow: hidden;
	overflow-y: auto;
	overflow-x: hidden; */
}
.record-box table {
	margin: 0 auto;
	width: 100%;
	text-align: center;
}
.record-box table td {
	height: .8rem;
	padding: .01rem;
	border: 1px solid #42618f;
	line-height: .3rem;
	word-break: break-all;
	word-wrap: break-word;
	background: #fff;
	color: #7b8ab3;
}
.record-box table th {
	padding: .1rem;
	border: 1px solid #42618f;
	line-height: .3rem;
	font-weight: normal;
	background: #004e90;
	color: #fff;
}
.record-box table th.t-bg1 {
	background: #004e90;
}
.record-box table td.t-bg2 {
	background: #fff;
}
.btn-copy{
	text-decoration: underline;
	color: #7b8ab3;
}
.noborder-div{
	top: 6.2rem;
}
.waring-num{
	top: 4.37rem;
	right: 1.5rem;
	font-size: .56rem;
	width: .9rem;
}
.scroll2-w{
	top: 5.85rem;
	left: .75rem;
	width: 5.3rem;
}
.pop-info2{
	left: .7rem;
	top: 1.1rem;
}
.pop-info2 .pop-info-box {
	width: 4.9rem;
	height: .65rem;
}
.pop-info2 .pop-info-box .pop-area {
	font-size: .22rem;
}
.btn-pop-new-reservation{
	width: calc(4.61rem* var(--calc2));
    height: calc(1.17rem* var(--calc2));
	background-size:calc(4.61rem* var(--calc2)) calc(1.17rem* var(--calc2));
}
.pop-choose{
	left: 1.2rem;
	top: 3.3rem;
}

}
@-webkit-keyframes magnify {
 0% {
 -webkit-transform: scale(0.96);
}
100% {
 -webkit-transform: scale(1);
}
}
@-moz-keyframes magnify {
 0% {
 -moz-transform: scale(1);
}
100% {
 -moz-transform: scale(0.96);
}
}
@keyframes magnify {
 0% {
 transform: scale(1);
}
100% {
 transform: scale(0.96);
}
}
@keyframes shake {
 25% {
 transform: rotate(7deg);
}
75% {
 transform: rotate(-7deg);
}
50%, 100% {
 transform: rotate(0);
}
}
@keyframes rotation {
 from {
 transform: rotate(0deg);
}
to {
	transform: rotate(360deg);
}
}
@keyframes sg {
 from {
 left:-100%;
}
to {
	left: 100%;
}
}
@-webkit-keyframes sg {
 from {
 left:-100%;
}
to {
	left: 100%;
}
}
@-moz-keyframes sg {
 from {
 left:-100%;
}
to {
	left: 100%;
}
}
@-o-keyframes sg {
 from {
 left:-100%;
}
to {
	left: 100%;
}
}
@keyframes enlarge
{
    from {
        opacity: 0.8;
        -ms-transform: scale(0.8,0.8); /* IE 9 */
        -webkit-transform: scale(0.8,0.8); /* Safari */
        transform: scale(0.8,0.8); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
    }
}
 
@-webkit-keyframes enlarge /* Safari 与 Chrome */
{
    from {
        opacity:0.8;
        -ms-transform: scale(0.8,0.8); /* IE 9 */
        -webkit-transform: scale(0.8,0.8); /* Safari */
        transform: scale(0.8,0.8); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform:scale(1.2,1.2);
        transform:scale(1.2,1.2);
    }
}