/* LESS Document */
main {
  /*+++++++++++++++++++++++++++++++++++++++++++
	共通パーツ
+++++++++++++++++++++++++++++++++++++++++++ */
  /*+++++++++++++++++++++++++++++++++++++++++++
	webArea
+++++++++++++++++++++++++++++++++++++++++++ */
  /*+++++++++++++++++++++++++++++++++++++++++++
	systemArea
+++++++++++++++++++++++++++++++++++++++++++ */
  /*+++++++++++++++++++++++++++++++++++++++++++
	maintenanceArea
+++++++++++++++++++++++++++++++++++++++++++ */
  /*+++++++++++++++++++++++++++++++++++++++++++
	ctaArea
+++++++++++++++++++++++++++++++++++++++++++ */
}
main section {
  margin-bottom: 92px;
}
main .columnBox {
  gap: 26px!important;
}
@media screen and (max-width: 767px) {
  main .columnBox {
    gap: 10px!important;
  }
}
main .columnBox .columnItem {
  width: calc((100% / 3) - 26px);
}
@media screen and (max-width: 767px) {
  main .columnBox .columnItem {
    width: calc((100% / 2) - 10px);
  }
}
main .columnBox .columnItem img {
  width: 100%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  margin-bottom: 10px;
  width: 368px;
  height: 268px;
  object-fit: cover;
  object-position: top;
}
@media screen and (max-width: 767px) {
  main .columnBox .columnItem img {
    width: 100%;
    height: 38vw;
  }
}
main .columnBox .columnItem p {
  line-height: 1.3;
}
@media screen and (max-width: 767px) {
  main .platformBox {
    margin-top: 10vw;
  }
}
main .platformBox h3 {
  margin: 10px 0 8px 0;
}
main .platformBox .flex {
  gap: 13px;
  justify-content: flex-start;
}
@media screen and (max-width: 767px) {
  main .platformBox .flex {
    gap: 10px;
    flex-wrap: wrap;
  }
}
main .platformBox .flex .flexItem {
  border: 2px solid #EEEEEE;
  width: calc((100% / 8) - 13px);
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  main .platformBox .flex .flexItem {
    width: calc((100% / 2) - 5px);
    height: 15vw;
  }
}
@media screen and (max-width: 767px) {
  main .platformBox .flex .flexItem img {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain;
  }
}
main .webArea hgroup h2::before {
  background: url(/service/img/web_service_icon.svg) no-repeat center center / contain;
}
main .systemArea {
  margin-bottom: 72px;
}
main .systemArea hgroup h2::before {
  background: url(/service/img/system_service_icon.svg) no-repeat center center / contain;
}
main .maintenanceArea {
  margin-bottom: 31px;
}
main .maintenanceArea hgroup h2::before {
  background: url(/service/img/maintenance_service_icon.svg) no-repeat center center / contain;
}
main .ctaArea {
  margin-bottom: 45px;
}
@media screen and (max-width: 767px) {
  main .ctaArea {
    margin-bottom: 12vw;
  }
}
main .ctaArea .imgBox img {
  width: 760px;
  height: 760px;
  margin: 4px 0 0 81px;
}
@media screen and (max-width: 767px) {
  main .ctaArea .imgBox img {
    width: 100%;
    height: auto;
    margin: 0;
  }
}
main .ctaArea p {
  font-size: 2rem;
  margin-top: -222px;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  main .ctaArea p {
    font-size: 3.5vw;
    margin-top: -23vw;
  }
}
