/* Lower pages: the same rounded lettering, yellow paper and photo scrapbook as TOP. */
:root { --soft-yellow:#fff4cc; --paper-edge:#e4cf91; --warm-ink:#463719 }
h1,h2,h3,.section-title,.daily-class-title,.info-doc-title,.class-card-name,
.hours-card-label,.events-season-header,.policy-card-num,.attract-num,.feature-num {
 font-family:'Zen Maru Gothic','Hiragino Maru Gothic ProN',sans-serif; font-weight:700;
}
.page-kv { position:relative; isolation:isolate; overflow:hidden; background:var(--tanpopo); padding:66px 0 62px; border:0; border-radius:0 0 46% 4% / 0 0 24px 12px }
.page-kv .inner { position:relative; padding-right:210px; z-index:1 }
.page-kv::after { --flower-y:-45%; content:''; position:absolute; right:max(7%,calc((100vw - 1180px)/2)); top:50%; width:140px; height:140px; transform:translateY(var(--flower-y)) rotate(12deg); background:url('../img/tanpopo-smile.svg') center/contain no-repeat; filter:drop-shadow(5px 7px 0 #a27f1825) }
.page-kv-label { display:table; background:#fff7d6; border:1px dashed #c5a654; border-radius:30px; padding:5px 19px; font-size:12px; margin-bottom:19px; color:var(--warm-ink) }
.page-kv h1 { display:table; max-width:100%; font-size:clamp(32px,3.4vw,48px); line-height:1.6; background:#fff; padding:4px 22px 10px; transform:rotate(-2deg); box-shadow:5px 6px 0 #8b6a181c; border-radius:3px }
.page-kv-desc { font-size:16px; line-height:1.9; margin-top:25px; color:#302819 }
.breadcrumb { border:0; background:#fff; padding-block:22px }
.section-title { font-size:38px; padding-bottom:19px }
.section-title::after { width:65px; height:5px; border-radius:8px; transform:rotate(-3deg) }
.section-label { color:#7a6230; font-size:12px; letter-spacing:.24em }
.section--paper2,.goal-section,.access-section,.info-section--alt,.related-section { background:#fffbee }

/* The same raised paper buttons and mobile navigation as the TOP. */
.header-cta,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-tel,.footer-btn,.apply-tel,.form-submit button,.staff-box input[type=submit],.search-form-wrap button {
 position:relative; isolation:isolate; border-radius:27px 32px 26px 33px; transition:transform .18s,box-shadow .18s,background .18s;
}
.header-cta { border:0; border-radius:21px 26px 22px 27px; box-shadow:3px 3px 0 #000; padding:11px 21px; gap:10px; min-height:49px }
.header-cta svg { width:20px; height:20px; flex-shrink:0 }
.feature-more-btn { min-height:72px; padding:14px 17px 14px 29px; gap:27px; border:1px solid #000; background:#fff; color:#000; box-shadow:4px 5px 0 #000; font-weight:900; line-height:1.7; white-space:normal }
.feature-more-btn svg { width:38px; height:38px; flex-shrink:0; padding:10px; border:1px solid #000; border-radius:50%; background:var(--tanpopo); color:#000 }
.cta-section { padding:80px 0; background:var(--tanpopo); border:0 }
.cta-section h2 { font-size:40px; transform:rotate(-2deg); line-height:1.7 }
.cta-buttons { gap:24px; align-items:stretch }
.cta-btn { min-height:104px; padding:22px 32px; gap:17px; background:#fff; color:#000; border:1px solid #fff; box-shadow:4px 5px 0 #000; white-space:normal }
.cta-btn--tel { border-radius:32px 27px 34px 28px }
.cta-btn--mail::before,.mnav-cta::before { content:''; position:absolute; inset:6px; border:1px dashed #ded3af; border-radius:inherit; pointer-events:none }
.cta-btn > svg { width:44px; height:44px; padding:11px; border-radius:50%; flex-shrink:0; background:var(--tanpopo); color:#000 }
.cta-btn--tel > svg { border:1px solid #000 }
.cta-btn--tel .tel-sub { margin-top:6px; font-size:13px; color:var(--ink-2) }
.footer-btn { border-radius:14px; font-family:'Zen Maru Gothic',sans-serif }
.mnav-cta { min-height:62px; padding:17px; border:0; border-radius:24px; box-shadow:4px 5px 0 #000 }
.mnav-tel { border:1px solid #000; border-radius:15px; min-height:52px }
.mnav-toggle,.mnav-close { border:2px solid #000; box-shadow:2px 3px 0 #000 }
.apply-tel,.form-submit button,.staff-box input[type=submit],.search-form-wrap button { box-shadow:3px 4px 0 #b19136; font-family:'Zen Maru Gothic',sans-serif }
@media(hover:hover) and (pointer:fine) {
 .header-cta:hover,.feature-more-btn:hover,.cta-btn:hover,.mnav-cta:hover,.apply-tel:hover,.form-submit button:hover { background:#fff8dd; color:#000; transform:translate(-2px,-2px); box-shadow:5px 7px 0 #b19136 }
 .cta-btn--tel:hover .tel-sub { color:var(--ink-2) }
}
.header-cta:active,.feature-more-btn:active,.cta-btn:active,.mnav-cta:active,.apply-tel:active,.form-submit button:active { transform:translate(2px,3px); box-shadow:1px 1px 0 #b19136 }

/* Features: photographed moments and little numbered seals. */
.feature-detail { padding:36px 34px 60px }
.feature-item { max-width:1200px; gap:54px; margin-bottom:80px; align-items:center }
.feature-item-img { min-height:420px; border:9px solid white; border-bottom-width:26px; border-radius:8px; transform:rotate(-2deg); box-shadow:3px 6px 0 #8b6a1814; overflow:visible }
.feature-item-img img { border-radius:3px; object-position:center }
.feature-item-img::after { content:''; position:absolute; top:-18px; left:calc(50% - 42px); width:84px; height:24px; transform:rotate(5deg); background:#ffea97b8; z-index:1 }
.feature-item:nth-child(even) .feature-item-img { transform:rotate(2deg) }
.feature-item-body,.feature-item:first-child .feature-item-body { border:0; background:none; padding:12px 0 }
.feature-item-body h2 { font-size:30px; line-height:1.65 }
.feature-num { display:flex; align-items:center; justify-content:center; align-self:flex-start; width:68px; height:68px; background:var(--soft-yellow); border:1px dashed #d3b862; border-radius:45% 55% 48% 52%; font-size:32px; color:var(--warm-ink); margin-bottom:20px; letter-spacing:0 }
.detail-list { border-color:var(--paper-edge) }
.highlight-box,.hours-note,.contact-notice,.info-note,.events-monthly,.narashi-section { background:#fff9e4; border-color:var(--paper-edge); border-left-color:#f0cb5d; border-radius:8px 22px 20px 8px }

/* Policy and everyday life: rounded paper, stitched notes, photo borders. */
.philosophy-box { background:#fff2b8; border:1px dashed #c6a949; border-radius:35px 46px 32px 44px; font-family:'Zen Maru Gothic',sans-serif; font-size:25px; font-weight:700; box-shadow:7px 8px 0 #fff9e5 }
.policy-grid { background:none; border:0; gap:22px }
.policy-card { border:1px dashed var(--paper-edge); border-radius:25px; background:#fffdf6; padding:30px; align-items:flex-start }
.policy-card-num,.attract-num { font-size:30px; color:#8b6a24 }
.goal-cards { gap:26px }
.goal-card { border:1px solid #eadcb4; background:#fff; border-radius:44% 48% 20px 22px / 30% 30% 20px 22px; padding-top:34px }
.goal-icon { border-radius:46% 54% 48% 52%; background:#ffe781; color:#634b1c }
.tokushoku-img img,.timeline-photo,.facility-item img,.events-photos img,.single-eyecatch img { border:7px solid white; border-bottom-width:19px; border-radius:6px; box-shadow:3px 5px 0 #70552018 }
.tokushoku-img img { transform:rotate(2deg) }
.daily-class-title { background:var(--soft-yellow); color:#49371a; border:1px dashed #cdb565; border-radius:20px; transform:rotate(-2deg) }
.timeline { border-left:2px dashed #e3cc8d }
.timeline-time { border:1px solid #d2b961; border-radius:15px 18px 14px 17px; background:#fff0b1; color:#49371a }
.timeline-time--afternoon { background:#eff5dd; color:#425832; border-color:#c8d6a7 }
.timeline-time--evening { background:#fff0e8; color:#74523b; border-color:#dfc5b0 }
.timeline-item { padding-bottom:38px }
.events-grid { background:none; gap:18px }
.events-season { border:1px solid #eadcb4; border-radius:23px; overflow:hidden }
.events-season--spring .events-season-header { background:#fbe4e8; color:#753e4f }
.events-season--summer .events-season-header { background:#edf4d9; color:#466132 }
.events-season--autumn .events-season-header { background:#fff0b8; color:#725323 }
.events-season--winter .events-season-header { background:#e6f2f7; color:#3f6171 }
.events-photos { gap:18px }
.events-monthly { border-left-width:4px }

/* Practical information keeps its clear tables and comfortable reading width. */
.overview-table th { background:#fff8df }
.overview-table th,.overview-table td,.job-table th,.job-table td { border-color:#e7dfcd }
.hours-card { background:#fff2bc; border:1px dashed #d1b560; border-radius:28px 34px 27px 33px }
.hours-card-time { color:#483717 }
.doctor-card,.class-card,.job-card,.attract-card,.contact-card,.form-card,.privacy-card,.staff-box,.message-box { border-color:#e8dbb8; border-radius:26px; background:#fffdf7 }
.class-card { overflow:hidden }
.class-card::before { height:5px; opacity:.55 }
.class-card-capacity,.job-card-badge,.pdf-year-label,.blog-cat,.form-group .req { border-radius:30px; background:var(--soft-yellow); color:#4f3c1b }
.job-card { border-top-color:#f1d16b; border-top-width:5px }
.job-card--green { border-top-color:#cbdbaa }
.job-card--blue { border-top-color:#bedde9 }
.message-box .message-photo { border-radius:20px; overflow:hidden }
.apply-box { background:#fff0b1; border-radius:35px 45px 32px 44px }
.map-wrap,.access-map { border:7px solid #fff; border-radius:8px; box-shadow:4px 6px 0 #70552012; overflow:hidden }
.info-docs,.pdf-year-list,.kujou-taisei,.kujou-steps { gap:16px }
.info-doc { border-color:#e8dbb8; border-radius:24px; background:#fffdf7 }
.info-doc:hover { background:#fff5d1; border-color:#c2a353 }
.info-doc-icon,.contact-card-icon { border-radius:46% 54% 48% 52%; background:#fff0b1; color:#715821 }
.pdf-year { border-color:#e8dbb8; border-radius:15px }
.kujou-taisei-item { background:#fff7dc; border-radius:20px }
.kujou-steps > li { border-color:#e8dbb8; border-radius:20px }
.kujou-steps > li::before { border-radius:50%; background:#ffec9e; color:#5c471e }
.contact-methods { gap:24px }
.form-group input,.form-group textarea,.staff-box input[type=password],.search-form-wrap input { border-color:#ccb982; border-radius:12px; background:#fff; min-width:0 }
.form-group input:focus,.form-group textarea:focus { outline-color:#876a2d }
.privacy-contact-box,.privacy-article .note { background:#fff6d8; border-radius:16px }
.privacy-article h3 { border-left-color:#f0cf6d; padding-block:2px }
.privacy-card { background:white }
.blog-grid { gap:32px }
.blog-card { border:1px solid #eadfbe; border-radius:10px 10px 24px 24px; padding:9px 9px 0; box-shadow:4px 6px 0 #7055200e }
.blog-card-img { border-radius:5px }
.blog-card:nth-child(3n + 2) { margin-top:18px }
.blog-card:hover { border-color:#c2a353; background:#fffdf5 }
.blog-card-body { padding:23px 17px 27px }
.page-numbers { border-radius:50%; border-color:#e8dbb8 }
.post-nav-link { border-radius:18px; border-color:#e8dbb8 }

@media(max-width:1080px) {
 .feature-item { gap:32px; max-width:780px; margin-bottom:60px }
 .feature-item-img { height:430px; min-height:0 }
 .feature-item-body { padding:0 10px }
 .page-kv .inner { padding-right:160px }
 .page-kv::after { width:110px; height:110px; right:30px }
}
@media(max-width:768px) {
 .page-kv { padding:35px 0 38px; border-radius:0 0 35% 3% / 0 0 16px 8px }
 .page-kv .inner { padding-inline:22px }
 .page-kv::after { --flower-y:0px; width:64px; height:64px; top:12px; right:16px; transform:rotate(12deg) }
 .page-kv-label { margin-bottom:28px; font-size:11px; padding:4px 14px; max-width:calc(100% - 70px) }
 .page-kv h1 { font-size:29px; padding:5px 13px 9px; line-height:1.65 }
 .page-kv-desc { font-size:15px; margin-top:24px }
 .section-title { font-size:29px }
 .feature-detail { padding:25px 22px 25px }
 .feature-item-img { height:300px; border-width:6px; border-bottom-width:20px }
 .feature-item-body,.feature-item:first-child .feature-item-body { padding:0 }
 .feature-item-body h2 { font-size:25px }
 .feature-num { width:56px; height:56px; font-size:27px }
 .philosophy-box { padding:28px 24px; font-size:21px; border-radius:25px 32px 24px 30px }
 .policy-card { padding:24px 21px; gap:16px }
 .goal-card { border-radius:26px; padding:28px 22px }
 .timeline-item { grid-template-columns:76px minmax(0,1fr); gap:14px }
 .events-grid { gap:12px }
 .events-month { padding:13px }
 .events-photos { gap:13px }
 .doctor-grid,.class-grid,.kujou-taisei,.pdf-year-list { grid-template-columns:minmax(0,1fr) }
 .contact-card { padding:28px 18px }
 .job-card { padding:26px 20px }
 .blog-card:nth-child(3n + 2) { margin-top:0 }
 .cta-section { padding:60px 0 }
 .cta-section h2 { font-size:28px; line-height:1.75 }
 .cta-section h2 span { white-space:normal }
 .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 }
 .feature-more-btn { padding:13px 14px 13px 22px; gap:14px; justify-content:space-between; min-height:70px }
 .fixed-cta { left:8px; right:8px; bottom:calc(10px + env(safe-area-inset-bottom)); border:2px solid #000; border-radius:20px; background:#fff; padding:5px; gap:3px; box-shadow:0 5px 0 #000 }
 .fixed-cta.hidden { transform:translateY(calc(100% + 35px + env(safe-area-inset-bottom))) }
 .fixed-cta-item { min-height:58px; min-width:0; border:0; border-radius:13px; padding:6px 1px; font-size:13px; letter-spacing:0; line-height:1.5 }
 .fixed-cta-item svg { width:20px; height:20px }
 .fixed-cta-item:nth-child(4) { color:#fff; background:#000 }
 .fixed-cta-item:nth-child(4) svg { color:var(--tanpopo) }
 .fixed-cta-item:focus-visible { outline-offset:-3px }
 body { padding-bottom:105px }
}
@media(prefers-reduced-motion:reduce) {
 .header-cta,.feature-more-btn,.cta-btn,.mnav-cta,.mnav-tel,.apply-tel,.form-submit button { transition:none; transform:none }
}

/* The smiling flower gently bobs and sways on every page heading. */
@keyframes page-flower-sway {
 0%,100% { transform:translateY(var(--flower-y)) rotate(12deg); }
 50% { transform:translateY(calc(var(--flower-y) - 8px)) rotate(-10deg); }
}
@media(prefers-reduced-motion:no-preference) {
 .page-kv::after { animation:page-flower-sway 5s ease-in-out infinite; transform-origin:50% 60%; }
}

/* === 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 }
}
