:root{--pink:rgb(255,110,187);--blue:#1EBADE;--pale:#E8F8FC;--navy:#00529B;--deep:#003E73;--text:#1f2f3d;--muted:#64748b;--line:#d7edf5;--white:#fff;--shadow:0 10px 30px rgba(0,82,155,.08);--radius:18px;--font-ja:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;--font-en:"Montserrat",Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:var(--font-ja);background:#fff;line-height:1.8;letter-spacing:.03em}img{width:100%;height:auto;display:block}a{text-decoration:none;color:inherit}.page{overflow:hidden}.container{width:min(1180px,calc(100% - 64px));margin:0 auto}.section{padding:74px 0}.section--pale{background:linear-gradient(180deg,#fff 0%,var(--pale) 100%)}.section-head{display:flex;align-items:baseline;gap:18px;margin-bottom:28px}.section-title{margin:0;color:var(--navy);font-family:var(--font-en);font-size:42px;line-height:1;font-weight:900;letter-spacing:.05em}.section-subtitle{color:var(--blue);font-weight:800;font-size:15px}.lead{margin:0;font-size:17px;line-height:2;font-weight:500}.note{color:var(--muted);font-size:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:180px;min-height:48px;padding:12px 24px;border-radius:999px;border:2px solid transparent;font-weight:800;letter-spacing:.04em;transition:.2s}.btn:after{content:"›";font-size:22px;line-height:1}.btn--pink{color:#fff;background:var(--pink);box-shadow:0 8px 18px rgba(255,110,187,.28)}.btn--pink:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(255,110,187,.35)}.btn--outline{color:var(--navy);background:#fff;border-color:var(--line)}.btn--outline:hover{border-color:var(--blue);background:var(--pale)}.site-header{position:sticky;top:0;z-index:100;height:82px;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid rgba(30,186,222,.2)}.header-inner{width:min(1280px,calc(100% - 56px));height:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:28px}.logo{width:180px;flex-shrink:0}.logo img{width:180px}.global-nav{display:flex;align-items:center;justify-content:center;gap:26px;flex:1}.global-nav a{color:var(--navy);font-family:var(--font-en);font-size:13px;font-weight:900;letter-spacing:.08em}.global-nav a:hover{color:var(--pink)}.header-reserve{flex-shrink:0}.header-reserve .btn{min-width:176px;min-height:52px;border-radius:10px;font-size:14px}.header-reserve .btn:before{content:"□";font-size:16px}.hero{background:#fff}.hero-main{position:relative;width:100%;min-height:650px;display:grid;grid-template-columns:42% 58%;overflow:hidden}.hero-copy{position:relative;z-index:2;padding:88px 0 70px max(48px,calc((100vw - 1180px)/2));background:radial-gradient(circle at 20% 20%,rgba(232,248,252,.9),rgba(255,255,255,0) 48%),linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 78%,rgba(255,255,255,0) 100%)}.hero-logo-small{width:180px;margin-bottom:34px}.hero-title{margin:0 0 24px;color:var(--navy);font-family:var(--font-en);font-size:clamp(62px,6vw,92px);line-height:.98;font-weight:900;letter-spacing:.03em}.hero-title span{display:block;color:var(--pink)}.hero-catch-ja{margin:0 0 22px;color:var(--navy);font-size:32px;line-height:1.45;font-weight:900}.hero-catch-ja .pink{color:var(--pink)}.hero-text{margin:0;max-width:440px;color:var(--deep);font-size:16px;font-weight:700;line-height:2.1}.hero-brush{position:absolute;left:-40px;bottom:20px;width:520px;height:160px;background:linear-gradient(160deg,rgba(30,186,222,.22),rgba(30,186,222,0) 72%),linear-gradient(20deg,rgba(255,110,187,.18),rgba(255,110,187,0) 60%);border-radius:50%;transform:rotate(-6deg)}.hero-visual{position:relative;min-height:650px}.hero-visual img{width:100%;height:100%;object-fit:cover}.hero-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.85) 0%,rgba(255,255,255,0) 26%);z-index:1}.open-badge{position:absolute;right:52px;bottom:48px;z-index:3;width:136px;height:136px;border-radius:50%;color:#fff;background:var(--pink);display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-en);font-size:20px;line-height:1.15;font-weight:900;letter-spacing:.05em;box-shadow:0 14px 28px rgba(255,110,187,.34)}.hero-thumb-row{position:relative;z-index:4;width:min(1180px,calc(100% - 64px));margin:-54px auto 0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.hero-thumb{overflow:hidden;height:128px;border-radius:12px;box-shadow:var(--shadow);background:#fff}.hero-thumb img{height:100%;object-fit:cover}.how{padding-top:84px;padding-bottom:64px}.how-list{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr;align-items:center;gap:20px}.how-card{position:relative;padding:18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.how-num{position:absolute;top:-20px;left:22px;width:54px;height:54px;border-radius:50%;color:#fff;background:var(--pink);display:flex;align-items:center;justify-content:center;font-family:var(--font-en);font-size:22px;font-weight:900;box-shadow:0 8px 18px rgba(255,110,187,.28)}.how-card:first-child .how-num{background:var(--navy)}.how-img{height:165px;overflow:hidden;border-radius:12px;margin-bottom:18px}.how-img img{height:100%;object-fit:cover}.how-title{margin:0 0 6px;color:var(--navy);font-size:22px;font-weight:900}.how-text{margin:0;font-size:14px;line-height:1.8;font-weight:600}.how-arrow{color:var(--blue);font-size:42px;font-weight:900;text-align:center}.news-layout{display:grid;grid-template-columns:1fr 260px;gap:32px}.news-box,.instagram-card,.info-table,.plan-card,.common-box,.food-card,.area-card,.case-card,.access-card,.faq-item,.contact-box{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.news-box{padding:28px 34px;border-radius:var(--radius)}.news-list{margin:0;padding:0;list-style:none}.news-list li{display:grid;grid-template-columns:120px 100px 1fr;gap:20px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}.news-list li:last-child{border-bottom:0}.news-date{color:var(--muted);font-family:var(--font-en);font-weight:700}.news-cat{color:var(--blue);font-weight:800}.news-title{font-weight:600}.news-side{display:flex;flex-direction:column;gap:16px}.instagram-card{padding:24px;border-radius:var(--radius)}.instagram-card strong{display:block;color:var(--pink);font-family:var(--font-en);font-size:20px;margin-bottom:6px}.instagram-card span{font-size:13px;color:var(--muted)}.info-grid{display:grid;grid-template-columns:370px 1fr;gap:34px}.info-img{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.info-img img{height:100%;object-fit:cover}.info-table{border-radius:var(--radius);overflow:hidden}.info-row{display:grid;grid-template-columns:150px 1fr;border-bottom:1px solid var(--line)}.info-row:last-child{border-bottom:0}.info-label{padding:18px 22px;color:var(--navy);background:var(--pale);font-weight:900}.info-value{padding:18px 22px;font-weight:600}.plan-lead{margin-bottom:30px}.plan-list{display:flex;flex-direction:column;gap:18px}.plan-card{display:grid;grid-template-columns:280px 1fr 230px;overflow:hidden;border-radius:var(--radius)}.plan-img{height:100%;min-height:230px}.plan-img img{height:100%;object-fit:cover}.plan-body{padding:28px 32px}.plan-tag{color:var(--pink);font-family:var(--font-en);font-size:14px;font-weight:900;letter-spacing:.08em}.plan-name{margin:6px 0 4px;color:var(--navy);font-family:var(--font-en);font-size:31px;line-height:1.1;font-weight:900}.plan-name-ja{margin:0 0 16px;color:var(--blue);font-size:14px;font-weight:900}.plan-catch{margin:0 0 14px;font-size:17px;font-weight:900}.plan-detail{margin:0;font-size:14px;line-height:1.9}.plan-price-area{padding:28px 24px;background:linear-gradient(180deg,#fff 0%,var(--pale) 100%);border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;gap:18px}.plan-price{font-weight:900}.plan-price .yen{color:var(--navy);font-family:var(--font-en);font-size:34px;line-height:1}.plan-price small{display:block;margin-top:4px;color:var(--muted);font-size:12px}.plan-price-area .btn{width:100%;min-width:auto;border-radius:10px;font-size:14px}.plan-note{margin-top:18px;text-align:right}.common-wrap{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:22px}.common-box{padding:28px;border-radius:var(--radius)}.common-title{margin:0 0 18px;color:var(--navy);font-size:20px;font-weight:900}.check-list{margin:0;padding:0;list-style:none}.check-list li{position:relative;padding-left:28px;margin-bottom:12px;font-size:14px;font-weight:600}.check-list li:before{content:"✓";position:absolute;left:0;top:0;color:var(--pink);font-weight:900}.icon-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.icon-item{min-height:106px;padding:14px 10px;text-align:center;border:1px solid var(--line);border-radius:14px;background:var(--pale)}.icon-item img{width:38px;height:38px;object-fit:contain;margin:0 auto 8px}.icon-item span{display:block;color:var(--navy);font-size:12px;line-height:1.45;font-weight:900}.tool-text{margin:0;font-size:13px;line-height:2;font-weight:600}.food-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.food-card{display:grid;grid-template-columns:1fr 220px;overflow:hidden;border-radius:var(--radius)}.food-text{padding:30px}.food-label{color:var(--pink);font-family:var(--font-en);font-weight:900;letter-spacing:.08em;margin-bottom:8px}.food-text h3{margin:0 0 12px;color:var(--navy);font-size:24px}.food-text p{margin:0 0 20px;font-size:14px;font-weight:600}.food-img img{height:100%;object-fit:cover}.area-lead-grid{display:grid;grid-template-columns:360px 1fr;gap:34px;align-items:start;margin-bottom:28px}.area-main-img{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.area-main-img img{height:270px;object-fit:cover}.area-desc h3{margin:0 0 14px;color:var(--navy);font-size:28px;line-height:1.45;font-weight:900}.area-desc p{margin:0;font-size:15px;line-height:2;font-weight:600}.area-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.area-card{border-radius:var(--radius);overflow:hidden}.area-card-img{height:145px}.area-card-img img{height:100%;object-fit:cover}.area-card-body{padding:20px}.area-card-num{width:42px;height:42px;margin-bottom:12px;border-radius:50%;color:#fff;background:var(--blue);display:flex;align-items:center;justify-content:center;font-family:var(--font-en);font-weight:900}.area-card h3{margin:0 0 8px;color:var(--navy);font-size:19px;font-weight:900}.area-card p{margin:0;font-size:13px;line-height:1.8;font-weight:600}.case-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.case-card{border-radius:var(--radius);overflow:hidden}.case-img{height:140px}.case-img img{height:100%;object-fit:cover}.case-body{padding:20px}.case-body h3{margin:0 0 8px;color:var(--navy);font-size:18px;font-weight:900}.case-body p{margin:0;font-size:13px;line-height:1.8;font-weight:600}.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.access-card{padding:34px;border-radius:var(--radius)}.access-card h3{margin:0 0 14px;color:var(--navy);font-size:24px;font-weight:900}.access-card p{margin:0 0 18px;font-weight:600}.access-list{margin:0;padding:0;list-style:none}.access-list li{padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;font-weight:600}.access-list li:last-child{border-bottom:0}.map-img{overflow:hidden;border-radius:14px;margin-bottom:18px}.map-img img{height:250px;object-fit:cover}.faq-wrap{max-width:980px;margin:0 auto}.faq-list{display:flex;flex-direction:column;gap:12px}.faq-item{border-radius:14px;overflow:hidden}.faq-q{position:relative;padding:22px 66px 22px 26px;color:var(--navy);font-weight:900}.faq-q:after{content:"+";position:absolute;right:26px;top:50%;transform:translateY(-50%);color:var(--pink);font-size:28px;line-height:1}.faq-a{padding:0 26px 24px;font-size:14px;line-height:2;font-weight:600}.contact-box{padding:42px;border-radius:var(--radius);background:linear-gradient(135deg,rgba(232,248,252,.95),rgba(255,255,255,.95)),url("../img/bg-contact.jpg") center/cover no-repeat}.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}.contact-info{display:grid;gap:14px}.contact-info-item{padding:18px 22px;background:#fff;border:1px solid var(--line);border-radius:14px}.contact-info-item strong{display:block;color:var(--navy);margin-bottom:4px}.contact-info-item span{font-size:14px;font-weight:600}.contact-cta{padding:34px;text-align:center;background:#fff;border-radius:var(--radius);border:1px solid var(--line)}.contact-cta h3{margin:0 0 10px;color:var(--navy);font-size:28px;font-weight:900}.contact-cta p{margin:0 0 24px;font-weight:600}.contact-cta .btn{width:100%;min-height:62px;font-size:18px}.footer{padding:42px 0 30px;color:var(--navy);background:#fff;border-top:1px solid var(--line)}.footer-inner{width:min(1180px,calc(100% - 64px));margin:0 auto;text-align:center}.footer-logo{width:180px;margin:0 auto 20px}.footer-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:22px;margin-bottom:22px}.footer-nav a{font-family:var(--font-en);font-size:12px;font-weight:900;letter-spacing:.08em}.copyright{margin:0;color:var(--muted);font-size:12px}.sp-only{display:none!important}
@media screen and (max-width:1100px){.global-nav{gap:16px}.global-nav a{font-size:12px}.plan-card{grid-template-columns:240px 1fr 220px}.case-grid{grid-template-columns:repeat(3,1fr)}}
@media screen and (max-width:767px){body{font-size:14px;line-height:1.75;letter-spacing:.02em;padding-bottom:92px}.pc-only{display:none!important}.sp-only{display:block!important}.container{width:calc(100% - 36px)}.section{padding:52px 0}.section-head{display:block;margin-bottom:22px}.section-title{font-size:32px}.section-subtitle{display:block;margin-top:8px;font-size:13px}.lead{font-size:14px;line-height:1.9}.btn{width:100%;min-width:auto;min-height:48px;padding:12px 18px;font-size:14px}.site-header{height:66px}.header-inner{width:calc(100% - 28px);gap:12px}.logo,.logo img{width:142px}.global-nav{display:none}.header-reserve{margin-left:auto}.header-reserve .btn{min-width:116px;min-height:42px;padding:9px 12px;border-radius:8px;font-size:12px;white-space:nowrap}.header-reserve .btn:before{display:none}.header-reserve .btn:after{font-size:18px}.header-inner:after{content:"";width:32px;height:24px;flex:0 0 32px;background:linear-gradient(var(--navy),var(--navy)) 0 2px/32px 3px no-repeat,linear-gradient(var(--navy),var(--navy)) 0 11px/32px 3px no-repeat,linear-gradient(var(--navy),var(--navy)) 0 20px/32px 3px no-repeat}.hero-main{display:block;min-height:auto}.hero-copy{position:absolute;inset:0 auto auto 0;z-index:4;width:58%;padding:34px 0 0 20px;background:linear-gradient(90deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.72) 70%,rgba(255,255,255,0) 100%)}.hero-logo-small{display:none}.hero-title{margin-bottom:12px;font-size:42px}.hero-catch-ja{margin-bottom:12px;font-size:20px;line-height:1.35}.hero-text{max-width:210px;font-size:11px;line-height:1.75}.hero-brush{left:-70px;bottom:8px;width:300px;height:110px}.hero-visual{min-height:520px}.hero-visual img{height:520px;object-position:center}.hero-visual:before{background:linear-gradient(90deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.38) 46%,rgba(255,255,255,0) 76%),linear-gradient(180deg,rgba(255,255,255,0) 58%,rgba(255,255,255,.96) 100%)}.open-badge{right:18px;bottom:22px;width:88px;height:88px;font-size:14px}.hero-thumb-row{display:none}.how{padding-top:44px}.how-list{display:flex;flex-direction:column;gap:16px}.how-arrow{display:none}.how-card{display:grid;grid-template-columns:88px 1fr;gap:14px;align-items:center;min-height:128px;padding:14px 14px 14px 18px}.how-num{top:12px;left:12px;width:38px;height:38px;font-size:16px}.how-img{order:2;width:118px;height:86px;margin:0;grid-column:1;grid-row:1/span 2}.how-title{grid-column:2;margin:0 0 4px;font-size:18px}.how-text{grid-column:2;font-size:12px;line-height:1.7}.news-layout{display:block}.news-box{padding:20px}.news-list li{grid-template-columns:92px 1fr;gap:4px 12px;padding:13px 0;font-size:12px}.news-cat{display:none}.news-title{grid-column:2}.news-side{margin-top:16px}.instagram-card{padding:18px}.info-grid{display:block}.info-img{margin-bottom:18px}.info-img img{height:210px}.info-row{display:block}.info-label{padding:12px 16px 4px;background:#fff;font-size:13px}.info-value{padding:0 16px 14px;font-size:13px}.plan-card{display:block;border-radius:16px}.plan-img{height:170px;min-height:auto}.plan-body{padding:20px 20px 14px}.plan-tag{font-size:12px}.plan-name{font-size:26px}.plan-name-ja{margin-bottom:12px;font-size:13px}.plan-catch{font-size:15px}.plan-detail{font-size:13px}.plan-price-area{padding:18px 20px 20px;border-left:0;border-top:1px solid var(--line);gap:12px}.plan-price .yen{font-size:30px}.plan-price-area .btn{min-height:44px}.plan-note{text-align:left}.common-wrap{display:flex;flex-direction:column;gap:18px}.common-box{padding:22px}.common-title{font-size:18px}.check-list li{font-size:13px}.icon-grid{grid-template-columns:repeat(2,1fr);gap:10px}.icon-item{min-height:96px}.tool-text{font-size:12px}.food-grid{display:flex;flex-direction:column;gap:18px}.food-card{display:block}.food-text{padding:22px}.food-text h3{font-size:20px}.food-img{height:170px}.food-img img{height:100%}.area-lead-grid{display:block;margin-bottom:20px}.area-main-img{margin-bottom:18px}.area-main-img img{height:210px}.area-desc h3{font-size:22px}.area-desc p{font-size:13px}.area-card-grid{display:flex;flex-direction:column;gap:14px}.area-card{display:grid;grid-template-columns:120px 1fr}.area-card-img{height:auto;min-height:128px}.area-card-body{padding:16px}.area-card-num{width:36px;height:36px;margin-bottom:8px;font-size:13px}.area-card h3{font-size:17px}.area-card p{font-size:12px}.case-grid{display:flex;flex-direction:column;gap:12px}.case-card{display:grid;grid-template-columns:118px 1fr}.case-img{height:auto;min-height:108px}.case-body{padding:16px}.case-body h3{font-size:16px}.case-body p{font-size:12px}.access-grid{display:flex;flex-direction:column;gap:18px}.access-card{padding:22px}.access-card h3{font-size:20px}.access-card p,.access-list li{font-size:13px}.map-img img{height:200px}.faq-q{padding:18px 52px 18px 18px;font-size:13px}.faq-q:after{right:18px;font-size:24px}.faq-a{padding:0 18px 18px;font-size:12px}.contact-box{padding:22px}.contact-inner{display:flex;flex-direction:column;gap:18px}.contact-info-item{padding:16px}.contact-info-item span{font-size:12px}.contact-cta{padding:22px}.contact-cta h3{font-size:22px}.contact-cta p{font-size:13px}.contact-cta .btn{min-height:56px;font-size:16px}.footer{padding:34px 0 24px}.footer-inner{width:calc(100% - 36px)}.footer-logo{width:150px}.footer-nav{gap:12px 18px}.footer-nav a{font-size:11px}.sp-fixed-reserve{position:fixed;left:14px;right:14px;bottom:14px;z-index:200;display:flex!important}.sp-fixed-reserve .btn{min-height:62px;border-radius:14px;font-size:17px;box-shadow:0 10px 26px rgba(255,110,187,.38)}}
@media screen and (max-width:390px){.hero-copy{width:64%;padding-left:16px}.hero-title{font-size:38px}.hero-catch-ja{font-size:18px}.hero-text{font-size:10.5px}.hero-visual,.hero-visual img{height:500px;min-height:500px}.section-title{font-size:29px}}

/* =========================================================
  MODERN REFINEMENT 2026-06
  Softer typography / cleaner OISO Long Beach tone
========================================================= */
:root{
  --navy:#137fa9;
  --deep:#28576a;
  --text:#263946;
  --muted:#6f8794;
  --line:#cfeef6;
  --shadow:0 12px 28px rgba(30,186,222,.09);
  --shadow-soft:0 8px 22px rgba(30,186,222,.07);
  --radius:22px;
}

body{
  color:var(--text);
  line-height:1.9;
  letter-spacing:.025em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.section{padding:86px 0}.section--pale{background:linear-gradient(180deg,#fff 0%,#f6fdff 52%,var(--pale) 100%)}
.section-head{gap:16px;margin-bottom:34px}.section-title{color:var(--blue);font-size:40px;font-weight:760;letter-spacing:.13em}.section-subtitle{color:var(--muted);font-size:13px;font-weight:600;letter-spacing:.12em}.lead{font-size:16px;font-weight:400;color:var(--deep)}.note{line-height:1.8}

.btn{min-height:50px;border-width:1px;font-weight:650;letter-spacing:.08em;box-shadow:none}.btn--pink{background:var(--pink);box-shadow:0 10px 22px rgba(255,110,187,.18)}.btn--pink:hover{box-shadow:0 14px 28px rgba(255,110,187,.24)}.btn--outline{color:var(--blue);border-color:var(--line)}

.site-header{height:78px;border-bottom:1px solid rgba(30,186,222,.16)}.global-nav a{color:var(--deep);font-weight:650;letter-spacing:.11em}.header-reserve .btn{border-radius:999px;font-weight:700}.header-reserve .btn:before{display:none}

.hero-main{min-height:680px;grid-template-columns:40% 60%}.hero-copy{padding-top:96px;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.94) 68%,rgba(255,255,255,.45) 88%,rgba(255,255,255,0) 100%)}.hero-logo-small{margin-bottom:40px}.hero-title{font-size:clamp(56px,5.4vw,84px);font-weight:720;letter-spacing:.08em;color:var(--blue);line-height:1.04}.hero-title span{color:var(--pink)}.hero-catch-ja{font-size:29px;font-weight:650;line-height:1.65;color:var(--deep)}.hero-text{color:var(--deep);font-size:15px;font-weight:400;line-height:2.1}.hero-brush{opacity:.65}.hero-visual{min-height:680px}.hero-visual:before{background:linear-gradient(90deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.2) 30%,rgba(255,255,255,0) 54%)}.open-badge{width:126px;height:126px;background:rgba(255,110,187,.92);font-size:17px;font-weight:720;box-shadow:0 14px 30px rgba(255,110,187,.22)}.hero-thumb{border-radius:18px;box-shadow:var(--shadow-soft)}

.news-box,.instagram-card,.info-table,.plan-card,.common-box,.food-card,.area-card,.case-card,.access-card,.faq-item,.contact-box{box-shadow:var(--shadow-soft);border-color:rgba(30,186,222,.22)}
.how-card{border-radius:22px;box-shadow:var(--shadow-soft)}.how-num{background:var(--blue);font-weight:700;box-shadow:0 8px 18px rgba(30,186,222,.18)}.how-card:first-child .how-num{background:var(--blue)}.how-title{color:var(--deep);font-size:21px;font-weight:650}.how-text{font-weight:400;color:var(--muted)}.how-arrow{font-weight:500;color:rgba(30,186,222,.55)}

.news-list li{font-size:14px}.news-date{font-weight:500}.news-cat{font-weight:600}.news-title{font-weight:400}.instagram-card strong{font-weight:700;letter-spacing:.08em}
.info-label{color:var(--blue);background:#f6fdff;font-weight:650}.info-value{font-weight:400;color:var(--deep)}

.plan-card{grid-template-columns:300px 1fr 230px;border-radius:24px}.plan-body{padding:32px 36px}.plan-tag{color:var(--pink);font-weight:700;letter-spacing:.14em}.plan-name{color:var(--blue);font-size:29px;font-weight:740;letter-spacing:.06em}.plan-name-ja{color:var(--muted);font-weight:600}.plan-catch{font-size:16px;font-weight:650;color:var(--deep)}.plan-detail{font-weight:400;color:var(--muted)}.plan-price-area{background:linear-gradient(180deg,#fff 0%,#f7fdff 100%)}.plan-price{font-weight:600;color:var(--deep)}.plan-price .yen{color:var(--blue);font-size:32px;font-weight:740}.plan-price-area .btn{border-radius:999px;font-weight:650}

.common-title,.food-text h3,.area-desc h3,.area-card h3,.case-body h3,.access-card h3,.contact-cta h3{color:var(--deep);font-weight:650}.check-list li,.tool-text,.food-text p,.area-desc p,.area-card p,.case-body p,.access-card p,.access-list li,.contact-info-item span,.contact-cta p,.faq-a{font-weight:400;color:var(--muted)}.check-list li:before{font-weight:700}.icon-item{background:#f8fdff;border-color:rgba(30,186,222,.18)}.icon-item span{color:var(--deep);font-weight:600}.food-label{font-weight:700;letter-spacing:.14em}.area-card-num{background:rgba(30,186,222,.9);font-weight:700}.faq-q{color:var(--deep);font-weight:600}.contact-info-item strong{color:var(--blue);font-weight:650}.footer-nav a{font-weight:650;color:var(--deep)}

@media screen and (max-width:767px){
  body{line-height:1.85}.section{padding:58px 0}.section-title{font-size:30px;font-weight:740;letter-spacing:.12em}.section-subtitle{font-weight:500}.lead{font-size:14px}.site-header{height:66px}.header-inner:after{background:linear-gradient(var(--blue),var(--blue)) 0 2px/32px 2px no-repeat,linear-gradient(var(--blue),var(--blue)) 0 11px/32px 2px no-repeat,linear-gradient(var(--blue),var(--blue)) 0 20px/32px 2px no-repeat}.hero-copy{width:62%;background:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.7) 72%,rgba(255,255,255,0) 100%)}.hero-title{font-size:38px;font-weight:720;letter-spacing:.06em}.hero-catch-ja{font-size:19px;font-weight:600}.hero-text{font-weight:400}.open-badge{width:82px;height:82px;font-size:12px;font-weight:700}.how-title{font-size:17px}.plan-name{font-size:24px}.plan-catch{font-size:14px}.plan-price .yen{font-size:28px}.sp-fixed-reserve .btn{font-weight:700;box-shadow:0 12px 24px rgba(255,110,187,.22)}
}


/* =========================================================
  BLACK TEXT REVISION
  H2 and general typography: readable black, colors only as accents
========================================================= */
:root{
  --black:#202020;
  --black-strong:#151515;
  --text:#202020;
  --deep:#202020;
  --navy:#202020;
  --muted:#5f6670;
}

body{
  color:var(--black);
}

.section-title{
  color:var(--black-strong) !important;
}

.hero-title,
.hero-catch-ja,
.how-title,
.plan-name,
.common-title,
.food-text h3,
.area-desc h3,
.area-card h3,
.case-body h3,
.access-card h3,
.contact-cta h3,
.faq-q,
.info-label,
.contact-info-item strong,
.global-nav a,
.footer-nav a{
  color:var(--black-strong) !important;
}

.hero-text,
.lead,
.news-title,
.info-value,
.plan-catch,
.plan-detail,
.plan-price,
.check-list li,
.tool-text,
.food-text p,
.area-desc p,
.area-card p,
.case-body p,
.access-card p,
.access-list li,
.contact-info-item span,
.contact-cta p,
.faq-a{
  color:var(--black) !important;
}

.section-subtitle,
.plan-name-ja,
.news-cat{
  color:var(--blue) !important;
}

.hero-title span,
.hero-catch-ja .pink,
.plan-tag,
.food-label,
.instagram-card strong,
.check-list li::before{
  color:var(--pink) !important;
}

.btn--outline{
  color:var(--black-strong) !important;
}

/* =========================================================
  FAQ ACCORDION UPDATE
  details/summary native accordion with + / − icon
========================================================= */
.faq-item{
  display:block;
}
.faq-item summary{
  list-style:none;
}
.faq-item summary::-webkit-details-marker{
  display:none;
}
.faq-q{
  position:relative;
  user-select:none;
}
.faq-q::after{
  content:"+" !important;
  position:absolute;
  right:26px;
  top:50%;
  transform:translateY(-50%);
  color:var(--pink);
  font-size:28px;
  line-height:1;
  font-weight:400;
}
.faq-item[open] .faq-q::after{
  content:"−" !important;
}
.faq-a{
  display:none;
}
.faq-item[open] .faq-a{
  display:block;
}
.faq-item[open]{
  border-color:rgba(255,110,187,.32);
}
@media screen and (max-width:767px){
  .faq-q::after{
    right:18px;
    font-size:24px;
  }
}

/* =========================================================
  PLAN DETAILS ACCORDION
========================================================= */
.plan-card{
  position:relative;
}
.plan-accordion{
  grid-column:1 / -1;
  border-top:1px solid var(--line);
  background:#fff;
}
.plan-accordion summary{
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:18px 64px 18px 32px;
  color:var(--black-strong);
  font-family:var(--font-en);
  font-size:13px;
  font-weight:600;
  letter-spacing:.12em;
}
.plan-accordion summary::-webkit-details-marker{
  display:none;
}
.plan-accordion summary::after{
  content:"+";
  position:absolute;
  right:32px;
  top:50%;
  transform:translateY(-50%);
  color:var(--pink);
  font-size:26px;
  line-height:1;
  font-weight:400;
}
.plan-accordion[open] summary::after{
  content:"−";
}
.plan-accordion-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  padding:0 32px 30px;
}
.plan-detail-box{
  padding:22px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--pale);
}
.plan-detail-box h4{
  margin:0 0 12px;
  color:var(--black-strong);
  font-size:16px;
  font-weight:600;
}
.plan-detail-box ul{
  margin:0;
  padding-left:1.1em;
}
.plan-detail-box li{
  margin-bottom:7px;
  font-size:13px;
  line-height:1.7;
  font-weight:400;
}
.plan-detail-box li:last-child{
  margin-bottom:0;
}

@media screen and (max-width:767px){
  .plan-accordion summary{
    padding:16px 48px 16px 20px;
    font-size:12px;
  }
  .plan-accordion summary::after{
    right:20px;
    font-size:24px;
  }
  .plan-accordion-inner{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:0 20px 20px;
  }
  .plan-detail-box{
    padding:18px;
  }
  .plan-detail-box h4{
    font-size:15px;
  }
  .plan-detail-box li{
    font-size:12px;
  }
}


/* =========================================================
  HERO SLIDER UPDATE
  - 5枚サムネイル列を廃止
  - メインビジュアルを自動スライダー化
========================================================= */
.hero-thumb-row{
  display:none !important;
}
.hero-slider{
  position:relative;
  overflow:hidden;
  background:var(--pale);
}
.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transform:scale(1.015);
  transition:opacity 1s ease, transform 5.2s ease;
  z-index:0;
}
.hero-slide.is-active{
  opacity:1;
  transform:scale(1);
  z-index:1;
}
.hero-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-slider::before{
  z-index:2;
  pointer-events:none;
}
.hero-slider .open-badge{
  z-index:4;
}
.hero-slider-dots{
  position:absolute;
  left:50%;
  bottom:26px;
  z-index:5;
  display:flex;
  gap:10px;
  transform:translateX(-50%);
}
.hero-slider-dots button{
  width:9px;
  height:9px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  box-shadow:0 0 0 1px rgba(32,32,32,.12);
  cursor:pointer;
  transition:width .25s ease, background .25s ease;
}
.hero-slider-dots button.is-active{
  width:26px;
  background:var(--pink);
  box-shadow:none;
}

