html {
	color: #000;
	background: #FFF;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset,
img {
	border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
	font-style: normal;
	font-weight: normal;
}

li {
	list-style: none;
}

caption,
th {
	text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: 100%;
	font-weight: normal;
}

q:before,
q:after {
	content: '';
}

abbr,
acronym {
	border: 0;
	font-variant: normal;
}

sup {
	vertical-align: text-top;
}

sub {
	vertical-align: text-bottom;
}

input,
textarea,
select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}

input,
textarea,
select {
	font-size: 100%;
}

legend {
	color: #000;
}

html,
body {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	width: 100%;
	height: 100%;
}

.clearfix:after {
	content: "/20";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

.clearfix {
	zoom: 1;
}

html,
body {
	width: 100%;
	height: 100%;
	background: #484848;
}

body {
	position: relative;
}

em {
	display: none;
}

#extra,
#view {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100vw;
	height: 100vh;
	transform: translate(-50%, -50%);
	text-align: left;
	background: #fff;
	overflow: hidden;
}

#view {
	display: block;
	background: transparent;
	cursor: default;
	z-index: 20;
}

#extra {
	background: #000;
}

#extra .layer {
	position: absolute;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 10;
}

#desc {
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	height: 80px;
	color: #ccc;
	line-height: 40px;
	margin-top: 200px;
	text-align: center;
	font-size: 14px;
}

#desc a {
	color: #318fe1;
}

#browser {
	font-size: 14px;
	line-height: 16px;
}

#browser .b {
	color: #fff;
	font-weight: 700;
}

/* 顶部到底部动画 */
@keyframes topBottom {
	0% {
		top: -20%;
	}

	100% {
		top: 0;
	}
}

.content {
	position: relative;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
}

/* 倒计时 */
.countdown-view {
	width: 340px;
	height: 340px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	line-height: 120px;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	animation: topBottom 0.5s linear;
}

