:root{--black:#0a0a0a;--white:#f7f7f4;--gray:#737373;--line:#d5d5d0;--max:1240px;--side:clamp(24px,5vw,72px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--black);font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;z-index:1000;background:#fff;color:#000;padding:10px 16px}.skip-link:focus{top:20px}.site-header{position:fixed;top:0;left:0;width:100%;z-index:100;background:rgba(10,10,10,.86);color:#fff;backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.12)}.header-inner{height:78px;max-width:calc(var(--max) + 2*var(--side));margin:auto;padding:0 var(--side);display:flex;align-items:center;justify-content:space-between}.logo{font-size:20px;font-weight:800;letter-spacing:-.05em}.logo span{font-weight:300}.global-nav{display:flex;align-items:center;gap:32px;font-size:12px;letter-spacing:.08em}.global-nav a{opacity:.8;transition:opacity .2s}.global-nav a:hover,.global-nav a:focus-visible{opacity:1}.nav-contact{border:1px solid #fff;padding:10px 16px}.menu-button{display:none;background:transparent;border:0;padding:10px;color:#fff}.menu-button>span:not(.sr-only){display:block;width:24px;height:1px;background:currentColor;margin:5px}.hero{min-height:100svh;background:#090909;color:#fff;position:relative;display:flex;align-items:flex-end;padding:150px var(--side) 10vh;overflow:hidden}.hero-content{position:relative;z-index:2;width:min(820px,100%);max-width:var(--max);margin-left:max(0px,calc((100vw - var(--max) - 2*var(--side))/2))}.eyebrow,.section-label,.service-en,.work-type{font-size:11px;letter-spacing:.22em;font-weight:600}.eyebrow{color:#aaa;margin:0 0 24px}.hero h1{font-size:clamp(48px,8vw,112px);line-height:1.08;letter-spacing:-.055em;margin:0 0 34px;font-weight:500}.hero-copy{font-size:clamp(16px,1.5vw,20px);line-height:1.9;color:#d0d0d0;margin:0 0 44px}.hero-actions{display:flex;align-items:center;gap:32px}.button{display:inline-flex;min-height:58px;align-items:center;justify-content:space-between;gap:32px;padding:12px 22px;font-size:13px;border:1px solid;cursor:pointer;transition:background .2s,color .2s}.button-light{background:#fff;color:#000;border-color:#fff}.button-light:hover{background:transparent;color:#fff}.text-link{font-size:13px;border-bottom:1px solid #777;padding-bottom:4px}.hero-visual{position:absolute;inset:0 0 0 52%;opacity:.6;background:radial-gradient(circle at 45% 45%,#595959 0 2%,transparent 2.5%),radial-gradient(ellipse at 45% 50%,#303030 0 7%,#111 25%,#050505 67%);filter:contrast(1.25)}.hero-visual:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.018) 4px)}.focus-frame{position:absolute;left:43%;top:43%;width:20%;aspect-ratio:16/10;border:1px solid rgba(255,255,255,.35)}.timecode,.visual-label{position:absolute;font:10px monospace;letter-spacing:.12em;color:#aaa}.timecode{right:25px;bottom:24px}.visual-label{left:24px;top:100px;writing-mode:vertical-rl}.scroll-label{position:absolute;right:var(--side);bottom:24px;font-size:9px;letter-spacing:.3em;color:#777;writing-mode:vertical-rl}.section{padding:clamp(100px,13vw,180px) var(--side)}.section>*{max-width:var(--max);margin-left:auto;margin-right:auto}.section-head{display:grid;grid-template-columns:70px 1fr;align-items:start;margin-bottom:clamp(70px,10vw,130px)}.section-number,.section-label{margin:0}.section-number{font-size:11px;color:#777}.section-head h2{grid-column:2;font-size:clamp(38px,5.8vw,78px);line-height:1.25;letter-spacing:-.045em;font-weight:500;margin:40px 0 0}.intro-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:clamp(50px,10vw,150px)}.lead{font-size:clamp(19px,2.2vw,27px);line-height:1.9;letter-spacing:.01em;margin:0}.strength-list{border-top:1px solid var(--line)}.strength{display:grid;grid-template-columns:48px 1fr;gap:20px;padding:34px 0;border-bottom:1px solid var(--line)}.strength>span{font-size:11px;color:#888}.strength h3{font-size:20px;margin:-8px 0 10px;font-weight:500}.strength p{font-size:14px;color:#666;margin:0}.services{background:var(--black);color:#fff}.section-head-light .section-number{color:#777}.service-list{border-top:1px solid #333}.service-card{display:grid;grid-template-columns:70px minmax(0,680px) 1fr;gap:35px;padding:60px 0;border-bottom:1px solid #333;position:relative}.service-index{font-size:11px;color:#777}.service-en{color:#777;margin:0 0 12px}.service-card h3{font-size:clamp(30px,4vw,48px);font-weight:400;margin:0 0 20px;letter-spacing:-.02em}.service-card p:not(.service-en){color:#aaa;margin:0;max-width:650px}.service-card ul{padding:0;margin:25px 0 0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}.service-card li{border:1px solid #444;color:#bbb;padding:6px 12px;font-size:11px}.service-mark{justify-self:end;align-self:center;font-size:74px;color:#333;line-height:1}.service-mark.outline{color:#444}.service-mark.bars{font-weight:100;letter-spacing:-.25em;transform:rotate(-20deg)}.works-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px 28px}.work-image{aspect-ratio:16/10;position:relative;overflow:hidden;margin-bottom:20px;background:#222}.work-image:before{content:"";position:absolute;inset:-10%;transition:transform .6s ease,filter .6s ease;filter:grayscale(1);background-size:cover}.work-image-1:before{background:linear-gradient(135deg,#ddd 0 35%,#252525 35% 45%,#8a8a8a 45% 60%,#191919 60%)}.work-image-2:before{background:radial-gradient(circle at 57% 42%,#bdbdbd 0 8%,#4a4a4a 8% 18%,#111 18% 22%,#777 23% 31%,#202020 32%)}.work-image-3:before{background:linear-gradient(105deg,#1c1c1c 0 38%,#888 38% 39%,#282828 39% 68%,#ddd 68% 69%,#121212 69%)}.work-image-4:before{background:radial-gradient(ellipse at center,#ddd 0 12%,#777 13% 18%,#161616 19% 50%,#555 51% 51.5%,#111 52%)}.work-image span{position:absolute;bottom:18px;right:18px;background:#fff;padding:8px 12px;font-size:10px;text-transform:uppercase;letter-spacing:.15em;opacity:0;transform:translateY(8px);transition:.3s}.work-card:hover .work-image:before{transform:scale(1.04);filter:grayscale(0)}.work-card:hover .work-image span{opacity:1;transform:none}.work-card .work-type{color:#888;margin:0 0 4px}.work-card h3{font-size:18px;font-weight:500;margin:0}.work-card>p:last-child{font-size:12px;color:#888;margin:4px 0 0}.works-note{font-size:11px;color:#999;margin-top:48px}.company{background:#e8e8e3}.company-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,10vw,150px)}.company-statement{font-size:clamp(30px,4vw,54px);line-height:1.5;margin:0;letter-spacing:-.04em}.company-table{margin:0;border-top:1px solid #bdbdb8}.company-table>div{display:grid;grid-template-columns:120px 1fr;padding:22px 0;border-bottom:1px solid #bdbdb8}.company-table dt{font-size:12px;color:#777}.company-table dd{margin:0;font-size:14px}.contact{background:#fff;padding:clamp(100px,13vw,180px) var(--side)}.contact-inner{max-width:var(--max);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(60px,12vw,170px)}.contact-copy .section-label{margin-bottom:46px}.contact-copy h2{font-size:clamp(42px,6vw,76px);line-height:1.25;letter-spacing:-.05em;font-weight:500;margin:0 0 35px}.contact-copy>p:not(.section-label):not(.contact-meta){color:#555}.contact-meta{font-size:12px;color:#888;margin-top:30px}.field{margin-bottom:26px}.field label{display:block;font-size:13px;margin-bottom:8px}.field label span{font-size:10px;color:#888;margin-left:8px}.field input,.field textarea{width:100%;border:0;border-bottom:1px solid #aaa;background:transparent;padding:11px 2px;border-radius:0;outline:none}.field textarea{border:1px solid #aaa;padding:14px;resize:vertical}.field input:focus,.field textarea:focus{border-color:#000;box-shadow:0 1px 0 #000}.form-note{font-size:11px;color:#888}.button-dark{background:#111;color:#fff;border-color:#111;width:100%;margin-top:14px}.button-dark:hover{background:#fff;color:#111}.form-status{font-size:13px;min-height:24px}.form-status.success{color:#24633b}footer{background:#0a0a0a;color:#fff;display:flex;justify-content:space-between;padding:70px var(--side) 40px;font-size:11px}footer>div{max-width:600px}.footer-logo{font-size:22px}footer p{color:#777;margin:16px 0 0}.footer-right{text-align:right;display:flex;flex-direction:column;justify-content:space-between}.footer-right nav{display:flex;gap:24px}.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){.header-inner{height:68px}.menu-button{display:block}.global-nav{position:fixed;inset:68px 0 auto;background:#0a0a0a;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:15px var(--side) 28px;transform:translateY(-130%);visibility:hidden;transition:.3s;border-bottom:1px solid #333}.global-nav.open{transform:none;visibility:visible}.global-nav a{padding:14px 0;border-bottom:1px solid #282828}.nav-contact{border:0}.hero{min-height:780px;padding-top:130px}.hero-visual{inset:0 0 45% 25%;opacity:.48}.hero h1{font-size:clamp(45px,13vw,68px)}.hero-copy br{display:none}.hero-actions{align-items:flex-start;flex-direction:column;gap:22px}.scroll-label{display:none}.section-head{grid-template-columns:42px 1fr}.section-head h2{margin-top:28px}.intro-grid,.company-body,.contact-inner{grid-template-columns:1fr}.service-card{grid-template-columns:36px 1fr;gap:16px;padding:45px 0}.service-mark{display:none}.works-grid{grid-template-columns:1fr;gap:55px}.company-table>div{grid-template-columns:100px 1fr}.contact-copy .section-label{margin-bottom:30px}footer{flex-direction:column;gap:55px}.footer-right{text-align:left;gap:30px}.footer-right nav{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Privacy policy */
.company-en{font-size:11px;letter-spacing:.12em;color:#777}.inline-link{text-decoration:underline;text-underline-offset:3px}.legal-page{background:#f7f7f4}.legal-hero{background:#0a0a0a;color:#fff;padding:clamp(150px,18vw,230px) var(--side) clamp(80px,10vw,130px)}.legal-hero-inner,.legal-content{max-width:980px;margin:auto}.legal-hero .eyebrow{margin-bottom:24px}.legal-hero h1{font-size:clamp(44px,7vw,88px);font-weight:500;letter-spacing:-.05em;line-height:1.15;margin:0}.legal-hero p:last-child{color:#999;margin:24px 0 0;font-size:13px}.legal-content{padding:clamp(80px,10vw,130px) var(--side)}.legal-lead{font-size:clamp(17px,2vw,21px);line-height:2;margin:0 0 70px}.legal-section{display:grid;grid-template-columns:64px 1fr;gap:25px;padding:38px 0;border-top:1px solid var(--line)}.legal-index{font-size:11px;color:#888;padding-top:5px}.legal-section h2{font-size:clamp(21px,2.5vw,29px);font-weight:500;letter-spacing:-.02em;margin:0 0 18px}.legal-section p,.legal-section li{color:#505050;font-size:15px;line-height:2}.legal-section p{margin:0 0 12px}.legal-section ul{margin:0;padding-left:1.25em}.legal-contact{margin-top:24px;padding:24px;background:#ecece8}.legal-date{text-align:right;color:#777;font-size:13px;margin-top:50px}.legal-back{display:inline-flex;align-items:center;gap:12px;margin-top:55px;font-size:13px;border-bottom:1px solid #777}.legal-footer{margin-top:0}
@media(max-width:800px){.legal-hero{padding-top:130px}.legal-content{padding-left:var(--side);padding-right:var(--side)}.legal-section{grid-template-columns:34px 1fr;gap:12px}.legal-section p,.legal-section li{font-size:14px}.legal-contact{padding:18px}}

/* サービス欄の装飾マーク(● ◉ /// ＋)を非表示。戻す場合はこの1行を削除 */
.service-mark{display:none}
/* ヒーロー右側の装飾(フォーカス枠・タイムコード・縦書きラベル)を非表示。戻す場合はこの1行を削除 */
.hero-visual{display:none}
/* 装飾を消したぶんの上部の余白を解消するため、ヒーロー内容を上下中央に置く */
.hero{align-items:center}
/* サイト全体の基準幅を1240px→1440pxに拡張(揃えたまま見出しを大きくするため)。戻す場合はこの1行を削除 */
:root{--max:1440px}
/* 801px以上では見出しを1行に(スマホは従来どおり2行)。左端は下のセクションと揃えるため基準幅の箱は維持 */
@media(min-width:801px){.hero-content{width:min(var(--max),100%)}.hero h1 br{display:none}.hero h1{font-size:clamp(48px,6.7vw,106px)}}
/* thanks.html の「トップページへ戻る」ボタン: 矢印がないので文字を中央寄せにする */
.legal-page .button-dark{justify-content:center}

/* Motion */
.hero .eyebrow,.hero h1,.hero-copy,.hero-actions{opacity:0;animation:heroIn .9s cubic-bezier(.16,1,.3,1) forwards}
.hero .eyebrow{animation-delay:.12s}.hero h1{animation-delay:.26s}.hero-copy{animation-delay:.46s}.hero-actions{animation-delay:.62s}
@keyframes heroIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero-visual{transform:translate3d(0,var(--hero-shift,0px),0);animation:heroVisualIn 1.5s ease}
@keyframes heroVisualIn{from{opacity:0}}
.focus-frame{animation:focusFrameIn 1.1s .55s cubic-bezier(.16,1,.3,1) both}
@keyframes focusFrameIn{from{opacity:0;transform:scale(.88)}}
.scroll-label{animation:scrollNudge 2.6s ease-in-out infinite;transition:opacity .4s ease}
@keyframes scrollNudge{0%,100%{transform:translateY(0)}50%{transform:translateY(9px)}}
body.is-scrolled .scroll-label{opacity:0}
.reveal{transform:translateY(28px);transition:opacity .8s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0s),transform .8s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0s)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-iteration-count:1!important}.hero .eyebrow,.hero h1,.hero-copy,.hero-actions{opacity:1;transform:none;animation:none!important}.hero-visual,.focus-frame,.scroll-label{transform:none;animation:none!important}.reveal{opacity:1;transform:none;transition:none!important}}