@media screen and (max-width:767px){
  .hero-slide img{
    height:520px;
  }
  .hero-slider-dots{
    bottom:18px;
    gap:8px;
  }
  .hero-slider-dots button{
    width:8px;
    height:8px;
  }
  .hero-slider-dots button.is-active{
    width:22px;
  }
}

@media screen and (max-width:390px){
  .hero-slide img{
    height:500px;
  }
}

/* =========================================================
  SP LAYOUT FIX 2026-06-30
  - Hero slider height/crop fix
  - Badge size fix
  - HOW TO ENJOY card overlap fix
  - INFORMATION image clean display
========================================================= */
@media screen and (max-width: 767px) {
  .hero-main {
    display: block;
    min-height: 0 !important;
    height: auto !important;
    background: #fff;
  }

  .hero-visual,
  .hero-slider {
    position: relative;
    display: block;
    height: 520px !important;
    min-height: 520px !important;
    overflow: hidden;
    background: var(--pale);
  }

  .hero-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
  }

  .hero-slide img,
  .hero-visual img {
    display: block;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: center center;
  }

  .hero-slider::before,
  .hero-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
      linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.50) 48%, rgba(255,255,255,0) 76%),
      linear-gradient(180deg, rgba(255,255,255,0) 62%, rgba(255,255,255,.45) 100%);
  }

  .hero-slider-dots {
    bottom: 20px !important;
    z-index: 6;
  }

  .hero-slider .open-badge,
  .open-badge {
    width: 112px !important;
    height: 112px !important;
    right: 18px !important;
    bottom: 54px !important;
    font-size: 15px !important;
    line-height: 1.18;
  }

  .how-card {
    display: grid !important;
    grid-template-columns: 136px minmax(0, 1fr) !important;
    gap: 16px !important;
    align-items: center !important;
    min-height: 138px !important;
    padding: 18px !important;
    overflow: visible;
  }

  .how-img {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    order: 0 !important;
    width: 136px !important;
    height: 96px !important;
    margin: 0 !important;
    align-self: center;
  }

  .how-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .how-num {
    top: 12px !important;
    left: 12px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 3;
    font-size: 17px !important;
  }

  .how-title {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0;
    margin: 0 0 4px !important;
    font-size: 18px !important;
    line-height: 1.4;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  .how-text {
    grid-column: 2 !important;
    grid-row: 2 !important;
    min-width: 0;
    font-size: 12.5px !important;
    line-height: 1.75 !important;
  }

  .info-img img {
    width: 100%;
    height: 220px !important;
    object-fit: cover;
    object-position: center center;
  }
}

