/* ===================================
   JADC コーポレートサイト - スタイルシート
   日本AI開発センター株式会社
   =================================== */

/* --- リセット & ベース --- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --black:#242623;
  --red:#DE402B;
  --white:#F2F2F2;
  --font-en:'EB Garamond',serif;
  --font-jp:'Noto Sans JP',sans-serif;
  --font-jp-heading:'Shippori Mincho',serif;
  --header-h:64px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-jp);
  background:var(--white);
  color:var(--black);
  overflow-x:hidden;
  line-height:1.8;
}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
img{max-width:100%;height:auto;display:block}
button{border:none;background:none;cursor:pointer;font:inherit}

/* --- ローディング画面（日本AI開発センター + JADC展開アニメーション） --- */
.loading-screen{
  position:fixed;inset:0;z-index:9999;
  background:var(--white);
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;
  transition:opacity .8s ease .2s;
}
.loading-screen.hide{opacity:0;pointer-events:none}

/* 日本語社名（大きく表示） */
.loading-jp-name{
  font-family:var(--font-jp-heading);
  font-size:clamp(28px, calc(48/1440*100vw), 48px);
  font-weight:600;
  letter-spacing:.12em;
  color:var(--black);
  margin-bottom:clamp(12px,calc(20/1440*100vw),20px);
  opacity:0;
  transform:translateY(20px);
  animation:jpNameIn .8s cubic-bezier(.6,0,.3,1) .1s forwards;
}
@keyframes jpNameIn{
  to{opacity:1;transform:translateY(0)}
}

/* JADC英字ロゴ（少し小さめに） */
.loading-logo-wrap{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:0;
  position:relative;
}
.loading-letter{
  font-family:var(--font-en);
  font-weight:400;
  font-size:clamp(36px, calc(72/1440*100vw), 72px);
  letter-spacing:.06em;
  color:var(--black);
  display:inline-flex;
  align-items:baseline;
  opacity:0;
  transform:translateY(20px) scale(.9);
  animation:letterIn .6s cubic-bezier(.6,0,.3,1) forwards;
}
.loading-letter:nth-child(1){animation-delay:.4s}
.loading-letter:nth-child(2){animation-delay:.55s}
.loading-letter:nth-child(3){animation-delay:.7s}
.loading-letter:nth-child(4){animation-delay:.85s}

@keyframes letterIn{
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* 展開テキスト（J→apan, A→I, D→evelopment, C→enter） */
.loading-expand{
  font-family:var(--font-en);
  font-size:clamp(12px,calc(15/1440*100vw),15px);
  font-weight:400;
  letter-spacing:.04em;
  color:rgba(36,38,35,.4);
  display:inline-block;
  max-width:0;
  overflow:hidden;
  white-space:nowrap;
  opacity:0;
  transition:max-width .7s cubic-bezier(.4,0,.2,1), opacity .4s ease;
  vertical-align:baseline;
  margin-left:1px;
}
.loading-logo-wrap.expanded .loading-expand{
  max-width:200px;
  opacity:1;
}
.loading-logo-wrap.expanded .loading-letter:nth-child(1) .loading-expand{transition-delay:.1s}
.loading-logo-wrap.expanded .loading-letter:nth-child(2) .loading-expand{transition-delay:.2s}
.loading-logo-wrap.expanded .loading-letter:nth-child(3) .loading-expand{transition-delay:.3s}
.loading-logo-wrap.expanded .loading-letter:nth-child(4) .loading-expand{transition-delay:.4s}

/* サブテキスト */
.loading-sub{
  font-family:var(--font-jp-heading);
  font-size:clamp(11px,calc(13/1440*100vw),13px);
  letter-spacing:.15em;
  color:rgba(36,38,35,.3);
  margin-top:clamp(16px,calc(24/1440*100vw),24px);
  opacity:0;
  transform:translateY(8px);
  transition:opacity .5s ease, transform .5s ease;
}
.loading-screen.show-sub .loading-sub{
  opacity:1;
  transform:translateY(0);
}

/* プログレスバー */
.loading-bar{
  width:clamp(120px,calc(200/1440*100vw),200px);
  height:2px;
  background:rgba(36,38,35,.08);
  margin-top:clamp(24px,calc(32/1440*100vw),36px);
  overflow:hidden;
  border-radius:2px;
}
.loading-bar-fill{
  width:0;height:100%;
  background:var(--red);
  border-radius:2px;
  animation:barFill 2.5s .8s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes barFill{to{width:100%}}

/* --- WebGL Canvas --- */
#webgl-canvas{
  position:fixed;inset:0;z-index:0;
  width:100%;height:100%;
  pointer-events:none;
}

/* --- カスタムカーソル --- */
.custom-cursor{
  display:none;
  position:fixed;
  width:20px;height:20px;
  border-radius:50%;
  background:var(--white);
  mix-blend-mode:exclusion;
  pointer-events:none;
  z-index:130;
  transform:translate(-50%,-50%);
  transition:width 300ms ease,height 300ms ease;
  will-change:transform;
}
@media(min-width:1024px){
  .custom-cursor{display:block}
}
.custom-cursor.hover{width:48px;height:48px}

/* --- ヘッダー（GRIT仕様: グラスモーフィズム + スライドイン + スクロール制御） --- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--header-h);
  background:rgba(242,242,242,.1);
  backdrop-filter:blur(50px);-webkit-backdrop-filter:blur(50px);
  border-bottom:1px solid rgba(36,38,35,.06);
  transform:translateY(-100%);
  transition:transform 1.2s cubic-bezier(0.6,0,0.3,1),background .4s,color .4s;
}
.site-header.visible{transform:translateY(0)}

/* ヘッダー内コンテンツ（スクロール中にスライドアウト） */
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:100%;
  padding:0 calc(40/1440*100vw);
  transition:transform 400ms ease;
}
.site-header.scrolling-down .header-inner{
  transform:translateY(-100%);
}

/* ダークセクション上でヘッダー白モード */
.site-header.header-white{
  background:rgba(36,38,35,.1);
  backdrop-filter:blur(50px);-webkit-backdrop-filter:blur(50px);
  border-bottom-color:rgba(242,242,242,.1);
  color:var(--white);
}
.site-header.header-white .header-logo a,
.site-header.header-white .nav-link{color:var(--white)}
.site-header.header-white .hamburger span{background:var(--white)}

/* 旧dark-mode互換（下層ページ用） */
.site-header.dark-mode{
  background:rgba(36,38,35,.72);
  border-bottom-color:rgba(242,242,242,.1);
  color:var(--white);
}
.site-header.dark-mode .header-logo a,
.site-header.dark-mode .nav-link{color:var(--white)}
.site-header.dark-mode .hamburger span{background:var(--white)}