/* ===== 白基調パレット（白ベース／黒はアクセント／グレーは補助）。戻す場合はここから下を全削除 ===== */
:root{--white:#fff;--gray:#8a8a8a;--line:#e6e6e6}
body{background:#fff;color:#333}
h1,h2,h3{color:#111}
/* ヘッダー */
.site-header{background:rgba(255,255,255,.88);color:#333;border-bottom:1px solid #e6e6e6}
.nav-contact{background:#000;color:#fff;border-color:#000}
.menu-button{color:#333}
@media(max-width:800px){.global-nav{background:#fff;border-bottom-color:#e6e6e6}.global-nav a{border-bottom-color:#eee}}
/* ヒーロー: 白地・中央揃え */
.hero{background:#fff;color:#333;justify-content:center;text-align:center}
.hero-content{margin-left:auto;margin-right:auto}
.hero .eyebrow{color:#767676}
.hero-copy{color:#555}
.hero-actions{justify-content:center}
.button-light{background:#000;color:#fff;border-color:#000}
.button-light:hover{background:#fff;color:#000}
.text-link{border-bottom-color:#bbb}
.scroll-label{color:#b0b0b0}
@media(max-width:800px){.hero-actions{align-items:center}}
/* 強み */
.section-number{color:#767676}
.strength-list{border-top-color:#e6e6e6}
.strength{border-bottom-color:#e6e6e6}
.strength>span{color:#767676}
.strength p{color:#555}
/* サービス: 黒地をやめて白地に */
.services{background:#fff;color:#333}
.section-head-light .section-number{color:#767676}
.service-list{border-top-color:#e6e6e6}
.service-card{border-bottom-color:#e6e6e6}
.service-index,.service-en{color:#767676}
.service-card p:not(.service-en){color:#555}
.service-card li{border-color:#ddd;color:#666}
/* 会社概要: ごく薄いグレーでリズムをつける */
.company{background:#f6f6f6}
.company-table{border-top-color:#e0e0e0}
.company-table>div{border-bottom-color:#e0e0e0}
.company-table dt{color:#767676}
/* お問い合わせ */
.contact-copy>p:not(.section-label):not(.contact-meta){color:#555}
.field input,.field textarea{border-color:#999}
/* フッター: ここだけ黒で締める */
footer{background:#111;color:#fff}
/* プライバシー／サンクス */
.legal-page{background:#fff}
.legal-hero{background:#fff;color:#333;border-bottom:1px solid #e6e6e6}
.legal-hero p:last-child{color:#767676}
.legal-section{border-top-color:#e6e6e6}
.legal-section p,.legal-section li{color:#555}
.legal-index{color:#767676}
.legal-contact{background:#f6f6f6}
.legal-back{border-bottom-color:#bbb}

/* ===== 組版の調整 ===== */
/* 中央揃えの行末「。」は右側に半角分の空白を持つため、その半分だけ文字を右へずらして光学的に中央にする。
   見出しからは「。」を外したので、対象は本文(.hero-copy)のみ */
.hero-copy{padding-left:.4em}
/* 会社概要ステートメント: 列幅に対して大きすぎたため縮小。
   span を inline-block にして「、」の後だけで改行させる(均等割りだと意味の途中で切れるため) */
.company-statement{font-size:clamp(22px,2.75vw,44px)}
.company-statement span{display:inline-block}
/* お問い合わせ見出し: 1440px以下で2行目がはみ出していたため縮小 */
.contact-copy h2{font-size:clamp(36px,4.7vw,76px)}

/* ===== 第三者レビューを受けた修正 ===== */
/* [7] コントラスト不足の解消(いずれも白地/黒地で4.5:1未満だった) */
.field label span,.contact-meta,.form-note,.legal-date,.company-en{color:#6b6b6b}
.company-table dt{color:#6e6e6e}
footer p{color:#8f8f8f}
.scroll-label{color:#8a8a8a}
/* 電話番号とプライバシーポリシーをリンクと分かるようにする */
.contact-meta a,.form-note a{color:#333;text-decoration:underline;text-underline-offset:3px}
/* [6] ナビのCTAボタン: 親の opacity:.8 で黒が濁っていたので打ち消す */
.global-nav .nav-contact{opacity:1}
/* [4] ヒーロー本文の「。」補正はデスクトップ(2行・両行とも句点で終わる)のみ有効にする */
.hero-copy{padding-left:0;text-wrap:pretty}
@media(min-width:801px){.hero-copy{padding-left:.4em}}
/* [5] thanks.html の見出しがCSS未定義でブラウザ既定値になっていた */
.legal-page .section h1{font-size:clamp(28px,4.2vw,44px);font-weight:500;letter-spacing:-.04em;line-height:1.35}
.legal-page .section h1 span{display:inline-block}

@media(max-width:800px){
  /* [4] 番号列をやめて横幅を確保し、文字を縮小して語の途中で割れないようにする */
  .section-head{grid-template-columns:1fr}
  .section-head h2{grid-column:1;font-size:clamp(24px,7.6vw,48px)}
  .legal-hero h1{font-size:clamp(26px,8vw,44px)}
  /* [4] 2行になるスマホでは行末の「、」を消す(1行目だけ左に寄って見えるのを防ぐ) */
  .hero h1 .pt{display:none}
  /* [6] CTAボタンが端に密着していたので余白を戻す */
  .global-nav .nav-contact{padding:16px;text-align:center;border-bottom:0;margin-top:12px}
  /* [4] 文中の改行を復活させ、2文の境目で必ず改行する(最終行が「す。」だけになるのを防ぐ) */
  .hero-copy br{display:inline}
}