/* 色・文字の値は DESIGN.md が正本。Lism のトークンへ上書きして使う */
:root{--brand:#92C976;--accent:#EF9FC3;--text:#333333;--base:#FFF9F2;--ff--base:"Noto Sans JP",sans-serif;
--ink:#333333;--muted:#6F6A68;--deep:#476935;--sakura:#EF9FC3;--sakura-soft:#FDF0F6;--green:#92C976;--green-soft:#EFF2DF;--canvas:#FFF9F2;--hairline:#E4E9E4}
body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--ff--base);font-size:16px;line-height:1.9;overflow-x:hidden}
.wrap{max-width:1080px;margin-inline:auto;padding-inline:24px;box-sizing:border-box}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
h1,h2,h3{font-weight:500}
.site-head{position:relative;z-index:3;background:var(--canvas);border-bottom:1px solid var(--hairline);padding-block:12px}
.logo{display:block;height:40px;width:auto;max-width:100%}
.bar{display:block;width:32px;height:3px;border-radius:9999px;background:var(--sakura)}
.hero{position:relative;overflow:hidden}
.hero-in{display:flex;flex-direction:column;gap:32px;padding-block:48px 56px}
.hero-text{position:relative;z-index:2}
h1{font-size:28px;line-height:1.4;letter-spacing:.02em}
.dept{font-weight:700;color:var(--deep)}
.mark-box{position:relative;flex:0 0 auto;width:220px;height:220px;margin-inline:auto}
.logoMark{display:block;width:100%;height:100%;overflow:visible}
.sec{padding-block:56px}
.sec-green{background:var(--green-soft)}
.head-c{align-items:center;text-align:center}
h2{font-size:24px;line-height:1.4}
h3{font-size:20px;line-height:1.4}
.cards{display:grid;gap:24px;grid-template-columns:1fr;padding:0;list-style:none}
.card{min-width:0;box-sizing:border-box;background:#fff;border:1px solid var(--hairline);border-radius:24px;box-shadow:0 4px 16px rgba(239,159,195,.22);padding:24px}
.tag{display:inline-block;padding:2px 14px;border-radius:9999px;background:var(--sakura-soft);font-size:14px;line-height:1.7}
.cond{border-top:1px solid var(--hairline);padding-top:16px}
.cond-label{font-size:14px;line-height:1.7;color:var(--muted)}
.timeline{list-style:none;padding:0 0 0 8px}
.timeline li{position:relative;box-sizing:border-box;border-left:2px solid var(--green);padding:0 0 32px 24px}
.timeline li:last-child{border-left-color:transparent}
.timeline li::before{content:"";position:absolute;left:-9px;top:4px;width:16px;height:16px;border-radius:9999px;background:var(--green)}
.timeline li:nth-child(2)::before{box-sizing:border-box;background:var(--canvas);border:2px solid var(--green)}
.when{font-size:20px;line-height:1.4;font-weight:700;color:var(--deep)}
.facts{box-sizing:border-box;background:#fff;border:1px solid var(--hairline);border-radius:24px;box-shadow:0 4px 16px rgba(239,159,195,.22);padding:8px 24px}
.facts>div{padding:16px 0;border-bottom:1px solid var(--hairline)}
.facts>div:last-child{border-bottom:0}
.facts dt{font-weight:700}
.apply{background:var(--green);text-align:center}
.foot-depts{display:flex;flex-direction:column}
.foot-dept{min-width:0}
.foot-g{background:var(--green-soft);border-top:4px solid var(--green)}
.foot-p{background:var(--sakura-soft);border-top:4px solid var(--sakura)}
.foot-dept>div{padding:32px 24px;box-sizing:border-box}
.foot-name{font-size:20px;line-height:1.4;font-weight:500}
.foot-dept ul{padding:0 0 0 1.2em}
.small{font-size:14px;line-height:1.7}
.foot-base{padding-block:32px}
.foot-sub{color:var(--muted)}
.copy{font-size:12.5px;line-height:1.5;color:var(--muted)}
.ring-pc{display:none}
@media (min-width:768px){
 .sec{padding-block:96px}
 h2{font-size:30px}
 .logo{height:48px}
 .cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}
 .cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}
 .card{padding:32px 28px}
 .side{display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px 48px;align-items:start}
 .foot-depts{flex-direction:row}
 .foot-dept{flex:1 1 320px}
 .foot-g>div{max-width:540px;margin-left:auto;padding:48px 24px}
 .foot-p>div{max-width:540px;margin-right:auto;padding:48px 24px}
 .timeline li{padding-left:32px}
 .facts{padding:8px 32px}
 .facts>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:4px 24px}
}
@media (min-width:1000px){
 h1{font-size:40px}
 .hero-in{flex-direction:row;align-items:center;justify-content:space-between;gap:48px;min-height:639px;padding-block:0}
 .hero-text{flex:1 1 420px;min-width:0}
 .mark-box{width:400px;height:400px;margin:0}
 .ring-pc{display:block}
 .ring-sp{display:none}
}
/* --- さくら演出 --- */