@media screen and (max-width: 390px) {
  .hero-visual,
  .hero-slider {
    height: 500px !important;
    min-height: 500px !important;
  }

  .hero-slider .open-badge,
  .open-badge {
    width: 104px !important;
    height: 104px !important;
    bottom: 50px !important;
    font-size: 14px !important;
  }

  .how-card {
    grid-template-columns: 118px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 16px !important;
  }

  .how-img {
    width: 118px !important;
    height: 88px !important;
  }

  .how-title {
    font-size: 16px !important;
  }

  .how-text {
    font-size: 12px !important;
  }
}

/* =========================================================
  PLAN DETAILS visibility improvement
  - Make details control look like a clear accordion button
========================================================= */
.plan-accordion{
  padding:18px 24px 24px;
  background:linear-gradient(180deg,#fff 0%,#fbfeff 100%);
}
.plan-accordion summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:58px;
  padding:0 18px 0 22px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--pale);
  color:var(--black-strong);
  font-size:14px;
  font-weight:650;
  letter-spacing:.08em;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.plan-accordion summary:hover{
  border-color:var(--blue);
  background:#fff;
  box-shadow:0 8px 20px rgba(30,186,222,.12);
}
.plan-accordion summary::after{
  position:static;
  transform:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  margin-left:14px;
  border-radius:50%;
  background:#fff;
  color:var(--pink);
  border:1px solid rgba(255,110,187,.38);
  font-size:24px;
  font-weight:500;
  flex:0 0 34px;
}
.plan-accordion[open] summary{
  border-color:rgba(255,110,187,.45);
  background:#fff;
  box-shadow:0 8px 20px rgba(255,110,187,.10);
}
.plan-accordion-inner{
  padding:22px 0 0;
}

