:root{--main:#BEB3EF;--deep:#8E73C8;--soft:#F7F5FD;--ink:#222;--muted:#6f6a75;--line:rgba(142,115,200,.22);--shadow:0 18px 45px rgba(142,115,200,.16);--radius:28px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Yu Mincho","Hiragino Mincho ProN",serif;background:#fff;line-height:1.8}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.site-header{position:fixed;top:0;left:0;width:100%;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:24px 6vw;transition:.35s;background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,0));backdrop-filter:blur(8px)}.site-header.scrolled,.site-header.solid{padding:14px 6vw;background:rgba(255,255,255,.88);box-shadow:0 8px 28px rgba(70,52,100,.08)}.brand-logo{width:180px;height:auto}.global-nav{display:flex;gap:38px;font-size:15px;font-weight:700}.global-nav a{position:relative}.global-nav a::after{content:"";position:absolute;left:0;bottom:-10px;width:0;height:3px;background:var(--main);transition:.3s}.global-nav a:hover::after{width:100%}.menu-btn{display:none;background:none;border:0}.hero{min-height:720px;height:100vh;position:relative;overflow:hidden;display:flex;align-items:center;padding:120px 9vw 70px}.hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.84) 0%,rgba(255,255,255,.55) 34%,rgba(255,255,255,.05) 74%),url('../images/hero.jpg') center/cover no-repeat;transform:scale(1.02)}.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 25%,rgba(190,179,239,.33),transparent 18%),radial-gradient(circle at 95% 10%,rgba(255,255,255,.75),transparent 28%)}.hero-glass{position:relative;z-index:1;width:min(560px,92vw);padding:46px 52px;border:1px solid rgba(255,255,255,.7);border-radius:var(--radius);background:rgba(255,255,255,.54);box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(1.12)}.eyebrow{margin:0 0 18px;color:var(--deep);font-size:18px;font-style:italic;letter-spacing:.08em}.hero h1{margin:0;font-size:clamp(38px,5vw,66px);line-height:1.36;font-weight:500;letter-spacing:.08em}.hero h1 span{color:var(--deep)}.hero-line{width:62px;height:2px;background:var(--deep);margin:26px 0}.lead{font-size:16px;margin:0;color:#2d2931}.company-sign{font-size:24px;letter-spacing:.09em;margin:25px 0 0}.company-sign strong{color:var(--deep);font-weight:500}.scroll-down{position:absolute;z-index:3;left:50%;bottom:28px;transform:translateX(-50%);font-size:12px;letter-spacing:.18em;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.25);text-align:center}.scroll-down span{display:block;width:16px;height:16px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg);margin:7px auto 0;animation:scroll 1.7s infinite}.section{padding:78px 7vw}.section-title{text-align:center;margin-bottom:44px}.section-title p,.company-info .sub{text-transform:uppercase;color:var(--deep);letter-spacing:.14em;font-size:14px;margin:0}.section-title h2,.company-info h2{font-size:32px;letter-spacing:.18em;margin:0;font-weight:500}.section-title h2::before,.section-title h2::after{content:"";display:inline-block;width:44px;height:2px;background:var(--main);vertical-align:middle;margin:0 20px}.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;max-width:1160px;margin:auto}.service-card{overflow:hidden;border-radius:22px;background:#fff;box-shadow:var(--shadow);border:1px solid rgba(190,179,239,.22);transition:.35s}.service-card:hover{transform:translateY(-8px);box-shadow:0 24px 58px rgba(142,115,200,.22)}.service-image{height:260px;overflow:hidden}.service-image img{width:100%;height:100%;object-fit:cover;transition:.5s}.service-card:hover img{transform:scale(1.05)}.service-body{text-align:center;padding:0 42px 42px;margin-top:-38px;position:relative}.icon{width:78px;height:78px;border-radius:50%;margin:0 auto 18px;background:linear-gradient(135deg,var(--main),var(--deep));color:#fff;display:grid;place-items:center;font-size:38px;box-shadow:0 12px 24px rgba(142,115,200,.25)}.service-body h3{font-size:28px;letter-spacing:.12em;margin:0}.en{color:var(--deep);font-style:italic;margin:0 0 16px}.service-body p:last-child{font-size:15px;margin:0}.company-section{background:linear-gradient(90deg,var(--soft),#fff);overflow:hidden}.company-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:54px;max-width:1180px;margin:auto;padding:76px 7vw}.company-list{margin:24px 0 0}.company-list div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--line)}.company-list dt{font-weight:700;color:#4b4550}.company-list dd{margin:0}.company-photo{border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}.company-photo img{height:360px;width:100%;object-fit:cover}.contact{padding-top:68px}.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:1080px;margin:auto}.contact-card{position:relative;display:grid;grid-template-columns:82px 1fr;align-items:center;column-gap:20px;min-height:136px;padding:28px 36px;border-radius:18px;background:#fff;border:1px solid rgba(190,179,239,.24);box-shadow:0 12px 32px rgba(142,115,200,.12);transition:.3s}.contact-card:hover{transform:translateY(-7px);box-shadow:0 22px 48px rgba(142,115,200,.22)}.contact-icon{grid-row:span 3;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--main),var(--deep));color:#fff;font-size:34px}.small{font-size:13px;color:var(--muted)}.contact-card strong{font-size:28px;font-weight:500;letter-spacing:.05em}.note{font-size:13px}.arrow{position:absolute;right:28px;font-size:34px;color:var(--deep)}.footer{padding:36px 7vw;text-align:center;background:linear-gradient(180deg,#fff,var(--soft));font-size:13px}.footer-logo{width:160px;margin:0 auto 18px}.footer nav{display:flex;gap:28px;justify-content:center;flex-wrap:wrap;margin-bottom:12px}.to-top{position:fixed;right:24px;bottom:24px;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--main),var(--deep));color:#fff;font-size:26px;box-shadow:var(--shadow);z-index:30}.reveal{opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:none}.pop.is-visible{animation:pop .85s cubic-bezier(.22,1.2,.36,1) both}.delay-1{transition-delay:.12s}.privacy{max-width:880px;margin:150px auto 80px;padding:0 6vw}.privacy h1{font-size:36px}.privacy h2{margin-top:40px;color:var(--deep)}@keyframes pop{0%{transform:translateY(42px) scale(.94);opacity:0}62%{transform:translateY(-8px) scale(1.018);opacity:1}100%{transform:translateY(0) scale(1);opacity:1}}@keyframes scroll{0%,100%{transform:translateY(0) rotate(45deg);opacity:.55}50%{transform:translateY(8px) rotate(45deg);opacity:1}}@media(max-width:900px){.site-header{padding:18px 5vw}.brand-logo{width:150px}.menu-btn{display:grid;gap:6px}.menu-btn span{display:block;width:28px;height:2px;background:#333}.global-nav{position:fixed;top:72px;right:5vw;display:none;flex-direction:column;gap:18px;background:rgba(255,255,255,.94);padding:24px;border-radius:18px;box-shadow:var(--shadow)}.global-nav.open{display:flex}.hero{height:auto;min-height:760px;padding:120px 5vw 80px;align-items:flex-end}.hero-bg{background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.86) 48%,rgba(255,255,255,.95)),url('../images/hero.jpg') center/cover no-repeat}.hero-glass{padding:30px 24px}.eyebrow{font-size:14px}.lead{font-size:14px}.company-sign{font-size:20px}.section{padding:58px 5vw}.section-title h2::before,.section-title h2::after{width:28px;margin:0 10px}.service-grid,.contact-grid,.company-inner{grid-template-columns:1fr}.service-image{height:210px}.company-inner{padding:58px 5vw}.company-list div{grid-template-columns:92px 1fr;font-size:14px}.company-photo img{height:260px}.contact-card{grid-template-columns:64px 1fr;padding:22px;min-height:120px}.contact-icon{width:58px;height:58px;font-size:28px}.contact-card strong{font-size:20px}.footer nav{gap:18px}.to-top{width:46px;height:46px}}



.service-card {
  transition: transform .35s ease, box-shadow .35s ease;
}

.service-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 18px 40px rgba(190,179,239,.28);
}

