/* ===== PAGE TITLE ===== */
.performance .page-title{margin-bottom:40px;}
.performance .page-title h2{font-size:var(--fs36);font-weight:700;color:var(--c_base4);line-height:1.2;}
.performance .page-title h2 span{color:var(--c_base2);}
.performance .page-title p{margin-top:12px;font-size:var(--fs16);color:#888;}
 
/* ===== STAT BANNER ===== */
.performance .stat-banner{display:flex;gap:2px;margin-bottom:60px;border-radius:12px;overflow:hidden;}
.performance .stat-banner .stat-item{flex:1;padding:30px 24px;background:var(--c_base4);text-align:center;position:relative;}
.performance .stat-banner .stat-item::after{content:'';position:absolute;right:0;top:20%;height:60%;width:1px;background:rgba(255,255,255,0.1);}
.performance .stat-banner .stat-item:last-child::after{display:none;}
.performance .stat-banner .stat-item .num{font-size:var(--fs40);font-weight:700;color:var(--c_base1);line-height:1;}
.performance .stat-banner .stat-item .num span{font-size:var(--fs22);}
.performance .stat-banner .stat-item .label{margin-top:8px;font-size:var(--fs14);color:rgba(255,255,255,0.7);}
 
/* ===== TAB ===== */
.performance .tab-nav{display:flex;gap:0;margin-bottom:48px;border-bottom:2px solid var(--border1);}
.performance .tab-nav button{padding:16px 40px;font-size:var(--fs18);font-weight:600;color:#999;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .25s;}
.performance .tab-nav button.active{color:var(--c_base2);border-bottom-color:var(--c_base2);}
.performance .tab-nav button:hover{color:var(--c_base2);}
 
/* ===== TAB PANEL ===== */
.performance .tab-panel{display:none;}
.performance .tab-panel.active{display:block;}
 
/* ===== [탭1] 설치현황 ===== */
.performance .install-layout{display:grid;grid-template-columns:420px 1fr;gap:100px;align-items:start;}
 
/* 좌측 */
.performance.fade-left.visible {position:sticky; top:120px;}
.performance .install-map{position:relative;background:#f5f7fa;border-radius:16px;overflow:hidden;}
.performance .install-map img{width:100%;height:500px;object-fit:contain;padding:20px;mix-blend-mode:multiply;}
.performance .install-map .map-badge{position:absolute;top:16px;left:16px;background:var(--c_base2);color:#fff;font-size:var(--fs16);font-weight:700;padding:6px 14px;border-radius:100px;}
 
/* 우측 */
.performance .install-right{min-width:0;overflow:hidden;}
.performance .install-info-title{margin-bottom:24px;}
.performance .install-info-title h3{font-size:var(--fs30);font-weight:700;color:var(--c_base4);line-height:1.3;}
.performance .install-info-title h3 em{color:var(--c_base2);font-style:normal;}
.performance .install-info-title p{margin-top:10px;font-size:var(--fs15);color:#888;line-height:1.7;}
 
/* 갤러리 슬라이더 (탭1 우측 - caseSwiper 동일 폼) */
.performance .installCaseSwiper{border-radius:14px;overflow:hidden;width:100%;max-width:100%;margin:0; border:1px solid var(--border1);}
.performance .installCaseSwiper .swiper-slide{border-radius:14px;overflow:hidden;background:#f0f2f5;}
.performance .installCaseSwiper .swiper-slide img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;}
.performance .installCase-nav{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px;position:relative;}
.performance .installCasePrev,
.performance .installCaseNext{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.9);border:1px solid #e1e7f0;display:flex;align-items:center;justify-content:center;color:var(--c_base4);cursor:pointer;transition:all .25s;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.performance .installCasePrev:hover,
.performance .installCaseNext:hover{background:var(--c_base2);border-color:var(--c_base2);color:#fff;}
.performance .installCasePagination{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;}
.performance .installCasePagination .swiper-pagination-bullet{width:8px;height:8px;border-radius:50%;background:#d0d5dd;opacity:1;transition:all .25s;margin:0 !important;}
.performance .installCasePagination .swiper-pagination-bullet-active{width:24px;border-radius:100px;background:var(--c_base2);}
 
/* 주요 납품처 */
.performance .client-tags{margin-top:24px;}
.performance .client-tags h4{font-size:var(--fs24);font-weight:700;color:var(--c_base4);margin-bottom:12px;}
.performance .client-tags .tags{display:flex;flex-wrap:wrap;gap:8px;background:#f5f7fa;padding:20px 24px;border-radius:16px;border:1px solid var(--border1);}
.performance .client-tags .tag{padding:6px 14px;background:#fff;border:1px solid var(--border1);border-radius:100px;font-size:var(--fs16);color:var(--c_base5);transition:all .2s;}
.performance .client-tags .tag:hover{border-color:var(--c_base2);color:var(--c_base2);}
 
/* ===== [탭2] 연도별 실적 ===== */
.performance .timeline-layout{display:grid;grid-template-columns:200px 1fr;gap:0;align-items:start;}
.performance .year-nav{position:sticky;top:80px;}
.performance .year-nav ul{display:flex;flex-direction:column;gap:2px;}
.performance .year-nav ul li a{display:block;padding:10px 16px;font-size:var(--fs15);font-weight:600;color:#aaa;border-left:2px solid var(--border1);transition:all .2s;line-height:1;}
.performance .year-nav ul li a:hover{color:var(--c_base2);}
.performance .year-nav ul li a.active{color:var(--c_base2);border-left-color:var(--c_base2);background:#fff8f5;}
.performance .timeline{padding-left:40px;border-left:2px solid var(--border1);}
.performance .timeline .year-block{margin-bottom:56px;}
.performance .timeline .year-block .year-head{display:flex;align-items:center;gap:16px;margin-bottom:24px;position:relative;}
.performance .timeline .year-block .year-head::before{content:'';position:absolute;left:-48px;top:50%;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;background:var(--c_base2);border:3px solid #fff;box-shadow:0 0 0 2px var(--c_base2);}
.performance .timeline .year-block .year-head .yr{font-size:var(--fs28);font-weight:700;color:var(--c_base4);line-height:1;}
.performance .timeline .year-block .year-head .yr-count{font-size:var(--fs13);font-weight:600;color:#fff;background:var(--c_base2);padding:3px 10px;border-radius:100px;}
.performance .timeline .year-block .items{display:flex;flex-direction:column;gap:8px;}
.performance .timeline .year-block .items .t-item{display:flex;gap:12px;padding:14px 18px;background:#fff;border:1px solid var(--border1);border-radius:10px;transition:all .2s;}
.performance .timeline .year-block .items .t-item:hover{border-color:rgba(223,99,11,0.3);background:#fff8f5;transform:translateX(4px);}
.performance .timeline .year-block .items .t-item .t-month{min-width:28px;font-weight:700;color:var(--c_base2);}
.performance .timeline .year-block .items .t-item .t-text{color:var(--c_base5);line-height:1.6;}
 
/* ===== SCROLL ANIMATION ===== */
.fade-up{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);}
.fade-up.visible{opacity:1;transform:translateY(0);}
.fade-left{opacity:0;transform:translateX(-30px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);}
.fade-left.visible{opacity:1;transform:translateX(0);}
.fade-right{opacity:0;transform:translateX(30px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);}
.fade-right.visible{opacity:1;transform:translateX(0);}
.d1{transition-delay:.1s;} .d2{transition-delay:.2s;} .d3{transition-delay:.3s;}
.d4{transition-delay:.4s;} .d5{transition-delay:.5s;} .d6{transition-delay:.6s;}
 
/* ===== [탭3] 안전솔루션 설치현황 ===== */
.performance .safety-layout{position:relative;}
.performance .safety-head{position:relative;margin-bottom:36px;padding:42px 46px;border-radius:20px;background:linear-gradient(135deg,#f5f8fc 0%,#ffffff 100%);border:1px solid var(--border1);overflow:hidden;}
.performance .safety-head::after{content:'';position:absolute;right:-80px;top:-80px;width:240px;height:240px;border-radius:50%;background:rgba(223,99,11,0.08);}
.performance .safety-head .safety-kicker{display:inline-block;margin-bottom:12px;font-size:var(--fs14);font-weight:700;color:var(--c_base2);}
.performance .safety-head h3{position:relative;z-index:1;font-size:var(--fs36);font-weight:700;line-height:1.32;color:var(--c_base4);}
.performance .safety-head h3 em{color:var(--c_base2);font-style:normal;}
.performance .safety-head p{position:relative;z-index:1;margin-top:14px;max-width:760px;font-size:var(--fs16);line-height:1.75;color:#777;}
.performance .safety-head .safety-date{position:absolute;right:46px;bottom:38px;z-index:1;padding:8px 16px;border-radius:100px;background:var(--c_base4);color:#fff;font-size:var(--fs14);font-weight:700;}
.performance .safety-content{display:grid;grid-template-columns:1fr 700px;gap:30px;align-items:stretch;}
.performance .safety-install-box,.performance .safety-case-box{padding:28px;border:1px solid var(--border1);border-radius:20px;background:#fff;box-shadow:0 16px 40px rgba(0,0,0,0.04);}
.performance .safety-box-title{margin-bottom:20px;}
.performance .safety-box-title h4{position:relative;display:inline-block;font-size:var(--fs24);font-weight:700;color:var(--c_base4);}
.performance .safety-box-title h4::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:3px;border-radius:3px;background:var(--c_base2);}
.performance .safety-box-title p{margin-top:16px;font-size:var(--fs15);color:#888;line-height:1.5;}
.performance .safetyTypeList{display:flex;flex-direction:column;gap:12px;}
.performance .safetyTypeList li{display:flex;align-items:center;gap:16px;padding:12px 20px;border-radius:14px;background:#f7f9fc;border:1px solid #e1e7f0;transition:all .25s;}
.performance .safetyTypeList li:hover{background:#fff;border-color:var(--c_base2);transform:translateX(4px);box-shadow:0 10px 24px rgba(0,0,0,0.06);}
.performance .safetyTypeList li.ready:hover{border-color:#bbb;transform:none;box-shadow:none;}
.performance .safetyTypeList .typeIcon{flex-shrink:0;width:80px;height:80px;border-radius:12px;background:#e8eef7;display:flex;align-items:center;justify-content:center;font-size:2.2rem;color:#37699e;}
.performance .safetyTypeList .typeIcon i img{width:60px;}
.performance .safetyTypeList .typeBody{flex:1;min-width:0;}
.performance .safetyTypeList .typeBody strong{display:block;font-size:var(--fs16);font-weight:800;color:var(--c_base4);line-height:1.35;}
.performance .safetyTypeList .typeBody p{margin-top:5px;font-size:var(--fs14);color:#888;line-height:1.45;}
.performance .safetyTypeList .typeBadge{flex-shrink:0;padding:5px 12px;border-radius:100px;font-size:var(--fs13);font-weight:700;background:rgba(223,99,11,0.1);color:var(--c_base2);border:1px solid rgba(223,99,11,0.2);}
.performance .safetyTypeList .typeBadge:not(.active){background:#f0f0f0;color:#aaa;border-color:#e0e0e0;}
.performance .caseSwiper{border-radius:14px;overflow:hidden;width:100%;max-width:600px;margin:0;}
.performance .caseSwiper .swiper-slide{border-radius:14px;overflow:hidden;background:#f0f2f5;}
.performance .caseSwiper .swiper-slide img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;}
.performance .caseSwiper-nav{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px;}
.performance .casePrev,
.performance .caseNext{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.9);border:1px solid #e1e7f0;display:flex;align-items:center;justify-content:center;color:var(--c_base4);cursor:pointer;transition:all .25s;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.performance .casePrev:hover,
.performance .caseNext:hover{background:var(--c_base2);border-color:var(--c_base2);color:#fff;}
.performance .casePagination{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;}
.performance .casePagination .swiper-pagination-bullet{width:8px;height:8px;border-radius:50%;background:#d0d5dd;opacity:1;transition:all .25s;margin:0 !important;}
.performance .casePagination .swiper-pagination-bullet-active{width:24px;border-radius:100px;background:var(--c_base2);}
.performance .safety-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px;}
.performance .safety-summary .summary-card{padding:26px 20px;border-radius:16px;background:#f8f9fb;border:1px solid var(--border1);text-align:center;transition:all .25s;}
.performance .safety-summary .summary-card:hover{background:#fff;border-color:var(--c_base2);transform:translateY(-3px);box-shadow:0 10px 24px rgba(223,99,11,0.08);}
.performance .safety-summary .summary-card .num{display:block;font-size:var(--fs36);font-weight:800;color:var(--c_base2);line-height:1;}
.performance .safety-summary .summary-card p{margin-top:10px;font-size:var(--fs15);font-weight:600;color:var(--c_base4);}
 
/* ===== TABLET (~1199) ===== */
@media screen and (max-width:1199px){
  .contents{padding:80px 0;}
  .contents-wrap.w1400{padding:0 30px;}
  .performance .install-layout{gap:32px;grid-template-columns:300px 1fr;}
  .performance .install-map img{height:400px;}
  .performance .stat-banner .stat-item .num{font-size:var(--fs32);}
  .performance .timeline-layout{grid-template-columns:150px 1fr;}
  .performance .install-map .map-badge{font-size:var(--fs14);}
  .performance .safety-content{display:flex;flex-direction:column;}
  .performance .safety-head{padding:36px 34px;}
  .performance .safety-head .safety-date{position:relative;right:auto;bottom:auto;display:inline-block;margin-top:20px;}
  .performance .safetyTypeList li{padding:20px;}
}
 
/* ===== MOBILE (~767) ===== */
@media screen and (max-width:767px){
  .contents{padding:60px 0;}
  .performance.fade-left.visible {position:static;}
  .contents-wrap.w1400{padding:0 20px;}
  .performance .tab-nav{margin-bottom:28px;}
  .performance .install-layout{display:block;}
  .performance .install-right{margin-top:40px;}
  .performance .page-title{margin-bottom:28px;}
  .performance .stat-banner{flex-wrap:wrap;gap:1px;border-radius:10px;margin-bottom:32px;}
  .performance .stat-banner .stat-item{flex:calc(50% - 1px);padding:20px 16px;}
  .performance .stat-banner .stat-item::after{display:none;}
  .performance .tab-nav button{padding:14px 20px;}
  .performance .timeline-layout{grid-template-columns:1fr;}
  .performance .year-nav{position:relative;top:0;margin-bottom:24px;}
  .performance .year-nav ul{flex-direction:row;flex-wrap:wrap;gap:6px;border-left:none;padding:0;}
  .performance .year-nav ul li a{border-left:none;border:1px solid var(--border1);border-radius:100px;padding:7px 14px;}
  .performance .year-nav ul li a.active{background:var(--c_base2);color:#fff;border-color:var(--c_base2);}
  .performance .timeline{padding-left:20px;}
  .performance .timeline .year-block .year-head::before{left:-28px;}
  .performance .timeline .year-block .year-head .yr{font-size:var(--fs22);}
  .performance .safety-head{padding:28px 22px;border-radius:16px;margin-bottom:24px;}
  .performance .safety-head h3{font-size:var(--fs26);}
  .performance .safety-install-box,.performance .safety-case-box{padding:18px;border-radius:16px;}
  .performance .safetyTypeList li{padding:16px 14px;gap:12px;}
  .performance .safetyTypeList .typeIcon{width:40px;height:40px;border-radius:10px;font-size:1.9rem;}
  .performance .safetyTypeList .typeIcon i img{width:28px;}
  .performance .safetyTypeList .typeBody strong{font-size:var(--fs15);}
  .performance .caseSwiper .swiper-slide img{aspect-ratio:4/3;}
  .performance .safety-summary{grid-template-columns:repeat(2,1fr);gap:10px;}
  .performance .safety-summary .summary-card{padding:22px 14px;}
  .performance .safety-summary .summary-card .num{font-size:var(--fs28);}
}