@media screen and (max-width:767px){
  .plan-accordion{
    padding:14px 16px 18px;
  }
  .plan-accordion summary{
    min-height:54px;
    padding:0 12px 0 18px;
    font-size:13px;
    letter-spacing:.07em;
  }
  .plan-accordion summary::after{
    width:32px;
    height:32px;
    margin-left:10px;
    font-size:22px;
    flex-basis:32px;
  }
  .plan-accordion-inner{
    padding:16px 0 0;
  }
}

/* =========================================================
  FIXED HEADER UPDATE
  PC/SP: keep header visible while scrolling
========================================================= */
html {
  scroll-padding-top: 92px;
}

body {
  padding-top: 82px;
}

.site-header {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
}

@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: 76px;
  }

  body {
    padding-top: 66px;
    padding-bottom: 92px;
  }

  .site-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
  }
}


/* =========================================================
  CONTENT UPDATE 2026-06-30
  - No bring-your-own plan
  - Drink-only seat plan
  - Google Map iframe
  - BBQ AREA notes
========================================================= */
.area-capacity{
  margin:18px 0 0 !important;
  padding:14px 18px;
  border-radius:14px;
  background:var(--pale);
  border:1px solid var(--line);
  color:var(--black-strong,#202020) !important;
  font-weight:600 !important;
  line-height:1.7 !important;
}
.area-caution{
  margin:12px 0 0 !important;
  padding:14px 18px;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(255,110,187,.35);
  color:var(--muted) !important;
  font-size:13px !important;
  line-height:1.8 !important;
  font-weight:400 !important;
}
.map-embed{
  width:100%;
  overflow:hidden;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
}
.map-embed iframe{
  display:block;
  width:100%;
  height:360px;
  border:0;
}
.news-side .instagram-card{
  min-height:100%;
}
@media screen and (max-width:767px){
  .area-capacity,
  .area-caution{
    padding:13px 14px;
    font-size:12.5px !important;
  }
  .map-embed iframe{
    height:300px;
  }
}


/* =========================================================
  MOBILE MENU UPDATE
  - Real hamburger menu instead of decorative pseudo icon
========================================================= */
.menu-toggle{
  display:none;
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  width:38px;
  height:38px;
  cursor:pointer;
  flex:0 0 38px;
  position:relative;
}
.menu-toggle span{
  display:block;
  width:30px;
  height:2px;
  margin:6px auto;
  border-radius:999px;
  background:#202020;
  transition:transform .2s ease, opacity .2s ease, background .2s ease;
}
@media screen and (max-width:767px){
  .header-inner::after{
    display:none !important;
    content:none !important;
  }
  .menu-toggle{
    display:block;
  }
  body.is-menu-open{
    overflow:hidden;
  }
  body.is-menu-open .site-header{
    background:#fff;
  }
  body.is-menu-open .global-nav{
    display:flex !important;
    position:fixed;
    top:66px;
    left:0;
    right:0;
    width:100%;
    max-height:calc(100vh - 66px);
    overflow:auto;
    padding:18px 22px 24px;
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    box-shadow:0 18px 32px rgba(32,32,32,.08);
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    z-index:999;
  }
  body.is-menu-open .global-nav a{
    display:flex;
    align-items:center;
    min-height:48px;
    padding:0 8px;
    border-bottom:1px solid var(--line);
    color:#202020 !important;
    font-size:14px;
    font-weight:600;
    letter-spacing:.08em;
  }
  body.is-menu-open .global-nav a:last-child{
    border-bottom:0;
  }
  body.is-menu-open .menu-toggle span:nth-child(1){
    transform:translateY(8px) rotate(45deg);
    background:var(--pink);
  }
  body.is-menu-open .menu-toggle span:nth-child(2){
    opacity:0;
  }
  body.is-menu-open .menu-toggle span:nth-child(3){
    transform:translateY(-8px) rotate(-45deg);
    background:var(--pink);
  }
}

/* =========================================================
  LOGO DISPLAY FIX
  - Prevent the new OISO BEACH SIDE BBQ logo from being clipped
  - Keep the header compact while allowing the full mark/text to show
========================================================= */
.site-header{
  height:96px !important;
  overflow:visible !important;
}

body{
  padding-top:96px !important;
}

.header-inner{
  height:100%;
  align-items:center;
}

.logo{
  width:210px !important;
  height:88px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  overflow:visible !important;
}

.logo img{
  width:210px !important;
  height:88px !important;
  max-height:88px !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
}

.footer-logo{
  width:210px !important;
}

.footer-logo img{
  width:210px !important;
  height:auto !important;
  object-fit:contain !important;
}

@media screen and (max-width:767px){
  html{
    scroll-padding-top:88px !important;
  }

  body{
    padding-top:88px !important;
  }

  .site-header{
    height:88px !important;
    overflow:visible !important;
  }

  .header-inner{
    width:calc(100% - 24px) !important;
    height:100%;
    gap:10px;
  }

  .logo{
    width:150px !important;
    height:78px !important;
    flex:0 0 150px !important;
  }

  .logo img{
    width:150px !important;
    height:78px !important;
    max-height:78px !important;
    object-fit:contain !important;
    object-position:center !important;
  }

  .header-reserve .btn{
    min-width:138px !important;
    min-height:44px !important;
    padding:9px 14px !important;
    font-size:12px !important;
  }

  body.is-menu-open .global-nav{
    top:88px !important;
    max-height:calc(100vh - 88px) !important;
  }
}

@media screen and (max-width:374px){
  .logo{
    width:138px !important;
    height:74px !important;
    flex-basis:138px !important;
  }

  .logo img{
    width:138px !important;
    height:74px !important;
    max-height:74px !important;
  }

  .header-reserve .btn{
    min-width:126px !important;
    padding:8px 10px !important;
    font-size:11px !important;
  }
}

/* =========================================================
  OISO 2026 SPEC / AREA & PLAN FIX
  - AREA section before PLAN
  - prevent price cards from overflowing
  - simple area map layout
========================================================= */
#plan .common-wrap{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:24px;
  width:100%;
  max-width:100%;
  overflow:visible;
}

#plan .common-box{
  min-width:0;
  width:100%;
  box-sizing:border-box;
}

