/* reset */
html,
body,
div,
p,
img,
span,
a,
em,
strong,
pre,
h1,
h2,
h3,
h4,
h4,
h5,
h6,
ul,
ol,
li,
dl,
dt,
dd,
table,
tbody,
thead,
tfoot,
tr,
th,
td,
form,
fieldset,
legend,
caption,
input,
textarea,
button,
select,
video,
iframe,
header,
article,
aside,
details,
figcaption,
figure,
footer,
hgroup,
menu,
nav,
section {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

main,
header,
article,
aside,
details,
figcaption,
figure,
footer,
hgroup,
menu,
nav,
section {
  display: block;
}

html {
  font-size: 16px;
  font-family: "Noto Sans KR", sans-serif;
  -webkit-text-size-adjust: none;
  scroll-behavior: smooth;
}

body {
  color: #1c1c1c;
  line-height: 1;
  font-weight: 400;
  word-break: break-all;
  letter-spacing: -0.5px;
}

input,
textarea,
button,
select {
  font-size: inherit;
  color: inherit;
  font-family: inherit;
}
input:focus,
textarea:focus,
button:focus,
select:focus {
  outline: none;
}

select {
  border: 0;
}

input::-ms-clear,
input::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration {
  display: none;
}

textarea {
  border: none;
  resize: none;
}

img,
fieldset,
button {
  border: 0;
  background: none;
}

img {
  max-width: 100%;
}

label {
  cursor: pointer;
}

input {
  border-radius: 0;
}

input[type=text],
input[type=tel] {
  appearance: none;
}

input,
button,
textarea {
  border: 0 none;
  outline: 0;
}

button {
  cursor: pointer;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

ul,
ol {
  list-style: none;
}

a {
  text-decoration: none;
  color: inherit;
}

a,
img {
  vertical-align: top;
}

em {
  font-style: normal;
}

.blind,
caption {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

.hidden {
  visibility: hidden;
}

.gnbWrapper {
  min-width: 1280px !important;
}

h1.logo {
  position: absolute;
  top: 34px;
  left: 50px;
  z-index: 10;
}
h1.logo a {
  display: block;
  width: 240px;
  height: 33px;
  background: url(../images/logo.png) 0 0/100% auto no-repeat;
  text-indent: -9999px;
}
h1.logo a img {
  display: block;
}

.lnb_open h1.logo {
  display: none !important;
}

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 146px;
  background: #000 url(../images/footer.png) 50% 50% no-repeat;
}
footer p {
  text-indent: -9999px;
}

#wrap {
  position: relative;
  margin: 0 auto;
  min-width: 1280px;
  max-width: 2560px;
  overflow: hidden;
}

section {
  position: relative;
}
section .bg,
section .overlay {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
section .obj {
  position: absolute;
  display: block;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
section .inner {
  margin: 0 auto;
  max-width: 1280px;
}

.scroll_lock {
  width: 100%;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.popup_layer {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999999999;
  overflow: auto;
  background: rgba(0, 0, 0, 0.8);
}
.popup_layer.active {
  display: flex;
}
.popup_layer .container {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.popup_alert .container {
  min-width: 580px;
  height: 310px;
  padding: 91px 55px 50px;
  background: #fff;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 8px;
}
.popup_alert .container .contents {
  width: 100%;
  text-align: center;
  font-family: "Pretendard", sans-serif;
  font-size: 20px;
  font-weight: 500;
  justify-content: center;
  align-items: center;
  word-break: keep-all;
  white-space: pre-wrap;
  color: #3a3a3a;
}
.popup_alert .container .contents em {
  font-family: "Pretendard", sans-serif;
  font-size: inherit;
  line-height: inherit;
  font-weight: 800;
  color: #000;
}
.popup_alert .container .contents span {
  display: block;
  font-size: 16px;
  opacity: 0.8;
}
.popup_alert .container .buttons {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

#popup_info .container {
  width: 740px;
  height: 490px;
  padding: 81px 60px 60px;
  background: #fff;
  box-sizing: border-box;
  border-radius: 20px;
  gap: 38px;
}
#popup_info .container .contents {
  width: 620px;
  height: 242px;
  background: url("../images/popup/img_popup_table.png") 0 0 no-repeat;
}
#popup_info .container .popup_info_close_button {
  width: 330px;
  height: 70px;
  background: url("../images/popup/img_closed_button.png") 0 0 no-repeat;
}
#popup_info .container .popup_info_close_button:hover {
  filter: brightness(0.9);
}

.popup_close_icon {
  position: absolute;
  top: 30px;
  right: 30px;
  cursor: pointer;
  width: 21px;
  height: 21px;
  background: url("../images/popup/ico_close.png") 0 0 no-repeat;
}

.popup_button {
  width: 230px;
  height: 70px;
}
.popup_button.check_button {
  background: url("../images/popup/img_check_button.png") 0 0 no-repeat;
}
.popup_button.cancel_button {
  background: url("../images/popup/img_cancel_button.png") 0 0 no-repeat;
}

#visual {
  position: relative;
  width: 2560px;
  height: 1136px;
  background: url("../images/visual/bg_visual.jpg") 0 0 no-repeat;
}
#visual .visual_motion .audience_2 {
  position: absolute;
  width: 2099px;
  height: 202px;
  background: url("../images/visual/img_audience_2.png") 0 0 no-repeat;
  top: 328px;
  left: 225px;
  animation-delay: 2s;
}
#visual .visual_motion .wall {
  position: absolute;
  width: 2560px;
  height: 264px;
  background: url("../images/visual/img_wall.png") 0 0 no-repeat;
  top: 361px;
  left: 50%;
  transform: translateX(-50%);
}
#visual .visual_motion .audience_1 {
  position: absolute;
  width: 1996px;
  height: 204px;
  background: url("../images/visual/img_audience_1.png") 0 0 no-repeat;
  top: 436px;
  left: 225px;
  animation-delay: 2.5s;
}
#visual .visual_motion .billboard {
  position: absolute;
  width: 2560px;
  height: 353px;
  background: url("../images/visual/img_billboard.png") 0 0 no-repeat;
  top: 536px;
  left: 0;
}
#visual .visual_motion .cheerleader_team1 {
  position: absolute;
  width: 457px;
  height: 377px;
  background: url("../images/visual/img_cheerleader_team_1.png") 0 0 no-repeat;
  top: 619px;
  left: 0;
  animation-delay: 3s;
  --scale: 1.05;
}
#visual .visual_motion .cheerleader_team2 {
  position: absolute;
  width: 298px;
  height: 302px;
  background: url("../images/visual/img_cheerleader_team_2.png") 0 0 no-repeat;
  top: 708px;
  right: 0;
  animation-delay: 2s;
  --scale: 1.02;
}
#visual .visual_motion .player_team_1 {
  position: absolute;
  width: 472px;
  height: 577px;
  background: url("../images/visual/img_player_team_1.png") 0 0 no-repeat;
  top: 444px;
  left: 713px;
}
#visual .visual_motion .player_team_2 {
  position: absolute;
  width: 562px;
  height: 598px;
  background: url("../images/visual/img_player_team_2.png") 0 0 no-repeat;
  top: 436px;
  right: 710px;
}
#visual .container {
  width: 1340px;
  height: 100%;
  margin: 0 auto;
  padding-top: 46px;
}
#visual .container .visual_title_box .visual_title {
  margin: 0 auto;
  width: 676px;
  height: 311px;
  background: url("../images/visual/img_visual_title.png") 0 0 no-repeat;
}
#visual .container .visual_title_box .visual_schedule {
  margin: 32px auto 0;
  width: 528px;
  height: 21px;
  background: url("../images/visual/img_visual_schedule.png") 0 0 no-repeat;
}

