html {
			font-size: 13.33vw;
		}

		@media screen and (max-width: 320px) {
			html {
				font-size: 42.667px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 321px) and (max-width:360px) {
			html {
				font-size: 48px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 361px) and (max-width:375px) {
			html {
				font-size: 50px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 376px) and (max-width:393px) {
			html {
				font-size: 52.4px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 394px) and (max-width:412px) {
			html {
				font-size: 54.93px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 413px) and (max-width:414px) {
			html {
				font-size: 65.2px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 415px) and (max-width:480px) {
			html {
				font-size: 74px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 481px) and (max-width:540px) {
			html {
				font-size: 82px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 541px) and (max-width:640px) {
			html {
				font-size: 95.33px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 641px) and (max-width:750px) {
			html {
				font-size: 100px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 751px) and (max-width:768px) {
			html {
				font-size: 1100px;
				font-size: 13.33vw;
			}
		}

		@media screen and (min-width: 751px) {
			html {
				font-size: 100px;
				font-size: 13.33vw
			}
		}

		a,
		blockquote,
		body,
		code,
		dd,
		div,
		dl,
		dt,
		em,
		fieldset,
		form,
		h1,
		h2,
		h3,
		h4,
		h5,
		h6,
		iframe,
		img,
		input,
		label,
		li,
		object,
		ol,
		p,
		q,
		small,
		span,
		strong,
		table,
		tbody,
		td,
		th,
		tr,
		ul {
			margin: 0;
			padding: 0;
			border: 0
		}

		body {
			font-family: "STHeiti", "Microsoft YaHei", Helvetica, Arial, sans-serif;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			-webkit-text-size-adjust: none
		}

		a,
		a:active,
		a:focus,
		a:hover,
		a:visited {
			text-decoration: none
		}

		a,
		img {
			-webkit-touch-callout: none
		}

		li,
		ol,
		ul {
			list-style: none
		}


		@media screen and (min-width:641px) {
			html {
				font-size: 100px;
			}

			html .wrap {
				width: 750px;
				max-width: 750px;
				margin: 0 auto
			}
		}

		.wrap {
			font-size: 0;
			width: 100%
		}

		a,
		button,
		input,
		textarea {
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
		}

		html,
		body {
			width: 100%;
			position: relative;
			background-color: #000;
		}

		img {
			border: none;
			vertical-align: middle;
		}

		a {
			text-decoration: none;
		}

		em {
			font-style: normal;
		}

		ul,
		li {
			list-style: none;
		}



		.wrap {
			position: relative;
		}


		img {
			width: 100%;
		}

		html,
		body {
			height: 100%;
			overflow-x: hidden;
		}

		.swiper {
			width: 100%;
			height: 100%;
		}

		.swiper-slide {
			overflow-x: hidden;

		}


		img {
			width: 100%;
		}




		.u-arrow-bottom {
			position: absolute;
			left: 50%;
			z-index: 150;
			width: 24px;
			height: 14px;
			margin-left: -7px
		}

		.pre-wrap-bottom {
			width: 24px;
			height: 14px;
			position: relative;
			-webkit-animation: start 1.5s infinite ease-in-out;
			animation: start 1.5s infinite ease-in-out
		}

		.pre-box1,
		.pre-box2 {
			height: 15px;
			width: 11px;
			position: absolute;
			top: -5px;
			overflow: hidden
		}

		.pre-box2 {
			left: 10px
		}

		.pre1 {
			transform: rotate(130deg);
			-webkit-transform: rotate(130deg);
			left: 1px
		}

		.pre1,
		.pre2 {
			background-color: #fff;
			width: 14px;
			height: 5px;
			border-radius: 2px;
			position: absolute;
			box-shadow: 1px -1px 1px #646464;
			top: 5px
		}

		.pre2 {
			left: -4.5px;
			-webkit-transform: rotate(50deg);
			transform: rotate(50deg)
		}

		@-webkit-keyframes start {

			0%,
			30% {
				opacity: 0;
				-webkit-transform: translateY(10px)
			}

			60% {
				opacity: 1;
				-webkit-transform: translate(0)
			}

			to {
				opacity: 0;
				-webkit-transform: translateY(-8px)
			}
		}

		@keyframes start {

			0%,
			30% {
				opacity: 0;
				transform: translateY(10px)
			}

			60% {
				opacity: 1;
				transform: translate(0)
			}

			to {
				opacity: 0;
				transform: translateY(-8px)
			}
		}

		.bgm-btn-wraper {
			right: 16px;
			top: 16px;
			display: none
		}

		.bgm-btn-wraper,
		.bgm-btn-wraper .bgm-btn {
			position: absolute;
			z-index: 200;
			right: 0.2rem;
			top: 0.2rem;
			width: 20px;
			height: 20px
		}

		.bgm-btn-wraper .bgm-btn.rotate {
			-webkit-animation: rotating 1.2s linear infinite;
			animation: rotating 1.2s linear infinite
		}

		.bgm-btn-wraper .bgm-btn {
			right: 0;
			top: 0;
			border-radius: 15px;
			background-size: contain;
			background-repeat: no-repeat;
		}

		@-webkit-keyframes rotating {
			0% {
				transform: rotate(0deg)
			}

			to {
				transform: rotate(1turn)
			}
		}

		@keyframes rotating {
			0% {
				transform: rotate(0deg)
			}

			to {
				transform: rotate(1turn)
			}
		}


		.loop {
			animation-iteration-count: infinite;
			/*无限*/
			animation-timing-function: linear;
			/*平滑*/
		}

		/*自定义CSS动画*/
		.moveRight {
			-webkit-animation-name: moveRight;
			animation-name: moveRight
		}

		@-webkit-keyframes moveRight {
			0% {
				opacity: 0;
				left: 0px;
			}

			10% {
				opacity: 1;
			}

			100% {
				opacity: 1;
				left: 550px;
			}
		}

		@keyframes moveRight {
			0% {
				opacity: 0;
				left: 0px;
			}

			10% {
				opacity: 1;
			}

			100% {
				opacity: 1;
				left: 550px;
			}
		}

		.moveLeft {
			-webkit-animation-name: moveLeft;
			animation-name: moveLeft
		}

		@-webkit-keyframes moveLeft {
			0% {
				opacity: 0;
				left: 390px;
			}

			10% {
				opacity: 1;
			}

			100% {
				opacity: 1;
				left: -370px;
			}
		}

		@keyframes moveLeft {
			0% {
				opacity: 0;
				left: 390px;
			}

			10% {
				opacity: 1;
			}

			100% {
				opacity: 1;
				left: -370px;
			}
		}