/* Generated from the approved Piano Flex demo. */
:root {
      --teal-deep:#1A5F6A; --teal-main:#2A7A7A; --teal-mid:#4A9A9A;
      --teal-light:#C8E6E6; --teal-pale:#EAF5F5; --off-white:#F8F7F4;
      --white:#FFFFFF; --charcoal:#2C2C2C; --gray-mid:#6B6B6B; --gray-light:#E8E4DF;
      --line-green:#06C755;
      --serif-jp:'Noto Serif JP',serif;
      --sans-jp:'Zen Kaku Gothic New',sans-serif;
      --serif-en:'Cormorant Garamond',serif;
    }

    html, body {
  overflow-x: hidden;
}

/*
 * This stylesheet is loaded only by the matching page template.
 * Keep the layout independent of WordPress body classes.
 */
#content.l-content,
#content,
.l-content,
.l-mainContent {
  width: 100%;
  max-width: none;
  margin-top: 0;
  padding-top: 0;
}

#content.l-content,
#content {
  margin-bottom: 0;
}

.pf-page {
  width: 100vw;
  max-width: none;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}
    body { background:var(--white); color:var(--charcoal); font-family:var(--sans-jp); font-weight:300; }
    *, *::before, *::after { box-sizing:border-box; }
    a { color:inherit; }

    .pf-page { overflow:hidden; }
    .pf-container { width:min(100% - 12vw, 1040px); margin:0 auto; }
    .pf-section { padding:104px 0; position:relative; }
    .pf-section--bg::before { content:''; position:absolute; inset:0 calc(50% - 50vw); background:var(--off-white); z-index:0; }
    .pf-section--bg > .pf-container { position:relative; z-index:1; }
    .pf-label { display:flex; align-items:center; gap:16px; margin:0 0 28px; }
    .pf-label__en { color:var(--teal-main); font-family:var(--serif-en); font-size:13px; font-style:italic; letter-spacing:.3em; text-transform:uppercase; }
    .pf-label__line { width:48px; height:1px; background:var(--teal-light); }
    .pf-heading { margin:0 0 26px; color:var(--charcoal); font-family:var(--serif-jp); font-size:clamp(25px, 3.2vw, 38px); font-weight:300; line-height:1.58; }
    .pf-heading span { color:var(--teal-main); }
    .pf-heading .pf-line-break { color:inherit; }
    .pf-copy { max-width:720px; font-size:15px; line-height:2.1; }
    .pf-copy p { margin:0; }
    .pf-copy p + p { margin-top:1.25em; }
    .pf-copy strong { color:var(--teal-main); font-weight:500; }
    .pf-copy--light { color:rgba(255,255,255,.82); }
    .pf-line-break { display:block; }
    .br-sp { display:none; }

    .pf-hero { min-height:720px; position:relative; display:flex; align-items:flex-end; padding:84px 0; color:var(--white); background:var(--teal-deep); }
    .pf-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(26,95,106,.93) 16%, rgba(26,95,106,.7) 58%, rgba(26,95,106,.5)); z-index:1; }
    .pf-hero__photo { position:absolute; inset:0; background:url('https://images.unsplash.com/photo-1552422535-c45813c61732?w=1800&q=85') center/cover no-repeat; }
    .pf-hero__glow { position:absolute; inset:0; background:radial-gradient(ellipse 70% 90% at 18% 0%, rgba(200,230,230,.10) 0%, transparent 60%); z-index:2; }
    .pf-hero__rule { position:absolute; top:0; right:18%; width:1px; height:100%; background:linear-gradient(180deg, transparent, rgba(255,255,255,.14), transparent); z-index:3; }
    .pf-hero__inner { width:min(100% - 12vw, 1040px); margin:0 auto; position:relative; z-index:4; }
    .pf-hero__eyebrow { margin:0 0 18px; color:var(--teal-light); font-family:var(--serif-en); font-size:14px; font-style:italic; letter-spacing:.38em; text-transform:uppercase; }
    .pf-hero__title { margin:0 0 25px; max-width:700px; color:var(--white); font-family:var(--serif-jp); font-size:clamp(37px,5vw,62px); font-weight:300; line-height:1.45; }
    .pf-hero__title span { color:var(--teal-light); }
    .pf-hero__sub { margin:0 0 31px; max-width:510px; color:rgba(255,255,255,.78); font-size:15px; line-height:2; }

    .pf-line-button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:13px 31px; border-radius:999px; background:var(--line-green); color:var(--white); font-family:var(--sans-jp); font-size:14px; font-weight:400; letter-spacing:.08em; text-decoration:none; transition:transform .2s, background .2s; }
    .pf-line-button:hover { background:var(--line-green); transform:translateY(-2px); }
    .pf-button-note { display:block; margin-top:11px; color:rgba(255,255,255,.68); font-size:11px; letter-spacing:.04em; }

    .pf-purpose { display:grid; grid-template-columns:minmax(0, .92fr) minmax(290px, .75fr); align-items:start; gap:70px; }
    .pf-purpose__quote { margin:20px 0 0; padding:29px 0 29px 29px; border-left:1px solid var(--teal-light); color:var(--teal-deep); font-family:var(--serif-jp); font-size:clamp(22px,2.5vw,31px); font-weight:300; line-height:1.7; }

    .pf-area-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; margin-top:48px; }
    .pf-area-card { min-height:392px; display:flex; flex-direction:column; border:1px solid var(--gray-light); background:var(--white); }
    .pf-area-card__head { min-height:139px; display:flex; flex-direction:column; justify-content:flex-end; padding:26px; background:var(--teal-deep); }
    .pf-area-card__num { margin:0 0 9px; color:var(--teal-light); font-family:var(--serif-en); font-size:13px; font-style:italic; letter-spacing:.3em; }
    .pf-area-card__title { margin:0; color:var(--white); font-family:var(--serif-jp); font-size:22px; font-weight:300; }
    .pf-area-card__body { display:flex; flex:1; flex-direction:column; padding:25px 26px 27px; }
    .pf-area-card__lead { margin:0 0 16px; color:var(--teal-deep); font-family:var(--serif-jp); font-size:16px; font-weight:400; line-height:1.7; }
    .pf-area-card__text { margin:0; color:var(--gray-mid); font-size:13px; line-height:1.95; }
    .pf-area-details { display:grid; gap:18px; margin-top:18px; }
    .pf-area-detail { display:grid; grid-template-columns:178px minmax(0, 1fr); gap:26px; padding:31px; border:1px solid var(--gray-light); background:var(--white); }
    .pf-area-detail__label { margin:0; color:var(--teal-main); font-family:var(--serif-en); font-size:12px; font-style:italic; letter-spacing:.28em; }
    .pf-area-detail__content { color:var(--gray-mid); font-size:14px; line-height:2; }
    .pf-area-detail__content p { margin:0; }
    .pf-area-detail__content p + p { margin-top:1.2em; }
    .pf-area-detail__content strong { color:var(--teal-main); font-weight:500; }
    .pf-detail-list { margin:1.15em 0; padding:0; list-style:none; }
    .pf-detail-list li { position:relative; padding-left:17px; }
    .pf-detail-list li::before { content:''; position:absolute; top:.95em; left:0; width:5px; height:5px; border-radius:50%; background:var(--teal-main); }

    .pf-flow { margin:48px 0 0; padding:0; list-style:none; }
    .pf-flow__item { display:grid; grid-template-columns:72px minmax(0, 1fr); column-gap:27px; min-height:122px; }
    .pf-flow__track { display:flex; flex-direction:column; align-items:center; }
    .pf-flow__number { width:48px; height:48px; display:flex; align-items:center; justify-content:center; flex:none; border:1px solid var(--teal-main); border-radius:50%; background:var(--white); color:var(--teal-main); font-family:var(--serif-en); font-size:18px; font-style:italic; }
    .pf-flow__line { width:1px; flex:1; min-height:34px; background:linear-gradient(180deg, var(--teal-light), transparent); }
    .pf-flow__item:last-child .pf-flow__line { display:none; }
    .pf-flow__content { padding:5px 0 37px; }
    .pf-flow__label { margin:0 0 3px; color:var(--teal-mid); font-family:var(--serif-en); font-size:11px; font-style:italic; letter-spacing:.24em; text-transform:uppercase; }
    .pf-flow__title { margin:0 0 8px; color:var(--charcoal); font-family:var(--serif-jp); font-size:18px; font-weight:400; }
    .pf-flow__text { margin:0; max-width:670px; color:var(--gray-mid); font-size:14px; line-height:1.9; }
    .pf-flow__list { margin:12px 0 0; padding:0; list-style:none; max-width:670px; color:var(--gray-mid); font-size:14px; line-height:1.9; }
    .pf-flow__list li { position:relative; padding-left:17px; }
    .pf-flow__list li::before { content:''; position:absolute; top:.85em; left:0; width:5px; height:5px; border-radius:50%; background:var(--teal-main); }

    .pf-compare { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:42px; }
    .pf-compare__panel { padding:34px; border:1px solid var(--gray-light); background:var(--white); }
    .pf-compare__panel--deep { border-color:var(--teal-deep); background:var(--teal-deep); color:var(--white); }
    .pf-compare__eyebrow { margin:0 0 10px; color:var(--teal-main); font-family:var(--serif-en); font-size:12px; font-style:italic; letter-spacing:.3em; text-transform:uppercase; }
    .pf-compare__panel--deep .pf-compare__eyebrow { color:var(--teal-light); }
    .pf-compare__title { margin:0 0 14px; color:var(--teal-deep); font-family:var(--serif-jp); font-size:21px; font-weight:300; line-height:1.65; }
    .pf-compare__panel--deep .pf-compare__title { color:var(--white); }
    .pf-compare__text { margin:0; color:var(--gray-mid); font-size:14px; line-height:1.95; }
    .pf-compare__panel--deep .pf-compare__text { color:rgba(255,255,255,.76); }
    .pf-compare__list { margin:16px 0; padding-left:1.35em; color:rgba(255,255,255,.76); font-size:14px; line-height:1.9; }

    .pf-teacher { padding:52px; background:var(--teal-pale); border-left:1px solid var(--teal-main); }
    .pf-teacher .pf-heading { margin-bottom:18px; }

    .pf-review { display:grid; grid-template-columns:.9fr 1.1fr; gap:0; margin-top:42px; border:1px solid var(--gray-light); background:var(--white); }
    .pf-review__label { display:flex; flex-direction:column; justify-content:flex-end; min-height:250px; padding:35px; background:var(--teal-deep); position:relative; overflow:hidden; }
    .pf-review__label::before { content:'REVIEW'; position:absolute; top:16px; left:22px; color:rgba(255,255,255,.05); font-family:var(--serif-en); font-size:clamp(62px,9vw,112px); font-style:italic; letter-spacing:.1em; }
    .pf-review__label h2 { margin:0; color:var(--white); font-family:var(--serif-jp); font-size:25px; font-weight:300; line-height:1.65; position:relative; }
    .pf-review__body { padding:38px; }
    .pf-review__body p { margin:0; color:var(--gray-mid); font-size:14px; line-height:2; }
    .pf-review__body p + p { margin-top:1.2em; }

    .pf-format-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; margin-top:45px; }
    .pf-format { min-height:230px; display:flex; flex-direction:column; justify-content:space-between; padding:29px; border:1px solid var(--gray-light); background:var(--white); color:inherit; text-decoration:none; transition:transform .2s, box-shadow .2s; }
    .pf-format:hover { transform:translateY(-3px); box-shadow:0 6px 24px rgba(26,95,106,.10); }
    .pf-format:focus-visible { outline:2px solid var(--teal-main); outline-offset:3px; }
    .pf-format__number { margin:0 0 12px; color:var(--teal-main); font-family:var(--serif-en); font-size:12px; font-style:italic; letter-spacing:.3em; }
    .pf-format__name { margin:0 0 12px; color:var(--teal-deep); font-family:var(--serif-jp); font-size:22px; font-weight:300; line-height:1.55; }
    .pf-format__text { margin:0; color:var(--gray-mid); font-size:13px; line-height:1.9; }
    .pf-format__hint { margin:26px 0 0; color:var(--teal-main); font-size:12px; letter-spacing:.08em; }
    .pf-format-notice { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:44px; align-items:center; margin-top:18px; padding:29px; border-left:2px solid var(--teal-main); background:var(--teal-pale); }
    .pf-format-notice__label { margin:0 0 8px; color:var(--teal-main); font-family:var(--serif-en); font-size:12px; font-style:italic; letter-spacing:.3em; text-transform:uppercase; }
    .pf-format-notice__title { margin:0; color:var(--teal-deep); font-family:var(--serif-jp); font-size:20px; font-weight:300; line-height:1.65; }
    .pf-format-notice__text { margin:0; color:var(--gray-mid); font-size:14px; line-height:2; }
    .pf-format-notice__guide { display:block; margin-top:7px; color:var(--teal-deep); }

    .pf-cta { width:100vw; margin-left:calc(50% - 50vw); padding:112px 0; position:relative; overflow:hidden; background:var(--teal-deep); text-align:center; }
    .pf-cta::before { content:'LESSON'; position:absolute; top:50%; left:50%; color:rgba(255,255,255,.05); font-family:var(--serif-en); font-size:clamp(64px, 11vw, 130px); font-style:italic; font-weight:300; letter-spacing:.2em; transform:translate(-50%, -50%); white-space:nowrap; }
    .pf-cta::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 90% at 18% 0%, rgba(200,230,230,.10) 0%, transparent 60%); pointer-events:none; }
    .pf-cta__inner { width:min(100% - 12vw, 860px); margin:0 auto; position:relative; z-index:1; }
    .pf-cta__eyebrow { margin:0 0 20px; color:var(--teal-light); font-family:var(--serif-en); font-size:13px; font-style:italic; letter-spacing:.34em; }
    .pf-cta__title { margin:0 0 28px; color:var(--white); font-family:var(--serif-jp); font-size:clamp(25px,3vw,37px); font-weight:300; line-height:1.65; }

    .pf-fade { opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
    .pf-fade.pf-visible { opacity:1; transform:none; }

    @media (max-width: 760px) {
      .pf-container, .pf-hero__inner, .pf-cta__inner { width:min(100% - 42px, 600px); }
      .pf-section { padding:72px 0; }
      .pf-hero { min-height:680px; padding:65px 0; }
      .pf-hero::before { background:rgba(26,95,106,.79); }
      .pf-hero__title { font-size:39px; line-height:1.5; }
      .pf-hero__sub { font-size:14px; }
      .pf-purpose, .pf-review { grid-template-columns:1fr; gap:32px; }
      .pf-area-grid { grid-template-columns:1fr; margin-top:34px; }
      .pf-area-card { min-height:0; }
      .pf-area-card__head { min-height:122px; }
      .pf-area-detail { grid-template-columns:1fr; gap:12px; padding:25px 22px; }
      .pf-compare { grid-template-columns:1fr; }
      .pf-teacher { padding:30px 24px; }
      .pf-review__label { min-height:190px; }
      .pf-review__label h2 { font-size:22px; }
      .pf-format-grid { grid-template-columns:1fr; }
      .pf-format-notice { grid-template-columns:1fr; gap:16px; padding:25px 22px; }
      .pf-format-notice__title { font-size:18px; }
      .pf-line-button { width:100%; }
      .pf-cta { padding:84px 0; }
      .br-sp { display:block; }
    }