@charset "utf-8";
.fs{
  display: inline-block;
}
.mt04{
  margin-top: 4px;
}
.mt08{
  margin-top: 8px;
}
.mt16{
  margin-top: 16px;
}
.mt24{
  margin-top: 24px !important;
}
.mt48{
  margin-top: 48px !important;
}
.page-content__wrapper > div + div{
  margin: 96px 0 0;
}
.howto-link{
  font-size: 1.4rem;
}
.step-title{
  background: #eee;
  font-size: 1.6rem;
  font-weight: 600;
  text-align: center;
  padding: 8px 12px;
  margin-bottom: 24px;
}
.target-lists{
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  column-gap: 16px;
}
.target-list__item{
  position: relative;
  padding-left: 28px;
}
.target-list__item::before{
  content: '';
  position: absolute;
  width: 24px;
  height: 24px;
  top: 0;
  left: 0;
}
.target-list__item--ico01::before{
  background: url(/support/images/use_miniapp/target-list_ico.png) no-repeat center center / contain;
}
.target-list__item--ico05::before{
  background: url(/support/images/use_miniapp/target-list_ico-parent.png) no-repeat center center / contain;
}
.step-lists__container{
  margin-top: 48px;
}
.step-lists{
  width: calc(100% + 24px);
}
.step-lists .slick-list{
  padding: 0 18.5% 0 0 !important;
}
.step-lists__item{
  margin-right: 20px;
  max-width: 240px;
}
.step-lists__item-pic{
  padding: calc(16 / 240 * 100%) calc(20 / 240 * 100%) 0;
  position: relative;
}
.step-lists__item .step-lists__item-pic::before{
  content: "";
  display: block;
  width: calc(58 / 240 * 100%);
  height: calc(38 / 310 * 100%);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0;
}
.step-lists__item:nth-of-type(1) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon01.png);
}
.step-lists__item:nth-of-type(2) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon02.png);
}
.step-lists__item:nth-of-type(3) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon03.png);
}
.step-lists__item:nth-of-type(4) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon04.png);
}
.step-lists__item:nth-of-type(5) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon05.png);
}
.step-lists__item:nth-of-type(6) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon06.png);
}
.step-lists__item:nth-of-type(6) .step-lists__item-pic.step-lists__item-pic--parent::before{
  background-image: url(/support/images/use_miniapp/step-icon06_parent.png);
}
.step-lists__item:nth-of-type(7) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon07.png);
}
.step-lists__item:nth-of-type(8) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon08.png);
}
.step-lists__item:nth-of-type(8) .step-lists__item-pic.step-lists__item-pic--parent::before{
  background-image: url(/support/images/use_miniapp/step-icon08_parent.png);
}
.step-lists__item:nth-of-type(9) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon09.png);
}
.step-lists__item:nth-of-type(9) .step-lists__item-pic.step-lists__item-pic--parent::before{
  background-image: url(/support/images/use_miniapp/step-icon09_parent.png);
}
.step-lists__item:nth-of-type(10) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon10.png);
}
.step-lists__item:nth-of-type(11) .step-lists__item-pic::before{
  background-image: url(/support/images/use_miniapp/step-icon11.png);
}
.step-lists__item .step-lists__item-pic::after{
  content: "";
  display: block;
  width: 20px;
  height: 36px;
  background: url(/nisa/images/use/step-arrow.png) no-repeat center;
  background-size: contain;
  position: absolute;
  right: -22px;
  top: 50%;
}
.step-lists__item:last-child .step-lists__item-pic::after{
  display: none !important;
}
.graphics-box__img .step-lists__item-pic::after{
  display: none !important;
}
.step-lists__item-text{
  font-size: 1.4rem;
  margin-top: 24px;
  padding: 0 calc(20 / 240 * 100%) 0;
}
.step-lists__item-text--title{
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 6px;
}
.step-lists__controller{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 327px;
  height: 40px;
  list-style: none;
  padding: 0;
  margin: 0 auto;
  text-align: center;
  position: relative;
  margin-top: 24px;
}
.step-lists__controller-prev,
.step-lists__controller-next{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 0;
}
.step-lists__controller-prev{
  left: 0;
}
.step-lists__controller-next{
  right: 0;
}
.step-lists__controller-prev.slick-disabled,
.step-lists__controller-next.slick-disabled{
  opacity: 0;
}
.step-lists__controller-dots{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 45px;
}
.step-lists__controller-dots li{
  width: 12px;
  height: 12px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
  position: relative;
}
.step-lists__controller-dots li button{
  display: block;
  width: 12px;
  height: 12px;
  background: transparent;
  border: 0;
  font-size: 0;
  line-height: 0;
  color: transparent;
  outline: none;
  padding: 0;
  cursor: pointer;
}
.step-lists__controller-dots li button:hover,
.step-lists__controller-dots li button:focus{
  outline: none;
}
.step-lists__controller-dots li button:hover:before,
.step-lists__controller-dots li button:focus:before{
  opacity: 1;
}
.step-lists__controller-dots li button:before{
  content: '';
  width: 8px;
  height: 8px;
  background: #ddd;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.step-lists__controller-dots li.slick-active button:before{
  width: 12px;
  height: 12px;
  background: #4da0ff;
}
.suspend-button{
  max-width: 342px;
  margin: 0 auto;
}
.suspend-button__link{
  display: block;
  min-height: 44px;
  padding: 14px 6px;
  font-size: 1.4rem;
  align-items: center;
}
@media screen and (min-width:768px){
  .page-content__head1--small{
    font-size: 2.4rem;
  }
  .target-lists{
    flex-wrap: wrap;
    flex-direction: row;
  }
  .step-lists{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 48px 20px;
    padding-left: 12px;
    padding-right: 68px;
    max-width: 920px;
  }
  .step-lists__item{
    max-width: 240px;
    padding: 0;
    margin-right: 0;
  }
  .step-lists__item .step-lists__item-pic::before{
    background-position: center;
  }
  .step-lists__item .step-lists__item-pic::after{
    right: -20px;
  }
  .step-lists__item-text--title{
    font-size: 2.0rem;
  }
  .step-lists__controller{
    display: none;
  }
  .suspend-button{
    max-width: 309px;
  }
  .suspend-button__link{
    min-height: 60px;
    font-size: 1.6rem;
    padding: 17px 6px;
  }
}
@media screen and (min-width:378px){
  .step-lists .slick-list{
    padding: 0 32.5% 0 0!important;
  }
}