:root{
  --main:#5EC7E5;
  --main-deep:#2FA5C9;
  --main-soft:#E8F6FB;
  --gold:#C9A96A;
  --gold-deep:#A68445;
  --gold-light:#E8D4A8;
  --navy:#1F3A4D;
  --navy-deep:#152836;
  --text:#2A2A2A;
  --sub-text:#5A6A75;
  --bg:#FFFFFF;
  --bg-alt:#F7FAFC;
  --border:#E3ECF1;
  --placeholder:#D9DEE3;
  --placeholder-text:#8A95A0;
  --shadow-sm:0 4px 12px rgba(31,58,77,0.06);
  --shadow-md:0 12px 32px rgba(31,58,77,0.10);
  --shadow-lg:0 24px 64px rgba(31,58,77,0.15);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.8;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* ========== ヘッダー ========== */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(255,255,255,0.85);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid transparent;
  transition:all .5s cubic-bezier(.22,.61,.36,1);
}
header.scrolled{
  background:rgba(255,255,255,0.97);
  border-bottom-color:var(--border);
  box-shadow:0 2px 24px rgba(31,58,77,0.06);
}
.header-inner{
  max-width:1200px;margin:0 auto;
  padding:20px 32px;
  display:flex;align-items:center;justify-content:space-between;
  transition:padding .5s;
  position:relative;
}
header.scrolled .header-inner{padding:14px 32px;}
.logo{
  display:flex;flex-direction:column;
  cursor:pointer;transition:transform .3s;
}
.logo a{display:flex;flex-direction:column;}
.logo:hover{transform:translateY(-1px);}
.logo-main{
  font-size:20px;font-weight:700;
  color:var(--navy);letter-spacing:0.08em;
  transition:color .3s;
}
.logo:hover .logo-main{color:var(--main-deep);}
.logo-sub{
  font-size:11px;color:var(--gold-deep);
  letter-spacing:0.2em;margin-top:2px;
}
nav ul{
  display:flex;gap:36px;list-style:none;
}
nav a{
  font-size:14px;font-weight:500;
  color:var(--text);
  padding:8px 0;
  position:relative;
  transition:color .3s;
}
nav a::before{
  content:"";position:absolute;left:50%;bottom:-4px;
  width:0;height:2px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold));
  transition:all .4s cubic-bezier(.22,.61,.36,1);
  transform:translateX(-50%);
}
nav a:hover{color:var(--main-deep);}
nav a:hover::before{width:100%;}
nav ul li.current-menu-item > a,
nav ul li.current_page_item > a{color:var(--main-deep);}
nav ul li.current-menu-item > a::before,
nav ul li.current_page_item > a::before{width:100%;}

.header-cta{
  display:inline-block;
  background:var(--navy);color:#fff;
  padding:13px 26px;border-radius:2px;
  font-size:13px;font-weight:500;
  letter-spacing:0.05em;
  position:relative;overflow:hidden;
  transition:all .4s;
}
.header-cta::before{
  content:"";position:absolute;top:0;left:-100%;
  width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(201,169,106,0.4),transparent);
  transition:left .6s;
}
.header-cta:hover{
  background:var(--gold-deep);
  box-shadow:0 8px 20px rgba(201,169,106,0.35);
  transform:translateY(-1px);
}
.header-cta:hover::before{left:100%;}
.nav-drawer-cta{display:none;}

/* ハンバーガーメニュー（デスクトップでは非表示） */
.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:32px;height:32px;
  background:none;border:none;cursor:pointer;
  padding:0;
  position:relative;
  z-index:110;
}
.nav-toggle span{
  display:block;width:100%;height:2px;
  background:var(--navy);
  transition:all .3s cubic-bezier(.22,.61,.36,1);
}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.active span:nth-child(2){opacity:0;}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav-backdrop{
  display:none;
  position:fixed;inset:0;
  background:rgba(21,40,54,0.4);
  z-index:90;
  opacity:0;
  transition:opacity .4s;
}
.nav-backdrop.open{display:block;opacity:1;}

/* ========== 共通 ========== */
.container{max-width:1200px;margin:0 auto;padding:0 32px;}
.section{padding:120px 0;}
.section-alt{background:var(--bg-alt);}

.section-title{
  text-align:center;margin-bottom:72px;
}
.section-title .en{
  display:block;
  color:var(--gold-deep);
  font-size:13px;letter-spacing:0.35em;
  font-weight:500;margin-bottom:14px;
  opacity:0;transform:translateY(20px);
  transition:all .8s cubic-bezier(.22,.61,.36,1);
}
.section-title h2{
  font-size:34px;color:var(--navy);
  font-weight:700;letter-spacing:0.05em;
  opacity:0;transform:translateY(20px);
  transition:all .8s .15s cubic-bezier(.22,.61,.36,1);
}
.section-title .line{
  width:0;height:2px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--gold-light));
  margin:24px auto 0;
  transition:width 1s .4s cubic-bezier(.22,.61,.36,1);
}
.section-title.in-view .en,
.section-title.in-view h2{opacity:1;transform:translateY(0);}
.section-title.in-view .line{width:60px;}

/* スクロールフェードイン汎用 */
.fade-up{
  opacity:0;transform:translateY(40px);
  transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);
}
.fade-up.in-view{opacity:1;transform:translateY(0);}
.fade-up.d1{transition-delay:.1s;}
.fade-up.d2{transition-delay:.2s;}
.fade-up.d3{transition-delay:.3s;}
.fade-up.d4{transition-delay:.4s;}

/* プレースホルダー画像 */
.img-placeholder{
  background:
    linear-gradient(135deg,rgba(255,255,255,0.4) 0%,transparent 40%,transparent 60%,rgba(31,58,77,0.05) 100%),
    var(--placeholder);
  color:var(--placeholder-text);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;letter-spacing:0.15em;
  font-weight:500;
  position:relative;overflow:hidden;
}
.img-placeholder::before{
  content:"";position:absolute;top:0;left:-100%;
  width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.25),transparent);
  transform:skewX(-20deg);
  animation:shimmer 4s infinite;
}
@keyframes shimmer{
  0%{left:-100%;}
  50%,100%{left:150%;}
}