#plan .common-box .plan-price{
  margin:16px 0 18px;
  line-height:1.4;
}

#plan .common-box .plan-price .yen{
  display:inline-block;
  font-size:clamp(32px, 4vw, 46px);
  line-height:1.1;
  white-space:nowrap;
}

.area-map-block{
  margin:42px 0 48px;
}

.area-map-simple,
.area-map-simple--layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 220px;
  gap:18px;
  align-items:stretch;
  margin-top:20px;
}

.area-map-simple__zones{
  display:grid;
  gap:12px;
}

.area-map-simple__zone{
  border:3px solid #1EBADE;
  background:#E8F8FC;
  border-radius:18px;
  padding:22px;
}

.area-map-simple__zone--1{
  border-color:#FF6EBB;
  background:#FFF1F8;
}

.area-map-simple__zone--4{
  border-color:#FF6EBB;
  background:#FFFFFF;
  text-align:center;
  font-weight:800;
}

.area-map-simple__zone-title{
  display:block;
  font-size:24px;
  line-height:1.35;
  color:#138FA8;
  font-weight:800;
}

.area-map-simple__zone--1 .area-map-simple__zone-title{
  color:#FF6EBB;
}

.area-map-simple__zone--3 .area-map-simple__zone-title{
  color:#0879B8;
}

.area-map-simple__zone-text{
  margin:8px 0 0;
  font-weight:700;
}

.area-map-simple__pool{
  background:#DFF7FF;
  border:4px solid #1EBADE;
  border-radius:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-weight:800;
  color:#0879B8;
  font-size:24px;
  min-height:360px;
}

@media screen and (max-width:767px){
  #plan .common-wrap{
    grid-template-columns:1fr;
    gap:18px;
  }

  #plan .common-box{
    padding:24px 20px;
  }

  .area-map-simple,
  .area-map-simple--layout{
    grid-template-columns:1fr;
  }

  .area-map-simple__pool{
    min-height:160px;
  }
}


/* =========================================================
  PLAN AREA HEADING DESIGN
  - make BBQ / Family Tent / Parasol category headings visible
========================================================= */
#plan .plan-area-heading{
  position:relative;
  margin:56px 0 22px;
  padding:26px 30px 26px 34px;
  border-radius:24px;
  background:#ffffff;
  border:2px solid rgba(30,186,222,.22);
  box-shadow:0 14px 34px rgba(30,186,222,.10);
  overflow:hidden;
}

#plan .plan-area-heading::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:9px;
  background:#1EBADE;
}

#plan .plan-area-heading::after{
  content:"";
  position:absolute;
  right:-42px;
  top:-42px;
  width:140px;
  height:140px;
  border-radius:50%;
  background:rgba(30,186,222,.10);
}

#plan .plan-area-heading--bbq{
  border-color:rgba(255,110,187,.35);
  background:linear-gradient(90deg, rgba(255,110,187,.12), #fff 48%);
}

#plan .plan-area-heading--bbq::before{
  background:#FF6EBB;
}

#plan .plan-area-heading--bbq::after{
  background:rgba(255,110,187,.12);
}

#plan .plan-area-heading--family{
  background:linear-gradient(90deg, rgba(30,186,222,.12), #fff 48%);
}

#plan .plan-area-heading--parasol{
  background:linear-gradient(90deg, rgba(30,186,222,.08), #fff 48%);
}

#plan .plan-area-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  padding:6px 13px;
  border-radius:999px;
  background:#E8F8FC;
  color:#138FA8;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
  line-height:1;
}

#plan .plan-area-heading--bbq .plan-area-label{
  background:#FFF1F8;
  color:#FF6EBB;
}

#plan .plan-area-heading h3{
  position:relative;
  margin:0;
  font-size:clamp(26px, 3vw, 40px);
  line-height:1.25;
  color:#111;
  letter-spacing:.02em;
  z-index:1;
}

#plan .plan-area-heading p{
  position:relative;
  margin:12px 0 0;
  color:#333;
  font-weight:600;
  line-height:1.8;
  z-index:1;
}

#plan .plan-area-heading + .note{
  margin-top:0;
  margin-bottom:20px;
  padding-left:4px;
}

@media screen and (max-width:767px){
  #plan .plan-area-heading{
    margin:42px 0 18px;
    padding:22px 20px 22px 24px;
    border-radius:20px;
  }

  #plan .plan-area-heading h3{
    font-size:26px;
  }

  #plan .plan-area-heading p{
    font-size:14px;
  }
}

/* =========================================================
  OISO REFINEMENT / TOOLS INCLUDED BALANCE
  - Center BBQ-only tools accordion and INCLUDED ITEMS on PC
  - Add reservation button rows for Family Tent / Parasol
  - Keep area map and plan layout balanced
========================================================= */
#plan .bbq-tools-accordion{
  width:100%;
  max-width:1040px;
  margin:24px auto 44px;
}

#plan .bbq-tools-accordion .plan-accordion-inner{
  justify-content:center;
}

#plan .bbq-tools-accordion .plan-detail-box{
  max-width:920px;
  margin:0 auto;
}

#included .common-wrap{
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  justify-content:center;
}

#included .common-box{
  min-width:0;
}

#included .section-head,
#included .container > .section-head{
  text-align:center;
}

.area-reserve-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:28px auto 54px;
  text-align:center;
}

.area-reserve-wrap .btn{
  min-width:280px;
}

.area-reserve-note{
  margin:0;
}

#fooddrink .food-text{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}

#fooddrink .food-text .btn{
  margin-top:22px;
}

@media screen and (max-width:767px){
  #plan .bbq-tools-accordion{
    margin:20px auto 36px;
  }

  #included .common-wrap{
    max-width:100%;
  }

  .area-reserve-wrap{
    margin:22px auto 42px;
  }

  .area-reserve-wrap .btn{
    min-width:0;
    width:100%;
  }
}

/* =========================================================
  OISO REFINEMENT V2 / INCLUDED AND TOOL WIDTH FIX
  - Remove left-heavy layout by making related content full-width
  - Make INCLUDED ITEMS cards and BBQ tools accordion visually balanced on PC
========================================================= */
#included .container{
  max-width:1180px;
}

#included .section-head{
  justify-content:center;
  text-align:center;
}

#included .common-wrap{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:28px;
  width:100%;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  align-items:stretch;
}

#included .common-box{
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
  padding:42px 44px;
}

#included .check-list{
  max-width:none;
}

#plan .bbq-tools-accordion{
  width:100%;
  max-width:1180px;
  margin:28px auto 54px;
}

#plan .bbq-tools-accordion .plan-accordion-inner{
  display:block;
  width:100%;
  max-width:100%;
  padding:34px 0 0;
}

#plan .bbq-tools-accordion .plan-detail-box{
  width:100%;
  max-width:none;
  margin:0;
  box-sizing:border-box;
  padding:38px 44px;
}

#plan .bbq-tools-accordion .tool-text{
  max-width:none;
  line-height:2;
}

@media screen and (max-width:900px){
  #included .common-wrap{
    grid-template-columns:1fr;
  }
}

@media screen and (max-width:767px){
  #included .container{
    max-width:100%;
  }

  #included .common-box{
    padding:28px 22px;
  }

  #plan .bbq-tools-accordion{
    max-width:100%;
    margin:22px auto 42px;
  }

  #plan .bbq-tools-accordion .plan-detail-box{
    padding:28px 22px;
  }
}

/* =========================================================
  OISO PLAN MENU CONTENTS UPDATE
  - Make soft drink price as visible as alcohol price
  - Support 2-panel PLAN DETAILS with set contents and notes
========================================================= */
#plan .plan-price{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
}

#plan .price-option{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(30,186,222,.32);
  background:#ffffff;
  box-shadow:0 8px 20px rgba(30,186,222,.08);
}

#plan .price-option--alcohol{
  border-color:rgba(255,110,187,.45);
  background:linear-gradient(180deg, #fff 0%, #fff3f9 100%);
}

#plan .price-option--soft{
  border-color:rgba(30,186,222,.45);
  background:linear-gradient(180deg, #fff 0%, #e8f8fc 100%);
}

#plan .price-option--kids{
  border-color:rgba(255,110,187,.45);
  background:linear-gradient(180deg, #fff 0%, #fff3f9 100%);
}

#plan .price-label{
  color:#111;
  font-size:12px;
  line-height:1.45;
  font-weight:800;
  letter-spacing:.02em;
}

#plan .price-yen{
  color:#1EBADE;
  font-family:var(--font-en);
  font-size:clamp(27px, 2.4vw, 36px);
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}

#plan .price-option--alcohol .price-yen,
#plan .price-option--kids .price-yen{
  color:#FF6EBB;
}

#plan .price-note{
  color:#555;
  font-size:12px;
  line-height:1.5;
  font-weight:700;
}

#plan .plan-card .plan-body{
  gap:10px;
}

#plan .plan-accordion-inner{
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
}

#plan .plan-detail-box h4{
  font-weight:900;
}

#plan .plan-detail-box li{
  font-size:14px;
  line-height:1.85;
}

@media screen and (max-width:767px){
  #plan .price-option{
    padding:13px 14px;
  }

  #plan .price-yen{
    font-size:30px;
  }

  #plan .plan-accordion-inner{
    grid-template-columns:1fr;
  }

  #plan .plan-detail-box li{
    font-size:13px;
  }
}

/* =========================================================
  OISO DRINK REQUIRED NOTE UPDATE
  - Make Family Tent / Parasol required drink order clearly visible
========================================================= */
#plan .required-drink-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:8px;
  padding:7px 14px;
  border-radius:999px;
  background:#FFF1F8;
  border:2px solid #FF6EBB;
  color:#111;
  font-size:13px;
  line-height:1.4;
  font-weight:900;
  letter-spacing:.02em;
  box-shadow:0 8px 18px rgba(255,110,187,.16);
}

#plan .required-drink-badge::before{
  content:"必須";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-right:8px;
  padding:3px 7px;
  border-radius:999px;
  background:#FF6EBB;
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:900;
}

@media screen and (max-width:767px){
  #plan .required-drink-badge{
    display:flex;
    width:fit-content;
    margin:10px 0 0;
    font-size:12px;
  }
}

/* =========================================================
  OISO REQUIRED DRINK STRONG CALLOUT
  - Make Family Tent / Parasol required drink order unmistakable
========================================================= */
#plan .required-drink-callout{
  display:flex;
  align-items:center;
  gap:14px;
  margin:12px 0 24px;
  padding:16px 20px;
  border:3px solid #FF6EBB;
  border-radius:18px;
  background:linear-gradient(90deg, #FFF1F8 0%, #FFFFFF 100%);
  box-shadow:0 12px 26px rgba(255,110,187,.18);
}