.countdown-view::after {
	--h: 150px;
	position: absolute;
	width: 100%;
	height: 100%;
	content: '';
	border-radius: 50%;
	background: linear-gradient(0deg, rgba(255, 184, 70, 0.3) 0%, rgba(255, 184, 70, 0.8) 100%);
	-webkit-mask: radial-gradient(transparent, transparent var(--h), #000 var(--h));
	mask: radial-gradient(transparent var(--h), #000 var(--h));
	animation: rotate 1s linear infinite;
}

/* 圆环旋转动画 */
@keyframes rotate {
	to {
		transform: rotate(360deg);
	}
}

/* 倒计时页面样式 */

#adjust,
#noCoupons,
#getCoupons {
	z-index: 99;
	position: absolute;
}

.countdown-view .countdown-text {
	font-size: 46px;
	color: #fff;
}

.camera-view {
	position: relative;
	left: 50%;
	top: 30px;
	transform: translateX(-50%);
	background: linear-gradient(322deg, rgba(255, 196, 134, 0), rgba(236, 136, 31, 1));
	animation: toHeight 1s linear;
}

/* 底部到顶部动画 */
@keyframes toHeight {
	0% {
		height: 0;
	}

	100% {
		height: 50vw;
	}
}

.countdown-view .countdown-view-text {
	font-family: PingFang SC;
	font-size: 120px;
	font-weight: 600;
	color: #ECECEC;
	text-shadow: 0px 0px 20px #FF801F;
	text-align: left;
	font-style: normal;
	text-transform: none;
}

.countdown-tip {
	width: 86vw;
	height: 28vw;
	position: absolute;
	left: 6vw;
	bottom: 10vh;
	padding-top: 10vw;
	animation: bottomTop 0.5s linear;
}

/* 底部到顶部动画 */
@keyframes bottomTop {
	0% {
		bottom: -20%;
	}

	100% {
		bottom: 10vh;
	}
}

.countdown-tip .countdown-tip-text {
	width: 60%;
	text-align: center;
	font-family: PingFang SC;
	font-weight: 500;
	font-size: 24px;
	color: #FFFFFF;
	line-height: 38px;
	text-align: center;
	font-style: normal;
	text-transform: none;
	letter-spacing: 2px;
	margin: auto;
	line-height: 34px;
	transform: perspective(74px) rotateX(12deg);
}

.bottom-icon1 {
	position: absolute;
	left: 10vw;
	bottom: 10vw;
	width: 20vw;
	height: 20vw;
}

/* 没有优惠券弹框 */
.bottom-icon {
	position: absolute;
	right: 10vw;
	bottom: 10vw;
	animation: circle 1s infinite;
	width: 20vw;
	height: 20vw;
}

/* 圆环旋转动画 */
@keyframes circle {
	0% {
		transform: translateY(1vw);
	}

	50% {
		transform: translateY(0);
	}

	100% {
		transform: translateY(1vw);
	}
}

.coupon-view-top {
	margin-bottom: 9vw;
}

.coupon-view-text1 {
	display: flex;
	justify-content: center;
	align-items: center;

}

.coupon-view-text1 .coupon-view-text1-p,
.coupon-view-text1 .coupon-view-text1-p2 {
	font-family: PingFang SC;
	font-weight: 600;
	font-style: normal;
	text-transform: none;
}

.coupon-view-text1 .coupon-view-text1-p {
	font-size: 4vw;
	color: #FFD423;
	text-shadow: 0px 2px 0px #B87D51;
	text-stroke: 1px #873F0A;
	-webkit-text-stroke: 1px #873F0A;
	margin-right: 1vw;
}

.coupon-view-text1 .coupon-view-text1-p2 {
	font-size: 5vw;
	text-shadow: 0px 2px 0px #B87D51;
	text-stroke: 2px #873F0A;
	color: #ffffff;
	-webkit-text-stroke: 2px #873F0A;
}

.coupon-view-text1-num {
	font-size: 8vw;
	font-weight: 600;
	text-shadow: 0px 2px 0px #fff;
	text-stroke: 2px #fff;
	color: #873F0A;
	-webkit-text-stroke: 2px #fff;
}

.coupon-view-text2 {
	font-family: PingFang SC;
	font-size: 3vw;
	color: #8E5224;
	text-align: left;
	font-style: normal;
	text-transform: none;
	margin-bottom: 3vw;
}

.camera-view-tip {
	width: 100%;
	height: 100%;
	position: relative;
	padding: 10px;
}

.camera-view-tip-text1 {
	font-family: PingFang SC;
	font-weight: 600;
	font-size: 4vw;
	color: #FFFFFF;
	text-align: center;
	font-style: normal;
	text-transform: none;
	letter-spacing: 2px;
	line-height: 34px;
	position: absolute;
	border: 1px solid;
	padding: 10px;
	border-radius: 10px;
	background: #873F0A;
	width: fit-content;
	height: fit-content;
}

.camera-view-tip-left {
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.camera-view-tip-right {
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.camera-view-tip-top {
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
}

.camera-view-tip-bottom {
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
}

.camera-view-tip-center {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}


.getCoupons-top {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 100%;
	top: -20vw;
}

.getCoupons-num {
	font-size: 10vw;
	color: #49DBFD;
	margin-right: 1vw;
}

.getCoupons-num-icon {
	width: 10vw;
	height: 10vw;
}

.getCoupons-name {
	font-family: PingFang SC;
	font-weight: 600;
	font-size: 4vw;
	color: #8E5224;
	line-height: 24px;
	text-align: center;
	font-style: normal;
	text-transform: none;
	margin-top: 8vw;
}

.getCoupons-date {
	font-family: PingFang SC;
	font-weight: 600;
	font-size: 2vw;
	color: #8E5224;
	line-height: 3vw;
	text-align: center;
	font-style: normal;
	text-transform: none;
	margin-top: 2vw;
}

.getCoupons-code {
	width: 20vw;
	height: 20vw;
	position: relative;
	overflow: hidden;
	border-radius: 8rpx;
	margin: 2vw auto 0 auto;

	&::after {
		content: "";
		position: absolute;
		content: "";
		top: 0;
		left: 0;
		width: 100%;
		height: 50%;
		background: #e86d0c;
	}

	&::before {
		position: absolute;
		content: "";
		left: 0;
		bottom: 0;
		width: 100%;
		height: 50%;
		background: linear-gradient(180deg,
				rgba(249, 215, 84, 1),
				rgba(232, 109, 12, 1));
	}


}

.getCoupons-code-img {
	width: 19vw;
	height: 19vw;
	background-color: #ffffff;
	border-radius: 8rpx;
	position: absolute;
	top: 0.5vw;
	left: 0.5vw;
	z-index: 1;
	padding: 2vw;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.getCoupons-desc {
	background-size: 100% 100%;
	background-repeat: no-repeat;
	width: fit-content;
	height: 6vw;
	line-height: 6vw;
	padding: 0 2vw;
	margin: 3vw auto 0 auto;
	font-family: PingFang SC;
	font-weight: 500;
	font-size: 3vw;
	color: #ffffff;
	text-align: center;
	font-style: normal;
	text-transform: none;
}

.getCoupons-code-img-content {
	width: 100%;
	height: 100%;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.getCoupons-content-countdown {
	position: relative;
	right: 0;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.getCoupons-countdown-icon {
	width: 10vw;
	height: 10vw;
}

.getCoupons-countdown-num {
	border-radius: 0px 0px 0px 0px;
	font-family: PingFang SC;
	font-weight: 600;
	font-size: 8vw;
	color: #C416EF;
	line-height: 24px;
	text-align: center;
	font-style: normal;
	text-transform: none;
}

.getCoupons-tip-text {
	text-align: center;
	font-family: PingFang SC;
	font-weight: 500;
	font-size: 3vw;
	color: #8E5224;
	line-height: 3vw;
	text-align: center;
	font-style: normal;
	text-transform: none;
	margin-top: 2vw;
}

.countdownExit-countdown-num {
	font-family: PingFang SC;
	font-weight: 600;
	font-size: 8vw;
	color: #873F0A;
	text-shadow: 0px 2px 0px #FFD423;
	text-stroke: 1px #FFD423;
	-webkit-text-stroke: 1px #FFD423;
}