/* 実写真が入るプレースホルダー（シマー演出・背景色を無効化し、写真をcoverで表示） */
.img-placeholder.has-photo{background:none;}
.img-placeholder.has-photo::before{display:none;}
.img-placeholder.has-photo img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
/* テキストを含む画像など、トリミングせず全体を見せたい場合の修飾クラス */
.img-placeholder.has-photo.contain{background:var(--navy);}
.img-placeholder.has-photo.contain img{object-fit:contain;}

/* Googleマップ埋め込み用（シマー演出・背景色を無効化し、iframeをコンテナいっぱいに表示） */
.img-placeholder.has-map{background:none;}
.img-placeholder.has-map::before{display:none;}
.img-placeholder.has-map iframe{
  width:100%;height:100%;
  display:block;
}

/* ========== TOPページ ========== */
.hero{
  position:relative;
  min-height:100vh;
  padding-top:100px;
  background:
    radial-gradient(ellipse at top right,rgba(94,199,229,0.15),transparent 60%),
    radial-gradient(ellipse at bottom left,rgba(201,169,106,0.08),transparent 60%),
    linear-gradient(135deg,var(--main-soft) 0%,#F5F9FB 100%);
  overflow:hidden;
  display:flex;align-items:center;
}
.hero::before{
  content:"";position:absolute;
  top:20%;right:-5%;
  width:400px;height:400px;
  border:1px solid rgba(201,169,106,0.15);
  border-radius:50%;
  animation:floatRotate 20s linear infinite;
}
.hero::after{
  content:"";position:absolute;
  bottom:10%;left:-8%;
  width:300px;height:300px;
  border:1px solid rgba(94,199,229,0.2);
  border-radius:50%;
  animation:floatRotate 25s linear infinite reverse;
}
@keyframes floatRotate{
  from{transform:rotate(0);}
  to{transform:rotate(360deg);}
}
.hero-inner{
  max-width:1200px;margin:0 auto;
  padding:0 32px;width:100%;
  display:grid;grid-template-columns:1fr 1fr;gap:60px;
  align-items:center;
  position:relative;z-index:2;
}
.hero-copy .tag{
  display:inline-block;
  color:var(--gold-deep);
  font-size:12px;letter-spacing:0.3em;
  border-left:2px solid var(--gold);
  padding-left:14px;margin-bottom:28px;
  opacity:0;
  animation:slideInLeft 1s .3s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes slideInLeft{
  from{opacity:0;transform:translateX(-20px);}
  to{opacity:1;transform:translateX(0);}
}
.hero-copy h1{
  font-size:48px;line-height:1.5;
  color:var(--navy);font-weight:700;
  letter-spacing:0.02em;margin-bottom:32px;
  opacity:0;
  animation:fadeInUp 1s .5s cubic-bezier(.22,.61,.36,1) forwards;
}
.hero-copy h1 .accent{
  color:var(--main-deep);
  position:relative;
  display:inline-block;
}
.hero-copy h1 .accent::after{
  content:"";position:absolute;
  left:0;bottom:-4px;width:100%;height:2px;
  background:var(--gold);
  transform:scaleX(0);transform-origin:left;
  animation:lineExpand 1.2s 1.4s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes lineExpand{to{transform:scaleX(1);}}
@keyframes fadeInUp{
  from{opacity:0;transform:translateY(24px);}
  to{opacity:1;transform:translateY(0);}
}
.hero-copy p{
  color:var(--sub-text);font-size:15px;
  margin-bottom:44px;line-height:2;
  opacity:0;
  animation:fadeInUp 1s .7s cubic-bezier(.22,.61,.36,1) forwards;
}
.btn-group{
  display:flex;gap:16px;
  opacity:0;
  animation:fadeInUp 1s .9s cubic-bezier(.22,.61,.36,1) forwards;
}
.btn{
  display:inline-block;padding:17px 40px;
  font-size:14px;font-weight:500;letter-spacing:0.1em;
  border-radius:2px;cursor:pointer;
  border:none;
  position:relative;overflow:hidden;
  transition:all .4s cubic-bezier(.22,.61,.36,1);
}
.btn::before{
  content:"";position:absolute;top:0;left:-100%;
  width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);
  transition:left .7s;
}
.btn:hover::before{left:100%;}
.btn-primary{
  background:var(--main-deep);color:#fff;
  box-shadow:0 6px 16px rgba(47,165,201,0.25);
}
.btn-primary:hover{
  background:var(--navy);
  box-shadow:0 12px 28px rgba(31,58,77,0.30);
  transform:translateY(-2px);
}
.btn-outline{
  background:transparent;color:var(--navy);
  border:1px solid var(--navy);
}
.btn-outline:hover{
  background:var(--navy);color:#fff;
  box-shadow:0 12px 28px rgba(31,58,77,0.25);
  transform:translateY(-2px);
}

.hero-visual{
  height:520px;
  position:relative;
  opacity:0;
  animation:fadeInRight 1.2s .6s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes fadeInRight{
  from{opacity:0;transform:translateX(30px);}
  to{opacity:1;transform:translateX(0);}
}
.hero-visual .img-placeholder{
  height:100%;width:100%;
  border:none;
  background:none;
  z-index:1;
}
.hero-visual .img-placeholder::after{
  content:"";position:absolute;
  top:50%;left:50%;transform:translate(-50%,-50%);
  width:88%;height:88%;
  border-radius:50%;
  background:#F5F9FB;
  z-index:-1;
}
.hero-visual .img-placeholder img{
  position:relative;z-index:1;
  object-fit:contain;
}
.hero-visual::after{
  content:"";position:absolute;
  right:-24px;bottom:-24px;
  width:60%;height:60%;
  border:2px solid var(--gold);
  z-index:-1;
  animation:frameFloat 6s ease-in-out infinite;
}
@keyframes frameFloat{
  0%,100%{transform:translate(0,0);}
  50%{transform:translate(-8px,-8px);}
}

/* スクロールインジケーター */
.scroll-indicator{
  position:absolute;bottom:32px;left:50%;
  transform:translateX(-50%);
  color:var(--navy);font-size:10px;
  letter-spacing:0.3em;
  opacity:0;
  animation:fadeIn 1s 1.5s forwards;
}
@keyframes fadeIn{to{opacity:0.6;}}
.scroll-indicator::after{
  content:"";display:block;
  width:1px;height:40px;
  background:var(--navy);
  margin:12px auto 0;
  animation:scrollLine 2s infinite;
}
@keyframes scrollLine{
  0%{transform:scaleY(0);transform-origin:top;}
  50%{transform:scaleY(1);transform-origin:top;}
  51%{transform-origin:bottom;}
  100%{transform:scaleY(0);transform-origin:bottom;}
}

/* 強みセクション */
.strengths{
  display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
}
.strength-card{
  background:#fff;padding:56px 36px;
  border:1px solid var(--border);
  position:relative;overflow:hidden;
  transition:all .5s cubic-bezier(.22,.61,.36,1);
}
.strength-card::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold));
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s cubic-bezier(.22,.61,.36,1);
}
.strength-card::after{
  content:"";position:absolute;
  top:0;right:0;width:0;height:0;
  border-style:solid;border-width:0 40px 40px 0;
  border-color:transparent var(--main-soft) transparent transparent;
  opacity:0;transition:opacity .4s;
}
.strength-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-md);
  border-color:transparent;
}
.strength-card:hover::before{transform:scaleX(1);}
.strength-card:hover::after{opacity:1;}
.strength-card .num{
  color:var(--gold);
  font-size:14px;letter-spacing:0.25em;
  font-weight:600;margin-bottom:24px;
  transition:transform .4s;
}
.strength-card:hover .num{transform:translateX(4px);}
.strength-card h3{
  font-size:20px;color:var(--navy);
  margin-bottom:18px;line-height:1.6;
}
.strength-card p{
  color:var(--sub-text);font-size:14px;
  line-height:1.9;
}