#blue_white_recruit {
  position: relative;
  width: 2560px;
  height: 1134px;
  background: url("../images/blue-white-recruit/bg_blue_white_recruit.jpg") 0 0 no-repeat;
}
#blue_white_recruit .container {
  height: 100%;
  padding-top: 20px;
}
#blue_white_recruit .container .blue_white_recruit_title_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
}
#blue_white_recruit .container .blue_white_recruit_title_box .blue_white_recruit_title {
  margin: 0 auto;
  width: 962px;
  height: 71px;
  background: url("../images/blue-white-recruit/img_blue_white_recruit_title.png") 0 0 no-repeat;
}
#blue_white_recruit .container .blue_white_recruit_title_box .blue_white_recruit_description {
  width: 656px;
  height: 20px;
  background: url("../images/blue-white-recruit/img_blue_white_recruit_description.png") 0 0 no-repeat;
}
#blue_white_recruit .container .blue_white_recruit_content_box {
  position: relative;
  height: 874px;
  margin-top: 49px;
}
#blue_white_recruit .container .blue_white_recruit_content_box .address_box {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 760px;
  height: 100px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
#blue_white_recruit .container .blue_white_recruit_content_box .address_box .address_box_text {
  width: 637px;
  height: 50px;
  background: url("../images/blue-white-recruit/img_recruit_address.png") 0 0 no-repeat;
}
#blue_white_recruit .container .blue_white_recruit_content_box .map_box {
  position: absolute;
  top: 0;
  left: 447px;
  width: 1403px;
  height: 874px;
  background: url("../images/blue-white-recruit/img_map.png") 0 0 no-repeat;
}
#blue_white_recruit .container .blue_white_recruit_content_box .character_recruit_back {
  position: absolute;
  width: 200px;
  height: 363px;
  left: 1507px;
  top: 485px;
  background: url("../images/blue-white-recruit/img_character_recruit_back.png") 0 0 no-repeat;
}
#blue_white_recruit .container .blue_white_recruit_content_box .right_recruit {
  position: absolute;
  width: 272px;
  height: 210px;
  top: 345px;
  right: 569px;
  background: url("../images/blue-white-recruit/img_right_recruit.png") 0 0 no-repeat;
}

