/* プレス加工の図・写真・配置。共通style.cssは変更しない。 */
.page-press .press-fv-photo { order: 9; margin: 0; }
.page-press #fv .press-fv-scope { order: 8; }
.page-press .press-fv-photo .photo-placeholder { aspect-ratio: 4 / 3; }
.page-press .press-photo .photo-note { text-align: left; }
.page-press .press-photo-trio { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
/* 全国値は全行で同じ位置。文字は棒の先と下に置き、破線との重なりを避ける。 */
.page-press .press-reference { display: flex; align-items: center; gap: var(--space-2); margin-block: var(--space-4); }
.page-press .press-reference-key { flex: 0 0 28px; width: 28px; border-top: 2px dashed var(--color-navy); }
.page-press .press-chart-row { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: var(--space-1) var(--space-2); padding-block: var(--space-4); border-top: 1px solid var(--color-border); }
.page-press .press-chart-row .chart-region { padding-top: 0; }
.page-press .press-plot { min-width: 0; min-height: 57px; padding-right: 68px; padding-top: 7px; }
.page-press .press-chart-track { position: relative; height: 12px; background: transparent; }
.page-press .press-chart-track::after { content: ""; position: absolute; left: var(--reference-pos); top: -8px; bottom: -8px; border-left: 2px dashed var(--color-navy); }
.page-press .press-bar-value { position: absolute; z-index: 2; left: calc(var(--bar-size) + 8px); top: 50%; transform: translateY(-50%); padding-inline: 3px; background: var(--color-bg); line-height: 1.4; }
.page-press .press-bar-meta { position: absolute; left: 0; top: calc(100% + 12px); white-space: nowrap; font-size: var(--font-source); }
.page-press .press-chart-note { grid-column: 2; margin: 0; font-size: var(--font-source); }
/* 安全説明図の名称はHTML。SVGには機械・引き出し線だけを描く。 */
.page-press .press-safety-figure { padding: var(--space-card); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-bg); }
.page-press .press-safety-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 2fr) minmax(0, 1fr); grid-template-rows: repeat(3, minmax(140px, 1fr)); gap: 0 8px; align-items: center; }
.page-press .press-machine-svg { grid-column: 2; grid-row: 1 / 4; width: 100%; height: 480px; color: var(--color-navy); }
.page-press .press-machine-svg * { vector-effect: non-scaling-stroke; }
.page-press .press-machine-fill { fill: var(--color-bg-alt); }
.page-press .press-machine-panel, .page-press .press-machine-tool { fill: var(--color-accent-bg); }
.page-press .press-machine-danger { fill: rgb(11 87 208 / .06); stroke: var(--color-primary); }
.page-press .press-machine-device, .page-press .press-light-lines { stroke: var(--color-primary); }
.page-press .press-machine-stop { fill: var(--color-error); stroke: var(--color-error); }
.page-press .press-machine-label { position: relative; margin: 0; font-size: 14px; font-weight: var(--font-weight-bold); line-height: 1.7; overflow-wrap: anywhere; }
.page-press .press-part-slide { grid-column: 1; grid-row: 1; }
.page-press .press-part-die { grid-column: 1; grid-row: 2; }
.page-press .press-part-danger { grid-column: 1; grid-row: 3; }
.page-press .press-part-stop { grid-column: 3; grid-row: 1; }
.page-press .press-part-device { grid-column: 3; grid-row: 2; }
.page-press .press-machine-label::after { content: ""; position: absolute; top: 50%; width: 8px; border-top: 1px solid var(--color-navy); }
.page-press :is(.press-part-slide, .press-part-die, .press-part-danger)::after { right: -8px; }
.page-press :is(.press-part-stop, .press-part-device)::after { left: -8px; }
.page-press .press-safety-figure > figcaption { margin-top: var(--space-4); text-wrap: balance; }
.page-press .press-safety-rules > .card { display: grid; grid-template-columns: var(--size-number) minmax(0, 1fr); gap: var(--space-4); }
.page-press .press-safety-rules > .card > div { margin-top: 0; }
@media (min-width: 768px) {
  .page-press #fv .press-fv-photo { grid-area: 4 / 2 / 6 / 3; align-self: start; }
  .page-press #fv .press-fv-scope { grid-area: 8 / 1 / 9 / -1; }
  .page-press .press-fv-photo .photo-placeholder { aspect-ratio: 16 / 9; }
  .page-press .press-photo-trio { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
  .page-press .press-chart-row { grid-template-columns: 56px minmax(0, 1fr); gap: var(--space-2) var(--space-5); }
  .page-press .press-plot { padding-right: 210px; }
  .page-press .press-chart-track { height: 16px; }
  .page-press .press-bar-meta { left: calc(var(--bar-size) + 8px); top: calc(100% + 8px); }
  .page-press .press-machine-label { font-size: var(--font-control); }
}
/* 原稿の既存6手順を使い、PCでは横につなぐ。 */
@media (min-width: 1024px) {
  .page-press #flow > .press-flow-steps { max-width: var(--width-wide); grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-4); align-items: start; }
  .page-press .press-flow-steps > .step { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); padding-bottom: 0; }
  .page-press .press-flow-steps > .step > .num { margin-inline: auto; }
  .page-press .press-flow-steps > .step .h3 { padding-top: 0; font-size: 18px; }
  .page-press .press-flow-steps > .step:not(:last-child)::after { top: calc(var(--size-number) / 2 - 1px); bottom: auto; left: calc(50% + var(--size-number) / 2); width: calc(100% + var(--space-4) - var(--size-number)); height: 2px; }
}