.ringWrap{position:absolute;left:50%;top:50%;width:0;height:0}
.pt{position:absolute;left:0;top:0;opacity:0;offset-rotate:auto;will-change:offset-distance,opacity;animation:ptFlow 20000ms linear infinite both}
.pt i{display:block;animation:ptFlip var(--f) ease-in-out infinite alternate}
.pt svg{display:block;overflow:visible;margin:calc(var(--w)/-2)}
@keyframes p0{0%,0.0%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}1.75%{opacity:.95}15.23%{opacity:.95}18.78%,100%{offset-distance:100%;opacity:0}}@keyframes p1{0%,0.59%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}2.34%{opacity:.95}15.48%{opacity:.95}18.67%,100%{offset-distance:100%;opacity:0}}@keyframes p2{0%,1.5%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}3.25%{opacity:.95}16.33%{opacity:.95}20.02%,100%{offset-distance:100%;opacity:0}}@keyframes p3{0%,1.6%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}3.35%{opacity:.95}15.62%{opacity:.95}19.36%,100%{offset-distance:100%;opacity:0}}@keyframes p4{0%,2.53%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}4.28%{opacity:.95}17.23%{opacity:.95}20.39%,100%{offset-distance:100%;opacity:0}}@keyframes p5{0%,2.83%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}4.58%{opacity:.95}16.64%{opacity:.95}20.93%,100%{offset-distance:100%;opacity:0}}@keyframes p6{0%,4.13%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}5.88%{opacity:.95}19.78%{opacity:.95}22.99%,100%{offset-distance:100%;opacity:0}}@keyframes p7{0%,4.4%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}6.15%{opacity:.95}18.4%{opacity:.95}22.2%,100%{offset-distance:100%;opacity:0}}@keyframes p8{0%,4.91%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}6.66%{opacity:.95}19.89%{opacity:.95}22.83%,100%{offset-distance:100%;opacity:0}}@keyframes p9{0%,5.4%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}7.15%{opacity:.95}20.25%{opacity:.95}23.39%,100%{offset-distance:100%;opacity:0}}@keyframes p10{0%,5.8%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}7.55%{opacity:.95}21.04%{opacity:.95}24.94%,100%{offset-distance:100%;opacity:0}}@keyframes p11{0%,6.8%{offset-distance:0%;opacity:0;animation-timing-function:cubic-bezier(.3,.15,.7,.9)}8.55%{opacity:.95}21.39%{opacity:.95}25.06%,100%{offset-distance:100%;opacity:0}}
@keyframes ptFlip{from{transform:rotate(-24deg) scaleX(1)}to{transform:rotate(30deg) scaleX(.5)}}
.logoAnim{animation-duration:20000ms;animation-iteration-count:infinite;animation-fill-mode:both}
.bl{transform-box:view-box;transform-origin:537px 133px}
.logoMark{animation:logoLoop 20000ms linear infinite both}
@keyframes logoLoop{0%,93%{opacity:1}100%{opacity:0}}
.breeze{position:absolute;inset:0;pointer-events:none;animation:breezeLoop 20000ms linear infinite both}
@keyframes breezeLoop{0%,29.5%{opacity:0}42.5%,93%{opacity:1}100%{opacity:0}}
.bz{position:absolute;display:block;animation:bzGo var(--t) linear infinite both}
.bz i{display:block;animation:bzSway var(--u) ease-in-out infinite alternate}
.bz svg{display:block;overflow:visible}
@keyframes bzGo{0%{transform:none;opacity:0}10%{opacity:var(--o)}90%{opacity:var(--o)}100%{transform:translate(var(--dx),var(--dy));opacity:0}}
@keyframes bzSway{from{transform:translate(0,-10px) rotate(var(--a)) scaleX(1)}to{transform:translate(0,10px) rotate(var(--b)) scaleX(.7)}}
@keyframes k1{0%,10.75%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,.05,.35,1)}15.0%,100%{stroke-dashoffset:0}}@keyframes k2{0%,13.0%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,.05,.35,1)}13.9%,100%{stroke-dashoffset:0}}@keyframes k3{0%,13.5%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,.05,.35,1)}17.0%,100%{stroke-dashoffset:0}}@keyframes k4{0%,15.0%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,.05,.35,1)}18.75%,100%{stroke-dashoffset:0}}@keyframes k5{0%,6.75%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,.05,.35,1)}9.5%,100%{stroke-dashoffset:0}}@keyframes k6{0%,19.5%{transform:translate(-24px,-115px) rotate(-30deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}20.1%{opacity:1}22.3%,100%{transform:none;opacity:1}}@keyframes k7{0%,20.0%{transform:translate(94px,-50px) rotate(28deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}20.6%{opacity:1}22.8%,100%{transform:none;opacity:1}}@keyframes k8{0%,20.5%{transform:translate(143px,6px) rotate(48deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}21.1%{opacity:1}23.3%,100%{transform:none;opacity:1}}@keyframes k9{0%,21.0%{transform:translate(-96px,-127px) rotate(-46deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}21.6%{opacity:1}23.8%,100%{transform:none;opacity:1}}@keyframes k10{0%,21.5%{transform:translate(-170px,-120px) rotate(-62deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}22.1%{opacity:1}24.3%,100%{transform:none;opacity:1}}@keyframes k11{0%,22.0%{transform:translate(97px,2px) rotate(70deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}22.6%{opacity:1}24.8%,100%{transform:none;opacity:1}}@keyframes k12{0%,22.6%{transform:translate(167px,43px) rotate(-55deg) scale(.85);opacity:0;animation-timing-function:cubic-bezier(.22,.61,.36,1)}23.2%{opacity:1}25.4%,100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.ringWrap,.breeze{display:none}.logoAnim,.logoMark{animation:none}}

.pt,.logoAnim{animation-iteration-count:1}
.logoMark{animation:none}
.breeze{animation:breezeOnce 8.5s linear both}
@keyframes breezeOnce{0%,69%{opacity:0}100%{opacity:1}}
@supports not (offset-path:path("M0 0")){.ringWrap{display:none}}
/* Lism のリセットで幅0の親に潰されないように */
.pt svg,.bz svg{max-width:none}
/* 同じ訪問の2回目以降は演出なし */
.seen .ringWrap{display:none}
.seen .logoAnim{animation:none}
.seen .breeze{animation:none}
@media (prefers-reduced-motion:reduce){.breeze{animation:none;display:none}}