#offline_apply {
  position: relative;
  width: 2560px;
  height: 1707px;
  background: url("../images/offline-apply/bg_offline_apply.jpg") 0 0 no-repeat;
}
#offline_apply .offline_recruit_box {
  position: relative;
  width: 1340px;
  height: 695px;
  margin: 0 auto;
  padding-top: 139px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#offline_apply .offline_recruit_box .offline_recruit_title {
  width: 391px;
  height: 52px;
  background: url("../images/offline-apply/img_offline_apply_title.png") 0 0 no-repeat;
}
#offline_apply .offline_recruit_box .offline_recruit_description-box {
  width: 835px;
  height: 115px;
  background: url("../images/offline-apply/img_notice_box.png") 0 0 no-repeat;
  gap: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 35px;
  padding-bottom: 16px;
  padding-right: 15px;
}
#offline_apply .offline_recruit_box .offline_recruit_description {
  width: 575px;
  height: 48px;
  background: url("../images/offline-apply/img_offline_schedule.png") 0 0 no-repeat;
}
#offline_apply .offline_recruit_box .btn_apply {
  margin-top: 86px;
  width: 730px;
  height: 117px;
  background: url("../images/offline-apply/img_offline_apply_recruit_button.png") 0 0 no-repeat;
}
#offline_apply .offline_recruit_box .btn_apply:hover {
  animation: seeking 1s linear infinite;
}
#offline_apply .offline_recruit_box .cowboy_penguin {
  position: absolute;
  width: 199px;
  height: 201px;
  background: url("../images/offline-apply/img_cowboy_penguin.png") 0 0 no-repeat;
  top: 477px;
  right: 76px;
}
#offline_apply .offline_applygift_box {
  position: relative;
  box-sizing: border-box;
}
#offline_apply .offline_applygift_box .button_click_penguin {
  position: absolute;
  left: 895px;
  top: -85px;
  width: 139px;
  height: 224px;
  background: url("../images/offline-apply/img_button_click_penguin.png") 0 0 no-repeat;
  animation-delay: 1600ms;
}
#offline_apply .offline_applygift_box .left_snow {
  position: absolute;
  width: 272px;
  height: 251px;
  left: 0;
  top: 142px;
  background: url("../images/offline-apply/img_bg_left.png") 0 0 no-repeat;
}
#offline_apply .offline_applygift_box .right_snow {
  position: absolute;
  width: 214px;
  height: 321px;
  right: 0;
  top: 442px;
  background: url("../images/offline-apply/img_bg_right.png") 0 0 no-repeat;
}
#offline_apply .offline_applygift_box .offline_applygift_content_box {
  margin: 0 auto;
  width: 1736px;
  height: 943px;
  background: url("../images/offline-apply/img_offline_applygift.png") 0 0 no-repeat;
}
#offline_apply .offline_applygift_box .offline_charater_1 {
  position: absolute;
  top: 418px;
  left: 434px;
  width: 167px;
  height: 317px;
  background: url("../images/offline-apply/img_offline_character1.png") 0 0 no-repeat;
}
#offline_apply .offline_applygift_box .offline_charater_2 {
  position: absolute;
  top: 362px;
  left: 822px;
  width: 174px;
  height: 219px;
  background: url("../images/offline-apply/img_offline_character2.png") 0 0 no-repeat;
}
#offline_apply .offline_applygift_box .offline_charater_3 {
  position: absolute;
  top: 285px;
  right: 720px;
  width: 135px;
  height: 216px;
  background: url("../images/offline-apply/img_offline_character3.png") 0 0 no-repeat;
}

