xuchang-new/src/index.css

* {
  box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5 {
  margin: 0;
}

html,
body {
  margin: 0;
  padding: 0;
  overflow-y: hidden;
}

#FullScreen {
  width: 3840px;
  height: 1080px;
  transform-origin: "lefttop";
  background-color: #040c1c;
}

#FullScreen .Main {
  width: 3840px;
  height: 996px;
  display: flex;
  flex-direction: row;
}

#FullScreen .Main .Center {
  margin: 22px;
  width: 2472px;
  height: 940px;
  position: relative;
}

#FullScreen .Main .Center .CenterData {
  position: absolute;
  width: 2472px;
  height: 240px;
  z-index: 2;
}

#FullScreen .Main .Center .V3DBG {
  position: absolute;
  background: #f004;
  width: 2472px;
  height: 640px;
  z-index: 1;
}

#FullScreen .Main .Center .V3DBorder {
  width: 100%;
  height: 486px;
  margin-top: 160px;
  background: url(./assets/moxing.png) no-repeat;
  background-position: 50% 50%;
  background-size: 170% 200%;
}

#FullScreen .Main .Center .Button {
  width: 100%;
  height: 306px;
  margin-top: -05px;
}

.bgDitu {
  position: fixed;
  z-index: -1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: #f003; */
  background: url(./assets/ditu.png) no-repeat;
  background-position: -800px 0;
  background-size: 100%;
}

.bgOverview {
  position: fixed;
  z-index: -1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: #f003; */
  background: url(./assets/wave.png) no-repeat;
  background-position: 0 0;
  background-size: 100%;
}

.bgQuality,
.bgFire {
  position: absolute;
  top: 16%;
  left: 2%;
  width: 100%;
  height: 80%;
  /* background: #f003; */
  background-position: 50% 50%;
  background-size: 170% 200%;
}

.bgFire {
  background: url(./assets/TH.png) no-repeat;
}

.bgQuality {
  background: url(./assets/ZL.png) no-repeat;
}