/* TOP: a sunny, playful photo scrapbook. Astra child theme page stylesheet. */

body { font-weight:500; letter-spacing:.045em; background:var(--paper) }
.hero { background:var(--tanpopo); border:0; padding:0; overflow:hidden }
.hero-grid { display:block; position:relative; max-width:none; height:680px; margin:0 26px }
.hero-copy { position:absolute; left:4%; bottom:-25px; z-index:3; padding:0; display:block; transform:none; opacity:1 }
.hero-sub { display:table; background:var(--tanpopo); border:0; border-radius:30px; padding:8px 20px; font-size:13px; margin-bottom:18px; transform:rotate(-3deg) }
.hero-copy h1 { font-family:'Zen Maru Gothic','Hiragino Maru Gothic ProN',sans-serif; font-size:clamp(50px,5.7vw,84px); font-weight:700; line-height:1.2; letter-spacing:.025em; margin:0; transform:rotate(-3deg) }
.hero-line { display:table; background:var(--paper); padding:2px 18px 12px; margin:0 0 7px; white-space:nowrap; box-shadow:5px 6px 0 #00000012 }
.hero-line:nth-child(2) { margin-left:28px }
.hero-line:nth-child(3) { margin-left:9px }
.hero-line b { font-weight:700; font-size:1.12em; color:#000000; letter-spacing:-.07em }
.hero-copy h1 em { background:none; font-style:normal; padding:0; color:var(--ink) }
.hero-visual { position:absolute; inset:0 }
.hero-photo { min-height:0; height:100%; border-radius:18px 18px 45% 5% / 18px 18px 12% 4%; background:var(--paper-2) }
.hero-photo img { object-position:50% 47%; object-fit:cover }
.hero-snapshot { position:absolute; bottom:-58px; right:5%; width:228px; height:180px; background:var(--paper); padding:10px 10px 30px; transform:rotate(9deg); box-shadow:8px 12px 0 #00000012; z-index:4 }
.hero-snapshot::before { content:''; position:absolute; width:90px; height:25px; background:#fff6bcba; top:-10px; left:60px; transform:rotate(-8deg) }
.hero-snapshot img { width:100%; height:100%; object-fit:cover }
.hero-intro { display:grid; grid-template-columns:1.25fr 1fr; gap:65px; max-width:1180px; margin:auto; padding:95px 32px 70px; align-items:center }
.hero-desc { max-width:none; font-size:17px; line-height:2; margin:0; color:var(--ink) }
.hero-ctas { display:flex; flex-direction:column; gap:12px; align-items:center }
.hero-cta { border-radius:50px; padding:21px 34px; font-size:16px; justify-content:space-between }
.hero-cta--primary { background:var(--ink); color:var(--paper); min-width:320px }
.hero-cta--primary svg { margin-left:28px }
.hero-cta--secondary { border:0; background:transparent; padding:4px 12px }
.hero-cta .tel-num { font-size:22px }
.hero-cta--primary:hover { background:var(--paper); color:var(--ink) }
.badge-strip { background:var(--paper); border-bottom:2px dashed var(--line-2); padding:30px 20px }
.badge-strip .inner { max-width:1340px; padding:0 }
.badge-strip span { color:var(--ink-2); border-left:1px solid var(--line); font-size:13px; padding:12px 15px; font-weight:500 }
.badge-strip strong,.badge-strip span:first-child strong { font-size:36px; color:var(--ink); font-weight:900; line-height:1.3; margin-bottom:7px }
.section-header { text-align:left; margin-bottom:48px }
.section-title { font-size:48px; line-height:1.5; padding:0; font-weight:900; letter-spacing:.06em }
.section-title::after { display:none }
.section-label { font-size:14px; color:var(--ink-2); font-weight:900; letter-spacing:.18em; margin-bottom:14px }
.section-desc { font-size:16px; line-height:1.8 }
.for-you { background:var(--paper); padding:75px 0 90px; position:relative }
.for-you h2 { text-align:center; font-size:29px; transform:rotate(-2deg); margin-bottom:45px }
.for-you-grid { border:0; gap:20px; align-items:start }
.for-you-card,.for-you-card:first-child { padding:27px 8px; background:var(--paper-2); border:0; border-radius:45% 55% 48% 52%; align-items:center; text-align:center; min-height:185px; gap:13px }
.for-you-card:nth-child(even) { margin-top:34px; background:var(--tanpopo); border-radius:55% 45% 56% 44% }
.for-you-card .icon { width:35px; height:35px; color:var(--ink) }
.for-you-card p { font-size:14px }
.features { padding:90px 0 110px; background:#F5F5F5; border-radius:50% 50% 0 0 / 70px 70px 0 0 }
.features > .inner:first-child .section-label { font-size:clamp(50px,7vw,98px); line-height:1.1; letter-spacing:-.05em; color:#CFCFCF; margin-bottom:0 }
.features > .inner:first-child .section-title { margin-top:-8px; padding-left:5px }
.home-feature-grid { max-width:1240px; margin:auto; padding:0 35px; display:grid; grid-template-columns:1fr 1fr; gap:65px 75px; align-items:start }
.feature-block,.feature-block:nth-child(even) { display:flex; flex-direction:column; margin:0; min-width:0; gap:0; position:relative }
.feature-block:first-child { grid-column:1 / -1; display:grid; grid-template-columns:1.2fr 1fr; gap:55px; align-items:center; margin:20px 0 20px }
.feature-block:nth-child(even) .feature-block-img { order:0 }
.feature-block-img { min-height:350px; overflow:hidden; border-radius:10px; border:10px solid var(--paper); border-bottom-width:28px; transform:rotate(-3deg); box-shadow:5px 10px 0 #00000010 }
.feature-block:first-child .feature-block-img { min-height:420px }
.feature-block:nth-child(2) .feature-block-img { transform:rotate(3deg); border-radius:48% 48% 5px 5px }
.feature-block:nth-child(3) { margin-top:130px }
.feature-block:nth-child(3) .feature-block-img { transform:rotate(-4deg) }
.feature-block-body,.feature-block:nth-of-type(2) .feature-block-body { background:none; border:0; padding:32px 10px 0; justify-content:flex-start }
.feature-block:first-child .feature-block-body { padding:0 }
.feature-block-num { color:#000000; font-size:13px; font-weight:900; margin-bottom:16px }
.feature-block-body h3 { font-size:32px; line-height:1.65; margin-bottom:18px; font-weight:900 }
.feature-block-body p { font-size:16px; line-height:2 }
.feature-more-btn { background:var(--paper); border:1px solid var(--ink); border-radius:55% 45% 50% 50% / 48% 52% 48% 52%; padding:23px 36px; font-size:15px; gap:24px }
.policy-section#policy { background:var(--tanpopo); padding:100px 0 115px; position:relative }
.policy-section#policy::before { content:''; position:absolute; left:0; top:-16px; height:20px; width:100%; background:radial-gradient(circle at 16px 20px,var(--tanpopo) 20px,transparent 21px) 0 0 / 40px 25px repeat-x }
.policy-section#policy > .inner { display:block; max-width:1040px }
.policy-section .section-header { text-align:center; margin-bottom:40px }
.policy-compact { display:flex; flex-direction:column; align-items:center; gap:36px }
.policy-lead { font-size:30px; line-height:2; font-weight:900; max-width:900px; text-align:center }
.policy-goal-items { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:20px; width:100% }
.policy-goal-items span { border:0; border-top:2px solid var(--ink); background:none; padding:20px 5px; font-size:15px; text-align:center }
.message { background:var(--paper); padding:110px 0 100px }
.message-inner { max-width:1250px; grid-template-columns:1.05fr 1fr; gap:75px }
.message-photo { height:580px; position:relative; transform:rotate(-4deg); border-radius:46% 54% 44% 56%; overflow:hidden }
.message-photo img { object-position:center; transform:rotate(4deg) scale(1.1) }
.message-content h2 { font-size:32px; line-height:1.75; margin-bottom:25px }
.message-content p { font-size:16px; line-height:2 }
.message-name { margin-top:28px; font-size:13px; border-top:2px dashed var(--line-2) }
.message-name strong { font-size:18px }
.gallery-section { background:var(--paper); padding:20px 0 105px; overflow:hidden }
.gallery-section .inner { max-width:1460px; padding:0 35px }
.gallery-section .section-header { text-align:center }
.gallery-section .section-title { display:inline-block; padding:0 25px; background:linear-gradient(transparent 60%,var(--tanpopo) 60%); transform:rotate(-3deg) }
.gallery-mosaic { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-auto-rows:250px; gap:28px; padding-top:25px }
.gallery-mosaic img { border:8px solid white; box-shadow:3px 7px 15px #00000015; transform:rotate(3deg); grid-column:span 4; grid-row:auto; border-radius:0 }
.gallery-mosaic img:nth-child(1) { grid-column:span 5; grid-row:auto; transform:rotate(-4deg) }
.gallery-mosaic img:nth-child(2) { grid-column:span 3; border-radius:50%; transform:rotate(6deg) }
.gallery-mosaic img:nth-child(4) { grid-column:span 3; transform:rotate(-5deg) }
.gallery-mosaic img:nth-child(5) { grid-column:span 5; transform:rotate(2deg) }
.gallery-mosaic img:nth-child(6) { grid-column:span 4; transform:rotate(-4deg) }
.info { background:var(--paper-2); padding:90px 0 100px; border-radius:70px 70px 0 0 }
.access-compact { grid-template-columns:1fr 1.15fr; gap:70px; align-items:center }
.access-compact .access-map { order:2; height:380px; min-height:380px; border:8px solid white; box-shadow:5px 7px 0 #00000012 }
.access-address { font-size:23px; line-height:1.8 }
.access-station { font-size:16px }
.cta-section { background:var(--tanpopo); border:0; padding:90px 0; position:relative }
.cta-section h2 { font-size:44px; transform:rotate(-2deg); margin-bottom:25px }
.cta-lead { font-size:16px }
.cta-btn { border-radius:50px; padding:24px 38px }
.cta-btn--tel .tel-num { font-size:30px }
.cta-btn--mail { background:var(--ink); color:var(--paper) }
@media(max-width:1180px) {
 .hero-grid { height:610px }
 .hero-snapshot { width:195px; height:158px }
 .home-feature-grid { gap:55px }
 .feature-block:first-child { gap:35px }
 .feature-block-body h3 { font-size:29px }
 .message-inner { gap:40px }
}
@media(min-width:769px) and (max-width:1080px) {
 .hero-copy h1 { font-size:54px }
 .hero-intro { gap:30px; padding-top:85px }
 .hero-cta--primary { min-width:280px; padding-inline:24px }
 .for-you-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px }
 .for-you-card { min-height:170px }
 .for-you-card p { font-size:13px }
 .home-feature-grid { gap:50px 35px }
 .feature-block-img { min-height:280px }
 .feature-block:first-child .feature-block-img { min-height:360px }
 .message-inner { grid-template-columns:1fr 1fr }
 .message-photo { height:510px }
 .message-content h2 { font-size:27px }
 .gallery-mosaic { grid-auto-rows:195px; gap:18px }
 .access-compact { gap:35px }
}
@media(max-width:768px) {
 .hero-grid { height:590px; margin:0 10px }
 .hero-photo { border-radius:12px 12px 30% 4% / 12px 12px 8% 3%; height:390px }
 .hero-photo img { object-position:48% 42% }
 .hero-copy { bottom:0; left:10px }
 .hero-sub { font-size:13px; padding:6px 13px; margin-bottom:12px }
 .hero-copy h1 { font-size:clamp(32px,9.1vw,56px); line-height:1.25 }
 .hero-line { padding:3px 10px 9px; margin-bottom:5px }
 .hero-line:nth-child(2) { margin-left:15px }
 .hero-snapshot { width:110px; height:95px; right:13px; top:225px; bottom:auto; padding:5px 5px 17px }
 .hero-snapshot::before { width:50px; height:17px; left:25px; top:-6px }
 .hero-intro { grid-template-columns:1fr; gap:25px; padding:35px 24px 42px }
 .hero-desc { font-size:15px; line-height:1.95 }
 .hero-ctas { align-items:stretch; gap:10px }
 .hero-cta { padding:20px 24px; font-size:15px; width:100%; min-width:0 }
 .hero-cta--secondary { padding:5px 12px; justify-content:center }
 .hero-cta .tel-num { font-size:21px }
 .badge-strip { padding:15px 20px }
 .badge-strip .inner { gap:0 }
 .badge-strip span { border-top:0; padding:20px 4px; font-size:13px; letter-spacing:0 }
 .badge-strip span:nth-child(n+3) { border-top:1px solid var(--line) }
 .badge-strip strong,.badge-strip span:first-child strong { font-size:24px }
 .for-you { padding:50px 0 65px }
 .for-you h2 { font-size:23px; margin-bottom:35px }
 .for-you-grid { grid-template-columns:1fr 1fr; gap:15px 16px }
 .for-you-card,.for-you-card:first-child { min-height:163px; padding:22px 8px }
 .for-you-card:nth-child(even) { margin-top:22px }
 .for-you-card p { font-size:13px }
 .for-you-card:last-child { min-height:110px; gap:16px; flex-direction:row; justify-content:center; margin-top:5px }
 .section-title { font-size:34px }
 .section-label { font-size:13px }
 .section-desc { font-size:15px }
 .section-header { margin-bottom:30px }
 .features { border-radius:50% 50% 0 0 / 30px 30px 0 0; padding:65px 0 }
 .features > .inner:first-child .section-label { font-size:60px }
 .features > .inner:first-child .section-title { margin-top:0 }
 .home-feature-grid { display:block; padding:0 28px }
 .feature-block,.feature-block:first-child { display:flex; flex-direction:column; margin:45px 0 0; gap:0 }
 .feature-block:nth-child(3) { margin-top:45px }
 .feature-block-img,.feature-block:first-child .feature-block-img { min-height:285px; width:100%; border-width:7px; border-bottom-width:22px }
 .feature-block-body,.feature-block:first-child .feature-block-body { padding:28px 0 0 }
 .feature-block-body h3 { font-size:25px; line-height:1.65 }
 .feature-block-body p { font-size:15px }
 .feature-more-btn { padding:21px 22px; font-size:14px; gap:12px; width:100%; justify-content:center }
 .policy-section#policy { padding:60px 0 }
 .policy-section#policy > .inner { padding-inline:25px }
 .policy-lead { font-size:23px; text-align:left; line-height:1.95 }
 .policy-goal-items { grid-template-columns:1fr; gap:0 }
 .policy-goal-items span { text-align:left; border-top:1px dashed var(--ink); font-size:14px; padding:18px 4px }
 .policy-compact { gap:26px }
 .message { padding:70px 0 }
 .message-inner { grid-template-columns:1fr; gap:36px; padding-inline:25px }
 .message-photo { height:365px; width:100% }
 .message-content h2 { font-size:26px; line-height:1.8 }
 .message-content p { font-size:15px }
 .gallery-section { padding:5px 0 60px }
 .gallery-section .inner { padding-inline:20px }
 .gallery-mosaic { grid-template-columns:1fr 1fr; grid-auto-rows:165px; gap:20px 13px }
 .gallery-mosaic img,.gallery-mosaic img:nth-child(1),.gallery-mosaic img:nth-child(2),.gallery-mosaic img:nth-child(4),.gallery-mosaic img:nth-child(5),.gallery-mosaic img:nth-child(6) { grid-column:auto; grid-row:auto; border-width:5px }
 .gallery-mosaic img:nth-child(1) { grid-column:1 / -1; grid-row:span 2 }
 .gallery-mosaic img:nth-child(6) { grid-column:1 / -1 }
 .info { padding:55px 0 65px; border-radius:40px 40px 0 0 }
 .access-compact { grid-template-columns:1fr; gap:32px; padding-inline:5px }
 .access-compact .access-map { height:320px; min-height:320px; order:2 }
 .access-address { font-size:20px }
 .access-station { font-size:15px }
 .cta-section { padding:60px 0 }
 .cta-section h2 { font-size:30px; line-height:1.7 }
 .cta-lead { font-size:15px }
 .cta-btn { padding:23px 22px }
 .cta-btn--tel .tel-num { font-size:28px }
}

/* Paper buttons: raised edges, stitched primary actions and round arrow seals. */
.header-cta,.hero-cta,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-tel {
 position:relative; isolation:isolate; text-decoration:none;
 -webkit-tap-highlight-color:transparent;
 transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease;
}
.hero-cta--primary,.cta-btn--mail,.mnav-cta {
 background:var(--ink); color:var(--paper); border:2px solid var(--ink);
 box-shadow:4px 5px 0 #000000; border-radius:30px 35px 29px 34px;
}
.hero-cta--primary::before,.cta-btn--mail::before,.mnav-cta::before {
 content:''; position:absolute; inset:6px; border:1px dashed #F5F5F57a;
 border-radius:inherit; pointer-events:none;
}
.hero-cta--primary { min-height:78px; padding:15px 18px 15px 27px; gap:22px }
.hero-cta--primary svg,.feature-more-btn svg {
 width:38px; height:38px; flex-shrink:0; padding:10px;
 border-radius:50%; background:var(--tanpopo); color:var(--ink); margin:0;
 transition:transform .2s ease,background-color .2s ease;
}
.feature-more-btn {
 min-height:72px; padding:14px 17px 14px 29px; gap:27px;
 border:2px solid var(--ink); border-radius:27px 32px 26px 33px;
 background:var(--paper); color:var(--ink); box-shadow:4px 5px 0 var(--ink);
 font-weight:900; line-height:1.7;
}
.feature-more-btn svg { border:1px solid var(--ink) }
.header-cta {
 border:2px solid var(--ink); border-radius:21px 26px 22px 27px;
 box-shadow:3px 3px 0 var(--ink); padding:11px 21px; gap:10px; min-height:49px;
}
.header-cta svg { width:20px; height:20px; flex-shrink:0 }
.hero-cta--secondary {
 background:var(--paper-2); border:1px dashed var(--ink); padding:10px 20px;
 border-radius:25px; gap:11px; min-height:48px; justify-content:center;
}
.hero-cta--secondary svg { width:18px; height:18px; flex-shrink:0 }
.hero-cta--secondary .tel-num { font-size:20px }
.hero-ctas { gap:19px }
.cta-buttons { gap:24px; align-items:stretch }
.cta-btn { min-height:104px; padding:22px 32px; gap:17px }
.cta-btn--tel {
 background:var(--paper); border:2px solid var(--ink); border-radius:32px 27px 34px 28px;
 box-shadow:4px 5px 0 var(--ink);
}
.cta-btn > svg {
 width:44px; height:44px; padding:11px; border-radius:50%; flex-shrink:0;
 background:var(--tanpopo); color:var(--ink);
}
.cta-btn--tel > svg { border:1px solid var(--ink) }
.cta-btn--tel .tel-sub { margin-top:6px; font-size:13px; color:var(--ink-2) }
.mnav-cta { border-radius:24px; min-height:62px; padding:17px }
.mnav-tel { border:1px solid var(--ink); border-radius:15px; min-height:52px }
.mnav-toggle,.mnav-close {
 border:2px solid var(--ink); box-shadow:2px 3px 0 var(--ink);
 transition:transform .18s ease,box-shadow .18s ease;
}
.mnav-grid a { transition:background-color .18s ease }
:is(.header-cta,.hero-cta,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-tel,.mnav-toggle,.mnav-close,.fixed-cta-item):focus-visible {
 outline:3px solid var(--ink); outline-offset:5px;
}
@media(hover:hover) and (pointer:fine) {
 .hero-cta--primary:hover,.cta-btn--mail:hover,.mnav-cta:hover {
  background:#222222; color:var(--paper); transform:translate(-2px,-2px); box-shadow:6px 7px 0 #000000;
 }
 .header-cta:hover,.feature-more-btn:hover,.cta-btn--tel:hover {
  background:#FDE62D; color:var(--ink); border-color:var(--ink);
  transform:translate(-2px,-2px); box-shadow:6px 7px 0 var(--ink);
 }
 .cta-btn--tel:hover .tel-sub { color:var(--ink-2) }
 .hero-cta--primary:hover svg,.feature-more-btn:hover svg { transform:translateX(3px) rotate(-8deg); background:#FDE62D }
 .hero-cta--secondary:hover,.mnav-tel:hover { background:var(--paper); color:var(--ink); transform:translateY(-2px) }
 .mnav-toggle:hover,.mnav-close:hover { transform:translateY(-2px); box-shadow:2px 5px 0 var(--ink) }
}
:is(.header-cta,.hero-cta--primary,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-toggle,.mnav-close):active {
 transform:translate(3px,4px); box-shadow:0 1px 0 var(--ink);
}
.hero-cta--secondary:active,.mnav-tel:active { transform:translateY(2px) }
@media(max-width:1080px) and (min-width:769px) {
 .hero-cta--primary { min-width:280px; padding-inline:21px 15px; gap:12px }
}
@media(max-width:768px) {
 .hero-cta--primary { min-height:74px; padding:15px 16px 15px 23px; gap:12px }
 .hero-cta--secondary { width:fit-content; align-self:center; padding:9px 21px }
 .feature-more-btn { min-height:70px; padding:13px 14px 13px 22px; gap:14px; justify-content:space-between; white-space:normal }
 .feature-more-btn svg { width:35px; height:35px; padding:9px }
 .cta-buttons { gap:22px }
 .cta-btn { min-height:96px; padding:20px 22px; gap:14px }
 .cta-btn--tel .tel-num { font-size:26px; white-space:nowrap }
 .cta-btn > svg { width:40px; height:40px; padding:10px }
 .cta-btn--mail { font-size:15px }
 .fixed-cta {
  left:8px; right:8px; bottom:calc(10px + env(safe-area-inset-bottom));
  border:2px solid var(--ink); border-radius:20px; background:var(--paper);
  padding:5px; gap:3px; box-shadow:0 5px 0 var(--ink);
 }
 .fixed-cta-item {
  min-height:58px; min-width:0; border:0; border-radius:13px; color:var(--ink);
  padding:6px 1px; font-size:13px; letter-spacing:0; line-height:1.5;
  transition:background-color .16s ease,transform .16s ease;
 }
 .fixed-cta-item svg { width:20px; height:20px; color:var(--ink) }
 .fixed-cta-item:first-child { background:var(--paper-2) }
 .fixed-cta-item:nth-child(4) { background:var(--ink); color:var(--paper) }
 .fixed-cta-item:nth-child(4) svg { color:var(--tanpopo) }
 .fixed-cta-item:last-child { background:var(--tanpopo) }
 .fixed-cta-item:active { transform:scale(.95); background:#FDE62D; color:var(--ink) }
 .fixed-cta-item:focus-visible { outline-offset:-3px; outline-color:#000000 }
 body { padding-bottom:105px }
}
@media(prefers-reduced-motion:reduce) {
 .header-cta,.hero-cta,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-tel,.mnav-toggle,.mnav-close,.fixed-cta-item,
 .hero-cta--primary svg,.feature-more-btn svg { transition:none !important; transform:none !important }
}

/* === NO BLACK FILL === 黒ベタを使わない（文字は黒のまま・面は白／薄グレー／たんぽぽ黄） */
:root { --dark: #F5F5F5 }

/* ボタン：主＝黄地×黒文字、副＝白地×細い枠 */
.header-cta, .mnav-cta, .footer-btn--primary, .apply-tel, .form-submit button, .search-form-wrap button,
.staff-box input[type="submit"], .class-card-capacity, .job-card-badge, .pdf-year-label, .daily-class-title {
  background: var(--tanpopo); color: #000; border: 0;
}
.header-cta:hover, .mnav-cta:hover, .footer-btn--primary:hover, .apply-tel:hover, .form-submit button:hover, .search-form-wrap button:hover { background: #FFFFFF; color: #000; box-shadow: inset 0 0 0 2px var(--tanpopo) }
.job-card-badge--pt { background: #EFEFEF; color: #000 }

/* 黄色の面の上のボタン（ヒーロー・CTA帯）：主＝白、副＝白枠 */
.hero-cta--primary, .cta-btn--mail { background: #FFFFFF; color: #000; border: 1px solid #FFFFFF }
.hero-cta--primary:hover, .cta-btn--mail:hover { background: #FFFFFF; color: #000; box-shadow: 0 6px 18px rgba(0,0,0,0.12) }
.hero-cta--secondary { background: transparent; color: #000; border: 1px solid #000 }
.hero-cta--secondary:hover { background: #FFFFFF; border-color: #FFFFFF }
.cta-btn--tel { background: #FFFFFF; color: #000; border: 1px solid #FFFFFF }
.cta-btn--tel:hover { background: #FFFFFF; color: #000; box-shadow: 0 6px 18px rgba(0,0,0,0.12) }
.cta-btn--tel:hover .tel-sub { color: var(--ink-3) }
.cta-btn--mail svg { color: var(--tanpopo-d) }
.cta-section { border-top: 0 }

/* 数字の帯：白地に黒い数字、黄色の短い線 */
.badge-strip { background: #FFFFFF; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line) }
.badge-strip span { color: #000; border-left: 1px solid var(--line) }
.badge-strip span:first-child { border-left: 0 }
.badge-strip strong { color: #000; position: relative; padding-bottom: 10px }
.badge-strip strong::after { content: ''; position: absolute; left: 50%; bottom: 0; width: 28px; height: 4px; background: var(--tanpopo); transform: translateX(-50%) }

/* 1日の流れ・行事 */
.timeline-time--evening { background: #E4E4E4; color: #000 }
.timeline-time--afternoon { background: var(--leaf); color: #FFFFFF }
.events-monthly { background: #F8F8F8; color: #000; border-left: 6px solid var(--tanpopo) }
.events-monthly strong { color: #000 }
.daily-class-title { color: #000 }

/* アイコン地 */
.info-doc-icon--lock, .contact-card-icon--form { background: var(--tanpopo); color: #000 }
.info-doc-icon--lock svg, .contact-card-icon--form svg { color: #000 }

/* ドロップダウン・ドロワー */
.gnav-dropdown { background: #FFFFFF }
.mnav-toggle, .mnav-close { background: var(--tanpopo) }
.mnav-toggle span { background: #000 }

/* サイドの縦ボタン：黄＋白 */
.side-action { background: #FFFFFF; color: #000; border: 1px solid var(--line); border-right: 0 }
.side-action--primary { background: var(--tanpopo); border-color: var(--tanpopo) }
.side-action--green, .side-action--brown { background: #FFFFFF; color: #000 }
.side-action:hover { background: var(--tanpopo); border-color: var(--tanpopo); color: #000 }

/* スマホ固定バー：白地、電話と見学は黄 */
.fixed-cta { background: #FFFFFF; border-top: 1px solid var(--line); box-shadow: 0 -6px 18px rgba(0,0,0,0.08) }
.fixed-cta-item { color: #000; border-left: 1px solid var(--line) }
.fixed-cta-item svg { color: #000 }
.fixed-cta-item:first-child { background: #F8F8F8 }
.fixed-cta-item:nth-child(4) { background: #FFFFFF; color: #000; box-shadow: inset 0 -4px 0 var(--tanpopo) }
.fixed-cta-item:nth-child(4) svg { color: var(--tanpopo-d) }
.fixed-cta-item:last-child { background: var(--tanpopo); color: #000 }
.fixed-cta-item:last-child svg { color: #000 }
.fixed-cta-item:active { background: var(--tanpopo); color: #000 }

/* フッター：薄グレー地に黒文字、黄のアクセント */
.site-footer { background: #F5F5F5; color: #000; border-top: 6px solid var(--tanpopo) }
.footer-brand h3 { color: #000 }
.footer-brand .corp { color: var(--ink-3) }
.footer-info p, .footer-info .footer-access { color: #000 }
.footer-info .footer-access, .footer-closed { color: var(--ink-3) }
.footer-tel svg { background: var(--tanpopo); color: #000 }
.footer-tel .tel-link { color: #000 }
.footer-tel .tel-hours { color: var(--ink-3) }
.footer-nav h4, .footer-guide h4 { color: #000 }
.footer-nav h4::after, .footer-guide h4::after { background: var(--tanpopo); width: 36px; height: 3px }
.footer-nav-links a { color: #000 }
.footer-nav-links a::before { background: var(--tanpopo); opacity: 1 }
.footer-nav-links a:hover, .footer-nav-links a.is-current { color: var(--tanpopo-d) }
.footer-btn--primary { background: var(--tanpopo); color: #000 }
.footer-btn--primary:hover { background: #FFFFFF; box-shadow: inset 0 0 0 2px var(--tanpopo) }
.footer-btn--ghost { background: #FFFFFF; color: #000; border: 1px solid var(--line-2) }
.footer-btn--ghost:hover { border-color: var(--tanpopo); background: #FFFFFF; color: #000; box-shadow: inset 0 0 0 1px var(--tanpopo) }
.footer-ext a { color: var(--ink-3) }
.footer-ext a:hover { color: var(--tanpopo-d) }
.footer-bottom { border-top: 1px solid var(--line-2); color: var(--ink-3) }
.footer-bottom-links a { color: #000 }
.footer-bottom-links a:hover { color: var(--tanpopo-d) }
.footer-nav-links a.is-current { color: #000; text-decoration: underline; text-decoration-color: var(--tanpopo); text-decoration-thickness: 3px; text-underline-offset: 6px }

/* Small nursery illustrations soften the four factual notes on the TOP. */
.badge-strip { padding:38px 26px 24px; background:#fff; border:0 }
.badge-strip .inner { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:1250px; padding:0; gap:23px; align-items:stretch }
.badge-strip .fact-card { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; padding:23px 12px 25px; background:#fff8d7; border-radius:33px 40px 31px 38px; position:relative }
.badge-strip .fact-card:nth-child(even) { background:#fffbee; border-radius:40px 30px 39px 32px }
.badge-strip .fact-card::after { content:''; position:absolute; inset:7px; border:1px dashed #e7cb70; border-radius:inherit; pointer-events:none }
.badge-strip .fact-illustration { display:block; width:63px; height:63px; flex-shrink:0; margin-bottom:13px; transform:rotate(-5deg) }
.badge-strip .fact-card:nth-child(even) .fact-illustration { transform:rotate(5deg) }
.badge-strip .fact-card strong { font-size:31px; line-height:1.4; margin:0 0 7px; padding:0; color:var(--ink); letter-spacing:.01em; white-space:nowrap }
.badge-strip .fact-card strong::after { display:none }
.badge-strip .fact-card--3 strong { font-size:28px }
.badge-strip .fact-card small { display:block; font-size:13px; line-height:1.8; letter-spacing:.02em; color:var(--ink-2); text-align:center }
@media(max-width:1080px) and (min-width:769px) {
 .badge-strip .inner { gap:14px }
 .badge-strip .fact-card { padding-inline:8px }
 .badge-strip .fact-card strong { font-size:25px }
 .badge-strip .fact-card--3 strong { font-size:22px }
 .badge-strip .fact-card small { font-size:12px }
}
@media(max-width:768px) {
 .badge-strip { padding:27px 20px 12px }
 .badge-strip .inner { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 12px }
 .badge-strip .fact-card { padding:20px 9px 18px; border-radius:26px 32px 25px 30px }
 .badge-strip .fact-card:nth-child(even) { border-radius:32px 25px 31px 27px }
 .badge-strip .fact-card::after { inset:5px }
 .badge-strip .fact-illustration { width:53px; height:53px; margin-bottom:9px }
 .badge-strip .fact-card strong { font-size:24px; margin-bottom:5px }
 .badge-strip .fact-card--3 strong { font-size:20px }
 .badge-strip .fact-card small { font-size:12px; line-height:1.8; letter-spacing:0 }
}

/* A smiling dandelion invitation, paired with a small telephone speech bubble. */
.hero-ctas { gap:20px }
.hero-cta--primary { display:grid; grid-template-columns:46px 1fr 32px; gap:12px; width:370px; min-width:0; min-height:88px; padding:17px 19px; border:1.5px solid #b58e24; background:#fffef6; color:#000; border-radius:40px 47px 38px 45px; box-shadow:3px 5px 0 #d6a600 }
.hero-cta--primary::before { inset:6px; border:1px dashed #e6c86f; border-radius:inherit }
.hero-cta--primary .hero-cta-flower { width:46px; height:46px; padding:0; border:0; border-radius:0; background:none; margin:0; transform:none }
.hero-cta-label { font-size:16px; line-height:1.5; white-space:nowrap; text-align:center }
.hero-cta--primary .hero-cta-arrow { width:32px; height:32px; padding:8px; border:0; background:#ffe16a; color:#59450d; margin:0 }
.hero-cta--secondary { min-height:51px; width:fit-content; gap:10px; padding:9px 20px; background:#fff8d9; border:1px solid #b58e24; border-radius:24px 26px 20px 25px; box-shadow:2px 3px 0 #dcaf21 }
.hero-cta--secondary::after { content:''; width:10px; height:10px; position:absolute; right:24px; bottom:-6px; transform:rotate(45deg); background:#fff8d9; border-right:1px solid #b58e24; border-bottom:1px solid #b58e24 }
.hero-cta--secondary svg { width:28px; height:28px; padding:6px; border-radius:50%; background:#ffe16a; color:#59450d }
.hero-cta--secondary .tel-num { font-size:20px; letter-spacing:.025em }
@media(hover:hover) and (pointer:fine) {
 .hero-cta--primary:hover { background:#fff9de; color:#000; border-color:#b58e24; box-shadow:5px 7px 0 #d6a600; transform:translate(-2px,-2px) }
 .hero-cta--primary:hover .hero-cta-flower { background:none; transform:rotate(-10deg) }
 .hero-cta--primary:hover .hero-cta-arrow { background:#ffda43; transform:translateX(2px) }
 .hero-cta--secondary:hover { background:#fff8d9; color:#000; border-color:#b58e24; box-shadow:2px 5px 0 #dcaf21 }
}
.hero-cta--primary:active { transform:translate(2px,3px); box-shadow:1px 1px 0 #d6a600 }
.hero-cta--secondary:active { transform:translateY(2px); box-shadow:1px 1px 0 #dcaf21 }
@media(max-width:1080px) and (min-width:769px) {
 .hero-cta--primary { width:100%; grid-template-columns:38px 1fr 28px; gap:8px; padding-inline:14px }
 .hero-cta--primary .hero-cta-flower { width:38px; height:38px }
 .hero-cta-label { font-size:14px }
 .hero-cta--primary .hero-cta-arrow { width:28px; height:28px; padding:7px }
}
@media(max-width:768px) {
 .hero-cta--primary { width:100%; grid-template-columns:39px 1fr 29px; gap:8px; min-height:82px; padding:16px 14px }
 .hero-cta--primary .hero-cta-flower { width:39px; height:39px }
 .hero-cta-label { font-size:15px }
 .hero-cta--primary .hero-cta-arrow { width:29px; height:29px; padding:7px }
 .hero-cta--secondary { align-self:center; padding:9px 19px }
}

/* Friendly illustrated wishes, with soft dandelion-yellow pebble shapes. */
.for-you-grid { gap:21px; align-items:start }
.for-you .for-you-card { min-height:225px; padding:26px 10px 30px; gap:14px; background:#fff8da; border:0; border-radius:46% 54% 44% 56% / 47% 46% 54% 53%; position:relative; isolation:isolate }
.for-you .for-you-card::before { content:''; position:absolute; inset:6px; border:1px solid #e9ce78; border-radius:inherit; pointer-events:none }
.for-you .for-you-card:nth-child(even) { margin-top:30px; background:#ffe782; border-radius:54% 46% 53% 47% / 48% 56% 44% 52% }
.for-you .for-you-card:nth-child(even)::before { border-color:#e8c450 }
.for-you .for-you-card .icon { width:76px; height:74px; flex-shrink:0; color:#6b531d; transform:rotate(-4deg) }
.for-you .for-you-card:nth-child(even) .icon { transform:rotate(4deg) }
.for-you .for-you-card .icon svg { width:100%; height:100%; overflow:visible }
.for-you .for-you-card p { font-size:14px; line-height:1.85; color:#332b1c; letter-spacing:.02em; margin:0 }
@media(min-width:769px) and (max-width:1080px) {
 .for-you-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:22px; max-width:760px; margin:auto }
 .for-you .for-you-card { grid-column:span 2; min-height:220px }
 .for-you .for-you-card:nth-child(even) { margin-top:0 }
 .for-you .for-you-card:nth-child(4) { grid-column:2 / 4 }
 .for-you .for-you-card:nth-child(5) { grid-column:4 / 6 }
}
@media(max-width:768px) {
 .for-you-grid { gap:17px 12px }
 .for-you .for-you-card { min-height:195px; padding:23px 7px 24px; gap:10px }
 .for-you .for-you-card:nth-child(even) { margin-top:18px }
 .for-you .for-you-card .icon { width:63px; height:62px }
 .for-you .for-you-card p { font-size:13px; line-height:1.8; letter-spacing:0 }
 .for-you .for-you-card:last-child { width:min(100%,310px); justify-self:center; min-height:134px; margin-top:3px; padding:20px 25px; gap:19px; border-radius:46% 54% 48% 52% / 45% 49% 51% 55% }
}

/* === LOGO FINAL === 旧サイトの意匠（たんぽぽ＋丸い袋文字）を描き直したロゴ */
.logo { display: flex; align-items: center; gap: 12px }
.logo::before { display: none }
.logo-mark { flex-shrink: 0; display: block }
.logo-name {
  display: block;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-size: 27px; font-weight: 900; line-height: 1.1; letter-spacing: 0.015em;
  color: #000;
  -webkit-text-stroke: 6px #FDE62D;
  paint-order: stroke fill;
  white-space: nowrap;
}
.logo-text { display: none }

.footer-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 22px }
.logo-name--footer { font-size: 25px; -webkit-text-stroke-width: 5px }
.footer-brand .corp { display: block; font-size: 13px; font-weight: 500; letter-spacing: 0.08em; color: var(--ink-3); margin-top: 6px }

@media (max-width: 1180px) { .logo-name { font-size: 24px; -webkit-text-stroke-width: 5px } }
@media (max-width: 768px) {
  .logo { gap: 9px }
  .logo-mark { width: 36px; height: 36px }
  .logo-name { font-size: 20px; -webkit-text-stroke-width: 4px }
  .logo-name--footer { font-size: 21px; -webkit-text-stroke-width: 4px }
}
@media (max-width: 380px) { .logo-name { font-size: 18px } }

/* A small illustrated station ticket beside the hero headline. */
.hero-sub { display:flex; align-items:center; gap:12px; width:fit-content; padding:12px 18px 12px 15px; background:#fff8db; color:#4c3b19; border:1px solid #c5a751; border-radius:15px 18px 14px 17px; box-shadow:2px 3px 0 #ac852a42; font-family:'Zen Maru Gothic',sans-serif; font-size:14px; font-weight:700; letter-spacing:.02em; position:relative; isolation:isolate }
.hero-sub::before { content:''; position:absolute; inset:5px; border:1px dashed #e0c877; border-radius:inherit; pointer-events:none }
.hero-sub .station-doodle { display:block; width:41px; height:34px; padding-right:10px; border-right:1px dashed #cfb260; flex-shrink:0 }
.hero-sub > span { white-space:nowrap }
.hero-sub .station-walk { margin-left:5px }
.hero-sub .station-walk strong { font-size:20px; line-height:1; color:#765819; margin:0 1px; font-weight:700 }
@media(max-width:768px) {
 .hero-sub { padding:10px 14px 10px 12px; gap:9px; font-size:13px; margin-bottom:14px }
 .hero-sub .station-doodle { width:37px; height:30px; padding-right:9px }
 .hero-sub .station-walk { margin-left:3px }
 .hero-sub .station-walk strong { font-size:18px }
}


/* One by one, the wish balloons rise gently into place. */
.for-you .balloon-thread { position:absolute; top:calc(100% - 2px); left:calc(50% - 9px); width:18px; height:34px; pointer-events:none; }
.for-you .balloon-thread::before { content:''; position:absolute; top:0; left:4px; width:10px; height:8px; background:#ead491; clip-path:polygon(50% 0,100% 100%,0 100%); }
.for-you .balloon-thread::after { content:''; position:absolute; top:8px; left:8px; width:9px; height:26px; border-left:1px solid #cfbd88; border-radius:50%; transform:rotate(-12deg); }
.for-you .balloon-grid.is-ready .for-you-card { opacity:0; transform:translateY(65px) scale(.84) rotate(-6deg); transform-origin:50% 100%; transition:none; }
.for-you .balloon-grid.is-ready .for-you-card.is-floating { animation:balloon-arrive 1.25s cubic-bezier(.2,.7,.25,1) var(--balloon-delay,0ms) both; }
@keyframes balloon-arrive {
 0% { opacity:0; transform:translateY(65px) scale(.84) rotate(-6deg); }
 28% { opacity:1; }
 65% { opacity:1; transform:translateY(-13px) scale(1.015) rotate(3deg); }
 84% { opacity:1; transform:translateY(4px) scale(.995) rotate(-1.5deg); }
 100% { opacity:1; transform:translateY(0) scale(1) rotate(0); }
}
@media(max-width:1080px) {
 .for-you .balloon-grid { row-gap:44px; }
}
@media(prefers-reduced-motion:reduce) {
 .for-you .balloon-grid.is-ready .for-you-card,.for-you .balloon-grid.is-ready .for-you-card.is-floating { opacity:1; transform:none; animation:none; }
}

/* Two-line hero, with room for the phone edge tabs. */
@media(max-width:768px) {
 .hero-grid { height:510px; }
 .hero-copy h1 { font-size:clamp(25px,7.4vw,50px); }
}

@media(max-width:440px) {
 .cta-section h2 { font-size:22px; }
}

/* A little speech bubble on the first nursery photo. */
.photo-message-toggle { position:absolute; inset:0; width:100%; height:100%; display:block; padding:0; border:0; border-radius:0; background:transparent; cursor:pointer; appearance:none; }
.photo-message-toggle:focus-visible { outline:3px solid #826021; outline-offset:-5px; }
.photo-speech { position:absolute; z-index:2; top:20px; left:50%; transform:translateX(-50%) rotate(3deg); margin:0; padding:13px 24px 15px; max-width:90%; border:2px solid #c6a34c; border-radius:45% 48% 42% 46% / 45% 47% 43% 46%; background:#fffbee; box-shadow:2px 4px 0 #76571920; color:#57401d; font:700 24px/1.5 'Zen Maru Gothic',sans-serif; white-space:nowrap; pointer-events:none; }
.photo-speech::after { content:''; position:absolute; bottom:-9px; left:58%; width:16px; height:16px; background:#fffbee; border-right:2px solid #c6a34c; border-bottom:2px solid #c6a34c; transform:rotate(45deg) skew(-12deg,-12deg); }
.photo-speech[hidden] { display:none; }
@media(max-width:768px) {
 .photo-speech { top:14px; padding:10px 20px 12px; font-size:20px; }
}
@keyframes photo-speech-pop {
 from { opacity:0; transform:translate(-50%,8px) rotate(3deg) scale(.88); }
 to { opacity:1; transform:translate(-50%,0) rotate(3deg) scale(1); }
}
@media(prefers-reduced-motion:no-preference) {
 .photo-speech:not([hidden]) { animation:photo-speech-pop .22s ease-out; }
}

/* === NAV V2 === グローバルメニューを「ピル型タブ」に変更
   ・1本の下線 → 角丸のタブ。現在地はたんぽぽ黄で塗る
   ・ホバーは黄の薄い縁取り＋わずかに浮く
   ・EN小ラベル／HOME／現在地／ドロップダウンは維持（社内の型）
   ============================================================ */
.gnav-bar {
  background: #F8F8F8;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.gnav-bar .gnav {
  max-width: 1280px; height: 64px; padding: 0 28px; gap: 6px;
  display: flex; align-items: center; justify-content: space-between;
}
.gnav > a, .gnav-item-wrap { height: auto; display: flex; align-items: center }
.gnav-item-wrap { position: relative }

.gnav > a, .gnav-item-wrap > a {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 46px; padding: 0 16px; gap: 0;
  border-radius: 23px; background: transparent;
  font-size: 15px; font-weight: 700; letter-spacing: 0.05em; color: #000;
  white-space: nowrap;
  box-shadow: inset 0 0 0 0 var(--tanpopo);
  transition: background-color .2s, box-shadow .2s, transform .2s;
}
.gnav > a::before, .gnav-item-wrap > a::before {
  content: attr(data-en); display: block;
  font-size: 13px; font-weight: 700; letter-spacing: 0.14em; line-height: 1;
  color: var(--ink-3);
  transform: scale(0.8); transform-origin: center bottom;
  margin-bottom: 1px;
  transition: color .2s;
}
/* 下線は使わない */
.gnav > a::after, .gnav-item-wrap > a::after { display: none }

/* ホバー：黄の縁取りで浮かせる */
.gnav > a:hover, .gnav-item-wrap:hover > a, .gnav-item-wrap:focus-within > a {
  background: #FFFFFF;
  box-shadow: inset 0 0 0 2px var(--tanpopo);
  transform: translateY(-1px);
}
.gnav > a:hover::before, .gnav-item-wrap:hover > a::before { color: var(--tanpopo-d) }

/* 現在地：黄で塗る */
.gnav > a.is-current, .gnav-item-wrap > a.is-current {
  background: var(--tanpopo);
  box-shadow: none;
  transform: none;
}
.gnav > a.is-current::before, .gnav-item-wrap > a.is-current::before { color: #6B5200 }

.gnav-chev { position: absolute; right: 4px; bottom: 7px; color: var(--ink-3); transition: transform .2s }
.gnav-item-wrap > a { padding-right: 22px }
.gnav-item-wrap:hover > a > .gnav-chev { transform: rotate(180deg); color: var(--tanpopo-d) }
.gnav-item-wrap > a.is-current > .gnav-chev { color: #6B5200 }

.gnav-dropdown {
  top: calc(100% + 4px); left: 50%; transform: translate(-50%, 6px); min-width: 200px;
  background: #FFFFFF; padding: 8px; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 14px 30px rgba(0,0,0,0.12);
}
.gnav-item-wrap:hover .gnav-dropdown, .gnav-item-wrap:focus-within .gnav-dropdown { transform: translate(-50%, 0) }
.gnav-dropdown a {
  border-radius: 10px; border-left: 0; padding: 11px 16px;
  color: #000; font-weight: 700; font-size: 15px;
}
.gnav-dropdown a:hover, .gnav-dropdown a:focus-visible { background: var(--tanpopo); color: #000 }

@media (max-width: 1180px) {
  .gnav-bar .gnav { padding: 0 20px; gap: 2px }
  .gnav > a, .gnav-item-wrap > a { font-size: 14px; padding: 0 11px; height: 44px }
  .gnav-item-wrap > a { padding-right: 18px }
  .gnav-chev { right: 2px }
}
@media (max-width: 1080px) {
  .gnav-bar { display: none }
}

/* === SKY FEATURES === 「園の特徴」の地色をグレーから水色へ */
.features { background: var(--mizu) }
.features > .inner:first-child .section-label { color: #A4CDEC }
.features .feature-block-img { box-shadow: 5px 10px 0 #2c6a9a1a }
.features .feature-more-btn { background: #FFFFFF }

/* === MIN 13PX === SPの小文字を13pxに底上げ（front-page側の上書きを戻す） */
@media (max-width: 768px) {
  .badge-strip .fact-card small { font-size: 13px }
}