#event_notice {
  position: relative;
  width: 2560px;
  height: 2378px;
  background: url("../images/event-notice/bg_event_notice.jpg") 0 0 no-repeat;
}
#event_notice .container {
  position: relative;
  margin: 0 auto;
  z-index: 1;
  width: 1340px;
}
#event_notice .container .event_notice_title {
  width: 390px;
  height: 52px;
  background: url("../images/event-notice/img_offline_notice_title.png") 0 0 no-repeat;
  margin: 0 auto;
}
#event_notice .container .offline_event_notice_box {
  position: relative;
  width: 1778px;
  height: 960px;
  background: url("../images/event-notice/img_offline_notice.png") 0 0 no-repeat;
  margin-top: 59px;
  margin-left: -201px;
}
#event_notice .container .online_live_notice_box {
  position: relative;
  width: 1270px;
  height: 519px;
  margin: 69px auto 0;
}
#event_notice .container .online_live_notice_box .online_live_bg {
  width: 100%;
  height: 100%;
  background: url("../images/event-notice/img_online_live_notice.png") 0 0 no-repeat;
}
#event_notice .container .online_live_notice_box .online_live_notice_character1 {
  position: absolute;
  width: 308px;
  height: 385px;
  background: url("../images/event-notice/img_online_live_notice_character1.png") 0 0 no-repeat;
  top: 78px;
  left: -262px;
}
#event_notice .container .online_live_notice_box .online_live_notice_character2 {
  position: absolute;
  width: 379px;
  height: 382px;
  background: url("../images/event-notice/img_online_live_notice_character2.png") 0 0 no-repeat;
  top: 41px;
  left: 1125px;
  z-index: -1;
}
#event_notice .container .online_live_notice_box .online_live_notice_character2_header {
  position: absolute;
  width: 317px;
  height: 267px;
  background: url("../images/event-notice/img_online_live_notice_character2_header.png") 0 0 no-repeat;
  top: 41px;
  left: 1188px;
}
#event_notice .container .online_live_notice_box .online_live_notice_character3 {
  position: absolute;
  width: 167px;
  height: 224px;
  background: url("../images/event-notice/img_online_live_notice_character3.png") 0 0 no-repeat;
  top: 167px;
  left: 1447px;
}
#event_notice .container .online_live_event_box {
  position: relative;
  margin: 115px auto 0;
  width: 1273px;
  height: 557px;
  background: url("../images/event-notice/img_online_live_event.png") 0 0 no-repeat;
}
#event_notice .container .online_live_event_box .online_live_event_character1 {
  position: absolute;
  width: 310px;
  height: 439px;
  background: url("../images/event-notice/img_online_live_event_character1.png") 0 0 no-repeat;
  top: 169px;
  left: -262px;
}
#event_notice .container .online_live_event_box .channel_button {
  position: absolute;
  width: 520px;
  height: 100px;
  top: 295px;
}
#event_notice .container .online_live_event_box .channel_button:hover {
  opacity: 0.1;
  background: #fff;
  filter: brightness(0) invert(1);
}
#event_notice .container .online_live_event_box .channel_button.soop_button {
  left: 103px;
}
#event_notice .container .online_live_event_box .channel_button.youtube_button {
  left: 643px;
}

