@charset "UTF-8";
@keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3); }
  90% {
    opacity: 1; }
  100% {
    opacity: 1; } }

@keyframes togetoge {
  0% {
    opacity: 0; }
  15% {
    opacity: 1; }
  30% {
    opacity: 0; }
  45% {
    opacity: 1; }
  60% {
    opacity: 0; }
  75% {
    opacity: 1; }
  90% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fade {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes bound {
  0% {
    transform: translateY(0); }
  25% {
    transform: translateY(-25px); }
  50% {
    transform: translateY(0px); }
  75% {
    transform: translateY(-25px); }
  100% {
    transform: translateY(0px); } }

@keyframes push {
  5% {
    transform: translateY(8px); }
  15% {
    transform: translateY(0); }
  25% {
    transform: translateY(8px); }
  35% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }

@keyframes tremble {
  0% {
    transform: translate(0px, 0px) rotateZ(0deg); }
  25% {
    transform: translate(2px, 2px) rotateZ(1deg); }
  50% {
    transform: translate(0px, 2px) rotateZ(0deg); }
  75% {
    transform: translate(2px, 0px) rotateZ(-1deg); }
  100% {
    transform: translate(0px, 0px) rotateZ(0deg); } }

html, body {
  font-size: 16px; }

.pc {
  display: none; }

.wrapper {
  background-image: url("/modpub/images/campaign/jumbo_lp_202009/back_gold.png");
  background-repeat: repeat;
  background-position: center;
  background-size: contain; }

.lp_content {
  position: relative; }
  .lp_content img {
    width: 100%; }

@media screen and (min-width: 769px) {
  .pc {
    display: block; }
  .sp {
    display: none; }
  .lp_content {
    overflow: hidden; }
    .lp_content section {
      max-width: 990px;
      margin: 0 auto; }
    .lp_content .coin {
      width: 15%;
      position: absolute; }
    .lp_content .coin_a {
      top: 38%;
      left: 0; }
    .lp_content .coin_b {
      top: 81%;
      left: 0;
      z-index: 1; }
    .lp_content .coin_c {
      top: 27%;
      right: 0; }
    .lp_content .coin_d {
      top: 68%;
      right: 0;
      z-index: 1; } }

.hero {
  padding-top: 20px;
  padding-bottom: 18%;
  background-image: url("/modpub/images/campaign/jumbo_lp_202009/character_main_sp.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain; }
  .hero_inner {
    padding: 0 10px 34%;
    position: relative;
    background-image: url("/modpub/images/campaign/jumbo_lp_202009/coin_line_sp.png");
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain; }
    .hero_inner .main_img {
      padding-bottom: 10px;
      position: relative; }
      .hero_inner .main_img_titles {
        padding-bottom: 27%; }
        .hero_inner .main_img_titles_catch {
          width: 80%;
          margin: 0 auto;
          padding-bottom: 15px; }
        .hero_inner .main_img_titles_title {
          width: 48%;
          padding: 0 0 20px 10px; }
        .hero_inner .main_img_titles_baloon {
          width: 32%;
          position: absolute;
          top: 29%;
          right: auto;
          left: 3%; }
      .hero_inner .main_img .first_prize {
        padding-bottom: 10px; }
      .hero_inner .main_img .prizes {
        display: flex;
        justify-content: space-between; }
    .hero_inner .info_text {
      margin-bottom: 16px;
      color: #412309;
      font-size: 3.4vw;
      font-weight: bold;
      text-align: center;
      line-height: 1.6em;
      letter-spacing: 0.05em;
      text-shadow: 3px  3px 2px #e0c67a, -3px  3px 2px #e0c67a, 3px -3px 2px #e0c67a, -3px -3px 2px #e0c67a, 3px  0px 2px #e0c67a, 0px  3px 2px #e0c67a, -3px  0px 2px #e0c67a, 0px -3px 2px #e0c67a; }
      .hero_inner .info_text span {
        color: #ff1919;
        font-weight: bold; }
    .hero_inner .info .period {
      width: 90%;
      margin: 0 auto;
      padding-bottom: 9px; }

.explanation {
  padding-bottom: 15%; }

@media screen and (min-width: 769px) {
  .explanation {
    padding-bottom: 8%; } }

@media screen and (min-width: 769px) {
  .hero {
    padding-top: 20px;
    padding-bottom: 90px;
    background-image: url("/modpub/images/campaign/jumbo_lp_202009/back_powder.png"), url("/modpub/images/campaign/jumbo_lp_202009/concentrated_line.png");
    background-repeat: repeat-x, no-repeat;
    background-position: center top, center top;
    background-size: contain, contain; }
    .hero_inner {
      padding: 0 0 21.5%;
      position: relative;
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/character_main.png");
      background-repeat: no-repeat;
      background-position: top right;
      background-size: cover; }
      .hero_inner .main_img {
        width: 50%;
        margin: 0 auto;
        padding-bottom: 5px;
        position: relative; }
        .hero_inner .main_img_titles {
          width: 50%;
          margin: 0 auto;
          padding-bottom: 0; }
          .hero_inner .main_img_titles_catch {
            width: 100%; }
          .hero_inner .main_img_titles_title {
            width: 100%;
            text-align: center;
            padding-bottom: 20px; }
          .hero_inner .main_img_titles_baloon {
            width: 25%;
            position: absolute;
            top: 12%;
            right: 1%;
            left: auto; }
        .hero_inner .main_img .prizes {
          display: flex;
          justify-content: space-between; }
      .hero_inner .info_text {
        margin-bottom: 15px;
        color: #412309;
        font-size: calc(1rem + ((1vw - 7.68px) * 0.9549));
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.05em; }
        .hero_inner .info_text span {
          color: #ff1919;
          font-weight: bold; }
      .hero_inner .info .period {
        width: 45%;
        margin: 0 auto;
        padding-bottom: 0; } }

.step_title {
  padding: 0 12% 12%; }

.step_group_item {
  width: 62%;
  margin: 0 auto;
  position: relative;
  left: 2%;
  padding-bottom: 12%; }
  .step_group_item:not(:last-of-type)::after {
    content: '▼';
    font-size: 5vw;
    position: absolute;
    left: 50%;
    bottom: 2%;
    transform: translateX(-50%); }

@media screen and (min-width: 769px) {
  .step {
    padding-bottom: 95px; }
    .step_title {
      width: 60%;
      margin: 0 auto;
      padding: 0 3% 10%; }
    .step_group {
      display: flex;
      justify-content: center; }
      .step_group_item {
        max-width: 400px;
        margin: 0;
        padding-right: 5%;
        padding-left: 3%;
        padding-bottom: 0;
        left: 0; }
        .step_group_item:not(:last-of-type)::after {
          content: '▼';
          font-size: 1.875rem;
          position: absolute;
          top: 40%;
          right: 0;
          left: auto;
          bottom: auto;
          transform: rotate(-90deg); } }

.flowbox {
  width: 94%;
  margin: 12% auto 0;
  padding: 3% 5%;
  color: #412309;
  border-radius: 14px;
  background-color: #fff;
  position: relative; }
  .flowbox_title {
    padding-top: 3px;
    padding-left: 5px;
    font-size: 5vw;
    font-weight: bold;
    border-left: 7px solid #412309;
    line-height: 0.8em;
    letter-spacing: .03em;
    position: absolute;
    top: -2vw; }
  .flowbox_text {
    padding-bottom: 1%;
    font-weight: bold; }
    .flowbox_text p {
      font-size: calc(1rem + ((1vw - 7.68px) * 0.5208));
      font-weight: bold;
      line-height: 1.7em; }
      .flowbox_text p span {
        color: #cc0000;
        font-weight: bold; }
  .flowbox_precautions_item {
    font-size: 3vw;
    font-weight: bold;
    margin-bottom: 2%;
    position: relative;
    padding-left: 1.7em;
    letter-spacing: .1em; }
    .flowbox_precautions_item::after {
      content: '※';
      position: absolute;
      top: 0;
      left: 0; }
    .flowbox_precautions_item a {
      color: #ff6c00; }
      .flowbox_precautions_item a:hover {
        text-decoration: underline; }
  .flowbox .text_padding {
    padding-top: 3%; }

@media screen and (min-width: 769px) {
  .flowbox {
    width: 90%;
    min-height: 105px;
    margin: 86px auto 0;
    max-width: 800px;
    padding: 2% 4%;
    border-radius: 36px; }
    .flowbox_title {
      font-size: 2.5rem;
      border-left: .7vw solid #412309;
      top: -16px; }
    .flowbox_text p {
      font-size: 1.5rem;
      font-weight: bold; }
    .flowbox_precautions_item {
      font-size: 0.9375rem;
      margin-bottom: 5px; }
  .add_padding {
    padding: 3% 4%; } }

.cash {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: auto; }

.card {
  padding-bottom: 2%; }
  .card_text {
    padding-top: 1%;
    font-size: calc(1rem + ((1vw - 7.68px) * 0.5208));
    font-weight: bold; }
  .card img {
    width: 50%;
    padding-left: 5%;
    align-self: flex-start; }

@media screen and (min-width: 769px) {
  .cash {
    padding-top: 10px;
    display: flex;
    justify-content: flex-start; }
  .card {
    padding-top: 10px;
    padding-bottom: 1%; }
    .card img {
      width: 45%; } }

.floor {
  padding-bottom: 10%; }
  .floor_title {
    padding: 0 3% 12%; }
  .floor_list {
    padding: 0 4%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .floor_list_item {
      width: 48%;
      margin-bottom: 8%;
      background-position: center center;
      background-repeat: no-repeat; }
      .floor_list_item a {
        padding-bottom: 13.3vw;
        display: block; }
    .floor_list .eng.dojin {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/eng/button_dojin.png"), url("/modpub/images/campaign/jumbo_lp_202009/eng/button_dojin_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.dojin {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_dojin.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_dojin_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.dojin {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_dojin.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_dojin_hover.png");
      background-size: cover, 0 0; }
    .floor_list .dojin {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_dojin.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_dojin_hover.png");
      background-size: cover, 0 0; }
    .floor_list .eng.comic {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/eng/button_adult.png"), url("/modpub/images/campaign/jumbo_lp_202009/eng/button_adult_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.comic {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_comic.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_comic_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.comic {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_comic.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_comic_hover.png");
      background-size: cover, 0 0; }
    .floor_list .comic {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_comic.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_comic_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.soft {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_soft.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_soft_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.soft {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_soft.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_soft_hover.png");
      background-size: cover, 0 0; }
    .floor_list .soft {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_soft.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_soft_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.girls {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_girls.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_girls_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.girls {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_girls.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_girls_hover.png");
      background-size: cover, 0 0; }
    .floor_list .girls {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_girls.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_girls_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.bl {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_bl.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_bl_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.bl {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_bl.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_bl_hover.png");
      background-size: cover, 0 0; }
    .floor_list .bl {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_bl.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_bl_hover.png");
      background-size: cover, 0 0; }
    .floor_list .cn.okini {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_okini.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_okini_hover.png");
      background-size: cover, 0 0; }
    .floor_list .tw.okini {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_okini.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_okini_hover.png");
      background-size: cover, 0 0; }
    .floor_list .okini {
      background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_okini.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_okini_hover.png");
      background-size: cover, 0 0; }

@media screen and (min-width: 769px) {
  .floor_title {
    width: 63%;
    margin: 0 auto;
    padding: 0 3% 6%; }
  .floor_list {
    padding: 0 8%; }
    .floor_list_item {
      width: 32%;
      margin-bottom: 5%; }
      .floor_list_item a {
        padding-bottom: 32%; }
  .floor .eng.dojin {
    background-size: contain, 0 0; }
    .floor .eng.dojin:hover {
      background-size: 0 0, contain; }
  .floor .eng.comic {
    background-size: contain, 0 0; }
    .floor .eng.comic:hover {
      background-size: 0 0, contain; }
  .floor .dojin,
  .floor .comic,
  .floor .soft,
  .floor .girls,
  .floor .bl,
  .floor .okini,
  .floor .eng.dojin,
  .floor .cn.dojin,
  .floor .tw.dojin,
  .floor .eng.comic,
  .floor .cn.comic,
  .floor .tw.comic,
  .floor .cn.soft,
  .floor .tw.soft,
  .floor .cn.girls,
  .floor .tw.girls,
  .floor .cn.bl,
  .floor .tw.bl,
  .floor .cn.okini,
  .floor .tw.okini {
    background-size: contain, 0 0; }
    .floor .dojin:hover,
    .floor .comic:hover,
    .floor .soft:hover,
    .floor .girls:hover,
    .floor .bl:hover,
    .floor .okini:hover,
    .floor .eng.dojin:hover,
    .floor .cn.dojin:hover,
    .floor .tw.dojin:hover,
    .floor .eng.comic:hover,
    .floor .cn.comic:hover,
    .floor .tw.comic:hover,
    .floor .cn.soft:hover,
    .floor .tw.soft:hover,
    .floor .cn.girls:hover,
    .floor .tw.girls:hover,
    .floor .cn.bl:hover,
    .floor .tw.bl:hover,
    .floor .cn.okini:hover,
    .floor .tw.okini:hover {
      background-size: 0 0, contain; } }

.reduction {
  padding-bottom: 20%;
  position: relative; }
  .reduction_title {
    margin-bottom: 6%;
    padding: 5% 12% 2%;
    background-color: #fff;
    position: relative; }
    .reduction_title .sarani {
      width: 20%;
      position: absolute;
      top: -40%; }
  .reduction_hyouka {
    padding: 0 12%; }
  .reduction_text {
    font-size: 3.8vw;
    text-align: center;
    padding-bottom: 5%; }
    .reduction_text p {
      font-weight: bold;
      color: #412309;
      line-height: 1.8em;
      letter-spacing: .05em;
      text-align: center; }
      .reduction_text p span {
        color: #cc0000;
        font-weight: bold; }
  .reduction_btn.cn {
    background-image: url("/modpub/images/campaign/jumbo_lp_202009/cn/button_my.png"), url("/modpub/images/campaign/jumbo_lp_202009/cn/button_my_hover.png"); }
  .reduction_btn.tw {
    background-image: url("/modpub/images/campaign/jumbo_lp_202009/tw/button_my.png"), url("/modpub/images/campaign/jumbo_lp_202009/tw/button_my_hover.png"); }
  .reduction_btn {
    width: 50%;
    margin: 0 auto 2%;
    background-image: url("/modpub/images/campaign/jumbo_lp_202009/button_my.png"), url("/modpub/images/campaign/jumbo_lp_202009/button_my_hover.png");
    background-repeat: no-repeat;
    background-size: contain, 0 0; }
    .reduction_btn:hover {
      background-size: 0 0, contain; }
    .reduction_btn a {
      padding-bottom: 15vw;
      display: block; }
  .reduction_tori {
    width: 26%;
    position: absolute;
    top: -30%;
    right: 0px; }
  .reduction_precautions {
    padding-top: 6%; }
    .reduction_precautions_item {
      font-size: 3vw;
      font-weight: bold;
      margin-bottom: 2%;
      position: relative;
      padding-left: 1.7em;
      letter-spacing: .1em; }
      .reduction_precautions_item::after {
        content: '※';
        position: absolute;
        top: 0;
        left: 0; }

@media screen and (min-width: 769px) {
  .reduction {
    padding-bottom: 5%; }
    .reduction .bg_tori {
      width: 18%;
      position: absolute;
      top: -28px;
      left: 2%;
      z-index: 10; }
    .reduction .bg_hyouka {
      width: 20%;
      position: absolute;
      top: -60px;
      right: 0;
      z-index: 10; }
    .reduction_title {
      width: 100vw;
      margin: 0 auto;
      margin-left: calc(-50vw + 50%);
      margin-bottom: 3%;
      padding: 2% 0; }
      .reduction_title img {
        width: 56%;
        max-width: 594px;
        display: block;
        margin: 0 auto; }
      .reduction_title .sarani {
        width: 14.5%;
        max-width: 153px;
        top: -58%;
        left: 50%;
        transform: translate(-185%, 6%); }
    .reduction_text {
      font-size: calc(1rem + ((1vw - 7.68px) * 1.2153));
      padding-bottom: 3%;
      position: relative;
      z-index: 2; }
    .reduction_btn {
      width: 30%; }
      .reduction_btn a {
        padding-bottom: 7vw; }
    .reduction_tori {
      width: 17%;
      top: -29%;
      right: 2%; }
    .reduction_precautions {
      padding-top: 3%; }
      .reduction_precautions_item {
        font-size: 0.9375rem;
        margin-bottom: 10px; } }
