@import url(https://lwres.nexon.com/css/mabinogim/brand/common/font.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/common.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/modal.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/loading.css);
#mabinogim {
  overflow: hidden;
}
#mabinogim .info, #mabinogim .container {
  position: relative;
  min-height: max(var(--vh, 1vh) * 100 - var(--pc-top-height), 500px);
  background: #000;
}
#mabinogim .info .contents_wrap, #mabinogim .container .contents_wrap {
  position: relative;
}
#mabinogim .info .contents_wrap .bg, #mabinogim .container .contents_wrap .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  min-height: calc(var(--vh, 1vh) * 100 - var(--pc-top-height));
  background: #000;
  pointer-events: none;
}
#mabinogim .info .contents_wrap .bg .video_area, #mabinogim .container .contents_wrap .bg .video_area {
  width: 100%;
  height: 100%;
}
#mabinogim .info .contents_wrap .bg .video_area::before, #mabinogim .container .contents_wrap .bg .video_area::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 40%;
  bottom: 0;
  left: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.64) 50%, rgba(0, 0, 0, 0) 100%);
  z-index: 2;
  pointer-events: none;
}
#mabinogim .info .contents_wrap .bg .video_area video, #mabinogim .container .contents_wrap .bg .video_area video {
  position: absolute;
  top: -50px;
  left: 0;
  width: 100%;
}
#mabinogim .info .contents_wrap .bg .video_area video:not(:nth-child(1)), #mabinogim .container .contents_wrap .bg .video_area video:not(:nth-child(1)) {
  display: none;
}
#mabinogim .info .contents_wrap .bg .video_area video[data-type=pc], #mabinogim .container .contents_wrap .bg .video_area video[data-type=pc] {
  display: block;
}
#mabinogim .info .contents_wrap .bg .video_area video[data-type=mobile], #mabinogim .container .contents_wrap .bg .video_area video[data-type=mobile] {
  display: none;
}
#mabinogim .info .contents_wrap .contents, #mabinogim .container .contents_wrap .contents {
  min-height: max(var(--vh, 1vh) * 100 - var(--pc-top-height) - 104px, 396px);
  transition: 0.3s;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#mabinogim .info .contents_wrap .contents .text_area, #mabinogim .container .contents_wrap .contents .text_area {
  margin-top: auto;
  position: relative;
  z-index: 3;
}
#mabinogim .info .contents_wrap .contents .text_area .title, #mabinogim .container .contents_wrap .contents .text_area .title {
  animation: topMove 2s forwards ease;
}
#mabinogim .info .contents_wrap .contents .text_area .title span, #mabinogim .container .contents_wrap .contents .text_area .title span {
  font-family: "Pretendard-Bold";
  display: block;
  width: 100%;
  color: #FFF4E9;
  font-size: 20px;
  text-align: center;
}
#mabinogim .info .contents_wrap .contents .text_area .text_line::before, #mabinogim .container .contents_wrap .contents .text_area .text_line::before {
  display: block;
  content: "";
  width: 421px;
  height: 14px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='421' height='14' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath stroke='%23ECD6BE' stroke-miterlimit='10' stroke-width='3' d='m218.609 3.73-8.22 8-2.67-2.44M202.279 10.06l8.22-8 2.67 2.45'/%3E%3Cpath fill='%23ECD6BE' d='M197.719 8.31V5.75s-117.11.34-117.11 1.23c0 .89 117.11 1.33 117.11 1.33Z'/%3E%3Cpath fill='%23ECD6BE' d='m198.388 10.18 3.139-3.14-3.139-3.139-3.14 3.14 3.14 3.14ZM223.279 8.31V5.75s117.11.33 117.11 1.22c0 .89-117.11 1.33-117.11 1.33v.01ZM204.358 4.5l-1.86-1.86-1.86 1.86 1.86 1.86 1.86-1.86ZM219.86 10 218 8.14 216.14 10l1.86 1.859 1.86-1.86Z'/%3E%3Cpath fill='%23ECD6BE' d='m225.755 7.029-3.14-3.14-3.139 3.14 3.139 3.14 3.14-3.14Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M.61 0h419.78v13.79H.61z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  margin: 8px auto;
}
#mabinogim .info .contents_wrap .contents .text_area .text_line p, #mabinogim .container .contents_wrap .contents .text_area .text_line p {
  color: #FFF;
  font-size: 15px;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36px;
  text-align: center;
  animation: topMove 1s forwards ease;
}
#mabinogim .info .contents_wrap .contents .text_area br, #mabinogim .container .contents_wrap .contents .text_area br {
  display: none;
}
#mabinogim .info .contents_wrap .contents .progress, #mabinogim .container .contents_wrap .contents .progress {
  width: min-content;
  position: relative;
  padding: 10px 40px;
  border-radius: 20px;
  background: rgba(33, 33, 33, 0.7);
  margin: 20px 0 0 0;
  transition: 0.3s;
  z-index: 3;
}
#mabinogim .info .contents_wrap .contents .progress ul, #mabinogim .container .contents_wrap .contents .progress ul {
  display: flex;
}
#mabinogim .info .contents_wrap .contents .progress ul li, #mabinogim .container .contents_wrap .contents .progress ul li {
  display: flex;
  align-items: center;
}
#mabinogim .info .contents_wrap .contents .progress ul li button, #mabinogim .container .contents_wrap .contents .progress ul li button {
  font-family: "Pretendard-Bold";
  padding: 5px 14px;
  border-radius: 10px;
  color: #7C7C7C;
  text-align: center;
  font-size: 14px;
  letter-spacing: -0.28px;
  width: min-content;
  white-space: nowrap;
  background: #403C3C;
}
#mabinogim .info .contents_wrap .contents .progress ul li .gauge, #mabinogim .container .contents_wrap .contents .progress ul li .gauge {
  position: relative;
  margin: 0 5px;
  width: 15px;
  height: 3px;
  background: #515151;
  border-radius: 10px;
}
#mabinogim .info .contents_wrap .contents .progress ul li .gauge b, #mabinogim .container .contents_wrap .contents .progress ul li .gauge b {
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background: #0FB376;
  border-radius: 10px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .info .contents_wrap .contents .progress ul li:hover button, #mabinogim .container .contents_wrap .contents .progress ul li:hover button {
    color: #fff;
    padding: 5px 14px;
    background: #0FB376;
  }
}
#mabinogim .info .contents_wrap .contents .progress ul li.on button, #mabinogim .container .contents_wrap .contents .progress ul li.on button {
  color: #fff;
  padding: 5px 20px;
  background: #0FB376;
}
#mabinogim .info .contents_wrap .contents .progress ul li.on .gauge, #mabinogim .container .contents_wrap .contents .progress ul li.on .gauge {
  margin: 0 5px;
  width: 70px;
  height: 3px;
}
#mabinogim .info .contents_wrap .contents .scroll_button, #mabinogim .container .contents_wrap .contents .scroll_button {
  display: none;
}