.header-logo a{
  display:inline-flex;align-items:center;
  font-family:var(--font-jp-heading);
  font-size:clamp(13px, calc(16/1440*100vw), 16px);
  font-weight:600;letter-spacing:.06em;
}
.header-logo img{
  display:block;
  height:34px;width:auto;
  transition:filter .4s;
}
@media(max-width:767px){
  .header-logo a{font-size:12px;letter-spacing:.03em}
  .header-logo img{height:28px}
}
/* ダークセクション上ではロゴを白く反転 */
.site-header.header-white .header-logo img,
.site-header.dark-mode .header-logo img{
  filter:brightness(0) invert(1);
}
.header-nav{display:none}
@media(min-width:768px){
  .header-nav{display:flex;align-items:center;gap:calc(32/1440*100vw)}
}
.nav-link{
  font-size:13px;letter-spacing:.04em;
  position:relative;
  transition:opacity .3s;
}
.nav-link:hover{opacity:.6}
/* ドロップダウン */
.nav-item{position:relative}
.dropdown{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);
  min-width:180px;
  background:rgba(242,242,242,.95);
  backdrop-filter:blur(12px);
  border-radius:8px;padding:8px 0;
  opacity:0;visibility:hidden;
  transition:opacity .3s,visibility .3s;
  box-shadow:0 8px 32px rgba(0,0,0,.08);
}
.nav-item:hover .dropdown{opacity:1;visibility:visible}
.dropdown a{
  display:block;padding:8px 20px;font-size:13px;
  transition:background .2s;color:var(--black);
}
.dropdown a:hover{background:rgba(0,0,0,.04)}

/* ハンバーガー */
.hamburger{
  display:flex;flex-direction:column;justify-content:center;
  width:32px;height:32px;gap:8px;z-index:200;
}
@media(min-width:768px){.hamburger{display:none}}
.hamburger span{
  display:block;width:100%;height:1.5px;
  background:var(--black);
  transition:transform .4s,opacity .3s;
  transform-origin:center;
}
.hamburger.active span:first-child{
  transform:translateY(4.75px) rotate(12.72deg);
}
.hamburger.active span:last-child{
  transform:translateY(-4.75px) rotate(-12.72deg);
}

/* SPメニュー */
.sp-menu{
  position:fixed;inset:0;z-index:150;
  background:var(--white);
  display:flex;flex-direction:column;
  justify-content:center;align-items:center;
  gap:32px;
  opacity:0;visibility:hidden;
  transition:opacity .4s,visibility .4s;
}
.sp-menu.open{opacity:1;visibility:visible}
.sp-menu a{
  font-size:calc(28/375*100vw);
  font-family:var(--font-jp-heading);
  opacity:0;transform:translateY(20px);
  transition:opacity .4s,transform .4s;
}
.sp-menu.open a{opacity:1;transform:translateY(0)}
.sp-menu.open a:nth-child(1){transition-delay:.05s}
.sp-menu.open a:nth-child(2){transition-delay:.1s}
.sp-menu.open a:nth-child(3){transition-delay:.15s}
.sp-menu.open a:nth-child(4){transition-delay:.2s}
.sp-menu.open a:nth-child(5){transition-delay:.25s}
.sp-menu.open a:nth-child(6){transition-delay:.3s}
.sp-menu .contact-link{
  color:var(--red);font-weight:600;
}

/* --- 共通セクション --- */
.section{
  position:relative;z-index:10;
  padding:calc(120/1440*100vw) calc(40/1440*100vw);
}
@media(max-width:767px){
  .section{padding:64px 20px}
}
.section-dark{background:var(--black);color:var(--white)}

/* セクションタイトル */
.section-title{
  margin-bottom:calc(64/1440*100vw);
}
.section-title .en{
  font-family:var(--font-en);
  font-size:calc(80/1440*100vw);
  line-height:1.05;
  letter-spacing:-.02em;
  opacity:0;transform:translateY(40px);
  transition:opacity .8s,transform .8s;
}
.section-title.in-view .en{opacity:1;transform:translateY(0)}
.section-title .line{
  display:block;width:12px;height:12px;
  background:var(--red);
  margin:20px 0;
  opacity:0;
  transition:opacity .6s .3s;
}
.section-title.in-view .line{opacity:1}
.section-title .jp{
  font-family:var(--font-jp-heading);
  font-size:calc(16/1440*100vw);
  letter-spacing:.1em;
  opacity:0;transform:translateY(20px);
  transition:opacity .6s .4s,transform .6s .4s;
}
.section-title.in-view .jp{opacity:1;transform:translateY(0)}
@media(max-width:767px){
  .section-title .en{font-size:calc(48/375*100vw)}
  .section-title .jp{font-size:14px}
  .section-title{margin-bottom:40px}
}

/* --- splitLabel --- */
.split-label .char{
  display:inline-block;
  opacity:0;transform:translateY(30px);
  transition:opacity .5s,transform .5s;
}
.split-label.in-view .char{opacity:1;transform:translateY(0)}

/* --- Hero (GRIT仕様準拠 + エフェクト強化) --- */
.hero{
  position:relative;z-index:10;
  min-height:100vh;min-height:100svh;
  overflow:hidden;
}
.hero-content{
  position:absolute;
  top:calc(219/800*100svh);
  left:calc(98/1440*100vw);
}
/* 横ラインデコレーション */
.hero-content::before{
  content:'';
  position:absolute;
  top:50%;left:-60px;
  width:60px;height:1px;
  background:var(--red);
  transform:translateY(-50%) scaleX(0);
  transform-origin:left;
  animation:heroLineDraw .8s cubic-bezier(.6,0,.3,1) 1.5s forwards;
}
@keyframes heroLineDraw{to{transform:translateY(-50%) scaleX(1)}}

/* メインタイトル */
.hero-main-title{
  font-family:var(--font-en);
  font-size:calc(160/1440*100vw);
  font-weight:400;
  line-height:1;
  letter-spacing:-.03em;
  color:var(--black);
  overflow:hidden;
  position:relative;
}
/* 1文字ずつスライドイン（左から右へ流れるように） */
.hero-main-title .hero-char{
  display:inline-block;
  opacity:0;
  transform:translateX(-30px) translateY(20px);
  filter:blur(4px);
  transition:opacity .7s cubic-bezier(.6,0,.3,1),
             transform .7s cubic-bezier(.6,0,.3,1),
             filter .7s cubic-bezier(.6,0,.3,1);
}
.hero-main-title.is-active .hero-char{
  opacity:1;
  transform:translateX(0) translateY(0);
  filter:blur(0);
}

