/* 메인 페이지 */
.pill.black{background:var(--ink);color:#fff;height:44px;padding:0 22px;font-size:15px}
.pill.black:hover{background:var(--brown-d)}

/* 첫 화면: 넓은 사진 넘김 + 아래 소개 두 줄 */
.hero-slide{position:relative;height:clamp(420px,40.6vw,640px);overflow:hidden}
.hero-slide .swiper-slide img{width:100%;height:100%;object-fit:cover}
.hero-slide::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;z-index:1;background:linear-gradient(transparent,rgba(0,0,0,.38));pointer-events:none}
.hero-prev,.hero-next{position:absolute;top:50%;z-index:3;transform:translateY(-50%);color:#fff;opacity:.85;padding:10px}
.hero-prev{left:70px}.hero-next{right:70px}
.hero-prev svg,.hero-next svg{stroke-width:1.2}
.hero-prev:hover,.hero-next:hover{opacity:1}
.hero-cap{position:absolute;z-index:2;left:max(20px,calc((100% - 1300px)/2));right:max(20px,calc((100% - 1300px)/2));bottom:46px;display:flex;justify-content:space-between;align-items:flex-end;color:#fff}
.hero-cap p{font-size:30px;font-weight:500;letter-spacing:-.02em;line-height:1.4}
.hero-cap p b{font-weight:800;color:var(--gold)}
.hero-cap a{display:inline-flex;align-items:center;gap:4px;font-size:16px;font-weight:700;border-bottom:1px solid rgba(255,255,255,.7);padding-bottom:2px}
.hero-dots{position:absolute;z-index:2;left:0;right:0;bottom:20px;display:flex;justify-content:center;gap:12px}
.hero-dots .swiper-pagination-bullet{width:10px;height:10px;margin:0!important;background:#fff;opacity:.85;border:1.5px solid #fff}
.hero-dots .swiper-pagination-bullet-active{background:transparent;opacity:1;transform:scale(1.25)}
.hero-txt{display:flex;justify-content:space-between;gap:40px;padding-top:56px;padding-bottom:20px;font-size:16px;line-height:1.85;color:var(--txt)}
.hero-txt p:last-child{text-align:right;color:var(--ink);font-weight:600}

/* 자격·인증 숫자 */
.proof{position:relative;margin-top:100px;padding:110px 0 120px;background:url(../img/p/proof-bg.jpg) center/cover;color:#fff}
.proof::before{content:"";position:absolute;inset:0;background:rgba(92,68,44,.55)}
.proof .wrap{position:relative}
.proof .st h2 em{font-style:normal}
.proof-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.proof-list li{padding:40px 20px 38px;text-align:center;border:1px solid rgba(255,255,255,.35);border-radius:14px;background:rgba(255,255,255,.08);backdrop-filter:blur(2px)}
.proof-list h3{font-size:18px;font-weight:700}
.proof-list .num{margin:22px 0 26px;font-size:22px;font-weight:600;color:var(--gold)}
.proof-list .num b{font-size:64px;font-weight:800;line-height:1;vertical-align:-4px}
.proof-list p:last-child{font-size:16px;line-height:1.8;font-weight:500}

/* 일반 기업과 비교 */
.cmp{padding:130px 0 180px;background-size:118px 118px}
.cmp-row{display:flex;justify-content:center;max-width:1000px;margin:0 auto}
.cmp-row+.cmp-row{margin-top:150px}
.cmp-card{flex:1;max-width:500px;padding:40px 30px 0;border-radius:12px;text-align:center;overflow:hidden;display:flex;flex-direction:column}
.cmp-card small{font-size:13px;color:#8a8178}
.cmp-card h3{margin-top:24px;font-size:26px;font-weight:700;line-height:1.5}
.cmp-card p{margin:22px 0 40px;font-size:15px;line-height:1.85;color:#6d655c}
.cmp-card img{margin-top:auto;width:100%;aspect-ratio:440/308;object-fit:cover}
.cmp-card.gen{background:var(--sand);border-radius:12px 0 0 12px}
.cmp-card.gen img{filter:grayscale(1)}
.cmp-card.at{background:var(--brown-d);color:#fff;border-radius:12px;box-shadow:0 20px 40px rgba(74,55,38,.22)}
.cmp-card.at small{color:var(--gold-d)}
.cmp-card.at p{color:#e6ddd2}
.cmp-card mark{color:inherit;background:linear-gradient(transparent 52%,rgba(201,160,110,.55) 52%)}

/* 서비스: 세로 사진 기둥 3칸 */
.svc{padding-bottom:0}
.svc-cols{display:grid;grid-template-columns:repeat(3,1fr);height:640px}
.svc-cols li{position:relative;overflow:hidden}
.svc-cols a{display:block;height:100%;color:#fff}
.svc-cols img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.svc-cols a::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(0,0,0,.28),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,.55));transition:background .4s}
.svc-cols a::after{content:"";position:absolute;inset:0;z-index:1;background:rgba(74,55,38,.78);opacity:0;transition:opacity .4s}
.svc-cols a:hover::after{opacity:1}
.svc-cols a:hover img{transform:scale(1.05)}
.svc-cols .en{position:absolute;z-index:2;top:36px;left:36px;font-size:26px;font-weight:500;letter-spacing:-.01em}
.svc-cols .ko{position:absolute;z-index:2;left:36px;right:36px;bottom:44px}
.svc-cols h3{font-size:30px;font-weight:700}
.svc-cols p{margin-top:14px;font-size:16px;line-height:1.8;color:rgba(255,255,255,.88)}
.svc-cols i{position:absolute;right:0;bottom:4px;width:52px;height:52px;border:1px solid rgba(255,255,255,.7);border-radius:50%;display:grid;place-items:center;transition:background .3s,color .3s}
.svc-cols a:hover i{background:#fff;color:var(--brown-d)}
.svc-cols li+li{border-left:1px solid rgba(255,255,255,.4)}

/* 시공 사례 넘김 */
.case{padding-bottom:110px}
.case .st{margin-bottom:28px}
.case .st p{margin-top:28px;font-size:15px}
.case-slide{padding-left:max(20px,calc((100% - 1100px)/2))}
.case-slide .swiper-slide{width:380px}
.case-slide a{display:block}
.case-slide .ph{position:relative;aspect-ratio:380/250;border-radius:6px;overflow:hidden}
.case-slide .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.case-slide a:hover .ph img{transform:scale(1.04)}
.case-slide h3{margin-top:14px;font-size:16px;font-weight:700}
.case-slide small{display:block;margin-top:4px;font-size:13px;color:var(--mute)}
.case-ctl{max-width:1100px;margin-top:32px;display:flex;flex-direction:column;align-items:center}
.case-bar{position:relative;width:100%;height:2px;background:#d9d9d9}
.case-bar i{position:absolute;left:0;top:-1px;height:4px;background:var(--ink);width:15%;transition:left .4s,width .4s}
.case-btns{display:flex;gap:8px;margin:30px 0 70px}
.case-btns button{width:46px;height:46px;border-radius:50%;border:1px solid #333;display:grid;place-items:center;transition:background .2s,color .2s}
.case-btns button:hover{background:var(--ink);color:#fff}

/* 인증 흐르는 띠 */
.cert{padding-bottom:40px}
.ticker{position:relative;padding:22px 0;border-radius:24px;background:#f3eee8;overflow:hidden;display:flex;flex-direction:column;gap:20px}
.ticker::before,.ticker::after{content:"";position:absolute;left:0;right:0;height:60px;z-index:1;pointer-events:none}
.ticker::before{top:0;background:linear-gradient(#f3eee8,rgba(243,238,232,0))}
.ticker::after{bottom:0;background:linear-gradient(rgba(243,238,232,0),#f3eee8)}
.tk-row{display:flex;width:max-content;animation:tk 60s linear infinite}
.tk-row.rev{animation-direction:reverse;animation-duration:70s}
.tk-row ul{display:flex;gap:16px;padding-right:16px}
.tk-row li{display:flex;align-items:center;gap:8px;height:52px;padding:0 20px;border-radius:12px;background:#efe8df;font-size:19px;font-weight:700;color:#7e766b;white-space:nowrap}
.tk-row li img{width:32px;height:32px;object-fit:contain;border-radius:6px;background:#fff;padding:2px}
@keyframes tk{to{transform:translateX(-50%)}}

@media (max-width:1200px){
  .svc-cols .en{font-size:20px;left:26px;top:26px}
  .svc-cols .ko{left:26px;right:26px}
  .svc-cols h3{font-size:24px}
}
@media (max-width:1024px){
  .hero-prev,.hero-next{display:none}
  .proof-list{grid-template-columns:repeat(2,1fr)}
  .svc-cols{grid-template-columns:1fr;height:auto}
  .svc-cols li{height:340px}
  .svc-cols li+li{border-left:0;border-top:1px solid rgba(255,255,255,.4)}
}
@media (max-width:768px){
  .hero-slide{height:420px}
  .hero-cap{bottom:44px;flex-direction:column;align-items:flex-start;gap:12px}
  .hero-cap p{font-size:22px}
  .hero-cap a{font-size:14px}
  .hero-txt{display:block;padding-top:32px;font-size:14.5px}
  .hero-txt p:last-child{display:none}
  .proof{margin-top:50px;padding:80px 0}
  .proof-list{gap:10px}
  .proof-list li{padding:24px 10px}
  .proof-list h3{font-size:15px}
  .proof-list .num{margin:14px 0;font-size:16px}
  .proof-list .num b{font-size:44px}
  .proof-list p:last-child{font-size:13px}
  .proof-list p:last-child br{display:none}
  .cmp{padding:80px 0 100px}
  .cmp-card.gen{display:none}
  .cmp-row+.cmp-row{margin-top:30px}
  .cmp-card{padding:30px 20px 0}
  .cmp-card h3{font-size:21px;margin-top:14px}
  .cmp-card p{font-size:14px;margin:16px 0 26px}
  .svc-cols li{height:300px}
  .svc-cols .en{font-size:16px;left:20px;top:20px}
  .svc-cols .ko{left:20px;right:20px;bottom:24px}
  .svc-cols h3{font-size:22px}
  .svc-cols p{font-size:14px;margin-top:8px}
  .svc-cols i{width:42px;height:42px}
  .case-slide .swiper-slide{width:280px}
  .case-btns{margin:24px 0 40px}
  .tk-row li{height:42px;font-size:15px;padding:0 14px}
  .tk-row li img{width:26px;height:26px}
}
