.ar-con {
	position: absolute;
	display: none;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100vh;
	height: 100svh;
	z-index: 100;
}
.ar-mask{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100vh;
	height: 100svh;
	background-color: rgba(0, 0, 0, 0.7);
}
#ar-scanning-overlay {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 75rem;
	height: 144.6rem;
	background-image: url("../img/mask.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
}
.ar-btn-back{
	position: absolute;
	display: none;
	top: 12.5rem;
	left: 3.5rem;
	width: 10.7rem;
	height: 3.4rem;
	z-index: 10000;
}
.ar-mask-scan{
	position: absolute;
	top: 36rem;
	left: 10rem;
	width: 55.1rem;
	animation: scanMove 2s linear infinite;
}
@keyframes scanMove {
  0% {
    transform: translateY(0);
	opacity: 0;
  }
  5%{
	  transform: translateY(2rem);
	  opacity: 1;
  }
  95% {
    transform: translateY(52rem);
	opacity: 1;
  }
  100% {
    transform: translateY(54rem);
	 opacity: 0;
  }
}
#ar-scanning-overlay.hidden {
	display: none;
}
.mindar-ui-loading .loader {
    border: 8px solid #ff0000 !important;
    border-top: 8px solid white !important;
    width: 60px !important;
    height: 60px !important;
}
.mindar-ui-loading::after{
	content: "启动中";
	position: absolute;
	top: 50%;
	margin-top: -1.5rem;
	font-size: 3rem;
	color: #ffffff;
}
.mindar-ui-loading-after01::after{
	content: "加载数据";
	position: absolute;
	top: 50%;
	margin-top: -1.5rem;
	font-size: 3rem;
	color: #ffffff;
}
.mindar-ui-loading-after02::after{
	content: "初始化";
	position: absolute;
	top: 50%;
	margin-top: -1.5rem;
	font-size: 3rem;
	color: #ffffff;
}
.mindar-ui-loading-after03::after{
	content: "渲染中";
	position: absolute;
	top: 50%;
	margin-top: -1.5rem;
	font-size: 3rem;
	color: #ffffff;
}
.mindar-ui-overlay{
	z-index: 200 !important;
}
/* 拍照 */
.page4-step01,.page4-step02,.page4-step03,.page4-step04{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100vh;
	height: 100svh;
	background-color: #1c0201;
	overflow: hidden;
}
.page4-step01-video{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100%;
	pointer-events: none;
}
.page4-step01-canvas{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100%;
}
#myvideo{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#myvideo.front{
	 display: block;
	 transform: scaleX(-1);
	 -webkit-transform: scaleX(-1);
}
#mycanvas{
	width: 100%;
	height: 100%;
}
.page4-step01-mask{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100vw;
	pointer-events: none;
}
.page4-step01-mask img{
	width: 100%;
}
.page4-step01-btn{
	position: absolute;
	top: 180rem;
	left: 50%;
	transform: translateX(-50%);
	width: 20.4rem;
}
.page4-step01-btn img{
	width: 100%;
}
.page4-step01-upload{
	position: absolute;
	top: 185rem;
	left: 75rem;
	width: 13.9rem;
}
.page4-step01-upload img{
	width: 100%;
}
#fileInput{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 13.9rem;
	height: 13.8rem;
	opacity: 0;
}
.page4-step01-camera{
	position: absolute;
	top: 58.5rem;
	left: 90rem;
	width: 12.4rem;
}
.page4-step01-camera img{
	width: 100%;
}
.page4-step02-btn{
	position: absolute;
	top: 180rem;
	display: flex;
	justify-content: center;
	width: 100%;
}
.page4-step04-btn{
	position: absolute;
	top: 187rem;
	display: flex;
	justify-content:center;
	width: 100%;
}
.page4-step02-btn-again{
	width: 54.9rem;
}
.page4-step02-btn-confirm{
	width: 54.9rem;
}
.page4-step04-btn-next{
	position: absolute;
	top: 195rem;
	display: flex;
	justify-content: center;
	width: 100%;
}
.page4-step04-btn-nextstep{
	width: 53.3rem;
}
.page4-step04-tip{
	position: absolute;
	top: 183rem;
	display: flex;
	justify-content:center;
	width: 100%;
}
.tip-save{
	width: 32.5rem;
}
.page4-step03-capture{
	position: relative;
	top: 0rem;
	left: 0rem;
	width: 100vw;
	height: 100%;
}
.page4-step03-btn{
	width: 100%;
	position: absolute;
	top: 180rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0rem 28rem;
	box-sizing: border-box;
}
.page4-step03-tip{
	position: absolute;
	top: 187rem;
	left: 8rem;
	width: 13.5rem;
}
.page4-step03-tip img{
	width: 100%;
}
.page4-step03-btn-complete{
	width: 20.4rem;
}
.page4-step03-btn-left,.page4-step03-btn-right{
	width: 4.9rem;
}
.page4-step03-bg{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100vw;
	z-index: 0;
}
.page4-step03-bg img{
	width: 100%;
}
.page4-step03-swiper{
	width: 100%;
	height: 100%;
}
.page4-step04-btn-save{
	width: 54.9rem;
	pointer-events: none;
}
.page4-step04-btn-share{
	width: 47.8rem;
}
.page4-step04-preview{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100%;
}
.no-select {
    user-select: none; 
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}