@charset "UTF-8";*,
*::before,
*::after {
  box-sizing: border-box; /* Set the sizing of an element to include it's border */
}* {
  margin: 0; /* Set the default margin to 0 */
  padding: 0; /* Set the default padding to 0 */
}ul[role=list],
ol[role=list] {
  list-style: none; /* Turn off numbered and unordered list decoration */
}a:not([class]) {
  text-decoration-skip-ink: auto; /* Makes link undelines look better */
}img,
picture,
svg,
video,
canvas {
  max-width: 100%; /* Makes it responsive */
  height: auto; /* Makes it responsive */
  vertical-align: middle; /* Makes text next to inline images look better */
  font-style: italic; /* If the images don't load it makes the alt decription look better */
  background-repeat: no-repeat;
  /* The background repeat and size are there if you want to load a picture first like a backroung image that is worse quality while the better quality image loads */
  background-size: cover;
}input,
button,
textarea,
select {
  font: inherit; /* Makes these elements inherit fonts */
  border: 0;
}/* Turns off animation for people who don't want to see them */body,
html {
  height: 100%; /* Makes the body element full screen */
}:root {
  --ds: 2000;
  --vw: 100vw;
}@media (max-width: 767px) {
  :root {
    --ds: 520;
  }
}@media (min-width: 768px) and (max-width: 767px) {
  :root {
    --ds: 1400;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  :root {
    --ds: 1400;
  }
}@media (min-width: 768px) and (max-width: 992px) and (orientation: portrait) {
  :root {
    --ds: 1320 !important;
  }
}@media (min-width: 993px) and (max-width: 1200px) {
  :root {
    --ds: 1920;
  }
}@media (min-width: 1201px) and (max-width: 1400px) {
  :root {
    --ds: 1920;
  }
}@media (min-width: 1401px) and (max-width: 1920px) {
  :root {
    --ds: 1920;
  }
}@media (min-width: 1921px) and (max-width: 2560px) {
  :root {
    --ds: 2560;
  }
}html {
  font-size: 10px;
  font-family: "Microsoft JhengHei", "微軟正黑體", sans-serif;
  font-optical-sizing: auto;
}html.fixed {
  overflow: hidden;
}body {
  background-color: #000;
}body.fixed {
  overflow: hidden;
}.wrap {
  position: relative;
}.site-main {
  position: relative;
}.btn-gotop {
  width: calc(119 / var(--ds) * var(--vw));
  height: calc(147 / var(--ds) * var(--vw));
  background: transparent url("../../images/btn-top-bg@3x.png") no-repeat 0 0;
  background-size: cover;
  position: fixed;
  right: calc(20 / var(--ds) * var(--vw));
  bottom: calc(20 / var(--ds) * var(--vw));
  filter: brightness(0.8);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  z-index: 100;
  translate: 0 120%;
}@media (hover: hover) {
  .btn-gotop:hover {
    filter: brightness(1);
  }
}@media (max-width: 767px) {
  .btn-gotop {
    filter: brightness(1);
    width: calc(80 / var(--ds) * var(--vw));
    height: calc(99 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .btn-gotop {
    filter: brightness(1);
  }
}.btn-gotop.active {
  translate: 0 0;
}@media (max-width: 767px) {
  .btn-gotop.active {
    translate: 0 -50%;
  }
}.goverlay {
  background-color: rgba(0, 0, 0, 0.85) !important;
}.gslide-external {
  background-color: transparent !important;
  max-height: inherit !important;
}.demo-ui {
  position: fixed;
  left: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  padding: 8px;
  z-index: 2000;
}.demo-ui button {
  padding: 8px 12px;
}@media (max-width: 767px) {
  .demo-ui {
    display: none;
  }
}.device-size {
  position: fixed;
  right: 0;
  bottom: 0;
  font-size: 1.2rem;
  color: #fff;
  z-index: 2000;
  padding: 8px;
  background-color: #000;
}@media (max-width: 767px) {
  .device-size {
    right: initial;
    left: 0;
  }
}.site-header {
  height: calc(195 / var(--ds) * var(--vw));
  position: fixed;
  width: 100%;
  aspect-ratio: 1920/195;
  left: 0;
  top: 0;
  z-index: 500;
  background: transparent url("../../images/nav-bg@2x.png") no-repeat center top;
  background-size: cover;
}@media (max-width: 767px) {
  .site-header {
    background-image: none;
  }
  .site-header::after {
    width: 100%;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    aspect-ratio: 1440/483;
    position: absolute;
    background-image: url("../../images/nav-bg-m@3x.png");
    background-size: cover;
    z-index: 10;
    pointer-events: none;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header {
    background-image: none;
  }
  .site-header::after {
    width: 100%;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    aspect-ratio: 1984/364;
    position: absolute;
    background-image: url("../../images/nav-bg-p@2x.png");
    background-size: cover;
    z-index: 10;
    pointer-events: none;
  }
}.site-header__khm-logo {
  width: calc(392 / var(--ds) * var(--vw));
  height: calc(109 / var(--ds) * var(--vw));
  background: transparent url("../../images/khm-logo@2x.png") no-repeat center/cover;
  display: block;
  position: absolute;
  left: calc(49 / var(--ds) * var(--vw));
  top: calc(20 / var(--ds) * var(--vw));
  font-size: 0;
  filter: brightness(0.8);
  transform: translate3d(0, 0, 0);
  transition: all 0.3s ease-in-out;
}@media (hover: hover) {
  .site-header__khm-logo:hover {
    transform: translate3d(0, -5%, 0);
    filter: brightness(1);
  }
}@media (max-width: 767px) {
  .site-header__khm-logo {
    filter: brightness(1);
    width: calc(370 / var(--ds) * var(--vw));
    height: calc(103 / var(--ds) * var(--vw));
    z-index: 20;
    left: calc(129 / var(--ds) * var(--vw));
    top: calc(16 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__khm-logo {
    filter: brightness(1);
    width: calc(490 / var(--ds) * var(--vw));
    height: calc(136 / var(--ds) * var(--vw));
    z-index: 20;
    left: initial;
    right: calc(15 / var(--ds) * var(--vw));
    top: calc(20 / var(--ds) * var(--vw));
  }
}.site-header__btn-toggle {
  display: none;
  width: calc(74 / var(--ds) * var(--vw));
  height: calc(74 / var(--ds) * var(--vw));
  position: absolute;
  left: 0;
  top: 0;
  background-color: transparent;
  transform: translate3d(38%, 18%, 0);
  z-index: 15;
}@media (max-width: 767px) {
  .site-header__btn-toggle {
    display: block;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-toggle {
    display: block;
    width: calc(102 / var(--ds) * var(--vw));
    height: calc(102 / var(--ds) * var(--vw));
  }
}.site-header__btn-toggle::before, .site-header__btn-toggle::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/btn-toggle-bg.png") no-repeat 0 0;
  background-size: cover;
  transition: opacity 0.3s;
}.site-header__btn-toggle::before {
  background-position: 0 0;
  opacity: 1;
}.site-header__btn-toggle::after {
  background-position: 0 100%;
  opacity: 0;
}.site-header__btn-toggle.active::before {
  opacity: 0;
}.site-header__btn-toggle.active::after {
  opacity: 1;
}.site-header__nav-wrap {
  position: relative;
}@media (max-width: 767px) {
  .site-header__nav-wrap {
    width: 100%;
    flex-direction: column;
    position: fixed;
    left: 0;
    top: calc(30 / var(--ds) * var(--vw));
    aspect-ratio: 1182/1970;
    background: transparent url("../../images/nav-inner-bg@2x.png") no-repeat 0 0;
    background-size: cover;
    z-index: -1;
    transform: translate3d(-110%, 0, 0);
    transition: all 0.3s ease-in-out;
  }
  .site-header__nav-wrap.active {
    transform: translate3d(-20%, 0, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__nav-wrap {
    width: calc(476 / var(--ds) * var(--vw));
    flex-direction: column;
    position: fixed;
    left: 0;
    top: calc(30 / var(--ds) * var(--vw));
    aspect-ratio: 1182/1970;
    background: transparent url("../../images/nav-inner-bg@2x.png") no-repeat 0 0;
    background-size: cover;
    z-index: -1;
    transform: translate3d(-110%, 0, 0);
    transition: all 0.3s ease-in-out;
  }
  .site-header__nav-wrap.active {
    transform: translate3d(-10%, 0, 0);
  }
}.site-header__nav {
  height: 100%;
  display: flex;
  justify-content: center;
  padding-top: calc(24 / var(--ds) * var(--vw));
  gap: calc(40 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .site-header__nav {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: calc(140 / var(--ds) * var(--vw));
    height: auto;
    gap: calc(29 / var(--ds) * var(--vw));
    padding-bottom: calc(40 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__nav {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: calc(130 / var(--ds) * var(--vw));
    gap: calc(29 / var(--ds) * var(--vw));
    height: auto;
    padding-bottom: calc(40 / var(--ds) * var(--vw));
  }
}.site-header__btn-rules {
  width: calc(111 / var(--ds) * var(--vw));
  height: calc(36 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
}@media (max-width: 767px) {
  .site-header__btn-rules {
    width: calc(140 / var(--ds) * var(--vw));
    height: calc(45 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-rules {
    width: calc(152 / var(--ds) * var(--vw));
    height: calc(49 / var(--ds) * var(--vw));
  }
}.site-header__btn-rules::before, .site-header__btn-rules::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rules@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.site-header__btn-rules::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-rules:hover::after {
    opacity: 1;
  }
}.site-header__btn-rules.active::after {
  opacity: 1;
}.site-header__btn-legion {
  width: calc(111 / var(--ds) * var(--vw));
  height: calc(36 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
}@media (max-width: 767px) {
  .site-header__btn-legion {
    width: calc(140 / var(--ds) * var(--vw));
    height: calc(45 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-legion {
    width: calc(152 / var(--ds) * var(--vw));
    height: calc(49 / var(--ds) * var(--vw));
  }
}.site-header__btn-legion::before, .site-header__btn-legion::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/legion@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.site-header__btn-legion::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-legion:hover::after {
    opacity: 1;
  }
}.site-header__btn-legion.active::after {
  opacity: 1;
}.site-header__btn-daily {
  width: calc(111 / var(--ds) * var(--vw));
  height: calc(36 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
}@media (max-width: 767px) {
  .site-header__btn-daily {
    width: calc(140 / var(--ds) * var(--vw));
    height: calc(45 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-daily {
    width: calc(152 / var(--ds) * var(--vw));
    height: calc(49 / var(--ds) * var(--vw));
  }
}.site-header__btn-daily::before, .site-header__btn-daily::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/daily@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.site-header__btn-daily::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-daily:hover::after {
    opacity: 1;
  }
}.site-header__btn-daily.active::after {
  opacity: 1;
}.site-header__btn-award {
  width: calc(111 / var(--ds) * var(--vw));
  height: calc(36 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
}@media (max-width: 767px) {
  .site-header__btn-award {
    width: calc(140 / var(--ds) * var(--vw));
    height: calc(45 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-award {
    width: calc(152 / var(--ds) * var(--vw));
    height: calc(49 / var(--ds) * var(--vw));
  }
}.site-header__btn-award::before, .site-header__btn-award::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/award@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.site-header__btn-award::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-award:hover::after {
    opacity: 1;
  }
}.site-header__btn-award.active::after {
  opacity: 1;
}.site-header__btn-schedule {
  width: calc(86 / var(--ds) * var(--vw));
  height: calc(36 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
}@media (max-width: 767px) {
  .site-header__btn-schedule {
    width: calc(108 / var(--ds) * var(--vw));
    height: calc(45 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-schedule {
    width: calc(118 / var(--ds) * var(--vw));
    height: calc(49 / var(--ds) * var(--vw));
  }
}.site-header__btn-schedule::before, .site-header__btn-schedule::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/schedule@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.site-header__btn-schedule::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-schedule:hover::after {
    opacity: 1;
  }
}.site-header__btn-schedule.active::after {
  opacity: 1;
}.site-header__gid {
  position: absolute;
  right: calc(40 / var(--ds) * var(--vw));
  top: calc(20 / var(--ds) * var(--vw));
  display: flex;
  align-items: center;
  gap: calc(8 / var(--ds) * var(--vw));
}.site-header__gid p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
}@media (max-width: 767px) {
  .site-header__gid p {
    font-size: calc(27 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__gid p {
    font-size: calc(27 / var(--ds) * var(--vw));
  }
}@media (max-width: 767px) {
  .site-header__gid {
    width: calc(280 / var(--ds) * var(--vw));
    flex-direction: column;
    right: initial;
    top: initial;
    margin: 0 auto;
    padding-top: calc(40 / var(--ds) * var(--vw));
    border-top: solid 1px #fff;
    position: relative;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__gid {
    width: calc(320 / var(--ds) * var(--vw));
    flex-direction: column;
    right: initial;
    top: initial;
    margin: 0 auto;
    padding-top: calc(40 / var(--ds) * var(--vw));
    border-top: solid 1px #fff;
    position: relative;
  }
}.site-header__btn-signout, .site-header__btn-signin {
  width: calc(91 / var(--ds) * var(--vw));
  height: calc(51 / var(--ds) * var(--vw));
  position: relative;
  display: flex;
  background: transparent url("../../images/top-btn-signout-bg.png") no-repeat 0 0;
  background-size: 100% auto;
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  justify-content: center;
  align-items: center;
  padding: 0;
  cursor: pointer;
  text-decoration: none;
}@media (max-width: 767px) {
  .site-header__btn-signout, .site-header__btn-signin {
    width: calc(120 / var(--ds) * var(--vw));
    height: calc(67 / var(--ds) * var(--vw));
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-header__btn-signout, .site-header__btn-signin {
    width: calc(120 / var(--ds) * var(--vw));
    height: calc(67 / var(--ds) * var(--vw));
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.site-header__btn-signout::after, .site-header__btn-signin::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/top-btn-signout-bg.png") no-repeat 0 100%;
  background-size: 100% auto;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .site-header__btn-signout:hover::after, .site-header__btn-signin:hover::after {
    opacity: 1;
  }
}.site-footer {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 20;
  padding-bottom: calc(80 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .site-footer {
    padding-top: 0;
    padding-bottom: calc(40 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .site-footer {
    padding-bottom: calc(20 / var(--ds) * var(--vw));
  }
}.site-footer__inner {
  display: flex;
  justify-content: center;
  gap: calc(40 / var(--ds) * var(--vw));
  align-items: center;
}@media (max-width: 767px) {
  .site-footer__inner {
    flex-direction: column;
    gap: calc(20 / var(--ds) * var(--vw));
    padding-bottom: calc(20 / var(--ds) * var(--vw));
  }
}.site-footer__logo {
  width: calc(170 / var(--ds) * var(--vw));
}.site-footer__text p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  margin-bottom: calc(8 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .site-footer__text p {
    text-align: center;
  }
}.site-footer__text ul {
  display: flex;
  list-style: none;
  gap: calc(14 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .site-footer__text ul {
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(8 / var(--ds) * var(--vw));
  }
}.site-footer__text ul li {
  font-size: calc(14 / var(--ds) * var(--vw));
  color: #fff;
}.site-footer__rank {
  width: calc(980 / var(--ds) * var(--vw));
  margin: 0 auto;
  display: flex;
  gap: calc(20 / var(--ds) * var(--vw));
  padding-top: calc(24 / var(--ds) * var(--vw));
  align-items: center;
}@media (max-width: 767px) {
  .site-footer__rank {
    flex-direction: column;
    width: 100%;
    padding-left: calc(20 / var(--ds) * var(--vw));
    padding-right: calc(20 / var(--ds) * var(--vw));
  }
}.site-footer__rank-icon {
  flex-basis: calc(50 / var(--ds) * var(--vw));
}.site-footer__rank-icon img {
  max-width: 100%;
  display: block;
}@media (max-width: 767px) {
  .site-footer__rank-icon {
    margin: 0 auto;
    flex-basis: inherit;
    width: calc(60 / var(--ds) * var(--vw));
  }
}.site-footer__rank-text {
  flex: 1;
}.site-footer__rank-text ul {
  display: flex;
  flex-wrap: wrap;
  list-style: square;
  padding-left: calc(20 / var(--ds) * var(--vw));
  gap: calc(2 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
}.site-footer__rank-text ul li {
  font-size: calc(14 / var(--ds) * var(--vw));
  color: #fff;
}.loading {
  position: fixed;
  z-index: 600;
  background-color: #000;
  color: #f6c05e;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity 1000ms ease-in-out;
  gap: 1.6rem;
  top: 0;
}.loading.loaded {
  opacity: 0;
  pointer-events: none;
}.loading p {
  font-size: 1rem;
  color: #f6c05e;
  z-index: 10;
  text-shadow: 0 0 1rem #f6c05e;
}.loader {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-block;
  border-top: 3px solid #f6c05e;
  border-right: 3px solid transparent;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}.modal-local {
  width: 100%;
  height: 100vh;
  position: fixed;
  z-index: 1200;
  left: 0;
  top: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 400ms ease;
}.modal-local.active {
  pointer-events: auto;
  opacity: 1;
}.modal-local__overlay {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: calc(120 / var(--ds) * var(--vw)) 0;
  overflow-y: auto;
}.modal-local__content {
  position: relative;
}:root {
  --ds: 2000;
  --vw: 100vw;
}@media (max-width: 767px) {
  :root {
    --ds: 520;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  :root {
    --ds: 1400;
  }
}@media (min-width: 993px) and (max-width: 1200px) {
  :root {
    --ds: 1920;
  }
}@media (min-width: 1201px) and (max-width: 1400px) {
  :root {
    --ds: 1920;
  }
}@media (min-width: 1401px) and (max-width: 1920px) {
  :root {
    --ds: 1920;
  }
}html {
  font-size: 10px;
  font-family: "Microsoft JhengHei", "微軟正黑體", sans-serif;
  font-optical-sizing: auto;
}html.fixed {
  overflow: hidden;
}.modal {
  width: calc(958 / var(--ds) * var(--vw));
  margin: 0 auto;
}@media (max-width: 767px) {
  .modal {
    width: 100%;
  }
}.modal__content {
  width: calc(797 / var(--ds) * var(--vw));
  background: transparent url("../../images/modal-bg.jpg") no-repeat center top;
  background-size: 100% auto;
  padding-bottom: calc(80 / var(--ds) * var(--vw));
  margin: 0 auto;
  min-height: 480px;
  position: relative;
  padding-top: calc(30 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .modal__content {
    width: calc(504 / var(--ds) * var(--vw));
    padding-top: calc(60 / var(--ds) * var(--vw));
  }
}.modal__rule-title {
  display: flex;
  justify-content: center;
  margin: 0 auto;
}.modal__rule-title img {
  height: calc(80 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .modal__rule-title img {
    width: auto;
    height: calc(60 / var(--ds) * var(--vw));
  }
}.modal__btn-close {
  cursor: pointer;
  top: calc(30 / var(--ds) * var(--vw));
  right: calc(60 / var(--ds) * var(--vw));
  transform: scale(1);
  width: calc(60 / var(--ds) * var(--vw));
  height: calc(60 / var(--ds) * var(--vw));
  background: transparent url("../../images/modal-btn-close-bg.png") no-repeat 0 0;
  background-size: cover;
  position: absolute;
  font-size: 0;
  transition: all 0.3s ease-in-out;
}@media (hover: hover) {
  .modal__btn-close:hover {
    transform: scale(1.1);
  }
}@media (max-width: 767px) {
  .modal__btn-close {
    top: 0;
    right: calc(20 / var(--ds) * var(--vw));
  }
}.modal__text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  font-weight: bold;
}.rule-nav {
  display: flex;
  justify-content: center;
  padding: calc(20 / var(--ds) * var(--vw)) 0;
}@media (max-width: 767px) {
  .rule-nav {
    flex-direction: column;
    align-items: center;
  }
}.rule-nav__btn-rule-1 {
  width: calc(241 / var(--ds) * var(--vw));
  height: calc(94 / var(--ds) * var(--vw));
  background: transparent url("../../images/rule-btn-1.png") no-repeat 0 0;
  background-size: 100% auto;
  position: relative;
  font-size: 0;
  display: block;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
}.rule-nav__btn-rule-1::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rule-btn-1.png") no-repeat 0 100%;
  background-size: 100% auto;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .rule-nav__btn-rule-1:hover::after {
    opacity: 1;
  }
}.rule-nav__btn-rule-1.active {
  pointer-events: none;
}.rule-nav__btn-rule-1.active::after {
  opacity: 1;
}.rule-nav__btn-rule-2 {
  width: calc(241 / var(--ds) * var(--vw));
  height: calc(94 / var(--ds) * var(--vw));
  background: transparent url("../../images/rule-btn-2.png") no-repeat 0 0;
  background-size: 100% auto;
  position: relative;
  font-size: 0;
  display: block;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
}.rule-nav__btn-rule-2::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rule-btn-2.png") no-repeat 0 100%;
  background-size: 100% auto;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .rule-nav__btn-rule-2:hover::after {
    opacity: 1;
  }
}.rule-nav__btn-rule-2.active {
  pointer-events: none;
}.rule-nav__btn-rule-2.active::after {
  opacity: 1;
}.rule-nav__btn-rule-3 {
  width: calc(241 / var(--ds) * var(--vw));
  height: calc(94 / var(--ds) * var(--vw));
  background: transparent url("../../images/rule-btn-3.png") no-repeat 0 0;
  background-size: 100% auto;
  position: relative;
  font-size: 0;
  display: block;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
}.rule-nav__btn-rule-3::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rule-btn-3.png") no-repeat 0 100%;
  background-size: 100% auto;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .rule-nav__btn-rule-3:hover::after {
    opacity: 1;
  }
}.rule-nav__btn-rule-3.active {
  pointer-events: none;
}.rule-nav__btn-rule-3.active::after {
  opacity: 1;
}.rule {
  padding-left: calc(80 / var(--ds) * var(--vw));
  padding-right: calc(80 / var(--ds) * var(--vw));
  flex: 1;
}@media (max-width: 767px) {
  .rule {
    padding-left: calc(24 / var(--ds) * var(--vw));
    padding-right: calc(24 / var(--ds) * var(--vw));
  }
}.rule__title {
  display: flex;
  justify-content: center;
  margin: 0 auto;
}.rule__title img {
  height: calc(80 / var(--ds) * var(--vw));
}.rule__content {
  padding-top: calc(30 / var(--ds) * var(--vw));
  height: 100%;
}.rule__title-h2 {
  position: relative;
  padding: calc(12 / var(--ds) * var(--vw)) 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: calc(8 / var(--ds) * var(--vw));
}.rule__title-h2 p {
  position: relative;
  z-index: 0;
  color: #fff;
  font-size: calc(20 / var(--ds) * var(--vw));
}.rule__title-h2 p:nth-child(2) {
  text-align: left;
}.rule__title-h2::before {
  content: "";
  background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(98, 57, 28) 15%, rgb(98, 57, 28) 85%, rgb(255, 255, 255) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  mix-blend-mode: multiply;
  opacity: 0.5;
}.rule__text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  padding: calc(12 / var(--ds) * var(--vw)) 0;
  text-align: center;
  font-weight: bold;
}.rule__text.padding-vertical {
  padding: calc(40 / var(--ds) * var(--vw)) 0;
}.rule__remind-text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  padding: calc(200 / var(--ds) * var(--vw)) 0;
  text-align: center;
  font-weight: bold;
}.rule__ul-list {
  padding: calc(12 / var(--ds) * var(--vw)) 0 calc(12 / var(--ds) * var(--vw)) calc(32 / var(--ds) * var(--vw));
  list-style: disc;
}.rule__ul-list li {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  line-height: 1.6;
}.rule__ul-list li:not(:last-child) {
  padding-bottom: calc(8 / var(--ds) * var(--vw));
}.rule__ol-list {
  padding: calc(12 / var(--ds) * var(--vw)) 0 calc(12 / var(--ds) * var(--vw)) calc(32 / var(--ds) * var(--vw));
  list-style: decimal;
  margin-bottom: calc(40 / var(--ds) * var(--vw));
}.rule__ol-list li {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  line-height: 1.6;
}.rule__ol-list li strong {
  color: #e4c559;
}.rule__ol-list li:not(:last-child) {
  padding-bottom: calc(8 / var(--ds) * var(--vw));
}.rule__image-wrap {
  padding-top: calc(30 / var(--ds) * var(--vw));
}.rule__btn-prev {
  display: block;
  width: calc(268 / var(--ds) * var(--vw));
  height: calc(75 / var(--ds) * var(--vw));
  background: transparent url("../../images/btn-prev@2x.png") no-repeat 0 0;
  background-size: cover;
  margin: 0 auto;
  font-size: 0;
  transition: all 0.3s ease-in-out;
  filter: brightness(0.9);
}@media (hover: hover) {
  .rule__btn-prev:hover {
    translate: 0 -5%;
    filter: brightness(1);
  }
}@media (max-width: 767px) {
  .rule-flex-table.schedule .rule-flex-table__row span:nth-child(3) {
    display: none;
  }
}.rule-flex-table.mobile-schedule {
  display: none;
}@media (max-width: 767px) {
  .rule-flex-table.mobile-schedule {
    display: block;
    width: calc(400 / var(--ds) * var(--vw));
    margin: 0 auto;
  }
}.rule-flex-table__row {
  display: flex;
  padding: calc(8 / var(--ds) * var(--vw)) 0;
  position: relative;
}.rule-flex-table__row.bg::before {
  content: "";
  background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(98, 57, 28) 15%, rgb(98, 57, 28) 85%, rgb(255, 255, 255) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  mix-blend-mode: multiply;
  opacity: 0.5;
}.rule-flex-table__row span {
  position: relative;
  z-index: 10;
  flex: 1;
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  text-align: center;
}@media (max-width: 767px) {
  .rule-flex-table__row span {
    font-size: calc(16 / var(--ds) * var(--vw));
  }
}.rule-flex-table__row span br {
  display: none;
}@media (max-width: 767px) {
  .rule-flex-table__row span br {
    display: block;
  }
}.login {
  padding-top: calc(20 / var(--ds) * var(--vw));
}.login__form {
  display: grid;
  grid-template-columns: 20rem 1fr;
  width: calc(680 / var(--ds) * var(--vw));
  margin: 0 auto;
  gap: calc(10 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .login__form {
    width: calc(440 / var(--ds) * var(--vw));
    grid-template-columns: 12rem 1fr;
  }
}.login__form select {
  font-size: calc(18 / var(--ds) * var(--vw));
  padding: calc(10 / var(--ds) * var(--vw));
  color: #2b2b2b;
}@media (max-width: 767px) {
  .login__form select {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}.login__form input.pop_gid {
  font-size: calc(18 / var(--ds) * var(--vw));
  padding: calc(10 / var(--ds) * var(--vw));
  color: #2b2b2b;
  border: solid 4px transparent;
  outline: none;
  transition: all 0.3s ease-in-out;
}.login__form input.pop_gid:focus {
  border-color: #f9b345;
}@media (max-width: 767px) {
  .login__form input.pop_gid {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}.login__form input.pop_mob {
  font-size: calc(18 / var(--ds) * var(--vw));
  padding: calc(10 / var(--ds) * var(--vw));
  color: #2b2b2b;
  border: solid 4px transparent;
  outline: none;
  transition: all 0.3s ease-in-out;
}.login__form input.pop_mob:focus {
  border-color: #f9b345;
}@media (max-width: 767px) {
  .login__form input.pop_mob {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}.login__form input.pop_masid {
  grid-column: span 2;
  font-size: calc(18 / var(--ds) * var(--vw));
  padding: calc(10 / var(--ds) * var(--vw));
  color: #2b2b2b;
  border: solid 4px transparent;
  outline: none;
  transition: all 0.3s ease-in-out;
}.login__form input.pop_masid:focus {
  border-color: #f9b345;
}@media (max-width: 767px) {
  .login__form input.pop_masid {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}.login__form .check_pic {
  grid-column: span 2;
  display: flex;
  justify-content: center;
}.login__form .privacy_con {
  grid-column: span 2;
  display: flex;
  justify-content: center;
  gap: calc(12 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .login__form .privacy_con {
    align-items: flex-start;
  }
}.login__form .privacy_con p {
  font-size: calc(18 / var(--ds) * var(--vw));
  color: #fff;
}@media (max-width: 767px) {
  .login__form .privacy_con p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}.login__form .privacy_con p a {
  color: #4e95d8;
  font-weight: bold;
  text-decoration: none;
}.login__btn-login {
  grid-column: span 2;
  display: block;
  width: calc(268 / var(--ds) * var(--vw));
  height: calc(75 / var(--ds) * var(--vw));
  background: transparent url("../../images/btn-login@2x.png") no-repeat 0 0;
  background-size: cover;
  margin: 0 auto;
  font-size: 0;
  transition: all 0.3s ease-in-out;
  filter: brightness(0.9);
}@media (hover: hover) {
  .login__btn-login:hover {
    translate: 0 -5%;
    filter: brightness(1);
  }
}.login__notice {
  width: calc(680 / var(--ds) * var(--vw));
  margin: 0 auto;
  position: relative;
}@media (max-width: 767px) {
  .login__notice {
    width: calc(440 / var(--ds) * var(--vw));
  }
}.login__notice ul {
  flex: 1;
  list-style: disc;
  padding-left: calc(20 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .login__notice ul {
    margin-bottom: calc(40 / var(--ds) * var(--vw));
  }
}.login__notice ul li {
  color: #fff;
  font-size: calc(18 / var(--ds) * var(--vw));
  line-height: 1.6;
}.login__notice-title {
  color: #fff;
  font-size: calc(22 / var(--ds) * var(--vw));
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(8 / var(--ds) * var(--vw));
  margin-bottom: calc(24 / var(--ds) * var(--vw));
}.login__notice-title::before, .login__notice-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: #382211;
}.login__btn-notice {
  position: absolute;
  right: 0;
  top: calc(60 / var(--ds) * var(--vw));
  display: block;
  width: calc(161 / var(--ds) * var(--vw));
  height: calc(49 / var(--ds) * var(--vw));
  background: transparent url("../../images/btn-login-notice-bg@2x.png") no-repeat 0 0;
  background-size: cover;
  margin: 0 auto;
  font-size: 0;
  transition: all 0.3s ease-in-out;
  filter: brightness(0.9);
}@media (hover: hover) {
  .login__btn-notice:hover {
    translate: 0 -5%;
    filter: brightness(1);
  }
}@media (max-width: 767px) {
  .login__btn-notice {
    width: calc(230 / var(--ds) * var(--vw));
    height: calc(70 / var(--ds) * var(--vw));
    filter: brightness(1);
    position: relative;
    right: initial;
    top: initial;
  }
}.prize__content {
  padding-top: calc(30 / var(--ds) * var(--vw));
  height: 100%;
}.prize__title-h2 {
  position: relative;
  padding: calc(12 / var(--ds) * var(--vw)) 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: calc(8 / var(--ds) * var(--vw));
  font-size: calc(24 / var(--ds) * var(--vw));
  color: #fff;
}.prize__image {
  width: calc(150 / var(--ds) * var(--vw));
  padding-top: calc(40 / var(--ds) * var(--vw));
  margin: 0 auto;
}.user-data__title-h2 {
  position: relative;
  padding: calc(12 / var(--ds) * var(--vw)) 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: calc(8 / var(--ds) * var(--vw));
  color: #fff;
  font-size: calc(20 / var(--ds) * var(--vw));
}.user-data__text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  padding: calc(12 / var(--ds) * var(--vw)) 0;
  text-align: center;
  font-weight: bold;
  position: relative;
}.user-data__text::before {
  content: "";
  background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(98, 57, 28) 15%, rgb(98, 57, 28) 85%, rgb(255, 255, 255) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  mix-blend-mode: multiply;
  opacity: 0.5;
}.user-data__remind-text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  padding: calc(40 / var(--ds) * var(--vw)) 0;
  text-align: center;
  font-weight: bold;
}.user-data__btn-confirm {
  cursor: pointer;
  display: block;
  width: calc(268 / var(--ds) * var(--vw));
  height: calc(75 / var(--ds) * var(--vw));
  background: transparent url("../../images/btn-confirm@2x.png") no-repeat 0 0;
  background-size: cover;
  margin: 0 auto;
  font-size: 0;
  transition: all 0.3s ease-in-out;
  filter: brightness(0.9);
}@media (hover: hover) {
  .user-data__btn-confirm:hover {
    translate: 0 -5%;
    filter: brightness(1);
  }
}.section-rules {
  width: 100%;
  aspect-ratio: 1920/1080;
  background: #000 url("../../images/section-rules-bg.jpg") no-repeat center top;
  background-size: cover;
  position: relative;
}@media (max-width: 767px) {
  .section-rules {
    background-image: url("../../images/section-rules-bg-m@2x.jpg");
    background-size: cover;
    aspect-ratio: 480/882;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules {
    background-image: url("../../images/section-rules-bg-p.jpg");
    background-size: cover;
    aspect-ratio: 992/1334;
  }
}.section-rules__main-title {
  width: calc(846 / var(--ds) * var(--vw));
  position: absolute;
  left: 50%;
  top: 50%;
  translate: -50% -62%;
  scale: 1;
  animation: light 1.2s ease-in-out infinite;
  transform-origin: center center;
}@media (max-width: 767px) {
  .section-rules__main-title {
    width: calc(510 / var(--ds) * var(--vw));
    translate: -50% -41%;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__main-title {
    width: calc(1106 / var(--ds) * var(--vw));
    translate: -50% -63%;
  }
}.section-rules__sub-title {
  width: calc(606 / var(--ds) * var(--vw));
  position: absolute;
  left: 50%;
  top: 50%;
  translate: -50% 240%;
  transform-origin: center center;
}@media (max-width: 767px) {
  .section-rules__sub-title {
    width: calc(370 / var(--ds) * var(--vw));
    translate: -50% 370%;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__sub-title {
    width: calc(806 / var(--ds) * var(--vw));
    translate: -50% 220%;
  }
}.section-rules__nav {
  display: flex;
  justify-content: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, 280%, 0);
}@media (max-width: 767px) {
  .section-rules__nav {
    flex-wrap: wrap;
    width: 100%;
    transform: translate3d(-50%, 130%, 0);
    gap: 0;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__nav {
    width: calc(740 / var(--ds) * var(--vw));
    flex-wrap: wrap;
    gap: calc(12 / var(--ds) * var(--vw)) calc(56 / var(--ds) * var(--vw));
    transform: translate3d(-50%, 130%, 0);
  }
}.section-rules__btn-legion {
  width: calc(245 / var(--ds) * var(--vw));
  height: calc(98 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-rules__btn-legion {
    width: calc(240 / var(--ds) * var(--vw));
    height: calc(96 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__btn-legion {
    width: calc(340 / var(--ds) * var(--vw));
    height: calc(130 / var(--ds) * var(--vw));
  }
}.section-rules__btn-legion::before, .section-rules__btn-legion::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rules-legion@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-rules__btn-legion::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-rules__btn-legion:hover {
    scale: 1.05;
  }
  .section-rules__btn-legion:hover::after {
    opacity: 1;
  }
}.section-rules__btn-daily {
  width: calc(245 / var(--ds) * var(--vw));
  height: calc(98 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-rules__btn-daily {
    width: calc(240 / var(--ds) * var(--vw));
    height: calc(96 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__btn-daily {
    width: calc(340 / var(--ds) * var(--vw));
    height: calc(130 / var(--ds) * var(--vw));
  }
}.section-rules__btn-daily::before, .section-rules__btn-daily::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rules-daily@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-rules__btn-daily::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-rules__btn-daily:hover {
    scale: 1.05;
  }
  .section-rules__btn-daily:hover::after {
    opacity: 1;
  }
}.section-rules__btn-award {
  width: calc(245 / var(--ds) * var(--vw));
  height: calc(98 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-rules__btn-award {
    width: calc(240 / var(--ds) * var(--vw));
    height: calc(96 / var(--ds) * var(--vw));
    margin-top: calc(-12 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__btn-award {
    width: calc(340 / var(--ds) * var(--vw));
    height: calc(130 / var(--ds) * var(--vw));
  }
}.section-rules__btn-award::before, .section-rules__btn-award::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rules-award@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-rules__btn-award::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-rules__btn-award:hover {
    scale: 1.05;
  }
  .section-rules__btn-award:hover::after {
    opacity: 1;
  }
}.section-rules__btn-schedule {
  width: calc(245 / var(--ds) * var(--vw));
  height: calc(98 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  margin: 0 calc(-6 / var(--ds) * var(--vw));
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-rules__btn-schedule {
    width: calc(240 / var(--ds) * var(--vw));
    height: calc(96 / var(--ds) * var(--vw));
    margin-top: calc(-12 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-rules__btn-schedule {
    width: calc(340 / var(--ds) * var(--vw));
    height: calc(130 / var(--ds) * var(--vw));
  }
}.section-rules__btn-schedule::before, .section-rules__btn-schedule::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/rules-schedule@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-rules__btn-schedule::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-rules__btn-schedule:hover {
    scale: 1.05;
  }
  .section-rules__btn-schedule:hover::after {
    opacity: 1;
  }
}@keyframes light {
  0%, 100% {
    filter: brightness(1);
    scale: 1;
  }
  50% {
    filter: brightness(1.5);
    scale: 1.01;
  }
}.section-legion {
  width: 100%;
  aspect-ratio: 1920/1246;
  background: transparent url("../../images/section-legion-bg.png") no-repeat center top;
  background-size: cover;
  position: relative;
  margin-top: calc(-73 / var(--ds) * var(--vw));
  z-index: 10;
}@media (max-width: 767px) {
  .section-legion {
    aspect-ratio: 960/2249;
    background-image: url("../../images/section-legion-bg-m@2x.png");
    background-size: cover;
    margin-top: calc(-24 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion {
    aspect-ratio: 992/1493;
    background-image: url("../../images/section-legion-bg-p.png");
    background-size: cover;
    margin-top: calc(-90 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}.section-legion__inner {
  width: calc(980 / var(--ds) * var(--vw));
  margin: 0 auto;
  padding-top: calc(205 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-legion__inner {
    width: 100%;
    padding-top: calc(100 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__inner {
    width: calc(1180 / var(--ds) * var(--vw));
    padding-top: calc(190 / var(--ds) * var(--vw));
  }
}.section-legion__title {
  width: calc(588 / var(--ds) * var(--vw));
  margin: 0 auto calc(20 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-legion__title {
    width: calc(496 / var(--ds) * var(--vw));
    margin-bottom: 0;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__title {
    width: calc(818 / var(--ds) * var(--vw));
    margin-bottom: 0;
  }
}.section-legion__text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
}.section-legion__text br {
  display: none;
}@media (max-width: 767px) {
  .section-legion__text {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
  .section-legion__text br {
    display: block;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__text {
    font-size: calc(44 / var(--ds) * var(--vw));
  }
}.section-legion__form {
  width: calc(640 / var(--ds) * var(--vw));
  padding-top: calc(280 / var(--ds) * var(--vw));
  display: flex;
  flex-direction: column;
  gap: calc(10 / var(--ds) * var(--vw));
  margin: 0 auto;
}@media (max-width: 767px) {
  .section-legion__form {
    width: 100%;
    padding: calc(200 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw)) 0 calc(20 / var(--ds) * var(--vw));
    gap: calc(30 / var(--ds) * var(--vw));
    box-sizing: border-box;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__form {
    padding-top: calc(720 / var(--ds) * var(--vw));
    width: calc(900 / var(--ds) * var(--vw));
    gap: calc(30 / var(--ds) * var(--vw));
  }
}.section-legion__input {
  display: block;
  padding: calc(8 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #2b2b2b;
  font-weight: bold;
}@media (max-width: 767px) {
  .section-legion__input {
    font-size: calc(20 / var(--ds) * var(--vw));
    padding: calc(16 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__input {
    font-size: calc(44 / var(--ds) * var(--vw));
    padding: calc(16 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
  }
}.section-legion__input:focus {
  outline: none;
}.section-legion__input::placeholder {
  color: #aaa;
  font-weight: bold;
}.section-legion__nav {
  padding-top: calc(40 / var(--ds) * var(--vw));
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(20 / var(--ds) * var(--vw));
  position: relative;
}@media (max-width: 767px) {
  .section-legion__nav {
    padding-top: calc(80 / var(--ds) * var(--vw));
    justify-content: space-between;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__nav {
    justify-content: space-between;
    padding-top: 0;
    padding-left: calc(20 / var(--ds) * var(--vw));
    padding-right: calc(20 / var(--ds) * var(--vw));
  }
}.section-legion__btn-rules {
  width: calc(162 / var(--ds) * var(--vw));
  height: calc(63 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-legion__btn-rules {
    width: calc(210 / var(--ds) * var(--vw));
    height: calc(82 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__btn-rules {
    width: calc(280 / var(--ds) * var(--vw));
    height: calc(109 / var(--ds) * var(--vw));
  }
}.section-legion__btn-rules::before, .section-legion__btn-rules::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-legion-btn-rules@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-legion__btn-rules::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-legion__btn-rules:hover {
    scale: 1.1;
  }
  .section-legion__btn-rules:hover::after {
    opacity: 1;
  }
}.section-legion__btn-signup {
  cursor: pointer;
  width: calc(274 / var(--ds) * var(--vw));
  height: calc(81 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  background: transparent;
  transition: all 0.3s;
  transform-origin: 50%;
}@media (max-width: 767px) {
  .section-legion__btn-signup {
    position: absolute;
    left: 50%;
    top: 0;
    width: calc(350 / var(--ds) * var(--vw));
    height: calc(103 / var(--ds) * var(--vw));
    translate: -50% -20%;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__btn-signup {
    position: absolute;
    left: 50%;
    top: 0;
    width: calc(470 / var(--ds) * var(--vw));
    height: calc(138 / var(--ds) * var(--vw));
    translate: -50% 80%;
  }
}.section-legion__btn-signup::before, .section-legion__btn-signup::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-legion-btn-signup@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-legion__btn-signup::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-legion__btn-signup:hover {
    scale: 1.1;
  }
  .section-legion__btn-signup:hover::after {
    opacity: 1;
  }
}.section-legion__btn-notice {
  width: calc(162 / var(--ds) * var(--vw));
  height: calc(63 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  transition: scale 0.3s;
}@media (max-width: 767px) {
  .section-legion__btn-notice {
    width: calc(210 / var(--ds) * var(--vw));
    height: calc(82 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-legion__btn-notice {
    width: calc(280 / var(--ds) * var(--vw));
    height: calc(109 / var(--ds) * var(--vw));
  }
}.section-legion__btn-notice::before, .section-legion__btn-notice::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-legion-btn-notice@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-legion__btn-notice::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-legion__btn-notice:hover {
    scale: 1.1;
  }
  .section-legion__btn-notice:hover::after {
    opacity: 1;
  }
}.section-daily {
  width: 100%;
  aspect-ratio: 1920/1169;
  background: transparent url("../../images/section-daily-bg.png") no-repeat center top;
  background-size: cover;
  position: relative;
  margin-top: calc(-73 / var(--ds) * var(--vw));
  z-index: 5;
}@media (max-width: 767px) {
  .section-daily {
    aspect-ratio: 960/2100;
    background-image: url("../../images/section-daily-bg-m@2x.png");
    background-size: cover;
    margin-top: calc(-55 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily {
    aspect-ratio: 960/1382;
    background-image: url("../../images/section-daily-bg-p.png");
    background-size: cover;
    margin-top: calc(-90 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}.section-daily__inner {
  width: calc(980 / var(--ds) * var(--vw));
  margin: 0 auto;
  padding-top: calc(194 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__inner {
    width: 100%;
    padding-top: calc(142 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__inner {
    width: calc(1180 / var(--ds) * var(--vw));
    padding-top: calc(200 / var(--ds) * var(--vw));
  }
}.section-daily__title {
  width: calc(442 / var(--ds) * var(--vw));
  margin: 0 auto calc(10 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__title {
    width: calc(387 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__title {
    width: calc(640 / var(--ds) * var(--vw));
  }
}.section-daily__text {
  font-size: calc(20 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
}.section-daily__text br {
  display: none;
}@media (max-width: 767px) {
  .section-daily__text {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
  .section-daily__text br {
    display: block;
  }
  .section-daily__text br:nth-child(1) {
    display: none;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__text {
    width: calc(840 / var(--ds) * var(--vw));
    margin: 0 auto;
    font-size: calc(44 / var(--ds) * var(--vw));
  }
}.section-daily__game {
  width: calc(980 / var(--ds) * var(--vw));
  margin: 0 auto;
  padding-top: calc(44 / var(--ds) * var(--vw));
  padding-left: calc(296 / var(--ds) * var(--vw));
  display: flex;
  gap: calc(16 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__game {
    width: 100%;
    padding-top: calc(55 / var(--ds) * var(--vw));
    padding-left: calc(64 / var(--ds) * var(--vw));
    gap: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__game {
    width: calc(1130 / var(--ds) * var(--vw));
    padding-top: calc(60 / var(--ds) * var(--vw));
    padding-left: calc(50 / var(--ds) * var(--vw));
    padding-right: calc(20 / var(--ds) * var(--vw));
    gap: calc(50 / var(--ds) * var(--vw));
  }
}.section-daily__card-wrap {
  width: calc(384 / var(--ds) * var(--vw));
  aspect-ratio: 1/1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1fr);
}@media (max-width: 767px) {
  .section-daily__card-wrap {
    width: calc(312 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__card-wrap {
    width: calc(800 / var(--ds) * var(--vw));
  }
}.section-daily__card {
  width: calc(96 / var(--ds) * var(--vw));
  height: calc(96 / var(--ds) * var(--vw));
  position: relative;
}@media (max-width: 767px) {
  .section-daily__card {
    width: calc(78 / var(--ds) * var(--vw));
    height: calc(78 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__card {
    width: calc(200 / var(--ds) * var(--vw));
    height: calc(200 / var(--ds) * var(--vw));
  }
}.section-daily__card.active .section-daily__front {
  transform: rotateY(-540deg);
}.section-daily__card.active .section-daily__back {
  transform: rotateY(0deg);
}.section-daily__card:nth-child(1) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-1@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(2) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-2@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(3) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-3@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(4) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-4@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(5) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-5@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(6) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-6@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(7) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-7@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(8) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-8@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(9) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-9@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(10) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-10@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(11) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-11@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(12) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-12@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(13) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-13@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(14) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-14@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(15) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-15@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__card:nth-child(16) .section-daily__back {
  background: transparent url("../../images/section-daily-card-on-16@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__front, .section-daily__back {
  background-position: center;
  background-size: cover;
  text-align: center;
  justify-content: center;
  align-items: center;
  position: absolute;
  height: 100%;
  width: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transition: ease-in-out 600ms;
  overflow: hidden;
  color: #fff;
}.section-daily__front {
  background: transparent url("../../images/section-daily-card-off@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__back {
  z-index: -1;
  transform: rotateY(540deg);
}.section-daily__prize-wrap {
  width: calc(94 / var(--ds) * var(--vw));
  display: flex;
  flex-direction: column;
  gap: calc(2 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__prize-wrap {
    width: calc(74 / var(--ds) * var(--vw));
    gap: calc(4 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__prize-wrap {
    width: calc(190 / var(--ds) * var(--vw));
    gap: calc(10 / var(--ds) * var(--vw));
  }
}.section-daily__prize {
  width: calc(94 / var(--ds) * var(--vw));
  height: calc(94 / var(--ds) * var(--vw));
  position: relative;
}.section-daily__prize:nth-child(1) {
  background: transparent url("../../images/section-daily-card-prize-1@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__prize:nth-child(2) {
  background: transparent url("../../images/section-daily-card-prize-2@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__prize:nth-child(3) {
  background: transparent url("../../images/section-daily-card-prize-3@2x.png") no-repeat 0 0;
  background-size: cover;
}.section-daily__prize:nth-child(4) {
  background: transparent url("../../images/section-daily-card-prize-4@2x.png") no-repeat 0 0;
  background-size: cover;
}@media (max-width: 767px) {
  .section-daily__prize {
    width: calc(75 / var(--ds) * var(--vw));
    height: calc(75 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__prize {
    width: calc(190 / var(--ds) * var(--vw));
    height: calc(190 / var(--ds) * var(--vw));
  }
}.section-daily__prize::after {
  width: calc(46 / var(--ds) * var(--vw));
  height: calc(46 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-daily-card-complete@2x.png");
  background-size: cover;
  position: absolute;
  content: "";
  right: 0;
  top: 0;
  opacity: 0;
  scale: 1.6;
  rotate: 180deg;
  transition: all 0.3s;
  pointer-events: none;
}@media (max-width: 767px) {
  .section-daily__prize::after {
    width: calc(56 / var(--ds) * var(--vw));
    height: calc(56 / var(--ds) * var(--vw));
  }
}.section-daily__prize.active::after {
  opacity: 1;
  scale: 1;
  rotate: 0;
}.section-daily__nav {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: calc(40 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__nav {
    padding-top: calc(30 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__nav {
    padding-top: calc(60 / var(--ds) * var(--vw));
  }
}.section-daily__btn-check {
  cursor: pointer;
  width: calc(274 / var(--ds) * var(--vw));
  height: calc(81 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  background: transparent;
  transition: scale 0.3s;
  margin-left: 0;
  margin-right: 0;
}@media (max-width: 767px) {
  .section-daily__btn-check {
    width: calc(350 / var(--ds) * var(--vw));
    height: calc(103 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__btn-check {
    width: calc(500 / var(--ds) * var(--vw));
    height: calc(146 / var(--ds) * var(--vw));
  }
}.section-daily__btn-check::before, .section-daily__btn-check::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-daily-btn-check@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-daily__btn-check::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-daily__btn-check:hover {
    scale: 1.1;
  }
  .section-daily__btn-check:hover::after {
    opacity: 1;
  }
}.section-daily__btn-notice {
  width: calc(162 / var(--ds) * var(--vw));
  height: calc(63 / var(--ds) * var(--vw));
  position: absolute;
  display: block;
  font-size: 0;
  transition: scale 0.3s;
  right: calc(180 / var(--ds) * var(--vw));
  top: calc(45 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__btn-notice {
    width: calc(211 / var(--ds) * var(--vw));
    height: calc(82 / var(--ds) * var(--vw));
    right: calc(20 / var(--ds) * var(--vw));
    transform: translate3d(0, 100%, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__btn-notice {
    width: calc(256 / var(--ds) * var(--vw));
    height: calc(100 / var(--ds) * var(--vw));
    top: calc(80 / var(--ds) * var(--vw));
    right: 0;
  }
}.section-daily__btn-notice::before, .section-daily__btn-notice::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-legion-btn-notice@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-daily__btn-notice::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-daily__btn-notice:hover {
    scale: 1.1;
  }
  .section-daily__btn-notice:hover::after {
    opacity: 1;
  }
}.section-daily__btn-search {
  width: calc(189 / var(--ds) * var(--vw));
  height: calc(62 / var(--ds) * var(--vw));
  position: absolute;
  display: block;
  font-size: 0;
  transition: scale 0.3s;
  left: calc(150 / var(--ds) * var(--vw));
  top: calc(45 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-daily__btn-search {
    width: calc(250 / var(--ds) * var(--vw));
    height: calc(82 / var(--ds) * var(--vw));
    left: calc(20 / var(--ds) * var(--vw));
    transform: translate3d(0, 100%, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-daily__btn-search {
    width: calc(305 / var(--ds) * var(--vw));
    height: calc(100 / var(--ds) * var(--vw));
    top: calc(80 / var(--ds) * var(--vw));
    left: 0;
  }
}.section-daily__btn-search::before, .section-daily__btn-search::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-daily-btn-search@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-daily__btn-search::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-daily__btn-search:hover {
    scale: 1.1;
  }
  .section-daily__btn-search:hover::after {
    opacity: 1;
  }
}.section-award {
  width: 100%;
  aspect-ratio: 1920/1232;
  background: transparent url("../../images/section-award-bg.png") no-repeat center top;
  background-size: cover;
  position: relative;
  margin-top: calc(-91 / var(--ds) * var(--vw));
  z-index: 2;
}@media (max-width: 767px) {
  .section-award {
    aspect-ratio: 960/6433;
    background-image: url("../../images/section-award-bg-m@2x.png");
    background-size: cover;
    margin-top: calc(-76 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award {
    aspect-ratio: 992/2132;
    background-image: url("../../images/section-award-bg-p.png");
    background-size: cover;
    margin-top: calc(-100 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}.section-award__inner {
  width: calc(980 / var(--ds) * var(--vw));
  margin: 0 auto;
  padding-top: calc(70 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__inner {
    width: 100%;
    padding-top: calc(116 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__inner {
    padding-top: calc(107 / var(--ds) * var(--vw));
  }
}.section-award__title {
  width: calc(497 / var(--ds) * var(--vw));
  margin: 0 auto calc(10 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__title {
    width: calc(424 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__title {
    width: calc(708 / var(--ds) * var(--vw));
  }
}.section-award__1st {
  width: calc(819 / var(--ds) * var(--vw));
  height: calc(631 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-award-1st.png") no-repeat center top;
  background-size: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -83%, 0);
  padding-top: calc(380 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__1st {
    width: calc(1049 / var(--ds) * var(--vw));
    height: calc(808 / var(--ds) * var(--vw));
    transform: translate3d(-50%, -198%, 0);
    padding-top: calc(486 / var(--ds) * var(--vw));
    z-index: 10;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__1st {
    width: calc(1360 / var(--ds) * var(--vw));
    height: calc(1048 / var(--ds) * var(--vw));
    transform: translate3d(-50%, -129%, 0);
    padding-top: calc(640 / var(--ds) * var(--vw));
  }
}.section-award__1st p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  line-height: 1.5;
}@media (max-width: 767px) {
  .section-award__1st p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__1st p {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-award__2nd {
  width: calc(518 / var(--ds) * var(--vw));
  height: calc(626 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-award-2nd.png") no-repeat center top;
  background-size: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(37%, -78%, 0);
  padding-top: calc(380 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__2nd {
    width: calc(658 / var(--ds) * var(--vw));
    height: calc(794 / var(--ds) * var(--vw));
    transform: translate3d(-50%, -120%, 0);
    padding-top: calc(480 / var(--ds) * var(--vw));
    z-index: 5;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__2nd {
    width: calc(820 / var(--ds) * var(--vw));
    height: calc(989 / var(--ds) * var(--vw));
    transform: translate3d(-4%, -53%, 0);
    padding-top: calc(600 / var(--ds) * var(--vw));
    z-index: 5;
  }
}.section-award__2nd p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  line-height: 1.5;
}@media (max-width: 767px) {
  .section-award__2nd p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__2nd p {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-award__3rd {
  width: calc(518 / var(--ds) * var(--vw));
  height: calc(626 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-award-3rd.png") no-repeat center top;
  background-size: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-138%, -78%, 0);
  padding-top: calc(380 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__3rd {
    width: calc(658 / var(--ds) * var(--vw));
    height: calc(794 / var(--ds) * var(--vw));
    transform: translate3d(-50%, -37%, 0);
    padding-top: calc(480 / var(--ds) * var(--vw));
    z-index: 5;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__3rd {
    width: calc(820 / var(--ds) * var(--vw));
    height: calc(989 / var(--ds) * var(--vw));
    transform: translate3d(-95%, -53%, 0);
    padding-top: calc(600 / var(--ds) * var(--vw));
    z-index: 5;
  }
}.section-award__3rd p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  line-height: 1.5;
}@media (max-width: 767px) {
  .section-award__3rd p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__3rd p {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-award__4th {
  width: calc(421 / var(--ds) * var(--vw));
  height: calc(370 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-award-4th.png") no-repeat center top;
  background-size: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(3%, 37%, 0);
  padding-top: calc(160 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__4th {
    width: calc(530 / var(--ds) * var(--vw));
    height: calc(466 / var(--ds) * var(--vw));
    transform: translate3d(-50%, 118%, 0);
    padding-top: calc(220 / var(--ds) * var(--vw));
    z-index: 5;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__4th {
    width: calc(690 / var(--ds) * var(--vw));
    height: calc(606 / var(--ds) * var(--vw));
    transform: translate3d(1%, 90%, 0);
    padding-top: calc(290 / var(--ds) * var(--vw));
    z-index: 5;
  }
}.section-award__4th p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  line-height: 1.5;
}@media (max-width: 767px) {
  .section-award__4th p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__4th p {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-award__top-15 {
  width: calc(421 / var(--ds) * var(--vw));
  height: calc(370 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-award-top-15.png") no-repeat center top;
  background-size: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-103%, 37%, 0);
  padding-top: calc(160 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-award__top-15 {
    width: calc(530 / var(--ds) * var(--vw));
    height: calc(466 / var(--ds) * var(--vw));
    transform: translate3d(-50%, 228%, 0);
    padding-top: calc(220 / var(--ds) * var(--vw));
    z-index: 5;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__top-15 {
    width: calc(690 / var(--ds) * var(--vw));
    height: calc(606 / var(--ds) * var(--vw));
    transform: translate3d(-101%, 90%, 0);
    padding-top: calc(290 / var(--ds) * var(--vw));
    z-index: 5;
  }
}.section-award__top-15 p {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  text-align: center;
  line-height: 1.5;
}@media (max-width: 767px) {
  .section-award__top-15 p {
    font-size: calc(20 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__top-15 p {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-award__nav {
  width: calc(1170 / var(--ds) * var(--vw));
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate3d(-50%, -260%, 0);
}@media (max-width: 767px) {
  .section-award__nav {
    transform: translate3d(-50%, -102%, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__nav {
    transform: translate3d(-50%, 150%, 0);
  }
}.section-award__btn-notice {
  width: calc(162 / var(--ds) * var(--vw));
  height: calc(63 / var(--ds) * var(--vw));
  position: relative;
  display: block;
  font-size: 0;
  transition: scale 0.3s;
  margin-right: 0;
  margin-left: auto;
}@media (max-width: 767px) {
  .section-award__btn-notice {
    margin-right: auto;
    margin-left: auto;
    width: calc(240 / var(--ds) * var(--vw));
    height: calc(93 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-award__btn-notice {
    width: calc(320 / var(--ds) * var(--vw));
    height: calc(125 / var(--ds) * var(--vw));
    margin-right: auto;
    margin-left: auto;
  }
}.section-award__btn-notice::before, .section-award__btn-notice::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent url("../../images/section-legion-btn-notice@2x.png") no-repeat 0 0;
  background-size: 100% auto;
}.section-award__btn-notice::after {
  opacity: 0;
  background-position: 0 100%;
  transition: opacity 0.3s;
}@media (hover: hover) {
  .section-award__btn-notice:hover {
    scale: 1.1;
  }
  .section-award__btn-notice:hover::after {
    opacity: 1;
  }
}.section-schedule {
  width: 100%;
  aspect-ratio: 1920/1600;
  background: transparent url("../../images/section-schedule-bg.jpg") no-repeat center top;
  background-size: cover;
  position: relative;
  margin-top: calc(-91 / var(--ds) * var(--vw));
  z-index: 0;
}@media (max-width: 767px) {
  .section-schedule {
    aspect-ratio: 960/3700;
    background-image: url("../../images/section-schedule-bg-m@2x.jpg");
    background-size: cover;
    margin-top: calc(-76 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule {
    aspect-ratio: 992/1596;
    background-image: url("../../images/section-schedule-bg-p.jpg");
    background-size: cover;
    margin-top: calc(-64 / var(--ds) * var(--vw));
    overflow: hidden;
  }
}.section-schedule__inner {
  width: calc(1260 / var(--ds) * var(--vw));
  margin: 0 auto;
  padding-top: calc(120 / var(--ds) * var(--vw));
}@media (max-width: 767px) {
  .section-schedule__inner {
    width: 100%;
    padding-top: calc(110 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__inner {
    padding-top: calc(230 / var(--ds) * var(--vw));
  }
}.section-schedule__title {
  width: calc(397 / var(--ds) * var(--vw));
  margin: 0 auto;
}@media (max-width: 767px) {
  .section-schedule__title {
    width: calc(350 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__title {
    width: calc(568 / var(--ds) * var(--vw));
  }
}.section-schedule__1st {
  width: calc(277 / var(--ds) * var(--vw));
  height: calc(277 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-schedule-1st@2x.png") no-repeat 0 0;
  background-size: cover;
  margin: 0 auto;
  position: relative;
}@media (max-width: 767px) {
  .section-schedule__1st {
    width: calc(300 / var(--ds) * var(--vw));
    height: calc(300 / var(--ds) * var(--vw));
    position: relative;
    transform: translate3d(0, 0, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__1st {
    width: calc(400 / var(--ds) * var(--vw));
    height: calc(400 / var(--ds) * var(--vw));
    position: relative;
    transform: translate3d(0, -2%, 0);
  }
}.section-schedule__1st img {
  width: auto;
  height: calc(35 / var(--ds) * var(--vw));
  display: block;
  margin: 0 auto;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate3d(-50%, -200%, 0);
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__1st img {
    height: calc(50 / var(--ds) * var(--vw));
  }
}.section-schedule__top-4 {
  padding-top: calc(60 / var(--ds) * var(--vw));
  position: relative;
  z-index: 10;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4 {
    padding-top: calc(70 / var(--ds) * var(--vw));
  }
}.section-schedule__top-4-title {
  width: calc(632 / var(--ds) * var(--vw));
  height: calc(67 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-schedule-title-top-4-line@2x.png") no-repeat center top;
  background-size: cover;
  margin: 0 auto;
  position: relative;
}@media (max-width: 767px) {
  .section-schedule__top-4-title {
    width: calc(234 / var(--ds) * var(--vw));
    height: calc(72 / var(--ds) * var(--vw));
    background-image: url("../../images/section-schedule-title-top-4-line-m@2x.png");
    background-size: cover;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4-title {
    width: calc(882 / var(--ds) * var(--vw));
    height: calc(95 / var(--ds) * var(--vw));
    background-image: url("../../images/section-schedule-title-top-4-line-p.png");
    background-size: cover;
  }
}.section-schedule__top-4-title img {
  width: calc(121 / var(--ds) * var(--vw));
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate3d(-50%, -50%, 0);
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4-title img {
    width: calc(170 / var(--ds) * var(--vw));
  }
}.section-schedule__top-4-wrap {
  display: flex;
  justify-content: center;
  position: relative;
  transform: translate3d(0, -16%, 0);
}@media (max-width: 767px) {
  .section-schedule__top-4-wrap {
    flex-wrap: wrap;
    transform: translate3d(0, -8%, 0);
  }
}.section-schedule__top-4-card {
  width: calc(211 / var(--ds) * var(--vw));
  height: calc(114 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-schedule-title-top-4-bg@2x.png") no-repeat center top;
  background-size: cover;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}@media (max-width: 767px) {
  .section-schedule__top-4-card {
    width: calc(230 / var(--ds) * var(--vw));
    height: calc(124 / var(--ds) * var(--vw));
  }
  .section-schedule__top-4-card:nth-child(3), .section-schedule__top-4-card:nth-child(4) {
    transform: translate3d(0, -12%, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4-card {
    width: calc(300 / var(--ds) * var(--vw));
    height: calc(162 / var(--ds) * var(--vw));
  }
}.section-schedule__top-4-serve {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0.1rem 0.2rem #000;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4-serve {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-schedule__top-4-team {
  font-size: calc(22 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0.1rem 0.2rem #000;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-4-team {
    font-size: calc(32 / var(--ds) * var(--vw));
  }
}.section-schedule__top-15 {
  transform: translate3d(0, -17%, 0);
  position: relative;
  z-index: 5;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15 {
    transform: translate3d(0, -14%, 0);
  }
}.section-schedule__top-15-title {
  width: calc(1047 / var(--ds) * var(--vw));
  height: calc(136 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-schedule-title-top-15-line@2x.png") no-repeat center top;
  background-size: cover;
  margin: 0 auto;
  position: relative;
}@media (max-width: 767px) {
  .section-schedule__top-15-title {
    width: calc(367 / var(--ds) * var(--vw));
    height: calc(187 / var(--ds) * var(--vw));
    background-image: url("../../images/section-schedule-title-top-15-line-m@2x.png");
    background-size: cover;
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-title {
    width: calc(1032 / var(--ds) * var(--vw));
    height: calc(192 / var(--ds) * var(--vw));
    background-image: url("../../images/section-schedule-title-top-15-line-p@2x.png");
    background-size: cover;
  }
}.section-schedule__top-15-title img {
  width: calc(175 / var(--ds) * var(--vw));
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate3d(-50%, 105%, 0);
}@media (max-width: 767px) {
  .section-schedule__top-15-title img {
    transform: translate3d(-50%, 120%, 0);
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-title img {
    width: calc(246 / var(--ds) * var(--vw));
  }
}.section-schedule__top-15-wrap {
  display: flex;
  justify-content: center;
  position: relative;
  transform: translate3d(0, 0, 0);
  flex-wrap: wrap;
  gap: calc(26 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
  transform: translate3d(0, 5%, 0);
}@media (max-width: 767px) {
  .section-schedule__top-15-wrap {
    transform: translate3d(0, -7%, 0);
    gap: calc(10 / var(--ds) * var(--vw)) calc(8 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-wrap {
    transform: translate3d(0, 2%, 0);
    gap: calc(36 / var(--ds) * var(--vw)) calc(20 / var(--ds) * var(--vw));
  }
}.section-schedule__top-15-card {
  width: calc(186 / var(--ds) * var(--vw));
  height: calc(89 / var(--ds) * var(--vw));
  background: transparent url("../../images/section-schedule-title-top-15-bg@2x.png") no-repeat center top;
  background-size: cover;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}@media (max-width: 767px) {
  .section-schedule__top-15-card {
    width: calc(160 / var(--ds) * var(--vw));
    height: calc(77 / var(--ds) * var(--vw));
  }
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-card {
    width: calc(270 / var(--ds) * var(--vw));
    height: calc(129 / var(--ds) * var(--vw));
  }
}.section-schedule__top-15-serve {
  font-size: calc(16 / var(--ds) * var(--vw));
  color: #e0bf8f;
  font-weight: bold;
  text-shadow: 0 0.1rem 0.2rem #000;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-serve {
    font-size: calc(24 / var(--ds) * var(--vw));
  }
}.section-schedule__top-15-team {
  font-size: calc(22 / var(--ds) * var(--vw));
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0.1rem 0.2rem #000;
}@media (min-width: 768px) and (max-width: 992px) {
  .section-schedule__top-15-team {
    font-size: calc(32 / var(--ds) * var(--vw));
  }
}