/* サービス概要 */
.services-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
}
.service-card{
  display:block;
  background:#fff;border:1px solid var(--border);
  overflow:hidden;cursor:pointer;
  transition:all .5s cubic-bezier(.22,.61,.36,1);
  position:relative;
}
.service-card::after{
  content:"";position:absolute;
  bottom:0;left:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--main),var(--gold));
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s cubic-bezier(.22,.61,.36,1);
}
.service-card:hover{
  box-shadow:var(--shadow-md);
  transform:translateY(-8px);
}
.service-card:hover::after{transform:scaleX(1);}
.service-card .img-placeholder{
  height:240px;width:100%;
  transition:transform .8s cubic-bezier(.22,.61,.36,1);
}
.service-card:hover .img-placeholder{transform:scale(1.05);}
.service-card-body{padding:36px 32px;position:relative;}
.service-card .cat{
  color:var(--gold-deep);font-size:11px;
  letter-spacing:0.28em;margin-bottom:12px;
}
.service-card h3{
  font-size:20px;color:var(--navy);
  margin-bottom:16px;
  transition:color .3s;
}
.service-card:hover h3{color:var(--main-deep);}
.service-card p{
  font-size:14px;color:var(--sub-text);
  line-height:1.9;
}
.service-card .arrow{
  position:absolute;right:32px;bottom:36px;
  width:24px;height:1px;background:var(--navy);
  transition:width .4s;
}
.service-card .arrow::after{
  content:"";position:absolute;right:0;top:-3px;
  width:8px;height:8px;
  border-top:1px solid var(--navy);
  border-right:1px solid var(--navy);
  transform:rotate(45deg);
  transition:border-color .4s;
}
.service-card:hover .arrow{width:48px;background:var(--gold);}
.service-card:hover .arrow::after{border-color:var(--gold);}

