/* 斜めの面と四角を重ね、余白にも庭のような奥行きを添えます。 */
.section,
.page-heading,
.page-main {
  position: relative;
  isolation: isolate;
}

.section,
.page-heading {
  overflow: clip;
}

.section::before,
.page-heading::before,
.page-main::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: 54%;
  height: 78%;
  right: 0;
  top: 12%;
  background: linear-gradient(135deg, rgba(203, 221, 191, .43), rgba(235, 243, 228, .16));
  clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%);
}

.section::after,
.page-heading::after,
.page-main::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: 28%;
  height: 56%;
  top: 27%;
  right: 12%;
  border: 1px solid rgba(184, 168, 129, .23);
  background: linear-gradient(115deg, rgba(224, 212, 179, .25), rgba(255, 255, 255, .22));
}

.section.strengths::before,
.section.works::before {
  left: 0;
  right: auto;
  width: 46%;
  clip-path: polygon(0 0, 100% 0, 80% 100%, 0 100%);
  background: linear-gradient(145deg, rgba(229, 217, 184, .32), rgba(240, 246, 232, .19));
}

.section.strengths::after,
.section.works::after {
  left: 12%;
  right: auto;
  background: rgba(255, 255, 255, .22);
  border-color: rgba(117, 147, 99, .24);
}

.section.news-section::before {
  width: 48%;
  height: 88%;
  top: 6%;
}

.section.news-section::after {
  right: 5%;
  top: 17%;
  height: 66%;
  background: rgba(255, 255, 255, .28);
}

.service-grid {
  background: rgba(255, 255, 255, .82);
}

.news-list {
  background: rgba(255, 255, 255, .46);
  padding-inline: 20px;
}

.company-section::before {
  background: linear-gradient(135deg, rgba(203, 221, 191, .53), rgba(234, 243, 226, .2));
}

.company-section::after {
  background: linear-gradient(115deg, rgba(218, 204, 165, .34), rgba(255, 255, 255, .26));
  border-color: rgba(184, 168, 129, .25);
}

.page-heading::before {
  width: 45%;
  height: 100%;
  top: 0;
}

.page-heading::after {
  width: 25%;
  height: 68%;
  top: 18%;
  right: 6%;
  background: rgba(255, 255, 255, .27);
}

.page-main::before {
  width: 47%;
  height: 72%;
  top: 9%;
  background: linear-gradient(145deg, rgba(213, 230, 201, .32), rgba(243, 247, 238, .08));
}

.page-main::after {
  width: 35%;
  height: 43%;
  top: 32%;
  right: 7%;
  background: linear-gradient(120deg, rgba(230, 220, 194, .19), rgba(255, 255, 255, .14));
}

@media (max-width: 760px) {
  .section::before { width: 78%; height: 86%; top: 7%; }
  .section::after { width: 58%; right: 7%; height: 62%; top: 23%; }
  .section.strengths::before,
  .section.works::before { width: 72%; }
  .section.strengths::after,
  .section.works::after { left: 7%; right: auto; }
  .section.news-section::before { width: 76%; }
  .section.news-section::after { width: 63%; }
  .news-list { padding-inline: 14px; }
  .page-heading::before { width: 65%; }
  .page-heading::after { width: 43%; }
  .page-main::before { width: 71%; }
  .page-main::after { width: 58%; right: 3%; }
}
