:root{
  --bg:#FDFDFD;
  --ink:#111111;
  --ink-2:#444444;
  --ink-3:#6b6b6b;
  --black:#000000;
  --approach-bg:#060A0E;
  --blue:#0074FD;
  --blue-ink:#0B63E0;
  --rule:rgba(0,0,0,.14);
  --rule-light:rgba(255,255,255,.28);

  --fv-veil-1:rgba(253,253,253,.96);
  --fv-veil-2:rgba(253,253,253,.88);
  --fv-veil-3:rgba(253,253,253,0);

  --font-jp:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic","Meiryo",sans-serif;
  --font-en:"Inter","Helvetica Neue",Arial,sans-serif;

  --pad-x:clamp(20px,5.6vw,140px);
}

@font-face{
  font-family:"Inter";
  src:url("/assets/fonts/Inter-latin.woff2") format("woff2");
  font-weight:300 700;
  font-display:swap;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-jp);
  font-size:15px;
  line-height:1.9;
  font-feature-settings:"palt";
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,dl,dd,figure{margin:0}
ul{margin:0;padding:0;list-style:none}

.wrap{margin:0 auto;padding-inline:var(--pad-x)}

.en{font-family:var(--font-en)}

.site-header{
  position:absolute;inset:0 0 auto 0;z-index:20;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:34px;
}
.logo img{height:34px;width:auto}
.global-nav{display:flex;gap:clamp(24px,3vw,44px)}
.global-nav a{
  font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--ink);
  position:relative;padding-bottom:4px;
}
.global-nav a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--ink);
  transition:width .25s ease;
}
.global-nav a:hover::after{width:100%}

.fv{
  position:relative;
  background:var(--bg) url("/assets/img/fv-top.webp") center/cover no-repeat;
  min-height:100vh;
  display:flex;align-items:center;
  padding-top:clamp(96px,10vw,120px);
  padding-bottom:clamp(64px,8vh,110px);
  overflow:hidden;
}
.fv-wave{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:block}
.fv.has-wave{background-image:none}

.fv.has-wave .fv-wave{animation:fvWaveIn 1s ease both}
@keyframes fvWaveIn{from{opacity:0}to{opacity:1}}
.fv-inner{position:relative;z-index:1;width:100%}

.fv-scroll{
  position:absolute;left:var(--pad-x);bottom:24px;z-index:2;
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  font-family:var(--font-en);font-size:11px;letter-spacing:.26em;font-weight:500;
  color:var(--ink-3);
  --cue:var(--blue);
}
.fv-scroll i{
  display:block;width:1px;height:46px;margin-left:1px;
  background:currentColor;opacity:.5;position:relative;overflow:hidden;
}

.fv-scroll i::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 0%,var(--cue) 50%,transparent 100%);
}
@media (prefers-reduced-motion:no-preference){
  .fv-scroll i::after{animation:fvScrollCue 2.4s cubic-bezier(.5,0,.5,1) infinite}
}
@keyframes fvScrollCue{
  0%{transform:translateY(-100%)}
  55%,100%{transform:translateY(100%)}
}
.fv-inner{
  display:block;
}
.fv-heading{
  font-size:clamp(36px,5.6vw,86px);
  line-height:1.2;
  letter-spacing:-.005em;
  font-weight:700;
  white-space:nowrap;
}
.fv-lead{
  margin-top:clamp(20px,2vw,26px);
  font-size:clamp(15px,1.15vw,17px);
  line-height:1.95;
  color:var(--ink);
}

.fv-heading .fv-line{display:block}
.fv-heading .fv-line > span{display:inline-block}
@media (prefers-reduced-motion:no-preference){

  .fv-heading .fv-line{animation:fvLineOpen .8s cubic-bezier(.22,.61,.36,1) both}

  .fv-heading .fv-line > span{animation:fvLineRise .8s cubic-bezier(.22,.61,.36,1) both}
  .fv-heading .fv-line:nth-child(2),
  .fv-heading .fv-line:nth-child(2) > span{animation-delay:.13s}
  .fv-lead{animation:fvLeadIn .7s ease .4s both}
}
@keyframes fvLineOpen{
  from{clip-path:inset(-32% -8% 100% -8%)}
  to{clip-path:inset(-32% -8% -32% -8%)}
}
@keyframes fvLineRise{
  from{transform:translateY(.2em);opacity:0;filter:blur(7px)}
  to{transform:none;opacity:1;filter:blur(0)}
}
@keyframes fvLeadIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}

