/* =========================================================
 * PIKUBOPA（ピックルボール）ページ／トップページのセクション
 * カラーはHUGO YOSHIKAWAのイラストから採っています
 * ======================================================= */
:root{
  --pk-navy:#17207f;     /* イラストの線 */
  --pk-orange:#f2693a;   /* ネット・太陽 */
  --pk-peach:#f8a983;    /* コート */
  --pk-skin:#fcd3bf;     /* 肌・明るい面 */
  --pk-cream:#fff4ec;    /* 地 */
  --pk-sky:#9098dc;      /* 空 */
  --pk-red:#da3038;      /* ロゴ */
  --pk-display:'Zen Maru Gothic','Noto Sans JP',sans-serif;
  --pk-round:'Zen Maru Gothic','Noto Sans JP',sans-serif;
}

/* ---------- 共通パーツ ---------- */
.pk-eyebrow{display:inline-block;font-family:'Inter',sans-serif;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--pk-orange);margin-bottom:14px}
.pk-h2{font-family:var(--pk-display);font-weight:900;font-size:clamp(26px,3.6vw,44px);line-height:1.35;color:var(--pk-navy);letter-spacing:.01em;margin-bottom:28px;text-wrap:balance}
.pk-h3{font-family:var(--pk-display);font-weight:900;font-size:clamp(22px,2.6vw,32px);line-height:1.2;color:var(--pk-navy);letter-spacing:.03em}
.pk-body{font-size:15px;line-height:2.05;color:#3b3550;max-width:46em}
.pk-tag{display:inline-block;font-family:'Inter',sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;background:var(--pk-navy);color:#fff;padding:4px 10px;border-radius:99px;margin-bottom:12px}
.pk-meta{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.08em;color:#6c6580;margin-top:6px}
.pk-btn{display:inline-flex;align-items:center;gap:10px;background:var(--pk-navy);color:#fff;text-decoration:none;font-weight:700;font-size:14px;letter-spacing:.04em;padding:16px 28px;border-radius:99px;border:2px solid var(--pk-navy);box-shadow:4px 4px 0 var(--pk-orange);transition:transform .2s,box-shadow .2s}
.pk-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--pk-orange)}
.pk-btn:focus-visible{outline:3px solid var(--pk-orange);outline-offset:3px}
.pk-btn.is-ghost{background:transparent;color:var(--pk-navy)}
.pk-sticker{background:#fff;padding:10px;border:3px solid var(--pk-navy);border-radius:14px;box-shadow:8px 8px 0 var(--pk-navy)}
.pk-sticker img{display:block;width:100%;height:auto;border-radius:6px}
.pc{display:inline}

/* ---------- トップページ：ピックルボールについて ---------- */
.pk-top{background:var(--pk-cream);position:relative;overflow:hidden}
.pk-top::before{content:"";position:absolute;inset:auto -10% -1px -10%;height:26%;background:
  linear-gradient(var(--pk-peach),var(--pk-peach)) padding-box;
  clip-path:polygon(0 35%,100% 0,100% 100%,0 100%);opacity:.55}
.pk-top-in{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.pk-top-h{font-size:clamp(22px,2.6vw,30px);font-weight:700;color:var(--pk-navy);margin-bottom:26px}
.pk-top-logo{display:flex;align-items:flex-end;flex-wrap:wrap;gap:6px 16px;margin-bottom:18px}
.pk-top-logo img{width:min(440px,100%);height:auto}
.pk-top-logo span{font-family:'Inter',sans-serif;font-weight:700;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--pk-navy);padding-bottom:10px}
.pk-top-catch{font-family:var(--pk-display);font-size:clamp(28px,3.4vw,42px);color:var(--pk-orange);line-height:1.15;margin-bottom:12px;letter-spacing:.02em}
.pk-top-lead{font-size:clamp(15px,1.6vw,18px);font-weight:700;color:var(--pk-navy);margin-bottom:16px}
.pk-top-body{font-size:14px;line-height:2;color:#4b4560;max-width:36em;margin-bottom:32px}
.pk-top-art{position:relative;min-height:440px}
.pk-top-art .s1{position:absolute;width:62%;right:6%;top:0;transform:rotate(4deg)}
.pk-top-art .s2{position:absolute;width:72%;left:0;bottom:0;transform:rotate(-5deg)}

/* ---------- 独立ページ ---------- */
.pk{background:var(--pk-cream);color:#2a2540}
.pk .con{position:relative}
.pk .crumb{color:#6c6580}
.pk .crumb a{color:var(--pk-navy)}
.pk-sec{padding:104px 0}

/* HERO */
.pk-hero{position:relative;padding:150px 0 0;background:var(--pk-cream);overflow:hidden}
.pk-hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;padding-bottom:110px}
.pk-logo{margin:18px 0 26px;line-height:1}
.pk-logo img{display:block;width:min(640px,100%);height:auto}
.pk-logo-sub{display:block;font-family:'Inter',sans-serif;font-weight:800;font-size:clamp(13px,1.4vw,17px);letter-spacing:.32em;text-transform:uppercase;color:var(--pk-navy);margin-top:14px}
.pk-catch{font-family:var(--pk-display);font-size:clamp(46px,7vw,96px);line-height:.98;color:var(--pk-navy);letter-spacing:.01em;margin-bottom:26px}
.pk-lead{font-size:clamp(16px,1.8vw,21px);font-weight:700;line-height:1.8;color:var(--pk-navy)}
.pk-hero-art{position:relative;min-height:520px}
.pk-hero-art .s1{position:absolute;width:74%;right:0;top:0;transform:rotate(5deg)}
.pk-hero-art .s2{position:absolute;width:78%;left:-4%;bottom:-6%;transform:rotate(-6deg)}
.pk-court-band{height:84px;background:
  linear-gradient(90deg,transparent calc(50% - 3px),#fff calc(50% - 3px),#fff calc(50% + 3px),transparent calc(50% + 3px)),
  linear-gradient(transparent 22px,#fff 22px,#fff 28px,transparent 28px),
  var(--pk-orange)}

/* BRAND */
.pk-brand{background:#fff}
.pk-formula{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:18px;align-items:stretch;margin:12px 0 44px}
.pk-f-item{border:3px solid var(--pk-navy);border-radius:16px;padding:24px 22px;display:flex;flex-direction:column;gap:8px;background:var(--pk-cream)}
.pk-f-k{font-family:'Inter',sans-serif;font-size:10px;font-weight:700;letter-spacing:.2em;color:var(--pk-orange)}
.pk-f-v{font-family:var(--pk-display);font-size:clamp(18px,2vw,24px);color:var(--pk-navy);line-height:1.2}
.pk-f-d{font-size:12px;line-height:1.8;color:#5a5470}
.pk-f-op{align-self:center;font-family:var(--pk-display);font-size:34px;color:var(--pk-orange)}
.pk-f-res{background:var(--pk-red);border-color:var(--pk-red);align-items:center;justify-content:center}
.pk-f-res img{width:100%;max-width:240px;height:auto}

/* WHAT */
.pk-what{background:var(--pk-cream);padding-bottom:40px}
.pk-what-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.pk-facts{display:grid;gap:12px}
.pk-facts>div{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:baseline;padding:18px 20px;background:#fff;border-radius:12px;border:2px solid var(--pk-skin)}
.pk-facts dt{font-family:'Inter',sans-serif;font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--pk-orange)}
.pk-facts dd{font-size:14px;font-weight:500;color:var(--pk-navy);line-height:1.7}
.pk-facts small{display:block;font-family:'Inter',sans-serif;font-size:12px;color:#6c6580;font-variant-numeric:tabular-nums}

/* POSSIBILITY + COMIC */
.pk-possibility{background:var(--pk-cream)}
.pk-comic-wrap{max-width:1360px;margin:56px auto 0;padding:0 40px}
.pk-comic{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pk-panel{position:relative;display:flex;flex-direction:column;gap:10px}
.pk-panel img{display:block;width:100%;height:auto;border:3px solid var(--pk-navy);border-radius:10px;background:#fff}
.pk-panel:nth-child(odd){transform:rotate(-1.2deg)}
.pk-panel:nth-child(even){transform:rotate(1.2deg)}
.pk-panel-n{position:static;align-self:flex-start;width:30px;height:30px;border-radius:50%;background:var(--pk-navy);color:#fff;font-family:'Inter',sans-serif;font-weight:800;font-size:13px;display:grid;place-items:center}
.pk-credit{text-align:right;font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.12em;color:#6c6580;margin-top:18px}

/* BEYOND */
.pk-beyond{background:var(--pk-navy);color:#fff;position:relative;overflow:hidden}
.pk-beyond::after{content:"";position:absolute;right:-120px;top:50%;width:520px;height:300px;transform:translateY(-50%) rotate(-8deg);border:6px solid rgba(255,255,255,.12);
  background:linear-gradient(90deg,transparent calc(50% - 3px),rgba(255,255,255,.12) calc(50% - 3px),rgba(255,255,255,.12) calc(50% + 3px),transparent calc(50% + 3px))}
.pk-beyond .pk-h2{color:#fff}
.pk-beyond .pk-body{color:rgba(255,255,255,.82)}
.pk-beyond .pk-eyebrow{color:var(--pk-peach)}
.pk-places{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px;position:relative;z-index:1}
.pk-places li{background:rgba(255,255,255,.06);border:2px solid rgba(255,255,255,.22);border-radius:14px;padding:24px 20px;font-weight:700;font-size:15px;line-height:1.6}
.pk-pl-i{display:block;width:56px;height:36px;margin-bottom:18px;border:3px solid var(--pk-peach);border-radius:4px;position:relative}
.pk-pl-i::before{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;width:3px;margin-left:-1.5px;background:var(--pk-peach)}
.pk-pl-i.i1{background:repeating-linear-gradient(45deg,transparent 0 6px,rgba(248,169,131,.45) 6px 9px)}
.pk-pl-i.i2{border-style:dashed}
.pk-pl-i.i3{border-radius:18px}
.pk-pl-i.i4{border-top-width:9px}

/* PRODUCTS */
.pk-products{background:#fff}
.pk-shoe{margin-top:56px;background:var(--pk-cream);border-radius:24px;padding:36px 40px 28px}
.pk-shoe-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.pk-swatches{display:flex;gap:12px}
.pk-sw{width:38px;height:38px;border-radius:50%;background:var(--sw);border:3px solid #fff;box-shadow:0 0 0 2px var(--pk-skin);cursor:pointer;transition:box-shadow .2s,transform .2s}
.pk-sw:hover{transform:scale(1.08)}
.pk-sw.is-on{box-shadow:0 0 0 3px var(--pk-navy)}
.pk-sw:focus-visible{outline:3px solid var(--pk-orange);outline-offset:3px}
.pk-shoe-fig{margin:8px 0 0}
.pk-shoe-img{display:block;width:100%;max-width:900px;height:auto;margin:0 auto;mix-blend-mode:multiply;transition:opacity .25s}
.pk-shoe-fig figcaption{text-align:center;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.14em;color:#6c6580;text-transform:uppercase}
.pk-apparel{margin-top:64px}
.pk-apparel-head{margin-bottom:24px}
.pk-tees{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pk-tees li{background:#f6f4f2;border-radius:16px;overflow:hidden;position:relative}
.pk-tees img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.pk-tees span{position:absolute;left:14px;bottom:12px;font-family:'Inter',sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--pk-navy);background:#fff;padding:4px 10px;border-radius:99px}

/* PLATFORM */
.pk-platform{background:var(--pk-cream)}
.pk-pf{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:8px 0 36px}
.pk-pf-col{background:#fff;border-radius:16px;padding:26px 26px 22px;border:2px solid var(--pk-skin)}
.pk-pf-h{font-size:13px;font-weight:700;color:var(--pk-navy);margin-bottom:14px}
.pk-chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.pk-chips li{font-size:14px;font-weight:700;color:var(--pk-navy);border:2px solid var(--pk-navy);border-radius:99px;padding:8px 18px}
.pk-chips.is-solid li{background:var(--pk-orange);border-color:var(--pk-orange);color:#fff}
.pk-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:40px}

/* CLOSING */
.pk-closing{background:var(--pk-orange);color:#fff;text-align:center;padding:110px 0 100px;position:relative;overflow:hidden}
.pk-closing::before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,transparent calc(50% - 3px),rgba(255,255,255,.1) calc(50% - 3px),rgba(255,255,255,.1) calc(50% + 3px),transparent calc(50% + 3px)),
  linear-gradient(transparent calc(50% - 3px),rgba(255,255,255,.1) calc(50% - 3px),rgba(255,255,255,.1) calc(50% + 3px),transparent calc(50% + 3px))}
.pk-slogan{position:relative;font-family:var(--pk-display);font-size:clamp(26px,7.6vw,84px);line-height:1.05;letter-spacing:.01em;margin-bottom:28px;text-shadow:5px 5px 0 var(--pk-navy)}
.pk-closing-l{position:relative;font-size:clamp(15px,1.7vw,19px);font-weight:700;line-height:1.9;margin-bottom:48px}
.pk-closing-logo{position:relative;display:block;width:min(300px,70%);height:auto;margin:0 auto}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1024px){
  .pk-top-in,.pk-hero-in,.pk-what-in{grid-template-columns:1fr}
  .pk-top-art{min-height:0;height:min(80vw,460px);max-width:560px;width:100%;margin:0 auto}
  .pk-hero-art{min-height:0;height:min(84vw,520px);max-width:560px;width:100%;margin:0 auto}
  .pk-formula{grid-template-columns:1fr;gap:10px}
  .pk-f-op{justify-self:center;line-height:1}
  .pk-comic{grid-template-columns:1fr 1fr}
  .pk-places{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .pc{display:none}
  .pk-sec{padding:72px 0}
  .pk-hero{padding-top:110px}
  .pk-hero-in{padding-bottom:72px;gap:40px}
  .pk-comic-wrap{padding:0 22px}
  .pk-comic{gap:12px}
  .pk-shoe{padding:24px 18px 18px;border-radius:18px}
  .pk-tees,.pk-pf{grid-template-columns:1fr}
  .pk-places li{padding:18px 16px;font-size:14px}
  .pk-beyond::after{display:none}
  .pk-court-band{height:60px}
  .pk-facts>div{grid-template-columns:1fr;gap:4px}
  .pk-top-logo span{padding-bottom:0}
  .pk-btn{padding:14px 22px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .pk-btn,.pk-sw,.pk-shoe-img{transition:none}
}

/* ---------- クラウドファンディング告知 ---------- */
.pk-cf{background:var(--pk-cream);padding:88px 0 0}
.pk-cf-card{position:relative;display:grid;grid-template-columns:200px 1fr;gap:44px;align-items:center;background:#fff;border:3px solid var(--pk-navy);border-radius:24px;padding:40px 44px;box-shadow:10px 10px 0 var(--pk-orange)}
.pk-cf-badge{width:180px;height:180px;border-radius:50%;background:var(--pk-orange);color:#fff;display:grid;place-items:center;text-align:center;border:3px solid var(--pk-navy);transform:rotate(-10deg);animation:pk-wobble 3.2s ease-in-out infinite}
.pk-cf-badge-t{font-family:var(--pk-display);font-size:28px;line-height:1.05;letter-spacing:.02em}
.pk-cf.is-open .pk-cf-badge{background:var(--pk-red)}
.pk-cf.is-closed .pk-cf-badge{background:var(--pk-sky);animation:none}
.pk-cf-h{font-family:var(--pk-display);font-weight:900;font-size:clamp(22px,2.8vw,34px);line-height:1.4;color:var(--pk-navy);margin-bottom:14px}
.pk-cf-txt{font-size:14px;line-height:2;color:#4b4560;max-width:42em;margin-bottom:20px}
.pk-cf-meta{display:flex;flex-wrap:wrap;gap:10px 28px;margin-bottom:26px;padding:14px 0;border-top:2px dashed var(--pk-skin);border-bottom:2px dashed var(--pk-skin)}
.pk-cf-meta div{display:flex;gap:12px;align-items:center}
.pk-cf-meta dt{white-space:nowrap;font-size:11px;font-weight:700;letter-spacing:.08em;color:#8a8399}
.pk-cf-meta dd{font-size:14px;font-weight:700;color:var(--pk-navy);display:flex;align-items:center;gap:8px}
.pk-cf-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--pk-orange);box-shadow:0 0 0 0 rgba(242,105,58,.6);animation:pk-pulse 1.8s infinite;flex-shrink:0}
.pk-cf-actions{display:flex;flex-wrap:wrap;gap:14px}
.pk-cf-note{font-size:12px;color:#7a7390;margin-top:22px;padding-left:4px}
.pk-cf-pill{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;padding:9px 18px;border-radius:99px;background:#fff;border:2px solid var(--pk-orange);color:var(--pk-navy);font-size:13px;font-weight:700;text-decoration:none;transition:background .2s}
.pk-cf-pill:hover{background:var(--pk-skin)}
.pk-top-txt .pk-cf-pill{display:flex;width:max-content;max-width:100%}
@keyframes pk-pulse{0%{box-shadow:0 0 0 0 rgba(242,105,58,.55)}70%{box-shadow:0 0 0 10px rgba(242,105,58,0)}100%{box-shadow:0 0 0 0 rgba(242,105,58,0)}}
@keyframes pk-wobble{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(-4deg)}}
@media(max-width:768px){
  .pk-cf{padding-top:56px}
  .pk-cf-card{grid-template-columns:1fr;gap:20px;padding:28px 22px;box-shadow:6px 6px 0 var(--pk-orange)}
  .pk-cf-badge{width:120px;height:120px;position:absolute;right:-8px;top:-34px}
  .pk-cf-badge-t{font-size:19px}
  .pk-cf-main{padding-top:40px}
}
@media(prefers-reduced-motion:reduce){.pk-cf-badge,.pk-cf-dot{animation:none}}

/* ---------- COMING SOON スタンプ（シューズ・Tシャツ） ---------- */
.pk-shoe-fig,.pk-tees-wrap{position:relative}
.pk-soon{position:absolute;z-index:2;display:grid;place-items:center;width:150px;height:150px;border-radius:50%;
  background:var(--pk-orange);color:#fff;border:3px solid var(--pk-navy);box-shadow:5px 5px 0 var(--pk-navy);
  transform:rotate(-12deg);text-align:center;pointer-events:none}
.pk-soon>span{font-family:var(--pk-display);font-size:24px;line-height:1.05;letter-spacing:.03em}
.pk-soon::before{content:"";position:absolute;inset:8px;border:2px dashed rgba(255,255,255,.75);border-radius:50%}
.pk-shoe-fig .pk-soon{left:4%;top:4%}
.pk-soon.is-tee{right:-18px;top:-48px;transform:rotate(10deg)}
@media(max-width:768px){
  .pk-soon{width:96px;height:96px;box-shadow:3px 3px 0 var(--pk-navy)}
  .pk-soon>span{font-size:15px}
  .pk-soon::before{inset:5px}
  .pk-shoe-fig .pk-soon{left:0;top:-6px}
  .pk-soon.is-tee{right:-6px;top:-30px}
}

/* ---------- 独立ページ表示（J-BREAKのメニュー・フッターなし） ---------- */
.pk-standalone .pk-hero{padding-top:88px}
.pk-standalone .pk-logo{margin-top:0}
@media(max-width:768px){.pk-standalone .pk-hero{padding-top:56px}}

/* ---------- 問い合わせメール表示 ---------- */
.pk-mail{margin-top:16px;font-size:13px;color:#5a5470}
.pk-mail-addr{font-family:'Inter',sans-serif;font-weight:700;color:var(--pk-navy);letter-spacing:.02em;user-select:all;-webkit-user-select:all}

/* ---------- LP内 お知らせ（最新3件） ---------- */
.pk-news-sec{background:#fff}
.pk-news-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:8px}
.pk-news-head .pk-h2{margin-bottom:0}
.pk-more{font-size:14px;font-weight:700;color:var(--pk-navy);text-decoration:none;border-bottom:2px solid var(--pk-orange);padding-bottom:4px}
.pk-more:hover{color:var(--pk-orange)}
.pk-nlist{list-style:none;margin-top:28px;border-top:3px solid var(--pk-navy)}
.pk-nlist li{border-bottom:2px dashed var(--pk-skin)}
.pk-nlist a{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;padding:20px 4px;text-decoration:none;color:var(--pk-navy);transition:color .2s}
.pk-nlist a:hover .pk-nt{color:var(--pk-orange)}
.pk-nlist time,.pk-ni time{font-family:'Inter',sans-serif;font-weight:800;font-size:13px;letter-spacing:.06em;color:var(--pk-orange);font-variant-numeric:tabular-nums;min-width:64px}
.pk-ntag{font-size:11px;font-weight:700;color:var(--pk-navy);background:var(--pk-skin);border-radius:99px;padding:3px 12px;white-space:nowrap}
.pk-nt{font-size:15px;font-weight:700;line-height:1.6;transition:color .2s}

/* ---------- PIKUBOPA お知らせページ ---------- */
.pk-bar{background:var(--pk-cream);padding:20px 0;border-bottom:2px solid var(--pk-skin)}
.pk-bar-in{display:flex;justify-content:space-between;align-items:center;gap:16px}
.pk-bar-logo img{display:block;height:40px;width:auto}
.pk-bar-back{font-size:13px;font-weight:700;color:var(--pk-navy);text-decoration:none;border:2px solid var(--pk-navy);border-radius:99px;padding:8px 16px;white-space:nowrap}
.pk-bar-back:hover{background:var(--pk-navy);color:#fff}
.pk-nhero{background:var(--pk-cream);padding:72px 0 0}
.pk-nhero .con{padding-bottom:64px}
.pk-nhero-t{font-family:var(--pk-display);font-weight:900;font-size:clamp(30px,4.6vw,56px);line-height:1.25;color:var(--pk-navy);margin-bottom:18px}
.pk-narchive{background:#fff}
.pk-nacc{border-top:3px solid var(--pk-navy);max-width:960px}
.pk-ni{border-bottom:2px dashed var(--pk-skin)}
.pk-ni summary{list-style:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;padding:24px 44px 24px 4px;position:relative;cursor:pointer;color:var(--pk-navy)}
.pk-ni summary::-webkit-details-marker{display:none}
.pk-ni summary:hover .pk-nt{color:var(--pk-orange)}
.pk-ni summary:focus-visible{outline:3px solid var(--pk-orange);outline-offset:2px}
.pk-nx{position:absolute;right:8px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background:var(--pk-navy)}
.pk-nx::before,.pk-nx::after{content:"";position:absolute;left:7px;top:12px;width:12px;height:2px;background:#fff;transition:transform .25s}
.pk-nx::after{transform:rotate(90deg)}
.pk-ni[open] .pk-nx::after{transform:rotate(0)}
.pk-nb{padding:0 4px 28px 86px;max-width:820px}
.pk-nb p{font-size:14px;line-height:2;color:#3b3550}
.pk-nb p+p{margin-top:10px}
.pk-nb a{color:var(--pk-navy);font-weight:700;text-underline-offset:4px}
.pk-ncontact{margin-top:72px;background:var(--pk-cream);border-radius:20px;padding:36px 32px;text-align:center}
.pk-ncontact>p:first-child{font-size:15px;font-weight:700;color:var(--pk-navy);margin-bottom:18px}
.pk-closing-sm{padding:80px 0 72px}
.pk-closing-sm .pk-slogan{font-size:clamp(26px,5vw,56px);margin-bottom:32px}
@media(max-width:768px){
  .pk-bar-logo img{height:30px}
  .pk-bar-back{font-size:12px;padding:6px 12px}
  .pk-nhero{padding-top:48px}
  .pk-nhero .con{padding-bottom:44px}
  .pk-nb{padding-left:4px}
  .pk-ncontact{padding:28px 18px}
}


/* ---------- 背景：ピックルボールコートのライン ----------
 * コート（44ft×20ft）を横向きにした線画を薄く敷いています。
 * 中央の点線がネット、両側の縦線がキッチン（ノンボレーゾーン）ライン。
 */
:root{
  --pk-court:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20208%22%20fill%3D%22none%22%20stroke%3D%22%23f2693a%22%20stroke-opacity%3D%22.14%22%20stroke-width%3D%222.5%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22440%22%20height%3D%22200%22%2F%3E%3Cpath%20d%3D%22M154%204V204M294%204V204M4%20104H154M294%20104H444%22%2F%3E%3Cpath%20d%3D%22M224%20-4V212%22%20stroke-width%3D%225.0%22%20stroke-dasharray%3D%222%206%22%2F%3E%3C%2Fsvg%3E");
  --pk-court-w:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20208%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%22.9%22%20stroke-width%3D%224%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22440%22%20height%3D%22200%22%2F%3E%3Cpath%20d%3D%22M154%204V204M294%204V204M4%20104H154M294%20104H444%22%2F%3E%3Cpath%20d%3D%22M224%20-4V212%22%20stroke-width%3D%228%22%20stroke-dasharray%3D%222%206%22%2F%3E%3C%2Fsvg%3E");
  --pk-court-n:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20208%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%22.07%22%20stroke-width%3D%222.5%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22440%22%20height%3D%22200%22%2F%3E%3Cpath%20d%3D%22M154%204V204M294%204V204M4%20104H154M294%20104H444%22%2F%3E%3Cpath%20d%3D%22M224%20-4V212%22%20stroke-width%3D%225.0%22%20stroke-dasharray%3D%222%206%22%2F%3E%3C%2Fsvg%3E");
}
.pk-hero,.pk-what,.pk-possibility,.pk-platform,.pk-cf,.pk-nhero,.pk-top{background-repeat:no-repeat}
.pk-hero{background-image:var(--pk-court);background-size:min(1500px,150%) auto;background-position:center 46%}
.pk-cf{background-image:var(--pk-court);background-size:min(1100px,140%) auto;background-position:-180px 40px}
.pk-what{background-image:var(--pk-court);background-size:min(1000px,140%) auto;background-position:calc(100% + 240px) 60%}
.pk-possibility{background-image:var(--pk-court);background-size:min(1300px,160%) auto;background-position:center 30px}
.pk-platform{background-image:var(--pk-court);background-size:min(1100px,150%) auto;background-position:calc(100% + 200px) 85%}
.pk-nhero{background-image:var(--pk-court);background-size:min(1100px,150%) auto;background-position:calc(100% + 160px) 30px}
.pk-top{background-image:var(--pk-court);background-size:min(1200px,160%) auto;background-position:calc(100% + 120px) 30px}
.pk-beyond{background-image:var(--pk-court-n);background-repeat:no-repeat;background-size:min(1200px,160%) auto;background-position:-160px center}
/* 白いセクションには、ごく淡いコートの地色をうっすら */
.pk-brand,.pk-products,.pk-news-sec,.pk-narchive{background-image:linear-gradient(180deg,rgba(248,169,131,.07),rgba(248,169,131,0) 40%)}
@media(max-width:768px){
  .pk-hero{background-size:220% auto;background-position:30% 40%}
  .pk-what,.pk-platform,.pk-cf,.pk-nhero,.pk-top{background-size:200% auto}
  .pk-possibility{background-size:240% auto}
}
.pk-beyond::after{display:none}


/* ---------- 丸文字（Zen Maru Gothic） ----------
 * 見出し・本文を丸ゴシックに。ウェイトは本文500／見出し700〜900で、
 * 可愛くなりすぎないよう字間は詰め気味にしています。
 */
.pk,.pk-top{font-family:var(--pk-round)}
.pk-body,.pk-top-body,.pk-cf-txt,.pk-nb p,.pk-f-d,.pk-facts dd,.pk-mail{font-weight:500}
.pk-h2,.pk-h3,.pk-nhero-t,.pk-cf-h{letter-spacing:0;line-height:1.4}
.pk-catch,.pk-top-catch,.pk-f-v,.pk-f-op,.pk-cf-badge-t,.pk-slogan,.pk-soon>span{font-weight:900;letter-spacing:-.01em}
.pk-lead,.pk-top-lead,.pk-top-h,.pk-closing-l,.pk-btn,.pk-chips li,.pk-places li,.pk-pf-h,.pk-nt,.pk-more{font-family:var(--pk-round);font-weight:700}
.pk-catch{line-height:1.02}

/* ---------- 先頭へ戻るボタン（ボール） ---------- */
.pk-totop{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:900;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s,transform .3s}
.pk-totop.is-show{opacity:1;transform:none;pointer-events:auto}
.pk-totop-ball{display:block;width:62px;height:62px;border-radius:50%;overflow:hidden;border:3px solid var(--pk-navy);background:#fff;box-shadow:3px 3px 0 var(--pk-orange);animation:pk-bounce 2.4s ease-in-out infinite}
.pk-totop-ball img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.25)}
.pk-totop-t{font-family:'Inter',sans-serif;font-size:10px;font-weight:800;letter-spacing:.18em;color:var(--pk-navy);background:var(--pk-cream);border-radius:99px;padding:1px 8px}
.pk-totop:hover .pk-totop-ball{animation-duration:.8s}
@keyframes pk-bounce{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-8px) rotate(-12deg)}60%{transform:translateY(-8px) rotate(-12deg)}}

@media(max-width:768px){
  .pk-totop-ball{width:52px;height:52px}
}
@media(prefers-reduced-motion:reduce){.pk-totop-ball{animation:none}}

/* 見出しは700で落ち着かせる（キャッチコピーのみ900） */
.pk-h2,.pk-h3,.pk-cf-h,.pk-nhero-t{font-weight:700}
/* 独立ページはヘッダーがないので、ジャンプ先の余白を小さく */
html:has(body.pk-standalone){scroll-padding-top:84px}

/* ---------- ページ内メニュー：パドル形ボタン ----------
 * パドル（面＋グリップ）を横向きにして、面に文字を入れています。
 * メニュー全体は position:sticky で、スクロールすると画面上部に固定されます。
 */
.pk-anchor{position:absolute;top:0}
.pk-jump-head{background:var(--pk-cream);padding:52px 0 14px}
.pk-jump-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;font-size:14px;font-weight:700;color:var(--pk-navy)}
.pk-jump-h span{font-family:'Inter',sans-serif;font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--pk-orange)}
.pk-jump{position:sticky;top:0;z-index:800;background:var(--pk-cream);transition:background .3s,box-shadow .3s}
.pk-jump.is-stuck{background:rgba(255,244,236,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 4px 0 var(--pk-skin)}
.pk-jump-in{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:12px max(16px,env(safe-area-inset-right,0px)) 14px max(16px,env(safe-area-inset-left,0px))}
.pk-jump-logo{flex-shrink:0;width:0;opacity:0;overflow:hidden;transition:width .3s,opacity .3s}
.pk-jump-logo img{display:block;height:28px;width:auto}
.pk-jump.is-stuck .pk-jump-logo{width:122px;opacity:1}
.pk-jump-list{list-style:none;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:8px 4px 10px;margin:-8px 0 -10px;flex:1;min-width:0;justify-content:safe center}
.pk-jump-list::-webkit-scrollbar{display:none}
.pk-jump-list li{flex-shrink:0;scroll-snap-align:start}

/* パドル本体 */
.pk-pdl{--face:var(--pk-skin);--ink:var(--pk-navy);display:flex;align-items:center;text-decoration:none;transform-origin:100% 50%;animation:pk-sway 4s ease-in-out infinite;animation-delay:calc(var(--i) * -.5s);outline:none}
.pk-pdl.c1{--face:var(--pk-peach)}
.pk-pdl.c2{--face:var(--pk-orange);--ink:#fff}
.pk-pdl.c3{--face:#fff}
.pk-pdl-face{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:104px;height:48px;padding:0 16px;background:var(--face);color:var(--ink);border:3px solid var(--pk-navy);border-radius:18px 14px 14px 18px;box-shadow:3px 3px 0 var(--pk-navy);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background .2s}
/* 面のハイライト（イラストのパドルと同じ短い線） */
.pk-pdl-face::before{content:"";position:absolute;left:9px;top:9px;width:3px;height:12px;border-radius:2px;background:currentColor;opacity:.35;box-shadow:0 16px 0 -0px currentColor}
.pk-pdl-t{font-size:13px;font-weight:700;line-height:1.15;white-space:nowrap}
.pk-pdl-e{font-family:'Inter',sans-serif;font-size:8px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.75;margin-top:2px}
/* グリップ（持ち手） */
.pk-pdl-grip{width:30px;height:16px;margin-left:-3px;background:repeating-linear-gradient(90deg,var(--pk-navy) 0 4px,#2b358f 4px 7px);border:3px solid var(--pk-navy);border-left:0;border-radius:0 6px 6px 0;box-shadow:2px 3px 0 rgba(23,32,127,.35)}
/* 動き：普段はゆらゆら、ホバーでスイング */
.pk-pdl:hover .pk-pdl-face,.pk-pdl:focus-visible .pk-pdl-face{transform:rotate(-7deg) translateY(-2px)}
.pk-pdl:active .pk-pdl-face{transform:scale(.95)}
.pk-pdl:focus-visible .pk-pdl-face{outline:3px solid var(--pk-orange);outline-offset:3px}
/* 現在見ているセクション */
.pk-pdl.is-current{--face:var(--pk-navy);--ink:#fff;animation:none}
.pk-pdl.is-current .pk-pdl-face{box-shadow:3px 3px 0 var(--pk-orange)}
@keyframes pk-sway{0%,100%{transform:rotate(0)}50%{transform:rotate(-2.5deg)}}

@media(max-width:768px){
  .pk-jump-head{padding:36px 0 10px}
  .pk-jump-in{padding-top:10px;padding-bottom:12px;gap:10px}
  .pk-jump-list{justify-content:flex-start;gap:8px}
  .pk-jump.is-stuck .pk-jump-logo{width:0;opacity:0}
  .pk-pdl-face{min-width:88px;height:42px;padding:0 12px;border-radius:15px 12px 12px 15px}
  .pk-pdl-t{font-size:12px}
  .pk-pdl-grip{width:22px;height:14px}
}
@media(prefers-reduced-motion:reduce){.pk-pdl{animation:none}.pk-pdl-face{transition:none}}
/* 固定時はパドルを少し小さく（PCで横一列に収める） */
.pk-jump.is-stuck .pk-pdl-face{min-width:88px;height:40px;padding:0 12px 0 16px;border-radius:15px 12px 12px 15px}
.pk-jump.is-stuck .pk-pdl-t{font-size:12px}
.pk-jump.is-stuck .pk-pdl-e{font-size:7px}
.pk-jump.is-stuck .pk-pdl-grip{width:22px;height:13px}
.pk-jump.is-stuck .pk-jump-in{padding-top:9px;padding-bottom:11px}
.pk-pdl-face{padding-left:20px}
.pk-pdl-face::before{left:8px;top:50%;height:8px;width:3px;margin-top:-10px;opacity:.28;box-shadow:0 12px 0 currentColor}