@media (max-width: 1280px) {
  #mabinogim .info, #mabinogim .container {
    position: relative;
    min-height: calc(var(--vh, 1vh) * 100 - var(--mobile-top-height));
  }
  #mabinogim .info .contents_wrap, #mabinogim .container .contents_wrap {
    position: relative;
  }
  #mabinogim .info .contents_wrap .bg, #mabinogim .container .contents_wrap .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    min-height: calc(var(--vh, 1vh) * 100);
    background: #000;
  }
  #mabinogim .info .contents_wrap .bg .video_area video, #mabinogim .container .contents_wrap .bg .video_area video {
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #mabinogim .info .contents_wrap .bg .video_area video:not(:nth-child(1)), #mabinogim .container .contents_wrap .bg .video_area video:not(:nth-child(1)) {
    display: none;
  }
  #mabinogim .info .contents_wrap .contents, #mabinogim .container .contents_wrap .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: calc(var(--vh, 1vh) * 100 - var(--mobile-top-height) - 80px);
  }
  #mabinogim .info .contents_wrap .contents .text_area, #mabinogim .container .contents_wrap .contents .text_area {
    margin-top: auto;
    position: relative;
  }
  #mabinogim .info .contents_wrap .contents .text_area .title span, #mabinogim .container .contents_wrap .contents .text_area .title span {
    font-size: min(18px, 3.8vw);
    letter-spacing: 0%;
  }
  #mabinogim .info .contents_wrap .contents .text_area .text_line p, #mabinogim .container .contents_wrap .contents .text_area .text_line p {
    color: #FFF;
    font-size: 10px;
    letter-spacing: -0.024px;
  }
  @supports (font-size: min(12px, 2.6vw)) {
    #mabinogim .info .contents_wrap .contents .text_area .text_line p, #mabinogim .container .contents_wrap .contents .text_area .text_line p {
      font-size: min(12px, 2.6vw);
    }
  }
  #mabinogim .info .contents_wrap .contents .text_area br, #mabinogim .container .contents_wrap .contents .text_area br {
    display: block;
  }
  #mabinogim .info .contents_wrap .contents .progress, #mabinogim .container .contents_wrap .contents .progress {
    display: none;
  }
  #mabinogim .info .contents_wrap .contents .scroll_button, #mabinogim .container .contents_wrap .contents .scroll_button {
    position: relative;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: -0.24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 10px auto 14px;
    animation: scrollButton 3s reverse linear infinite;
    pointer-events: none;
    z-index: 3;
  }
  #mabinogim .info .contents_wrap .contents .scroll_button::before, #mabinogim .container .contents_wrap .contents .scroll_button::before {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' d='M8 4a.667.667 0 0 1 .667.667v7.723l.862-.861a.666.666 0 0 1 .88-.056l.062.056a.667.667 0 0 1 .056.88l-.056.062-2 2a.667.667 0 0 1-.88.056l-.062-.056-2-2a.666.666 0 0 1 .88-.998l.062.056.862.861V4.667A.667.667 0 0 1 8 4Zm0-2.667a3.333 3.333 0 0 1 1.333 6.39V6.58a2.333 2.333 0 1 0-2.666 0v1.142A3.334 3.334 0 0 1 8 1.333Z'/%3E%3C/svg%3E") no-repeat;
    background-size: cover;
    background-position: center;
  }
}
@media (max-width: 768px) {
  #mabinogim .info .contents_wrap .bg .video_area video[data-type=pc], #mabinogim .container .contents_wrap .bg .video_area video[data-type=pc] {
    display: none;
  }
  #mabinogim .info .contents_wrap .bg .video_area video[data-type=mobile], #mabinogim .container .contents_wrap .bg .video_area video[data-type=mobile] {
    display: block;
  }
}
#mabinogim .info .pagination {
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: 2;
}
#mabinogim .info .pagination .swiper {
  position: relative;
  width: 100%;
  height: 104px;
  display: flex;
  align-items: flex-end;
}
#mabinogim .info .pagination .swiper ul {
  width: 100%;
  height: 84px;
  border-top: 1px solid rgba(210, 210, 210, 0.3);
  display: flex;
  justify-content: center;
  background: linear-gradient(180deg, rgba(24, 26, 35, 0.28) 0%, rgba(24, 26, 35, 0.83) 100%);
  backdrop-filter: blur(10px);
}
#mabinogim .info .pagination .swiper ul li {
  width: auto;
  transition: 0.3s;
  margin-right: 120px;
}
#mabinogim .info .pagination .swiper ul li a {
  color: #fff;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 16px;
}
#mabinogim .info .pagination .swiper ul li a::before {
  content: "";
  font-style: normal;
  position: absolute;
  top: 0px;
  transform: translateY(-50%);
  display: block;
  width: 20px;
  min-width: 20px;
  height: 20px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath fill='%23fff' d='m9.94 6.382.516.872a6 6 0 0 0 2.04 2.067l.98.597-1.122.726a5.999 5.999 0 0 0-1.845 1.887l-.57.922-.88-1.241a6 6 0 0 0-1.425-1.423l-1.23-.871 1.092-.728a6 6 0 0 0 1.63-1.613l.814-1.195Z'/%3E%3Cmask id='a' width='10' height='10' x='5' y='5' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23D9D9D9' d='M8.776 5.948a3 3 0 0 1 2.296 0l.94.39a3 3 0 0 1 1.623 1.623l.39.94a3 3 0 0 1 0 2.296l-.39.94a3 3 0 0 1-1.623 1.623l-.94.39a3 3 0 0 1-2.296 0l-.94-.39a3 3 0 0 1-1.624-1.624l-.389-.94a3 3 0 0 1 0-2.296l.39-.94a3 3 0 0 1 1.623-1.623l.94-.39Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23E8E8E8' d='M4.302 9.918h5.753v5.23H4.302z'/%3E%3Cpath fill='%23DAD9D9' d='M9.793 9.656h5.491v5.491H9.793z'/%3E%3Cpath fill='%23fff' d='M4.302 4.426h5.753v5.491H4.302z'/%3E%3Cpath fill='%23EFEFEF' d='M9.793 4.688h5.491v5.491H9.793z'/%3E%3C/g%3E%3C/svg%3E");
}
#mabinogim .info .pagination .swiper ul li.on {
  transform: translateY(-2px);
}
#mabinogim .info .pagination .swiper ul li.on a::before {
  top: 2px;
  width: 43px;
  min-width: 43px;
  height: 43px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='43' fill='none'%3E%3Cpath fill='%23fff' d='m21.063 3.063 5.906 9.976a6 6 0 0 0 2.04 2.067L39.5 21.5l-10.633 6.886a6.001 6.001 0 0 0-1.846 1.887l-5.959 9.665-7.086-9.984a5.999 5.999 0 0 0-1.425-1.423L2.626 21.5l9.788-6.525a6 6 0 0 0 1.63-1.613l7.02-10.3Z'/%3E%3Cmask id='a' width='34' height='34' x='4' y='5' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23D9D9D9' d='M19.852 5.976a3 3 0 0 1 2.296 0l9.371 3.881a3 3 0 0 1 1.624 1.624l3.882 9.37a3.001 3.001 0 0 1 0 2.297l-3.882 9.371a3 3 0 0 1-1.624 1.624l-9.37 3.882a3.001 3.001 0 0 1-2.297 0l-9.371-3.882a3 3 0 0 1-1.624-1.624l-3.881-9.37a3 3 0 0 1 0-2.297l3.881-9.371a3 3 0 0 1 1.624-1.624l9.37-3.881Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23E8E8E8' d='M.729 21.529h20.743v18.857H.729z'/%3E%3Cpath fill='%23DAD9D9' d='M20.529 20.586h19.8v19.8h-19.8z'/%3E%3Cpath fill='%23fff' d='M.729 1.729h20.743v19.8H.729z'/%3E%3Cpath fill='%23EFEFEF' d='M20.529 2.671h19.8v19.8h-19.8z'/%3E%3C/g%3E%3Cpath fill='%236F6F6F' fill-rule='evenodd' d='M23.708 13.949 21 11.5l-2.708 2.449L21 16.398l2.708-2.449Zm3.792 9.306-4.968-4.492.011-.01-1.532-1.386-.011.01-.011-.01-1.532 1.386.011.01-4.968 4.492 4.968 4.493-2.31 2.087 1.533 1.386L21 29.133l2.31 2.088 1.531-1.386-2.31-2.088 4.969-4.492Zm-3.064 0L21 26.362l-3.436-3.107L21 20.148l3.436 3.107Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  animation: hoverAction 0.2s forwards linear;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .info .pagination .swiper ul li:hover {
    transform: translateY(-2px);
  }
  #mabinogim .info .pagination .swiper ul li:hover a::before {
    top: 2px;
    width: 43px;
    min-width: 43px;
    height: 43px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='43' fill='none'%3E%3Cpath fill='%23fff' d='m21.063 3.063 5.906 9.976a6 6 0 0 0 2.04 2.067L39.5 21.5l-10.633 6.886a6.001 6.001 0 0 0-1.846 1.887l-5.959 9.665-7.086-9.984a5.999 5.999 0 0 0-1.425-1.423L2.626 21.5l9.788-6.525a6 6 0 0 0 1.63-1.613l7.02-10.3Z'/%3E%3Cmask id='a' width='34' height='34' x='4' y='5' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23D9D9D9' d='M19.852 5.976a3 3 0 0 1 2.296 0l9.371 3.881a3 3 0 0 1 1.624 1.624l3.882 9.37a3.001 3.001 0 0 1 0 2.297l-3.882 9.371a3 3 0 0 1-1.624 1.624l-9.37 3.882a3.001 3.001 0 0 1-2.297 0l-9.371-3.882a3 3 0 0 1-1.624-1.624l-3.881-9.37a3 3 0 0 1 0-2.297l3.881-9.371a3 3 0 0 1 1.624-1.624l9.37-3.881Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23E8E8E8' d='M.729 21.529h20.743v18.857H.729z'/%3E%3Cpath fill='%23DAD9D9' d='M20.529 20.586h19.8v19.8h-19.8z'/%3E%3Cpath fill='%23fff' d='M.729 1.729h20.743v19.8H.729z'/%3E%3Cpath fill='%23EFEFEF' d='M20.529 2.671h19.8v19.8h-19.8z'/%3E%3C/g%3E%3Cpath fill='%236F6F6F' fill-rule='evenodd' d='M23.708 13.949 21 11.5l-2.708 2.449L21 16.398l2.708-2.449Zm3.792 9.306-4.968-4.492.011-.01-1.532-1.386-.011.01-.011-.01-1.532 1.386.011.01-4.968 4.492 4.968 4.493-2.31 2.087 1.533 1.386L21 29.133l2.31 2.088 1.531-1.386-2.31-2.088 4.969-4.492Zm-3.064 0L21 26.362l-3.436-3.107L21 20.148l3.436 3.107Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    animation: hoverAction 0.2s forwards linear;
  }
}
#mabinogim .info .pagination .swiper ul li:last-child {
  margin-right: 0;
}
@keyframes hoverAction {
  0% {
    transform: scale(0) translateY(-50%);
    transform-origin: 50% 0;
  }
  100% {
    transform: scale(1) translateY(-50%);
    transform-origin: 50% 0;
  }
}
#mabinogim .info .pagination .prev_button, #mabinogim .info .pagination .next_button {
  display: none;
}

