/* 左端のオレンジ色の点を持つセクション見出し(Figma: section-title)
 * SP: 18px / PC: 24px。1080px以上でPCへ切り替える。 */
.guest-dot-section-title {
  position: relative;
  display: flex;
  width: 356px;
  max-width: 100%;
  min-height: 25px;
  box-sizing: border-box;
  align-items: flex-start;
  gap: 0px;
  padding-left: 20px;
}

.guest-dot-section-title::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 12px;
  height: 25px;
  background-image: radial-gradient(circle at center, var(--color-orange-200) 0 6px, transparent 6px);
  content: "";
}

.guest-dot-section-title--yellow::before {
  background-image: radial-gradient(circle at center, var(--color-yellow-300) 0 6px, transparent 6px);
}

.guest-dot-section-title--green::before {
  background-image: radial-gradient(circle at center, var(--color-green-200) 0 6px, transparent 6px);
}

.guest-dot-section-title__text {
  flex: 1 0 0;
  min-width: 1px;
  margin: 0;
  color: var(--guest-color-text-default);
  font-family: var(--guest-font-family);
  font-size: var(--guest-font-size-lg);
  font-weight: var(--guest-font-weight-bold);
  line-height: var(--guest-line-height-heading);
  word-break: break-word;
}

@media (min-width: 1080px) {
  .guest-dot-section-title {
    min-height: 34px;
  }

  .guest-dot-section-title::before {
    height: 34px;
  }

  .guest-dot-section-title__text {
    flex: none;
    font-size: var(--guest-font-size-2xl);
    white-space: nowrap;
  }
}