.bg {
  width: 100%;
  min-height: 100vh;
  background-image: url('./img/new/1.png');
  background-size: 100% 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  padding-bottom: 30px;
}

.header {
  width: 100%;
  position: absolute;
  z-index: 0;
}

.link-content {
  width: calc(100vw / 390 * 360);
  height: calc(100vw / 390 * 200);
  background-image: url('./img/new/3.png');
  background-size: 100% 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 calc(100vw / 390 * 10);
  margin-top: calc(100vw / 390 * 64);
}

.link {
  max-width: calc(100vw / 390 * 220);
  height: calc(100vw / 390 * 40);
  color: #ffffff;
  font-size: clamp(14px, 3.2vw, 16.5);
  line-height: calc(100vw / 390 * 40);
  padding: 0 calc(100vw / 390 * 10);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.copy {
  width: calc(100vw / 390 * 60);
}

.download {
  width: calc(100vw / 390 * 200);
  height: calc(100vw / 390 * 50);
  margin-top: calc(100vw / 390 * 10);
  display: block;
  background-image: url('./img/new/5.png');
  background-size: 100% 100%;
}

.download-app {
  display: block;
  width: 100%;
  height: 100%;
}

.qr-content {
  width: calc(100vw / 390 * 360);
  height: calc(100vw / 390 * 320);
  background-image: url('./img/new/6.png');
  background-size: 100% 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  margin-top: calc(100vw / 390 * 300);
}

#qrcode {
  width: calc(100vw / 390 * 210);
  height: calc(100vw / 390 * 210);
  background-color: #ffffff;
  margin-top: calc(100vw / 390 * 60);
  display: flex;
  align-items: center;
  justify-content: center
}

.msg {
  width: calc(100vw / 390 * 320);
  color: #ffffff;
  font-size: clamp(14px, 3.2vw, 16px);
}

.msg div {
  margin-top: calc(100vw / 390 * 12);
  line-height: calc(100vw / 390 * 22);
}