/* 人物・場面は淡い色と余白に揃え、操作用の記号と役割を分ける。 */
/* 採用した海洋散骨の水彩図。文字は画像に焼き込まず、幅と文字拡大で再配置する。 */
body[data-unified][data-fidelity] .f-coordination-lead{margin:24px 0 0;font-size:var(--type-lead);line-height:1.9;max-width:42em}
body[data-unified][data-fidelity] .f-coordination-section{container-type:inline-size;container-name:coordination}
body[data-unified][data-fidelity] .f-coordination-heading{max-width:66%;position:relative;z-index:1}
body[data-unified][data-fidelity] .f-coordination-scene{container-type:inline-size;margin:-180px 0 48px;position:relative}
body[data-unified][data-fidelity] .f-coordination-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);column-gap:96px;align-items:center;position:relative;isolation:isolate;z-index:1}
body[data-unified][data-fidelity] .f-coordination-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;position:relative;align-items:start;min-width:0}
body[data-unified][data-fidelity] .f-coordination-person,body[data-unified][data-fidelity] .f-coordination-partner{display:grid;justify-items:center;align-content:start;min-width:0;gap:8px;text-align:center}
body[data-unified][data-fidelity] .f-coordination-person-art{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:100%;height:17rem;min-width:0;min-height:0;margin-bottom:8px}
body[data-unified][data-fidelity] .f-coordination-art{display:block;max-width:100%;min-width:0;min-height:0;width:100%;height:auto;object-fit:contain}
body[data-unified][data-fidelity] .f-coordination-person--family .f-coordination-art{width:calc(100% + 32px);max-width:none}
body[data-unified][data-fidelity] .f-coordination-brand{display:block;width:min(208px,90%);height:auto;margin-top:-4px}
body[data-unified][data-fidelity] .f-coordination-label{display:block;font-size:1.5rem;line-height:1.6;font-weight:700;color:var(--ink);max-width:100%;text-wrap:balance}
body[data-unified][data-fidelity] .f-coordination-label>span,body[data-unified][data-fidelity] .f-coordination-caption>span{display:inline-block}
body[data-unified][data-fidelity] .f-coordination-caption{display:block;font-size:var(--type-body);line-height:1.6;color:var(--ink);max-width:100%}
body[data-unified][data-fidelity] .f-coordination-partner-group{display:grid;gap:24px;min-width:0}
body[data-unified][data-fidelity] .f-coordination-partner-art{display:grid;place-items:center;width:100%;height:13rem;min-width:0;min-height:0}
body[data-unified][data-fidelity] .f-coordination-partner-art .f-coordination-art{height:100%;object-fit:contain;object-position:center bottom}
body[data-unified][data-fidelity] .f-coordination-conversation,body[data-unified][data-fidelity] .f-coordination-branches{position:absolute;overflow:visible;pointer-events:none;z-index:-1;color:var(--primary)}
body[data-unified][data-fidelity] .f-coordination-conversation{width:80px;height:70px;top:10rem;left:calc(50% - 40px)}
body[data-unified][data-fidelity] .f-coordination-conversation path,body[data-unified][data-fidelity] .f-coordination-branches path{fill:none;stroke:currentColor;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
body[data-unified][data-fidelity] .f-coordination-conversation circle,body[data-unified][data-fidelity] .f-coordination-branches circle{fill:currentColor;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
body[data-unified][data-fidelity] .f-coordination-branches--wide{width:96px;height:70%;top:15%;right:calc((100% - 96px)/3)}
body[data-unified][data-fidelity] .f-coordination-branches--compact{display:none}
body[data-unified][data-fidelity] .f-coordination-sea-footer{position:relative;display:grid;justify-items:center;gap:8px;padding:0 0 8px;margin-top:0}
body[data-unified][data-fidelity] .f-coordination-coast{position:relative;left:0;width:calc(100% + 80px);height:160px;max-width:none;object-fit:cover;object-position:center;pointer-events:none}
body[data-unified][data-fidelity] .f-coordination-role-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;padding:8px 0;font-size:var(--type-body);line-height:1.6;color:var(--primary);text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1px;text-wrap:balance}
body[data-unified][data-fidelity] .f-coordination-role-link:hover{text-decoration-thickness:2px}
body[data-unified][data-fidelity] .f-coordination-role-link:focus-visible{outline:3px solid var(--primary);outline-offset:4px;border-radius:2px}
@container coordination (max-width:64rem){
 body[data-unified][data-fidelity] .f-coordination-heading{max-width:none}
 body[data-unified][data-fidelity] .f-coordination-scene{margin-top:0}
 body[data-unified][data-fidelity] .f-coordination-layout{grid-template-columns:minmax(0,1fr);gap:12px}
 body[data-unified][data-fidelity] .f-coordination-people{grid-row:1;gap:48px}
 body[data-unified][data-fidelity] .f-coordination-person-art{height:auto;aspect-ratio:1;justify-content:flex-end}
 body[data-unified][data-fidelity] .f-coordination-person--family .f-coordination-art{width:100%}
 body[data-unified][data-fidelity] .f-coordination-brand{width:min(208px,90%)}
 body[data-unified][data-fidelity] .f-coordination-conversation{top:40%;width:64px;left:calc(50% - 32px)}
 body[data-unified][data-fidelity] .f-coordination-partner-group{grid-row:3;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
 body[data-unified][data-fidelity] .f-coordination-partner-art{height:auto;aspect-ratio:1.6}
 body[data-unified][data-fidelity] .f-coordination-branches--wide{display:none}
 body[data-unified][data-fidelity] .f-coordination-branches--compact{display:block;position:relative;grid-row:2;top:auto;left:auto;width:100%;height:64px}
 body[data-unified][data-fidelity] .f-coordination-sea-footer{margin-top:16px}
}
@media(max-width:767px){
 body[data-unified][data-fidelity] .f-coordination-scene{margin-bottom:32px}
 body[data-unified][data-fidelity] .f-coordination-lead{margin-top:24px}
 body[data-unified][data-fidelity] .f-coordination-people,body[data-unified][data-fidelity] .f-coordination-partner-group{gap:24px}
 body[data-unified][data-fidelity] .f-coordination-label{font-size:1.25rem;line-height:1.6}
 body[data-unified][data-fidelity] .f-coordination-caption{text-align:left}
 body[data-unified][data-fidelity] .f-coordination-brand{width:100%;margin-top:0}
 body[data-unified][data-fidelity] .f-coordination-conversation{width:32px;left:calc(50% - 16px);height:40px}
 body[data-unified][data-fidelity] .f-coordination-sea-footer{padding-bottom:16px}
 body[data-unified][data-fidelity] .f-coordination-coast{left:0;width:calc(100% + 32px);height:120px}
 body[data-unified][data-fidelity] .f-coordination-role-link{gap:8px;max-width:100%;justify-content:center}
}
@container coordination (max-width:20rem){
 body[data-unified][data-fidelity] .f-coordination-layout{gap:40px}
 body[data-unified][data-fidelity] .f-coordination-people,body[data-unified][data-fidelity] .f-coordination-partner-group{grid-row:auto;grid-template-columns:minmax(0,1fr);gap:48px}
 body[data-unified][data-fidelity] .f-coordination-person-art{width:min(100%,320px);aspect-ratio:1.35}
 body[data-unified][data-fidelity] .f-coordination-person--hub .f-coordination-person-art{aspect-ratio:1.05}
 body[data-unified][data-fidelity] .f-coordination-brand{width:min(208px,90%)}
 body[data-unified][data-fidelity] .f-coordination-partner-art{max-width:320px}
 body[data-unified][data-fidelity] .f-coordination-conversation,body[data-unified][data-fidelity] .f-coordination-branches--compact{display:none}
 body[data-unified][data-fidelity] .f-coordination-person--hub::before{content:"";width:2px;height:32px;background:var(--primary);margin-top:-40px;margin-bottom:0}
 body[data-unified][data-fidelity] .f-coordination-partner-group{padding-top:24px;border-top:2px solid var(--line)}
 body[data-unified][data-fidelity] .f-coordination-caption{text-align:center}
 body[data-unified][data-fidelity] .f-coordination-role-link{justify-content:flex-start;align-items:flex-start}
}
body[data-unified][data-fidelity] .f-generated-illustration{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
body[data-unified][data-fidelity] .f-portrait-disc{display:grid;place-items:center;width:144px;max-width:100%;aspect-ratio:1;border-radius:50%;background:#edf8f5;overflow:hidden}
body[data-unified][data-fidelity] .f-portrait-disc img{width:100%;height:100%;object-fit:contain}
body[data-unified][data-fidelity] .f-illustrated-relationship{max-width:840px;grid-template-columns:minmax(0,1fr) 36px minmax(120px,1.1fr) 36px minmax(0,1fr);gap:24px;align-items:center}
body[data-unified][data-fidelity] .f-relationship-frame{container-type:inline-size;max-width:840px;margin-inline:auto}
body[data-unified][data-fidelity] .f-illustrated-relationship>div{gap:12px;grid-template-columns:minmax(0,1fr);min-width:0}
body[data-unified][data-fidelity] .f-illustrated-relationship .f-portrait-label{display:block;min-width:112px;padding:8px 16px;background:#edf8f5;border-radius:999px;font-size:var(--type-body);line-height:1.6}
body[data-unified][data-fidelity] .f-illustrated-relationship>span{color:var(--primary);font-size:28px}
body[data-unified][data-fidelity] .f-illustrated-relationship .f-family-hub{padding:20px;background:#fff;border-radius:50%}
body[data-unified][data-fidelity] .f-illustrated-coordination .f-coordination-partners .f-generated-illustration{width:80px;flex:none}
body[data-unified][data-fidelity] .f-illustrated-coordination .f-coordination-partners{align-items:stretch!important}
body[data-unified][data-fidelity] .f-illustrated-coordination .f-coordination-partners>span{justify-content:center}
body[data-unified][data-fidelity] .f-partner-visual{display:grid;place-items:center;width:64px;height:64px;flex:0 0 64px}
body[data-unified][data-fidelity] .f-partner-visual .f-icon{width:48px;height:48px}
body[data-unified][data-fidelity] .f-illustrated-coordination .f-partner-visual .f-generated-illustration{width:64px;height:64px}
body[data-unified][data-fidelity] .f-stage-illustration--scene{background:var(--surface)}
body[data-unified][data-fidelity] .f-stage-illustration--scene .f-generated-illustration{width:min(100%,220px);height:180px}
body[data-unified][data-fidelity] .f-rich-nav-icon{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--surface);color:var(--primary)}
body[data-unified][data-fidelity] .f-rich-nav-icon .f-icon{display:block;width:28px;height:28px}
body[data-unified][data-fidelity] .f-illustrated-index .f-index-links{gap:16px}
body[data-unified][data-fidelity] .f-illustrated-index .f-rich-nav-link{padding:16px 12px;gap:12px;border:1px solid var(--line);border-radius:8px;background:#fff}
body[data-unified][data-fidelity] .f-illustrated-index .f-rich-nav-icon{width:42px;height:42px;flex:0 0 42px}
body[data-unified][data-fidelity] .f-rich-nav-link>span:not(.f-rich-nav-icon):not([aria-hidden]){flex:1;min-width:0}
body[data-unified][data-fidelity] .section-links.f-illustrated-index .f-index-links a>.f-rich-nav-icon:first-child{flex:0 0 42px}
body[data-unified][data-fidelity] .f-illustrated-row-heading{vertical-align:middle}
body[data-unified][data-fidelity] .f-illustrated-row-heading>.f-rich-nav-icon{margin-bottom:12px}
body[data-unified][data-fidelity] .f-table-service-label{display:block}
body[data-unified][data-fidelity] .f-meaning-icon--illustration{width:96px;height:96px;background:transparent;border:0}
body[data-unified][data-fidelity] .f-meaning-icon--illustration .f-generated-illustration{width:96px;height:96px}
body[data-unified][data-fidelity] .f-heading-with-illustration{position:relative;padding-right:188px;min-height:156px}
body[data-unified][data-fidelity] .f-heading-illustration{position:absolute;right:0;top:0;width:156px}
body[data-unified][data-fidelity] .u-site-footer .footer-brand{container-type:inline-size}
@container(max-width:14em){
 body[data-unified][data-fidelity] .u-site-footer .u-footer-phone{display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:100%;white-space:nowrap}
}
/* 写真・見出し・本文の段を共有し、文章の固定高へ押し込まない。 */
body[data-unified][data-fidelity] .f-haka-task-grid{container-type:inline-size;grid-template-columns:repeat(auto-fit,minmax(min(100%,17em),1fr));align-items:stretch;column-gap:32px;row-gap:24px}
body[data-unified][data-fidelity] .f-haka-task{display:grid;grid-template-rows:auto auto 1fr;align-content:start;gap:24px}
body[data-unified][data-fidelity] .f-haka-task>.f-photo{margin:0;aspect-ratio:16/10;width:100%;overflow:hidden;border-radius:6px;align-self:start}
body[data-unified][data-fidelity] .f-haka-task>.f-photo img{display:block;width:100%;height:100%;aspect-ratio:16/10;object-fit:cover}
body[data-unified][data-fidelity] .f-haka-task-copy{display:contents;padding:0}
body[data-unified][data-fidelity] .f-haka-task h3{margin:0;align-items:flex-start;gap:12px;line-height:1.6;font-size:var(--type-h3);align-self:start}
body[data-unified][data-fidelity] .f-haka-role-icon{width:28px;flex:0 0 28px;margin-top:.27em}
body[data-unified][data-fidelity] .f-haka-role-label{display:block;min-width:0;flex:1;line-break:strict;text-wrap:balance}
body[data-unified][data-fidelity] .f-task-phrase{display:inline-block;max-width:100%;white-space:normal;word-break:normal;overflow-wrap:normal}
body[data-unified][data-fidelity] .f-haka-task p{margin:0;align-self:start}
@supports(grid-template-rows:subgrid){body[data-unified][data-fidelity] .f-haka-task{grid-template-rows:subgrid;grid-row:span 3}}
@container(max-width:54em){
 body[data-unified][data-fidelity] .f-haka-task{grid-row:auto;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:auto 1fr;gap:20px 32px}
 body[data-unified][data-fidelity] .f-haka-task>.f-photo{grid-row:1/span 2;grid-column:1}
 body[data-unified][data-fidelity] .f-haka-task h3,body[data-unified][data-fidelity] .f-haka-task p{grid-column:2}
}
@media(max-width:1100px){
 body[data-unified][data-fidelity] .f-haka-task-grid{grid-template-columns:1fr;gap:40px}
 body[data-unified][data-fidelity] .f-haka-task{grid-row:auto;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:auto 1fr;gap:20px 32px}
 body[data-unified][data-fidelity] .f-haka-task>.f-photo{grid-row:1/span 2;grid-column:1}
 body[data-unified][data-fidelity] .f-haka-task h3,body[data-unified][data-fidelity] .f-haka-task p{grid-column:2}
}
@media(max-width:767px){
 body[data-unified][data-fidelity] .f-illustrated-relationship{grid-template-columns:minmax(0,1fr) 16px minmax(76px,1fr) 16px minmax(0,1fr);gap:4px;padding:0}
 body[data-unified][data-fidelity] .f-portrait-disc{width:min(108px,100%);justify-self:center;min-width:0}
 body[data-unified][data-fidelity] .f-illustrated-relationship>div{gap:8px;min-width:0}
 body[data-unified][data-fidelity] .f-illustrated-relationship .f-portrait-label{min-width:0;width:100%;padding:7px 2px;font-size:1rem;white-space:nowrap}
 body[data-unified][data-fidelity] .f-illustrated-relationship>span{font-size:20px}
 body[data-unified][data-fidelity] .f-illustrated-relationship .f-family-brand img{width:100%;height:auto}
 body[data-unified][data-fidelity] .f-stage-illustration--scene .f-generated-illustration{height:104px;width:128px}
 body[data-unified][data-fidelity] .f-heading-with-illustration{padding-right:104px;min-height:100px}
 body[data-unified][data-fidelity] .f-heading-illustration{position:absolute;display:block;width:88px;top:0;right:0;margin:0}
 body[data-unified][data-fidelity] .f-haka-task{display:grid;grid-row:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:20px}
 body[data-unified][data-fidelity] .f-haka-task>.f-photo{grid-row:auto;grid-column:1;aspect-ratio:16/10}
 body[data-unified][data-fidelity] .f-haka-task h3,body[data-unified][data-fidelity] .f-haka-task p{grid-column:1}
 body[data-unified][data-fidelity] .f-rich-nav-icon{width:40px;height:40px}
 body[data-unified][data-fidelity] .f-illustrated-index .f-rich-nav-link{padding:16px 8px;gap:8px}
 body[data-unified][data-fidelity] .f-illustrated-index .f-index-links{gap:12px}
 body[data-unified][data-fidelity] .f-illustrated-index .f-index-links .f-rich-nav-icon{width:32px;height:32px;flex-basis:32px!important}
 body[data-unified][data-fidelity] .f-illustrated-index .f-icon{width:24px;height:24px}
}
@media(min-width:768px) and (max-width:1023px){body[data-unified][data-fidelity] .f-illustrated-index .f-index-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:479px){body[data-unified][data-fidelity] .f-illustrated-index .f-index-links{grid-template-columns:1fr}}
/* 文字を大きくした場合は、関係図を縦に読み替えて人物名を縮めない。 */
@container(max-width:14em){
 body[data-unified][data-fidelity] .f-illustrated-relationship{grid-template-columns:minmax(0,1fr);max-width:280px;margin-inline:auto;gap:12px}
 body[data-unified][data-fidelity] .f-illustrated-relationship>span{transform:rotate(90deg);justify-self:center}
 body[data-unified][data-fidelity] .f-illustrated-relationship .f-portrait-disc{width:128px}
 body[data-unified][data-fidelity] .f-illustrated-relationship .f-portrait-label{width:auto;min-width:112px;padding-inline:16px}
 body[data-unified][data-fidelity] .f-illustrated-relationship .f-family-brand{width:180px;justify-self:center}
}
/* 3工程の案内も、写真カードと同じく説明文の開始位置を共有する。 */
body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid){container-type:inline-size;row-gap:24px}
@media(min-width:768px){
 @supports(grid-template-rows:subgrid){
  body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid)>li{display:grid;grid-row:span 3;grid-template-rows:subgrid;gap:24px}
  body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy{display:contents;padding:0}
  body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>strong,body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>p{margin:0;align-self:start}
 }
}
@container(max-width:54em){
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid)>li{grid-column:1/-1;grid-row:auto;grid-template-columns:180px minmax(0,1fr);grid-template-rows:auto 1fr;gap:20px 32px}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid)>li::after{display:none}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-stage-illustration{grid-column:1;grid-row:1/span 2}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>strong{grid-column:2;grid-row:1}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>p{grid-column:2;grid-row:2}
}
@media(max-width:767px){
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid)>li{grid-row:auto;grid-column:auto;grid-template-columns:104px minmax(0,1fr);grid-template-rows:auto auto;gap:20px}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-stage-illustration{grid-column:1;grid-row:1}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>strong{grid-column:2;grid-row:1;align-self:center}
 body[data-unified][data-fidelity] .f-illustrated-steps:not(.f-six-stage-grid) .f-step-copy>p{grid-column:1/-1;grid-row:2}
}