.mod {
  position: relative;
  display: block;
  width: 100vw;
  height: 100vh;
}
.hd {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  width: 100vw;
  height: 53.6vw;
  background-color: #1e80ff;
  border-radius: 0.53vw;
}
.layer-wrap {
  position: absolute;
  display: flex;
  left: 0;
  top: 0;
  align-items: center;
  width: 100vw;
  height: 53.6vw;
}
.layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 53.6vw;
}
.wrap {
  position: absolute;
  display: flex;
  left: 0;
  top: 0;
  align-items: flex-start;
  width: 14.67vw;
  height: 19.33vw;
}
.small-item {
  position: absolute;
  left: 0;
  top: 0;
  width: 28.67vw;
  height: 38.33vw;
}
.icon {
  position: relative;
  width: 5.6vw;
  height: 16.27vw;
}
.icon-2 {
  position: relative;
  width: 10.6vw;
  height: 10.87vw;
  margin-top: 8.67vw;
}
.bg-wrap {
  position: relative;
  display: flex;
  align-items: flex-end;
  width: 100vw;
  height: 53.6vw;
}
.text {
  position: absolute;
  left: 33.13vw;
  top: 27.6vw;
  font-size: 6vw;
  font-weight: 600;
  line-height: 4.4vw;
  color: #ffffff;
  white-space: nowrap;
  opacity: 1;
}
.pic {
  position: absolute;
  top: 0;
  right: 0;
  width: 17.2vw;
  height: 53.6vw;
}
.icon-3 {
  position: absolute;
  top: 0;
  right: 0.27vw;
  width: 6vw;
  height: 17.87vw;
}
.img {
  position: absolute;
  top: 1vw;
  right: 0.27vw;
  width: 34.4vw;
  height: 40.93vw;
}
.txt-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 50vw;
  height: 1.47vw;
}
.info {
  position: absolute;
  left: 32.33vw;
  top: 16.2vw;
  font-size: 5vw;
  font-weight: 600;
  line-height: 4.4vw;
  color: #ffffff;
  white-space: nowrap;
  opacity: 1;
}
.submain {
  position: relative;
  align-self: center;
  width: 50vw;
  height: 0.13vw;
  margin-top: 1.6vw;
  background-color: #efefef;
}
.row-1 {
  position: relative;
  align-self: center;
  width: 50vw;
  height: 0.13vw;
  margin-top: 1.33vw;
  background-color: #d8d8d8;
}
.row-3 {
  position: relative;
  align-self: center;
  width: 50vw;
  height: 0.13vw;
  margin-top: 1.33vw;
  background-color: #d8d8d8;
}
.row-5 {
  position: relative;
  align-self: center;
  width: 50vw;
  height: 0.13vw;
  margin-top: 1.73vw;
  background-color: #d8d8d8;
}
.ft {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: flex-end;
  width: 100vw;
  min-height: 6.13vw;
  margin-top: 10.53vw;
  margin-right: 0.27vw;
}
.ft-1 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: flex-end;
  width: 100vw;
  min-height: 6.13vw;
  margin-top: 6vw;
  margin-right: 0.27vw;
}
.action-bg {
  position: absolute;
  display: flex;
  left: 0;
  top: 0;
  justify-content: flex-start;
  align-items: center;
  width: 32.27vw;
  height: 6.13vw;
}
.word-5 {
  position: relative;
  display: block;
  overflow: hidden;
  height: 10vw;
  width: 60vw;
  font-size: 4vw;
  line-height: 10vw;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  white-space: nowrap;
  text-overflow: ellipsis;
  opacity: 1;
  background: #1888F9;
  border-radius: 1vw;
}
.qr-box{
  position: relative;
  border: 3px solid  #1888F9;
  padding: 10vw 5vw;
  border-radius: 10px;
}
.qr-box-title{
  position: absolute;
  text-align: center;
  display: block;
  left: 0px;
  top: 0px;
  background:  #1888F9;
  color: #ffffff;
  width: 30vw;
  height: 5vw;
  padding: 10px 20px;
  left: 50%;
  line-height: 5vw;
  translate: -50% -50%;
  border-radius: 5vw;
  font-size: 4vw;
}
.qr-img{
  position: relative;
  display: block;
  width: 50vw;
  height: 50vw;
  border: 2px solid  #91c5f9;
  border-radius: 5px;
}