.fv-split{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  color:#fff;
}
.fv-panel{
  position:relative;
  min-height:clamp(360px,29vw,420px);
  padding:clamp(48px,5.5vw,72px) var(--pad-x) clamp(52px,5.5vw,72px);
  display:flex;flex-direction:column;justify-content:center;
}

.fv-panel--media{
  background:var(--black) url("/assets/img/fv-media.webp?v=5") center/cover no-repeat;
}

.fv-panel--media::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(3,6,12,.32) 0%,rgba(3,6,12,.20) 55%,rgba(3,6,12,.02) 100%);
  pointer-events:none;
}

.fv-panel--talent{
  background:#2b2f36 url("/assets/img/fv-talent.webp?v=4") center/cover no-repeat;
  margin-left:-16%;
  z-index:2;
  clip-path:polygon(17% 0,100% 0,100% 100%,3% 100%);
  padding-left:calc(17% + var(--pad-x));
}
.fv-panel--talent::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(3,6,12,.42) 0%,rgba(3,6,12,.30) 42%,rgba(3,6,12,.18) 72%,rgba(3,6,12,.03) 100%);
  pointer-events:none;
}
.fv-panel-inner{position:relative;z-index:1;max-width:480px}
.panel-heading{
  font-size:clamp(26px,2.3vw,34px);font-weight:700;line-height:1.3;
  text-shadow:0 1px 12px rgba(3,6,12,.85);
}
.panel-text{
  margin:22px 0 30px;font-size:15px;line-height:1.95;color:rgba(255,255,255,.96);

  text-shadow:0 1px 10px rgba(3,6,12,.9),0 0 3px rgba(3,6,12,.6);
}
.fv-panel .link-arrow{text-shadow:0 1px 10px rgba(3,6,12,.9)}

