@charset "UTF-8";
/* ------------------------------------------------------------------------------------------------------------------
共通項目
------------------------------------------------------------------------------------------------------------------ */

#lp_header_area {
  position: relative;
  z-index: 2;
}

#article2210_01 {
  box-sizing: border-box;
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/lp/article2210_01/main_bg.png) center top repeat;
}

.webp #article2210_01 {
  background: url(https://www.nijiyome.com/nijiyome-img/img/contents/lp/article2210_01/main_bg.webp) center top repeat;
}

#article2210_01 img {
  height: auto;
  max-width: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

#article2210_01 a img {
  transition: opacity .3s ease;
}

#article2210_01 a img:hover {
  opacity: .7;
}

#article2210_01 .wrapper {
  width: 1200px;
  max-width: 100%;
  margin: auto;
  padding-bottom: 100px;
  background: #fff;
  filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, .1));
}

.sp{
  display: none;
}

@media only screen and (max-width: 768px) {
  #article2210_01 .wrapper {
    padding-bottom: 50px;
  }

  .pc{
    display: none;
  }

  .sp {
    display: block;
  }
}

/* ------------------------------------------------------------------------------------------------------------------
type-heroarea
------------------------------------------------------------------------------------------------------------------ */

#article2210_01 .type-heroarea {
  position: relative;
}

#article2210_01 .type-heroarea .btn-play{
  position: absolute;
  top: 30.79%;
  left: 50%;
  transform: translate3d(-50%,0,0);
  width: 30.67%;
}

/* ------------------------------------------------------------------------------------------------------------------
type-menu
------------------------------------------------------------------------------------------------------------------ */

#article2210_01 .type-menu {
  position: relative;
  margin-top: max(-560px,-46.67vw);
}

#article2210_01 .type-menu .menu-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

#article2210_01 .type-menu .btn-nijicoin img {
  width: min(418px,34.83vw);
}

#article2210_01 .type-menu .btn-login img {
  width: min(347px,28.91vw);
}

#article2210_01 .type-menu .btn-about img {
  width: min(408px,34vw);
}

/* ------------------------------------------------------------------------------------------------------------------
type-canpaign
------------------------------------------------------------------------------------------------------------------ */

#article2210_01 .type-campaign {
  position: relative;
  margin: 30px auto 0;
  width: 84.83%;
}

#article2210_01 .section-pic{
  width: 100%;
}

#article2210_01 .type-campaign .btn-container{
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  top: 60%;
  left: 3.5%;
  width: 55.41%;
}

#article2210_01 .btn-top{
  position: absolute;
  right: 0;
  bottom: 0;
  width: 133px;
}

/* ------------------------------------------------------------------------------------------------------------------
max-width: 769px
------------------------------------------------------------------------------------------------------------------ */

@media only screen and (max-width: 769px) {

  #article2210_01 .type-heroarea .btn-play{
    top: 58%;
    width: 83.72%;
  }

  #article2210_01 .type-menu {
    margin-top: -40vw;
  }

  #article2210_01 .type-menu .menu-container {
    margin: 0 auto;
    width: 93.2%;
  }

  #article2210_01 .type-menu .btn-nijicoin img {
    width: 33.07vw;
  }

  #article2210_01 .type-menu .btn-login img {
    margin: 0 0.52vw 0 -0.52vw;
    width: 30.6vw;
  }

  #article2210_01 .type-menu .btn-about img {
    width: 30.6vw;
  }

  #article2210_01 .type-campaign {
    margin: 10px auto 30px;
    width: 94%;
  }

  #article2210_01 .type-campaign.sec-nijicoin {
    width: 100%;
  }

  #article2210_01 .type-campaign .btn-container{
    top: 74%;
    left: 6.5%;
    width: 87.24%;
  }

  #article2210_01 .type-campaign .btn-link{
    width: 50%;
  }

  #article2210_01 .btn-top{
    bottom: -7vw;
    width: 24vw;
  }
}