/* PC_MAIN DEDICATED FILE */
/* =========================================================
   40_sections.css (PC 전용)
   - HERO / SECTION2 / SECTION3 / NAV / SECTION4(FOOTER)
   ========================================================= */


/* =========================================================
   HERO
   ========================================================= */

.heroSwiper{ width:100%; height:100vh; }

.hero-slide{
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 10%;
  transition: opacity .5s ease;
}

.hero-slide.swiper-slide-active{ opacity: 1; }
.hero-slide:not(.swiper-slide-active){ opacity: 0; }

.hero-content{
  max-width:700px;
  transform: translateY(-40px);
}

.hero-title{
  font-size: 46px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 20px;
}

.hero-sub{
  font-size: 20px;
  color: #fff;
  font-weight: 400;
}

.hero-slide-1{ background: url("../images/hero/slide1.jpg") center/cover no-repeat; }
.hero-slide-2{ background: url("../images/hero/slide2.jpg") center/cover no-repeat; }
.hero-slide-3{ background: url("../images/hero/slide3.jpg") center/cover no-repeat; }


/* =========================================================
   HERO TEXT ANIMATION
   ========================================================= */

.hero-slide .hero-title,
.hero-slide .hero-sub{
  will-change: transform, opacity;
}

.hero-slide:not(.swiper-slide-active) .hero-title{
  opacity: 0;
  transform: translateY(-24px);
}

.hero-slide:not(.swiper-slide-active) .hero-sub{
  opacity: 0;
  transform: translateY(-14px);
}

.hero-slide.swiper-slide-active .hero-title{
  animation: heroTitleDown_v2 1.6s cubic-bezier(.22,.61,.36,1) both;
}

.hero-slide.swiper-slide-active .hero-sub{
  animation: heroSubDown_v2 .9s cubic-bezier(.22,.61,.36,1) both;
  animation-delay: .10s;
}

@keyframes heroTitleDown_v2{
  from{ opacity:0; transform:translateY(-32px); }
  to{ opacity:1; transform:translateY(0); }
}

@keyframes heroSubDown_v2{
  from{ opacity:0; transform:translateY(-20px); }
  to{ opacity:1; transform:translateY(0); }
}


/* =========================================================
   SWIPER ARROWS (CENTERED ARROW → TYPE)
   ========================================================= */

/* 기본 Swiper 아이콘 제거 */
.swiper-button-prev::after,
.swiper-button-next::after{
  content: none;
}

/* 원형 버튼 */
.swiper-button-prev,
.swiper-button-next{
  width: 50px;
  height: 50px;

  border-radius: 50%;

  background: transparent;
  border: 2px solid rgba(255,255,255,0.6);

  display: flex;
  align-items: center;
  justify-content: center;

  transition: all .35s ease;
}

.swiper-button-prev{ left:80px; }
.swiper-button-next{ right:80px; }

/* 화살표 문자형 */
.swiper-button-next::before{
  content: "→";
  font-size: 22px;
  font-weight: 300;
  color: rgba(255,255,255,0.9);
  line-height: 1;
}

.swiper-button-prev::before{
  content: "←";
  font-size: 22px;
  font-weight: 300;
  color: rgba(255,255,255,0.9);  
  line-height: 1;
}

/* hover */
.swiper-button-prev:hover,
.swiper-button-next:hover{
  border-color:#fff;
  transform: scale(1.08);
}

/* =========================================================
   LEFT DOT NAV
   ========================================================= */

.fp-nav{
  position: fixed;
  left: 40px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  z-index: 1200;
}

.fp-nav a{
  width:14px;
  height:14px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.fp-nav a::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#bbb;
  transition:.2s ease;
}

.fp-nav a.active::before{
  width:12px;
  height:12px;
  background:#fff;
}

body.section2-active .fp-nav a::before,
body.section3-active .fp-nav a::before{
  background: rgba(46, 59, 66, 0.28);
}

/* section2,section3 active dot only */
.fp-nav a[data-target="section2"].active::before,
.fp-nav a[data-target="section3"].active::before{
  background:#767676;
}