/* グラデーションスイープ（一度だけスイープし、その後は通常の黒文字に戻る） */
@keyframes gradientTitle{
  0%  { background-position:200% center; }
  50% { background-position:0% center; }
  100%{ background-position:-200% center; }
}
.hero-main-title.gradient-sweep{
  background:linear-gradient(90deg, var(--black) 30%, #c3572f 38%, #efa140 43%, #ffb648 48%, #efa140 53%, #c3572f 58%, var(--black) 70%);
  background-size:200% 100%;
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:gradientTitle 3s cubic-bezier(0.3,0.4,0.31,0.88) forwards;
}
/* スイープ完了後にJS側でこのクラスを付けて通常の黒文字に戻す */
.hero-main-title.gradient-done{
  background:none;
  -webkit-background-clip:unset;
  background-clip:unset;
  -webkit-text-fill-color:var(--black);
  color:var(--black);
}

/* サブタイトル */
.hero-sub-title{
  font-family:var(--font-jp-heading);
  font-size:calc(32/1440*100vw);
  font-weight:500;
  margin-top:calc(44/1440*100vw);
  line-height:1.7;
  color:var(--black);
  opacity:0;
  transform:translateY(20px);
  transition:opacity .8s ease,transform .8s ease;
}
.hero-sub-title.is-active{
  opacity:1;
  transform:translateY(0);
}

@media(max-width:767px){
  .hero-content{
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    text-align:center;width:85%;
  }
  .hero-main-title{font-size:calc(49/390*100vw)}
  .hero-sub-title{font-size:calc(20/390*100vw);margin-top:calc(20/390*100vw)}
}

/* Scroll Down インジケーター */
.scroll-down{
  position:absolute;
  bottom:0;left:calc(104/1440*100vw);
  display:flex;flex-direction:column;align-items:center;gap:12px;
  opacity:0;
  transition:opacity .8s ease;
}
.scroll-down.is-visible{opacity:1}
.scroll-down-text{
  font-family:var(--font-en);
  font-size:14px;letter-spacing:.05em;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  color:var(--black);
}
.scroll-down-bar{
  width:2px;height:95px;
  background:rgba(36,38,35,.2);
  position:relative;overflow:hidden;
}
.scroll-down-fill{
  position:absolute;top:0;left:0;
  width:100%;height:100%;
  background:var(--red);
  transform-origin:top;
}
.scroll-down-fill-1{animation:scrollBarAnim 2.5s ease infinite}
.scroll-down-fill-2{animation:scrollBarAnim 2.5s ease .8s infinite}
@keyframes scrollBarAnim{
  0%{transform:scaleY(0);transform-origin:top}
  40%{transform:scaleY(1);transform-origin:top}
  40.01%{transform-origin:bottom}
  100%{transform:scaleY(0);transform-origin:bottom}
}
@media(max-width:767px){
  .scroll-down{left:20px}
}

/* --- Read More リンク --- */
.read-more-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-en);font-size:14px;letter-spacing:.06em;
  position:relative;padding-bottom:6px;
  border-bottom:1px solid currentColor;
  transition:opacity .3s;
}
.read-more-link:hover{opacity:.6}
.read-more-arrow{
  width:7px;height:7px;
  border-right:1px solid currentColor;
  border-top:1px solid currentColor;
  transform:rotate(45deg);
  transition:transform .3s;
}
.read-more-link:hover .read-more-arrow{
  transform:rotate(45deg) translate(2px,-2px);
}

/* --- 統計カード --- */
.stats-row{
  display:flex;gap:calc(32/1440*100vw);
  margin-top:calc(80/1440*100vw);
  justify-content:center;
}
.stat-card{
  background:var(--white);
  border:1px solid rgba(36,38,35,.08);
  padding:calc(40/1440*100vw) calc(48/1440*100vw);
  text-align:center;flex:1;max-width:320px;
}
.stat-number{
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  font-weight:400;line-height:1;
  color:var(--black);
}
.stat-number span{
  font-size:.6em;
  color:rgba(36,38,35,.4);
}
.stat-label{
  font-size:13px;margin-top:8px;
  color:rgba(36,38,35,.5);
}
@media(max-width:767px){
  .stats-row{flex-direction:column;align-items:center;gap:16px;margin-top:48px}
  .stat-card{width:100%;max-width:100%;padding:28px}
  .stat-number{font-size:36px}
}

/* --- Message (GRIT仕様準拠) --- */
.message-section{
  position:relative;z-index:10;
  margin-top:160px;
  padding:0 calc(40/1440*100vw) calc(160/1440*100vw);
  overflow:hidden;
}
.message-container{max-width:1152px;margin:0 auto}
.message-content{
  margin-left:auto;
  max-width:max(calc(528/1152*100%),350px);
}
.message-heading{
  font-family:var(--font-jp-heading);
  font-size:max(calc(56/1440*100vw),36px);
  font-weight:500;line-height:1.8;
  margin-bottom:32px;
}
.message-body{
  font-family:var(--font-jp-heading);
  font-size:max(calc(20/1440*100vw),17px);
  line-height:2.6;
  color:rgba(36,38,35,.7);
}
.message-light-deco{
  position:absolute;top:-10%;right:-15%;
  width:60%;height:120%;
  background:radial-gradient(ellipse at center,rgba(222,64,43,.04),transparent 70%);
  pointer-events:none;
  animation:lightDrift 25s ease-in-out infinite;
}
@keyframes lightDrift{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-40px,30px) scale(1.1)}
}
@media(max-width:767px){
  .message-section{margin-top:100px;padding:0 20px 80px}
  .message-content{max-width:100%}
  .message-heading{font-size:calc(22/390*100vw)}
}

/* --- About (index) GRIT仕様: flex横並び --- */
.about-layout{
  display:flex;
  gap:calc(104/1152*100%);
  align-items:flex-start;
}
.about-layout .section-title{
  flex-shrink:0;
  margin-bottom:0;
}
.about-text{
  font-size:15px;line-height:2;
  flex:1;
}
/* --- Lottie風インフォグラフィック --- */
.about-infographic{
  margin-top:calc(80/1440*100vw);
  display:flex;justify-content:center;
}
.infographic-inner{
  position:relative;
  width:min(600px,100%);
  aspect-ratio:600/340;
}
.infographic-center{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
}
.infographic-sphere{
  width:80px;height:80px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #555, #1a1a1a 70%);
  box-shadow:0 4px 20px rgba(0,0,0,.25);
  margin:0 auto 8px;
}
.infographic-orbit{
  position:absolute;top:50%;left:50%;
  width:120px;height:50px;
  border:1px solid rgba(180,180,180,.4);
  border-radius:50%;
  transform:translate(-50%,-55%) rotateX(60deg);
  animation:orbitSpin 8s linear infinite;
}
@keyframes orbitSpin{to{transform:translate(-50%,-55%) rotateX(60deg) rotateZ(360deg)}}
.infographic-orbit-dot{
  position:absolute;top:calc(50% - 28px);left:calc(50% + 55px);
  width:6px;height:6px;border-radius:50%;
  background:var(--red);
  animation:dotOrbit 8s linear infinite;
}
@keyframes dotOrbit{
  0%{transform:rotate(0deg) translateX(55px)}
  100%{transform:rotate(360deg) translateX(55px)}
}
.infographic-label{
  font-family:var(--font-en);font-size:16px;font-weight:500;
  color:var(--black);letter-spacing:.08em;
}
.infographic-node{
  position:absolute;text-align:center;
  width:80px;
}
.infographic-node svg{width:60px;height:60px;margin:0 auto 4px}
.infographic-node span{font-size:11px;color:rgba(36,38,35,.5);letter-spacing:.04em}
.node-training{top:5%;left:12%}
.node-agent{top:5%;right:12%}
.node-advisory{bottom:5%;left:12%}
.node-dx{bottom:5%;right:12%}
.infographic-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.infographic-line{
  stroke-dasharray:300;stroke-dashoffset:300;
  animation:drawLine 2s ease forwards;
}
.infographic-line:nth-child(2){animation-delay:.3s}
.infographic-line:nth-child(3){animation-delay:.6s}
.infographic-line:nth-child(4){animation-delay:.9s}
@keyframes drawLine{to{stroke-dashoffset:0}}
@media(max-width:767px){
  .about-infographic{margin-top:48px}
  .infographic-sphere{width:60px;height:60px}
  .infographic-orbit{width:90px;height:38px}
  .infographic-node{width:60px}
  .infographic-node svg{width:44px;height:44px}
  .infographic-node span{font-size:10px}
}
/* About内の日本語社名 */
.en-jp-name{
  display:inline;
}
@media(max-width:767px){
  .about-layout{flex-direction:column;gap:40px}
  .about-layout .section-title{margin-bottom:0}
  /* スマホ: 日本AI開発センターのフォントサイズを縮小して1行に収める */
  .en-jp-name{
    font-size:calc(32/375*100vw);
    display:block;
    line-height:1.2;
    margin-top:4px;
  }
}

