@charset "UTF-8";

.page_web-advertising .page_title::before {
  content: "service";
}

#advertising_worry {
  background: var(--grey);
}
#advertising_worry .inner {
  max-width: 78rem;
  margin: 0 auto;
  @media (min-width:768px) {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
  }

  &::after {
    display: block;
    content: "";
    width: 36%;
    aspect-ratio: 172 / 223;
    margin: 2rem auto 0;
    background: url(/assets/img/common/worry_illust.png) no-repeat center / contain;
    @media (min-width:768px) {
      width: 26%;
      margin: 0 auto;
    }
  }
  .content_block {
    width: fit-content;
    margin: 0 auto;
    @media (min-width:768px) {
      width: 63%;
    }
  }
}
#advertising_worry .block_title {
  width: fit-content;
  margin: 0 auto 1em;
  @media (min-width:768px) {
    margin: 0 auto 1em 0;
  }

  &::after {
    display: block;
    content: "";
    width: 100%;
    height: 0.9rem;
    margin-top: 1rem;
    background: url(/assets/img/common/border_wave.svg) no-repeat center / 100% auto;
  }
}
#advertising_worry .worry_list {
  list-style: none;

  & li {
    display: flex;
    font-weight: 700;
    align-items: flex-start;
    gap: 0.5em;

    &::before {
      display: block;
      content: "";
      flex-shrink: 0;
      width: 1.5em;
      height: 1.5em;
      padding: 0 0.3em;
      background: url(/assets/img/common/icon_check.svg) no-repeat center / 75% ,#FFF;
      border-radius: 50%;
      position: relative;
      top: 0.2em;
    }
    + li {
      margin-top: 1em;
    }
  }
}
#advertising_service .selling_point {
  color: #FFF;
  font-size: var(--fs-block-title);
  text-align: center;
  line-height: 1.5;
  width: fit-content;
  margin: 0 auto 2em;
  padding: 0.5em 1em;
  background: var(--key-color);
}
#advertising_service .selling_point_text {
  font-weight: 700;
  width: fit-content;
  margin: 0 auto 6rem;
  @media (min-width:768px) {
    margin: 0 auto 10rem;
  }
}
.service_content .point_list {
  list-style: none;

  & li {
    display: flex;
    font-weight: 700;
    align-items: flex-start;
    gap: 0.5em;

    &::before {
      display: block;
      content: "";
      flex-shrink: 0;
      width: 1.5em;
      height: 1.5em;
      padding: 0 0.3em;
      background-color: var(--key-color);
      background-image: url("data:image/svg+xml,%3Csvg width='17' height='12' viewBox='0 0 17 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.4743 0L7.17544 7.29883L2.35058 2.47431L0 4.82453L4.82486 9.64938L7.17544 12L9.52569 9.64938L16.8249 2.35062L14.4743 0Z' fill='%23FFFFFF'/%3E%3C/svg%3E%0A");
      background-repeat: no-repeat;
      background-position: center;
      background-size: 65%;
      border-radius: 50%;
      position: relative;
      top: 0.2em;
    }
    + li {
      margin-top: 1em;
    }
  }
}