.section-image-banner {
  position: relative;
  margin: 0 auto;
}
.image-banner-pc {
  display: block;
}
.image-banner-mobile {
  display: none;
}
@media (max-width: 767px) {
  .image-banner-pc {
    display: none;
  }
  .image-banner-mobile {
    display: block;
  }
  .m-full-page{
    padding-left: 0!important;
    padding-right: 0!important;
  }
}

.image-banner--container {
  display: flex;
  position: relative;
}
.image-banner--m-flatten .image-banner--container {
  flex-direction: column;
}
.image-banner--m-normal .image-banner--container {
  flex-direction: row;
}

.image-banner__item {
  flex: 1;
  position: relative;
}
.image-banner__link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
  display: block;
}

/* Banner height sizes */
.banner-item-wrapper--size-low {
  height: 250px;
}
.banner-item-wrapper--size-middle {
  height: 450px;
}
.banner-item-wrapper--size-high {
  height: 600px;
}
.banner-item-wrapper--size-none {
  height: auto;
}
@media (min-width: 768px) {
  .banner-item-wrapper--size-low {
    height: 450px;
  }
  .banner-item-wrapper--size-middle {
    height: 750px;
  }
  .banner-item-wrapper--size-high {
    height: 1080px;
  }
}

.banner-item-wrapper {
  overflow: hidden;
  position: relative;
}
.banner-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Mask overlay */
.mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  pointer-events: none;
  z-index: 2;
}

/* Content positioning */
.content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  z-index: 5;
  pointer-events: none;
}
.content .wrapper {
  pointer-events: auto;
}
.content--pos-left-top { align-items: flex-start; justify-content: flex-start; }
.content--pos-top { align-items: flex-start; justify-content: center; }
.content--pos-right-top { align-items: flex-start; justify-content: flex-end; }
.content--pos-left { align-items: center; justify-content: flex-start; }
.content--pos-center { align-items: center; justify-content: center; }
.content--pos-right { align-items: center; justify-content: flex-end; }
.content--pos-left-bottom { align-items: flex-end; justify-content: flex-start; }
.content--pos-bottom { align-items: flex-end; justify-content: center; }
.content--pos-right-bottom { align-items: flex-end; justify-content: flex-end; }

/* Text alignment */
.pc-content-text-left, .mobile-content-text-left { text-align: left; }
.pc-content-text-center, .mobile-content-text-center { text-align: center; }
.pc-content-text-right, .mobile-content-text-right { text-align: right; }

/* Wrapper styles */
.wrapper {
  padding: 20px;
}
.wrapper--has-bg {
  background-color: rgba(255, 255, 255, 0.85);
}
.wrapper--no-bg {
  background: transparent;
  color: #fff;
}

/* Mobile content flow */
.content-m--normal-flow {
  position: relative;
  height: auto;
}
.content-m-no-bg {
  position: absolute;
}

/* Controls */
.control-wrap {
  margin-top: 15px;
}
.control {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

.default-image {
  width: 100%;
  height: 300px;
}