/* Business scenarios: concrete documents, exception handling and deliverables. */
.pain-section .section-heading{margin-bottom:26px}
.pain-tabs button{padding:19px 12px;gap:12px}
.pain-tabs button .pain-tab-number{font:500 .72rem var(--num);opacity:.75}
.business-case{padding:35px 36px 28px;background:#fff;border:1px solid #c4d0c6;border-radius:0 0 15px 15px;scroll-margin-top:105px}
.case-topline{display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:.67rem;letter-spacing:.045em;color:var(--green)}
.case-fiction{flex-shrink:0;border:1px solid #cad6cd;padding:3px 12px;border-radius:99px;font-size:.63rem}
.case-story{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:42px;margin:25px 0}
.case-story h3{font-size:clamp(1.55rem,2.4vw,2.1rem);line-height:1.65;color:var(--navy)}
.case-story>p{font-size:.84rem;line-height:2;color:#616b64}
.case-pains{display:flex;flex-wrap:wrap;gap:9px 23px;margin:0 0 30px;padding:15px 18px;list-style:none;background:#f7f4ed;border-left:3px solid #b9a780}
.case-pains li{font-size:.74rem;color:#72644d;padding-left:13px;position:relative}
.case-pains li::before{content:"";position:absolute;left:0;top:.85em;width:4px;height:4px;border-radius:50%;background:#b2a184}
.case-process{margin-bottom:30px}
.case-process>p{font-size:.72rem;font-weight:600;color:var(--green);margin-bottom:12px}
.case-process ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;list-style:none;padding:0;margin:0}
.case-process li{position:relative;padding:14px 12px;background:#eaf1eb;border:1px solid #ccdacd;border-radius:6px;font-size:.77rem;font-weight:600;text-align:center;color:#3e5f4d}
.case-process li>span{display:block;font:500 .65rem var(--num);margin-bottom:7px;opacity:.7}
.case-process li+li::before{content:"→";position:absolute;left:-17px;top:30px;width:16px;color:#859887;font-size:.75rem}
.case-workbench{display:grid;grid-template-columns:.9fr 1.1fr;border:1px solid #d6dfd4;border-radius:10px;overflow:hidden}
.case-inbox,.case-output{min-width:0;padding:25px}
.case-inbox{background:#f6f7f2;border-right:1px solid #d6dfd4}
.case-output{background:#fff}
.case-overline{font:600 .61rem/1.8 var(--sans);letter-spacing:.05em;color:#798678}
.case-workbench h4{font:600 1.02rem/1.8 var(--serif);color:var(--navy);margin:8px 0 21px}
.case-files{display:grid;gap:13px}
.case-file{display:flex;gap:13px;padding:17px 15px;border:1px solid #d7ddd2;background:#fff;box-shadow:3px 3px 0 #e9ede4;border-radius:3px}
.file-type{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:start;width:41px;min-height:43px;border:1px solid #b9c7b7;border-radius:2px;font:600 .58rem/1.4 var(--sans);color:#5c755c;background:#f1f5ee}
.case-file>div{min-width:0}
.case-file strong{display:block;font-size:.76rem;line-height:1.75;font-weight:600;overflow-wrap:anywhere}
.case-file p{font-size:.74rem;line-height:1.9;margin-top:7px;color:#697364}
.case-file b{font-weight:500;color:#966c2c}
.case-rule{margin-top:19px;font-size:.69rem;line-height:1.85;color:#788071}
.case-table-wrap{max-width:100%;overflow-x:auto}
.case-table{width:100%;border-collapse:collapse;font-size:.71rem;line-height:1.85;table-layout:fixed}
.case-table th,.case-table td{padding:12px 7px;border-bottom:1px solid #e1e6dd;text-align:left;vertical-align:top;overflow-wrap:anywhere}
.case-table thead{background:#f3f5ef;color:#73806d;font-size:.61rem}
.case-table thead th{font-weight:500}
.case-table th:first-child{width:19%}
.case-table th:nth-child(2){width:45%}
.case-table th:last-child{width:36%}
.case-table tbody th{font-weight:600}
.case-table small{display:block;font-size:.62rem;color:#7a8574}
.case-table .state{display:inline-block;font-size:.63rem;line-height:1.8;padding:3px 7px;border-radius:4px}
.case-table .ready{color:#446853;background:#eaf3ec}
.case-table .hold{color:#8b642c;background:#fcf0d8}
.case-table .muted{color:#677365;background:#eef0e9}
.case-details{border:1px solid #bcccba;border-radius:6px;margin-top:22px;color:#4c6450;background:#f6f9f3}
.case-details summary{padding:14px;font-size:.75rem;font-weight:600;cursor:pointer;line-height:1.8}
.case-details summary:hover{background:#edf3e8}
.case-details[open] summary{border-bottom:1px solid #d4dfcf}
.case-details>div{padding:0 17px 20px}
.case-details h5{font-size:.76rem;line-height:1.8;margin:18px 0 7px;font-weight:600}
.case-details p{font-size:.74rem;line-height:1.95;color:#63745d}
.case-human{margin-top:21px;font-size:.7rem;line-height:1.9;color:#757b70}
.case-human strong{display:block;font-size:.68rem;color:#53644d;font-weight:600;margin-bottom:5px}
.case-bottom{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:29px}
.case-bottom>div{border-top:1px solid #dce4d8;padding-top:15px}
.case-bottom span{display:block;font-size:.69rem;color:var(--green);font-weight:600;margin-bottom:7px}
.case-bottom p{font-size:.77rem;line-height:1.9;color:#697465}
.case-change{display:grid;grid-template-columns:135px 1fr;gap:20px;align-items:start;margin-top:26px;padding:22px 24px;border-radius:7px;background:var(--navy);color:#fff}
.case-change span{font-size:.69rem;color:#b9cec2;padding-top:3px}
.case-change p{font:500 .95rem/1.9 var(--serif);letter-spacing:.02em}
.case-scope{margin-top:17px;font-size:.68rem;color:#737e6c;line-height:1.9}
.case-sources{margin-top:26px;border-top:1px solid #cdd9ca;border-bottom:1px solid #cdd9ca;color:#6b7965}
.case-sources summary{padding:18px 0;font-size:.73rem;cursor:pointer}
.case-sources p,.case-sources ul{font-size:.71rem;line-height:1.9}
.case-sources ul{padding-left:20px;margin:15px 0 24px}
.case-sources li+li{margin-top:10px}
.case-sources a{text-underline-offset:4px}
@media(max-width:1050px){.business-case{padding:29px 26px}.case-story{gap:28px}.case-story h3{font-size:1.7rem}.case-workbench{grid-template-columns:.9fr 1.1fr}.case-inbox,.case-output{padding:20px}.case-process li{font-size:.7rem}.case-file{padding:15px 12px;gap:9px}.pain-tabs button span{font-size:.83rem}}
@media(max-width:850px){.case-story{grid-template-columns:1fr;gap:17px}.case-workbench{grid-template-columns:1fr}.case-inbox{border-right:0;border-bottom:1px solid #d6dfd4}.case-files{grid-template-columns:repeat(3,minmax(0,1fr))}.case-file{display:block}.file-type{margin-bottom:10px}.case-table{font-size:.8rem}.case-table .state{font-size:.72rem}.case-output h4{font-size:1.15rem}.case-bottom{gap:20px}.case-process ol{gap:12px}.case-process li+li::before{left:-13px;width:12px}.pain-tabs button{gap:7px}.pain-tabs button span{font-size:.77rem}}
@media(max-width:640px){.pain-section .section-heading{margin-bottom:21px}.pain-tabs{gap:5px}.pain-tabs button{display:flex;flex-direction:column;padding:11px 6px;gap:4px;min-width:0;white-space:normal;line-height:1.5}.pain-tabs button span{font-size:.71rem;line-height:1.6;text-wrap:balance}.pain-tabs button .pain-tab-number{font-size:.61rem}.business-case{padding:24px 18px 22px}.case-topline{align-items:flex-start;flex-direction:column;gap:11px;font-size:.61rem;letter-spacing:0}.case-fiction{font-size:.59rem;padding:2px 9px}.case-story{margin:20px 0;gap:14px}.case-story h3{font-size:1.42rem;line-height:1.75;letter-spacing:0}.case-story h3 br{display:none}.case-story p{font-size:.78rem;line-height:1.95}.case-pains{margin-bottom:24px;padding:13px 11px;gap:8px}.case-pains li{font-size:.7rem}.case-process{margin-bottom:24px}.case-process>p{font-size:.68rem}.case-process ol{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.case-process li{font-size:.69rem;padding:12px 6px}.case-process li+li::before{display:none}.case-process li>span{font-size:.6rem;margin-bottom:5px}.case-inbox,.case-output{padding:21px 15px}.case-overline{font-size:.59rem}.case-workbench h4{font-size:.94rem;margin-bottom:17px}.case-files{grid-template-columns:1fr;gap:11px}.case-file{display:flex;padding:15px 12px;gap:11px}.file-type{margin:0;width:37px;min-height:40px;font-size:.55rem}.case-file strong{font-size:.72rem}.case-file p{font-size:.72rem}.case-rule{font-size:.65rem}.case-table{font-size:.68rem}.case-table th,.case-table td{padding:10px 5px}.case-table th:first-child{width:22%}.case-table th:nth-child(2){width:43%}.case-table th:last-child{width:35%}.case-table thead{font-size:.58rem}.case-table small{font-size:.58rem}.case-table .state{font-size:.59rem;padding:3px 4px}.case-details{margin-top:19px}.case-details summary{padding:12px;font-size:.7rem}.case-details>div{padding:0 12px 17px}.case-details p{font-size:.7rem}.case-human{font-size:.66rem;margin-top:18px}.case-bottom{grid-template-columns:1fr;gap:17px;margin-top:23px}.case-bottom p{font-size:.73rem}.case-change{grid-template-columns:1fr;gap:7px;padding:18px;margin-top:23px}.case-change span{font-size:.62rem}.case-change p{font-size:.87rem}.case-scope{font-size:.64rem}.case-sources summary{font-size:.68rem}.case-sources p,.case-sources ul{font-size:.67rem}}
@media(max-width:360px){.business-case{padding:21px 12px}.case-inbox,.case-output{padding:19px 11px}.case-story h3{font-size:1.3rem}.pain-tabs button span{font-size:.63rem}.case-file{padding:13px 9px;gap:8px}.file-type{width:32px}.case-file strong{font-size:.66rem}.case-table .state{font-size:.57rem}}
/* On a narrow screen each record becomes a readable two-column card. */
@media(max-width:640px){
 .case-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .case-table,.case-table tbody{display:block;width:100%}
 .case-table tbody tr{display:grid;grid-template-columns:1fr 1fr;border:1px solid #dce5d7;border-radius:5px;margin-top:12px;overflow:hidden}
 .case-table tbody th:first-child{grid-column:1/-1;display:block;width:100%;padding:7px 11px;background:#f1f5ee;font-size:.76rem}
 .case-table td{display:block;padding:10px;border:0;font-size:.76rem}
 .case-table td+td{border-left:1px solid #e5ebdf}
 .case-table td::before{display:block;margin-bottom:7px;font-size:.6rem;color:#788371}
 .case-table td:nth-child(2)::before{content:"処理する内容"}
 .case-table td:nth-child(3)::before{content:"次の対応"}
 .case-table .state{font-size:.7rem;line-height:1.9;padding:4px 6px}
 .case-table small{font-size:.64rem;margin-top:5px}
 .case-file strong,.case-file p{font-size:.78rem}
 .case-details h5,.case-details p{font-size:.78rem}
 .case-human{font-size:.73rem}
 .case-human strong{font-size:.7rem}
}
