@charset "utf-8";

/* 상단 타이틀 */

#container_title {
  display: flex;
  flex-direction: column;
}

.header_top_title {
  width: 100%;
  height: 500px;
  position: relative;
  overflow: hidden;
}
@media (max-width: 1024px) {
  .header_top_title {
    height: 200px;
  }
}
.header_top_title_bgImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-position: center;
  filter: brightness(0.4);
  transform: scale(1.2);
  animation: scale 2s ease;
}

@keyframes scale {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}

.header_top_title_text {
  position: absolute;
  font-size: 3.25rem;
  color: #fff;
  font-weight: 700;
  transform: translate(-50%, 0);
  left: 50%;
  bottom: 140px;
  animation: slideUp 1.5s ease;
}

@media (max-width: 1024px) {
  .header_top_title_text {
    bottom: 60px;
  }
}

@keyframes slideUp {
  0% {
    transform: translate(-50%, 50px);
    opacity: 0;
  }
  100% {
    transform: translate(-50%, 0);
    opacity: 1;
  }
}

.header_top_menu {
  width: 100%;
  border-bottom: 1px solid #ebebeb;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header_top_menu_ul {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
}

.header_top_menu_li {
  width: 220px;
  height: 84px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media (max-width: 1024px) {
  .header_top_menu_li {
    width: 160px;
    height: 84px;
  }
}

@media (max-width: 764px) {
  .header_top_menu_li {
    width: auto;
    flex: 1;
    height: 40px;
  }
}

.header_top_menu_li a {
  font-size: 1.25rem;
  color: #c1c1c1;
  font-weight: 600;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (max-width: 764px) {
  .header_top_menu_li a {
    font-size: 16px;
  }
}

.header_top_menu_li.active a {
  color: #4274af;
  font-weight: 700;
  border-bottom: 3px solid #4274af;
}

.header_top_menu_icon {
  display: none;
}

.header_top_menu_icon.active {
  display: block;
}