/* =========================================================
   シンカ風テーマ：チャコール×白、斜めカット、巨大英字、マーキー
   ========================================================= */
:root{
  --ink:#1E1F21; --sub:#5C6068; --line:#E3E5E8;
  --dark:#2B2C2F; --dark2:#1F2023; --accent:#F5C400; --accent2:#2F7FD8;
  --en:"Montserrat","Inter",sans-serif;
}
body{font-feature-settings:"palt";letter-spacing:.04em}

/* header：白・細い文字・右に2ボタン */
header{position:fixed;left:0;right:0;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:0}
body{padding-top:72px}
.nav{max-width:none;padding:0 32px;gap:24px}
.brand img{height:38px}
.menu{margin-left:auto;gap:2px;font-size:12.5px;font-weight:500}
.menu a{padding:8px 12px;border-radius:0}
.menu .en-sub{display:none}
.menu a:not(.cta):hover{background:none;color:var(--accent2)}
.menu a.current{color:var(--ink)}
.menu a.current::after{left:12px;right:12px;bottom:0;height:2px;background:var(--accent2)}
.nav-cta{display:flex;gap:8px}
.nav-cta a{font-size:12px;font-weight:700;padding:9px 18px;border-radius:4px;white-space:nowrap;transition:.2s}
.nc-line{border:1px solid var(--accent2);color:var(--accent2)}
.nc-line:hover{background:var(--accent2);color:#fff}
.nc-fill{background:var(--accent2);color:#fff;border:1px solid var(--accent2)}
.nc-fill:hover{background:#1f63b0}

/* 共通の見出し：巨大英字2色＋小さな日本語 */
.sk-title{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:56px}
.sk-title h2{font-family:var(--en);font-weight:600;font-size:clamp(40px,6vw,76px);line-height:1;letter-spacing:.01em;color:#fff}
.sk-title h2 em{font-style:normal;color:var(--accent)}
.sk-title > span{font-size:14px;font-weight:500;color:rgba(255,255,255,.8)}
.sk-title.dark h2{color:var(--ink)}
.sk-title.dark h2 em{color:var(--accent2)}
.sk-title.dark > span{color:var(--sub)}

/* ヒーロー：斜めカットの全画面動画 */
.sk-hero{position:relative;height:calc(100svh - 72px);min-height:560px;background:#fff;overflow:hidden;color:#fff}
.sk-hero-media{position:absolute;inset:0;clip-path:polygon(9% 0,100% 0,100% 100%,0 100%,0 34%);background:#000}
.sk-hero-media video{width:100%;height:100%;object-fit:cover;opacity:.82}
.sk-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,0) 55%)}
.sk-hero-copy{position:absolute;left:0;right:0;bottom:110px;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;max-width:none;padding:0 48px}
.sk-hero-catch{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap}
.sk-hero-catch h1{font-size:clamp(34px,5.4vw,76px);font-weight:700;line-height:1.3;letter-spacing:.06em}
.sk-hero-en{font-family:var(--en);font-weight:500;font-size:14px;line-height:1.4;letter-spacing:.06em;padding-bottom:12px}
.sk-hero-card{display:block;position:relative;width:260px;border-radius:6px;overflow:hidden;flex-shrink:0;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.sk-hero-card img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s}
.sk-hero-card:hover img{transform:scale(1.05)}
.sk-hero-card span{position:absolute;left:0;right:0;bottom:0;padding:10px 14px;background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,0));font-size:12px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.sk-hero-card small{font-family:var(--en);font-size:10px;letter-spacing:.1em;opacity:.8}
.sk-topics{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;gap:28px;max-width:none;margin:0 48px;padding:22px 0 26px;border-top:1px solid rgba(255,255,255,.5);font-size:13px}
.sk-topics-label{font-family:var(--en);font-weight:600;font-size:15px;padding-right:28px;border-right:1px solid rgba(255,255,255,.5)}
.sk-topics a{display:flex;gap:22px;opacity:.95}
.sk-topics time{font-family:var(--en);font-size:12px}
.sk-arrow{margin-left:auto;width:30px;height:30px;border:1px solid rgba(255,255,255,.7);border-radius:50%;position:relative}
.sk-arrow::after{content:"";position:absolute;left:10px;top:11px;width:6px;height:6px;border-top:1.5px solid #fff;border-right:1.5px solid #fff;transform:rotate(45deg)}

/* 暗いセクション */
.sk-dark{background:var(--dark);color:#fff}
.sk-pill{display:inline-flex;align-items:center;gap:10px;margin-top:30px;padding:11px 26px;border:1px solid rgba(255,255,255,.8);border-radius:999px;font-size:13px;font-weight:500;color:#fff;transition:.25s}
.sk-pill::after{content:"";width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.sk-pill:hover{background:#fff;color:var(--ink)}

/* メッセージ：写真コラージュ＋詩のような文章 */
.sk-message{padding:140px 0 120px;background:linear-gradient(115deg,var(--dark2) 0 42%,var(--dark) 42%)}
.sk-message-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:72px;align-items:center;max-width:1240px}
.sk-collage{position:relative;height:640px}
.sk-collage img{position:absolute;object-fit:cover;border-radius:6px;box-shadow:0 20px 40px -12px rgba(0,0,0,.6)}
.sk-collage .c1{left:0;bottom:0;width:62%;height:62%}
.sk-collage .c2{right:4%;top:0;width:40%;height:42%}
.sk-collage .c3{left:30%;top:8%;width:26%;height:30%}
.sk-collage .c4{right:0;bottom:6%;width:34%;height:30%}
.sk-poem p{font-size:15px;line-height:2.3;margin-bottom:2em;color:rgba(255,255,255,.92)}

/* 事業：写真左・文章右の段 */
.sk-service{padding:120px 0}
.sk-svc{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:48px 0}
.sk-svc img{width:100%;aspect-ratio:16/11;object-fit:cover;border-radius:6px}
.sk-num{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:var(--ink);font-family:var(--en);font-weight:700;font-size:13px}
.sk-svc h3{font-size:clamp(22px,2.4vw,28px);font-weight:500;margin:16px 0 18px}
.sk-svc p{font-size:14px;line-height:2.1;color:rgba(255,255,255,.82)}

/* マーキー（横に流れる巨大文字） */
.sk-marquee-wrap{padding:90px 0 40px;background:#fff;overflow:hidden}
.sk-marquee{overflow:hidden;white-space:nowrap}
.sk-track{display:inline-flex;align-items:center;gap:36px;animation:sk-scroll 40s linear infinite;padding-right:36px}
.sk-track.slow{animation-duration:55s}
.sk-track span{font-family:var(--en);font-weight:500;font-size:clamp(56px,8vw,112px);line-height:1;color:var(--ink)}
.sk-track span.g{color:var(--accent2)}
.sk-track img{height:clamp(60px,7vw,96px);aspect-ratio:3/2;object-fit:cover;border-radius:10px}
@keyframes sk-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.sk-track{animation:none}}

/* はたらく仲間：写真カードの横並び */
.sk-people{background:#fff;padding:60px 0 120px}
.sk-people .sk-title{margin-bottom:20px}
.sk-people-lead{color:var(--sub);font-size:15px;margin-bottom:44px}
.sk-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:var(--maxw);margin:0 auto;padding:0 24px}
.sk-card{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:3/4;display:block;background:#000}
.sk-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s;opacity:.92}
.sk-card:hover img{transform:scale(1.06)}
.sk-card div{position:absolute;left:0;right:0;bottom:0;padding:48px 18px 18px;background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,0));color:#fff}
.sk-card b{display:block;font-size:17px;font-weight:700;margin-bottom:6px}
.sk-card span{font-size:12.5px;line-height:1.8;opacity:.9}

/* 暗い写真の上の巨大文字 */
.sk-bigword{position:relative;height:520px;overflow:hidden;display:flex;align-items:center;background:#000;padding:0}
.sk-bigword img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4}
.sk-bigword .sk-marquee{position:relative;z-index:1;width:100%}
.sk-bigword .sk-track span{color:#fff;font-weight:600;font-size:clamp(64px,9vw,132px)}

/* お知らせ */
.sk-news{padding:120px 0;background:#fff}
.sk-news-grid{display:grid;grid-template-columns:280px 1fr;gap:56px}
.sk-news-h{font-family:var(--en);font-weight:600;font-size:48px;line-height:1}
.sk-news-ja{display:block;font-size:13px;margin-top:10px}
.sk-more{display:inline-flex;align-items:center;gap:10px;margin-top:60px;font-size:13px}
.sk-more::before{content:"";width:22px;height:22px;border:1px solid var(--ink);border-radius:50%}
.sk-news-row{display:grid;grid-template-columns:130px 1fr;padding:26px 0;border-bottom:1px solid var(--line);font-size:14px;transition:color .2s}
.sk-news-row:first-child{border-top:1px solid var(--line)}
.sk-news-row time{font-family:var(--en);font-size:13px}
.sk-news-row:hover{color:var(--accent2)}
.sk-news-box{display:grid;grid-template-columns:160px 1fr;gap:20px;align-items:center;margin-top:40px;background:var(--dark);color:#fff;border-radius:8px;padding:24px 28px;font-size:13px;transition:background .2s}
.sk-news-box:hover{background:#000}
.sk-news-box b{font-size:15px}

/* お問い合わせ */
.sk-contact{background:var(--dark2);padding:110px 0}
.sk-contact .sk-title{margin-bottom:40px}
.sk-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.sk-contact-btn{display:flex;flex-direction:column;gap:6px;padding:36px 40px;border:1px solid rgba(255,255,255,.35);border-radius:8px;color:#fff;font-size:clamp(20px,2.4vw,28px);font-weight:700;font-family:var(--en);position:relative;transition:.25s}
.sk-contact-btn small{font-family:"Noto Sans JP",sans-serif;font-size:13px;font-weight:500;opacity:.8}
.sk-contact-btn::after{content:"";position:absolute;right:36px;top:50%;width:10px;height:10px;border-top:2px solid #fff;border-right:2px solid #fff;transform:translateY(-50%) rotate(45deg)}
.sk-contact-btn:hover{background:#fff;color:var(--ink)}
.sk-contact-btn:hover::after{border-color:var(--ink)}

/* 下層ページ：暗い帯に英字の大見出し */
.page-hero{height:380px;align-items:flex-end;background:#000}
.page-hero img{opacity:.55}
.page-hero::after{background:linear-gradient(0deg,rgba(0,0,0,.55),rgba(0,0,0,0) 60%)}
.page-hero .wrap{position:relative;z-index:2;width:100%;display:flex;flex-direction:column;align-items:flex-start;padding-bottom:48px}
.page-hero .en-tag{order:1;font-family:var(--en);font-weight:600;font-size:clamp(40px,6vw,76px);letter-spacing:.01em;color:#fff;line-height:1;text-transform:uppercase;margin:0}
.page-hero h1{order:2;font-size:15px;font-weight:500;color:#fff;margin-top:14px;letter-spacing:.08em}
.ph-box{order:3;margin-top:18px;color:rgba(255,255,255,.85);font-size:14px}
.ph-catch{font-weight:700;font-size:16px;color:#fff}
.ph-text{display:none}
.crumb{border-bottom:1px solid var(--line)}

/* 既存パーツをシンカ風に */
.eyebrow{font-family:var(--en);font-weight:600;letter-spacing:.14em;color:var(--accent2)}
.accent-bar{background:var(--accent2)}
.sec-head h2,.lead-block h2,.about h2{font-weight:700}
.btn-solid{background:var(--accent2);border-radius:4px}
.btn-solid span{color:#fff}
.btn-solid:hover{background:#1f63b0}
.btn-ghost{border-radius:999px}
.card,.pv-block,.pv-values,.member,.rc-tel,.contact-info{border-radius:8px}
.biz-row img,.rc-intro img,.about img{border-radius:6px}
.biz-row .num{font-family:var(--en);color:var(--accent2)}
.pv-label .en,.pv-name .en{color:var(--accent2);border-color:var(--accent2)}
.cta-band{background:var(--dark2)}
.cta-band .btn-solid{background:#fff!important;color:var(--ink)!important}
.cta-band .btn-solid span{color:var(--ink)}
footer{background:#121315}
footer h4{font-family:var(--en)}

@media(max-width:1100px){
  body{padding-top:60px}
  .nav{padding:0 12px 0 14px}
  .nav-cta{display:none}
  .menu .en-sub{display:inline}
  .sk-hero{height:calc(100svh - 60px)}
  .sk-message-grid,.sk-svc{grid-template-columns:1fr;gap:40px}
  .sk-collage{height:480px}
  .sk-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .sk-hero-copy{padding:0 20px;bottom:96px;flex-direction:column;align-items:flex-start}
  .sk-hero-card{display:none}
  .sk-hero-media{clip-path:polygon(22% 0,100% 0,100% 100%,0 100%,0 18%)}
  .sk-topics{margin:0 20px;gap:16px;font-size:12px}
  .sk-topics-label{padding-right:16px}
  .sk-topics a:not(.sk-arrow){flex-direction:column;gap:2px}
  .sk-message{padding:90px 0;background:var(--dark)}
  .sk-collage{height:360px}
  .sk-poem p{font-size:14px}
  .sk-service,.sk-news,.sk-contact{padding:80px 0}
  .sk-svc{padding:28px 0}
  .sk-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .sk-card{flex:0 0 72%;scroll-snap-align:start}
  .sk-bigword{height:340px}
  .sk-news-grid,.sk-contact-grid{grid-template-columns:1fr;gap:28px}
  .sk-more{margin-top:24px}
  .sk-news-box{grid-template-columns:1fr;gap:6px}
  .page-hero{height:280px}
}

/* ===== 固定背景の動画（スクロールしてもついてくる） ===== */
.sk-bg{position:fixed;inset:0;z-index:-1;background:#000}
.sk-bg video{width:100%;height:100%;object-fit:cover}
.sk-bg-shade{position:absolute;inset:0;background:#0d0e10;opacity:.12}
body.has-bg{background:transparent}
.has-bg .sk-hero{background:transparent}
.has-bg .sk-message,.has-bg .sk-service{background:transparent}
.sk-hero-cut{position:absolute;inset:0;background:#fff;clip-path:polygon(0 0,9% 0,0 34%);z-index:1;pointer-events:none}
.sk-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),rgba(0,0,0,0) 55%);pointer-events:none}
.sk-hero-copy,.sk-topics{z-index:2}

/* ===== 文字の感じ（シンカ風：英字は字間を詰め、和文はゆったり） ===== */
.sk-title h2,.sk-news-h,.page-hero .en-tag,.sk-track span,.sk-contact-btn{letter-spacing:-.04em}
.sk-title h2{font-weight:600}
.sk-hero-catch h1{font-weight:700;letter-spacing:.08em}
.sk-poem p,.sk-svc p{letter-spacing:.06em}
.sk-svc h3{letter-spacing:.06em}

/* ===== 現れ方 ===== */
.js .rv{opacity:0;transform:translateY(36px);transition:opacity 1s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform 1.1s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.js .rv.is-shown{opacity:1;transform:none}
/* 1行ずつせり上がる */
.rv-line>span{display:block;overflow:hidden;padding-bottom:.08em}
.rv-line>span>span{display:inline-block}
.js .rv-line>span>span{transform:translateY(110%);transition:transform 1.2s cubic-bezier(.2,.8,.2,1) calc(var(--i)*.15s + .2s)}
.js .rv-line.is-shown>span>span{transform:none}
/* 1文字ずつせり上がる */
.rv-chars .ch{display:inline-block}
.js .rv-chars .ch{opacity:0;transform:translateY(.6em) rotate(6deg);transition:opacity .6s ease calc(var(--i)*.035s),transform .9s cubic-bezier(.2,.8,.2,1) calc(var(--i)*.035s)}
.js .rv-chars.is-shown .ch{opacity:1;transform:none}
/* 写真：下から幕が開くように＋少し拡大から戻る */
.js .rv-img{clip-path:inset(100% 0 0 0 round 6px);transition:clip-path 1.3s cubic-bezier(.7,0,.2,1)}
.js .rv-img.is-shown{clip-path:inset(0 0 0 0 round 6px)}
.sk-svc img.rv-img{transform:scale(1.12);transition:clip-path 1.3s cubic-bezier(.7,0,.2,1),transform 1.8s cubic-bezier(.2,.7,.2,1)}
.sk-svc img.rv-img.is-shown{transform:scale(1)}
/* コラージュ写真のゆっくりした上下の動き */
.sk-collage img{translate:0 var(--py,0px)}
@media(prefers-reduced-motion:reduce){.js .rv,.js .rv-line>span>span,.js .rv-chars .ch,.js .rv-img{opacity:1;transform:none;clip-path:none;transition:none}}

/* はたらく仲間：紹介文は写真の下に（顔にかぶらないように） */
.sk-card{aspect-ratio:auto;background:none;display:flex;flex-direction:column;overflow:visible;border-radius:0}
.sk-card img{aspect-ratio:1/1;height:auto;border-radius:8px;opacity:1}
.sk-card:hover img{transform:none;filter:brightness(1.06)}
.sk-card div{position:static;background:none;color:var(--ink);padding:16px 2px 0}
.sk-card b{font-size:17px;margin-bottom:8px;letter-spacing:.06em}
.sk-card span{display:block;font-size:13px;line-height:1.9;color:var(--sub);opacity:1}

/* お問い合わせフォーム */
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form .submit:disabled{opacity:.6;cursor:wait}
.form-status{margin-top:16px;font-size:14px;line-height:1.8}
.form-status.ok{color:#11804A;font-weight:700}
.form-status.error{color:#C0392B;font-weight:700}

/* フォーム非表示中の電話案内 */
.contact-note{background:var(--dark);color:#fff;border-radius:8px;padding:40px}
.contact-note-lead{font-size:14px;font-weight:700;opacity:.85}
.contact-note-tel{display:block;font-family:var(--en);font-weight:600;font-size:clamp(34px,5vw,52px);letter-spacing:-.02em;margin:8px 0 16px;color:#fff}
.contact-note p:last-child{font-size:14px;line-height:1.9;opacity:.85}
@media(max-width:860px){.contact-note{padding:28px 24px}}
.contact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:24px}}

/* メンバー写真（縦長 4:5）*/
.sk-card img{aspect-ratio:4/5;object-position:center 20%}
.member img{object-position:center 18%}

[hidden]{display:none!important}

/* お知らせの記事ページ */
.news-article{max-width:860px}
.na-meta{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--sub)}
.na-meta .tag{font-size:11px;border:1px solid var(--line);padding:3px 10px;border-radius:2px}
.na-title{font-size:clamp(22px,3vw,30px);font-weight:700;line-height:1.5;margin:14px 0 32px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.na-body p{font-size:15px;line-height:2;margin-bottom:28px}
.na-body img{width:100%;height:auto;border-radius:6px}
.na-nav{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:56px;padding-top:28px;border-top:1px solid var(--line)}
.na-other{display:flex;flex-direction:column;gap:4px;font-size:14px}
.na-other small{font-family:var(--en);font-size:11px;color:var(--sub);letter-spacing:.1em}
.na-other:hover{color:var(--accent2)}
.na-back{margin-top:0;color:var(--ink);border-color:var(--ink)}
.na-back:hover{background:var(--ink);color:#fff}
