.l-container--serviceintroduction {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .l-container--serviceintroduction {
    min-width: 295px;
    width: 95%;
  }
}

.section-banner-serviceintroduction {
  background-image: url(/wp-content/themes/blank/img/serviceintroduction/serviceintroduction_bg_text.svg);
  background-repeat: no-repeat;
  background-position: center 0px;
}

.serviceintroduction_subtitle {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 150%;
  letter-spacing: 0.15em;
  color: #888888;
}

.serviceintroduction_title {
  font-size: 48px;
  letter-spacing: 0.05em;
}

.serviceintroduction_description {
  line-height: 200%;
  letter-spacing: 0em;
  padding-bottom: 40px;
}

.scrollButtonList {
  display: flex;
  justify-content: center;
}

.scrollButton {
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background: #edf4ff;
}

.serviceintroduction_dxTitle,
.serviceintroduction_bPassTitle,
.serviceintroduction_serviceintroduction_bPassTitleTitle {
  width: 100%;
  font-size: 40px;
}

.serviceintroduction_dxDescription,
.serviceintroduction_bPassDescription,
.serviceintroduction_consultingDescription {
  text-align: center;
  margin: 0 8px;
}

.serviceintroduction_dxContent {
  display: flex;
  align-items: center;
}

.serviceintroduction_dxContentImage {
  flex: 1;
}

.serviceintroduction_dxContentDetail {
  display: grid;
  justify-items: center;
  flex: 1;
}

.serviceintroductionPage_button {
  display: flex;
  align-items: center;
  border: 3px solid #6eb6db;
  background: #fff;
  color: #3c4855;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: 0.05em;
  height: 58px;
}

.serviceintroduction_dxContentSupplement {
  font-family: "Noto Serif JP", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 150%;
  letter-spacing: 0.05em;
}

.serviceintroduction_serviceLinkWrapper {
  display: flex;
  justify-content: center;
}

.serviceintroduction_serviceLink {
  border: 1px solid #e5dfdb;
  width: 280px;
  height: 120px;
  margin: 1.5rem;
}

[class^="serviceintroduction_serviceLink-"] {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 54px;
  height: 54px;
  border-top-left-radius: 100px;
}

.serviceintroduction_serviceLink-bank {
  background: #cca44e;
}

.serviceintroduction_serviceLink-sales {
  background: #5eb6db;
}

.serviceintroduction_serviceLink-pro {
  background: #3d75ca;
}

.serviceintroduction_serviceLink-smes {
  background: #f08438;
}

.serviceintroduction_serviceLink-forstartup {
  background: #fd7a72;
}

.serviceintroduction_serviceLink-poweredByGpt {
  background: #2a976a;
}

.serviceintroduction_serviceLink-maeHojyo {
  background: #ff0000;
}

.serviceintroduction_serviceLink-forEsg {
  background: #41ba44;
}

.serviceintroduction_serviceLink-forLease {
  background: #7f7f7f;
}

.serviceintroduction_serviceLink-regionalRevitalization {
  background: #ba4a00;
}

.serviceintroduction_serviceLink-professional {
  background: #7dc12f;
}

.serviceintroduction_serviceLink-consulting {
  background: #3d75ca;
}

[class^="serviceintroduction_serviceLinkText-"] {
  font-weight: bold;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0.05em;
}

.serviceintroduction_serviceLinkText-bank {
  color: #cca44e;
}

.serviceintroduction_serviceLinkText-sales {
  color: #5eb6db;
}

.serviceintroduction_serviceLinkText-pro {
  color: #3d75ca;
}

.serviceintroduction_serviceLinkText-smes {
  color: #f08438;
}

.serviceintroduction_serviceLinkText-forstartup {
  color: #fd7a72;
}

.serviceintroduction_serviceLinkText-poweredByGpt {
  color: #2a976a;
}

.serviceintroduction_serviceLinkText-maeHojyo {
  color: #ff0000;
}

.serviceintroduction_serviceLinkText-forEsg {
  color: #41ba44;
}

.serviceintroduction_serviceLinkText-regionalRevitalization {
  color: #ba4a00;
}

.serviceintroduction_serviceLinkText-forLease {
  color: #7f7f7f;
}

.serviceintroduction_serviceLinkText-professional {
  color: #7dc12f;
}

.serviceintroduction_serviceLinkText-consulting {
  color: #3d75ca;
}

@media screen and (max-width: 768px) {
  .section-banner-serviceintroduction {
    background-position: center 20px;
    background-size: 340px;
  }

  .serviceintroduction_subtitle,
  .serviceintroduction_description {
    font-size: 14px;
  }

  .serviceintroduction_title {
    font-size: 20px;
  }

  .serviceintroduction_dxTitle,
  .serviceintroduction_bPassTitle,
  .serviceintroduction_serviceintroduction_bPassTitleTitle {
    font-size: 24px;
  }

  .serviceintroduction_dxDescription,
  .serviceintroduction_bPassDescription,
  .serviceintroduction_consultingDescription {
    font-size: 16px;
    text-align: unset;
  }

  #dx {
    flex-direction: column;
  }

  .serviceintroduction_dxContent {
    flex-direction: column-reverse;
  }

  .serviceintroduction_dxContentDetailDescription {
    font-size: 12px;
  }

  .serviceintroductionPage_button {
    font-size: 16px;
  }

  .serviceintroduction_dxContentSupplement {
    font-size: 9.69px;
  }

  .serviceintroduction_serviceLinkWrapper {
    flex-direction: column;
    align-items: center;
  }

  .serviceintroduction_serviceLink {
    margin: 16px;
  }

  .serviceintroduction_serviceLink.hiddenLink {
    display: none;
  }
}

@media screen and (min-width: 700px) {
  .scrollButton {
    width: 221px;
    height: 100px;
  }

  .scrollButton_mvvr {
    width: 140px;
  }
}

@media screen and (max-width: 699px) {
  .scrollButtonList {
    flex-direction: column;
    align-items: center;
  }

  .scrollButton {
    margin: 4px;
    width: 100%;
    height: 45px;
  }
}
