.c-bg-1 {
  background-color: #E74948;
}

.c-bg-2 {
  background-color: #B51747;
}

.c-bg-3 {
  background-color: #7EBCC5;
}

.c-bg-1-o {
  background-color: #E74948dc;
}

.c-bg-2-o {
  background-color: #b51746dc;
}

.c-bg-3-o {
  background-color: #7ebcc5dc;
}

.cast-outer {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}

.cast {
  position: relative;
  width: 31%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}

.cast-logo {
  position: absolute;
  width: 50%;
  top: -15%;
  left: -3%;
}

.cast-title {
  width: 100%;
  margin: 0 0 4%;
  padding: 0 0 0 52%;
  color: #fff;
  font-size: 20px;
  font-weight: 800;
}

.main-cast-item {
  position: relative;
  width: 53%;
  margin: 0 4.8% 0 0;
}

.cast-item {
  width: 42.2%;
}

.cast-item-thumb {
  position: relative;
}

.cast-item-thumb:first-child {
  margin: 0 0 10%;
}

.main-cast-item img,
.cast-item img,
.cast-logo img {
  width: 100%;
  line-height: 0;
  vertical-align: text-bottom;
}

.main-name {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0.1em 0;
  text-align: center;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
}

.name {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0.1em 0;
  text-align: center;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
}

.cast-sns {
  position: absolute;
  width: 22%;
  top: 0;
  right: 0;
  padding: 0.5em 0.5em 0 0.5em;
}

.cast-sns img:first-child {
  margin: 0 0 0.2em;
}

@media screen and (min-width: 1px) and (max-width: 743px) {
  .cast {
    width: 100%;
    margin: 0 0 4.5rem;
  }

  .cast:first-child {
    margin: 1rem 0 4.5rem;
  }

  .cast:last-child {
    margin: 0;
  }

  .cast-title {
    font-size: 5.33vw;
  }

  .main-name {
    font-size: 4.27vw;
  }

  .name {
    font-size: 3.73vw;
  }

}

@media screen and (min-width: 744px) and (max-width: 1024px) {
  .cast-title {
    font-size: 2vw;
  }

  .main-name {
    font-size: 1.43vw;
  }

  .name {
    font-size: 1.30vw;
  }

  .cast-sns {
    width: 25%;
    padding: 0.3em 0.3em 0 0.3em;
  }

  .cast-sns img:first-child {
    margin: 0 0 0.1em;
  }

}