html, body{
    width: 100%;
    height: 100%;
    overflow: hidden;
    max-width: 750px;
    position: relative;
    margin: 0 auto;
}

.page {
    margin: 0 auto;
    background-color: #def2ff;
}

.container {
    width: 7.5rem;
    height: 13.34rem;
    position: absolute;
    bottom: 0;
	top: 50%;
    left: 50%;
	/*margin-left: -3.75rem;*/
    margin: -6.67rem 0 0 -3.75rem;
}

.music {
	top: 1rem;
	right: 0.25rem;
}

#homeContainer {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

#homeContainer .bg {
	/*object-fit: cover;*/
    width: 100%;
    height: 100%;
}


#homeContainer {
	background: url("https://csdn.whbhst.com/h5/boshi/20250403/images/bg.png") no-repeat;
	background-size: cover;
}

#homeContainer .logo {
	width: 1.84rem;
	position: absolute;
	top: 0.43rem;
	left: .42rem;
}

.light {
	position: absolute;
	width: 4.27rem;
	top: 0.7rem;
	left: 2.75rem;
	/* animation: lightAni 0.6s infinite alternate; */
	-webkit-animation: blink 2s ease-in-out infinite 1.8s;
	mix-blend-mode: screen;
	/*display: none;*/
	opacity: 0; /* 初始状态不可见 */
}

@keyframes lightAni {
	0%{
		opacity: 0.5;
	}
	100%{
		opacity: 1;
	}
}

#homeContainer .main {
	/*top: 0.19rem;*/
	/*margin-left: -4rem;*/
	/*width: 8.39rem;*/
	position: absolute;
	top: -0.1rem;
	left: 50%;
	margin-left: -4.7rem;
	width: 9.29rem;
	mix-blend-mode: screen;
}

#homeContainer .a1 {
	position: absolute;
	top: 1.59rem;
	left: .87rem;
	/*left: 50%;*/
	/*margin-left: -3rem;*/
	width: 2.15rem;
	/*transform-origin: 0% 0% 0px;*/
	/*animation-name: a1;*/
	/*animation-duration: 2s;*/
	/*animation-iteration-count: infinite;*/
	/*animation-delay: 0s;*/
	/*animation-fill-mode: backwards;*/
}

.a2a, .a1a {
    animation-duration: 1.6s;
}

@keyframes a1 {
	0% {
		animation-timing-function: linear;
		opacity: 1;
		transform: translate3d(0px, 0px, 0px);
	}
	25% {
		animation-timing-function: linear;
		opacity: 1;
		transform: translate3d(5%, 0px, 0px);
	}
	50% {
		animation-timing-function: linear;
		opacity: 1;
	}
	75% {
		animation-timing-function: linear;
		opacity: 1;
		transform: translate3d(-5%, 0px, 0px);
	}
	100% {
		animation-timing-function: linear;
		opacity: 1;
		transform: translate3d(0px, 0px, 0px);
	}
}


#homeContainer .a2 {
	position: absolute;
	top: 2.25rem;
	left: 0;
	/*left: 50%;*/
	/*margin-left: -2.42rem;*/
	width: 4.98rem;
	/*transform-origin: 0% 0% 0px;*/
	/*animation-name: a1;*/
	animation-duration: 3.7s;
	/*animation-iteration-count: infinite;*/
	/*animation-delay: 0s;*/
	/*animation-fill-mode: backwards;*/
}

#homeContainer .a3 {
	position: absolute;
	top: 1.17rem;
	left: 3.13rem;
	width: 2.95rem;
	animation-duration: 3.7s;
}

.bb {
	position: absolute;
	top: 9.13rem;
	left: 50%;
	margin-left: -2.03rem;
	width: 4.06rem;
}
.c1 {
	position: absolute;
	top: 10.2rem;
	left: 50%;
	margin-left: -1.8rem;
	width: 3.6rem;
}
.c2 {
	position: absolute;
	top: 11.42rem;
	left: 50%;
	margin-left: -2.73rem;
	width: 5.46rem;
}
.video-wrap{
	/*background: url("https://csdn.whbhst.com/h5/boshi/20241015/images/videoBg.png") no-repeat;*/
	/*background-size: 100%;*/
	position: absolute;
	top: 4.71rem;
	left: 50%;
	margin-left: -3.54rem;
	width: 7.09rem;
	height: 4.2rem;
}
#my-video {
	/*position: absolute;*/
	/*top: 0.1rem;*/
	/*left: 0.22rem;*/
	margin: 0.1rem 0.21rem;
	width: 6.68rem;
	height: 3.7565rem;
	background: #901704;
}

/*@keyframes showAni {*/
/*	100%{*/
/*		opacity: 1;*/
/*	}*/
/*}*/


@keyframes blink {
	0% {
		opacity: 0.4;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0.4;
	}
}

.dialog-box{
	position: absolute;
    width: 6.41rem;
	animation-duration: .7s;
}

.dialog-box img {
	width: 100%;
	height: 100%;
}

.dialog-box .btn {
	position: absolute;
	bottom: 0;
	width: 2.7rem;
	height: 1rem;
}

.dialog-box .btn2 {
	bottom: 0.5rem;
	left: 1.5rem;
	width: 3.5rem;
}

.lose-dialog .dialog-box{
	width: 5.6rem;
}
.lose-dialog .start-btn {
	bottom: .5rem;
}

.lose-dialog .close-btn {
	bottom: .5rem;
	right: 0;
}

.lose-dialog .dialog-tip {
	position: absolute;
	top: 3.2rem;
	font-size: 0.58rem;
	font-weight: bold;
	width: 4.3rem;
	color: #c11e1d;
	text-align: center;
	left: 50%;
	margin-left: -2.15rem;
}

.win-dialog .scroll img {
	position: absolute;
	width: 100%;
	height: 12.58rem;
}

.rule-dialog .dialog-box{
	width: 5.97rem;
}

.rule-dialog .start-btn{
	left: 0.2rem;
}

.rule-dialog .close-btn, .win-dialog .close-btn{
	right: 0.4rem;
}

 /*滚动条宽度*/
::-webkit-scrollbar {
	width: 0.1rem;
}

/* 滚动条里面的轨道*/
::-webkit-scrollbar-track {
	background-color: #a8dcff;
	border-radius: 2px;
	width: 3px;
}
/* 滚动条里面的小方块 */
::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background: #7bbdff;
}



.mask {
	/* 当在iOS上一直按住一个目标元素时，会展示一个关于这个链接的callout信息。webkit-touch-callout属性允许禁用掉这一行为。 */
	-webkit-user-select:none;
	user-select:none;
	touch-callout:none;
	-webkit-touch-callout:none;
}