#zombie_vs_human {
  width: 2560px;
  height: 2913px;
  background: url("../images/zombie-vs-human/bg_zombie_vs_human.jpg") 0 0 no-repeat;
}
#zombie_vs_human .container {
  width: 1200px;
  position: relative;
  margin: 0 auto;
  z-index: 1;
  padding-top: 92px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .zombie_vs_human_title {
  margin: 0 auto;
  width: 711px;
  height: 175px;
  background: url("../images/zombie-vs-human/img_zombie_vs_human_title.png") 0 0 no-repeat;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .zombie_vs_human_subtitle {
  margin: 10px auto 0;
  width: 969px;
  height: 72px;
  background: url("../images/zombie-vs-human/img_zombie_vs_human_subtitle.png") 0 0 no-repeat;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .zombie_vs_human_description {
  margin: 26px auto 0;
  width: 538px;
  height: 21px;
  background: url("../images/zombie-vs-human/img_zombie_vs_human_schedule.png") 0 0 no-repeat;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .zombie_vs_human_character {
  position: absolute;
  width: 956px;
  height: 522px;
  background: url("../images/zombie-vs-human/img_zombie_vs_human_character.png") 0 0 no-repeat;
  top: 437px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .zombie_vs_human_character.aos-animate {
  animation: zombieTug 1.2s ease-in-out infinite alternate 1s;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_notice {
  position: relative;
  margin-top: 610px;
  margin-right: auto;
  width: 753px;
  height: 153px;
  background: url("../images/zombie-vs-human/img_team_select_notice.png") 0 0 no-repeat;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box {
  position: absolute;
  top: 412px;
  width: 1340px;
  padding: 0 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button {
  width: 215px;
  z-index: 2;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .select_team_button_text {
  width: 100%;
  height: 150px;
  background: url("../images/zombie-vs-human/select-button/img_select_button.png") 0 0 no-repeat;
  display: flex;
  align-items: start;
  justify-content: center;
  padding-top: 32px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .select_team_button_text:hover {
  background-position-x: -215px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box {
  position: relative;
  width: 100%;
  height: 133px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: url("../images/zombie-vs-human/select-button/img_select_button.png") 0 -150px no-repeat;
  padding-bottom: 13px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box .percent_text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box .percent_text .full {
  transform: scale(0.9);
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box .percent_text .percent_unit {
  margin-top: 8px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box .percent_progress {
  position: absolute;
  bottom: 15px;
  width: calc(100% - 15px);
  max-height: 120px;
  border-radius: 0 0 20px 20px;
  z-index: -1;
  overflow: hidden;
  height: 120px;
  --percent: 0%;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button .percent_box .percent_progress .percent_progress_fill {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 120px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: 0 100%;
  clip-path: inset(calc(100% - var(--percent)) 0 0 0);
  transition: clip-path 0.4s ease-out;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_1 .select_team_button_text {
  padding-right: 15px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_1 .percent_box {
  padding-right: 15px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_1 .percent_progress_fill {
  background-image: url("../images/zombie-vs-human/select-button/img_percent_gauge_team1.png");
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_2 .select_team_button_text {
  padding-top: 32px;
  padding-left: 15px;
  background-position-y: -283px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_2 .percent_box {
  padding-left: 15px;
  background-position-y: -435px;
}
#zombie_vs_human .container .zombie_vs_human_team_select_box .select_team_button_box .select_team_button.team_2 .percent_progress_fill {
  background-image: url("../images/zombie-vs-human/select-button/img_percent_gauge_team2.png");
}
#zombie_vs_human .container .my_point_box {
  padding-top: 88px;
}
#zombie_vs_human .container .my_point_box .my_point_header_box {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#zombie_vs_human .container .my_point_box .my_point_header_box .my_point_title {
  width: 189px;
  height: 29px;
  background: url("../images/zombie-vs-human/img_mypoint_title.png") 0 0 no-repeat;
}
#zombie_vs_human .container .my_point_box .my_point_header_box .point_notice_button {
  margin-right: -10px;
  margin-bottom: -10px;
  width: 300px;
  height: 60px;
  background: url("../images/zombie-vs-human/img_point_notice_button.png") 0 0 no-repeat;
}
#zombie_vs_human .container .my_point_box .my_point_header_box .point_notice_button:hover {
  filter: brightness(1.1);
}
#zombie_vs_human .container .my_point_box .my_point_content_box {
  margin-top: 20px;
  padding-bottom: 15px;
  width: 1215px;
  height: 175px;
  background: url("../images/zombie-vs-human/bg_mypoint.png") 0 0 no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_item {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Pretendard", sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #3a3a3a;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_item em {
  font-size: inherit;
  line-height: inherit;
  font-weight: 800;
  color: #000;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_point_box {
  display: flex;
  align-items: center;
  justify-content: center;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_point_box .my_point_content_point_text {
  width: 100%;
  font-family: "Pretendard", sans-serif;
  display: flex;
  font-weight: 800;
  font-size: 46px;
  color: #000;
  letter-spacing: -0.025em;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_point_box .my_point_content_point_text .point_unit {
  display: inline-block;
  width: 48px;
  height: 48px;
  background-color: #fdda2a;
  border-radius: 50%;
  font-size: 34px;
  font-weight: 800;
  color: #222fb1;
  text-align: center;
  line-height: 48px;
  margin-left: 10px;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_point_box .refresh_button {
  position: absolute;
  right: 41px;
  width: 230px;
  height: 70px;
  background: url("../images/zombie-vs-human/img_refresh_button.png") 0 0 no-repeat;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
#zombie_vs_human .container .my_point_box .my_point_content_box .my_point_content_point_box .refresh_button:hover .ico_refresh {
  animation: refresh 1s linear infinite;
}
#zombie_vs_human .container .my_point_box .my_point_coin {
  position: absolute;
  left: 1117px;
  top: 1332px;
  display: block;
  width: 214px;
  height: 175px;
  background: url("../images/zombie-vs-human/img_mypoint_coin.png") 0 0 no-repeat;
}
#zombie_vs_human .container .my_point_box .my_point_character1 {
  position: absolute;
  left: 1327px;
  top: 1226px;
  display: block;
  width: 290px;
  height: 282px;
  background: url("../images/zombie-vs-human/img_mypoint_character1.png") 0 0 no-repeat;
}
#zombie_vs_human .container .event_rewards_box {
  padding-top: 85px;
  position: relative;
}
#zombie_vs_human .container .event_rewards_box .event_rewards_content_box .event_rewards_title {
  width: 152px;
  height: 29px;
  background: url("../images/zombie-vs-human/img_event_rewards_title.png") 0 0 no-repeat;
}
#zombie_vs_human .container .event_rewards_box .event_rewards_content_box .event_rewards_content_table_box {
  width: 1304px;
  height: 660px;
  background: url("../images/zombie-vs-human/img_event_rewards_table.png") 0 0 no-repeat;
}
#zombie_vs_human .container .event_rewards_box .event_rewards_content_box .event_rewards_notice {
  margin-top: 33px;
  width: 576px;
  height: 77px;
  background: url("../images/zombie-vs-human/img_event_rewards_notice.png") 0 0 no-repeat;
}
#zombie_vs_human .container .event_rewards_box .event_rewards_character1 {
  position: absolute;
  width: 267px;
  height: 433px;
  left: -233px;
  top: 258px;
  background: url("../images/zombie-vs-human/img_event_rewards_character1.png") 0 0 no-repeat;
  z-index: 2;
  animation-delay: 1000ms;
}
#zombie_vs_human .container .event_rewards_box .event_rewards_character2 {
  position: absolute;
  width: 342px;
  height: 319px;
  left: 1168px;
  top: 487px;
  background: url("../images/zombie-vs-human/img_event_rewards_character2.png") 0 0 no-repeat;
  z-index: 2;
}
#zombie_vs_human .container .notice_box {
  margin-top: 155px;
  width: 914px;
  height: 289px;
  background: url("../images/zombie-vs-human/img_zombie_vs_human_notice.png") 0 0 no-repeat;
}
#zombie_vs_human .ico_star {
  width: 26px;
  height: 24px;
  background: url("../images/zombie-vs-human/ico_star.png") 0 0 no-repeat;
}
#zombie_vs_human .ico_refresh {
  margin-left: 67px;
  display: block;
  width: 22px;
  height: 20px;
  background: url("../images/zombie-vs-human/ico_refresh.png") 0 0 no-repeat;
}

:root {
  --scale: 1.03;
}

#wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "Pretendard", sans-serif;
}
#wrap picture {
  display: inline-block;
}

.blind {
  position: absolute;
  width: 0;
  line-height: 0;
  height: 0;
  font-size: 0;
  top: 0;
  left: -9999px;
  overflow: hidden;
}

.util {
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 100;
}
.util a,
.util button {
  background: url("../images/spr_util.png") 0 0 no-repeat;
  text-indent: -9999px;
}
.util > div {
  display: flex;
  gap: 4px;
}
.util .btn_start {
  display: block;
  width: 190px;
  height: 40px;
}
.util .btn_start:hover {
  background-position-y: -71px;
}
.util .btn_home {
  display: block;
  width: 40px;
  height: 40px;
  background-position-x: -194px;
}
.util .btn_home:hover {
  background-position-y: -71px;
}
.util .btn_hide {
  margin-top: 10px;
  width: 234px;
  height: 14px;
  background-position-y: -48px;
}
.util .btn_hide:hover {
  background-position-y: -119px;
}

main {
  min-height: 100vh;
}

footer {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 120px;
  text-align: center;
  background: #000;
}
footer p {
  text-indent: unset;
}
footer img {
  display: inline-block;
}

.disabled {
  cursor: not-allowed;
}

#quick {
  position: fixed;
  top: 50%;
  right: 20px;
  z-index: 10;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
}
#quick .guick_menu_header {
  position: absolute;
  display: block;
  width: 101px;
  height: 29px;
  background: url("../images/img_quick_menu_header.png") no-repeat;
  text-indent: -99999px;
  box-sizing: border-box;
  top: -23px;
  right: 10px;
  z-index: 2;
}
#quick button {
  display: block;
  width: 144px;
  height: 81px;
  background: url("../images/img_quick_menu.png") no-repeat;
  text-indent: -99999px;
  background-color: #000;
  box-sizing: border-box;
}
#quick button:hover {
  background-position-x: -144px;
}
#quick button:nth-of-type(1) {
  height: 83px;
  border-radius: 12px 12px 0 0;
  background-position-y: 0;
}
#quick button:nth-of-type(2) {
  background-position-y: -83px;
}
#quick button:nth-of-type(3) {
  background-position-y: -164px;
}
#quick button:nth-of-type(4) {
  background-position-y: -245px;
}
#quick button:nth-of-type(5) {
  background-position-y: -326px;
}
#quick button:nth-of-type(6) {
  height: 92px;
  background-position-y: -407px;
  border-radius: 0 0 12px 12px;
}
#quick button:last-of-type {
  margin-top: 10px;
  height: 59px;
  background-position-y: -509px;
  border-radius: 12px;
}
#quick button:last-of-type:hover {
  filter: brightness(1.2);
}

