/* 기본 */
html,
body {
  margin: 0;
  padding: 0;
}

/* html은 스크롤 담당 안 함 */
html {
  overflow: auto;
}

/* body만 스크롤 */
body {
  min-width: 1400px;
  margin: 0;
  background: #ededfe;
  position: relative;
  overflow: hidden;
}

/* 공통 */
.bg-wrap {
  position: absolute;
  top: 0;
  left: 50%;
  width: 2560px;

  /* translateX(-50%) 는 중앙정렬 삭제하면 left로 좌우 위치값 설정 가능 */
  transform: translateX(-50%);

  background-repeat: no-repeat;
  background-position: center top;
  background-size: 2560px auto;

  pointer-events: none;
  z-index: 0;
}

/* 메인 랜딩 */
.index-page .bg-wrap {
  height: 7500px;
  background-image: url("../images/bg.jpg");
}

/* 상단 nav 강제 고정 */
nav.nav-top {
  top: 0;
  left: 0;
}

/* 좌측 nav도 고정 */
nav.nav-left {
  top: 0;
}

/* 콘텐츠 */
.main-container {
  position: relative;
  width: 1360px;
  margin: 0 auto;
  z-index: 1;
}

/* 공통 섹션 */
.section {
  position: relative;
  width: 1360px;
  margin: 0 auto;
}

/* 공통 이미지 초기화 */
.section img {
  display: block;
  max-width: none;
}

/* ===== 타이틀 ===== */
.main-section {
  position: relative;
  height: 1210px;
  margin: 0 auto;
}

/* 클로저스 BEYOND 로고 */
.sub-title {
  position: absolute;
  top: 154px;
  left: 290px;
  width: 321px;
  z-index: 5;
}

/* 점핑 이벤트 타이틀 */
.main-title {
  position: absolute;
  top: 275px;
  left: 95px;
  width: 710px;
  z-index: 6;
}

/* 기간 */
.date {
  position: absolute;
  top: 535px;
  left: 85px;
  width: 701px;
  z-index: 7;
}

/* 안내 문구 */
.text {
  position: absolute;
  top: 709px;
  left: 40px;
  width: 814px;
  z-index: 7;
}

/* 종합 전투력 */
.count {
  position: absolute;
  top: 968px;
  left: 950px;
  width: 239px;
  z-index: 8;
}

/* ===== 이벤트 섹션 ===== */
.event-section {
  position: relative;
  width: 1360px;
  margin: 0 auto 110px;
  text-align: center;
}

/* 이벤트 이미지 */
.event-img {
  display: block;
  margin: 0 auto;
  max-width: none;
}

.section01 {
  margin-top: 115px;
}

.sticker-section {
  margin-bottom: 160px;
}

/* ===== 버튼 ===== */
.event-btn {
  display: block;
  margin: 40px auto 0;

  -webkit-tap-highlight-color: transparent;
  user-select: none;
  outline: none;
}

.event-btn img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  transition: filter 0.2s ease;
}

/* hover: 확대 없이 살짝 어둡게 */
.event-btn:hover img {
  filter: brightness(1.35);
}

/* active: 클릭 시 조금 더 어둡게 */
.event-btn:active img {
  filter: brightness(0.75);
}

/* focus 제거 */
.event-btn:focus,
.event-btn:focus-visible,
.event-btn:active {
  outline: none !important;
  box-shadow: none !important;
}

/* ===== 섹션3 ===== */
.section3 {
  position: relative;
  height: 900px;
}

.section3 > img {
  position: absolute;
  top: 60px;
  left: 50%;
  width: 1089px;
  transform: translateX(-50%);
}