/* --- Sticky サービス（GRIT仕様: プログレスバー + 数字 + 切り替え） --- */
.sticky-services{
  position:relative;z-index:10;
  background:var(--black);
  color:var(--white);
}
.sticky-container{
  position:relative;
  height:450vh;
}
.sticky-viewport{
  position:sticky;top:0;
  height:100vh;height:100dvh;
  display:flex;flex-direction:column;justify-content:flex-start;
  overflow:hidden;
  padding:calc(60/1440*100vw) calc(80/1440*100vw) 0;
}
.sticky-title-block{flex-shrink:0}
.sticky-title-block .section-title{margin-bottom:clamp(16px,calc(24/1440*100vw),28px)!important}
@media(max-width:767px){.sticky-viewport{padding:0 20px}}

/* プログレスバー */
.sticky-progress-wrap{
  position:absolute;top:50%;left:calc(40/1440*100vw);right:calc(40/1440*100vw);
  transform:translateY(calc(100dvh * 0.35));
  display:flex;align-items:center;gap:16px;
}
.sticky-progress-bg{
  flex:1;height:2px;background:rgba(242,242,242,.15);position:relative;
}
.sticky-progress-bar{
  position:absolute;top:0;left:0;height:100%;width:0;
  background:var(--red);
  transition:width 100ms linear;
}
.sticky-progress-num{
  font-family:var(--font-en);
  font-size:14px;letter-spacing:.06em;
  color:rgba(242,242,242,.5);
  min-width:24px;
}

.sticky-slides-area{
  position:relative;
  min-height:200px;
  flex:1;
  display:flex;align-items:flex-start;
}
.sticky-slide{
  position:absolute;top:0;left:0;right:0;bottom:0;
  display:flex;align-items:center;
  gap:clamp(24px,calc(48/1440*100vw),56px);
  opacity:0;
  transform:translateY(30px);
  transition:opacity 400ms ease,transform 400ms cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.sticky-slide.active{opacity:1;transform:translateY(0);pointer-events:auto}
.sticky-slide-number{
  font-family:var(--font-en);
  font-size:calc(200/1440*100vw);
  opacity:.08;
  position:absolute;right:calc(40/1440*100vw);bottom:calc(40/1440*100vw);
}
.sticky-slide-icon{
  width:clamp(100px,calc(160/1440*100vw),160px);
  height:clamp(100px,calc(160/1440*100vw),160px);
  flex-shrink:0;
}
.sticky-slide-icon svg{width:100%;height:100%}
@media(max-width:767px){.sticky-slide-icon{width:80px;height:80px}}
.sticky-slide-title{
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  margin-bottom:16px;
}
.sticky-slide-jp{
  font-family:var(--font-jp-heading);
  font-size:calc(14/1440*100vw);
  letter-spacing:.08em;
  margin-bottom:24px;
  color:rgba(242,242,242,.6);
}
.sticky-slide-desc{
  font-size:14px;line-height:1.8;
  max-width:480px;
  color:rgba(242,242,242,.7);
}
@media(max-width:767px){
  .sticky-container{height:500vh}
  .sticky-viewport{padding:60px 20px 80px}
  .sticky-title-block .section-title{margin-bottom:20px!important}
  .sticky-slide{padding:0;flex-direction:column;gap:12px}
  .sticky-slide-icon{width:60px;height:60px}
  .sticky-slide-title{font-size:24px;margin-bottom:8px}
  .sticky-slide-jp{font-size:12px;margin-bottom:8px}
  .sticky-slide-desc{font-size:13px;line-height:1.7}
  .sticky-slide-number{font-size:64px;right:8px;bottom:60px;opacity:.06}
  .sticky-progress-wrap{left:20px;right:20px;bottom:20px;top:auto;transform:none;position:absolute}
  .sticky-slides-area{min-height:auto;flex:1}
}

/* --- マーキー --- */
.marquee{
  position:relative;z-index:10;
  overflow:hidden;
  padding:calc(60/1440*100vw) 0;
  background:var(--white);
}
.marquee-dark{background:var(--black)}
.marquee-track{
  display:flex;
  width:max-content;
  animation:marqueeScroll 30s linear infinite;
}
.marquee-text{
  font-family:var(--font-en);
  font-size:calc(272/1440*100vw);
  white-space:nowrap;
  padding:0 calc(40/1440*100vw);
  color:rgba(36,38,35,.1);
  line-height:.7;
}
.marquee-dark .marquee-text{
  color:rgba(242,242,242,.06);
}
@keyframes marqueeScroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@media(max-width:767px){
  .marquee-text{font-size:calc(180/390*100vw)}
}

/* --- Social Impact (index) --- */
.social-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:calc(32/1440*100vw);
  margin-top:calc(48/1440*100vw);
}
.social-card{
  background:rgba(242,242,242,.04);
  border:1px solid rgba(242,242,242,.1);
  border-radius:12px;
  padding:calc(40/1440*100vw);
  clip-path:inset(15%);
  transition:clip-path 1s cubic-bezier(.22,1,.36,1);
}
.social-card.in-view{clip-path:inset(0)}
.social-card-number{
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  color:var(--red);
}
.social-card-label{
  font-size:14px;margin-top:8px;
  color:rgba(242,242,242,.6);
}
@media(max-width:767px){
  .social-grid{grid-template-columns:1fr;gap:16px}
  .social-card{padding:24px}
  .social-card-number{font-size:calc(36/375*100vw)}
}