/* 会社概要ダイジェスト */
.about-digest{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;
  align-items:center;
}
.about-digest .img-wrap{
  position:relative;height:460px;
}
.about-digest .img-wrap.banner-photo{
  height:auto;
  aspect-ratio:3/2;
}
.about-digest .img-placeholder{
  height:100%;width:100%;
  box-shadow:var(--shadow-md);
}
.about-digest .img-wrap::before{
  content:"";position:absolute;
  left:-24px;top:-24px;
  width:100%;height:100%;
  border:2px solid var(--gold);
  z-index:-1;
  transition:transform .5s;
}
.about-digest:hover .img-wrap::before{transform:translate(-8px,-8px);}
.about-digest .en{
  color:var(--gold-deep);
  font-size:13px;letter-spacing:0.35em;
  margin-bottom:16px;
}
.about-digest h2{
  font-size:32px;color:var(--navy);
  margin-bottom:28px;line-height:1.5;
}
.about-digest p{
  color:var(--sub-text);margin-bottom:18px;
  line-height:2;
}
.about-stats{
  display:flex;gap:48px;margin-top:40px;
  padding-top:36px;border-top:1px solid var(--border);
}
.stat .num{
  font-size:42px;font-weight:700;
  color:var(--main-deep);letter-spacing:0.02em;
  line-height:1;
  background:linear-gradient(135deg,var(--main-deep),var(--navy));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.stat .num .unit{
  font-size:16px;color:var(--sub-text);
  margin-left:4px;font-weight:500;
  -webkit-text-fill-color:var(--sub-text);
}
.stat .label{
  font-size:12px;color:var(--sub-text);
  letter-spacing:0.15em;margin-top:8px;
}

/* ========== TOP採用バナー ========== */
.recruit-banner{
  position:relative;
  padding:0;
  overflow:hidden;
}
.recruit-banner-inner{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:420px;
}
.recruit-banner-visual{
  background:
    linear-gradient(135deg,rgba(31,58,77,0.55),rgba(21,40,54,0.75)),
    linear-gradient(135deg,var(--main-deep) 0%,var(--navy) 100%);
  position:relative;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.recruit-banner-visual::before{
  content:"RECRUIT";
  position:absolute;
  font-size:160px;font-weight:900;
  color:rgba(255,255,255,0.06);
  letter-spacing:0.1em;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  white-space:nowrap;
  line-height:1;
}
.recruit-banner-visual::after{
  content:"";position:absolute;
  top:-100px;right:-100px;
  width:300px;height:300px;
  border:1px solid rgba(201,169,106,0.35);
  border-radius:50%;
  animation:floatRotate 25s linear infinite;
}
.recruit-banner-visual .rb-label{
  position:relative;z-index:2;
  color:var(--gold);font-size:14px;
  letter-spacing:0.4em;font-weight:600;
}
.recruit-banner-content{
  background:linear-gradient(135deg,var(--main-soft) 0%,#F5F9FB 100%);
  padding:80px 60px;
  display:flex;flex-direction:column;justify-content:center;
  position:relative;
}
.recruit-banner-content::before{
  content:"";position:absolute;
  top:40px;left:0;width:3px;height:80px;
  background:linear-gradient(180deg,var(--gold-light),var(--gold));
}
.recruit-banner-content .en{
  color:var(--gold-deep);font-size:13px;
  letter-spacing:0.35em;margin-bottom:16px;
}
.recruit-banner-content h2{
  font-size:32px;color:var(--navy);
  margin-bottom:24px;line-height:1.5;
  font-weight:700;
}
.recruit-banner-content h2 .accent{color:var(--main-deep);}
.recruit-banner-content p{
  color:var(--sub-text);line-height:2;
  margin-bottom:32px;font-size:14px;
}
.recruit-banner-content .btn{align-self:flex-start;}

/* CTAバナー */
.cta-banner{
  background:
    radial-gradient(ellipse at top,rgba(201,169,106,0.15),transparent 60%),
    linear-gradient(135deg,var(--navy) 0%,var(--navy-deep) 100%);
  color:#fff;padding:100px 0;text-align:center;
  position:relative;overflow:hidden;
}
.cta-banner::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.cta-banner::after{
  content:"";position:absolute;
  right:-100px;bottom:-100px;
  width:400px;height:400px;
  border:1px solid rgba(201,169,106,0.15);
  border-radius:50%;
  animation:floatRotate 30s linear infinite;
}
.cta-banner .container{position:relative;z-index:2;}
.cta-banner h2{
  font-size:30px;margin-bottom:18px;
  letter-spacing:0.05em;
}
.cta-banner p{
  font-size:14px;opacity:0.85;margin-bottom:36px;
}
.cta-banner .btn-primary{
  background:var(--gold);color:var(--navy);font-weight:600;
  box-shadow:0 8px 20px rgba(201,169,106,0.35);
}
.cta-banner .btn-primary:hover{
  background:#fff;
  box-shadow:0 14px 32px rgba(255,255,255,0.25);
}

/* ========== 事業内容ページ ========== */
.page-hero{
  background:
    radial-gradient(ellipse at top,rgba(94,199,229,0.15),transparent 60%),
    linear-gradient(135deg,var(--main-soft) 0%,#F5F9FB 100%);
  padding:180px 0 100px;text-align:center;
  position:relative;overflow:hidden;
}
.page-hero::before{
  content:"";position:absolute;
  top:-100px;right:-100px;
  width:300px;height:300px;
  border:1px solid rgba(201,169,106,0.2);
  border-radius:50%;
  animation:floatRotate 25s linear infinite;
}
.page-hero .en{
  color:var(--gold-deep);
  font-size:13px;letter-spacing:0.35em;margin-bottom:14px;
  animation:fadeInUp .8s .2s cubic-bezier(.22,.61,.36,1) backwards;
}
.page-hero h1{
  font-size:40px;color:var(--navy);
  letter-spacing:0.05em;
  animation:fadeInUp .8s .4s cubic-bezier(.22,.61,.36,1) backwards;
}
.page-hero .lead{
  max-width:720px;margin:24px auto 0;
  color:var(--sub-text);
  font-size:15px;line-height:2;
  animation:fadeInUp .8s .6s cubic-bezier(.22,.61,.36,1) backwards;
}
.breadcrumb{
  max-width:1200px;margin:0 auto;
  padding:20px 32px;font-size:12px;
  color:var(--sub-text);letter-spacing:0.05em;
}
.breadcrumb a{
  color:var(--main-deep);
  transition:color .3s;
  position:relative;
}
.breadcrumb a:hover{color:var(--gold-deep);}
.breadcrumb span{margin:0 10px;color:var(--placeholder-text);}

.service-detail{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;
  align-items:center;margin-bottom:120px;
}
.service-detail:last-child{margin-bottom:0;}
.service-detail.reverse{direction:rtl;}
.service-detail.reverse > *{direction:ltr;}
.service-detail .img-wrap{
  position:relative;height:440px;
}
.service-detail .img-placeholder{
  height:100%;width:100%;
  box-shadow:var(--shadow-md);
  transition:transform .6s;
}
.service-detail .img-wrap::before{
  content:"";position:absolute;
  left:-24px;bottom:-24px;
  width:60%;height:60%;
  border:2px solid var(--gold);
  z-index:-1;
  transition:transform .5s;
}
.service-detail:hover .img-wrap::before{transform:translate(-8px,8px);}
.service-detail .en{
  color:var(--gold-deep);font-size:13px;
  letter-spacing:0.35em;margin-bottom:16px;
}
.service-detail h2{
  font-size:32px;color:var(--navy);
  margin-bottom:28px;
  padding-bottom:20px;
  position:relative;
  display:inline-block;
}
.service-detail h2::after{
  content:"";position:absolute;
  left:0;bottom:0;width:60px;height:2px;
  background:var(--gold);
  transition:width .5s;
}
.service-detail:hover h2::after{width:100%;}
.service-detail p{
  color:var(--sub-text);margin-bottom:20px;
  line-height:2;
}
.service-detail ul{
  list-style:none;margin-top:28px;
}
.service-detail ul li{
  padding:12px 0 12px 28px;
  position:relative;
  border-bottom:1px dashed var(--border);
  font-size:14px;color:var(--text);
  transition:padding-left .3s,color .3s;
}
.service-detail ul li:hover{
  padding-left:36px;color:var(--main-deep);
}
.service-detail ul li::before{
  content:"";position:absolute;
  left:0;top:22px;
  width:14px;height:2px;background:var(--gold);
  transition:width .3s;
}
.service-detail ul li:hover::before{width:22px;}

/* 施工フロー */
.flow{
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:20px;position:relative;
}
.flow-item{
  background:#fff;padding:36px 20px;text-align:center;
  border:1px solid var(--border);
  position:relative;
  transition:all .4s cubic-bezier(.22,.61,.36,1);
}
.flow-item:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-md);
  border-color:var(--main);
}
.flow-item .step{
  display:inline-block;
  background:var(--main);color:#fff;
  padding:5px 18px;font-size:11px;letter-spacing:0.15em;
  margin-bottom:18px;border-radius:2px;
  transition:background .3s;
}
.flow-item:hover .step{background:var(--gold);}
.flow-item h4{
  color:var(--navy);font-size:16px;
  margin-bottom:12px;
}
.flow-item p{
  font-size:12px;color:var(--sub-text);
  line-height:1.7;
}
.flow-item:not(:last-child)::after{
  content:"›";position:absolute;
  right:-18px;top:50%;transform:translateY(-50%);
  color:var(--gold);font-size:28px;font-weight:300;
  z-index:2;
  transition:transform .3s;
}
.flow-item:hover:not(:last-child)::after{
  transform:translateY(-50%) translateX(4px);
}

/* ========== 会社概要ページ ========== */
.company-intro{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;
  align-items:flex-start;
}
.company-intro .img-wrap{
  position:relative;height:500px;
  position:sticky;top:120px;
}
.company-intro .img-placeholder{
  height:100%;width:100%;
  box-shadow:var(--shadow-md);
}
.company-intro .img-wrap::before{
  content:"";position:absolute;
  right:-24px;top:-24px;
  width:100%;height:100%;
  border:2px solid var(--gold);
  z-index:-1;
  transition:transform .5s;
}
.company-intro:hover .img-wrap::before{transform:translate(8px,-8px);}
.company-intro .en{
  color:var(--gold-deep);font-size:13px;
  letter-spacing:0.35em;margin-bottom:16px;
}
.company-intro h2{
  font-size:32px;color:var(--navy);
  margin-bottom:32px;line-height:1.5;
}
.company-intro h2 .accent{color:var(--main-deep);}
.company-intro p{
  color:var(--sub-text);margin-bottom:22px;line-height:2;
}
.company-intro .quote{
  font-size:22px;color:var(--navy);
  font-weight:600;letter-spacing:0.05em;
  padding:24px 0 24px 24px;margin:32px 0;
  border-left:3px solid var(--gold);
  line-height:1.7;
  background:linear-gradient(90deg,var(--main-soft),transparent);
}
.signature{
  margin-top:40px;padding-top:32px;
  border-top:1px solid var(--border);
  display:flex;justify-content:flex-end;align-items:baseline;gap:18px;
}
.signature .role{font-size:13px;color:var(--sub-text);}
.signature .name{
  font-size:22px;color:var(--navy);
  font-weight:600;letter-spacing:0.12em;
}

/* 企業理念セクション */
.philosophy{
  background:#fff;
  padding:64px 56px;
  border:1px solid var(--border);
  border-left:4px solid var(--gold);
  box-shadow:var(--shadow-sm);
  position:relative;
  max-width:960px;
  margin:0 auto;
}
.philosophy .en{
  color:var(--gold-deep);font-size:13px;
  letter-spacing:0.35em;margin-bottom:16px;
}
.philosophy h3{
  font-size:28px;color:var(--navy);
  margin-bottom:28px;line-height:1.5;
}
.philosophy h3 .accent{color:var(--main-deep);}
.philosophy p{
  color:var(--sub-text);line-height:2;
  margin-bottom:18px;
}

/* 会社データ */
.company-table{
  width:100%;border-collapse:collapse;
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.company-table tr{
  transition:background .3s;
}
.company-table tr:hover{background:var(--main-soft);}
.company-table th,
.company-table td{
  padding:26px 30px;text-align:left;
  border-bottom:1px solid var(--border);
  font-size:14px;
}
.company-table th{
  width:220px;background:var(--bg-alt);
  color:var(--navy);font-weight:600;
  letter-spacing:0.12em;
  position:relative;
}
.company-table th::before{
  content:"";position:absolute;
  left:0;top:50%;
  width:3px;height:0;background:var(--gold);
  transform:translateY(-50%);
  transition:height .3s;
}
.company-table tr:hover th::before{height:60%;}
.company-table td{color:var(--text);line-height:1.9;}

/* 沿革 */
.history{
  max-width:820px;margin:0 auto;
  position:relative;
}
.history::before{
  content:"";position:absolute;
  left:90px;top:24px;bottom:24px;
  width:1px;background:var(--border);
}
.history-item{
  display:grid;grid-template-columns:180px 1fr;gap:40px;
  padding:28px 0;
  position:relative;
  transition:transform .3s;
}
.history-item:hover{transform:translateX(4px);}
.history-item::before{
  content:"";position:absolute;
  left:86px;top:36px;
  width:9px;height:9px;
  background:#fff;border:2px solid var(--gold);
  border-radius:50%;z-index:2;
  transition:all .4s;
}
.history-item:hover::before{
  background:var(--gold);
  transform:scale(1.4);
  box-shadow:0 0 0 6px rgba(201,169,106,0.15);
}
.history-item .year{
  color:var(--main-deep);font-weight:600;
  font-size:16px;letter-spacing:0.05em;
}
.history-item .content h4{
  color:var(--navy);font-size:16px;margin-bottom:8px;
  transition:color .3s;
}
.history-item:hover .content h4{color:var(--main-deep);}
.history-item .content p{
  color:var(--sub-text);font-size:14px;
}

/* アクセス */
.access-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:60px;
}
.access-grid .img-placeholder{
  height:400px;box-shadow:var(--shadow-md);
}
.access-info h3{
  color:var(--navy);font-size:24px;margin-bottom:24px;
  padding-bottom:16px;
  position:relative;
  display:inline-block;
}
.access-info h3::after{
  content:"";position:absolute;
  left:0;bottom:0;width:60px;height:2px;
  background:var(--gold);
}
.access-info dl{margin-top:12px;}
.access-info dt{
  color:var(--gold-deep);font-size:12px;
  letter-spacing:0.2em;margin-top:24px;
}
.access-info dd{
  color:var(--text);font-size:15px;
  padding:8px 0;line-height:1.8;
}

/* ========== 採用ページ ========== */
.recruit-message{
  display:grid;grid-template-columns:1.15fr 1fr;gap:80px;
  align-items:flex-start;
}
.recruit-message .img-wrap{
  position:relative;height:520px;
  position:sticky;top:120px;
}
.recruit-message .img-wrap.banner-photo{
  height:auto;
  aspect-ratio:3/2;
}
.recruit-message .img-placeholder{
  height:100%;width:100%;
  box-shadow:var(--shadow-md);
}
.recruit-message .img-wrap::before{
  content:"";position:absolute;
  left:-24px;bottom:-24px;
  width:70%;height:70%;
  border:2px solid var(--gold);
  z-index:-1;
  transition:transform .5s;
}
.recruit-message:hover .img-wrap::before{transform:translate(-8px,8px);}
.recruit-message .en{
  color:var(--gold-deep);font-size:13px;
  letter-spacing:0.35em;margin-bottom:16px;
}
.recruit-message h2{
  font-size:32px;color:var(--navy);
  margin-bottom:32px;line-height:1.5;
}
.recruit-message h2 .accent{color:var(--main-deep);}
.recruit-message p{
  color:var(--sub-text);line-height:2;
  margin-bottom:22px;
}
.recruit-message .highlight{
  font-size:20px;color:var(--navy);
  font-weight:600;letter-spacing:0.05em;
  padding:22px 0 22px 24px;margin:32px 0;
  border-left:3px solid var(--gold);
  line-height:1.8;
  background:linear-gradient(90deg,var(--main-soft),transparent);
}

/* 働く魅力 */
.attractions{
  display:grid;grid-template-columns:repeat(2,1fr);gap:40px;
}
.attraction-card{
  background:#fff;padding:64px 52px;
  border:1px solid var(--border);
  position:relative;overflow:hidden;
  transition:all .5s cubic-bezier(.22,.61,.36,1);
}
.attraction-photo{
  position:absolute;
  top:32px;right:32px;
  width:150px;height:112px;
  object-fit:contain;
  background:#fff;
  border:1px solid var(--border);
  border-radius:2px;
  box-shadow:0 14px 28px rgba(31,58,77,0.16);
  z-index:1;
}
.attraction-card .num{
  position:relative;z-index:2;
}
.attraction-card h3{
  position:relative;z-index:2;
  max-width:calc(100% - 190px);
}
.attraction-card::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--gold-light));
  transform:scaleX(0);transform-origin:left;
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}
.attraction-card::after{
  content:"";position:absolute;
  right:-40px;bottom:-40px;
  width:180px;height:180px;
  border:1px solid rgba(201,169,106,0.15);
  border-radius:50%;
  transition:transform .6s;
}
.attraction-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-md);
}
.attraction-card:hover::before{transform:scaleX(1);}
.attraction-card:hover::after{
  transform:scale(1.15) rotate(30deg);
  border-color:rgba(201,169,106,0.35);
}
.attraction-card .num{
  display:inline-block;
  color:var(--gold);
  font-size:48px;font-weight:700;
  line-height:1;letter-spacing:0.02em;
  margin-bottom:20px;
  font-family:"Georgia",serif;
  position:relative;
}
.attraction-card .num::after{
  content:"";position:absolute;
  left:0;bottom:-8px;width:40px;height:2px;
  background:var(--gold);
  transition:width .4s;
}
.attraction-card:hover .num::after{width:80px;}
.attraction-card h3{
  font-size:22px;color:var(--navy);
  margin-bottom:20px;line-height:1.6;
  position:relative;z-index:2;
}
.attraction-card p{
  color:var(--sub-text);line-height:2;
  font-size:14px;position:relative;z-index:2;
}