.link-arrow{
  display:inline-flex;align-items:center;gap:22px;
  font-size:15px;font-weight:700;letter-spacing:.02em;
  padding-bottom:10px;border-bottom:1px solid currentColor;
}
.link-arrow .arrow{
  font-family:var(--font-en);font-weight:400;
  transition:transform .25s ease;
}
.link-arrow:hover .arrow{transform:translateX(6px)}
.link-arrow--small{font-size:13px;gap:14px;padding-bottom:6px}
.link-arrow--light{color:#fff;border-color:rgba(255,255,255,.75);font-size:17px}
.link-arrow--light .arrow{color:var(--blue)}
.section--business .link-arrow .arrow{color:var(--blue-ink)}

.section{padding:clamp(80px,9vw,130px) 0}
.section-label{
  font-family:var(--font-en);
  font-size:12px;letter-spacing:.24em;font-weight:500;color:var(--ink-2);
  display:flex;flex-direction:column;gap:14px;margin-bottom:22px;
}
.section-label::after{content:"";display:block;width:44px;height:1px;background:currentColor;opacity:.6}
.section-heading{
  font-size:clamp(32px,3.2vw,46px);font-weight:700;line-height:1.3;letter-spacing:-.005em;
}
.section-heading--long{font-size:clamp(28px,3vw,44px);line-height:1.5}

.section--domain{background:#05070c;color:#fff}
.section--domain .section-label{color:rgba(255,255,255,.7)}
.section--domain .section-heading{color:#fff}
.ring{margin-top:clamp(20px,2vw,28px);display:flex;flex-direction:column;align-items:center}
.ring-stage{position:relative;width:min(100%,960px);aspect-ratio:1/1}
.ring-img{

  position:absolute;inset:8%;width:84%;height:84%;object-fit:contain;

  mix-blend-mode:screen;
}

.ring-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ring-lines circle{fill:none;stroke:rgba(255,255,255,.28);stroke-width:.28}
.ring-lines line{stroke:rgba(255,255,255,.34);stroke-width:.28}
.ring-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:var(--font-en);font-size:clamp(14px,1.5vw,19px);letter-spacing:.3em;font-weight:600;color:#fff;
  text-indent:.3em;
}
.ring-label{
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;white-space:nowrap;

  padding:14px 24px;
  background:radial-gradient(58% 60% at 50% 50%,
    rgba(5,7,12,.94) 0%, rgba(5,7,12,.72) 58%, rgba(5,7,12,0) 100%);
}

.ring-label--media i{order:3}
.ring-label--media b{order:1}
.ring-label--media em{order:2}
.ring-label i{
  display:block;width:9px;height:9px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 5px rgba(5,7,12,.85), 0 0 18px 4px rgba(47,140,255,.55);
}
.ring-label b{
  font-size:clamp(16px,1.55vw,21px);font-weight:700;color:#fff;line-height:1.4;
  text-shadow:0 2px 14px rgba(5,7,12,.95),0 0 6px rgba(5,7,12,.9);
}
.ring-label b span{display:block;font-size:max(12px,.62em);font-weight:500;letter-spacing:.08em;color:rgba(255,255,255,.72)}
.ring-label em{

  font-family:var(--font-en);font-style:normal;font-size:12px;letter-spacing:.18em;font-weight:500;
  color:rgba(255,255,255,.74);text-shadow:0 2px 10px rgba(5,7,12,.95);
}
.ring-label--media{left:50%;top:2.5%}
.ring-label--talent{left:88.5%;top:73%}
.ring-label--ad{left:11.5%;top:73%}

.ring-caption{
  align-self:flex-start;max-width:660px;margin-bottom:clamp(8px,1.6vw,20px);
  font-size:15px;line-height:1.95;color:rgba(255,255,255,.78);
}

.section--company{background:#F6F8FB}
.company-table{
  margin-top:clamp(32px,3.5vw,48px);
  border-top:1px solid var(--rule);
  max-width:1040px;
}
.company-table .row{
  display:grid;grid-template-columns:200px 1fr;gap:24px;
  padding:22px 0;border-bottom:1px solid var(--rule);
}
.company-table dt{font-weight:700;font-size:15px}
.company-table dd{font-size:15px;line-height:1.85}
.company-table dd a{border-bottom:1px solid var(--ink);padding-bottom:1px}

.section--contact{
  position:relative;
  overflow:hidden;
  background-color:#04060a;
  background-image:

    radial-gradient(134% 108% at 50% 126%, rgba(112,176,255,.56) 0%, rgba(28,92,220,.30) 34%, rgba(6,14,34,0) 68%),

    radial-gradient(84% 70% at 92% 82%, rgba(166,206,255,.44) 0%, rgba(24,76,196,.18) 47%, rgba(5,9,16,0) 78%),

    radial-gradient(60% 84% at 0% 102%, rgba(64,132,255,.32) 0%, rgba(6,12,24,0) 70%),
    linear-gradient(180deg,#04060a 0%,#050810 38%,#061530 100%);
  color:#fff;
  padding:clamp(72px,8vw,100px) 0 clamp(80px,9vw,120px);
}
.contact-streak{
  position:absolute;left:0;right:0;bottom:0;width:100%;height:82%;
  display:block;pointer-events:none;z-index:0;
}
.section--contact .wrap{position:relative;z-index:1}
.section-heading--contact{font-size:clamp(28px,2.6vw,38px)}
.contact-links{display:flex;flex-wrap:wrap;gap:clamp(32px,5vw,72px);margin-top:36px}

.site-footer{background:var(--bg);border-top:1px solid var(--rule)}
.footer-inner{display:flex;align-items:center;gap:28px;padding-top:26px;padding-bottom:26px}
.footer-logo{height:24px;width:auto}
.copyright{font-family:var(--font-en);font-size:12px;letter-spacing:.06em;color:var(--ink-2);flex:1}
.to-top{font-size:12px;display:inline-flex;gap:10px;align-items:center;color:var(--ink-2)}
.to-top .arrow{font-family:var(--font-en)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .link-arrow .arrow,.global-nav a::after{transition:none}
}

@media (max-width:1024px){
  .fv-inner{grid-template-columns:1fr}
  .fv-inner > *{min-width:0}
}
@media (max-width:860px){
  .header-inner{padding-top:22px}
  .logo img{height:26px}
  .global-nav a{font-size:13px}
  .fv{min-height:100svh;padding-top:104px;background-position:right bottom;background-size:auto 100%}
  .fv::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,var(--fv-veil-1) 0%,var(--fv-veil-2) 58%,var(--fv-veil-3) 100%);
    pointer-events:none;
  }
  .fv-heading{font-size:clamp(30px,8.9vw,40px);white-space:normal}
  .fv-scroll{bottom:16px;font-size:10px;gap:9px}
  .fv-scroll i{height:34px}
  .fv-lead br{display:none}
  .fv-split{grid-template-columns:1fr}
  .fv-panel{min-height:0;padding:56px var(--pad-x) 60px;justify-content:flex-start}
  .fv-panel--talent{margin-left:0;clip-path:none;padding-left:var(--pad-x)}

  .fv-panel--talent{background-position:70% center}
  .fv-panel--media::before{
    background:linear-gradient(180deg,rgba(3,6,12,.44) 0%,rgba(3,6,12,.36) 72%,rgba(3,6,12,.32) 100%);
  }
  .fv-panel--talent::before{
    background:linear-gradient(180deg,rgba(3,6,12,.58) 0%,rgba(3,6,12,.50) 72%,rgba(3,6,12,.46) 100%);
  }
  .ring-stage{width:100%;margin-top:40px}

  .ring-label{padding:8px 14px}
  .ring-label b{font-size:14px}
  .ring-label b span{font-size:12px}
  .ring-label em{font-size:12px;letter-spacing:.14em}
  .ring-label i{width:7px;height:7px;box-shadow:0 0 0 4px rgba(5,7,12,.85),0 0 12px 3px rgba(47,140,255,.5)}
  .ring-caption br{display:none}
  .ring-label--talent{left:82%}
  .ring-label--ad{left:18%}
  .company-table .row{grid-template-columns:1fr;gap:6px;padding:18px 0}
  .company-table dt{font-size:13px;color:var(--ink-2)}
  .contact-streak{height:62%}
  .contact-links{flex-direction:column;gap:28px}
  .link-arrow--light{font-size:15px}
  .footer-inner{flex-wrap:wrap;gap:14px}
  .copyright{flex:1 0 100%;order:3}
  .to-top{order:2;margin-left:auto}
}

@media (max-width:400px){
  .logo img{height:24px}
  .global-nav{gap:16px}
  .global-nav a{font-size:12px;white-space:nowrap}
}
@media (max-width:360px){
  .fv-heading{font-size:30px}
  .panel-heading{font-size:24px}
  .global-nav{gap:13px}
  .global-nav a{font-size:11px;letter-spacing:.02em}
}

:root[data-fv="dark"]{

  --fv-veil-1:rgba(5,7,12,.94);
  --fv-veil-2:rgba(5,7,12,.86);
  --fv-veil-3:rgba(5,7,12,0);
}
:root[data-fv="dark"] .fv{background-color:#05070c}

:root[data-fv="dark"] .fv{background-image:none}
:root[data-fv="dark"] .fv:not(.has-wave){
  background-image:radial-gradient(120% 95% at 78% 42%,rgba(24,58,112,.55) 0%,rgba(9,14,26,.35) 42%,rgba(5,7,12,0) 72%);
  background-position:center;
  background-size:cover;
}
:root[data-fv="dark"] body{background:#05070c}
:root[data-fv="dark"] .fv .fv-heading{color:#F7F8FA}
:root[data-fv="dark"] .fv .fv-lead{color:rgba(247,248,250,.86)}
:root[data-fv="dark"] .site-header .logo img{filter:invert(1) brightness(1.6)}
:root[data-fv="dark"] .global-nav a{color:#F7F8FA}
:root[data-fv="dark"] .global-nav a::after{background:#F7F8FA}
:root[data-fv="dark"] .fv-scroll{color:rgba(247,248,250,.5);--cue:#cfe4ff}