/* --- Recruit (index: GRIT仕様ベン図+説明文) --- */
.recruit-layout{
  display:flex;
  gap:calc(80/1440*100vw);
  align-items:flex-start;
}
.recruit-left{flex-shrink:0;width:calc(500/1152*100%);max-width:560px}
.recruit-right{flex:1}
@media(max-width:767px){
  .recruit-layout{flex-direction:column;gap:40px}
  .recruit-left{width:100%;max-width:320px;margin:0 auto}
}

/* ベン図（3つの円 - 三角ベン図配置+フローティング） */
.spirits-diagram{
  position:relative;
  width:clamp(300px,calc(480/1440*100vw),480px);
  aspect-ratio:480/420;
  margin:0 auto;
}
.spirit-circle{
  position:absolute;
  width:52%;aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(36,38,35,.25);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  background:rgba(242,242,242,.5);
}
/* 上中央 */
.spirit-1{
  top:0;left:50%;transform:translateX(-50%);
  animation:spiritFloat1 4s ease-in-out infinite;
}
/* 左下 */
.spirit-2{
  bottom:0;left:0;
  animation:spiritFloat2 4.5s ease-in-out infinite;
}
/* 右下 */
.spirit-3{
  bottom:0;right:0;
  animation:spiritFloat3 5s ease-in-out infinite;
}
@keyframes spiritFloat1{
  0%,100%{transform:translateX(-50%) translateY(0)}
  50%{transform:translateX(-50%) translateY(-8px)}
}
@keyframes spiritFloat2{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@keyframes spiritFloat3{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}
.spirit-en{
  font-family:var(--font-en);font-size:clamp(16px,calc(22/1440*100vw),24px);
  font-weight:400;display:block;
}
.spirit-ja{
  font-size:clamp(10px,calc(12/1440*100vw),13px);
  color:rgba(36,38,35,.5);margin-top:4px;display:block;
}

/* 説明文 */
.recruit-text{
  font-family:var(--font-jp-heading);
  font-size:max(calc(18/1440*100vw),15px);
  line-height:2;
  margin-bottom:16px;
}

/* CTAボタン（GRIT仕様: 白背景+黒ボーダー+シャドウ） */
.recruit-cta-btn{
  display:inline-block;
  font-family:var(--font-jp-heading);
  font-size:18px;font-weight:500;
  padding:18px 56px;
  background:var(--pure-white,#fff);
  border:1px solid var(--black);
  box-shadow:1px 1px 8px rgba(0,0,0,.15);
  transition:box-shadow .3s,transform .3s;
  letter-spacing:.03em;
}
.recruit-cta-btn:hover{
  box-shadow:2px 2px 14px rgba(0,0,0,.25);
  transform:translateY(-2px);
}

/* --- フッターグラデーション --- */
.footer-grad{
  position:relative;z-index:10;
  height:clamp(80px,15vh,160px);
  background:linear-gradient(to bottom, var(--white), var(--black));
}

/* --- フッター --- */
.site-footer{
  position:relative;z-index:10;
  background:var(--black);color:var(--white);
  padding:calc(80/1440*100vw) calc(40/1440*100vw) calc(40/1440*100vw);
}
.footer-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:calc(64/1440*100vw);
}
.footer-logo{
  font-family:var(--font-jp-heading);
  font-size:clamp(18px, calc(24/1440*100vw), 24px);
  letter-spacing:.06em;
  font-weight:600;
}
.footer-tagline{
  font-family:var(--font-jp-heading);
  font-size:13px;margin-top:12px;
  color:rgba(242,242,242,.5);
}
.footer-address{
  font-size:12px;line-height:1.8;
  margin-top:24px;
  color:rgba(242,242,242,.4);
}
.footer-nav{
  display:flex;flex-direction:column;gap:12px;
  font-size:13px;
}
.footer-nav a{transition:opacity .3s}
.footer-nav a:hover{opacity:.6}

.footer-hr{
  border:none;
  border-top:1px solid rgba(242,242,242,.1);
  margin-top:calc(64/1440*100vw);
}
.footer-bottom{
  margin-top:24px;
  display:flex;justify-content:space-between;align-items:center;
  font-size:11px;
  color:#989898;
}
.page-top{
  display:flex;align-items:center;gap:8px;
  cursor:pointer;
  transition:opacity .3s;
  color:rgba(242,242,242,.5);
}
.page-top:hover{opacity:.8}
.page-top-arrow{
  writing-mode:vertical-rl;
  font-size:14px;
}
.page-top-label{
  writing-mode:vertical-rl;
  font-family:var(--font-en);
  font-size:11px;letter-spacing:.2em;
}
@media(max-width:767px){
  .site-footer{padding:48px 20px 24px}
  .footer-inner{grid-template-columns:1fr;gap:40px}
  .footer-logo{font-size:22px}
  .footer-bottom{flex-direction:column;gap:16px;text-align:center;margin-top:40px}
}

/* =============================================
   下層ページ用スタイル（変更なし）
   ============================================= */

/* --- ページHero（下層ページ共通） --- */
.page-hero{
  position:relative;z-index:1;
  height:60vh;min-height:400px;
  display:flex;align-items:flex-end;
  padding:0 calc(40/1440*100vw) calc(60/1440*100vw);
  background:var(--white);
}
.page-hero-dark{background:var(--black);color:var(--white)}
.page-hero .en{
  font-family:var(--font-en);
  font-size:calc(100/1440*100vw);
  line-height:1;letter-spacing:-.02em;
}
.page-hero .jp{
  font-family:var(--font-jp-heading);
  font-size:calc(14/1440*100vw);
  letter-spacing:.1em;
  margin-top:16px;
}
@media(max-width:767px){
  .page-hero{height:40vh;padding:0 20px 40px}
  .page-hero .en{font-size:calc(48/375*100vw)}
  .page-hero .jp{font-size:12px}
}

/* --- About ページ --- */
.mission-vision{
  display:grid;grid-template-columns:1fr 1fr;
  gap:calc(64/1440*100vw);
}
.mv-block-label{
  font-family:var(--font-en);
  font-size:calc(14/1440*100vw);
  letter-spacing:.12em;
  color:var(--red);
  margin-bottom:16px;
}
.mv-block-title{
  font-family:var(--font-jp-heading);
  font-size:calc(28/1440*100vw);
  line-height:1.6;
  margin-bottom:24px;
}
.mv-block-text{font-size:14px;line-height:2;color:rgba(36,38,35,.6)}
@media(max-width:767px){
  .mission-vision{grid-template-columns:1fr;gap:48px}
  .mv-block-label{font-size:12px}
  .mv-block-title{font-size:calc(22/375*100vw)}
}

/* チーム */
.team-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:calc(48/1440*100vw);
}
.team-card-img{
  aspect-ratio:3/4;overflow:hidden;
  background:var(--black);
  margin-bottom:24px;
  max-height:520px;
}
.team-card-img img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.team-card-img .placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  color:rgba(242,242,242,.3);
  font-family:var(--font-en);font-size:14px;
}
.team-initial{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  min-font-size:32px;
  color:rgba(242,242,242,.2);
  background:linear-gradient(135deg, #2a2c29, #3a3c39);
  letter-spacing:.1em;
}
.team-card-role{
  font-size:12px;color:var(--red);
  letter-spacing:.08em;
  margin-bottom:8px;
}
.team-card-name{
  font-family:var(--font-jp-heading);
  font-size:calc(24/1440*100vw);
  margin-bottom:4px;
}
.team-card-name-en{
  font-family:var(--font-en);
  font-size:13px;color:rgba(36,38,35,.4);
  margin-bottom:16px;
}
.team-card-bio{
  font-size:13px;line-height:2;
  color:rgba(36,38,35,.6);
}
@media(max-width:767px){
  .team-grid{grid-template-columns:1fr;gap:48px}
  .team-card-name{font-size:20px}
}

/* 会社情報テーブル */
.info-table{
  width:100%;max-width:800px;
  border-collapse:collapse;
}
.info-table tr{border-bottom:1px solid rgba(36,38,35,.08)}
.info-table th{
  font-weight:500;text-align:left;
  padding:16px 24px 16px 0;
  font-size:13px;white-space:nowrap;
  width:160px;vertical-align:top;
}
.info-table td{
  padding:16px 0;font-size:14px;
  line-height:1.8;
}

/* 沿革タイムライン */
.timeline{max-width:800px}
.timeline-item{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid rgba(36,38,35,.06);
  position:relative;
}
.timeline-year{
  font-family:var(--font-en);
  font-size:14px;letter-spacing:.06em;
  color:var(--red);
  padding-top:2px;
}
.timeline-text{font-size:14px;line-height:1.8}
@media(max-width:767px){
  .timeline-item{grid-template-columns:80px 1fr;gap:16px}
}

/* --- Service ページ --- */
.service-intro{
  max-width:720px;
  font-size:15px;line-height:2;
  margin-bottom:calc(80/1440*100vw);
}
.courses-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:calc(24/1440*100vw);
}
.course-card{
  background:var(--white);
  border:1px solid rgba(36,38,35,.08);
  border-radius:12px;
  padding:calc(32/1440*100vw);
  transition:transform .4s,box-shadow .4s;
}
.course-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 48px rgba(0,0,0,.06);
}
.course-number{
  font-family:var(--font-en);
  font-size:11px;color:var(--red);
  letter-spacing:.12em;
  margin-bottom:16px;
}
.course-title{
  font-family:var(--font-jp-heading);
  font-size:calc(18/1440*100vw);
  line-height:1.5;margin-bottom:12px;
}
.course-desc{
  font-size:13px;line-height:1.8;
  color:rgba(36,38,35,.6);
}
@media(max-width:767px){
  .courses-grid{grid-template-columns:1fr;gap:16px}
  .course-card{padding:24px}
  .course-title{font-size:16px}
}

