.banner {
  display: grid;
  grid-template-columns: calc(50vw - 15px - (50vw - 50%)) calc(50vw + 15px - (50vw - 50%));
  height: 28rem;
}
@media (max-width: 768px) {
  .banner {
    grid-template-columns: 100%;
    height: auto;
  }
}
.banner__imagewrap {
  background-color: #95bb21;
}
.banner__image {
  display: block;
  width: calc(50vw - 30px);
  max-width: 540px;
  height: 28rem;
  object-fit: cover;
  margin-left: auto;
}
@media (max-width: 768px) {
  .banner__image {
    width: calc(100vw - (100vw - 100%));
    max-width: none;
    max-height: 80vw;
    margin: 0 auto;
  }
}
.banner__textwrap {
  background-image: linear-gradient(120deg, #ec671a 0 40%, rgba(236, 103, 26, 0.0509803922) 100%);
  display: flex;
  align-items: center;
  height: 28rem;
  overflow-y: auto;
}
@media (max-width: 768px) {
  .banner__textwrap {
    display: block;
    height: auto;
    overflow-y: initial;
  }
}
.banner__text {
  width: calc(50vw - 15px);
  max-width: 555px;
  padding: 30px 0 30px 30px;
  box-sizing: border-box;
  container-name: bannertext;
  container-type: inline-size;
}
@media (max-width: 768px) {
  .banner__text {
    width: calc(100vw - 60px - (100vw - 100%));
    max-width: none;
    margin: 0 auto;
    padding: 30px 0;
  }
}
.banner__text h1 {
  font-weight: 500;
  line-height: 1.16667;
  margin: 0 0 30px;
  hyphens: auto;
}
@media (min-width: 768px) {
  @container bannertext (width < 27.5rem) {
    .banner__text h1 {
      font-size: 3rem;
    }
  }
  @container bannertext (width < 25rem) {
    .banner__text h1 {
      font-size: 2.6667rem;
    }
  }
  @container bannertext (width < 22.5rem) {
    .banner__text h1 {
      font-size: 2.25rem;
    }
  }
}
.banner__text p {
  font-size: 1.2rem;
  margin-bottom: 0;
}

/*# sourceMappingURL=ce-banner.css.map */