#plan .required-drink-callout__badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:58px;
  min-height:58px;
  padding:8px;
  border-radius:999px;
  background:#FF6EBB;
  color:#fff;
  font-size:18px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
}

#plan .required-drink-callout__body{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}

#plan .required-drink-callout__body strong{
  color:#111;
  font-size:20px;
  line-height:1.45;
  font-weight:900;
}

#plan .required-drink-callout__body span{
  color:#333;
  font-size:14px;
  line-height:1.6;
  font-weight:700;
}

@media screen and (max-width:767px){
  #plan .required-drink-callout{
    align-items:flex-start;
    gap:12px;
    margin:10px 0 22px;
    padding:14px 14px;
    border-radius:16px;
  }

  #plan .required-drink-callout__badge{
    min-width:48px;
    min-height:48px;
    font-size:15px;
  }

  #plan .required-drink-callout__body strong{
    font-size:17px;
  }

  #plan .required-drink-callout__body span{
    font-size:13px;
  }
}

/* =========================================================
  OISO REQUIRED DRINK SIMPLE TEXT
  - Required drink callout text reduced to one sentence
========================================================= */
#plan .required-drink-callout__body{
  justify-content:center;
}

#plan .required-drink-callout__body strong{
  margin:0;
}

#plan .required-drink-callout__body span{
  display:none;
}

/* =========================================================
  OISO REQUIRED DRINK TEXT NORMAL
  - Box and badge already provide emphasis, so body text should not overpower area headings
========================================================= */
#plan .required-drink-callout__body strong{
  font-weight:500;
  font-size:18px;
}

#plan .required-drink-callout__body span{
  display:none;
}

#plan .required-drink-callout__text{
  margin:0;
  color:#111;
  font-size:18px;
  line-height:1.6;
  font-weight:500;
  letter-spacing:.01em;
}

@media screen and (max-width:767px){
  #plan .required-drink-callout__body strong,
  #plan .required-drink-callout__text{
    font-size:15px;
    font-weight:500;
    line-height:1.65;
  }
}

/* =========================================================
  INFORMATION IMAGE CROP POSITION
  - On PC, keep the right side of information-area.jpg visible
  - Excess image area is cropped from the left side
========================================================= */
@media screen and (min-width: 768px){
  #information .info-img img{
    object-fit: cover;
    object-position: right center;
  }
}

/* =========================================================
  CLICKABLE AREA MAP
  - Replaces the previous simple CSS map with a fixed image
  - Transparent hit areas jump to each PLAN price section
========================================================= */
html{
  scroll-behavior: smooth;
}

.plan-area-heading{
  scroll-margin-top: 110px;
}

.area-map-box{
  overflow: hidden;
}

.area-map-note{
  margin: 10px 0 18px;
  text-align: center;
  font-size: 0.95rem;
  line-height: 1.8;
  color: #606463;
}

.area-map-scroll{
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px;
}

.area-map-clickable{
  position: relative;
  width: 100%;
  max-width: 1120px;
  min-width: 760px;
  margin: 0 auto;
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 18px 42px rgba(30, 186, 222, 0.16);
}

.area-map-clickable img{
  display: block;
  width: 100%;
  height: auto;
}

.area-map-link{
  position: absolute;
  display: block;
  z-index: 2;
  cursor: pointer;
  border-radius: 18px;
  transition: background-color 0.18s ease, box-shadow 0.18s ease;
}

/* Visually hidden text for accessibility */
.area-map-link span{
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Hit areas tuned to the generated map image */
.area-map-link--bbq{
  left: 13%;
  top: 5.5%;
  width: 57.5%;
  height: 33%;
  clip-path: polygon(3% 0, 93% 0, 100% 14%, 100% 96%, 6% 96%, 0 88%, 0 10%);
}

.area-map-link--family{
  left: 12%;
  top: 34.5%;
  width: 42%;
  height: 25%;
  clip-path: polygon(2% 0, 97% 0, 100% 92%, 7% 96%, 0 88%, 0 8%);
}

.area-map-link--parasol{
  left: 8%;
  top: 55%;
  width: 39%;
  height: 36%;
  clip-path: polygon(8% 0, 92% 0, 98% 9%, 99% 82%, 76% 100%, 0 95%, 0 18%);
}

@media (hover: hover){
  .area-map-link:hover{
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.82);
  }

  .area-map-link--bbq:hover{
    box-shadow: inset 0 0 0 3px rgba(255, 215, 0, 0.9);
  }

  .area-map-link--family:hover{
    box-shadow: inset 0 0 0 3px rgba(30, 186, 222, 0.85);
  }

  .area-map-link--parasol:hover{
    box-shadow: inset 0 0 0 3px rgba(255, 110, 187, 0.85);
  }
}

.area-map-link:focus-visible{
  outline: 4px solid #FF6EBB;
  outline-offset: -4px;
  background: rgba(255, 110, 187, 0.14);
}

@media screen and (max-width: 767px){
  .plan-area-heading{
    scroll-margin-top: 88px;
  }

  .area-map-box{
    padding-left: 16px;
    padding-right: 16px;
  }

  .area-map-note{
    text-align: left;
    font-size: 0.88rem;
  }

  .area-map-clickable{
    min-width: 720px;
    border-radius: 18px;
  }
}


/* =========================================================
  CONTACT INQUIRY UPDATE
  - Inquiry-only CTA with phone / email
  - Buttons stay vertical on PC and smartphone
========================================================= */
.contact-link{
  color:var(--blue) !important;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:4px;
  word-break:break-all;
}

.contact-link:hover{
  color:var(--pink) !important;
}

.contact-action-list{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  width:100%;
  max-width:420px;
  margin:22px auto 0;
}

.contact-action-list .btn{
  width:100%;
  min-width:0;
  min-height:58px;
  border-radius:999px;
  font-size:16px;
}

.contact-action--tel::before{
  content:"TEL";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(255,255,255,.24);
  color:#fff;
  font-family:var(--font-en);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.contact-action--mail::before{
  content:"MAIL";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  background:var(--pale);
  color:var(--blue);
  font-family:var(--font-en);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.contact-direct-note{
  margin:18px 0 0 !important;
  color:#333 !important;
  font-size:13px;
  line-height:1.8;
  font-weight:700 !important;
  word-break:break-all;
}

@media screen and (max-width:767px){
  .contact-action-list{
    max-width:none;
    gap:12px;
    margin-top:18px;
  }

  .contact-action-list .btn{
    min-height:54px;
    font-size:15px;
  }

  .contact-direct-note{
    font-size:12px;
  }
}


/* =========================================================
  CONTACT FINAL ADJUSTMENT
  - Remove duplicate direct TEL / MAIL note from CTA
  - Keep only left-side contact details + right-side action buttons
  - Keep action buttons vertical on PC and SP
========================================================= */
.contact-cta{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.contact-action-list{
  grid-template-columns:1fr !important;
  max-width:420px;
  margin:24px auto 0;
}

.contact-direct-note{
  display:none !important;
}

@media screen and (max-width:767px){
  .contact-action-list{
    max-width:none;
    margin-top:18px;
  }
}

/* =========================================================
  CONTACT INQUIRY ONLY FINAL
  - Remove the left-side information block from layout
  - Keep only contact action buttons, centered
========================================================= */
.contact-box--inquiry-only{
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
}

.contact-inner--inquiry-only{
  display:block !important;
}

.contact-cta--inquiry-only{
  width:100%;
  max-width:560px;
  margin:0 auto;
  padding:42px 38px;
}

.contact-cta--inquiry-only p{
  margin-bottom:0;
}

.contact-cta--inquiry-only .contact-action-list{
  max-width:420px;
}

@media screen and (max-width:767px){
  .contact-box--inquiry-only{
    max-width:100%;
  }

  .contact-cta--inquiry-only{
    max-width:none;
    padding:28px 22px;
  }
}

/* =========================================================
  HERO TITLE COLOR UPDATE
  - SUMMER: pink / POOL: blue / BBQ: black
========================================================= */
.hero-title .hero-title__summer{
  color:var(--pink) !important;
}
.hero-title .hero-title__pool{
  color:var(--blue) !important;
}
.hero-title .hero-title__bbq{
  color:var(--black-strong, #151515) !important;
}


/* =========================================================
  HERO PC TITLE LAYER FIX
  - Prevent SUMMER! exclamation mark from being hidden under the visual image on PC
========================================================= */
@media screen and (min-width: 768px){
  .hero-main{
    grid-template-columns:44% 56%;
  }

  .hero-copy{
    z-index:6;
    overflow:visible;
  }

  .hero-title{
    position:relative;
    z-index:7;
    max-width:none;
    white-space:nowrap;
    font-size:clamp(52px,5vw,78px);
    letter-spacing:.06em;
  }

  .hero-visual{
    z-index:1;
  }
}



/* =========================================================
  CONTACT PHONE UPDATE
  - Contact section only
  - Phone number displayed above the phone button
  - Buttons stacked on PC/SP
========================================================= */
#contact .contact-inner{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
}

#contact .contact-info{
  display:none !important;
}

#contact .contact-cta{
  width:min(560px, 100%) !important;
  margin:0 auto !important;
}

#contact .contact-phone-display{
  margin:0 0 14px !important;
  padding:16px 18px !important;
  border:1px solid rgba(30,186,222,.35);
  border-radius:16px;
  background:#E8F8FC;
  text-align:center;
  color:#151515 !important;
}

#contact .contact-phone-display span{
  display:block;
  margin-bottom:4px;
  color:#5f6670;
  font-size:13px;
  line-height:1.5;
  font-weight:700;
  letter-spacing:.04em;
}

#contact .contact-phone-display strong{
  display:block;
  color:#151515;
  font-family:var(--font-en);
  font-size:clamp(26px, 3vw, 34px);
  line-height:1.15;
  font-weight:900;
  letter-spacing:.04em;
}

#contact .contact-button-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}

#contact .contact-button-list .btn{
  width:100%;
  min-height:62px;
  font-size:18px;
}

#contact .contact-btn--mail{
  border-color:rgba(30,186,222,.45);
  background:#fff;
}

@media screen and (max-width:767px){
  #contact .contact-phone-display{
    padding:14px 16px !important;
  }

  #contact .contact-phone-display strong{
    font-size:28px;
  }

  #contact .contact-button-list .btn{
    min-height:56px;
    font-size:16px;
  }
}