/* フロー */
.flow-steps{
  display:flex;gap:calc(16/1440*100vw);
  counter-reset:step;
}
.flow-step{
  flex:1;
  text-align:center;
  padding:calc(32/1440*100vw) calc(16/1440*100vw);
  position:relative;
}
.flow-step::before{
  content:counter(step);counter-increment:step;
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  color:var(--red);
  opacity:.2;
  display:block;
  margin-bottom:12px;
}
.flow-step-title{
  font-family:var(--font-jp-heading);
  font-size:15px;margin-bottom:8px;
}
.flow-step-desc{font-size:12px;color:rgba(36,38,35,.5);line-height:1.6}
@media(max-width:767px){
  .flow-steps{flex-direction:column;gap:16px}
  .flow-step{text-align:left;display:flex;gap:16px;align-items:flex-start;padding:16px 0}
  .flow-step::before{font-size:32px;flex-shrink:0}
}

/* 料金 */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,calc(24/1440*100vw),24px);
  max-width:1000px;
  margin:0 auto;
}
.pricing-card{
  border:1px solid rgba(36,38,35,.1);
  border-radius:12px;
  padding:calc(40/1440*100vw);
  position:relative;
}
.pricing-card.recommended{
  border-color:var(--red);
}
.pricing-badge{
  position:absolute;top:-12px;left:24px;
  background:var(--red);color:var(--white);
  font-size:11px;letter-spacing:.06em;
  padding:4px 16px;border-radius:20px;
}
.pricing-name{
  font-family:var(--font-jp-heading);
  font-size:18px;margin-bottom:8px;
}
.pricing-price{
  font-family:var(--font-en);
  font-size:calc(40/1440*100vw);
  color:var(--red);margin-bottom:4px;
}
.pricing-price-sub{font-size:12px;color:rgba(36,38,35,.4);margin-bottom:16px}
.pricing-features{font-size:13px;line-height:2}
.pricing-features li::before{content:'- '}
@media(max-width:767px){
  .pricing-grid{grid-template-columns:1fr;gap:16px;max-width:400px}
  .pricing-card{padding:24px}
  .pricing-price{font-size:32px!important}
}
/* 助成金ボックスも中央寄せ */
.subsidy-box{max-width:1000px;margin-left:auto;margin-right:auto}

/* 助成金 */
.subsidy-box{
  background:rgba(222,64,43,.04);
  border:1px solid rgba(222,64,43,.15);
  border-radius:12px;
  padding:calc(40/1440*100vw);
  margin-top:calc(48/1440*100vw);
  max-width:800px;
}
.subsidy-title{
  font-family:var(--font-jp-heading);
  font-size:18px;color:var(--red);
  margin-bottom:16px;
}
.subsidy-text{font-size:14px;line-height:1.8}

/* 比較表 */
.comparison-table{
  width:100%;border-collapse:collapse;
  font-size:13px;
}
.comparison-table th,.comparison-table td{
  padding:14px 16px;
  text-align:left;
  border-bottom:1px solid rgba(36,38,35,.08);
}
.comparison-table th{
  font-weight:600;
  background:rgba(36,38,35,.02);
}
.comparison-table thead th{
  font-family:var(--font-en);
  letter-spacing:.04em;
}
.comparison-table .highlight{
  color:var(--red);font-weight:600;
}

/* 導入事例 */
.cases-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:calc(24/1440*100vw);
}
.case-card{
  background:var(--white);
  border:1px solid rgba(36,38,35,.08);
  border-radius:12px;
  padding:calc(32/1440*100vw);
}
.case-label{
  font-size:11px;color:var(--red);
  letter-spacing:.08em;
  margin-bottom:12px;
}
.case-title{
  font-family:var(--font-jp-heading);
  font-size:16px;margin-bottom:12px;
}
.case-results{font-size:13px;line-height:2;color:rgba(36,38,35,.6)}
.case-results li::before{content:'- '}
@media(max-width:767px){
  .cases-grid{grid-template-columns:1fr;gap:16px}
  .case-card{padding:24px}
}

