/* reset */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 900;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format("opentype");
}
* {
  margin: 0;
  padding: 0;
  list-style: none;
  border: 0;
  text-decoration: none;
  font-family: "Noto Sans KR", "Malgun Gothic", Dotum, sans-serif;
}

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

button {
  cursor: pointer;
  border: none;
}

a {
  display: block;
}

li {
  list-style: none;
}

/* global components */
html, body {
  scroll-behavior: smooth;
}

.btn,
.tab,
.tab ul,
.tab li a,
.popup .alert_con {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/components.png");
}

.btn_detail {
  position: absolute;
  width: 430px;
  height: 110px;
  background-position-x: -182px;
}
.btn_detail:hover {
  background-position-x: -683px;
}

/* gnb_wrap */
.gnb_wrap {
  position: absolute;
  display: flex;
  justify-content: space-between;
  padding: 20px;
  box-sizing: border-box;
  width: 100%;
  z-index: 100;
  top: 62px;
}
.gnb_wrap .home {
  width: 110px;
  height: 42px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/logo.png") no-repeat center;
  text-indent: -9999px;
}
.gnb_wrap .util {
  display: flex;
  flex-direction: column;
  width: 158px;
  height: 76px;
}
.gnb_wrap .util a, .gnb_wrap .util button {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/util.png") no-repeat;
  text-indent: -9999px;
}
.gnb_wrap .util div {
  display: flex;
  width: 100%;
  height: 52px;
}
.gnb_wrap .util div .game_start {
  width: 104px;
  height: 100%;
  background-position: 0 0;
}
.gnb_wrap .util div .home {
  width: 52px;
  height: 100%;
  background-position: -107px 0;
}
.gnb_wrap .util button {
  width: 100%;
  height: 24px;
  background-position: 0 -52px;
}
.gnb_wrap .layer_btn {
  width: 132px;
  height: 213px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/layer_button.png") no-repeat center;
  position: fixed;
  right: 30px;
  top: 170px;
  transition: 0.3s;
  z-index: 9999;
}

/* wrap */
#wrap {
  position: relative;
  min-width: 1280px;
  overflow: hidden;
  max-width: 2560px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#wrap .title,
