@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

body {
  overflow-x: hidden;
  position: relative;
}
@media screen and (min-width: 768px) {
  body {
    background: url(../images/pc/pc_bg.jpg) no-repeat center top/cover;
    background-attachment: fixed;
  }
}
@media screen and (max-width: 767px) {
  body {
    background: url(../images/sp/sp_bg.jpg) no-repeat center top/cover;
    background-attachment: scroll;
  }
}

@media screen and (max-width: 767px) {
  .kv {
    width: 100vw;
    margin-left: calc(50% - 50vw);
  }
}
.kv picture,
.kv img {
  display: block;
  width: 100%;
}

body.is-modal-open {
  overflow: hidden;
}

img {
  width: 100%;
}

.container {
  position: relative;
}
.container .decorations {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.container .decorations .deco {
  position: absolute;
}
.container .decorations .leaf-1 {
  left: 2%;
  top: calc(113 / 1920 * 100vw);
  width: calc(257 / 1920 * 100vw);
  height: calc(1099 / 1920 * 100vw);
}
.container .decorations .terutia {
  left: -5.5%;
  top: calc(1418 / 1920 * 100vw);
  width: calc(739 / 1920 * 100vw);
  height: calc(1025 / 1920 * 100vw);
}
.container .decorations .leaf-2 {
  left: 4%;
  top: calc(2644 / 1920 * 100vw);
  width: calc(228 / 1920 * 100vw);
  height: calc(822 / 1920 * 100vw);
}
.container .decorations .bara {
  left: -2.5%;
  top: calc(3727.5 / 1920 * 100vw);
  width: calc(696 / 1920 * 100vw);
  height: calc(380 / 1920 * 100vw);
}
.container .decorations .asaka {
  right: -8%;
  top: calc(106 / 1920 * 100vw);
  width: calc(932 / 1920 * 100vw);
  height: calc(1232 / 1920 * 100vw);
}
.container .decorations .leaf-3 {
  right: 3%;
  top: calc(1491 / 1920 * 100vw);
  width: calc(217 / 1920 * 100vw);
  height: calc(860 / 1920 * 100vw);
}
.container .decorations .aika {
  right: -17%;
  top: calc(2593 / 1920 * 100vw);
  width: calc(804 / 1920 * 100vw);
}
@media screen and (min-width: 768px) {
  .container main {
    position: relative;
    z-index: 1;
    background: url(../images/pc/pc_bg_main_1.png) no-repeat center top/100% 100%;
    width: calc(1293 / 1920 * 100vw);
    margin: 0 auto;
    padding-top: calc(123 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main {
    width: calc(750 / 750 * 100vw);
    padding-top: calc(150 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .download-instructions {
    width: calc(1048 / 1920 * 100vw);
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .container main .download-instructions {
    width: calc(673 / 750 * 100vw);
    margin: 0 auto;
  }
}
@media screen and (min-width: 768px) {
  .container main .download-period {
    width: calc(793 / 1920 * 100vw);
    margin: calc(93 / 1920 * 100vw) auto 0;
  }
}
@media screen and (max-width: 767px) {
  .container main .download-period {
    width: calc(673 / 750 * 100vw);
    margin: calc(130 / 750 * 100vw) auto 0;
  }
}
@media screen and (min-width: 768px) {
  .container main .auth {
    margin-top: calc(103 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth {
    margin: calc(130 / 750 * 100vw) calc(38 / 750 * 100vw) 0;
  }
}
.container main .auth .form {
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .container main .auth .form {
    background: url(../images/pc/pc_authentication_bg.png) no-repeat center top/100% auto;
    padding: calc(75 / 1920 * 100vw) calc(88 / 1920 * 100vw) calc(38 / 1920 * 100vw);
    width: calc(990 / 1920 * 100vw);
    height: calc(1017 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form {
    background: url(../images/sp/sp_authentication_bg.png) no-repeat center top/contain;
    padding: calc(75 / 750 * 100vw) calc(48 / 750 * 100vw) calc(71 / 750 * 100vw) calc(47 / 750 * 100vw);
    width: calc(673 / 750 * 100vw);
    height: calc(1100 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .auth .form input {
    margin-top: calc(20 / 1920 * 100vw);
    padding-left: calc(20 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form input {
    margin-top: calc(40 / 750 * 100vw);
    padding-left: calc(20 / 750 * 100vw);
  }
}
.container main .auth .form input::-moz-placeholder {
  color: #242150;
  opacity: 1;
  font-weight: 400;
}
.container main .auth .form input::placeholder {
  color: #242150;
  opacity: 1;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .container main .auth .form input::-moz-placeholder {
    font-size: calc(18 / 1920 * 100vw);
    line-height: calc(26 / 1920 * 100vw);
  }
  .container main .auth .form input::placeholder {
    font-size: calc(18 / 1920 * 100vw);
    line-height: calc(26 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form input::-moz-placeholder {
    font-size: calc(16 / 750 * 100vw);
    line-height: calc(24 / 750 * 100vw);
  }
  .container main .auth .form input::placeholder {
    font-size: calc(16 / 750 * 100vw);
    line-height: calc(24 / 750 * 100vw);
  }
}
.container main .auth .form .title {
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .title {
    width: calc(345 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .title {
    width: calc(289 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .auth .form .id {
    width: calc(814 / 1920 * 100vw);
    margin-top: calc(56 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .id {
    width: calc(523 / 750 * 100vw);
    margin-top: calc(40 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .auth .form .id .heading {
    width: calc(243 / 1920 * 100vw);
    margin-left: calc(10 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .id .heading {
    width: calc(196 / 750 * 100vw);
  }
}
.container main .auth .form .id .games-id-input {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 3px solid #707070;
  opacity: 0.89;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .id .games-id-input {
    width: calc(814 / 1920 * 100vw);
    height: calc(101 / 1920 * 100vw);
    border-radius: calc(51 / 1920 * 100vw);
    margin-top: calc(20 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .id .games-id-input {
    width: calc(578 / 750 * 100vw);
    height: calc(101 / 750 * 100vw);
    border-radius: calc(51 / 750 * 100vw);
    margin-top: calc(16 / 750 * 100vw);
  }
}
.container main .auth .form .id .games-id-txt {
  text-align: left;
  letter-spacing: 0px;
  color: #242150;
  opacity: 1;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .id .games-id-txt {
    font-size: calc(20 / 1920 * 100vw);
    line-height: calc(32 / 1920 * 100vw);
    margin-top: calc(7 / 1920 * 100vw);
    margin-left: calc(25 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .id .games-id-txt {
    font-size: calc(22 / 750 * 100vw);
    line-height: calc(32 / 750 * 100vw);
    margin-top: calc(14 / 750 * 100vw);
  }
}
.container main .auth .form .id .games-id-txt span {
  text-decoration: underline;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .password {
    width: calc(814 / 1920 * 100vw);
    margin-top: calc(31 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .password {
    width: calc(539 / 750 * 100vw);
    margin-top: calc(69 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .auth .form .password .heading {
    width: calc(194 / 1920 * 100vw);
    margin-left: calc(15 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .password .heading {
    width: calc(171 / 750 * 100vw);
  }
}
.container main .auth .form .password .password-input {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 3px solid #707070;
  opacity: 0.89;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .password .password-input {
    width: calc(814 / 1920 * 100vw);
    height: calc(101 / 1920 * 100vw);
    border-radius: calc(51 / 1920 * 100vw);
    margin-top: calc(21 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .password .password-input {
    width: calc(578 / 750 * 100vw);
    height: calc(101 / 750 * 100vw);
    border-radius: calc(51 / 750 * 100vw);
    margin-top: calc(20 / 750 * 100vw);
  }
}
.container main .auth .form .password .password-txt {
  text-align: left;
  letter-spacing: 0px;
  color: #242150;
  opacity: 1;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .password .password-txt {
    font-size: calc(20 / 1920 * 100vw);
    line-height: calc(29 / 1920 * 100vw);
    margin-top: calc(7 / 1920 * 100vw);
    margin-left: calc(25 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .password .password-txt {
    font-size: calc(22 / 750 * 100vw);
    line-height: calc(32 / 750 * 100vw);
    width: calc(578 / 750 * 100vw);
    margin-top: calc(16 / 750 * 100vw);
  }
}
.container main .auth .form .password .password-txt .password-txt__lead {
  display: inline;
}
@media screen and (max-width: 767px) {
  .container main .auth .form .password .password-txt .password-txt__lead {
    width: 98%;
  }
}
.container main .auth .form .auth-btn {
  position: relative;
  display: block;
  touch-action: manipulation;
  overflow: hidden;
  transform-origin: center;
  transition: transform 0.25s ease-in-out;
  border: none;
  background: none;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .auth-btn {
    width: calc(302 / 1920 * 100vw);
    margin: calc(17 / 1920 * 100vw) auto 0;
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .auth-btn {
    width: calc(302 / 750 * 100vw);
    margin: calc(50 / 750 * 100vw) auto 0;
  }
}
.container main .auth .form .auth-btn .auth-btn-img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  -webkit-user-drag: none;
}
.container main .auth .form .auth-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0);
  transition: background 0.25s ease-in-out, transform 0.25s ease-in-out;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .container main .auth .form .auth-btn:not(.disabled):hover {
    transform: scale(0.95);
  }
  .container main .auth .form .auth-btn:not(.disabled):hover::after {
    background: rgba(255, 255, 255, 0.45);
  }
}
@media screen and (max-width: 767px) {
  .container main .auth .form .auth-btn:not(.disabled):active {
    transform: scale(0.95);
  }
  .container main .auth .form .auth-btn:not(.disabled):active::after {
    background: rgba(255, 255, 255, 0.45);
  }
}
.container main .auth .form .auth-btn.disabled {
  cursor: default;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section {
    background: url(../images/pc/pc_benefits_bg.png) no-repeat center top/100% 100%;
    width: calc(1293 / 1920 * 100vw);
    margin-top: calc(116 / 1920 * 100vw);
    padding: calc(112 / 1920 * 100vw) 0 calc(50 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section {
    background: url(../images/sp/sp_benefits_bg.png) no-repeat center top/100% 100%;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: calc(150 / 750 * 100vw);
    padding: calc(150 / 750 * 100vw) 0 calc(130 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .title {
    width: calc(774 / 1920 * 100vw);
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .title {
    width: calc(673 / 750 * 100vw);
    margin: 0 auto;
  }
}
.container main .benefit-section .buy-benefit .pc-wallpaper {
  background: url(../images/pc/pc_benefit_bg.png) no-repeat center top/100% 100%;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper {
    width: calc(727 / 1920 * 100vw);
    margin: calc(41 / 1920 * 100vw) auto 0;
    padding: calc(49 / 1920 * 100vw) calc(53 / 1920 * 100vw) calc(29 / 1920 * 100vw) calc(52 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper {
    width: calc(673 / 750 * 100vw);
    margin: calc(40 / 750 * 100vw) auto 0;
    padding: calc(50 / 750 * 100vw) calc(26 / 750 * 100vw) calc(48 / 750 * 100vw) calc(25 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .image {
    width: calc(622 / 1920 * 100vw);
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .image {
    width: calc(622 / 750 * 100vw);
    margin: 0 auto;
  }
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn {
  position: relative;
  display: block;
  overflow: hidden;
  transform-origin: center;
  transform: scale(1);
  transition: transform 0.25s ease-in-out;
  border-radius: calc(80 / 1920 * 100vw);
  touch-action: manipulation;
  border: none;
  background: none;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn {
    width: calc(435 / 1920 * 100vw);
    margin: calc(16 / 1920 * 100vw) auto 0;
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn {
    width: calc(435 / 750 * 100vw);
    margin: calc(12 / 750 * 100vw) auto 0;
    border-radius: calc(80 / 750 * 100vw);
  }
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0);
  transition: background 0.2s ease-out;
  pointer-events: none;
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  -webkit-user-drag: none;
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled {
  cursor: pointer;
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled:focus-visible {
  outline: none;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled:hover {
    transform: scale(0.95);
  }
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled:hover::after {
    background: rgba(255, 255, 255, 0.45);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled:active {
    transform: scale(0.95);
  }
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.enabled:active::after {
    background: rgba(255, 255, 255, 0.45);
  }
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-btn.disabled {
  cursor: default;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .wrapper-download_count-txt {
    width: calc(180 / 1920 * 100vw);
    height: calc(26 / 1920 * 100vw);
    margin: calc(19 / 1920 * 100vw) auto 0;
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .wrapper-download_count-txt {
    width: calc(220 / 750 * 100vw);
    height: calc(32 / 750 * 100vw);
    margin: calc(20 / 750 * 100vw) auto 0;
  }
}
.container main .benefit-section .buy-benefit .pc-wallpaper .download-count-txt {
  text-align: center;
  color: #242150;
  opacity: 1;
  letter-spacing: 0px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-count-txt {
    font-size: calc(18 / 1920 * 100vw);
    line-height: calc(26 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .buy-benefit .pc-wallpaper .download-count-txt {
    font-size: calc(22 / 750 * 100vw);
    line-height: calc(32 / 750 * 100vw);
  }
}
.container main .benefit-section .caution {
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .caution {
    background: url(../images/pc/pc_caution_bg.png) no-repeat center top/100% 100%;
    width: calc(860 / 1920 * 100vw);
    margin-top: calc(130 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .caution {
    background: url(../images/sp/sp_caution_bg.png) no-repeat center top/100% 100%;
    width: calc(670 / 750 * 100vw);
    margin-top: calc(130 / 750 * 100vw);
  }
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .caution ul {
    padding: calc(160 / 1920 * 100vw) calc(80 / 1920 * 100vw) calc(53 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .caution ul {
    padding: calc(152 / 750 * 100vw) calc(40 / 750 * 100vw) calc(50 / 750 * 100vw) calc(40 / 750 * 100vw);
  }
}
.container main .benefit-section .caution ul li {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  text-align: left;
  letter-spacing: 0;
  color: #242150;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .caution ul li {
    font-size: calc(14 / 1920 * 100vw);
    line-height: calc(30 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .caution ul li {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(30 / 750 * 100vw);
  }
}
.container main .benefit-section .caution ul li::marker {
  color: #242150;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .caution ul li::marker {
    font-size: calc(10 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .caution ul li::marker {
    font-size: calc(10 / 750 * 100vw);
  }
}
.container main .benefit-section .wrapper-banner {
  position: relative;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .wrapper-banner {
    width: calc(509 / 1920 * 100vw);
    margin: calc(57 / 1920 * 100vw) auto 0;
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .wrapper-banner {
    width: calc(670 / 750 * 100vw);
    margin: calc(130 / 750 * 100vw) auto 0;
  }
}
.container main .benefit-section .wrapper-banner .banner {
  display: block;
}
@media screen and (min-width: 768px) {
  .container main .benefit-section .wrapper-banner .banner {
    width: calc(509 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .wrapper-banner .banner {
    width: calc(670 / 750 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .wrapper-banner .bara-1 {
    position: absolute;
    top: -25%;
    left: 2%;
    width: calc(68 / 750 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .wrapper-banner .bara-2 {
    position: absolute;
    right: -2.2%;
    width: calc(62 / 750 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .container main .benefit-section .wrapper-banner .bara-3 {
    position: absolute;
    right: 7%;
    bottom: -38%;
    width: calc(90.16 / 750 * 100vw);
  }
}

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #191d5b;
}
@media screen and (min-width: 768px) {
  footer {
    padding: calc(33 / 1920 * 100vw) 0;
  }
}
@media screen and (max-width: 767px) {
  footer {
    padding: calc(33 / 750 * 100vw) 0;
  }
}
footer .copyright {
  display: flex;
  align-items: center;
}
footer .copyright img {
  display: block;
  height: auto;
}
@media screen and (min-width: 768px) {
  footer .copyright img {
    width: calc(244 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  footer .copyright img {
    width: calc(244 / 750 * 100vw);
  }
}

.check-modal {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  justify-content: center;
  align-items: center;
  z-index: 999;
}
@media screen and (max-width: 767px) {
  .check-modal {
    padding: calc(48 / 750 * 100vw) 0;
    box-sizing: border-box;
  }
}
.check-modal.active {
  display: flex;
}
.check-modal .modal-content {
  position: relative;
  display: flex;
}
@media screen and (min-width: 768px) {
  .check-modal .modal-content {
    background: url("../images/pc/pc_popup_bg.png") center/100% auto no-repeat;
    width: calc(1110 / 1920 * 100vw);
    aspect-ratio: 1110/802;
    margin: auto calc(405 / 1920 * 100vw);
    padding: 0 calc(40 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .check-modal .modal-content {
    background: url("../images/sp/sp_popup_bg.png") center/100% auto no-repeat;
    width: min(100%, 670 / 750 * 100vw);
    margin: 0 auto;
    padding: calc(32 / 750 * 100vw);
  }
}
.check-modal .modal-content .close-btn {
  position: absolute;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .check-modal .modal-content .close-btn {
    width: calc(69 / 1920 * 100vw);
    top: calc(26 / 1920 * 100vw);
    right: calc(50 / 1920 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  .check-modal .modal-content .close-btn {
    width: calc(69 / 750 * 100vw);
    top: calc(65 / 750 * 100vw);
    right: calc(31 / 750 * 100vw);
  }
}
.check-modal .modal-content .modal-title {
  position: absolute;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .check-modal .modal-content .modal-title {
    width: calc(596 / 1920 * 100vw);
    top: calc(68 / 1110 * 100%);
    left: 37.5%;
  }
}
@media screen and (max-width: 767px) {
  .check-modal .modal-content .modal-title {
    width: calc(596 / 750 * 100vw);
    top: 15%;
    left: 50%;
  }
}
.check-modal .modal-content .modal-scroll {
  position: relative;
}
@media screen and (min-width: 768px) {
  .check-modal .modal-content .modal-scroll {
    width: calc(879 / 1920 * 100vw);
    margin: 15% auto 3%;
    max-height: 70vh;
  }
}
@media screen and (max-width: 767px) {
  .check-modal .modal-content .modal-scroll {
    width: calc(594 / 750 * 100vw);
    margin: 40% auto 10%;
    height: 98vw;
    max-height: 98vh;
  }
}
.check-modal .modal-content .modal-scroll .modal-procedure {
  position: relative;
  width: 100%;
}
.check-modal .modal-content .modal-scroll .modal-procedure a {
  position: absolute;
  z-index: 1000;
  display: block;
}
@media screen and (min-width: 768px) {
  .check-modal .modal-content .modal-scroll .modal-procedure a {
    left: 4.7%;
    top: 0.23%;
    width: 17.4%;
  }
}
@media screen and (max-width: 767px) {
  .check-modal .modal-content .modal-scroll .modal-procedure a {
    left: 5.5%;
    top: 0%;
    width: calc(177 / 750 * 100vw);
  }
}
.check-modal .modal-content .modal-scroll .modal-procedure a img {
  display: block;
}

.modal-scroll .simplebar-track.simplebar-vertical {
  width: 1.7%;
  background: #9f9f9f;
}
@media screen and (min-width: 768px) {
  .modal-scroll .simplebar-track.simplebar-vertical {
    right: -5%;
  }
}
@media screen and (max-width: 767px) {
  .modal-scroll .simplebar-track.simplebar-vertical {
    right: -3%;
  }
}

.modal-scroll .simplebar-scrollbar::before {
  border-radius: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  opacity: 1;
}

.loading-modal {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  z-index: 999;
}
.loading-modal.active {
  display: flex;
}
@media screen and (max-width: 767px) {
  .loading-modal.safari {
    position: absolute;
    margin-top: -45%;
    height: 150dvh;
  }
}
.loading-modal .loading-gif {
  width: 100%;
  height: 100%;
  display: flex;
}
.loading-modal .loading-gif picture {
  width: 100%;
  height: 100%;
  display: flex;
}
.loading-modal .loading-gif img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}

html.is-loading {
  overflow: hidden;
}

body.is-loading {
  overflow: hidden;
  height: 100%;
}

.download-count-txt.hidden {
  display: none;
}

@keyframes maskShine {
  0% {
    top: -150%;
    left: -150%;
  }
  50% {
    opacity: 1;
  }
  100% {
    top: 150%;
    left: 150%;
  }
}