/* ============================================================
   client.css — 広報・販促パート ご提案（クライアント提示版）
   style.css（ver.06 の世界観）を読み込んだ上で、この資料だけの部品を足す。
   style.css は無変更。
   ============================================================ */

.sum .pad { justify-content: space-between; }
.flexbody { display: flex; flex-direction: column; flex: 1; min-height: 0; }

/* ---- P.02 サマリー ---- */
.sumgrid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2.4cqw; }
.sg { border-top: 2px solid var(--ink); padding-top: 1.0cqw; }
.sg.g { border-top-color: var(--green); }
.sg.o { border-top-color: var(--autumn); }
.sg .sgl { font-family: var(--en); font-size: .76cqw; letter-spacing: .22em; color: var(--ink-4); }
.sg.g .sgl { color: var(--green-2); }
.sg.o .sgl { color: var(--autumn); }
.sg h4 { margin: .5cqw 0 .6cqw; font-family: var(--mincho); font-size: 1.6cqw; font-weight: 500; letter-spacing: .06em; line-height: 1.5; }
.sg p { margin: 0; font-size: .9cqw; line-height: 1.9; color: var(--ink-2); font-weight: 300; }
.sg p b { color: var(--ink); font-weight: 500; }

.sumband { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 0; border: 1px solid var(--line); background: #fff; }
.sb3 { padding: 1.1cqw 1.4cqw; }
.sb3 + .sb3 { border-left: 1px solid var(--line); }
.sb3 .sbl { font-family: var(--en); font-size: .74cqw; letter-spacing: .2em; color: var(--ink-4); }
.sb3 .sbv { font-family: var(--en); font-size: 2.9cqw; font-weight: 300; line-height: 1.15; margin-top: .3cqw; }
.sb3 .sbv small { font-family: var(--sans); font-size: .95cqw; color: var(--ink-3); margin-left: .25cqw; }
.sb3 .sbd { font-size: .84cqw; line-height: 1.75; color: var(--ink-2); margin-top: .3cqw; font-weight: 300; }
.sb3 .sbd b { color: var(--ink); font-weight: 500; }
.sb3.g .sbv { color: var(--green); }
.sb3.o .sbv { color: var(--autumn); }

/* ---- P.03 役割 ---- */
.roles6 { display: grid; grid-template-columns: repeat(5, 1fr); gap: .9cqw; }
.roles6 .rolebox { padding: .8cqw .9cqw; }
.roles6 .rolebox h5 { font-size: .98cqw; }
.roles6 .rolebox p { font-size: .78cqw; }
.weare { display: grid; grid-template-columns: 17cqw 1fr; gap: 0; background: var(--green); color: #fff; }
.weare .wl { padding: 1.3cqw 1.5cqw; border-right: 1px solid rgba(255,255,255,.22); display: flex; flex-direction: column; justify-content: center; }
.weare .wl .rl { font-family: var(--en); font-size: .74cqw; letter-spacing: .2em; color: rgba(255,255,255,.6); }
.weare .wl h4 { margin: .4cqw 0 .3cqw; font-family: var(--mincho); font-size: 1.7cqw; font-weight: 500; letter-spacing: .08em; }
.weare .wl p { margin: 0; font-size: .82cqw; line-height: 1.7; color: rgba(255,255,255,.8); font-weight: 300; }
.weare .wr { display: grid; grid-template-columns: repeat(5, 1fr); }
.weare .wi { padding: 1.3cqw 1.1cqw; display: flex; flex-direction: column; }
.weare .wi + .wi { border-left: 1px solid rgba(255,255,255,.14); }
.weare .wi .wn { font-family: var(--en); font-size: .74cqw; letter-spacing: .16em; color: rgba(255,255,255,.55); }
.weare .wi h5 { margin: .45cqw 0 .45cqw; font-size: 1.1cqw; font-weight: 500; letter-spacing: .05em; }
.weare .wi p { margin: 0; font-size: .8cqw; line-height: 1.75; color: rgba(255,255,255,.78); font-weight: 300; }
.roleconn2 { height: 1.8cqw; position: relative; }
.roleconn2::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: var(--ink-4); }
.roleconn2 span {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  background: var(--paper); padding: 0 .8cqw; font-size: .76cqw; letter-spacing: .1em; color: var(--ink-3); white-space: nowrap;
}

/* ---- P.04 前後で伝える内容を切り替える ---- */
.hinge { display: grid; grid-template-columns: 1fr 11cqw 1fr; gap: 0; flex: 1; min-height: 0; }
.hg { padding: 1.3cqw 1.5cqw 1.2cqw; display: flex; flex-direction: column; min-height: 0; }
.hg.before { background: var(--green-pale); }
.hg.after { background: var(--autumn-pale); }
.hg .hgk { font-family: var(--en); font-size: .78cqw; letter-spacing: .2em; color: var(--green-2); }
.hg.after .hgk { color: var(--autumn); }
.hg h4 { margin: .4cqw 0 .2cqw; font-family: var(--mincho); font-size: 2.0cqw; font-weight: 500; letter-spacing: .08em; }
.hg.before h4 { color: var(--green); }
.hg.after h4 { color: var(--autumn); }
.hg .hgj { font-size: .92cqw; color: var(--ink-2); letter-spacing: .04em; }
.hg p { margin: .8cqw 0 0; font-size: .9cqw; line-height: 1.9; color: var(--ink-2); font-weight: 300; }
.hg p b { color: var(--ink); font-weight: 500; }
.hg .hgimg { margin-top: auto; padding-top: 1.0cqw; display: grid; grid-template-columns: 1fr 1fr; gap: .5cqw; }
.hg .hgimg figure { margin: 0; }
.hg .hgimg img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.hg .hgimg figcaption { font-size: .7cqw; color: var(--ink-3); margin-top: .3cqw; letter-spacing: .04em; }
.hgmid { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 .8cqw; background: var(--ink); color: #fff; }
.hgmid .hmd { font-family: var(--en); font-size: 2.3cqw; font-weight: 300; letter-spacing: .04em; color: #fff; }
.hgmid .hml { font-size: .76cqw; letter-spacing: .1em; color: rgba(255,255,255,.72); margin-top: .3cqw; line-height: 1.6; }
.hgmid .hmn { font-size: .76cqw; line-height: 1.8; color: rgba(255,255,255,.62); margin-top: 1.0cqw; font-weight: 300; }

/* ---- P.05 動画4本 ---- */
.films4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4cqw; flex: 1; min-height: 0; }
.fm { display: flex; flex-direction: column; min-height: 0; }
.fm .fimg { position: relative; aspect-ratio: 4 / 3.3; overflow: hidden; background: var(--paper-3); }
.fm .fimg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fm .fimg.dark { background: #16191b; display: flex; align-items: center; justify-content: center; }
.fm .fimg.dark span { font-size: .8cqw; color: rgba(255,255,255,.55); letter-spacing: .1em; text-align: center; line-height: 1.8; }
.fm .fimg.dark span.ftag { color: #fff; }
.fm .ftag { position: absolute; left: 0; top: 0; background: rgba(20,23,26,.82); color: #fff; font-family: var(--en); font-size: .7cqw; letter-spacing: .16em; padding: .35cqw .6cqw; }
.fm .fk { font-family: var(--en); font-size: .74cqw; letter-spacing: .2em; color: var(--green-2); margin-top: .9cqw; }
.fm h5 { margin: .3cqw 0 .35cqw; font-family: var(--mincho); font-size: 1.35cqw; font-weight: 500; letter-spacing: .05em; line-height: 1.5; }
.fm .fmeta { font-size: .76cqw; color: var(--ink-3); letter-spacing: .04em; padding-bottom: .5cqw; border-bottom: 1px solid var(--line); }
.fm p { margin: .55cqw 0 0; font-size: .84cqw; line-height: 1.85; color: var(--ink-2); font-weight: 300; }
.fm p b { color: var(--ink); font-weight: 500; }

/* ---- P.06 1回の撮影から ---- */
.oneshot { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2.6cqw; flex: 1; min-height: 0; }
.oshero { position: relative; overflow: hidden; min-height: 0; }
.oshero img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; inset: 0; }
.oshero .oscap { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2cqw 1.4cqw 1.1cqw; background: linear-gradient(transparent, rgba(8,10,9,.78)); color: #fff; }
.oshero .oscap .ok { font-family: var(--en); font-size: .74cqw; letter-spacing: .22em; color: rgba(255,255,255,.7); }
.oshero .oscap h4 { margin: .3cqw 0 0; font-family: var(--mincho); font-size: 1.7cqw; font-weight: 400; letter-spacing: .08em; }
.oshero .oscap small { display: block; font-size: .68cqw; color: rgba(255,255,255,.6); margin-top: .35cqw; }
.osright { display: flex; flex-direction: column; min-height: 0; }
.oslist { display: flex; flex-direction: column; flex: 1; }
.osi { display: grid; grid-template-columns: 8.6cqw 1fr; gap: 1.0cqw; align-items: center; flex: 1; border-bottom: 1px solid var(--line); }
.osi:first-child { border-top: 1px solid var(--ink); }
.osi .osf { font-family: var(--en); font-size: 1.05cqw; letter-spacing: .06em; color: var(--autumn); }
.osi .osf small { display: block; font-family: var(--sans); font-size: .7cqw; color: var(--ink-3); letter-spacing: .04em; margin-top: .1cqw; }
.osi p { margin: 0; font-size: .88cqw; line-height: 1.75; color: var(--ink-2); font-weight: 300; }
.osi p b { color: var(--ink); font-weight: 500; }

/* ---- P.07 届ける経路 ---- */
.ch4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4cqw; flex: 1; min-height: 0; }
.chc { border-top: 2px solid var(--green); background: #fff; border-left: 1px solid var(--line); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 1.2cqw 1.2cqw 1.1cqw; display: flex; flex-direction: column; }
.chc.o { border-top-color: var(--autumn); }
.chc .chn { font-family: var(--en); font-size: .76cqw; letter-spacing: .2em; color: var(--ink-4); }
.chc h5 { margin: .35cqw 0 .15cqw; font-family: var(--en); font-size: 1.45cqw; font-weight: 500; letter-spacing: .08em; color: var(--green); }
.chc.o h5 { color: var(--autumn); }
.chc .chj { font-size: .9cqw; letter-spacing: .05em; color: var(--ink); font-weight: 500; }
.chc p { margin: .7cqw 0 0; font-size: .86cqw; line-height: 1.85; color: var(--ink-2); font-weight: 300; }
.chc p b { color: var(--ink); font-weight: 500; }
.chc .chrole { margin-top: auto; padding-top: .8cqw; border-top: 1px solid var(--line); font-size: .78cqw; line-height: 1.7; color: var(--ink-3); }
.chc .chrole b { display: block; font-size: .7cqw; letter-spacing: .14em; color: var(--ink-4); font-weight: 400; margin-bottom: .1cqw; }
.chc .chrole span { color: var(--ink); }

.measure { display: grid; grid-template-columns: 14cqw 1fr auto; gap: 1.6cqw; align-items: center; background: var(--ink); color: #fff; padding: 1.1cqw 1.5cqw; }
.measure .mk { font-family: var(--en); font-size: .76cqw; letter-spacing: .2em; color: rgba(255,255,255,.6); }
.measure h5 { margin: .25cqw 0 0; font-size: 1.15cqw; font-weight: 500; letter-spacing: .06em; }
.measure p { margin: 0; font-size: .86cqw; line-height: 1.8; color: rgba(255,255,255,.8); font-weight: 300; }
.measure p b { color: #fff; font-weight: 500; }
.measure .kp { display: flex; gap: .4cqw; flex-wrap: wrap; justify-content: flex-end; max-width: 22cqw; }
.measure .kp span { font-size: .78cqw; border: 1px solid rgba(255,255,255,.45); padding: .3cqw .6cqw; }

/* ---- P.08 タイムライン：10列 ---- */
.gantt.g10 { grid-template-columns: 12.5cqw repeat(10, 1fr); row-gap: .5cqw; }
.gantt.g10 .gc, .gantt.g10 .gb { height: 1.7cqw; }

/* ---- P.09 予算 ---- */
.tbl.btbl td, .tbl.btbl th { padding: .62cqw .7cqw; }
.tbl.btbl td { vertical-align: middle; }
.tbl.btbl td .sub { font-size: .76cqw; }
.paxbox { border: 1px solid var(--green); background: var(--green-pale); padding: 1.1cqw 1.3cqw; }
.paxbox .pxl { font-size: .82cqw; letter-spacing: .08em; color: var(--green); font-weight: 500; }
.paxbox .pxv { font-family: var(--en); font-size: 3.0cqw; font-weight: 300; color: var(--green); line-height: 1.15; margin-top: .3cqw; }
.paxbox .pxv small { font-family: var(--sans); font-size: 1.0cqw; margin-left: .2cqw; }
.paxrow { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6cqw; margin-top: .7cqw; }
.paxrow div { border-top: 1px solid var(--green-3); padding-top: .35cqw; font-size: .76cqw; color: var(--ink-2); line-height: 1.5; }
.paxrow div b { display: block; font-family: var(--en); font-size: 1.2cqw; font-weight: 400; color: var(--green); }

/* ---- P.10 体制 ---- */
.team3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6cqw; }
.tm { border-top: 2px solid var(--green); padding-top: 1.0cqw; display: flex; flex-direction: column; }
.tm .tml { font-family: var(--en); font-size: .76cqw; letter-spacing: .2em; color: var(--green-2); }
.tm h5 { margin: .4cqw 0 .15cqw; font-family: var(--mincho); font-size: 1.6cqw; font-weight: 500; letter-spacing: .06em; }
.tm .tmsub { font-size: .8cqw; color: var(--ink-3); letter-spacing: .04em; }
.tm p { margin: .7cqw 0 0; font-size: .88cqw; line-height: 1.9; color: var(--ink-2); font-weight: 300; }
.tm p b { color: var(--ink); font-weight: 500; }
.tm ul { margin: .7cqw 0 0; padding: 0; list-style: none; }
.tm li { font-size: .84cqw; line-height: 1.6; padding: .35cqw 0; border-bottom: 1px solid var(--line); color: var(--ink); }

/* ---- P.11 ご相談したいこと ---- */
.tbl.req td { padding: .6cqw .7cqw; font-size: .92cqw; line-height: 1.65; vertical-align: middle; }
.tbl.req td.k { font-size: .96cqw; }
.tbl.req td.when { font-family: var(--sans); white-space: nowrap; color: var(--green); font-weight: 500; }
.tbl.req td .sub { font-size: .74cqw; }

/* ============ 調整：縦の空きを写真と文字で埋める ============ */
/* P.02 */
.sumstrip { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: .6cqw; }
.sumstrip img { width: 100%; height: 9.4cqw; object-fit: cover; display: block; }
.sg h4 { font-size: 1.8cqw; }
.sg p { font-size: .96cqw; }
/* P.03 */
.weare { grid-template-columns: 19cqw 1fr; }
.weare .wl h4 { font-size: 1.55cqw; white-space: nowrap; }
.weare .wi { justify-content: center; }
.weare .wi h5 { font-size: 1.3cqw; }
.weare .wi p { font-size: .92cqw; line-height: 1.85; }
/* P.04 */
.hg p { font-size: .98cqw; }
.hg .hgimg { flex: 1; min-height: 0; }
.hg .hgimg figure { display: flex; flex-direction: column; min-height: 0; }
.hg .hgimg img { flex: 1; min-height: 0; height: 100%; aspect-ratio: auto; }
/* P.05 */
.fm .fimg { aspect-ratio: 4 / 3.9; }
.fm h5 { font-size: 1.5cqw; }
.fm .fmeta { font-size: .82cqw; }
.fm p { font-size: .92cqw; }
/* P.06 */
.osi p { font-size: .96cqw; }
.osi .osf { font-size: 1.15cqw; }
/* P.07 */
.chc { padding: 0 0 1.1cqw; }
.chc .chimg { width: 100%; aspect-ratio: 16 / 8.5; object-fit: cover; display: block; }
.chc .chin { padding: .9cqw 1.2cqw 0; display: flex; flex-direction: column; flex: 1; }
.chc h5 { font-size: 1.6cqw; }
.chc .chj { font-size: .98cqw; }
.chc p { font-size: .92cqw; }
.chc .chrole { font-size: .84cqw; margin-left: 0; }
/* P.09 */
.tbl.btbl td, .tbl.btbl th { padding: .95cqw .7cqw; }
.tbl.btbl td { font-size: .95cqw; }
.paxbox { padding: 1.4cqw 1.5cqw; }
.p09 .toc-note p { font-size: .9cqw; line-height: 1.9; }
.p09 .note { font-size: .9cqw; }
/* P.10 */
.tm h5 { font-size: 2.0cqw; margin-top: .6cqw; }
.tm .tmsub { font-size: .9cqw; }
.tm p { font-size: 1.0cqw; line-height: 2.0; margin-top: 1.0cqw; }
.tm li { font-size: .96cqw; padding: .75cqw 0; }
.p10 .measure { padding: 1.5cqw 1.8cqw; }
.p10 .measure p { font-size: .95cqw; }
/* P.03 各領域の項目 */
.weare .wi { justify-content: flex-start; padding-top: 1.8cqw; }
.weare .wi .wn { font-size: .9cqw; }
.weare .wi h5 { font-size: 1.45cqw; }
.weare .wi p { font-size: .9cqw; }
.wul { margin: auto 0 0; padding: .8cqw 0 0; list-style: none; border-top: 1px solid rgba(255,255,255,.22); }
.wul li { font-size: .88cqw; line-height: 1.5; padding: .45cqw 0; color: #fff; }
.wul li::before { content: '—'; margin-right: .5cqw; color: rgba(255,255,255,.5); }
/* P.05 / P.07 */
.fm .fimg { aspect-ratio: 4 / 4.6; }
.fm p { font-size: .98cqw; }
.chc .chimg { aspect-ratio: 16 / 11; }
.chc p { font-size: .98cqw; }
/* P.09 */
.adsplit { padding-top: 1.4cqw; }
/* P.10 */
.team3 { flex: 0 0 auto; }
.promise3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6cqw; margin-top: auto; background: var(--green-pale); padding: 1.6cqw 1.8cqw; }
.promise3 .pr { display: flex; flex-direction: column; }
.promise3 .prn { font-family: var(--en); font-size: 1.6cqw; font-weight: 300; color: var(--green); line-height: 1; }
.promise3 h5 { margin: .6cqw 0 .4cqw; font-family: var(--mincho); font-size: 1.4cqw; font-weight: 500; letter-spacing: .06em; color: var(--green); }
.promise3 p { margin: 0; font-size: .95cqw; line-height: 1.85; color: var(--ink-2); font-weight: 300; }
.p10 .lead { margin-bottom: 2.4cqw !important; }
/* 最終調整 */
.tbl.btbl td, .tbl.btbl th { padding: 1.2cqw .7cqw; }
.p09 .paxbox { padding: 1.8cqw 1.6cqw; }
.p10 .tm li { padding: .95cqw 0; font-size: 1.0cqw; }
.promise3 { padding: 2.2cqw 2.0cqw; }
.promise3 h5 { font-size: 1.55cqw; }
.promise3 p { font-size: 1.0cqw; }
