:root{
  --main:#BEB3EF;
  --deep:#8E73C8;
  --soft:#F7F5FD;
  --ink:##2F2B2B;
  --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;}

/* Header */
.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);
  -webkit-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 */
.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') 58% 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{
  background:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border:none;
  box-shadow:none;
  padding:0;
  max-width:470px;
  position:relative;
  z-index:2;
}
.eyebrow{
  margin:0 0 18px;
  color:var(--deep);
  font-size:18px;
  font-style:normal;
  letter-spacing:.08em;
}
.hero h1{
  margin:0;
  font-size:clamp(28px,4vw,54px);
  line-height:1.36;
  font-weight:400;
  letter-spacing:.05em;
}
.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:18px;
  transform:translateX(-50%);

  display:flex;
  flex-direction:column;
  align-items:center;

  font-size:13px;
  letter-spacing:.25em;
  color:#8E73C8;
  text-shadow:none;
  text-align:center;
}

.scroll-down span{
  display:block;
  width:16px;
  height:16px;
  border-right:2px solid  #8E73C8;
  border-bottom:2px solid  #8E73C8;
  transform:rotate(45deg);
  margin:7px auto 0;
  animation:scroll 1.7s infinite;
}

/* Common */
.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 */
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,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: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-image{height:260px;overflow:hidden;}
.service-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1.4,.36,1);}
.service-card:hover img{transform:scale(1.06) rotate(-1deg);}
.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:normal;margin:0 0 16px;}
.service-body p:last-child{font-size:15px;margin:0;}

/* Company */
.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{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);}
.company-photo img{height:360px;width:100%;object-fit:cover;}
.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;}

/* Contact */
.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 / Privacy */
.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;}
.privacy{max-width:880px;margin:150px auto 80px;padding:0 6vw;}
.privacy h1{font-size:36px;}
.privacy h2{margin-top:40px;color:var(--deep);}

/* Animation */
.reveal{opacity:1;transform:none;}
html.js .reveal{opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease;}
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;}
.service-card.is-visible{animation:poyon .8s cubic-bezier(.22,1.4,.36,1) both;}

@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;}
}
@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;}
}
@keyframes glassShine{
  0%{left:-90%;opacity:0;}
  10%{opacity:1;}
  60%{left:140%;opacity:1;}
  100%{left:160%;opacity:0;}
}

/* Tablet */
@media(max-width:1100px){
  .service-grid{gap:22px;}
  .service-body{padding:0 26px 34px;}
}

/* Mobile */
@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：枠なし・写真主役 */
  .hero{
    height:auto;
    min-height:660px;
    padding:110px 6vw 70px;
    align-items:flex-end;
  }
  .hero-bg{
    background:
      linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.28) 38%,rgba(255,255,255,.78) 78%,rgba(255,255,255,.95) 100%),
      url('../images/hero.jpg') 58% center/cover no-repeat !important;
  }


  .hero-glass{
    width:100%;
    max-width:none;
    padding:0 0 20px;
    margin:0;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .eyebrow{
font-size:16px;
font-style:normal;
font-weight:500;
letter-spacing:.08em;
color:var(--deep);
margin-bottom:14px;}

  .hero h1{font-size:clamp(34px,9vw,46px);line-height:1.18;letter-spacing:.06em;text-shadow:0 2px 18px rgba(255,255,255,.85);}
  .hero-line{width:58px;margin:22px 0;}
  .lead{max-width:310px;font-size:14px;line-height:2;text-shadow:0 2px 16px rgba(255,255,255,.9);}
  .company-sign{font-size:18px;margin-top:18px;}

  .section{padding:58px 5vw;}
  .section-title h2::before,
  .section-title h2::after{width:28px;margin:0 10px;}
  .service-grid{grid-template-columns:1fr;}
  .service-image{height:210px;}
  .company-inner{grid-template-columns:1fr;padding:58px 5vw;}
  .company-list div{grid-template-columns:92px 1fr;font-size:14px;}
  .company-photo img{height:260px;}
  .contact-grid{grid-template-columns:1fr;}
  .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;}
}

@media(max-width:420px){
  .hero{min-height:680px;}
  .hero h1{font-size:clamp(31px,9vw,40px);}
  .brand-logo{width:138px;}
}

.to-top{
  pointer-events:auto !important;
  z-index:9999 !important;
}

  /* Hero：枠なし・文字表示 */

.hero-glass,
.hero-glass *{
  opacity:1 !important;
  visibility:visible !important;
}