.hero.type--solid-color {
  height: 780px;
}
.hero.type--solid-color .box-1440 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
}
@media (max-width: 1600px) {
  .hero.type--solid-color .box-1440 {
    padding-right: 0px;
  }
}
.hero.type--solid-color .content-container {
  color: white;
  padding-top: 10rem;
  padding-bottom: 3rem;
  width: 40%;
  max-width: 576px;
}
.hero.type--solid-color .content-container h1 {
  max-width: 850px;
  flex-wrap: wrap;
}
.hero.type--solid-color .content-container h1 span {
  padding-right: 1rem;
}
.hero.type--solid-color .content-container p {
  max-width: 485px;
  line-height: 140%;
}
.hero.type--solid-color .content-container ul {
  padding: 5px 0px;
}
.hero.type--solid-color .content-container ul li {
  display: block;
}
.hero.type--solid-color .image-container {
  width: 60%;
  max-width: 864px;
  overflow: hidden;
}
.hero.type--solid-color .image-container img {
  width: unset;
  height: unset;
}
.hero.type--solid-color.narrow {
  height: 580px;
}
.hero.type--solid-color.narrow .image-container {
  width: 60%;
  max-width: 864px;
  overflow: hidden;
  text-align: center;
}
.hero.type--solid-color.narrow .image-container img {
  width: auto;
  height: 580px;
}
.hero.type--photo {
  position: relative;
  background-position-x: 50%;
  background-position-y: 0%;
  background-size: cover;
  height: 780px;
  margin: 0 auto;
}
.hero.type--photo .content-container {
  position: absolute;
  z-index: 100;
  bottom: 0px;
  padding-bottom: 3rem;
}
.hero.type--photo .content-container h1 {
  text-transform: uppercase;
  display: flex;
  max-width: 650px;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.hero.type--photo .content-container h1 span {
  display: inline-block;
  background-color: #f2f2f2;
  margin: 0 0 0.5rem 0;
  text-wrap: nowrap;
  padding: 0.313rem 1rem 0 1rem;
}
.hero.type--photo .content-container ul {
  padding: 5px 0px;
}
.hero.type--photo .content-container ul li {
  display: block;
}
.hero.type--photo.narrow {
  height: 580px;
}
.hero.type--square {
  height: 780px;
}
.hero.type--square .box-1440 {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
}
@media (max-width: 1600px) {
  .hero.type--square .box-1440 {
    padding-right: 0px;
  }
}
.hero.type--square .content-container {
  color: white;
  padding-top: 12rem;
  padding-bottom: 3rem;
  width: 40%;
  max-width: 576px;
}
.hero.type--square .content-container p {
  max-width: 485px;
  line-height: 140%;
}
.hero.type--square .content-container ul {
  padding: 5px 0px;
}
.hero.type--square .content-container ul li {
  display: block;
}
.hero.type--square .image-container {
  width: 60%;
  max-width: 820px;
  overflow: hidden;
}
.hero.type--square .image-container img {
  margin-top: 100px;
}
.hero.type--square.narrow {
  height: 580px;
}
.hero.type--square.narrow .image-container {
  width: 60%;
  max-width: 864px;
  overflow: hidden;
  text-align: center;
}
.hero.type--square.narrow .image-container img {
  width: auto;
  height: 580px;
}
.hero.type--right {
  position: relative;
  background-position-x: right;
  background-position-y: 0%;
  background-size: 55% auto;
  background-repeat: no-repeat;
  height: 780px;
  margin: 0 auto;
}
.hero.type--right .box-1440 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  overflow: hidden;
}
@media (max-width: 1600px) {
  .hero.type--right .box-1440 {
    padding-right: 0px;
  }
}
.hero.type--right .content-container {
  padding-top: 12rem;
  padding-bottom: 3rem;
  width: 40%;
  max-width: 576px;
}
.hero.type--right .content-container p {
  max-width: 485px;
  line-height: 140%;
}
.hero.type--right .content-container ul {
  padding: 5px 0px;
}
.hero.type--right .content-container ul li {
  display: block;
}
.hero.type--right .image-container {
  width: 60%;
  max-width: 864px;
  overflow: hidden;
}
.hero.type--right .image-container img {
  margin-top: 100px;
  width: unset;
  height: unset;
}
.hero .img_box {
  width: 100%;
  overflow: hidden;
  position: relative;
}
.hero .img_box.horizontal {
  aspect-ratio: 16/9;
}
.hero .img_box.vertical {
  aspect-ratio: 9/16;
}
.hero .img_box.square {
  aspect-ratio: 1/1;
}
.hero .img_box img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}