.circular-image-upper {
  transform: translateY(50px);
  opacity: 0;
  transition:
    opacity 1s ease,
    transform 1s ease;
}

.active {
  transform: translateY(0px);
  opacity: 1;
}

.circular-area {
  display: grid;
  justify-content: center;
  column-gap: 48px;
  grid-template-columns: 480px 400px;

  @media only screen and (max-width: 1099.02px) {
    grid-template-columns: 1fr;
  }
}

.circular-text-in-btn {
  margin-top: 48px !important;
  @media only screen and (max-width: 1099.02px) {
    display: flex;
    margin-top: 40px !important;
    justify-content: center;
    align-items: center;
  }
}

.c-text-a {
  margin-bottom: 48px;

  @media only screen and (max-width: 1099.02px) {
    text-align: center;
    margin-bottom: 32px;
  }
}

.c-h2-a {
  margin-bottom: 32px !important;
}

.c-linkCard__imagewrap.circular-imagewrap {
  margin-top: 0px !important;
}

.c-linkCard__imageInner.c-linkCard__imageInner--noRatio.circular-inner {
  margin-bottom: 0px;
}

.c-linkCard__imageInner.c-linkCard__imageInner--noRatio.circular-inner img {
  @media only screen and (max-width: 1099.02px) {
    max-width: 500px;
  }
}

.c-linkCard__item.c-linkCard__item--layout1 {
  align-content: center;
}

.c-linkCard__item.c-linkCard__item--layout1.circular-text {
  align-content: start;
}

.c-linkCard__textwrap {
  margin-top: 36px;
}

.c-linkCard__inner {
  @media only screen and (max-width: 1099.02px) {
    justify-content: center;
    align-items: center;
  }
}

.c-h2-a__text {
  @media only screen and (max-width: 1099.02px) {
    font-size: 24px !important;
  }
}

.c-text-a__text.description {
  line-height: 1.6 !important;
}

.c-text-a:not(.c-text-a--thin) .c-text-a__text {
  @media only screen and (max-width: 1099.02px) {
    font-size: 15px;
  }
}

.three-changes-btn {
  margin-top: 64px;

  @media only screen and (max-width: 1099.02px) {
    margin-top: 32px;
  }
}

.contents-text {
  .pc-only {
    display: inline;

    @media only screen and (max-width: 1099.02px) {
      display: none;
    }
  }
}

.contents-text + .contents-text {
  margin-top: 28.8px;
}

.c-figure.three-changes-inner {
  margin-top: 48px !important;
}

.c-button-a.c-button-a--red.c-button-a--arrow.c-button-a--iconWhite.case-study-btn {
  margin-top: 40px;
}

.c-button-a:not(.c-button-a--thin):not(.c-button-a--small) {
  @media only screen and (max-width: 1099.02px) {
    display: flex !important;
    justify-content: center;
    align-items: center;
    margin: auto;
  }
}

.case-study-box {
  position: relative;
  margin-top: 40px;

  @media only screen and (max-width: 1099.02px) {
    margin-top: 24px;
  }
}

.case-study-lead {
  font-size: 24px;
  line-height: 1.6;

  @media only screen and (max-width: 1099.02px) {
    font-size: 22px;
  }
}

.case-study-img {
  position: absolute;
  left: 0;
  top: -88px;
  width: 49.1%;
  height: clamp(300px, calc(100vw / 3.6), 400px);

  @media only screen and (max-width: 1099.02px) {
    op: -64px;
    width: 78.6%;
    height: clamp(120px, calc(100vw / 2.2), 400px);
  }
}
.case-study-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  position: relative;
  z-index: 1;
}
.case-study-text-content {
  margin-left: auto;
  margin-top: 136px;
  width: 67.8%;
  background-color: #f5faf9;
  padding: clamp(50px, calc(100vw / 16), 96px) 40px
    clamp(40px, calc(100vw / 18), 80px) 21.3%;
  box-sizing: border-box;

  @media only screen and (max-width: 1099.02px) {
    margin-top: 120px;
    width: 100%;
    padding: clamp(30px, calc(100vw / 2.55), 365px) 16px 64px;
  }
}
.case-study-text {
  margin-top: 0;
  line-height: 2;

  @media only screen and (max-width: 1099.02px) {
    font-size: 15px;
    line-height: 1.8;
  }
}

.case-study-btn {
  max-width: 400px;
  min-height: 70px;
  margin-top: 48px;
  display: inline-block;

  @media only screen and (max-width: 1099.02px) {
    height: 50px;
    margin-top: 32px;
    margin-right: auto;
    margin-left: auto;
    display: block;
  }
}

.case-study-btn:hover {
  text-decoration: none;
}

.case-study-btn::after {
  right: 30px;
  @media only screen and (max-width: 1099.02px) {
    width: 14px;
    height: 14px;
    right: 10px;
  }
}

.case-study-btn.c-button-a:not(.c-button-a--small).c-button-a__text {
  @media only screen and (max-width: 1099.02px) {
    font-size: 15px;
  }
}

#section01 {
  padding-top: 0;
  padding-bottom: 100px;

  @media only screen and (max-width: 1099.02px) {
    padding-bottom: 64px;
  }
}

#section02 {
  background-color: #f5faf9;

  @media only screen and (max-width: 1099.02px) {
    padding-top: 56px;
    padding-bottom: 64px;
  }
}

#section03 {
  @media only screen and (max-width: 1099.02px) {
    padding-top: 56px;
    padding-bottom: 64px;
  }
}

#section04 {
  background-color: #f5faf9;

  @media only screen and (max-width: 1099.02px) {
    padding-top: 56px;
  }
}

.c-h2-a.margin-bottom-variable {
  @media only screen and (max-width: 1099.02px) {
    margin-bottom: 24px !important;
  }
}