.service-card img {
  transition: transform .6s cubic-bezier(.22,1.4,.36,1);
}

.service-card:hover img {
  transform: scale(1.06) rotate(-1deg);
}


@keyframes poyon {
  0% { transform: translateY(30px) scale(.96); opacity: 0; }
  60% { transform: translateY(-8px) scale(1.03); opacity: 1; }
  80% { transform: translateY(3px) scale(.99); }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}

.service-card.is-visible {
  animation: poyon .8s cubic-bezier(.22,1.4,.36,1) both;
}


/* ガラスプレート */
.company-sign {
    position: relative;
    overflow: hidden;
}

/* 光 */
.company-sign::after{
    content:"";
    position:absolute;
    top:-30%;
    left:-80%;
    width:40%;
    height:160%;
    background:linear-gradient(
        115deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,.15) 40%,
        rgba(255,255,255,.95) 50%,
        rgba(255,255,255,.15) 60%,
        rgba(255,255,255,0) 100%
    );
    transform:rotate(18deg);
    pointer-events:none;
}


@keyframes glassShine{

    0%{
        left:-90%;
        opacity:0;
    }

    10%{
        opacity:1;
    }

    60%{
        left:140%;
        opacity:1;
    }

    100%{
        left:160%;
        opacity:0;
    }

}

.company-sign.shine::after{
    animation:glassShine 1.6s ease;
}



backdrop-filter: blur(12px);

border-radius:18px;

box-shadow:0 18px 45px rgba(0,0,0,.08);




/* ===== safety fallback: JSが読み込めない時も本文を表示 ===== */
.reveal{opacity:1;transform:none;}
html.js .reveal{opacity:0;transform:translateY(36px);}
html.js .reveal.is-visible{opacity:1;transform:none;}
html.js .pop.is-visible{animation:pop .85s cubic-bezier(.22,1.2,.36,1) both;}

/* ガラスのキラッ */
.company-photo{position:relative;}
.company-photo::after{
  content:"";
  position:absolute;
  top:-30%;
  left:-90%;
  width:42%;
  height:160%;
  background:linear-gradient(115deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 40%,rgba(255,255,255,.86) 50%,rgba(255,255,255,.18) 60%,rgba(255,255,255,0) 100%);
  transform:rotate(18deg);
  pointer-events:none;
}
.company-photo.shine::after{animation:glassShine 1.6s ease;}

.reveal,
.pop {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}