/* =========================================================
  CONTACT PHONE DISPLAY ABOVE BUTTON FIX
  - Display phone number directly above the tel button
========================================================= */
#contact .contact-cta--inquiry-only .contact-phone-display,
#contact .contact-phone-display{
  display:block !important;
  margin:0 0 14px !important;
  padding:16px 18px !important;
  border:1px solid rgba(30,186,222,.35);
  border-radius:16px;
  background:#E8F8FC;
  text-align:center;
  color:#151515 !important;
}

#contact .contact-cta--inquiry-only .contact-phone-display span,
#contact .contact-phone-display span{
  display:block !important;
  margin:0 0 4px !important;
  color:#5f6670 !important;
  font-size:13px !important;
  line-height:1.5;
  font-weight:700;
  letter-spacing:.04em;
}

#contact .contact-cta--inquiry-only .contact-phone-display strong,
#contact .contact-phone-display strong{
  display:block !important;
  color:#151515 !important;
  font-family:var(--font-en);
  font-size:clamp(26px, 3vw, 34px);
  line-height:1.15;
  font-weight:900;
  letter-spacing:.04em;
}

#contact .contact-action-list{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100%;
}

#contact .contact-action-list .btn{
  width:100%;
}

@media screen and (max-width:767px){
  #contact .contact-cta--inquiry-only .contact-phone-display,
  #contact .contact-phone-display{
    padding:14px 16px !important;
  }

  #contact .contact-cta--inquiry-only .contact-phone-display strong,
  #contact .contact-phone-display strong{
    font-size:28px;
  }
}



/* =========================================================
  CONTACT TEL BUTTON TEXT UPDATE
  - Phone number is shown inside the tel button
  - Separate phone number box is hidden
========================================================= */
#contact .contact-phone-display{
  display:none !important;
}

#contact .contact-action-list,
#contact .contact-button-list{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100%;
}

#contact .contact-action-list .btn,
#contact .contact-button-list .btn{
  width:100%;
  min-height:62px;
  font-size:18px;
}

#contact .contact-btn--tel{
  letter-spacing:.03em;
}

@media screen and (max-width:767px){
  #contact .contact-action-list .btn,
  #contact .contact-button-list .btn{
    min-height:56px;
    font-size:16px;
  }
}



/* =========================================================
  CONTACT TEL DUPLICATE FIX
  - Keep the TEL badge only
  - Main tel button text is the phone number
========================================================= */
#contact .contact-phone-display{
  display:none !important;
}

#contact .contact-btn--tel{
  letter-spacing:.04em;
}



/* =========================================================
  GLOBAL NAV CONTACT ITEM FIX
  - Add CONTACT to PC/SP menu without breaking layout
========================================================= */
.global-nav{
  gap:clamp(14px, 1.7vw, 24px);
}

.global-nav a{
  white-space:nowrap;
}

@media screen and (max-width:1100px){
  .global-nav{
    gap:12px;
  }

  .global-nav a{
    font-size:11px;
  }
}



/* =========================================================
  INFORMATION RESERVATION RULE UPDATE
  - Address full display
  - Reservation/cancel policy layout
  - PDF rule link
========================================================= */
.info-deadline-list{
  display:grid;
  gap:10px;
}

.info-deadline-list div{
  display:grid;
  grid-template-columns:150px minmax(0, 1fr);
  gap:12px;
  align-items:start;
}

.info-deadline-list strong{
  color:#151515;
  font-weight:900;
}

.info-deadline-list span{
  color:#202020;
  font-weight:600;
  line-height:1.8;
}

.info-note-text{
  margin:10px 0 0;
  color:#202020 !important;
  font-weight:600 !important;
  line-height:1.8;
}

.info-pdf-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  color:#1EBADE;
  font-weight:900;
  text-decoration:underline;
  text-underline-offset:4px;
}

.info-pdf-link::before{
  content:"⇒";
  color:#FF6EBB;
  font-weight:900;
}

.info-pdf-link:hover{
  color:#FF6EBB;
}

@media screen and (max-width:767px){
  .info-deadline-list{
    gap:8px;
  }

  .info-deadline-list div{
    grid-template-columns:1fr;
    gap:2px;
  }

  .info-note-text,
  .info-pdf-link{
    font-size:13px;
  }
}



/* =========================================================
  INFORMATION FULL WIDTH UPDATE
  - Remove left image and use full-width information table
========================================================= */
#information .info-grid{
  display:block !important;
  width:100%;
  max-width:1120px;
  margin:0 auto;
}

#information .info-img{
  display:none !important;
}

#information .info-table{
  width:100%;
  max-width:none;
}

@media screen and (min-width:768px){
  #information .info-row{
    grid-template-columns:180px minmax(0, 1fr);
  }
}



/* =========================================================
  AREA MAP IMAGE UPDATE 2026-07
  - Use img/area-map.png
  - Retune transparent hit areas for the new map layout
========================================================= */
.area-map-clickable{
  max-width:1120px;
  min-width:760px;
}

.area-map-clickable img{
  display:block;
  width:100%;
  height:auto;
}

/* New map hit areas: 1448 x 1086 base image */
.area-map-link--bbq{
  left:21%;
  top:6%;
  width:55%;
  height:40%;
  clip-path:polygon(4% 6%, 90% 0, 100% 8%, 92% 58%, 72% 60%, 70% 94%, 22% 94%, 20% 78%, 0 75%, 0 14%);
}

.area-map-link--family{
  left:24%;
  top:36%;
  width:29%;
  height:24%;
  clip-path:polygon(6% 2%, 88% 0, 100% 16%, 92% 78%, 70% 84%, 62% 100%, 6% 92%, 0 70%, 10% 42%);
}

.area-map-link--parasol{
  left:18%;
  top:58%;
  width:30%;
  height:36%;
  clip-path:polygon(16% 2%, 94% 0, 100% 74%, 84% 100%, 8% 96%, 0 20%);
}


/* =========================================================
   AREA MAP SVG CLICK RANGE / supplied coordinates
========================================================= */
.area-map-clickable{
  position: relative;
}

.area-map-overlay{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  display: block;
}

.area-map-svg-link{
  cursor: pointer;
}

.area-map-svg-link polygon{
  fill: rgba(255,255,255,0);
  stroke: rgba(255,255,255,0);
  stroke-width: 8;
  vector-effect: non-scaling-stroke;
  transition: fill .18s ease, stroke .18s ease;
}

@media (hover:hover){
  .area-map-svg-link--bbq:hover polygon{
    fill: rgba(255,215,0,.14);
    stroke: rgba(255,215,0,.9);
  }

  .area-map-svg-link--family:hover polygon{
    fill: rgba(30,186,222,.15);
    stroke: rgba(30,186,222,.9);
  }

  .area-map-svg-link--parasol:hover polygon{
    fill: rgba(255,110,187,.15);
    stroke: rgba(255,110,187,.9);
  }
}

.area-map-svg-link:focus polygon,
.area-map-svg-link:focus-visible polygon{
  fill: rgba(255,110,187,.12);
  stroke: #FF6EBB;
  outline: none;
}

/* disable old rectangular click zones */
.area-map-link{
  display: none !important;
}



/* =========================================================
  INFORMATION PLAIN TIME TEXT UPDATE
  - Keep existing INFORMATION tone
  - Only bold key labels
========================================================= */
.info-plain-strong{
  color:#151515;
  font-weight:900;
}


/* =========================================================
  BBQ AREA USE SELECT / PLAN TONE FIX
  - Keep PLAN section tone
  - Make 1-day use and time-slot use easy to compare
========================================================= */
#plan .bbq-use-select{
  margin:22px 0 34px;
  padding:28px;
  border:2px solid rgba(255,110,187,.55);
  border-radius:26px;
  background:linear-gradient(135deg, #fff 0%, #fff7fb 48%, #f7fdff 100%);
  box-shadow:0 14px 34px rgba(255,110,187,.12);
}

#plan .bbq-use-select__head{
  display:flex;
  align-items:baseline;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

#plan .bbq-use-select__head span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 13px;
  border-radius:999px;
  background:#FF6EBB;
  color:#fff;
  font-family:var(--font-en);
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:.1em;
}

#plan .bbq-use-select__head h4{
  margin:0;
  color:#151515;
  font-size:clamp(22px, 2.6vw, 32px);
  line-height:1.4;
  font-weight:900;
}

#plan .bbq-use-select__cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

#plan .bbq-use-select__card{
  position:relative;
  padding:22px 22px 20px;
  border:1px solid rgba(30,186,222,.45);
  border-radius:20px;
  background:#fff;
}

#plan .bbq-use-select__card--main{
  border:2px solid #FF6EBB;
  background:#fffafd;
}

#plan .bbq-use-select__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:12px;
  padding:6px 12px;
  border-radius:999px;
  background:#FF6EBB;
  color:#fff;
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
}

#plan .bbq-use-select__badge--blue{
  background:#E8F8FC;
  color:#1EBADE;
}

#plan .bbq-use-select__card h5{
  margin:0 0 8px;
  color:#151515;
  font-size:22px;
  line-height:1.35;
  font-weight:900;
}

#plan .bbq-use-select__time{
  margin:0 0 6px;
  color:#151515 !important;
  font-family:var(--font-en);
  font-size:clamp(26px, 3vw, 38px);
  line-height:1.15;
  font-weight:900;
  letter-spacing:.02em;
}

#plan .bbq-use-select__card--main .bbq-use-select__time{
  color:#FF6EBB !important;
}

#plan .bbq-use-select__price{
  margin:8px 0 10px;
  color:#151515 !important;
  font-size:14px;
  line-height:1.6;
  font-weight:900;
}

#plan .bbq-use-select__text{
  margin:0;
  color:#202020 !important;
  font-size:14px;
  line-height:1.85;
  font-weight:600;
}

@media screen and (max-width:767px){
  #plan .bbq-use-select{
    margin:18px 0 30px;
    padding:20px 16px;
    border-radius:22px;
  }

  #plan .bbq-use-select__head{
    display:block;
  }

  #plan .bbq-use-select__head span{
    margin-bottom:10px;
  }

  #plan .bbq-use-select__head h4{
    font-size:20px;
  }

  #plan .bbq-use-select__cards{
    grid-template-columns:1fr;
    gap:12px;
  }

  #plan .bbq-use-select__card{
    padding:18px 16px;
  }

  #plan .bbq-use-select__card h5{
    font-size:19px;
  }

  #plan .bbq-use-select__time{
    font-size:28px;
  }

  #plan .bbq-use-select__price,
  #plan .bbq-use-select__text{
    font-size:13px;
  }
}


/* =========================================================
  PLAN AREA ACTUAL PHOTO UPDATE
  - Keep existing PLAN area heading tone
  - PC: text and actual photo side-by-side inside the frame
  - SP: stack text and photo vertically
========================================================= */
#plan .plan-area-heading__inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 1.12fr) minmax(300px, .88fr);
  gap:28px;
  align-items:center;
}

