/*
Theme Name: SENTEN 2026
Theme URI: https://sentenshoko.co.jp/
Description: 株式会社千展商行 コーポレートサイト用テーマ（2026年リニューアル）
Author: SENTENSHOKO INC.
Version: 1.0
*/
  :root{
    --ink:#14263a; --brand:#0962a8; --brand-dk:#074f89; --navy:#0b2a4a; --paper:#f5f8fb; --paper-2:#eaf1f8; --paper-3:#dfe9f3;
    --mute:#5f7186; --mute-2:#4a5d73; --body:#3a4a5c; --line:rgba(11,42,74,.22); --line-soft:rgba(11,42,74,.16);
    --on-ink:#f5f8fb; --on-ink-mute:#a9bccf; --on-ink-body:#d5e0ec;
    --mono:'IBM Plex Mono', 'SFMono-Regular', Menlo, Consolas, monospace;
    --serif-num:'Cormorant Garamond', 'Times New Roman', Georgia, serif;
    --sans:'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Yu Gothic', Meiryo, 'PingFang SC', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
    --serif-jp:'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
    --gutter:40px;
  }
  *{ box-sizing:border-box; }
  html,body{ margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{ font-family:var(--sans); color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  a{ color:var(--ink); text-decoration:none; }
  a:hover{ color:var(--brand); }
  p{ margin:0; }
  h1,h2,h3{ margin:0; font-weight:500; }
  .mono{ font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--brand); text-transform:uppercase; }
  .num{ font-family:var(--serif-num); font-size:34px; line-height:1; color:var(--brand); }
  .btn{ display:block; padding:17px 20px; text-align:center; font-size:14px; letter-spacing:.12em; transition:background .2s, color .2s; }
  .btn-solid{ background:var(--brand); color:#fff; }
  .btn-solid:hover{ background:var(--brand-dk); color:#fff; }
  .btn-line{ border:1px solid var(--brand); color:var(--brand); }
  .btn-line:hover{ background:var(--paper-2); color:var(--brand-dk); }
  .wrap{ padding-left:var(--gutter); padding-right:var(--gutter); }
  .sec-head{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:16px; }
  .sec-head h2{ font-size:clamp(26px,2.8vw,34px); letter-spacing:.06em; color:var(--navy); }
  .lead{ font-size:14px; line-height:2.05; color:var(--mute-2); text-wrap:pretty; }
  .visual{ position:relative; display:block; background:var(--paper-2); border:1px solid var(--line-soft); overflow:hidden; box-shadow:0 20px 50px -30px rgba(11,42,74,.45); }
  .visual img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
  .visual.cap::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,42,74,0) 35%, rgba(11,42,74,.78) 100%); pointer-events:none; }
  .visual .cap-text{ position:absolute; left:clamp(20px,3vw,44px); right:clamp(20px,3vw,44px); bottom:clamp(20px,3vw,40px); z-index:2; color:#fff; display:grid; gap:10px; }
  .visual .cap-text .mono{ color:rgba(255,255,255,.75); text-align:left; font-size:11px; letter-spacing:.2em; }
  .visual .cap-text strong{ font-weight:500; font-size:clamp(18px,2.4vw,30px); letter-spacing:.08em; line-height:1.5; text-shadow:0 2px 12px rgba(0,0,0,.35); }
  .visual .cap-text small{ font-size:12px; letter-spacing:.06em; line-height:1.9; color:rgba(255,255,255,.85); max-width:40em; }
  .visual span{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--mute); text-align:center; line-height:2; }

  /* header */
  header{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px var(--gutter); background:rgba(245,248,251,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:2px solid var(--brand); }
  .brand{ display:block; color:var(--brand); line-height:0; }
  .brand svg{ height:44px; width:auto; display:block; }
  .brand:hover{ color:var(--brand); }
  .nav{ display:flex; align-items:center; gap:24px; font-size:12px; letter-spacing:.14em; white-space:nowrap; }
  .nav .cta{ padding:12px 20px; background:var(--brand); color:#fff; }
  .nav .cta:hover{ background:var(--brand-dk); color:#fff; }
  .burger{ display:none; appearance:none; border:1px solid var(--ink); background:transparent; width:44px; height:40px; cursor:pointer; padding:0; }
  .burger span{ display:block; width:20px; height:2px; background:var(--ink); margin:4px auto; transition:transform .2s, opacity .2s; }

  /* hero */
  .hero{ padding:clamp(56px,7vw,104px) var(--gutter) 56px; }
  .hero h1{ font-size:clamp(38px,5.9vw,84px); line-height:1.24; letter-spacing:.01em; text-wrap:balance; color:var(--navy); }
  .hero-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)); gap:40px; margin-top:64px; padding-top:28px; border-top:1px solid var(--ink); }
  .hero-grid p{ font-size:14px; line-height:2.05; text-wrap:pretty; }
  .hero-cta{ display:grid; gap:12px; align-content:start; }
  .hero-visual{ height:clamp(220px,34vw,520px); margin:0 var(--gutter); }
  .banner{ height:clamp(200px,32vw,480px); margin:0 var(--gutter) 96px; }
  .banner.logistics{ height:auto; aspect-ratio:10944/3559; margin:0 var(--gutter); }
  .banner.world{ height:clamp(220px,30vw,460px); margin-bottom:0; }
  .banner.world img{ object-position:center 40%; }
  .group-visual{ margin:0 0 40px; height:clamp(200px,28vw,420px); }
  .group-visual img{ object-position:center 82%; }

  /* stats */
  .stats{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin:72px var(--gutter) 0; padding-top:1px; background:var(--line-soft); border-top:2px solid var(--ink); }
  .stats > div{ display:grid; gap:8px; align-content:start; padding:36px 32px; background:#fff; }
  .stats .big{ font-family:var(--serif-num); font-size:clamp(30px,3.2vw,44px); line-height:1.2; color:var(--brand-dk); }
  .stats .big-ja{ font-size:clamp(26px,2.6vw,38px); font-weight:500; line-height:1.2; letter-spacing:.02em; color:var(--brand-dk); }
  .stats small{ display:block; font-size:13px; line-height:1.95; color:var(--mute-2); }

  /* index */
  .index{ padding:88px var(--gutter) 96px; }
  .index .lead{ margin:12px 0 40px; max-width:44em; }
  .row{ display:grid; grid-template-columns:3.5em minmax(9em,16em) 1fr; gap:0 24px; align-items:baseline; padding:24px 0; border-top:1px solid var(--line); }
  .row:first-of-type{ border-top:2px solid var(--ink); }
  .row:last-of-type{ border-bottom:2px solid var(--ink); }
  .row.tint{ background:var(--paper-2); margin-left:-16px; padding-left:13px; border-left:3px solid var(--brand); }
  .row .t{ font-size:19px; font-weight:500; color:var(--navy); }
  .row .d{ font-size:13px; line-height:2; }
  .tag{ display:inline-block; margin-left:10px; padding:2px 8px; vertical-align:middle; font-family:var(--mono); font-size:10px; letter-spacing:.14em; border:1px solid var(--brand); color:var(--brand); white-space:nowrap; }

  /* flow */
  .flow{ padding:0 var(--gutter) 96px; }
  .flow-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); gap:1px; padding-top:1px; background:var(--line-soft); border-top:2px solid var(--ink); }
  .flow-grid > div{ display:grid; gap:14px; align-content:start; padding:40px 36px 44px; background:#fff; }
  .flow-grid .t{ font-size:18px; font-weight:500; }
  .flow-grid .d{ font-size:13px; line-height:2; color:var(--mute-2); }

  /* principles */
  .principles{ position:relative; padding:88px var(--gutter); background:var(--brand) url('images/network.jpg') center/cover no-repeat; color:#fff; }
  .principles::before{ content:''; position:absolute; inset:0; background:linear-gradient(135deg, rgba(11,42,74,.88), rgba(9,98,168,.72)); }
  .principles > *{ position:relative; }
  .principles .sec-head{ margin-bottom:56px; }
  .principles .sec-head h2{ letter-spacing:.14em; color:#fff; }
  .principles .mono{ color:rgba(255,255,255,.7); }
  .principles .grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:1px; padding-top:1px; background:rgba(255,255,255,.28); }
  .principles .grid > div{ display:grid; gap:16px; align-content:start; padding:36px; background:rgba(11,42,74,.35); border-top:1px solid rgba(255,255,255,.35); backdrop-filter:blur(4px); }
  .principles .num{ color:rgba(255,255,255,.75); }
  .principles .t{ font-size:22px; font-weight:500; letter-spacing:.12em; }
  .principles .d{ font-size:13px; line-height:2.05; color:rgba(255,255,255,.88); }

  /* message */
  .message{ padding:96px var(--gutter); }
  .message-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr)); gap:56px; align-items:start; }
  .portrait{ aspect-ratio:4/5; max-height:560px; }
  .portrait img{ object-position:center; }
  .message h2{ margin:0 0 32px; font-size:clamp(24px,2.6vw,32px); line-height:1.7; letter-spacing:.06em; color:var(--navy); }
  .message .mono{ display:block; margin-bottom:20px; }
  .message p.body{ margin-bottom:22px; font-size:14px; line-height:2.15; color:var(--body); text-wrap:pretty; }
  .sign{ margin-top:32px; font-size:13px; letter-spacing:.12em; color:var(--body); }
  .sign b{ font-family:var(--serif-jp); font-weight:500; font-size:19px; letter-spacing:.18em; }

  /* company */
  .company{ padding:0 var(--gutter) 96px; }
  .company .sec-head{ margin-bottom:24px; }
  .company-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(400px,100%),1fr)); gap:0 56px; }
  dl{ margin:0; display:grid; grid-template-columns:8em 1fr; }
  dt,dd{ margin:0; padding:22px 0; border-top:1px solid var(--line); }
  dt{ font-size:13px; letter-spacing:.12em; color:var(--mute); }
  dd{ font-size:14px; line-height:1.9; }
  dl > dt:first-of-type, dl > dd:first-of-type{ border-top:2px solid var(--ink); }
  dl > dt:last-of-type, dl > dd:last-of-type{ border-bottom:1px solid var(--line); }

  /* group */
  .group{ padding:0 var(--gutter) 96px; }
  .group .sec-head{ margin-bottom:12px; }
  .group .lead{ margin-bottom:40px; max-width:44em; }
  .bases{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:1px; padding-top:1px; background:var(--line-soft); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
  .bases > div{ display:grid; gap:12px; align-content:start; padding:32px 28px 36px; background:#fff; }
  .bases .city{ font-size:22px; font-weight:500; letter-spacing:.1em; color:var(--brand-dk); }
  .bases .role{ font-size:12px; letter-spacing:.08em; color:var(--mute-2); }
  .bases ul{ margin:8px 0 0; padding:0; list-style:none; display:grid; gap:14px; }
  .bases li{ font-size:13px; line-height:1.85; }
  .bases li b{ display:block; font-weight:500; }
  .bases li span{ color:var(--mute-2); }
  .bases li a, dd a{ color:var(--brand); text-decoration:underline; text-underline-offset:3px; }

  /* contact */
  .contact{ padding:96px var(--gutter); border-top:2px solid var(--brand); background:#fff; }
  .contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr)); gap:48px; align-items:start; }
  .contact h2{ margin:0 0 24px; font-size:clamp(28px,3.2vw,40px); line-height:1.5; letter-spacing:.04em; color:var(--navy); }
  .contact .mono{ display:block; margin-bottom:20px; }
  .contact .lead{ max-width:36em; }
  .contact .mail{ margin-top:32px; font-family:var(--mono); font-size:14px; letter-spacing:.08em; text-decoration:underline; text-underline-offset:4px; word-break:break-all; }
  form{ display:grid; gap:14px; }
  label{ display:grid; gap:6px; font-size:12px; letter-spacing:.1em; color:var(--mute-2); }
  input,textarea{ width:100%; font:inherit; font-size:14px; padding:12px 14px; border:1px solid var(--ink); background:#fff; color:var(--ink); border-radius:0; }
  input:focus,textarea:focus{ outline:2px solid var(--brand); outline-offset:1px; }
  textarea{ min-height:140px; resize:vertical; }
  form .note{ font-size:12px; line-height:1.8; color:var(--mute); }
  .form-msg{ padding:14px 16px; font-size:13px; line-height:1.8; border:1px solid var(--brand); color:var(--brand); background:#fff; }
  .form-msg.err{ border-color:#b3261e; color:#b3261e; }
  form button{ appearance:none; border:0; width:100%; padding:20px; font:inherit; font-size:14px; letter-spacing:.12em; background:var(--brand); color:#fff; cursor:pointer; }
  form button:hover{ background:var(--brand-dk); }


  /* Contact Form 7（AN-Agencyサイトと同じ構成：CF7＋確認画面プラグイン） */
  .wpform .wpcf7 p{ margin:0 0 14px; }
  .wpform .wpcf7 label{ display:grid; gap:6px; font-size:12px; letter-spacing:.1em; color:var(--mute-2); }
  .wpform .wpcf7 label br{ display:none; }
  .wpform .wpcf7-form-control-wrap{ display:block; }
  .wpform .wpcf7 input[type="text"], .wpform .wpcf7 input[type="email"], .wpform .wpcf7 input[type="tel"], .wpform .wpcf7 select, .wpform .wpcf7 textarea{ width:100%; font:inherit; font-size:14px; padding:12px 14px; border:1px solid var(--ink); background:#fff; color:var(--ink); border-radius:0; -webkit-appearance:none; appearance:none; }
  .wpform .wpcf7 select{ background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2314263a' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center; padding-right:36px; }
  .wpform .wpcf7 textarea{ min-height:140px; resize:vertical; }
  .wpform .wpcf7 input:focus, .wpform .wpcf7 select:focus, .wpform .wpcf7 textarea:focus{ outline:2px solid var(--brand); outline-offset:1px; }
  .wpform .wpcf7-not-valid-tip{ display:block; margin-top:4px; font-size:12px; color:#b3261e; }
  .wpform .wpcf7 input[type="submit"], .wpform .wpcf7 input[type="button"]{ appearance:none; -webkit-appearance:none; border:0; width:100%; margin-top:6px; padding:20px; font:inherit; font-size:14px; letter-spacing:.12em; background:var(--brand); color:#fff; cursor:pointer; border-radius:0; }
  .wpform .wpcf7 input[type="submit"]:hover{ background:var(--brand-dk); }
  .wpform .wpcf7 input.wpcf7c-btn-back{ background:transparent; color:var(--ink); border:1px solid var(--ink); }
  .wpform .wpcf7 input.wpcf7c-btn-back:hover{ background:var(--paper-3); }
  .wpform .wpcf7 .wpcf7c-confirm-message-wrap h3{ margin:0 0 16px; font-size:14px; line-height:1.9; letter-spacing:.06em; color:var(--brand); border:1px solid var(--brand); padding:12px 14px; background:#fff; }
  .wpform .wpcf7 .wpcf7c-force-hide{ display:none !important; }
  .wpform .wpcf7 .wpcf7c-elm-step2 input[type="text"], .wpform .wpcf7 form[step="2"] input, .wpform .wpcf7 form[step="2"] select, .wpform .wpcf7 form[step="2"] textarea{ background:var(--paper-2); border-color:var(--line); }
  .wpform .wpcf7-response-output{ margin:14px 0 0 !important; padding:12px 14px !important; border:1px solid var(--brand) !important; color:var(--brand); font-size:13px; line-height:1.8; background:#fff; }
  .wpform .wpcf7-form.invalid .wpcf7-response-output, .wpform .wpcf7-form.failed .wpcf7-response-output{ border-color:#b3261e !important; color:#b3261e; }
  .wpform .wpcf7-form.sent .wpcf7-response-output{ border-color:var(--brand) !important; }
  .wpform .wpcf7-spinner{ display:block; margin:8px auto 0; }
  .wpform .cf-turnstile{ margin:6px 0 14px; }

  /* footer */
  footer{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; padding:40px var(--gutter); background:var(--navy); color:var(--on-ink); }
  footer .brand{ color:#fff; }
  footer .brand:hover{ color:#fff; }
  footer .l{ display:flex; flex-wrap:wrap; align-items:baseline; gap:16px; }
  footer .brand svg{ height:34px; }
  footer .l span{ font-size:12px; color:var(--on-ink-mute); }
  footer .links{ display:flex; flex-wrap:wrap; gap:24px; font-size:12px; letter-spacing:.1em; }
  footer .links a{ background:none; border:0; padding:0; font:inherit; letter-spacing:inherit; cursor:pointer; color:var(--on-ink); }
  footer .links a:hover{ color:#fff; text-decoration:underline; text-underline-offset:4px; }
  footer .c{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--on-ink-mute); }

  /* privacy dialog */
  dialog{ width:min(720px,calc(100% - 32px)); max-height:85vh; padding:0; border:2px solid var(--brand); background:var(--paper); color:var(--ink); }
  dialog::backdrop{ background:rgba(22,24,28,.5); }
  .dlg-in{ padding:40px; overflow:auto; max-height:85vh; }
  .dlg-in h2{ font-size:22px; letter-spacing:.08em; margin-bottom:24px; }
  .dlg-in h3{ font-size:14px; letter-spacing:.08em; margin:24px 0 8px; }
  .dlg-in p{ font-size:13px; line-height:2; color:var(--body); }
  .dlg-in .close{ margin-top:32px; }

  @media (max-width:900px){
    :root{ --gutter:20px; }
    .burger{ display:block; }
    .nav{ display:none; position:absolute; left:0; right:0; top:100%; flex-direction:column; align-items:stretch; gap:0; padding:8px 0 16px; background:var(--paper); border-bottom:2px solid var(--ink); }
    .nav.open{ display:flex; }
    .nav a{ padding:14px var(--gutter); border-top:1px solid var(--line); }
    .nav .cta{ margin:12px var(--gutter) 0; text-align:center; }
    .brand svg{ height:36px; }
    .stats{ grid-template-columns:1fr; }
    .row{ grid-template-columns:3.5em 1fr; }
    .row.tint{ margin-left:-12px; padding-left:9px; }
    .row .d{ grid-column:2; }
    .stats > div, .flow-grid > div, .principles .grid > div{ padding:28px 22px; }
    .message, .contact{ padding-top:72px; padding-bottom:72px; }
    .portrait{ max-height:420px; aspect-ratio:3/2; }
    .banner{ margin-bottom:64px; }
    dl{ grid-template-columns:6.5em 1fr; }
    }
  @media (max-width:520px){
    .hero-grid{ margin-top:40px; }
    .row{ grid-template-columns:1fr; gap:6px 0; }
    .row .d{ grid-column:1; }
    .row .num{ font-size:26px; }
    .sec-head h2{ font-size:24px; letter-spacing:.02em; }
    .contact h2 br, .message h2 br{ display:none; }
    .contact h2{ font-size:26px; }
    .dlg-in{ padding:24px; }
  }