@charset "UTF-8";

/* 親子で園体験（親子サークル） */
.circle-page .global-nav__link[aria-current="page"] { color: var(--green-dark); }
.circle-page .man3-hero { min-height: 700px; }
.circle-page .man3-hero__photo img { object-position: center 46%; }
.circle-page .man3-hero__copy { width: min(950px,88%); }
.circle-page .man3-hero__copy h1 { font-size: 36px; }
.circle-page .hero__badge-body { min-width: 0; }
.circle-hero-note { display: inline-block; width: fit-content; margin: 14px auto 0!important; padding: 7px 18px; border-radius: 999px; background: #ffec87; color: #34483c!important; font-size: 14px!important; font-weight: 700!important; }
.circle-page .man3-hero__deco--grass-left { left: max(105px,calc(50% - 545px)); width: 72px; }
.circle-page .man3-hero__deco--slide { left: max(205px,calc(50% - 455px)); top: 382px; width: 120px; }
.circle-page .man3-hero__deco--flower { right: max(190px,calc(50% - 480px)); top: 380px; width: 62px; }
.circle-page .man3-hero__deco--grass { right: max(280px,calc(50% - 400px)); top: 520px; width: 40px; }
.circle-page .circle-hero__grass-right { right: max(192px,calc(50% - 488px)); top: 570px; width: 30px; }

.circle-bg { position: absolute; z-index: 1; max-width: none; pointer-events: none; }
.circle-bg--hero-stripes { right: -45px; bottom: 35px; width: 260px; opacity: .28; }
.circle-bg--activities-triangles { left: -65px; top: 55px; width: 295px; opacity: .42; }
.circle-bg--activities-dots { right: -45px; bottom: 70px; width: 230px; opacity: .12; }
.circle-bg--info-stripes { left: 7%; top: 78px; width: 360px; opacity: .5; }

.circle-activities { position: relative; overflow: hidden; padding: 20px 0 55px; background: #f8f6f0; }
.circle-activities .man3-inner,.circle-info .man3-inner { position: relative; z-index: 2; }
.circle-activities__deco { position: absolute; z-index: 2; right: max(20px,calc(50% - 780px)); top: 35px; width: 56px; pointer-events: none; }
.circle-activities__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px; margin-top: 34px; }
.circle-activity-card { padding: 34px 38px; border-radius: 24px; background: #fff; }
.circle-activity-card h3 { display: flex; align-items: center; gap: 14px; margin: 0 0 22px; color: #31483a; font-size: 22px; }
.circle-activity-card h3::before { content: ""; width: 6px; height: 38px; flex: 0 0 6px; border-radius: 6px; background: linear-gradient(#64c66e 0 50%,#aade89 50%); }
.circle-activity-card ul { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.circle-activity-card li { position: relative; padding-left: 31px; color: #526055; font-size: 16px; font-weight: 700; line-height: 1.75; }
.circle-activity-card li::before { content: "✓"; position: absolute; left: 0; top: 3px; display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; background: #86d078; color: #fff; font-size: 12px; }
.circle-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.circle-gallery img { width: 100%; height: 220px; border: 10px solid #fff; border-radius: 22px; object-fit: cover; box-shadow: 6px 8px 0 rgba(206,195,173,.42); }

.circle-info { position: relative; overflow: hidden; padding: 90px 0 110px; background: #eef6dd; }
.circle-info::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 26px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 26' preserveAspectRatio='none'%3E%3Cpath fill='%23f8f6f0' d='M0 0h1440v20c-80 0-160-16-240-16s-160 16-240 16S800 4 720 4 560 20 480 20 320 4 240 4 80 20 0 20V0z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.circle-info__pattern { position: absolute; right: -55px; bottom: 5px; width: 330px; opacity: .9; }
.circle-info__deco { position: absolute; z-index: 3; left: max(30px,calc(50% - 670px)); bottom: 35px; width: 100px; }
.circle-info__card { position: relative; z-index: 2; width: min(920px,100%); margin: 0 auto; padding: 38px 46px; border-radius: 26px; background: #fff; box-shadow: 0 12px 28px rgba(75,95,53,.08); }
.circle-info__card dl { margin: 0; }
.circle-info__card dl > div { display: grid; grid-template-columns: 180px 1fr; align-items: center; padding: 17px 0; border-bottom: 1px dashed #cdc9b9; }
.circle-info__card dt,.circle-info__card dd { margin: 0; color: #526055; font-size: 16px; font-weight: 700; }
.circle-info__card dt { color: #31483a; }
.circle-info__card dd strong { color: #58ad42; font-size: 22px; }
.circle-info__unit { font-size: 1em; }
.circle-info__card dd a { margin-left: 12px; color: #55a64e; text-decoration: underline; text-underline-offset: 4px; }
.circle-info__card > p { margin: 24px 0 0; color: #6c776f; font-size: 14px; line-height: 1.9; }

@media (max-width:1024px) {
  .circle-page .fcontact__wave { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='26' viewBox='0 0 240 26' preserveAspectRatio='none'%3E%3Cpath fill='%23eef6dd' d='M0,0 H240 V22 C220,18 200,18 180,22 C160,26 140,26 120,22 C100,18 80,18 60,22 C40,26 20,26 0,22 Z'/%3E%3C/svg%3E"); }
  .circle-page .man3-hero__deco,.circle-activities__deco,.circle-info__deco { display: none; }
  .circle-bg--activities-triangles { left: -125px; }
  .circle-bg--info-stripes { left: 4%; width: 320px; }
}

@media (max-width:600px) {
  .circle-page .man3-hero { min-height: 560px; }
  .circle-page .man3-hero__copy { width: 100%; }
  .circle-page .man3-hero__copy h1 { font-size: 23px; }
  .circle-page .hero__badge-body { min-width: 0; font-size: 14px; }
  .circle-hero-note { font-size: 12px!important; }
  .circle-hero-note .hero-note-break { display: block; }
  .circle-bg--hero-stripes { right: -110px; width: 200px; }
  .circle-bg--activities-triangles { left: -135px; width: 220px; }
  .circle-bg--activities-dots { right: -110px; width: 180px; }
  .circle-bg--info-stripes { left: -10px; width: 230px; }
  .circle-activities { padding: 12px 0 50px; }
  .circle-info { padding: 70px 0 75px; }
  .circle-activities__grid,.circle-gallery { grid-template-columns: 1fr; }
  .circle-activity-card { padding: 27px 23px; }
  .circle-activity-card h3 { font-size: 19px; }
  .circle-gallery img { height: 210px; }
  .circle-info__card { padding: 27px 22px; }
  .circle-info__card dl > div { grid-template-columns: 105px 1fr; gap: 12px; }
  .circle-info__card dt,.circle-info__card dd { font-size: 14px; }
  .circle-info__unit { font-size: 15px; }
  .circle-info__card dd a { display: block; margin: 7px 0 0; }
  .circle-info__pattern { right: -70px; bottom: 18px; width: 180px; }
}