#plan .plan-area-heading__text{
  min-width:0;
}

#plan .plan-area-heading__media{
  position:relative;
  z-index:1;
  overflow:hidden;
  aspect-ratio:16 / 9;
  min-height:220px;
  border-radius:18px;
  border:1px solid rgba(30,186,222,.24);
  background:#fff;
  box-shadow:0 10px 26px rgba(30,186,222,.10);
}

#plan .plan-area-heading--bbq .plan-area-heading__media{
  border-color:rgba(255,110,187,.30);
  box-shadow:0 10px 26px rgba(255,110,187,.10);
}

#plan .plan-area-heading__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

@media screen and (max-width:767px){
  #plan .plan-area-heading__inner{
    grid-template-columns:1fr;
    gap:18px;
  }

  #plan .plan-area-heading__media{
    min-height:0;
    aspect-ratio:4 / 3;
    border-radius:16px;
  }
}

/* =========================================================
  BBQ PLAN DUAL RATE UPDATE 2026-07-30
  対象：バラエティプラン〜キッズプランのみ
  PC：1日利用／時間制利用を横並び
  SP：1日利用を上、時間制利用を下
========================================================= */
#plan .plan-card--dual-rate{
  grid-template-columns:260px minmax(220px,1fr) minmax(430px,480px);
}

#plan .plan-card--dual-rate .plan-price-area--comparison{
  padding:22px 20px;
  gap:14px;
  justify-content:center;
  background:linear-gradient(180deg,#fff 0%,#f8fdff 100%);
}

#plan .plan-rate-comparison{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  width:100%;
}

#plan .plan-rate{
  overflow:hidden;
  min-width:0;
  border:1px solid rgba(30,186,222,.42);
  border-radius:15px;
  background:#fff;
}

#plan .plan-rate--day{
  border-color:rgba(255,110,187,.48);
  background:linear-gradient(180deg,#fff 0%,#fff3f9 100%);
}

#plan .plan-rate--slot{
  background:linear-gradient(180deg,#fff 0%,#e8f8fc 100%);
}

#plan .plan-rate__heading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:8px 10px;
  border-bottom:1px solid rgba(30,186,222,.24);
  text-align:center;
}

#plan .plan-rate--day .plan-rate__heading{
  border-bottom-color:rgba(255,110,187,.28);
}

#plan .plan-rate__heading span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 7px;
  border-radius:999px;
  background:#FF6EBB;
  color:#fff;
  font-size:10px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}

#plan .plan-rate--slot .plan-rate__heading span{
  background:#1EBADE;
}

#plan .plan-rate__heading strong{
  color:#151515;
  font-size:14px;
  line-height:1.3;
  font-weight:900;
}

#plan .plan-rate__options{
  display:grid;
  grid-template-columns:1fr;
}

#plan .plan-rate__option{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:96px;
  padding:12px 8px;
  text-align:center;
}

#plan .plan-rate__option + .plan-rate__option{
  border-top:1px dashed rgba(30,186,222,.35);
}

#plan .plan-rate--day .plan-rate__option + .plan-rate__option{
  border-top-color:rgba(255,110,187,.38);
}

#plan .plan-rate__label{
  color:#151515;
  font-size:10px;
  line-height:1.5;
  font-weight:800;
}

#plan .plan-rate__price{
  display:block;
  margin-top:7px;
  color:#1EBADE;
  font-family:var(--font-en);
  font-size:clamp(25px,2.25vw,34px);
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}

#plan .plan-rate--day .plan-rate__price{
  color:#FF6EBB;
}

#plan .plan-card--dual-rate .plan-price-area .btn{
  min-height:48px;
  padding:10px 16px;
  font-size:13px;
}

#plan .plan-card--kids .plan-rate__options--single .plan-rate__option{
  min-height:118px;
}

#plan .kids-addition-note{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:11px 16px;
  border:2px solid #FF6EBB;
  border-radius:14px;
  background:#fff;
  color:#151515;
  text-align:center;
  font-size:13px;
  line-height:1.65;
  font-weight:900;
}

@media screen and (max-width:1100px) and (min-width:768px){
  #plan .plan-card--dual-rate{
    grid-template-columns:220px minmax(180px,1fr) minmax(390px,430px);
  }

  #plan .plan-card--dual-rate .plan-body{
    padding:26px 24px;
  }

  #plan .plan-rate__label{
    font-size:9px;
  }

  #plan .plan-rate__price{
    font-size:27px;
  }
}

@media screen and (max-width:767px){
  #plan .plan-card--dual-rate{
    display:block;
  }

  #plan .plan-card--dual-rate .plan-price-area--comparison{
    padding:18px 20px 20px;
    gap:14px;
  }

  #plan .plan-rate-comparison{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  /* スマホは1日利用を必ず先に表示 */
  #plan .plan-rate--day{
    order:1;
  }

  #plan .plan-rate--slot{
    order:2;
  }

  #plan .plan-rate__heading{
    min-height:44px;
  }

  #plan .plan-rate__heading strong{
    font-size:15px;
  }

  #plan .plan-rate__options{
    grid-template-columns:1fr 1fr;
  }

  #plan .plan-rate__option{
    min-height:110px;
    padding:13px 8px;
  }

  #plan .plan-rate__option + .plan-rate__option{
    border-top:0;
    border-left:1px dashed rgba(30,186,222,.35);
  }

  #plan .plan-rate--day .plan-rate__option + .plan-rate__option{
    border-left-color:rgba(255,110,187,.38);
  }

  #plan .plan-rate__label{
    font-size:10px;
  }

  #plan .plan-rate__price{
    font-size:30px;
  }

  #plan .plan-card--dual-rate .plan-price-area .btn{
    min-height:54px;
    font-size:14px;
  }

  #plan .plan-card--kids .plan-rate__options--single{
    grid-template-columns:1fr;
  }

  #plan .plan-card--kids .plan-rate__options--single .plan-rate__option{
    min-height:100px;
  }

  #plan .kids-addition-note{
    min-height:58px;
    padding:12px 14px;
    border-radius:13px;
    font-size:13px;
  }
}


/* =========================================================
  AUTUMN PAGE CROSS-LINK
========================================================= */
.open-badge{
  flex-direction:column;
  line-height:1.08;
}

.open-badge > span{
  display:block;
}

.open-badge__date{
  margin-top:4px;
  font-size:.72em;
  line-height:1;
  letter-spacing:0;
  white-space:nowrap;
}

.season-link{
  padding:24px 0 16px;
  background:#fff;
}

.season-link-card{
  display:grid;
  grid-template-columns:minmax(280px, 34%) 1fr;
  min-height:194px;
  overflow:hidden;
  border:1px solid rgba(30,186,222,.28);
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 26px rgba(0,82,155,.08);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.season-link-card:hover{
  transform:translateY(-2px);
  border-color:rgba(200,95,50,.48);
  box-shadow:0 14px 32px rgba(0,82,155,.12);
}

.season-link-card:focus-visible{
  outline:3px solid var(--pink);
  outline-offset:4px;
}

.season-link-card__media{
  min-height:194px;
  overflow:hidden;
}

.season-link-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 55%;
}

.season-link-card__body{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-content:center;
  align-items:center;
  column-gap:24px;
  padding:20px 32px;
}

.season-link-card__label{
  grid-column:1 / -1;
  margin:0 0 7px;
  color:#c85f32;
  font-family:var(--font-en);
  font-size:11px;
  line-height:1;
  font-weight:800;
  letter-spacing:.16em;
}

.season-link-card h2{
  grid-column:1 / -1;
  margin:0 0 12px;
  color:var(--navy);
  font-size:clamp(22px,2vw,28px);
  line-height:1.36;
  font-weight:800;
  letter-spacing:.02em;
}

.season-link-card__schedule{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
  color:var(--deep);
  font-size:13px;
}

.season-link-card__schedule strong{
  font-family:var(--font-en);
  font-size:14px;
  letter-spacing:.05em;
}

.season-link-card__schedule span{
  padding-left:12px;
  border-left:1px solid var(--line);
  font-weight:700;
}

.season-link-card__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 22px;
  border-radius:999px;
  color:#fff;
  background:#c85f32;
  font-size:13px;
  font-weight:800;
  letter-spacing:.04em;
  white-space:nowrap;
}

.season-link-card__cta::after{
  content:"›";
  margin-left:8px;
  font-size:19px;
  line-height:1;
}

@media screen and (max-width:767px){
  .season-link{
    padding:18px 0 8px;
  }

  .season-link-card{
    grid-template-columns:34% 66%;
    min-height:196px;
    border-radius:16px;
  }

  .season-link-card__media{
    min-height:196px;
  }

  .season-link-card__body{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    padding:13px 12px 14px;
  }

  .season-link-card__label{
    margin-bottom:6px;
    font-size:9px;
    letter-spacing:.1em;
  }

  .season-link-card h2{
    margin-bottom:8px;
    font-size:18px;
    line-height:1.4;
  }

  .season-link-card__schedule{
    display:block;
    margin-bottom:9px;
    font-size:11px;
    line-height:1.5;
  }

  .season-link-card__schedule strong,
  .season-link-card__schedule span{
    display:block;
  }

  .season-link-card__schedule strong{
    margin-bottom:2px;
    font-size:12px;
  }

  .season-link-card__schedule span{
    padding-left:0;
    border-left:0;
  }

  .season-link-card__cta{
    width:100%;
    min-height:38px;
    padding:7px 8px;
    font-size:11px;
  }
}

@media screen and (max-width:390px){
  .season-link-card{
    grid-template-columns:32% 68%;
  }

  .season-link-card h2{
    font-size:16px;
    line-height:1.38;
  }

  .season-link-card__cta{
    font-size:10px;
  }
}

/* NEWS detail links */
.news-list a.news-title:hover {
  color: var(--blue) !important;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.news-list a.news-title:focus-visible {
  outline: 3px solid var(--pink);
  outline-offset: 3px;
}

/* Linked NEWS items: visual continuation cue */
.news-list a.news-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.news-list a.news-title::after {
  content: "›";
  flex: 0 0 auto;
  color: var(--blue);
  font-size: 24px;
  line-height: 1;
  font-weight: 800;
  transition: transform .2s ease, color .2s ease;
}

.news-list a.news-title:hover::after {
  color: var(--pink);
  transform: translateX(3px);
}

@media screen and (max-width: 767px) {
  .news-list a.news-title {
    align-items: flex-start;
    gap: 8px;
  }

  .news-list a.news-title::after {
    margin-top: 1px;
    font-size: 21px;
  }
}
