@charset "UTF-8";
/* =========================================
  child-base.css  (Shapes School)
  - 子ページ共通の土台
========================================= */
#child-hero {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: grid;
  place-items: center;
  margin-top: var(--header-adjust);
  margin-bottom: clamp(40px, 10vw, 96px);
}
.child-title {
  font-size: clamp(32px, 8vw, 48px);
}
.child-sections-gap {
  display: grid;
  width: 100%;
  gap: clamp(40px, 10vw, 96px);
}
#office-info {
  margin-top: clamp(88px, 23vw, 160px);
}

/* ---------------------------------------------------
-背景装飾のスタイル（TOPよりも上部に表示させるよう調節） - 
------------------------------------------------------ */
.bg-circle {
  background-image:
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    ),
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    ),
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    ),
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    ),
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    ),
    radial-gradient(
      circle,
      #f8fafc 0%,
      #eef2f5 60%,
      #eef2f5 60%,
      transparent 60%
    );
  background-size:
    300vw 300vw,
    300vw 300vw,
    300vw 300vw,
    300vw 300vw,
    300vw 300vw,
    300vw 300vw;
  background-position:
    left -20vw top 150vw,
    right -20vw top 650vw,
    left -20vw top 1150vw,
    right -20vw top 1650vw,
    left -20vw top 2150vw,
    right -20vw top 2650vw;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .bg-circle {
    background-size:
      160vw 160vw,
      160vw 160vw,
      160vw 160vw,
      160vw 160vw,
      160vw 160vw,
      160vw 160vw;
    background-position:
      left 20vw top 140vw,
      right 20vw top 340vw,
      left 20vw top 540vw,
      right 20vw top 740vw,
      left 20vw top 940vw,
      right 20vw top 1140vw;
  }
}
@media screen and (min-width: 1024px) {
  .bg-circle {
    background-position:
      left 20vw top 100vw,
      right 20vw top 300vw,
      left 20vw top 540vw,
      right 20vw top 740vw,
      left 20vw top 940vw,
      right 20vw top 1140vw;
  }
}