/* セコサポ プロモード v2 */
html:root body.seco-pro2{overflow:hidden!important;background:#0B2A21!important}
body.seco-pro2 #commonHeader,body.seco-pro2 #commonFooter,body.seco-pro2 footer,body.seco-pro2 .c--labeling-act,body.seco-pro2 #postHeader,
body.seco-pro2 .a--header-style-parts,body.seco-pro2 .sgn-bar,body.seco-pro2 #secoSticky,body.seco-pro2 #secoTop,body.seco-pro2 .google-auto-placed,
body.seco-pro2 ins.adsbygoogle,body.seco-pro2 .snackbar{display:none!important}

#proApp2{--bg:#0B2A21;--bg2:#103629;--bg3:#16463A;--line:rgba(255,255,255,.10);--tx:#E6EFEA;--mut:#9DB6AB;--amber:#F2B600;--brand:#0D4A3A;--rail:320px;--ratio:.5;
  position:fixed;left:0;right:0;bottom:0;top:0;z-index:99990;display:grid;grid-template-columns:var(--rail) minmax(0,1fr);grid-template-rows:54px minmax(0,1fr);
  background:var(--bg);color:var(--tx);font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;transition:grid-template-columns .25s ease}
body.admin-bar #proApp2{top:32px}
@media (max-width:782px){body.admin-bar #proApp2{top:46px}}
#proApp2 *,#proApp2 *::before,#proApp2 *::after{box-sizing:border-box}
#proApp2 button,#proApp2 input{font-family:inherit}
#proApp2 :focus-visible{outline:3px solid var(--amber)!important;outline-offset:2px}
#proApp2 .p2-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#proApp2.is-rail-off{grid-template-columns:0 minmax(0,1fr)}
#proApp2 h2,#proApp2 h3,#proApp2 p,#proApp2 ol{margin:0;padding:0;border:0;background:none;color:inherit;font-family:inherit;letter-spacing:normal}
#proApp2 h2::before,#proApp2 h2::after,#proApp2 h3::before,#proApp2 h3::after{content:none!important;display:none!important}

/* 上のバー */
#proApp2 .p2-top{grid-column:1/-1;display:flex;align-items:center;gap:8px;padding:0 10px;background:linear-gradient(180deg,#0E3328,#0A281F);border-bottom:1px solid var(--line);min-width:0;position:relative}
#proApp2 .p2-top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--amber),transparent) no-repeat;background-size:160px 100%;background-position:-160px 0;animation:p2Bus 4s linear infinite;opacity:.8}
@keyframes p2Bus{to{background-position:calc(100% + 160px) 0}}
#proApp2 .p2-brand{display:flex;align-items:center;gap:6px;color:#fff!important;text-decoration:none!important;flex:none;padding:0 6px}
#proApp2 .p2-brand b{font-size:16px;font-weight:900;letter-spacing:.02em}
#proApp2 .p2-brand i{font-style:normal;font-size:10.5px;font-weight:800;color:#1b1400;background:var(--amber);border-radius:4px;padding:2px 6px;letter-spacing:.08em}
#proApp2 .p2-ib{display:inline-flex;align-items:center;gap:6px;height:36px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--tx)!important;border-radius:9px;padding:0 11px;font-size:13px;font-weight:700;text-decoration:none!important;cursor:pointer;white-space:nowrap;flex:none}
#proApp2 .p2-ib svg{width:18px;height:18px}
#proApp2 .p2-ib:hover{background:rgba(255,255,255,.10)}
#proApp2 .p2-ib[aria-pressed="true"]{background:var(--amber);border-color:var(--amber);color:#1b1400!important}
#proApp2 .p2-ib[hidden]{display:none}
#proApp2 .p2-acts{display:flex;gap:6px;margin-left:auto;flex:none}

/* タブ */
#proApp2 .p2-tabs{flex:1;min-width:0;display:flex;gap:4px;overflow-x:auto;scrollbar-width:thin;padding:0 4px;align-self:stretch;align-items:flex-end}
#proApp2 .p2-tabs-empty{align-self:center;color:var(--mut);font-size:12.5px;padding-left:6px;white-space:nowrap}
#proApp2 .p2-tab{display:flex;align-items:center;max-width:230px;min-width:120px;height:42px;border-radius:10px 10px 0 0;background:rgba(255,255,255,.05);border:1px solid var(--line);border-bottom:0;flex:none;position:relative;animation:p2TabIn .22s ease}
@keyframes p2TabIn{from{opacity:0;transform:translateY(6px)}}
#proApp2 .p2-tab.is-on{background:var(--bg3)}
#proApp2 .p2-tab.is-focus{background:#F7F8F5;border-color:#F7F8F5}
#proApp2 .p2-tab.is-focus .p2-tab-b{color:#15221D}
#proApp2 .p2-tab.is-focus::before{content:"";position:absolute;left:8px;right:8px;top:-1px;height:3px;border-radius:0 0 3px 3px;background:var(--amber)}
#proApp2 .p2-tab-b{flex:1;min-width:0;display:flex;align-items:center;gap:7px;height:100%;border:0;background:none;color:var(--tx);padding:0 4px 0 9px;font-size:12.5px;font-weight:700;cursor:pointer;text-align:left}
#proApp2 .p2-tab-b span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#proApp2 .p2-tab-b em{font-style:normal;font-size:10.5px;line-height:16px;font-weight:800;min-width:18px;text-align:center;background:var(--amber);color:#1b1400;border-radius:3px;padding:0 4px;flex:none}
#proApp2 .p2-tab-x{flex:none;width:26px;height:26px;margin-right:6px;border:0;border-radius:7px;background:none;color:var(--mut);font-size:16px;line-height:1;cursor:pointer}
#proApp2 .p2-tab-x:hover{background:rgba(255,255,255,.12);color:#fff}
#proApp2 .p2-tab.is-focus .p2-tab-x{color:#5E6C66}
#proApp2 .p2-tab.is-focus .p2-tab-x:hover{background:#E4EAE6;color:#15221D}

/* アイコン */
#proApp2 .p2-ic{flex:none;display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;color:#fff;font-weight:800;font-size:12.5px;letter-spacing:-.02em;line-height:1;
  background:var(--c);background:linear-gradient(150deg,color-mix(in srgb,var(--c) 78%,#fff),var(--c) 52%,color-mix(in srgb,var(--c) 78%,#000));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.18);text-shadow:0 1px 1px rgba(0,0,0,.25)}
#proApp2 .p2-ic.is-s{font-size:10px}
#proApp2 .p2-ic.is-sm{width:24px;height:24px;border-radius:7px;font-size:9.5px}
#proApp2 .p2-ic.is-sm.is-s{font-size:8px}
#proApp2 .p2-ic.is-xs{width:20px;height:20px;border-radius:6px;font-size:8.5px;margin-right:6px}

/* 一覧 */
#proApp2 .p2-side{grid-row:2;grid-column:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg2);border-right:1px solid var(--line);overflow:hidden}
#proApp2.is-rail-off .p2-side{visibility:hidden}
#proApp2 .p2-search{position:relative;margin:12px 12px 8px;display:flex;align-items:center;height:42px;border:1.5px solid rgba(255,255,255,.22);border-radius:10px;background:rgba(0,0,0,.18);padding:0 8px 0 36px}
#proApp2 .p2-search:focus-within{border-color:var(--amber);box-shadow:0 0 0 3px rgba(242,182,0,.25)}
#proApp2 .p2-search>span{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--mut)}
#proApp2 .p2-search>span svg{width:18px;height:18px;display:block}
#proApp2 .p2-search input{flex:1;min-width:0;height:100%;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#fff!important;font-size:15px!important;padding:0!important;margin:0!important}
#proApp2 .p2-search input::placeholder{color:#7F9A8E}
#proApp2 .p2-search kbd{font-weight:700;font-size:11px;line-height:1;color:var(--mut);border:1px solid rgba(255,255,255,.2);border-bottom-width:2px;border-radius:5px;padding:3px 6px}
#proApp2 .p2-chips{display:flex;gap:5px;overflow-x:auto;padding:0 12px 8px;scrollbar-width:none;flex-wrap:wrap;flex:none}
#proApp2 .p2-chips::-webkit-scrollbar{display:none}
#proApp2 .p2-chip{display:inline-flex;align-items:center;gap:5px;flex:none;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:var(--tx);border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:700;cursor:pointer;line-height:1.5}
#proApp2 .p2-chip i{width:8px;height:8px;border-radius:2px;background:var(--c)}
#proApp2 .p2-chip b{font-size:10.5px;color:var(--mut);font-weight:700}
#proApp2 .p2-chip[aria-pressed="true"]{background:var(--c,var(--amber));border-color:var(--c,var(--amber));color:#fff}
#proApp2 .p2-chip[aria-pressed="true"]:not([style]){color:#1b1400}
#proApp2 .p2-chip[aria-pressed="true"] b{color:inherit;opacity:.8}
#proApp2 .p2-chip[aria-pressed="true"] i{background:#fff}
#proApp2 .p2-count{padding:2px 14px 6px;font-size:11.5px;color:var(--mut);font-weight:700}
#proApp2 .p2-list{flex:1;min-height:0;overflow:auto;padding:0 8px 8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
#proApp2 .p2-item{display:flex;align-items:center;border-radius:10px;position:relative}
#proApp2 .p2-item:hover,#proApp2 .p2-item.is-cur{background:rgba(255,255,255,.06)}
#proApp2 .p2-item.is-shown{background:rgba(242,182,0,.12);box-shadow:inset 3px 0 0 var(--amber)}
#proApp2 .p2-item-b{flex:1;min-width:0;display:flex;align-items:center;gap:10px;border:0;background:none;color:inherit;text-align:left;padding:7px 4px 7px 8px;cursor:pointer}
#proApp2 .p2-item-t{display:flex;flex-direction:column;min-width:0;flex:1}
#proApp2 .p2-item-t b{font-size:13.5px;font-weight:700;color:#fff;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#proApp2 .p2-item-t small{font-size:11.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#proApp2 .p2-dot{width:7px;height:7px;border-radius:50%;background:#2EE07A;box-shadow:0 0 6px #2EE07A;flex:none}
#proApp2 .p2-star{flex:none;width:30px;height:30px;border:0;border-radius:8px;background:none;color:#6E8A7E;font-size:16px;cursor:pointer;margin-right:2px}
#proApp2 .p2-star:hover{background:rgba(255,255,255,.1);color:var(--amber)}
#proApp2 .p2-star[aria-pressed="true"]{color:var(--amber)}
#proApp2 .p2-none{padding:18px 12px;color:var(--mut);font-size:13px}
#proApp2 .p2-sidefoot{padding:8px 14px 12px;font-size:11px;color:#7F9A8E;border-top:1px solid var(--line)}

/* 作業画面 */
#proApp2 .p2-work{grid-row:2;grid-column:2;position:relative;min-width:0;min-height:0;background:#E9EEEB;overflow:hidden}
#proApp2 .p2-panes{position:absolute;inset:0;display:flex}
#proApp2 .p2-pane{position:relative;display:flex;flex-direction:column;min-width:0;flex:1 1 0;background:#F7F8F5}
#proApp2[data-split="1"] .p2-pane[data-pane="0"]{flex:0 0 calc(var(--ratio) * 100% - 4px)}
#proApp2[data-split="0"] .p2-pane[data-pane="1"],#proApp2[data-split="0"] .p2-gut{display:none}
#proApp2 .p2-ph{display:none;flex:none;height:34px;align-items:center;gap:6px;padding:0 6px 0 10px;background:#DDE5E1;color:#15221D;font-size:12.5px;font-weight:800;cursor:pointer}
#proApp2[data-split="1"] .p2-ph{display:flex}
#proApp2 .p2-ph-n{flex:1;min-width:0;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#proApp2 .p2-ph-x{border:0;background:none;width:26px;height:26px;border-radius:7px;font-size:16px;color:#5E6C66;cursor:pointer}
#proApp2 .p2-ph-x:hover{background:#C9D4CF}
#proApp2[data-split="1"] .p2-pane.is-focus .p2-ph{background:var(--amber);color:#1b1400}
#proApp2[data-split="1"] .p2-pane.is-focus{box-shadow:inset 0 0 0 2px var(--amber)}
#proApp2 .p2-body{position:relative;flex:1;min-height:0;overflow:auto}
#proApp2 .p2-gut{flex:none;width:8px;background:#C3CEC9;cursor:col-resize;position:relative;touch-action:none}
#proApp2 .p2-gut::after{content:"";position:absolute;left:3px;top:50%;width:2px;height:40px;margin-top:-20px;border-radius:2px;background:#7E9188}
#proApp2 .p2-gut:hover,#proApp2.is-drag .p2-gut{background:var(--amber)}
#proApp2.is-drag .p2-layer{pointer-events:none}
#proApp2 .p2-layer{position:absolute;inset:0;pointer-events:none}
#proApp2 .p2-frame{position:absolute;border:0;background:#fff;pointer-events:auto;display:none}
#proApp2 .p2-frame.is-loading{opacity:.2}
#proApp2 .p2-loading{position:absolute;display:none;place-items:center;align-content:center;gap:10px;color:#5E6C66;font-size:13px;font-weight:700;pointer-events:none;text-align:center}
#proApp2 .p2-loading[style*="display:block"]{display:grid!important}
#proApp2 .p2-spin{width:28px;height:28px;border-radius:50%;border:3px solid #CFDAD5;border-top-color:#0D4A3A;animation:p2Spin .8s linear infinite;margin:0 auto 4px}
@keyframes p2Spin{to{transform:rotate(360deg)}}

/* 空の画面 */
#proApp2 .p2-empty{height:100%;color:#15221D}
#proApp2 .p2-empty[hidden]{display:none}
#proApp2 .p2-wel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:36px;align-items:start;max-width:1180px;margin:0 auto;padding:40px 36px}
#proApp2 .p2-wel h2{font-size:26px;font-weight:900;line-height:1.35;color:#15221D}
#proApp2 .p2-wel p{margin-top:8px;font-size:14px;color:#4E5D57;max-width:46em}
#proApp2 .p2-wel h3,#proApp2 .p2-pe h3{margin-top:22px;font-size:12.5px;font-weight:800;color:#5E6C66}
#proApp2 .p2-steps{list-style:none;display:flex;gap:8px;margin-top:16px;counter-reset:s}
#proApp2 .p2-steps li{flex:1;background:#fff;border:1px solid #DCE3DF;border-radius:12px;padding:10px 12px;font-size:12px;color:#5E6C66;counter-increment:s;position:relative}
#proApp2 .p2-steps li::before{content:counter(s);position:absolute;top:-9px;left:10px;width:20px;height:20px;border-radius:50%;background:#0D4A3A;color:#fff;font-weight:800;font-size:11px;line-height:20px;text-align:center}
#proApp2 .p2-steps b{display:block;font-size:14px;color:#15221D;margin-top:2px}
#proApp2 .p2-apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:8px}
#proApp2 .p2-app{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #DCE3DF;border-radius:11px;padding:8px;font-size:12.5px;font-weight:700;color:#15221D;text-align:left;cursor:pointer;line-height:1.35;transition:border-color .12s,transform .12s}
#proApp2 .p2-app span:not(.p2-ic){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#proApp2 .p2-app:hover{border-color:#0D4A3A;transform:translateY(-1px)}
#proApp2 .p2-pe{max-width:520px;margin:0 auto;padding:60px 24px;text-align:center}
#proApp2 .p2-pe-ic{width:56px;height:56px;margin:0 auto 12px;border-radius:16px;background:#fff;border:1px dashed #9DB5AA;display:grid;place-items:center;color:#0D4A3A;animation:p2Nudge 2.4s ease-in-out infinite}
#proApp2 .p2-pe-ic svg{width:30px;height:30px}
@keyframes p2Nudge{50%{transform:translateX(-6px)}}
#proApp2 .p2-pe p{font-size:13px;color:#5E6C66}
#proApp2 .p2-pe p b{font-size:15px;color:#15221D}
#proApp2 .p2-pe .p2-apps{text-align:left}

/* 動く案内（小さな作業台の模型） */
#proApp2 .p2-demo{background:#0E3328;border-radius:16px;padding:12px;box-shadow:0 20px 40px -24px rgba(0,0,0,.6)}
#proApp2 .p2-d-top{display:flex;align-items:center;gap:5px;height:22px}
#proApp2 .p2-d-top>i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.25)}
#proApp2 .p2-d-tab{height:14px;border-radius:4px 4px 0 0;background:rgba(255,255,255,.12);width:0;margin-left:4px}
#proApp2 .p2-d-tab.t1{animation:dT1 9s infinite}#proApp2 .p2-d-tab.t2{animation:dT2 9s infinite}
@keyframes dT1{0%,20%{width:0}28%,100%{width:60px;background:#F7F8F5}}
@keyframes dT2{0%,58%{width:0}66%,100%{width:60px;background:var(--amber)}}
#proApp2 .p2-d-body{position:relative;display:flex;gap:8px;height:220px;margin-top:4px}
#proApp2 .p2-d-side{width:30%;background:#16463A;border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:7px}
#proApp2 .p2-d-side span{height:14px;border-radius:4px;background:rgba(255,255,255,.12)}
#proApp2 .p2-d-side .hl{animation:dH1 9s infinite}#proApp2 .p2-d-side .hl2{animation:dH2 9s infinite}
@keyframes dH1{0%,8%{background:rgba(255,255,255,.12)}12%,26%{background:var(--amber)}32%,100%{background:rgba(255,255,255,.12)}}
@keyframes dH2{0%,46%{background:rgba(255,255,255,.12)}50%,64%{background:var(--amber)}70%,100%{background:rgba(255,255,255,.12)}}
#proApp2 .p2-d-work{flex:1;display:flex;gap:6px;background:#E9EEEB;border-radius:8px;padding:6px;overflow:hidden}
#proApp2 .p2-d-p1,#proApp2 .p2-d-p2{background:#fff;border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:7px}
#proApp2 .p2-d-p1{flex:1;opacity:0;animation:dP1 9s infinite}
#proApp2 .p2-d-p2{flex:0 0 0;padding:0;opacity:0;animation:dP2 9s infinite;box-shadow:inset 0 0 0 2px var(--amber)}
#proApp2 .p2-d-p1 b,#proApp2 .p2-d-p2 b{display:block;height:10px;border-radius:3px;background:#DCE3DF}
#proApp2 .p2-d-p1 b.w,#proApp2 .p2-d-p2 b.w{background:#0D4A3A;width:60%}
@keyframes dP1{0%,22%{opacity:0;transform:translateY(8px)}28%,100%{opacity:1;transform:none}}
@keyframes dP2{0%,58%{flex-basis:0;padding:0;opacity:0}66%,100%{flex-basis:46%;padding:10px;opacity:1}}
#proApp2 .p2-d-cur{position:absolute;width:16px;height:16px;border-radius:50% 50% 50% 0;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.4);transform:rotate(-45deg);animation:dC 9s infinite}
@keyframes dC{0%{left:80%;top:85%}10%,18%{left:20%;top:30px}40%,46%{left:20%;top:30px}50%,56%{left:20%;top:72px}62%{left:85%;top:-10px}72%,100%{left:85%;top:-10px;opacity:0}}
#proApp2 .p2-d-cap{display:flex;justify-content:space-between;gap:6px;margin-top:10px;font-size:11.5px;font-weight:800;color:#7F9A8E}
#proApp2 .p2-d-cap span{animation:dCap 9s infinite}
#proApp2 .p2-d-cap .c1{animation-name:dC1}#proApp2 .p2-d-cap .c2{animation-name:dC2}#proApp2 .p2-d-cap .c3{animation-name:dC3}
@keyframes dC1{0%,26%{color:var(--amber)}30%,100%{color:#7F9A8E}}
@keyframes dC2{0%,26%{color:#7F9A8E}30%,54%{color:var(--amber)}58%,100%{color:#7F9A8E}}
@keyframes dC3{0%,56%{color:#7F9A8E}60%,96%{color:var(--amber)}100%{color:#7F9A8E}}

#proApp2 .p2-toast{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);max-width:calc(100% - 32px);background:#15221D;color:#fff;border-radius:10px;padding:10px 16px;font-size:13px;font-weight:700;box-shadow:0 12px 30px -10px rgba(0,0,0,.6);z-index:20;animation:p2TabIn .2s ease}
#proApp2 .p2-toast[hidden]{display:none}
#proApp2 .p2-scrim{display:none}

/* スマホ・タブレット縦 */
@media (max-width:899px){
  #proApp2{grid-template-columns:0 minmax(0,1fr)!important;grid-template-rows:52px minmax(0,1fr)}
  #proApp2 .p2-side{position:absolute;left:0;top:0;bottom:0;width:min(88vw,360px);z-index:30;visibility:visible!important;transform:translateX(0);transition:transform .25s ease;box-shadow:12px 0 30px rgba(0,0,0,.4)}
  #proApp2.is-rail-off .p2-side{transform:translateX(-105%)}
  #proApp2:not(.is-rail-off) .p2-scrim{display:block;position:absolute;inset:52px 0 0 0;background:rgba(0,0,0,.45);z-index:25}
  #proApp2 .p2-ib span{display:none}
  #proApp2 .p2-ib{padding:0 9px}
  #proApp2 .p2-railbtn span{display:inline}
  #proApp2 #p2Split{display:none}
  #proApp2 .p2-brand b{display:none}
  #proApp2 .p2-tab{min-width:44px;max-width:150px}
  #proApp2 .p2-search kbd{display:none}
  #proApp2 .p2-tabs-empty{display:none}
  #proApp2 .p2-wel{grid-template-columns:1fr;padding:22px 16px;gap:20px}
  #proApp2 .p2-wel-r{order:-1}
  #proApp2 .p2-d-body{height:150px}
  #proApp2 .p2-steps{flex-direction:column;gap:12px}
  #proApp2 .p2-apps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){#proApp2 *,#proApp2 .p2-top::after{animation:none!important;transition:none!important}#proApp2 .p2-d-p1,#proApp2 .p2-d-p2{opacity:1}}