/* AI顧問 */
.advisory-box{
  background:var(--black);color:var(--white);
  border-radius:16px;
  padding:calc(64/1440*100vw);
  display:grid;grid-template-columns:1fr 1fr;
  gap:calc(48/1440*100vw);
  align-items:center;
}
.advisory-title{
  font-family:var(--font-en);
  font-size:calc(40/1440*100vw);
  margin-bottom:16px;
}
.advisory-jp{
  font-family:var(--font-jp-heading);
  font-size:16px;
  margin-bottom:24px;
  color:rgba(242,242,242,.6);
}
.advisory-price{
  font-family:var(--font-en);
  font-size:calc(32/1440*100vw);
  color:var(--red);
  margin-bottom:8px;
}
.advisory-desc{font-size:13px;line-height:2;color:rgba(242,242,242,.5)}
@media(max-width:767px){
  .advisory-box{grid-template-columns:1fr;padding:32px}
  .advisory-title{font-size:28px}
  .advisory-price{font-size:24px}
}

/* CTA */
.cta-section{
  text-align:center;
  padding:calc(120/1440*100vw) calc(40/1440*100vw);
}
.cta-title{
  font-family:var(--font-en);
  font-size:calc(48/1440*100vw);
  margin-bottom:16px;
}
.cta-text{
  font-size:14px;color:rgba(36,38,35,.5);
  margin-bottom:40px;
}
.btn-primary{
  display:inline-block;
  background:var(--red);color:var(--white);
  padding:18px 56px;
  font-size:14px;letter-spacing:.06em;
  border-radius:0;
  transition:opacity .3s;
}
.btn-primary:hover{opacity:.85}

/* --- Social ページ --- */
.numbers-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:calc(32/1440*100vw);
  text-align:center;
}
.number-item-value{
  font-family:var(--font-en);
  font-size:calc(64/1440*100vw);
  color:var(--red);
  line-height:1;
}
.number-item-label{
  font-size:14px;margin-top:12px;
  color:rgba(36,38,35,.5);
}
@media(max-width:767px){
  .numbers-grid{grid-template-columns:1fr;gap:32px}
  .number-item-value{font-size:calc(48/375*100vw)}
}

.case-study-featured{
  display:grid;grid-template-columns:1fr 1fr;
  gap:calc(64/1440*100vw);
  align-items:center;
}
.case-study-img{
  aspect-ratio:16/10;
  background:rgba(36,38,35,.06);
  border-radius:12px;overflow:hidden;
}
.case-study-img img{width:100%;height:100%;object-fit:cover}
@media(max-width:767px){
  .case-study-featured{grid-template-columns:1fr;gap:32px}
}

.awards-list{max-width:720px}
.award-item{
  padding:24px 0;
  border-bottom:1px solid rgba(36,38,35,.06);
  display:grid;
  grid-template-columns:100px 1fr;
  gap:24px;
}
.award-year{
  font-family:var(--font-en);
  font-size:14px;color:var(--red);
}
.award-title{font-size:14px;line-height:1.8}

.news-list{max-width:720px}
.news-item{
  padding:20px 0;
  border-bottom:1px solid rgba(36,38,35,.06);
}
.news-date{
  font-family:var(--font-en);
  font-size:12px;color:rgba(36,38,35,.35);
  margin-bottom:4px;
}
.news-title{font-size:14px}

/* --- Recruit ページ --- */
.page-hero-dark{
  background:var(--black);color:var(--white);
}
.page-hero-dark .en{color:var(--white)}
.page-hero-dark .jp{color:rgba(242,242,242,.5)}

.spirits-section{
  background:var(--black);color:var(--white);
  padding:calc(80/1440*100vw) calc(40/1440*100vw) calc(100/1440*100vw);
  text-align:center;
}
.spirits-circles{
  display:flex;justify-content:center;
  gap:clamp(20px,calc(40/1440*100vw),48px);
  margin-top:clamp(32px,calc(48/1440*100vw),64px);
}
.spirit-circle-dark{
  width:clamp(130px,calc(180/1440*100vw),180px);
  aspect-ratio:1;
  border:1px solid rgba(242,242,242,.25);
  border-radius:50%;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  transition:border-color .4s,transform .4s;
}
.spirit-circle-dark:hover{border-color:var(--red);transform:translateY(-4px)}
.spirit-circle-dark .en{
  font-family:var(--font-en);
  font-size:clamp(14px,calc(18/1440*100vw),20px);
  letter-spacing:.06em;
  margin-bottom:4px;
}
.spirit-circle-dark .jp{
  font-family:var(--font-jp-heading);
  font-size:12px;
  color:rgba(242,242,242,.45);
}
@media(max-width:767px){
  .spirits-section{padding:64px 20px}
  .spirits-circles{gap:16px}
  .spirit-circle-dark{width:100px;min-width:unset}
}

/* 求人カード */
.positions-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:calc(24/1440*100vw);
}
.position-card{
  border:1px solid rgba(36,38,35,.08);
  border-radius:12px;
  padding:calc(40/1440*100vw);
  transition:transform .4s,box-shadow .4s;
}
.position-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 48px rgba(0,0,0,.06);
}
.position-tag{
  font-size:11px;color:var(--red);
  letter-spacing:.08em;margin-bottom:12px;
}
.position-title{
  font-family:var(--font-jp-heading);
  font-size:18px;margin-bottom:16px;
}
.position-detail{
  font-size:13px;line-height:2;
  color:rgba(36,38,35,.6);
}
@media(max-width:767px){
  .positions-grid{grid-template-columns:1fr;gap:16px}
  .position-card{padding:24px}
}

/* --- Recruit ポジション詳細（recruit.html） --- */
.position-section{
  position:relative;z-index:1;
  padding:calc(80/1440*100vw) calc(40/1440*100vw);
  border-bottom:1px solid rgba(36,38,35,.08);
}
.position-section:nth-child(even){background:rgba(36,38,35,.02)}
@media(max-width:767px){.position-section{padding:48px 20px}}
.position-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:calc(64/1440*100vw);
  max-width:1152px;
  margin:0 auto;
  align-items:start;
}
@media(max-width:767px){.position-grid{grid-template-columns:1fr;gap:32px}}
.position-label{
  font-family:var(--font-en);
  font-size:12px;letter-spacing:.1em;
  color:var(--red);margin-bottom:12px;
}
.position-section .position-title{
  font-family:var(--font-en);
  font-size:max(calc(36/1440*100vw),24px);
  font-weight:400;margin-bottom:16px;
}
.position-desc{
  font-size:14px;line-height:2;
  color:rgba(36,38,35,.65);
}
.position-details{
  font-size:14px;line-height:2;
  color:rgba(36,38,35,.7);
}
.position-details strong{
  color:var(--black);font-weight:500;
  display:block;margin-top:20px;
}
.position-details strong:first-child{margin-top:0}

