@charset "utf-8";

/* 새글 스킨 (latest) */
.lat {position:relative;margin-bottom:20px;background:#fff}
.lat .lat_title {display:block;line-height:45px;font-size:1.2em;color:#253dbe}
.lat .lat_title a {position:relative;color:#000;display:inline-block}

.lat ul {padding:10px 0}
.lat li {position:relative;line-height:18px;border-bottom:1px solid #e5ecee;margin-bottom:10px}
.lat li a {font-weight:bold;font-size:1.2em;line-height:20px;vertical-align:middle}
.lat li a:hover {color:#3a8afd}
.lat li .fa-heart {color:#ff0000}
.lat li .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
.lat li .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
.lat li .hot_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ff0000;background:#ffb9b9;text-align:center;border-radius:2px;vertical-align:middle}
.lat li .fa-caret-right {color:#bbb}
.lat li .fa-download {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#daae37;background:#ffefb9;text-align:center;border-radius:2px;vertical-align:middle}
.lat li .fa-link {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#b451fd;background:#edd3fd;text-align:center;border-radius:2px;vertical-align:middle}

.lat .profile_img img{border-radius:50%}

.lt_info {padding:10px 0}
.lt_info .lt_nick {}
.lt_info .lt_date {color:#888}

.lat .empty_li {line-height:145px;color:#666;text-align:center;padding:0}
.lat .empty_li:before {background:none;padding:0}

.lat .lt_cmt {background:#e9eff5;color:#3a8afd;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}
.lat .lt_more {position:absolute;top:11px;right:0;display:block;width:40px;line-height:25px;color:#3a8afd;border-radius:3px;text-align:center}
.lat .lt_more:hover {color:#777}


/*****새작업******/
.hero-slider-wrap { position: relative; width: 100vw; height: 100vh; overflow: hidden;color:#fff }
.hero-swiper { width: 100%; height: 100%; }
.hero-swiper .swiper-slide { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.hero-slide-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; z-index: -2; transform: scale(1.15); transition: transform 6s ease-out; }
.hero-swiper .swiper-slide-active .hero-slide-bg { transform: scale(1); }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: -1; }
.hero-content { position: relative; z-index: 1; opacity: 0; transform: translateY(40px); transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1) 0.4s; padding-bottom: 120px; }
.hero-swiper .swiper-slide-active .hero-content { opacity: 1; transform: translateY(0); }
.hero-controls { position: absolute; bottom: 160px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; align-items: center; gap: 12px; }
.hero-bullets { display: flex; align-items: center; gap: 16px; }
.hero-bullet { position: relative; width: 36px; height: 36px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.hero-bullet span { font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.5); letter-spacing: 1px; position: relative; z-index: 2; transition: color 0.3s; }
.hero-bullet svg { position: absolute; top: 0; left: 0; width: 36px; height: 36px; transform: rotate(-90deg); }
.hero-bullet circle { fill: none; stroke: rgba(255,255,255,0.2); stroke-width: 1.5; }
.hero-bullet .progress-ring { stroke: var(--white); stroke-width: 1.5; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 0.1s linear; }
.hero-bullet.active span { color: var(--white); }
.hero-pause { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.4); background: transparent; color: var(--white); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s; margin-left: 4px; }
.hero-pause:hover { background: rgba(255,255,255,0.15); }
.hero-pause i { font-size: 14px; }
.slide-desc{font-size:24px}

.hero-delivery-card { position: absolute; bottom: 160px; right: 5%; background: rgba(255,255,255,0.08); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.15); 
padding: 35px; width: 100%; max-width: 450px; text-align: left; z-index: 15; opacity: 0; transform: translateY(30px); transition: all 1s cubic-bezier(0.22, 1, 0.36, 1) 0.8s; }
.hero-swiper .swiper-slide-active .hero-delivery-card { opacity: 1; transform: translateY(0); }
.hd-tag { display: inline-block; color: #0056b3; background: #fff; padding: 4px 12px; font-weight: 700; font-size: 11px; letter-spacing: 0.05em; margin-bottom: 20px; }
.hd-client { color: #fff; font-size: 24px; font-weight: 700; margin-bottom: 8px; letter-spacing: -0.02em; }
.hd-project { color: rgba(255,255,255,0.7); font-size: 17px; font-weight: 400; letter-spacing: -0.02em; }
hd-project a{color:#fff;border:1px solid red}



/* ===== 1440px ===== */
@media (max-width: 1440px) {
    .hero-delivery-card { right: 40px; padding: 25px; max-width: 360px; bottom: 160px; }
    .hd-client { font-size: 20px; }
    .hd-project { font-size: 15px; }
}


@media (max-width: 768px) {
.slide-desc{font-size:18px;;max-width:80%;margin:0 auto;word-break:keep-all}
   .hero-delivery-card { right:0px; padding: 25px;left:0; max-width:90%; bottom:20%; margin:0 auto}
   .hero-controls { position: absolute; bottom: 120px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; align-items: center; gap: 12px; }
}

a.hd-link-btn { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 14px; color: #fff; text-decoration: none; font-weight: 500; border-bottom:1px solid #fff;padding-bottom:5px}
a.hd-link-btn:hover {  }