#wrap .subtitle,
#wrap .tab,
#wrap .btn,
#wrap .popup button {
  text-indent: -9999px;
  font-size: 0;
}
#wrap .tab {
  width: 100%;
  height: 88px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  background-position: 0 0;
}
#wrap .tab ul {
  width: 1310px;
  height: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  background-position: 0 0;
}
#wrap .tab ul li {
  width: 288px;
  height: 100%;
  margin-left: -34px;
}
#wrap .tab ul li a {
  width: 288px;
  height: 100%;
  background-position-y: -111px;
}
#wrap .tab ul li a:hover {
  background-position-y: -237px;
}
#wrap .tab ul li.active a {
  background-position-y: -237px;
}
#wrap .tab ul li:nth-child(1) a {
  background-position-x: -130px;
}
#wrap .tab ul li:nth-child(2) a {
  background-position-x: -418px;
}
#wrap .tab ul li:nth-child(3) a {
  background-position-x: -711px;
}
#wrap .tab ul li:nth-child(4) a {
  background-position-x: -1003px;
}
#wrap .tab ul li:nth-child(5) a {
  background-position-x: -1290px;
}
#wrap section {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
#wrap section .center_wrap {
  width: 1280px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 1;
  margin: 76px auto 0 auto;
}
#wrap section .center_wrap .content_wrap {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}
#wrap section .center_wrap .content_wrap .content {
  width: 100%;
}
#wrap section .center_wrap .content_wrap .board_wrap {
  width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#wrap section .center_wrap .content_wrap .board_wrap .serve_h1 {
  font-size: 25px;
  font-weight: 400;
  color: white;
  width: 100%;
  transform: translateY(10px);
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap {
  display: flex;
  position: relative;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt {
  position: relative;
  width: 996px;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .text_input {
  width: 100%;
  height: 70px;
  position: absolute;
  bottom: 0;
  border: 0;
  box-sizing: border-box;
  font-size: 16px;
  padding: 20px 30px;
  color: white;
  resize: none;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .text_input:focus {
  outline: none;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .text_input::-webkit-scrollbar {
  display: none;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro {
  position: absolute;
  bottom: 0;
  color: white;
  height: 70px;
  padding: 0 20px;
  width: 996px;
  box-sizing: border-box;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro {
  display: flex;
  align-items: center;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro span {
  text-decoration: underline;
  margin-right: 5px;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro .btn_board_login {
  width: 77px;
  height: 26px;
  background-position-x: -1492px;
  margin-left: 8px;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .txt_cnt {
  width: 121px;
  height: 35px;
  position: absolute;
  right: 104px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/components.png") no-repeat;
  background-position: -1492px -816px;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .txt_cnt p {
  text-align: center;
  vertical-align: middle;
  font-size: 14px;
  position: relative;
  left: 10px;
  top: 5px;
  color: #8f8f8f;
}
#wrap section .center_wrap .content_wrap .board_wrap .input_wrap .btn_submit {
  position: relative;
  width: 105px;
  height: 101px;
  background-position-x: -1492px;
  bottom: 0;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list {
  width: 100%;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul {
  width: 1100px;
  margin: 30px 0;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-height: 57px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 20px 30px;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li span {
  font-weight: 500;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li .name {
  width: 263px;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li p {
  width: 685px;
  margin-right: 20px;
  word-break: break-all;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li .date {
  width: 78px;
  font-size: 14px;
  text-align: center;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list ul li .btn_delete {
  width: 13px;
  height: 13px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/btn_delete.png") no-repeat center;
  margin-left: 6px;
}
#wrap section .center_wrap .content_wrap .board_wrap .board_list .not_list {
  width: 1100px;
  box-sizing: border-box;
  height: 57px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 30px;
  margin: 30px 0;
  color: white;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .num {
  display: flex;
  justify-content: center;
  align-items: center;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .num * {
  margin: 0 16px;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .btn {
  width: 28px;
  height: 28px;
  margin: 0 2.5px;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .btn.first {
  background-position-x: -1493px;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .btn.prev {
  background-position-x: -1526px;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .btn.next {
  background-position-x: -1561px;
}
#wrap section .center_wrap .content_wrap .board_wrap .paging .btn.last {
  background-position-x: -1594px;
}
#wrap section .center_wrap .note {
  text-indent: -9999px;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}
#wrap section .center_wrap .note ul {
  width: 1280px;
}
#wrap section .center_wrap .note ul li {
  display: none;
}
#wrap section .motion {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
#wrap section .motion .left, #wrap section .motion .right {
  width: 50%;
  height: 100%;
  position: relative;
}
#wrap section .motion .left span, #wrap section .motion .right span {
  position: absolute;
}
#wrap #intro {
  height: 1620px;
  margin-bottom: 88px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/intro/background.jpg") no-repeat center 0;
}
#wrap #intro .center_wrap {
  margin-top: 67px;
  margin-bottom: 105px;
}
#wrap #intro .center_wrap .title span, #wrap #intro .center_wrap .subtitle, #wrap #intro .center_wrap .video {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/intro/content.png") no-repeat;
}
#wrap #intro .center_wrap .title {
  width: 684px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#wrap #intro .center_wrap .title span {
  display: block;
}
#wrap #intro .center_wrap .title .tt_box {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#wrap #intro .center_wrap .title .tt_line1 {
  width: 649px;
  height: 94px;
  background-position: -282px 0;
}
#wrap #intro .center_wrap .title .tt_line2 {
  width: 649px;
  height: 55px;
  background-position: -282px -403px;
}
#wrap #intro .center_wrap .title .tt_txt1 {
  width: 172px;
  height: 179px;
  background-position: -261px -96px;
}
#wrap #intro .center_wrap .title .tt_txt2 {
  width: 178px;
  height: 179px;
  background-position: -433px -96px;
}
#wrap #intro .center_wrap .title .tt_txt3 {
  width: 170px;
  height: 179px;
  background-position: -610px -96px;
}
#wrap #intro .center_wrap .title .tt_txt4 {
  width: 170px;
  height: 179px;
  background-position: -781px -96px;
}
#wrap #intro .center_wrap .title .tt_txt5 {
  width: 160px;
  height: 128px;
  background-position: -328px -274px;
}
#wrap #intro .center_wrap .title .tt_txt6 {
  width: 122px;
  height: 128px;
  background-position: -489px -274px;
}
#wrap #intro .center_wrap .title .tt_txt7 {
  width: 113px;
  height: 128px;
  background-position: -612px -274px;
}
#wrap #intro .center_wrap .title .tt_txt8 {
  width: 162px;
  height: 128px;
  background-position: -725px -274px;
}
#wrap #intro .center_wrap .subtitle {
  width: 561px;
  height: 85px;
  background-position: -286px -478px;
  margin-top: 28px;
}
#wrap #intro .center_wrap .dday {
  font-size: 54px;
  font-weight: 500;
  color: #fffd4b;
  margin-bottom: 36px;
}
#wrap #intro .center_wrap .video {
  width: 1210px;
  height: 710px;
  background-position: 0 -644px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#wrap #intro .center_wrap .video .video_wrap {
  width: 1150px;
  height: 646px;
  transform: translate(2px, 24px);
}
#wrap #intro .motion .char {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/intro/char.png") no-repeat;
  width: 2560px;
  height: 2272px;
  position: absolute;
  top: 0;
}
#wrap #section1 {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/background.jpg") center 0;
}
#wrap #section1 .title, #wrap #section1 .subtitle,
#wrap #section1 .reward, #wrap #section1 .content, #wrap #section1 .note ul {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/content.png") no-repeat;
  margin: 0 auto;
}
#wrap #section1 .center_wrap .title {
  width: 849px;
  height: 343px;
  background-position: -170px 0;
}
#wrap #section1 .center_wrap .subtitle {
  width: 1058px;
  height: 240px;
  background-position: -48px -343px;
}
#wrap #section1 .center_wrap .content_wrap .reward {
  width: 1029px;
  height: 555px;
  background-position: -66px -583px;
}
#wrap #section1 .center_wrap .content_wrap .content {
  width: 1222px;
  height: 742px;
  background-position: -19px -1138px;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .text_input {
  background-color: #1e1516;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro {
  color: #ff731f;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro span {
  text-decoration: underline;
  color: #edb64f;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro .btn_board_login {
  background-position-y: -678px;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .txt_cnt p span {
  color: #ff731f;
  font-style: none;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .input_wrap .btn_submit {
  background-position-y: -462px;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .board_list ul {
  border-top: 1px solid #702c00;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .board_list ul li {
  border-bottom: 1px solid #702c00;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .board_list ul li .name, #wrap #section1 .center_wrap .content_wrap .board_wrap .board_list ul li .date {
  color: #edb952;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .board_list ul li p {
  color: white;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .board_list .not_list {
  border-top: 1px solid #702c00;
  border-bottom: 1px solid #702c00;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .paging .num {
  color: #aceaff;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .paging .num .on {
  color: #ecb54e;
}
#wrap #section1 .center_wrap .content_wrap .board_wrap .paging .btn {
  background-position-y: -741px;
}
#wrap #section1 .center_wrap .note {
  height: 539px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/note_bg.jpg");
}
#wrap #section1 .center_wrap .note ul {
  height: 389px;
  background-position: 0 -2824px;
}
#wrap #section1 .motion .left .char_l1 {
  width: 601px;
  height: 718px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/char_l1.png") no-repeat;
  right: 445px;
  top: -2px;
}
#wrap #section1 .motion .right .char_r1 {
  width: 798px;
  height: 658px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/char_r1.png") no-repeat;
  left: 484px;
  top: 99px;
}
#wrap #section1 .motion .right .char_r2 {
  width: 709px;
  height: 770px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section1/char_r2.png") no-repeat;
  left: 571px;
  top: 743px;
}
@keyframes noteDoongDoong1 {
  0% {
    scale: 1;
    transform: rotate(0deg);
  }
  50% {
    scale: 1.2;
    transform: rotate(-15deg);
  }
  100% {
    scale: 1;
    transform: rotate(0deg);
  }
}
@keyframes noteDoongDoong2 {
  0% {
    scale: 1;
    transform: rotate(0deg);
  }
  50% {
    scale: 1.1;
    transform: rotate(10deg);
  }
  100% {
    scale: 1;
    transform: rotate(0deg);
  }
}
#wrap #section2 {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/background.jpg") center 0;
}
#wrap #section2 .title, #wrap #section2 .subtitle,
#wrap #section2 .reward, #wrap #section2 .music, #wrap #section2 .note ul {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/content.png") no-repeat;
  margin: 0 auto;
}
#wrap #section2 .center_wrap .title {
  width: 849px;
  height: 336px;
  background-position: -170px 0;
}
#wrap #section2 .center_wrap .subtitle {
  width: 1058px;
  height: 257px;
  background-position: -48px -337px;
}
#wrap #section2 .center_wrap .content_wrap .reward {
  width: 1029px;
  height: 400px;
  background-position: -66px -583px;
  position: relative;
}
#wrap #section2 .center_wrap .content_wrap .music {
  width: 628px;
  height: 314px;
  box-sizing: border-box;
  background-position: -268px -993px;
  position: relative;
}
#wrap #section2 .center_wrap .content_wrap .music #audio {
  display: none;
  z-index: 1000;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap {
  position: absolute;
  top: 0;
  left: 0;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player {
  display: flex;
  padding: 40px;
  justify-content: space-between;
  align-items: center;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range] {
  outline: none;
  width: 100%;
  height: 3px;
  position: absolute;
  -webkit-appearance: none;
  transition: 0.1s;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  background: transparent;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range]::-moz-range-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  background: transparent;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range]::-moz-range-progress {
  background-color: transparent;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range]::-moz-focus-outer {
  border: 0;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player input[type=range]:focus {
  outline: none;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player #album_jacket {
  width: 100px;
  height: 100px;
  border-radius: 20px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/components.png") no-repeat;
  background-position: -165px -500px;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right {
  width: 426px;
  margin-left: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right > * {
  width: 100%;
  display: flex;
  align-items: center;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute {
  height: 16px;
  justify-content: flex-end;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-webkit-slider-thumb {
  position: relative;
  -webkit-appearance: none;
  border: 1px solid #616564;
  width: 7px;
  height: 7px;
  background-color: #616564;
  cursor: pointer;
  border-radius: 50%;
  margin: -2px 0 0 0;
  z-index: 10;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]:active::-webkit-slider-thumb {
  background: #616564;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-moz-range-thumb {
  box-sizing: content-box;
  border: 1px solid #616564;
  height: 7px;
  width: 7px;
  border-radius: 50%;
  background-color: #616564;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]:active::-moz-range-thumb {
  background: #616564;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-ms-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  background: transparent;
  border: solid transparent;
  color: transparent;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-ms-fill-lower {
  background-color: #616564;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-ms-fill-upper {
  background: #616564;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]::-ms-thumb {
  box-sizing: content-box;
  border: 1px solid #616564;
  height: 7px;
  width: 7px;
  background-color: #616564;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute input[type=range]:active::-ms-thumb {
  background: #616564;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute .expandable {
  width: 73px;
  height: 22px;
  margin-left: 6px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute .expandable .rangeVertical {
  background: #dddddd;
  width: 100%;
  height: 3px;
  position: absolute;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute .expandable #volumeFill {
  width: 50%;
  height: 3px;
  background: #a2a6a5;
  position: absolute;
  cursor: pointer;
  transition: 0.1s;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #mute #volumeIcon {
  width: 11px;
  height: 16px;
  background-position: -609px -492px;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right .btn_area {
  height: 42px;
  font-size: 18px;
  font-weight: 500;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right .btn_area .btn_play {
  width: 37px;
  height: 37px;
  background-position: -403px -513px;
  margin-left: 8px;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right .btn_area .btn_stop {
  width: 37px;
  height: 37px;
  background-position: -1044px -513px;
  margin-left: 8px;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder {
  margin-top: 10px;
  height: 15px;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-webkit-slider-thumb {
  position: relative;
  -webkit-appearance: none;
  border: 3px solid #0be0fe;
  width: 14px;
  height: 14px;
  background-color: #ffffff;
  cursor: pointer;
  border-radius: 50%;
  margin: -5px 0 0 0;
  z-index: 10;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]:active::-webkit-slider-thumb {
  background: white;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-moz-range-thumb {
  box-sizing: content-box;
  border: 3px solid #0be0fe;
  height: 14px;
  width: 14px;
  border-radius: 50%;
  background-color: white;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]:active::-moz-range-thumb {
  background: white;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-ms-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  background: transparent;
  border: solid transparent;
  color: transparent;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-ms-fill-lower {
  background-color: white;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-ms-fill-upper {
  background: white;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]::-ms-thumb {
  box-sizing: content-box;
  border: 3px solid #0be0fe;
  height: 14px;
  width: 14px;
  background-color: white;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder input[type=range]:active::-ms-thumb {
  background: white;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder #rangeContainer {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  height: 26px;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder #rangeContainer .rangeHorizontal {
  width: 100%;
  height: 3px;
  background: #dddddd;
  position: absolute;
  cursor: pointer;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #seekHolder #rangeContainer #seekFill {
  background: #0be0fe;
  height: 3px;
  position: absolute;
  cursor: pointer;
  transition: 0.1s;
}
#wrap #section2 .center_wrap .content_wrap .music .music_player_wrap #player .right #time {
  justify-content: space-between;
  color: #848484;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .text_input {
  background-color: #24123e;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro {
  color: #0be0fe;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro span {
  text-decoration: underline;
  color: #edb64f;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .input_txt .input_erro .btn_board_login {
  background-position-y: -707px;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .txt_cnt p span {
  color: #ff731f;
  font-style: none;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .input_wrap .btn_submit {
  background-position-y: -568px;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .board_list ul {
  border-top: 1px solid #872df4;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .board_list ul li {
  border-bottom: 1px solid #872df4;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .board_list ul li .name, #wrap #section2 .center_wrap .content_wrap .board_wrap .board_list ul li .date {
  color: #ff5da5;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .board_list ul li p {
  color: white;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .board_list .not_list {
  border-top: 1px solid #872df4;
  border-bottom: 1px solid #872df4;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .paging .num {
  color: #b87eff;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .paging .num .on {
  color: #0be0fe;
}
#wrap #section2 .center_wrap .content_wrap .board_wrap .paging .btn {
  background-position-y: -777px;
}
#wrap #section2 .center_wrap .note {
  height: 410px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/note_bg.jpg");
}
#wrap #section2 .center_wrap .note ul {
  height: 260px;
  background-position: 0 -2250px;
}
#wrap #section2 .motion .left .char {
  width: 982px;
  height: 1837px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/char_left.png") no-repeat;
  right: 271px;
  top: 47px;
}
#wrap #section2 .motion .left .l_note1 {
  width: 30px;
  height: 61px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/l_note1.png") no-repeat;
  right: 596px;
  top: 178px;
  animation: noteDoongDoong1 1.5s linear infinite;
}
#wrap #section2 .motion .left .l_note2 {
  width: 54px;
  height: 42px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/l_note2.png") no-repeat;
  right: 513px;
  top: 270px;
  animation: noteDoongDoong2 1.5s linear 0.5s infinite;
}
#wrap #section2 .motion .left .l_note3 {
  width: 73px;
  height: 98px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/l_note3.png") no-repeat;
  right: 687px;
  top: 1502px;
  animation: noteDoongDoong1 1.5s linear infinite;
}
#wrap #section2 .motion .right .char {
  width: 1294px;
  height: 1456px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/char_right.png") no-repeat;
  left: -76px;
  top: 330px;
}
#wrap #section2 .motion .right .r_note1 {
  width: 47px;
  height: 52px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section2/r_note1.png") no-repeat;
  left: 657px;
  top: 1642px;
  animation: noteDoongDoong2 1.5s linear 0.3s infinite;
}
@keyframes up {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  50% {
    opacity: 1;
    transform: translateY(50px);
  }
  100% {
    opacity: 0;
    transform: translateY(0px);
  }
}
#wrap #section3 {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section3/background.jpg") no-repeat center 0;
  z-index: 2;
  overflow: visible;
}
#wrap #section3 .title, #wrap #section3 .subtitle,
#wrap #section3 .content, #wrap #section3 .note ul {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section3/content.png") no-repeat;
  margin: 0 auto;
}
#wrap #section3 .center_wrap .title {
  width: 834px;
  height: 213px;
  background-position: -236px 0;
}
#wrap #section3 .center_wrap .subtitle {
  width: 560px;
  height: 208px;
  background-position: -359px -213px;
}
#wrap #section3 .center_wrap .content_wrap {
  height: 860px;
}
#wrap #section3 .center_wrap .content_wrap .content {
  width: 1280px;
  height: 100%;
  background-position: 0 -423px;
}
#wrap #section3 .center_wrap .content_wrap .btn_detail {
  background-position-y: -804px;
  bottom: 141px;
}
#wrap #section3 .center_wrap .note {
  height: 250px;
  background: #232239;
}
#wrap #section3 .center_wrap .note ul {
  height: 94px;
  background-position: 0 -1320px;
}
#wrap #section3 .motion .left .up_l {
  width: 60px;
  height: 131px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section3/up_l.png") no-repeat;
  right: 738px;
  top: 319px;
  animation: up 1.8s linear infinite forwards;
}
#wrap #section3 .motion .right .char {
  width: 1592px;
  height: 1946px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section3/char.png") no-repeat;
  left: -310px;
  top: -15px;
}
#wrap #section3 .motion .right .up_r {
  width: 30px;
  height: 65px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section3/up_r.png") no-repeat;
  left: 345px;
  top: 376px;
  animation: up 1.8s linear infinite 0.5s forwards;
}
#wrap #section4 {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section4/background.jpg") no-repeat center 0;
  z-index: 3;
}
#wrap #section4 .title, #wrap #section4 .subtitle,
#wrap #section4 .content {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section4/content.png") no-repeat;
  margin: 0 auto;
}
#wrap #section4 .center_wrap .title {
  width: 615px;
  height: 211px;
  background-position: -219px 0;
}
#wrap #section4 .center_wrap .subtitle {
  width: 573px;
  height: 162px;
  background-position: -228px -211px;
}
#wrap #section4 .center_wrap .content_wrap {
  height: 887px;
}
#wrap #section4 .center_wrap .content_wrap .content {
  width: 1029px;
  height: 100%;
  background-position: 0 -373px;
}
#wrap #section4 .center_wrap .content_wrap .btn_detail {
  background-position-y: -999px;
  bottom: 122px;
}
#wrap #section4 .motion .left .char {
  width: 1005px;
  height: 1065px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section4/char.png") no-repeat;
  right: -5px;
  top: 83px;
}
#wrap #section4 .motion .left .rec_l {
  width: 878px;
  height: 1064px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section4/rec_l.png") no-repeat;
  right: 192px;
  top: 30px;
  z-index: -1;
}
#wrap #section4 .motion .right .rec_r {
  width: 934px;
  height: 750px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section4/rec_r.png") no-repeat;
  left: 133px;
  top: 712px;
}
#wrap #section5 {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/background.jpg") no-repeat center 0;
  z-index: 3;
}
#wrap #section5 .title, #wrap #section5 .subtitle,
#wrap #section5 .content {
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/content.png") no-repeat;
  margin: 0 auto;
}
#wrap #section5 .center_wrap .title {
  width: 755px;
  height: 214px;
  background-position: -150px 0;
}
#wrap #section5 .center_wrap .subtitle {
  width: 587px;
  height: 162px;
  background-position: -217px -214px;
}
#wrap #section5 .center_wrap .content_wrap {
  height: 1194px;
}
#wrap #section5 .center_wrap .content_wrap .content {
  width: 1029px;
  height: 100%;
  background-position: 0 -373px;
}
#wrap #section5 .center_wrap .content_wrap .btn_detail {
  background-position-y: -1193px;
  bottom: 195px;
}
#wrap #section5 .motion .left .tk_l1 {
  width: 35px;
  height: 42px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/tk_l1.png") no-repeat;
  right: 424px;
  top: 157px;
}
#wrap #section5 .motion .left .tk_l2 {
  width: 53px;
  height: 64px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/tk_l2.png") no-repeat;
  right: 372px;
  top: 106px;
}
#wrap #section5 .motion .left .char {
  width: 606px;
  height: 691px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/char_l.png") no-repeat;
  right: 469px;
  top: 597px;
}
#wrap #section5 .motion .right .tk_r1 {
  width: 38px;
  height: 47px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/tk_r1.png") no-repeat;
  left: 416px;
  top: 240px;
}
#wrap #section5 .motion .right .tk_r2 {
  width: 54px;
  height: 65px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/tk_r2.png") no-repeat;
  left: 442px;
  top: 180px;
}
#wrap #section5 .motion .right .char {
  width: 561px;
  height: 685px;
  background: url("https://lwi.nexon.com/asgard/2022/0907_event_D8E63887BEDBA3DF/section5/char_r.png") no-repeat;
  left: 470px;
  top: 316px;
}
#wrap .btn_top {
  width: 65px;
  height: 65px;
  background-position: -1740px -462px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 10;
}
#wrap .popup {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  touch-action: none;
  overflow: hidden;
  left: 0;
  top: 0;
  z-index: 100;
  font-size: 18px;
  color: 222222;
}
#wrap .popup .alert_con {
  background-position: -1422px -1071px;
}
#wrap .popup .alert_con .alert,
#wrap .popup .alert_con .confirm {
  display: flex;
  width: 484px;
  height: 245px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#wrap .popup .alert_con .alert p,
#wrap .popup .alert_con .confirm p {
  margin: 18px 0;
}
#wrap .popup .alert_con .alert .btn_wrap,
#wrap .popup .alert_con .confirm .btn_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}
#wrap .popup .alert_con .alert .btn_wrap .btn,
#wrap .popup .alert_con .confirm .btn_wrap .btn {
  width: 120px;
  height: 50px;
  margin: 0 3px;
  background-position-y: -1362px;
}
#wrap .popup .alert_con .alert .btn_wrap .btn.btn_close,
#wrap .popup .alert_con .confirm .btn_wrap .btn.btn_close {
  background-position-x: -1539px;
}
#wrap .popup .alert_con .alert .btn_wrap .btn.btn_ok,
#wrap .popup .alert_con .confirm .btn_wrap .btn.btn_ok {
  background-position-x: -1666px;
}

@media screen and (max-width: 1279px) {
  #wrap section .center_wrap .note {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .gnb_wrap .util {
    display: none;
  }

  .gnb_wrap .layer_btn {
    display: none;
  }
}

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