/* 募集要項テーブル */
.job-tabs{
  display:flex;gap:12px;justify-content:center;
  margin-bottom:40px;flex-wrap:wrap;
}
.job-tab{
  padding:14px 32px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--sub-text);
  font-size:14px;font-weight:500;
  letter-spacing:0.1em;
  cursor:pointer;
  border-radius:2px;
  transition:all .3s;
  position:relative;
}
.job-tab:hover{
  color:var(--main-deep);
  border-color:var(--main);
}
.job-tab.active{
  background:var(--navy);color:#fff;
  border-color:var(--navy);
  box-shadow:0 6px 16px rgba(31,58,77,0.15);
}
.job-tab.active::after{
  content:"";position:absolute;
  bottom:-8px;left:50%;
  transform:translateX(-50%);
  width:0;height:0;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-top:6px solid var(--navy);
}
.job-panel{
  display:none;
  animation:fadeIn2 .5s cubic-bezier(.22,.61,.36,1);
}
.job-panel.active{display:block;}
@keyframes fadeIn2{
  from{opacity:0;transform:translateY(12px);}
  to{opacity:1;transform:translateY(0);}
}
.job-header{
  background:linear-gradient(135deg,var(--navy) 0%,var(--navy-deep) 100%);
  color:#fff;padding:32px 40px;
  display:flex;justify-content:space-between;align-items:center;
  position:relative;overflow:hidden;
}
.job-header::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--gold-light));
}
.job-header .job-cat{
  color:var(--gold);font-size:12px;
  letter-spacing:0.3em;margin-bottom:8px;
}
.job-header h3{
  font-size:24px;letter-spacing:0.05em;
}
.job-header .job-type{
  background:var(--gold);color:var(--navy);
  padding:8px 20px;font-size:12px;font-weight:600;
  letter-spacing:0.1em;border-radius:2px;
}
.job-table{
  width:100%;border-collapse:collapse;
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.job-table tr{transition:background .3s;}
.job-table tr:hover{background:var(--main-soft);}
.job-table th,
.job-table td{
  padding:24px 30px;text-align:left;
  border-bottom:1px solid var(--border);
  font-size:14px;
  vertical-align:top;
}
.job-table th{
  width:200px;background:var(--bg-alt);
  color:var(--navy);font-weight:600;
  letter-spacing:0.12em;
  position:relative;
}
.job-table th::before{
  content:"";position:absolute;
  left:0;top:50%;
  width:3px;height:0;background:var(--gold);
  transform:translateY(-50%);
  transition:height .3s;
}
.job-table tr:hover th::before{height:60%;}
.job-table td{color:var(--text);line-height:1.9;}
.job-table td ul{list-style:none;padding:0;}
.job-table td ul li{
  padding:4px 0 4px 18px;position:relative;
}
.job-table td ul li::before{
  content:"";position:absolute;
  left:0;top:14px;
  width:8px;height:1px;background:var(--gold);
}

/* ========== お問い合わせページ ========== */
.contact-lead{
  max-width:720px;margin:0 auto 72px;
  text-align:center;color:var(--sub-text);
  line-height:2;
}
.contact-methods{
  display:grid;grid-template-columns:repeat(2,1fr);gap:32px;
  margin-bottom:80px;
}
.contact-method{
  background:#fff;padding:56px 44px;
  border:1px solid var(--border);text-align:center;
  position:relative;
  transition:all .5s cubic-bezier(.22,.61,.36,1);
  overflow:hidden;
}
.contact-method::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--gold-light));
  transform:scaleX(0);transform-origin:center;
  transition:transform .5s;
}
.contact-method:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-md);
}
.contact-method:hover::before{transform:scaleX(1);}
.contact-method .label{
  color:var(--gold-deep);font-size:12px;
  letter-spacing:0.28em;margin-bottom:18px;
}
.contact-method h3{
  font-size:26px;color:var(--navy);
  margin-bottom:14px;letter-spacing:0.05em;
}
.contact-method .tel{
  font-size:34px;color:var(--main-deep);
  font-weight:700;letter-spacing:0.05em;
  margin:12px 0;
  background:linear-gradient(135deg,var(--main-deep),var(--navy));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.contact-method p{
  color:var(--sub-text);font-size:13px;
}

.contact-form{
  max-width:800px;margin:0 auto;
  background:#fff;padding:64px 64px;
  border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  position:relative;
}
.contact-form::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:3px;
  background:linear-gradient(90deg,var(--main),var(--gold));
}
.contact-form .cf7-missing{
  color:var(--sub-text);font-size:14px;line-height:1.9;
}
.form-row{margin-bottom:30px;}
.form-row label{
  display:block;font-size:13px;
  color:var(--navy);font-weight:600;
  letter-spacing:0.1em;margin-bottom:12px;
}
.form-row label .required{
  display:inline-block;
  background:var(--gold);color:#fff;
  font-size:10px;padding:3px 9px;
  margin-left:10px;letter-spacing:0.1em;
  border-radius:2px;
}
.form-row label .any{
  display:inline-block;
  background:var(--border);color:var(--sub-text);
  font-size:10px;padding:3px 9px;
  margin-left:10px;letter-spacing:0.1em;
  border-radius:2px;
}
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row select,
.form-row textarea{
  width:100%;padding:15px 18px;
  border:1px solid var(--border);
  background:var(--bg-alt);
  font-size:14px;font-family:inherit;
  color:var(--text);border-radius:2px;
  transition:all .3s;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{
  outline:none;border-color:var(--main-deep);
  background:#fff;
  box-shadow:0 0 0 4px rgba(94,199,229,0.12);
}
.form-row textarea{resize:vertical;min-height:160px;}
.form-privacy{
  background:var(--bg-alt);padding:22px;
  font-size:12px;color:var(--sub-text);
  line-height:1.9;margin:36px 0;
  border-left:3px solid var(--main);
}
.form-submit{
  text-align:center;margin-top:40px;
}
.form-submit .btn{
  min-width:300px;padding:19px 40px;
  font-size:15px;
}

/* Contact Form 7 標準出力への適用（フォームのHTML自体は本テーマのform-row構造で
   CF7フォームタブに記述する運用。エラーメッセージ等の既定クラスにも最低限のスタイルを当てる */
.wpcf7-not-valid-tip{
  color:#c0392b;font-size:12px;margin-top:8px;
}
.wpcf7-response-output{
  margin:24px 0 0;padding:16px 20px;
  border-radius:2px;font-size:13px;
  border:1px solid var(--border);
}

/* ========== フッター ========== */
footer{
  background:linear-gradient(135deg,var(--navy) 0%,var(--navy-deep) 100%);
  color:#fff;
  padding:72px 0 0;
  position:relative;
}
footer::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.footer-inner{
  max-width:1200px;margin:0 auto;
  padding:0 32px;
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:48px;
}
.footer-brand .logo-main{color:#fff;font-size:22px;}
.footer-brand .logo-sub{color:var(--gold);margin-top:6px;}
.footer-brand p{
  font-size:13px;opacity:0.75;
  line-height:1.9;margin-top:22px;
}
.footer-col h4{
  font-size:13px;color:var(--gold);
  letter-spacing:0.2em;margin-bottom:22px;
  padding-bottom:14px;
  position:relative;
}
.footer-col h4::after{
  content:"";position:absolute;
  left:0;bottom:0;width:30px;height:1px;
  background:var(--gold);
}
.footer-col ul{list-style:none;}
.footer-col li{margin-bottom:14px;}
.footer-col a{
  font-size:13px;opacity:0.8;
  transition:all .3s;
  display:inline-block;position:relative;
}
.footer-col a::before{
  content:"›";
  margin-right:6px;
  color:var(--gold);
  opacity:0;transform:translateX(-8px);
  transition:all .3s;
  display:inline-block;
}
.footer-col a:hover{opacity:1;color:var(--gold);transform:translateX(4px);}
.footer-col a:hover::before{opacity:1;transform:translateX(0);}
.footer-bottom{
  max-width:1200px;margin:60px auto 0;
  padding:26px 32px;
  border-top:1px solid rgba(255,255,255,0.1);
  font-size:12px;opacity:0.6;text-align:center;
  letter-spacing:0.08em;
}

/* ========== レスポンシブ ========== */
@media(max-width:900px){
  .header-inner{padding:14px 20px;}
  header.scrolled .header-inner{padding:12px 20px;}
  .container{padding:0 20px;}
  .section{padding:70px 0;}
  .hero{min-height:auto;padding:120px 0 60px;}
  .hero-inner{grid-template-columns:1fr;gap:40px;}
  .hero-copy h1{font-size:30px;}
  .hero-visual{height:300px;}
  .scroll-indicator{display:none;}
  .strengths,.services-grid,.attractions{grid-template-columns:1fr;}
  .about-digest,.service-detail,.company-intro,.access-grid,.contact-methods,.recruit-message{
    grid-template-columns:1fr;gap:60px;
  }
  .about-digest .img-wrap,.company-intro .img-wrap,.service-detail .img-wrap,.recruit-message .img-wrap{
    height:300px;position:relative;top:0;
  }
  .recruit-message .img-wrap.banner-photo,
  .about-digest .img-wrap.banner-photo{
    height:auto;aspect-ratio:3/2;
  }
  .service-detail.reverse{direction:ltr;}
  .flow{grid-template-columns:1fr;}
  .flow-item:not(:last-child)::after{
    content:"⌄";right:auto;left:50%;top:auto;bottom:-24px;
    transform:translateX(-50%);
  }
  .contact-form{padding:36px 24px;}
  .philosophy{padding:36px 24px;}
  .philosophy h3{font-size:22px;}
  .footer-inner{grid-template-columns:1fr;gap:40px;}
  .company-table th,.job-table th{width:110px;padding:16px;font-size:12px;}
  .company-table td,.job-table td{padding:16px;font-size:13px;}
  .history::before{left:60px;}
  .history-item{grid-template-columns:120px 1fr;gap:20px;}
  .history-item::before{left:56px;}
  .section-title h2{font-size:26px;}
  .page-hero{padding:130px 0 70px;}
  .page-hero h1{font-size:30px;}
  .company-intro .quote{font-size:18px;padding:20px 0 20px 20px;}
  .recruit-banner-inner{grid-template-columns:1fr;}
  .recruit-banner-visual{min-height:200px;}
  .recruit-banner-visual::before{font-size:80px;}
  .recruit-banner-content{padding:50px 30px;}
  .recruit-banner-content h2{font-size:24px;}
  .attraction-card{padding:44px 30px;}
  .attraction-photo{position:static;width:100%;height:auto;object-fit:contain;margin:0 0 24px;display:block;border:1px solid var(--border);border-radius:2px;}
  .attraction-card h3{max-width:100%;}
  .job-tabs{gap:8px;}
  .job-tab{padding:12px 20px;font-size:13px;}
  .job-header{flex-direction:column;align-items:flex-start;gap:14px;padding:24px 24px;}
  .job-header h3{font-size:20px;}
  .recruit-message .highlight{font-size:16px;padding:18px 0 18px 20px;}

  /* モバイル用ハンバーガーメニュー（コードペン版では未対応だった箇所） */
  .nav-toggle{display:flex;}
  .header-cta-desktop{display:none;}
  nav#siteNav{
    position:fixed;top:0;right:-320px;
    width:280px;max-width:80vw;height:100vh;
    background:#fff;
    display:flex;flex-direction:column;
    align-items:flex-start;
    padding:100px 32px 40px;
    box-shadow:-8px 0 32px rgba(31,58,77,0.15);
    transition:right .45s cubic-bezier(.22,.61,.36,1);
    z-index:100;
    overflow-y:auto;
  }
  nav#siteNav.open{right:0;}
  nav#siteNav ul{flex-direction:column;gap:4px;width:100%;}
  nav#siteNav ul li{width:100%;}
  nav#siteNav ul a{display:block;padding:14px 0;width:100%;}
  .nav-drawer-cta{display:inline-block;margin-top:28px;text-align:center;width:100%;}
  body.nav-open{overflow:hidden;}
}

/* 極小画面（コードペン版では未対応だった追加ブレークポイント） */
@media(max-width:480px){
  .container{padding:0 16px;}
  .hero-copy h1{font-size:26px;}
  .hero-copy p{font-size:14px;}
  .btn{padding:15px 26px;font-size:13px;}
  .btn-group{flex-direction:column;gap:12px;}
  .btn-group .btn{width:100%;text-align:center;}
  .section{padding:56px 0;}
  .section-title{margin-bottom:48px;}
  .section-title h2{font-size:22px;}
  .stat .num{font-size:30px;}
  .about-stats{gap:24px;flex-wrap:wrap;}
  .strength-card,.attraction-card{padding:40px 26px;}
  .service-card-body{padding:28px 22px;}
  .contact-method{padding:40px 26px;}
  .contact-method .tel{font-size:26px;}
  .page-hero{padding:110px 0 56px;}
  .page-hero h1{font-size:24px;}
  .company-table th,.job-table th{width:100px;padding:12px;font-size:11px;}
  .company-table td,.job-table td{padding:12px;font-size:12px;}
  .signature{flex-direction:column;align-items:flex-end;gap:6px;}
  .form-submit .btn{min-width:0;width:100%;}
  .recruit-banner-visual::before{font-size:56px;}
}