/* CTA セクション */
.cta-section{
  text-align:center;
  padding:calc(100/1440*100vw) calc(40/1440*100vw);
}
@media(max-width:767px){.cta-section{padding:64px 20px}}
.cta-title{
  font-family:var(--font-en);
  font-size:max(calc(48/1440*100vw),28px);
  margin-bottom:16px;
}
.cta-text{
  font-size:15px;line-height:2;
  color:rgba(36,38,35,.6);
  margin-bottom:32px;
}
.btn-primary{
  display:inline-block;
  font-family:var(--font-jp-heading);
  font-size:16px;font-weight:500;
  padding:16px 52px;
  background:var(--black);color:var(--white);
  border:none;letter-spacing:.04em;
  transition:opacity .3s,transform .3s;
}
.btn-primary:hover{opacity:.85;transform:translateY(-2px)}

/* ニュースリスト（トップページ） */
.news-list-index{max-width:900px}
.news-item-index{
  display:flex;align-items:baseline;gap:16px;
  padding:20px 0;
  border-bottom:1px solid rgba(36,38,35,.08);
  transition:background .3s,transform .3s;
  flex-wrap:wrap;
}
.news-item-index:first-child{border-top:1px solid rgba(36,38,35,.08)}
.news-item-index:hover{transform:translateX(6px)}
.news-date-index{
  font-family:var(--font-en);font-size:14px;
  color:var(--red);flex-shrink:0;min-width:72px;
}
.news-tag-index{
  font-size:11px;font-weight:500;
  padding:2px 10px;
  background:rgba(36,38,35,.04);
  color:rgba(36,38,35,.5);
  flex-shrink:0;
}
.news-text-index{font-size:14px;line-height:1.7}

/* 比較カード */
.compare-cards{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,calc(24/1440*100vw),24px);
  max-width:1000px;margin:0 auto;
}
@media(max-width:767px){.compare-cards{grid-template-columns:1fr;max-width:400px}}
.compare-card{
  border:1px solid rgba(36,38,35,.1);
  padding:clamp(28px,calc(40/1440*100vw),40px);
  position:relative;
  background:var(--white);
  transition:transform .3s,box-shadow .3s;
}
.compare-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.06)}
.compare-card--highlight{
  border:2px solid var(--red);
  background:#fff;
  box-shadow:0 8px 32px rgba(222,64,43,.08);
}
.compare-card-badge{
  position:absolute;top:-1px;right:24px;
  background:var(--red);color:#fff;
  font-size:11px;font-weight:600;
  padding:4px 16px;letter-spacing:.04em;
}
.compare-card-name{
  font-family:var(--font-en);
  font-size:clamp(18px,calc(22/1440*100vw),24px);
  font-weight:400;margin-bottom:16px;
  letter-spacing:.04em;
}
.compare-card-price{
  font-family:var(--font-en);
  font-size:clamp(32px,calc(40/1440*100vw),44px);
  font-weight:400;line-height:1.1;
  margin-bottom:24px;
}
.compare-card-price span{
  font-size:.4em;font-family:var(--font-jp);
  color:rgba(36,38,35,.4);margin-left:4px;
}
.compare-card--highlight .compare-card-price{color:var(--red)}
.compare-card-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.compare-card-list li{
  font-size:14px;line-height:1.6;
  padding-left:24px;position:relative;
  color:rgba(36,38,35,.7);
}
.compare-check::before{
  content:'✓';position:absolute;left:0;
  color:var(--red);font-weight:700;font-size:13px;
}
.compare-neutral::before{
  content:'—';position:absolute;left:0;
  color:rgba(36,38,35,.25);font-size:13px;
}
.compare-cross::before{
  content:'✕';position:absolute;left:0;
  color:rgba(36,38,35,.2);font-size:11px;top:2px;
}
.compare-card--highlight .compare-check::before{color:var(--red)}

/* ニュース記事ページ */
.news-article{
  position:relative;z-index:1;
  padding:calc(140/1440*100vw) calc(40/1440*100vw) calc(80/1440*100vw);
}
@media(max-width:767px){.news-article{padding:80px 20px 48px}}
.news-article-inner{max-width:760px;margin:0 auto}
.news-article-meta{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.news-article-date{font-family:var(--font-en);font-size:14px;color:var(--red)}
.news-article-tag{font-size:11px;padding:3px 12px;background:rgba(36,38,35,.05);color:rgba(36,38,35,.5)}
.news-article-title{
  font-family:var(--font-jp-heading);
  font-size:clamp(24px,calc(36/1440*100vw),36px);
  font-weight:600;line-height:1.6;
  margin-bottom:40px;
  padding-bottom:32px;
  border-bottom:1px solid rgba(36,38,35,.1);
}
.news-article-body{font-size:15px;line-height:2.2;color:rgba(36,38,35,.75)}
.news-article-body p{margin-bottom:20px}
.news-article-body h2{
  font-family:var(--font-jp-heading);font-size:18px;
  font-weight:600;margin:32px 0 16px;color:var(--black);
}
.news-article-body ul{margin:12px 0 20px 20px;list-style:disc}
.news-article-body li{margin-bottom:8px;line-height:1.8}
.news-article-back{margin-top:48px;padding-top:32px;border-top:1px solid rgba(36,38,35,.1)}

/* アクセスグリッド */
.access-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:calc(64/1440*100vw);
  max-width:800px;
}
.access-card-name{
  font-family:var(--font-jp-heading);
  font-size:18px;font-weight:600;
  margin-bottom:12px;
}
.access-card-address{
  font-size:14px;line-height:2;
  color:rgba(36,38,35,.6);
}
@media(max-width:767px){
  .access-grid{grid-template-columns:1fr;gap:40px}
}

/* --- Contact ページ --- */
.contact-form{max-width:640px}
.form-group{margin-bottom:32px}
.form-label{
  display:block;font-size:13px;
  margin-bottom:8px;font-weight:500;
}
.form-label .required{
  color:var(--red);font-size:11px;
  margin-left:4px;
}
.form-input,.form-textarea{
  width:100%;padding:14px 16px;
  border:1px solid rgba(36,38,35,.15);
  background:transparent;
  font-size:14px;font-family:var(--font-jp);
  line-height:1.6;
  transition:border-color .3s;
}
.form-input:focus,.form-textarea:focus{
  outline:none;
  border-color:var(--red);
}
.form-textarea{min-height:160px;resize:vertical}
.form-select{
  width:100%;padding:14px 16px;
  border:1px solid rgba(36,38,35,.15);
  background:transparent;
  font-size:14px;font-family:var(--font-jp);
  appearance:none;
  cursor:pointer;
}
.form-note{
  font-size:12px;color:rgba(36,38,35,.4);
  margin-top:24px;line-height:1.8;
}

/* AIエージェント開発セクション（service.html）のSP対応 */
@media(max-width:767px){
  .section [style*="grid-template-columns:repeat(2"] {
    grid-template-columns:1fr !important;
  }
}
