/* NAG YOGAベース v2：PCの左右レールはstyle.cssの提案を維持。 */
/* 実サイトを確認した値：header 70px / #424242 / 線30×3px / nav rgba(66,66,66,.5)。 */
:root{--header-height:70px;--header-color:#424242;--page-color:#f3efef}
html{scroll-padding-top:90px}
.main{background:var(--page-color);color:var(--ink);letter-spacing:.1em;line-height:1.5}
.section{padding:60px 25px}
.section-title h2{font-size:24px;font-weight:400;line-height:1.5;letter-spacing:.07em}
.section-title p{font-size:14px;line-height:1.7;letter-spacing:.06em}
.section-title{margin-bottom:35px}
.features{padding-top:65px}
.features .feature{margin-bottom:55px}
.features .feature-left .feature-visual{flex-direction:row}
.features .feature-left .feature-visual .media{margin-left:auto;margin-right:0}
.features .feature-left .feature-number{left:24px;right:auto}
.features .feature-right .feature-visual{flex-direction:row-reverse}
.features .feature-right .feature-visual .media{margin-left:0;margin-right:auto}
.features .feature-right .feature-number{left:auto;right:24px;text-align:right}
.features .feature-right .feature-copy{text-align:right}
.feature-copy{padding:22px 25px 0}
.feature-copy h3{font-size:20px !important;line-height:1.5;font-weight:400;margin-bottom:10px}
.feature-copy p{font-size:13px !important;line-height:1.8;letter-spacing:.06em}
.main .button{padding:20px 30px;border-color:#bcbcbc;font-size:14px;max-width:none;margin:20px 15px;line-height:1.5}
.main .button strong{font-size:18px}
.main .button small{font-size:12px;margin-top:4px}
.recommend h2,.studio h2,.trial>h2{font-size:17px;font-weight:400;line-height:1.5}
.studio-links .button{padding:12px 25px;background:#646666;font-size:12px;margin:12px 15px}
.trial .button-fill{padding:12px 25px;margin:0 30px;font-size:18px}
.trial-copy p{font-size:12px;line-height:1.8}
.plans{gap:15px}
.plan{min-height:250px;background:#dfdfdf}
.plan-tag{font-size:14px;padding:10px 3px;background:#6c6d6d}
.plan-description{font-size:14px;line-height:1.7;margin:20px 5px}
.plan h3{font-size:16px;line-height:1.6;border-color:#bcbcbc}
.plan-price{font-size:24px;margin-top:8px}
.plan.featured{background:#e0ece6}
.plan.featured .plan-tag{background:var(--accent)}
.news{background:#f5f8f6}
.news-list a{font-size:13px;line-height:1.7}
.footer{background:#424242;line-height:1.7}
.footer .brand{color:white}
.main .hero{height:100svh;min-height:600px;max-height:1000px}
.main .hero-campaign{left:auto;right:0;bottom:20%;width:70%}
.hero-copy{position:absolute;right:0px;text-align:right;margin-bottom:140px}
.main .mobile-header{display:none}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* スマートフォンのヘッダーとメニュー */
.mobile-header .brand,.dialog-header .brand{display:block;text-align:left;color:#fff}
.mobile-header .brand small,.dialog-header .brand small{font:8px/1.4 var(--font-en);letter-spacing:.08em}
.mobile-header .brand strong,.dialog-header .brand strong{font:400 19px/1.25 var(--font-en);letter-spacing:0}
.mobile-header .brand img,.dialog-header .brand img{width:auto;height:30px;max-width:calc(100vw - 85px);object-fit:contain;margin:0;filter:brightness(0) invert(1)}
.menu-toggle,.dialog-close{position:absolute;top:50%;right:13px;transform:translateY(-50%);width:44px;height:44px;padding:7px;background:none;border:0;margin:0;color:white}
.menu-toggle span,.dialog-close span{display:block;width:30px;height:3px;background:#fff;margin:6px 0;transition:transform .3s,opacity .3s}
.menu-toggle[aria-expanded=true] span:first-child,.dialog-close span:first-child{transform:translateY(9px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:nth-child(2),.dialog-close span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded=true] span:last-child,.dialog-close span:last-child{transform:translateY(-9px) rotate(-45deg)}
#menu-dialog{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:transparent;color:white;letter-spacing:.1em}
#menu-dialog::backdrop{background:rgba(66,66,66,.5)}
.dialog-header{position:absolute;inset:0 0 auto;height:var(--header-height);display:flex;align-items:center;background:var(--header-color);padding:0 10px;z-index:2;box-shadow:0 3px 10px #00000014}
.menu-panel{position:absolute;inset:var(--header-height) 0 0;background:rgba(66,66,66,.5);overflow-y:auto;overscroll-behavior:contain;animation:nag-slide-in .4s both}
.menu-panel nav{width:min(320px,calc(100% - 70px));margin:50px auto 45px}
.menu-panel .nav-list li{border:0;margin:25px 0;opacity:0;animation:nag-fade-up .6s both;animation-delay:calc(var(--menu-index,0) * .1s + .1s)}
.menu-panel .nav-list a{padding:0;line-height:1.2;color:#fff}
.menu-panel .nav-list span{font-family:var(--font-body);font-size:18px;letter-spacing:.1em;line-height:1.2}
.menu-panel .nav-list small{display:block;font-family:var(--font-body);font-size:12px;color:white;letter-spacing:.1em;line-height:1.2;margin-top:3px}
.menu-panel a:hover{opacity:.7}
.menu-panel .menu-reservation{border:1px solid white;background:none;color:white;max-width:none;width:100%;margin:30px 0 0;padding:25px 20px;font-size:16px}
#menu-dialog.closing .menu-panel{animation:nag-slide-out .3s both}
@keyframes nag-slide-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes nag-slide-out{from{transform:translateX(0)}to{transform:translateX(100%)}}
@keyframes nag-fade-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1099px){
  .main{padding-top:var(--header-height)}
  .main .mobile-header{display:flex;position:fixed;inset:0 0 auto;width:100%;height:var(--header-height);background:var(--header-color);padding:0 10px;z-index:30;box-shadow:0 3px 10px #00000014}
  .mobile-header .menu-toggle{visibility:visible}
  .main .hero{height:calc(100svh - var(--header-height));min-height:480px;max-height:900px}
  .bottom-cta{padding:0;background:none;backdrop-filter:none;bottom:22px;width:min(90%,400px)}
  .bottom-cta a{padding:12px 20px;font-size:18px;box-shadow:2px 2px 3px #0005}
}
@media(max-width:500px){.main{width:100%}.hero h1{font-size:48px}.recommend-card p{font-size:11px}.main .button{margin-left:10px;margin-right:10px}.trial .button-fill{margin:0 25px}.plans{gap:10px}.plan h3{font-size:14px}.plan-description{font-size:13px}}
@media(max-width:360px){.feature-copy p{font-size:13px}.feature-copy h3{font-size:17px}.plan-tag{font-size:12px}.section{padding-left:20px;padding-right:20px}.menu-panel nav{width:calc(100% - 60px)}}
@media(prefers-reduced-motion:reduce){.menu-panel,.menu-panel .nav-list li,#menu-dialog.closing .menu-panel{animation:none;opacity:1;transform:none}}

p.plans-all{font-size:22px !important;}