/*
Theme Name: Sea+SonS
Theme URI: https://sea-sons.jp/
Description: 一般社団法人シーソンズ（Sea+SonS）のトップページ用テーマ
Version: 2.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: seasons
*/
body{margin:0;background:#FFFFFF}
a{color:#0A2A5C}a:hover{color:#D6007A}
html{scroll-behavior:smooth}
.en{font-family:'Bebas Neue',sans-serif;letter-spacing:.04em;display:inline-block;transform:skewX(-10deg)}
.lbl{display:flex;align-items:center;gap:10px;font-size:20px}
.slash{display:inline-block;width:30px;height:18px;background:linear-gradient(90deg,#D6007A 0 38%,transparent 38% 62%,#D6007A 62%);transform:skewX(-24deg)}
.slash-y{background:linear-gradient(90deg,#FFD23F 0 38%,transparent 38% 62%,#FFD23F 62%)}
.tag{margin:10px 0 0;font-weight:900;font-size:14px}
.tag b{display:inline-block;background:#111111;color:#FFFFFF;padding:2px 12px;transform:skewX(-14deg);margin-right:6px}
.cut{clip-path:polygon(0 56px,100% 0,100% calc(100% - 56px),0 100%)}
.cut-top{clip-path:polygon(0 56px,100% 0,100% 100%,0 100%)}
.bub{position:relative;display:inline-block;background:#111111;color:#FFFFFF;border-radius:999px;padding:7px 16px;font-weight:900;font-size:13px;line-height:1.4;white-space:nowrap}
.bub::after{content:"";position:absolute;left:22px;bottom:-9px;border:6px solid transparent;border-top:8px solid #111111;border-bottom:0}
.giant{font-family:'Bebas Neue',sans-serif;line-height:.85;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.18);white-space:nowrap;pointer-events:none;user-select:none}
.skill-card{transition:transform .25s cubic-bezier(.2,.9,.3,1.4)}
.skill-card:hover{transform:translateY(-8px) rotate(-1deg)}
.ss-btn{transition:transform .18s ease}
.ss-btn:hover{transform:translateY(-3px) scale(1.04)}
@keyframes ss-hop{0%,62%,100%{transform:translateY(0) rotate(var(--r,0deg))}70%{transform:translateY(-14px) rotate(var(--r,0deg))}78%{transform:translateY(0) rotate(var(--r,0deg))}84%{transform:translateY(-5px) rotate(var(--r,0deg))}90%{transform:translateY(0) rotate(var(--r,0deg))}}
@keyframes ss-float{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-10px) rotate(var(--r,0deg))}}
@keyframes ss-spin{to{transform:rotate(360deg)}}
@keyframes ss-swim{0%{transform:translateX(112vw) translateY(0)}25%{transform:translateX(80vw) translateY(-14px)}50%{transform:translateX(48vw) translateY(6px)}75%{transform:translateX(16vw) translateY(-10px)}100%{transform:translateX(-24vw) translateY(0)}}
@keyframes ss-kick{from{transform:rotate(-9deg)}to{transform:rotate(9deg)}}
@keyframes ss-pop{0%{transform:translateY(24px) scale(.94);opacity:0}100%{transform:none;opacity:1}}
@keyframes ss-zoom{0%,100%{transform:rotate(-8deg) scale(1)}50%{transform:rotate(-8deg) scale(1.08)}}
.ss-hop{animation:ss-hop 3.2s ease-in-out infinite}
.ss-float{animation:ss-float 4.5s ease-in-out infinite}
.ss-zoom{animation:ss-zoom 1.8s ease-in-out infinite}
.ss-swim{position:absolute;left:0;animation:ss-swim 18s linear infinite;pointer-events:none}
.ss-in{animation:ss-pop .8s cubic-bezier(.2,.9,.3,1.3) both}
.ss-orbit{animation:ss-spin 20s linear infinite}
.ss-planet-in{animation:ss-spin 20s linear infinite reverse}
.ss-rays{animation:ss-spin 90s linear infinite}
.ss-ama-l1,.ss-ama-l2{transform-box:view-box;transform-origin:86px 27px;animation:ss-kick .7s ease-in-out infinite alternate}
.ss-ama-l2{animation-delay:-.35s}
.ss-menu-link{transition:transform .2s ease,color .2s ease}
.ss-menu-link:hover{transform:translateX(10px);color:#FFD23F}
section[id]{scroll-margin-top:24px}
@media (max-width:720px){
 .kv-title{font-size:34px!important}
 .h2{font-size:34px!important}
 .giant{font-size:96px!important}
 .cut{clip-path:polygon(0 28px,100% 0,100% calc(100% - 28px),0 100%)}
 .cut-top{clip-path:polygon(0 28px,100% 0,100% 100%,0 100%)}
 .corner{width:84px!important;height:84px!important}
 .hex{top:90px!important;width:60px!important;height:68px!important;font-size:12px!important}
 .kv-logo img{height:40px!important}
 #ss-menu nav a,.ss-menu-nav a{flex-direction:column;gap:0!important}
 #ss-menu nav a span:first-child,.ss-menu-nav a span:first-child{width:auto!important}
 #ss-menu nav a span:last-child,.ss-menu-nav a span:last-child{font-size:24px!important}
 .kv-in{padding-top:70px!important;padding-bottom:112px!important;padding-left:16px!important;padding-right:16px!important}
 .kv-badge{width:76px!important;height:76px!important;font-size:11px!important}
 .kv-en{font-size:18px!important}
 .kv-lead{font-size:13.5px!important;line-height:1.65!important}
 .kv .ss-btn{padding:11px 16px!important;font-size:14px!important}
 .kv .ss-in[style*="margin-top"]{gap:10px!important}
}
@media (max-width:720px) and (max-height:700px){.kv-en{display:none!important}}
@media (prefers-reduced-motion: reduce){.ss-hop,.ss-float,.ss-zoom,.ss-swim,.ss-in,.ss-orbit,.ss-planet-in,.ss-rays,.ss-ama-l1,.ss-ama-l2{animation:none}}

html.ss-menu-open,html.ss-menu-open body{overflow:hidden}
#ss-menu[hidden]{display:none!important}
img{max-width:100%}
body.admin-bar .corner{top:32px!important}
body.admin-bar .hex{top:156px!important}
body.admin-bar #ss-menu{top:32px!important}
@media (max-width:782px){body.admin-bar .corner{top:46px!important}body.admin-bar .hex{top:136px!important}body.admin-bar #ss-menu{top:46px!important}}
.corner:focus-visible,.hex:focus-visible{outline:3px solid #FFD23F;outline-offset:-6px}

/* ===== 入場ゲーム ===== */
html.ss-gate-open,html.ss-gate-open body{overflow:hidden}
#ss-gate{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;background:linear-gradient(180deg,#0A3D62 0%,#1679A8 55%,#0E5C8A 100%);color:#FFFFFF;font-family:'Zen Maru Gothic',system-ui,sans-serif;font-weight:700;transition:opacity .6s ease,background .8s ease;overflow:hidden}
#ss-gate.is-clean{background:linear-gradient(180deg,#1679A8 0%,#2BA6DE 55%,#1679A8 100%)}
#ss-gate.is-clean .ss-gate-skip{display:none}
#ss-gate.is-out{opacity:0;pointer-events:none}
.ss-gate-head{position:relative;z-index:2;text-align:center;padding:28px 20px 8px}
.ss-gate-logo{height:44px;width:auto;background:#FFFFFF;border-radius:14px;padding:8px 14px;box-sizing:content-box}
.ss-gate-title{margin:16px 0 0;font-family:'Dela Gothic One',sans-serif;font-weight:400;font-size:34px;line-height:1.3}
.ss-gate-lead{margin:8px 0 0;font-size:16px;line-height:1.7}
.ss-gate-count{display:inline-block;margin:12px 0 0;padding:6px 18px;border-radius:999px;background:#FFD23F;color:#0A3D62;font-weight:900}
.ss-gate-sea{position:relative;flex:1 1 auto;min-height:240px}
.ss-gate-weed{position:absolute;left:0;right:0;bottom:0;height:46px;background:radial-gradient(18px 30px at 6% 100%,#1A8A2E 98%,transparent),radial-gradient(14px 26px at 18% 100%,#22A33A 98%,transparent),radial-gradient(20px 34px at 82% 100%,#1A8A2E 98%,transparent),radial-gradient(12px 22px at 92% 100%,#22A33A 98%,transparent);opacity:.9}
.ss-fish,.ss-trash,.ss-ama{position:absolute;background:none;border:0;padding:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ss-fish{left:0;top:var(--y);animation:ss-gswim var(--d) linear infinite;animation-delay:var(--delay);animation-direction:reverse}
.ss-fish-r{animation-direction:normal}
.ss-fish-r svg{transform:scaleX(-1)}
.ss-fish.is-shy svg{animation:ss-gshy .5s ease}
.ss-trash{transform:translate(-50%,-50%);animation:ss-gbob 2.8s ease-in-out infinite;filter:drop-shadow(0 4px 0 rgba(0,0,0,.25));min-width:56px;min-height:56px}
.ss-trash:hover{filter:drop-shadow(0 0 10px #FFD23F)}
.ss-trash:focus-visible,.ss-fish:focus-visible{outline:3px solid #FFD23F;outline-offset:2px;border-radius:12px}
.ss-trash.is-got{animation:ss-ggot .5s ease forwards}
.ss-gate-foot{position:relative;z-index:2;text-align:center;padding:10px 20px 28px;min-height:120px}
.ss-gate-msg{margin:0;min-height:1.7em;font-size:16px}
.ss-gate-enter{margin-top:8px;font:inherit;font-weight:900;font-size:17px;color:#0A3D62;background:#FFD23F;border:0;border-radius:999px;padding:14px 40px;min-height:48px;cursor:pointer;box-shadow:0 5px 0 #062A45;animation:ss-hop 1.6s ease-in-out infinite}
.ss-gate-skip{display:block;margin:12px auto 0;font:inherit;font-size:13px;color:#FFFFFF;background:none;border:0;text-decoration:underline;padding:10px;cursor:pointer;opacity:.85}
@keyframes ss-gswim{from{transform:translateX(-90px)}to{transform:translateX(calc(100vw + 20px))}}
@keyframes ss-gbob{0%,100%{transform:translate(-50%,-50%) rotate(-8deg)}50%{transform:translate(-50%,calc(-50% - 10px)) rotate(8deg)}}
@keyframes ss-ggot{0%{transform:translate(-50%,-50%) scale(1)}40%{transform:translate(-50%,-80%) scale(1.3)}100%{transform:translate(-50%,-160%) scale(0);opacity:0}}
@keyframes ss-gshy{0%,100%{transform:none}25%{transform:translateY(-6px) rotate(-12deg)}75%{transform:translateY(4px) rotate(10deg)}}
@media (max-width:720px){.ss-gate-title{font-size:28px}.ss-gate-head{padding-top:22px}}
@media (prefers-reduced-motion: reduce){.ss-fish,.ss-trash,.ss-gate-enter,.ss-ama,.ss-ama g{animation:none}.ss-trash.is-got{animation:none;opacity:0}}

.ss-ama{left:0;top:var(--y);animation:ss-gama var(--d) linear infinite;animation-delay:var(--delay)}
.ss-ama svg{display:block}
.ss-ama-l1,.ss-ama-l2{transform-box:view-box;transform-origin:86px 27px;animation:ss-kick .7s ease-in-out infinite alternate}
.ss-ama-l2{animation-delay:-.35s}
.ss-ama:focus-visible{outline:3px solid #FFD23F;outline-offset:2px;border-radius:12px}
@keyframes ss-gama{0%{transform:translate(calc(100vw + 20px),0)}50%{transform:translate(45vw,-14px)}100%{transform:translate(-170px,0)}}
@keyframes ss-kick{from{transform:rotate(-9deg)}to{transform:rotate(9deg)}}