@media (max-width: 1280px) {
  #mabinogim {
    overflow: hidden;
  }
  #mabinogim .info .pagination {
    width: 100%;
    padding: 0 50px;
    border-top: 1px solid rgba(210, 210, 210, 0.3);
    background: linear-gradient(180deg, rgba(24, 26, 35, 0.28) 0%, rgba(24, 26, 35, 0.83) 100%);
    backdrop-filter: blur(10px);
    z-index: 2;
  }
  #mabinogim .info .pagination .swiper {
    position: relative;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: flex-end;
  }
  #mabinogim .info .pagination .swiper ul {
    width: 100%;
    height: 70px;
    display: flex;
    justify-content: flex-start;
    background: none;
    backdrop-filter: none;
  }
  #mabinogim .info .pagination .swiper ul li {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0;
  }
  #mabinogim .info .pagination .swiper ul li a {
    color: #fff;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 14px;
  }
  #mabinogim .info .pagination .swiper ul li a::before {
    content: "";
    position: static;
    top: inherit;
    transform: none;
    display: block;
    width: 43px;
    min-width: 43px;
    height: 43px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='43' fill='none'%3E%3Cpath fill='%23fff' d='m21.063 3.063 5.906 9.976a6 6 0 0 0 2.04 2.067L39.5 21.5l-10.633 6.886a6.001 6.001 0 0 0-1.846 1.887l-5.959 9.665-7.086-9.984a5.999 5.999 0 0 0-1.425-1.423L2.626 21.5l9.788-6.525a6 6 0 0 0 1.63-1.613l7.02-10.3Z'/%3E%3Cmask id='a' width='34' height='34' x='4' y='5' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23D9D9D9' d='M19.852 5.976a3 3 0 0 1 2.296 0l9.371 3.881a3 3 0 0 1 1.624 1.624l3.882 9.37a3.001 3.001 0 0 1 0 2.297l-3.882 9.371a3 3 0 0 1-1.624 1.624l-9.37 3.882a3.001 3.001 0 0 1-2.297 0l-9.371-3.882a3 3 0 0 1-1.624-1.624l-3.881-9.37a3 3 0 0 1 0-2.297l3.881-9.371a3 3 0 0 1 1.624-1.624l9.37-3.881Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23E8E8E8' d='M.729 21.529h20.743v18.857H.729z'/%3E%3Cpath fill='%23DAD9D9' d='M20.529 20.586h19.8v19.8h-19.8z'/%3E%3Cpath fill='%23fff' d='M.729 1.729h20.743v19.8H.729z'/%3E%3Cpath fill='%23EFEFEF' d='M20.529 2.671h19.8v19.8h-19.8z'/%3E%3C/g%3E%3Cpath fill='%236F6F6F' fill-rule='evenodd' d='M23.708 13.949 21 11.5l-2.708 2.449L21 16.398l2.708-2.449Zm3.792 9.306-4.968-4.492.011-.01-1.532-1.386-.011.01-.011-.01-1.532 1.386.011.01-4.968 4.492 4.968 4.493-2.31 2.087 1.533 1.386L21 29.133l2.31 2.088 1.531-1.386-2.31-2.088 4.969-4.492Zm-3.064 0L21 26.362l-3.436-3.107L21 20.148l3.436 3.107Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    margin-right: 10px;
  }
  #mabinogim .info .pagination .swiper ul li.on {
    transform: none;
  }
  #mabinogim .info .pagination .swiper ul li.on a::before {
    top: 2px;
    width: 43px;
    min-width: 43px;
    height: 43px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='43' fill='none'%3E%3Cpath fill='%23fff' d='m21.063 3.063 5.906 9.976a6 6 0 0 0 2.04 2.067L39.5 21.5l-10.633 6.886a6.001 6.001 0 0 0-1.846 1.887l-5.959 9.665-7.086-9.984a5.999 5.999 0 0 0-1.425-1.423L2.626 21.5l9.788-6.525a6 6 0 0 0 1.63-1.613l7.02-10.3Z'/%3E%3Cmask id='a' width='34' height='34' x='4' y='5' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23D9D9D9' d='M19.852 5.976a3 3 0 0 1 2.296 0l9.371 3.881a3 3 0 0 1 1.624 1.624l3.882 9.37a3.001 3.001 0 0 1 0 2.297l-3.882 9.371a3 3 0 0 1-1.624 1.624l-9.37 3.882a3.001 3.001 0 0 1-2.297 0l-9.371-3.882a3 3 0 0 1-1.624-1.624l-3.881-9.37a3 3 0 0 1 0-2.297l3.881-9.371a3 3 0 0 1 1.624-1.624l9.37-3.881Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23E8E8E8' d='M.729 21.529h20.743v18.857H.729z'/%3E%3Cpath fill='%23DAD9D9' d='M20.529 20.586h19.8v19.8h-19.8z'/%3E%3Cpath fill='%23fff' d='M.729 1.729h20.743v19.8H.729z'/%3E%3Cpath fill='%23EFEFEF' d='M20.529 2.671h19.8v19.8h-19.8z'/%3E%3C/g%3E%3Cpath fill='%236F6F6F' fill-rule='evenodd' d='M23.708 13.949 21 11.5l-2.708 2.449L21 16.398l2.708-2.449Zm3.792 9.306-4.968-4.492.011-.01-1.532-1.386-.011.01-.011-.01-1.532 1.386.011.01-4.968 4.492 4.968 4.493-2.31 2.087 1.533 1.386L21 29.133l2.31 2.088 1.531-1.386-2.31-2.088 4.969-4.492Zm-3.064 0L21 26.362l-3.436-3.107L21 20.148l3.436 3.107Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    animation: none;
  }
  #mabinogim .info .pagination .prev_button {
    display: block;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    min-width: 12px;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='20' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='2' d='m11 19-9-9 9-9'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 2;
    padding: 0 26px;
  }
  #mabinogim .info .pagination .next_button {
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    min-width: 12px;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='20' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='2' d='m1 1 9 9-9 9'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 2;
    padding: 0 26px;
  }
}
@keyframes topMove {
  0% {
    transform: translateY(20%);
    opacity: 0;
  }
  100% {
    transform: translateY(0%);
    opacity: 1;
  }
}
@keyframes gauge {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes scrollButton {
  0% {
    transform: translateY(10%);
    opacity: 0;
  }
  40% {
    transform: translateY(0%);
    opacity: 1;
  }
}