.floating.aos-animate {
  animation: floatUpDown 2s ease-in-out infinite;
}

.floating_soft.aos-animate {
  animation: floatSoft 2.5s ease-in-out infinite;
}

.zombie_attack.aos-animate {
  animation: zombieAttack 1s ease-in-out infinite alternate 1s;
}

@keyframes floatUpDown {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}
@keyframes floatSoft {
  0%, 100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-6px) scale(var(--scale));
  }
}
@keyframes seeking {
  0% {
    transform: translateX(0) rotate(0deg);
  }
  15% {
    transform: translateX(-1px) rotate(-1deg);
  }
  30% {
    transform: translateX(2px) rotate(1deg);
  }
  45% {
    transform: translateX(-2px) rotate(-2deg);
  }
  60% {
    transform: translateX(1px) rotate(1deg);
  }
  75% {
    transform: translateX(-1px) rotate(-0.5deg);
  }
  100% {
    transform: translateX(0) rotate(0deg);
  }
}
@keyframes zombieAttack {
  0% {
    transform: rotate(-2deg);
  }
  50% {
    transform: rotate(2deg);
  }
  100% {
    transform: rotate(-2deg);
  }
}
@keyframes zombieTug {
  0% {
    transform: translateX(-2px);
  }
  30% {
    transform: translateX(-3px);
  }
  50% {
    transform: translateX(2px);
  }
  100% {
    transform: translateX(-2px);
  }
}
@keyframes refresh {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/*# sourceMappingURL=style.css.map */
