body {
  background-image: url('/images/user_cover_background.svg');
  background-size: 1920px 1330px;
  background-position: top right;
  background-repeat: no-repeat;
}
.cover-banner {
  background-size: 750px 750px;
  background-position: center right;
  background-repeat: no-repeat;
  height: calc(100svh - var(--footer-height));
  min-height: 600px;
  display: table;
}
.cover-1 {
  background-image: url('/images/main_image01.png');
}
.cover-2 {
  background-image: url('/images/main_image02.png');
}
.cover-3 {
  background-image: url('/images/main_image03.png');
}
.cover-4 {
  background-image: url('/images/main_image04.png');
}
.cover-5 {
  background-image: url('/images/main_image05.png');
}
.cover-content {
  display: table-cell;
  vertical-align: middle;
  padding-right: 55%;
}
.title:before {
  content: '';
  background-size: 100%;
  height: 29px;
  display: block;
}
.cover-1 .title:before {
  background: url('/images/user_cover_subtitle01.svg') no-repeat;
}
.cover-2 .title:before {
  background: url('/images/user_cover_subtitle02.svg') no-repeat;
}
.cover-3 .title:before {
  background: url('/images/user_cover_subtitle03.svg') no-repeat;
}
.cover-4 .title:before {
  background: url('/images/user_cover_subtitle04.svg') no-repeat;
}
.cover-5 .title:before {
  background: url('/images/user_cover_subtitle05.svg') no-repeat;
}
.desc {
  width: 80%;
  word-break: keep-all;
  line-height: 2.2rem;
}
@media (max-width: 1700px) {
  body {
    background-size: 120%;
  }
}
@media (max-width: 1400px) {
  body {
    background-size: 140%;
  }
  .cover-banner {
    background-size: 550px 550px;
  }
  .cover-content {
    padding-right: 40%;
  }
  .desc {
    width: 70%;
  }
}
@media (max-width: 1200px) {
  body {
    background-size: 170%;
  }
  .cover-banner {
    background-size: 400px 400px;
  }
  .cover-content {
    padding-right: 30%;
  }
  .title:before {
    background-size: 90%;
  }
}
@media (max-width: 992px) {
  body {
    background-size: 200%;
    background-position: top -10% right 15%;
  }
  .cover-banner {
    background-size: 550px 550px;
    background-position: bottom right;
  }
  .cover-content {
    vertical-align: top;
    padding-top: 100px;
    padding-right: 0;
  }
  .desc {
    width: 100%;
  }
}
@media (max-width: 768px) {
  body {
    background-position: top -50% right 40%;
  }
}