@charset "UTF-8";
body {
  font-family: "Hind", "Noto Sans JP", sans-serif;
  box-sizing: border-box;
  font-size: 14px;
  color: #696969;
  line-height: 1.6; }

.wrap {
  max-width: 480px;
  margin: auto;
  padding: 0 20px; }

#main {
  padding-top: 75px; }

section.page {
  padding: 20px 0 80px; }
  section.page .title {
    font-size: 18px;
    text-align: center;
    font-weight: bold;
    position: relative;
    padding-top: 12px; }
    section.page .title::before {
      content: "";
      width: 40px;
      height: 6px;
      background-color: #656565;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%); }
  section.page .sub-title {
    text-align: center;
    color: #bebebe;
    font-size: 12px;
    font-weight: bold;
    margin-top: 2px; }
  section.page .content {
    margin-top: 20px; }

.form .form-item label {
  display: flex;
  align-items: center;
  font-weight: bold;
  line-height: 1; }
  .form .form-item label span {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #e02d2d;
    color: #FFF;
    font-size: 10px;
    width: 30px;
    height: 16px;
    margin-left: 6px;
    font-weight: normal;
    margin-top: 2px; }
.form .form-item input {
  display: block;
  margin: 8px 0 20px;
  width: 100%;
  border: #e2e2e2 solid 2px;
  height: 40px;
  line-height: 40px;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
  font-family: "Hind", "Noto Sans JP", sans-serif; }
  .form .form-item input::placeholder {
    color: #dfdfdf; }
  .form .form-item input + p {
    font-size: 12px;
    margin: -16px 20px 20px;
    font-weight: 100; }
.form .form-item textarea {
  display: block;
  margin: 8px 0 20px;
  width: 100%;
  border: #e2e2e2 solid 2px;
  resize: none;
  height: 200px;
  border-radius: 4px;
  font-family: "Hind", "Noto Sans JP", sans-serif; }

.btn {
  background-color: #6b86cb;
  border: #6b86cb solid 2px;
  border-radius: 25px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFF;
  font-weight: bold;
  height: 55px;
  text-decoration: none;
  margin: 40px 0 0;
  padding-top: 3px; }
  .btn.background-none {
    background-color: #FFF;
    color: #6b86cb; }
  .btn.radius-none {
    border-radius: 6px; }
  .btn.pink {
    background-color: #e679a8;
    border-color: #e679a8; }
  .btn.red {
    background-color: #d58687;
    border-color: #d58687; }
  .btn.blood {
    background-color: #ea4948;
    border-color: #ea4948; }
  .btn.yellow {
    background-color: #dbe928;
    border-color: #dbe928;
    color: #383838; }

.grid-table {
  display: grid;
  grid-template-columns: 130px auto;
  font-size: 12px;
  border: #c9c9c9 solid 1px;
  border-radius: 8px; }
  .grid-table__header, .grid-table__cell {
    border-bottom: #c9c9c9 solid 1px;
    padding: 20px 12px; }
    .grid-table__header.last, .grid-table__cell.last {
      border-bottom: none; }
  .grid-table__header {
    border-right: #c9c9c9 solid 1px;
    font-weight: bold;
    background-color: #ededed; }
    .grid-table__header.first {
      border-top-left-radius: 8px; }
    .grid-table__header.last {
      border-bottom-left-radius: 8px; }
  .grid-table__cell a {
    color: #4257c7;
    text-decoration: underline;
    font-weight: bold; }
  .grid-table__cell.first {
    border-top-right-radius: 8px; }
  .grid-table__cell.last {
    border-bottom-right-radius: 8px; }

.point {
  border: #3c3c3c solid 2px;
  border-radius: 6px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  margin: 20px 20px 0; }
  .point-label {
    margin-right: 20px;
    padding-top: 4px; }
  .point-value span {
    font-size: 22px;
    margin-right: 4px; }

#tabs {
  background-color: #FFF;
  padding: 0 20px;
  display: flex;
  position: relative;
  box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.5); }
  #tabs .tab {
    color: #aaa;
    font-weight: bold;
    width: 50%;
    text-align: center;
    padding: 20px 0;
    position: relative;
    cursor: pointer; }
    #tabs .tab.active {
      color: #696969; }
      #tabs .tab.active::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 6px;
        border-radius: 10px;
        background-color: #b2bdd9; }

.main-list {
  padding: 20px 12px;
  background-color: #f4f4f4; }
  .main-list ul {
    margin: 0;
    padding: 0;
    display: none; }
    .main-list ul li {
      list-style: none;
      background-color: #FFF;
      border-radius: 8px;
      margin: 20px 0 0;
      box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.5); }
      .main-list ul li .name {
        font-size: 16px;
        font-weight: bold;
        padding: 16px 8px;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px; }
      .main-list ul li .img {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center; }
      .main-list ul li .bottom {
        background-color: #FFF;
        padding: 36px 20px 20px;
        position: relative;
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px; }
        .main-list ul li .bottom a {
          background-color: #b2bdd9;
          display: flex;
          width: 100%;
          align-items: center;
          justify-content: center;
          height: 55px;
          color: #FFF;
          text-decoration: none;
          border-radius: 8px; }
      .main-list ul li:first-of-type {
        margin: 0; }
    .main-list ul.active {
      display: block; }

.progress-box {
  position: absolute;
  top: -13px;
  left: 20px;
  width: calc(100% - 40px);
  border: solid 1px #c4c4c4;
  background-color: #f4f4f4;
  height: 26px; }
  .progress-box__bar {
    background-color: #7dd981;
    height: 100%;
    display: block; }
  .progress-box .money {
    padding: 0 12px;
    display: flex;
    align-items: center;
    border-radius: 12px;
    border: solid 1px #c4c4c4;
    justify-content: center;
    background-color: #FFF;
    height: 26px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: -18px;
    font-family: "Hind", sans-serif;
    font-weight: bold; }
    .progress-box .money img {
      width: 20px;
      margin: -3px 2px 0 4px; }
    .progress-box .money span {
      font-size: 12px;
      line-height: 1; }

.user-info {
  margin-top: 20px; }
  .user-info-box__header, .user-info-box__body {
    border: #f7f7f7 solid 1px; }
  .user-info-box__header {
    background-color: #f7f7f7;
    line-height: 1;
    padding: 5px 20px 0;
    font-weight: bold;
    height: 40px;
    display: flex;
    align-items: center; }
  .user-info-box__body {
    padding: 20px 12px 12px 20px; }
    .user-info-box__body p.label {
      font-size: 12px;
      font-weight: bold; }
    .user-info-box__body p.value {
      margin: 2px 0 20px; }
      .user-info-box__body p.value.non {
        margin-bottom: 8px; }
    .user-info-box__body .change-btn {
      text-align: right; }
      .user-info-box__body .change-btn .btn {
        border-radius: 0;
        display: inline-flex;
        height: 28px;
        font-weight: normal;
        font-size: 12px;
        width: auto;
        margin: 0;
        padding: 3px 12px 0;
        background-color: #FFF;
        color: #6b86cb;
        border-width: 1px; }

.support-box {
  border-radius: 6px;
  padding: 12px 20px;
  box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px; }
  .support-box .header {
    font-weight: bold;
    font-size: 16px; }
  .support-box .support-num {
    font-weight: bold;
    margin: 12px 0;
    line-height: 1;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: center; }
    .support-box .support-num .text {
      font-size: 20px; }
    .support-box .support-num .num {
      font-size: 40px;
      margin: 0 4px;
      color: #4d92be; }
      .support-box .support-num .num + .text {
        margin-left: 4px; }
  .support-box .progress-bar {
    height: 26px;
    background-color: #f4f4f4;
    border-radius: 25px;
    position: relative; }
    .support-box .progress-bar span {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      border-radius: 25px;
      background-image: linear-gradient(0deg, #fcd6e4, #d7e9fb); }
  .support-box .goal-num {
    text-align: right;
    margin-top: 8px;
    font-size: 12px;
    font-weight: bold; }
    .support-box .goal-num span {
      font-size: 20px;
      margin: 0 4px; }

#drawer-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease-in-out;
  z-index: 1000; }
  #drawer-background.active {
    opacity: 1;
    visibility: visible; }

#drawer {
  position: fixed;
  top: 0;
  right: -300px;
  width: 300px;
  height: 100vh;
  background-color: #fff;
  box-shadow: -2px 0 4px rgba(0, 0, 0, 0.1);
  transition: 0.3s ease-in-out;
  z-index: 1001; }
  #drawer.active {
    right: 0; }

.drawer-nav {
  padding: 80px 20px 20px;
  position: relative; }
  .drawer-nav .drawer-close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0; }
    .drawer-nav .drawer-close span {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: 2px;
      background-color: #333; }
      .drawer-nav .drawer-close span:nth-child(1) {
        transform: translate(-50%, -50%) rotate(45deg); }
      .drawer-nav .drawer-close span:nth-child(2) {
        transform: translate(-50%, -50%) rotate(-45deg); }
  .drawer-nav ul {
    margin: 0;
    padding: 0;
    list-style: none; }
    .drawer-nav ul li {
      margin-bottom: 20px;
      border-bottom: 1px solid #e5e5e5;
      padding-bottom: 20px; }
      .drawer-nav ul li:last-child {
        margin-bottom: 0;
        border-bottom: none; }
      .drawer-nav ul li a {
        display: block;
        color: #333;
        text-decoration: none;
        font-size: 16px; }

/* スクロール防止 */
body.no-scroll {
  overflow: hidden; }

#header #hamburger-trigger {
  position: relative;
  width: 30px;
  height: 24px;
  cursor: pointer;
  z-index: 1001; }
  #header #hamburger-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #333;
    transition: 0.3s ease-in-out; }
    #header #hamburger-trigger span:nth-child(1) {
      top: 0; }
    #header #hamburger-trigger span:nth-child(2) {
      top: 11px; }
    #header #hamburger-trigger span:nth-child(3) {
      bottom: 0; }
  #header #hamburger-trigger.active span:nth-child(1) {
    transform: translateY(11px) rotate(-45deg); }
  #header #hamburger-trigger.active span:nth-child(2) {
    opacity: 0; }
  #header #hamburger-trigger.active span:nth-child(3) {
    transform: translateY(-11px) rotate(45deg); }

#header {
  background-image: linear-gradient(90deg, #d7e9fb, #fcd6e4);
  font-size: 12px;
  position: fixed;
  top: 0;
  z-index: 10;
  width: 100%;
  box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.5); }
  #header .inner {
    display: flex;
    align-items: center;
    height: 55px; }
    #header .inner .logo {
      width: 100px; }
    #header .inner a {
      text-decoration: none; }
  #header .btn {
    border-radius: 25px;
    background-color: inherit;
    color: #FFF;
    margin: 0 3px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    border-style: solid;
    border-width: 1px; }
    #header .btn.regist {
      margin-left: auto;
      background-color: #9fb9d5;
      border-color: #9fb9d5; }
    #header .btn.login {
      border-color: #FFF; }
  #header .coin {
    margin-left: auto;
    display: flex;
    background-color: #FFF;
    border-radius: 25px;
    padding: 0 36px 0 6px;
    height: 30px;
    align-items: center;
    justify-content: center;
    color: #696969;
    position: relative; }
    #header .coin .icon {
      min-width: 24px;
      height: 24px;
      margin-top: 3px; }
    #header .coin .num {
      margin: 2px 0 0 30px;
      font-size: 16px;
      font-weight: bold;
      line-height: 1; }
      #header .coin .num span {
        font-size: 14px; }
    #header .coin .plus {
      background-color: #ef3233;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      position: absolute;
      top: 50%;
      right: 6px;
      margin-top: -8px; }
      #header .coin .plus::before, #header .coin .plus::after {
        position: absolute;
        top: 50%;
        left: 50%;
        content: '';
        display: inline-block;
        background-color: #FFF;
        transform: translate(-50%, -50%); }
      #header .coin .plus::before {
        width: 10px;
        height: 2px; }
      #header .coin .plus::after {
        height: 10px;
        width: 2px; }
  #header .mypage {
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #FFF; }
    #header .mypage .icon {
      line-height: 1; }
      #header .mypage .icon svg {
        fill: #FFF; }
    #header .mypage .text {
      font-size: 11px;
      line-height: 1; }
  #header #hamburger-trigger {
    position: relative;
    width: 15px;
    height: 20px;
    cursor: pointer;
    display: inline-block;
    transition: all .5s;
    box-sizing: border-box;
    margin-left: 10px; }
    #header #hamburger-trigger span {
      position: absolute;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: #fff;
      border-radius: 4px;
      display: inline-block;
      transition: all .5s;
      box-sizing: border-box; }
      #header #hamburger-trigger span:nth-of-type(1) {
        top: calc(50% - 7px); }
      #header #hamburger-trigger span:nth-of-type(2) {
        top: calc(50% - 1px); }
      #header #hamburger-trigger span:nth-of-type(3) {
        top: calc(50% + 5px); }

#footer {
  background-image: linear-gradient(90deg, #d7e9fb, #fcd6e4);
  font-size: 12px;
  padding: 20px 0; }
  #footer .footer-content {
    display: flex; }
    #footer .footer-content .left,
    #footer .footer-content .right {
      flex: 1; }
  #footer ul {
    margin: 0;
    padding: 0; }
    #footer ul li {
      list-style: none;
      margin-top: 12px;
      font-weight: bold;
      text-decoration: none;
      color: #FFF; }
      #footer ul li a {
        font-weight: bold;
        text-decoration: none;
        color: #FFF; }
      #footer ul li:first-of-type {
        margin-top: 0; }
      #footer ul li > ul {
        margin-top: 12px;
        margin-left: 20px; }
  #footer .logo {
    text-align: center;
    margin: 60px auto 20px;
    width: 200px; }
    #footer .logo a {
      display: inline-block; }
  #footer .copy {
    color: #FFF;
    font-size: 10px;
    text-align: center; }

#funding {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 300px;
  background-color: #656565;
  color: #FFF;
  width: calc(100% + 40px);
  margin: 0 0 0 -20px; }
  #funding .swiper-button-next:after,
  #funding .swiper-button-prev:after {
    color: #FFF; }

#gacha {
  width: calc(100% + 40px);
  margin: 0 0 0 -20px; }

#faq {
  width: calc(100% + 40px);
  margin: 20px 0 0 -20px; }
  #faq .accordion {
    padding: 0 12px; }
    #faq .accordion-item {
      border-bottom: #f7f7f7 solid 1px;
      padding: 20px 40px;
      position: relative; }
      #faq .accordion-item__title {
        font-weight: bold;
        position: relative; }
        #faq .accordion-item__title img {
          position: absolute;
          left: -28px;
          top: -1px;
          width: 20px; }
        #faq .accordion-item__title::after {
          content: "";
          color: #656565;
          line-height: 1;
          width: 8px;
          height: 8px;
          border: 1px solid currentColor;
          border-left: 0;
          border-bottom: 0;
          box-sizing: border-box;
          transform: translateY(-50%) rotate(135deg);
          position: absolute;
          right: -28px;
          top: 50%; }
      #faq .accordion-item__text {
        font-size: 12px;
        line-height: 1.6;
        padding: 20px 0 0;
        display: none; }
      #faq .accordion-item.active .accordion-item__title::after {
        transform: translateY(-50%) rotate(-45deg); }
      #faq .accordion-item.active .accordion-item__text {
        display: block; }

#forget .form .check-area,
#login .form .check-area,
#regist .form .check-area {
  width: 220px;
  margin: auto; }
  #forget .form .check-area .check-item,
  #login .form .check-area .check-item,
  #regist .form .check-area .check-item {
    margin: 8px 0 0; }
    #forget .form .check-area .check-item label,
    #login .form .check-area .check-item label,
    #regist .form .check-area .check-item label {
      display: flex;
      align-items: center;
      font-size: 12px; }
      #forget .form .check-area .check-item label input,
      #login .form .check-area .check-item label input,
      #regist .form .check-area .check-item label input {
        border-radius: 4px;
        border: #e2e2e2 solid 1px;
        margin: 0 4px 0 0; }
      #forget .form .check-area .check-item label a,
      #login .form .check-area .check-item label a,
      #regist .form .check-area .check-item label a {
        color: #485cc9;
        text-decoration: underline; }
#forget .form .note-box,
#login .form .note-box,
#regist .form .note-box {
  margin: 12px 0 0; }
  #forget .form .note-box ul,
  #login .form .note-box ul,
  #regist .form .note-box ul {
    margin: 0;
    padding: 0; }
    #forget .form .note-box ul li,
    #login .form .note-box ul li,
    #regist .form .note-box ul li {
      list-style: none;
      font-size: 10px;
      padding: 0 0 0 12px;
      position: relative; }
      #forget .form .note-box ul li::before,
      #login .form .note-box ul li::before,
      #regist .form .note-box ul li::before {
        content: "※";
        position: absolute;
        left: 0;
        top: 0; }
#forget .form .password-reset,
#login .form .password-reset,
#regist .form .password-reset {
  text-align: center;
  margin: 20px 0 60px; }
  #forget .form .password-reset a,
  #login .form .password-reset a,
  #regist .form .password-reset a {
    color: #6b86cb;
    text-decoration: underline;
    font-size: 12px; }
#forget .form .beginner p,
#login .form .beginner p,
#regist .form .beginner p {
  text-align: center;
  font-size: 12px;
  margin-bottom: -30px; }

#forget .forgot-text {
  padding: 0;
  margin: 0 0 40px; }
  #forget .forgot-text li {
    padding: 0 0 0 14px;
    position: relative;
    list-style: none;
    font-size: 12px; }
    #forget .forgot-text li::before {
      content: "※";
      position: absolute;
      left: 0;
      top: 0; }

#regal .block {
  margin: 20px 0 0; }
  #regal .block p {
    margin: 0 0 10px; }
    #regal .block p.block-header {
      margin: 0 0 4px;
      font-weight: bold; }
  #regal .block:first-of-type {
    margin: 0; }
  #regal .block .bank {
    margin-bottom: 6px; }
    #regal .block .bank-item {
      display: flex;
      align-items: center;
      margin: 0 0 4px; }
      #regal .block .bank-item__label {
        width: 80px;
        min-width: 80px;
        max-width: 80px;
        text-align: right; }
      #regal .block .bank-item__value {
        flex: 1; }
  #regal .block .top-img {
    display: flex;
    align-items: center; }
    #regal .block .top-img img {
      height: 18px;
      margin-left: 6px; }
  #regal .block .under-img {
    display: flex;
    margin-top: 12px; }
    #regal .block .under-img img {
      height: 20px;
      margin-right: 6px; }
  #regal .block.last {
    margin-top: 40px; }
    #regal .block.last p::before {
      content: "※"; }

#terms p {
  font-size: 12px;
  line-height: 1.8; }
#terms .scroll-area {
  overflow: scroll;
  height: 300px;
  border: #c9c9c9 solid 1px;
  border-radius: 4px;
  padding: 20px;
  margin: 20px 0 0; }
  #terms .scroll-area ol {
    list-style: none;
    padding: 0;
    margin: 0; }
    #terms .scroll-area ol li .heading {
      font-weight: bold;
      margin: 30px 0 10px; }
    #terms .scroll-area ol li ul {
      padding: 0 0 0 24px;
      list-style: disc; }
      #terms .scroll-area ol li ul li {
        font-size: 12px;
        margin: 5px 0;
        line-height: 1.8; }
    #terms .scroll-area ol li:first-of-type .heading {
      margin-top: 0; }

#howto p {
  font-size: 12px; }
#howto .flow {
  margin-top: 20px; }
  #howto .flow-content {
    margin-top: 40px;
    position: relative; }
    #howto .flow-content__header {
      font-size: 16px;
      font-weight: bold;
      position: relative;
      padding: 0 0 0 40px; }
      #howto .flow-content__header span {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-image: linear-gradient(150deg, #d7e9fb, #fcd6e4);
        border-radius: 50%;
        color: #FFF;
        font-size: 18px;
        padding-top: 2px; }
    #howto .flow-content__body {
      margin: 12px 0 0 40px;
      border-radius: 8px;
      padding: 16px 16px 14px;
      font-size: 12px;
      box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px; }
    #howto .flow-content::before {
      content: "";
      position: absolute;
      left: 14px;
      top: 0;
      height: calc(100% + 40px);
      width: 2px;
      background-color: #dee4f6; }
    #howto .flow-content ul {
      padding: 0;
      margin: 10px 0 0 50px;
      list-style: none; }
      #howto .flow-content ul li {
        font-size: 12px;
        font-weight: bold;
        color: #adadad;
        position: relative;
        padding: 0 0 0 14px; }
        #howto .flow-content ul li::before {
          content: "※";
          position: absolute;
          top: 0;
          left: 0; }
    #howto .flow-content:first-of-type {
      margin-top: 0; }
    #howto .flow-content:last-of-type .flow-content__header span {
      width: 20px;
      height: 20px;
      left: 5px;
      top: 0;
      transform: unset; }
    #howto .flow-content:last-of-type::before {
      display: none; }

#privacy p {
  font-size: 12px;
  line-height: 1.8; }
#privacy ol {
  list-style: none;
  padding: 0;
  margin: 20px 0; }
  #privacy ol li .heading {
    font-weight: bold;
    margin: 30px 0 10px; }
  #privacy ol li ol,
  #privacy ol li ul {
    padding: 0 0 0 24px;
    list-style: lower-latin; }
    #privacy ol li ol li,
    #privacy ol li ul li {
      font-size: 12px;
      margin: 5px 0;
      line-height: 1.8; }
  #privacy ol li ul {
    list-style: disc; }
  #privacy ol li:first-of-type .heading {
    margin-top: 0; }

#mypage .name {
  text-align: center; }
#mypage .btn.buy-point {
  border-radius: 6px; }
  #mypage .btn.buy-point span {
    width: 30px;
    height: 30px;
    margin: 2px 2px 0 0; }
#mypage .buy-point__notes {
  color: #ff5d5d;
  font-weight: bold;
  text-align: center;
  margin-top: 20px; }
#mypage .logout-text {
  text-align: center;
  margin-top: 40px; }
  #mypage .logout-text a {
    font-size: 12px;
    color: inherit; }

#purchase .purchase-notes {
  margin-top: 20px;
  font-size: 12px; }
#purchase .purchase-list {
  margin-top: 5px; }
  #purchase .purchase-list-content {
    display: flex;
    align-items: center;
    height: 70px;
    padding: 0 20px;
    border-radius: 6px;
    margin-top: 15px;
    box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px; }
    #purchase .purchase-list-content .icon {
      min-width: 60px;
      max-width: 60px; }
    #purchase .purchase-list-content .text {
      flex: 1;
      margin: 0 12px 0 20px; }
      #purchase .purchase-list-content .text p {
        line-height: 1; }
        #purchase .purchase-list-content .text p:first-of-type {
          font-size: 22px;
          font-weight: bold; }
          #purchase .purchase-list-content .text p:first-of-type span {
            font-size: 14px; }
        #purchase .purchase-list-content .text p:last-of-type {
          color: #939393;
          margin-top: 6px; }
    #purchase .purchase-list-content .btn {
      font-size: 12px;
      height: 28px;
      padding: 3px 0 0;
      border-radius: 2px;
      margin: 0;
      width: 60px;
      display: flex;
      align-items: center;
      justify-content: center; }

#member .member-list {
  display: flex;
  gap: 18px;
  flex-wrap: wrap; }
  #member .member-list .member {
    width: calc(50% - 9px); }
    #member .member-list .member-box {
      box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px;
      border-radius: 6px;
      padding: 12px 20px; }
    #member .member-list .member-img {
      position: relative;
      width: 100%;
      padding-top: 100%;
      border-radius: 50%;
      background-color: #656565;
      overflow: hidden;
      box-shadow: 8px 4px 0 0 #d5e9fb; }
    #member .member-list .member-name__jp {
      text-align: center;
      margin: 20px 0 6px;
      font-weight: bold;
      font-size: 18px;
      line-height: 1; }
    #member .member-list .member-name__en {
      text-align: center;
      color: #bebebe;
      font-size: 12px;
      line-height: 1;
      font-weight: bold; }
    #member .member-list .member-text {
      margin: 20px 0 0;
      font-size: 12px; }
    #member .member-list .member .btn {
      text-align: center;
      height: 70px;
      margin-top: 8px; }
    #member .member-list .member:nth-of-type(even) .member-img {
      box-shadow: 8px 4px 0 0 #fcd6e5; }

#crowdfunding .overview,
#crowdfunding .do,
#crowdfunding .comments,
#crowdfunding .return,
#crowdfunding .schedule,
#crowdfunding .last {
  margin-top: 40px; }
  #crowdfunding .overview .header,
  #crowdfunding .do .header,
  #crowdfunding .comments .header,
  #crowdfunding .return .header,
  #crowdfunding .schedule .header,
  #crowdfunding .last .header {
    font-size: 16px;
    font-weight: bold;
    position: relative;
    padding: 4px 18px 0; }
    #crowdfunding .overview .header::before,
    #crowdfunding .do .header::before,
    #crowdfunding .comments .header::before,
    #crowdfunding .return .header::before,
    #crowdfunding .schedule .header::before,
    #crowdfunding .last .header::before {
      content: "";
      width: 6px;
      height: 100%;
      background-color: #656565;
      position: absolute;
      left: 0;
      top: 0; }
  #crowdfunding .overview .sub,
  #crowdfunding .do .sub,
  #crowdfunding .comments .sub,
  #crowdfunding .return .sub,
  #crowdfunding .schedule .sub,
  #crowdfunding .last .sub {
    font-weight: bold;
    margin-top: 20px; }
    #crowdfunding .overview .sub + .body,
    #crowdfunding .do .sub + .body,
    #crowdfunding .comments .sub + .body,
    #crowdfunding .return .sub + .body,
    #crowdfunding .schedule .sub + .body,
    #crowdfunding .last .sub + .body {
      margin-top: 10px; }
  #crowdfunding .overview .body,
  #crowdfunding .do .body,
  #crowdfunding .comments .body,
  #crowdfunding .return .body,
  #crowdfunding .schedule .body,
  #crowdfunding .last .body {
    padding: 0;
    margin-top: 20px; }
#crowdfunding .do .header,
#crowdfunding .comments .header {
  padding-left: 32px; }
  #crowdfunding .do .header::before,
  #crowdfunding .comments .header::before {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 50%;
    left: 0;
    transform: translateY(-50%); }
#crowdfunding .do .img,
#crowdfunding .comments .img {
  margin-top: 20px; }
#crowdfunding .comments .comment {
  display: flex;
  gap: 8px;
  margin-top: 20px; }
  #crowdfunding .comments .comment .liver {
    width: 100px;
    min-width: 100px;
    max-width: 100px; }
    #crowdfunding .comments .comment .liver .img {
      border-radius: 50%;
      width: 100px;
      height: 100px;
      background-color: #656565;
      margin: 0 0 8px; }
    #crowdfunding .comments .comment .liver .name-ja {
      text-align: center;
      font-weight: bold; }
    #crowdfunding .comments .comment .liver .name-en {
      text-align: center;
      font-size: 10px;
      color: #c6c6c6; }
  #crowdfunding .comments .comment .text {
    padding: 12px 12px 6px 12px;
    font-size: 12px;
    border-radius: 12px;
    box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px; }
  #crowdfunding .comments .comment:nth-of-type(odd) {
    flex-direction: row-reverse; }
#crowdfunding .schedule .header + .list {
  margin-top: 20px; }
#crowdfunding .schedule .list {
  display: flex;
  margin: 10px 0; }
  #crowdfunding .schedule .list .day {
    width: 80px;
    min-width: 80px;
    max-width: 80px;
    font-weight: bold; }
  #crowdfunding .schedule .list .text {
    flex: 1; }
#crowdfunding .message {
  margin-top: 40px;
  font-weight: bold;
  font-size: 18px; }
#crowdfunding #slider {
  margin-bottom: 20px; }
  #crowdfunding #slider .swiper {
    width: 100%;
    margin-left: auto;
    margin-right: auto; }
  #crowdfunding #slider .swiper-main {
    height: 300px;
    margin-bottom: 10px; }
  #crowdfunding #slider .swiper-thumbs {
    height: 80px;
    overflow-x: auto; }
    #crowdfunding #slider .swiper-thumbs::-webkit-scrollbar {
      height: 4px; }
    #crowdfunding #slider .swiper-thumbs::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 2px; }
    #crowdfunding #slider .swiper-thumbs::-webkit-scrollbar-thumb {
      background: #888;
      border-radius: 2px; }
    #crowdfunding #slider .swiper-thumbs .swiper-wrapper {
      flex-wrap: nowrap; }
    #crowdfunding #slider .swiper-thumbs .swiper-slide {
      width: 80px !important;
      min-width: 80px;
      opacity: 0.4;
      cursor: pointer; }
      #crowdfunding #slider .swiper-thumbs .swiper-slide-thumb-active {
        opacity: 1; }

#conversion #tabs {
  width: calc(100% + 40px);
  margin-left: -20px; }
#conversion .main-list ul {
  flex-wrap: wrap;
  gap: 30px 12px; }
  #conversion .main-list ul li {
    width: calc(50% - 6px);
    margin: 0;
    padding: 12px 12px 30px;
    position: relative; }
    #conversion .main-list ul li .img {
      border-radius: 8px; }
      #conversion .main-list ul li .img img {
        border-radius: 8px; }
    #conversion .main-list ul li .name {
      font-size: 14px; }
    #conversion .main-list ul li .possession {
      padding: 0 8px; }
    #conversion .main-list ul li .check-box {
      display: flex;
      align-items: center;
      border-radius: 50px;
      border: solid 1px #c4c4c4;
      justify-content: center;
      background-color: #FFF;
      height: 34px;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      bottom: -17px;
      font-weight: bold;
      padding: 0 8px; }
      #conversion .main-list ul li .check-box input {
        margin: 0; }
      #conversion .main-list ul li .check-box .i {
        margin: 3px 4px 0;
        line-height: 1;
        display: flex;
        align-items: center; }
        #conversion .main-list ul li .check-box .i span {
          font-size: 12px;
          min-width: 45px; }
        #conversion .main-list ul li .check-box .i img {
          width: 20px;
          min-width: 20px;
          margin: -3px 2px 0 0; }
        #conversion .main-list ul li .check-box .i svg {
          fill: #b8ec41;
          margin-top: -2px; }
      #conversion .main-list ul li .check-box .num {
        font-family: "Hind", sans-serif;
        line-height: 1;
        font-size: 18px;
        margin-top: 4px; }
  #conversion .main-list ul.active {
    display: flex; }
#conversion .main-list#main-list {
  padding-bottom: 40px;
  width: calc(100% + 40px);
  margin-left: -20px; }
#conversion .under-content {
  width: calc(100% + 40px);
  margin-left: -20px;
  box-shadow: 0 -5px 5px -5px rgba(0, 0, 0, 0.5);
  padding: 20px 20px 0; }
  #conversion .under-content .choice-num {
    font-size: 18px;
    font-weight: bold;
    display: flex;
    align-items: baseline;
    line-height: 1; }
    #conversion .under-content .choice-num #subject-num {
      color: #f22b2c;
      font-family: "Hind", sans-serif;
      font-size: 40px;
      margin-right: 4px;
      position: relative;
      top: 2px; }
  #conversion .under-content .choice-content .main-list {
    overflow: scroll;
    background-color: #FFF; }
    #conversion .under-content .choice-content .main-list ul {
      flex-wrap: nowrap;
      display: flex; }
      #conversion .under-content .choice-content .main-list ul li {
        width: 170px;
        min-width: 170px;
        max-width: 170px;
        box-shadow: 0 -3px 5px -5px rgba(0, 0, 0, 0.5), -3px 5px 5px -5px rgba(0, 0, 0, 0.5), 3px 5px 5px -5px rgba(0, 0, 0, 0.5); }
  #conversion .under-content .send-area .head {
    display: flex;
    font-weight: bold; }
    #conversion .under-content .send-area .head i {
      margin-right: 8px;
      margin-top: -2px; }
      #conversion .under-content .send-area .head i svg {
        fill: #b2bdd9; }
  #conversion .under-content .send-area .notes {
    color: #f70e09;
    font-size: 10px;
    margin-top: 10px; }
#conversion .change-content {
  margin-top: 50px; }
  #conversion .change-content .head {
    font-weight: bold;
    display: flex; }
    #conversion .change-content .head i {
      margin-right: 8px;
      margin-top: -3px; }
      #conversion .change-content .head i svg {
        fill: #b8ec41; }

#gacha-page .title {
  text-align: left;
  font-size: 22px;
  color: #3c3c3c; }
  #gacha-page .title::before {
    display: none; }
#gacha-page .date {
  display: block;
  margin: 6px 0;
  font-size: 16px; }
#gacha-page .notes {
  font-size: 14px;
  color: #9f9f9f; }
#gacha-page .content .info-box {
  padding: 20px; }
  #gacha-page .content .info-box .title {
    text-align: center;
    font-size: 28px; }
  #gacha-page .content .info-box .notes {
    text-align: center;
    font-size: 16px;
    font-weight: bold; }
#gacha-page .content h2 {
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 4px 18px 0;
  margin-top: 40px; }
  #gacha-page .content h2::before {
    content: "";
    width: 6px;
    height: 100%;
    background-color: #656565;
    position: absolute;
    left: 0;
    top: 0; }
  #gacha-page .content h2 + p {
    padding: 0;
    margin-top: 20px; }
#gacha-page .content .lineup {
  border-radius: 6px;
  padding: 20px;
  margin: 20px 0;
  box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px; }
  #gacha-page .content .lineup .name-img {
    margin-bottom: 8px; }
  #gacha-page .content .lineup .title {
    color: #696969;
    font-size: 16px; }
  #gacha-page .content .lineup .img {
    margin: 8px 0; }
#gacha-page .content h3 {
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 4px 18px 0 32px;
  margin-top: 40px; }
  #gacha-page .content h3::before {
    content: "";
    background-color: #656565;
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 50%;
    left: 0;
    transform: translateY(-50%); }
#gacha-page .content .detail-img {
  margin: 10px 0;
  border-radius: 8px;
  overflow: hidden; }
#gacha-page #fixed-content {
  position: fixed;
  bottom: 10px;
  z-index: 9;
  width: calc(100% - 40px);
  left: 20px;
  background-color: #FFF;
  border-radius: 12px;
  box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.5); }
  #gacha-page #fixed-content .relative {
    padding: 20px 20px 12px;
    position: relative; }
    #gacha-page #fixed-content .relative .btns {
      display: flex;
      gap: 20px; }
      #gacha-page #fixed-content .relative .btns .btn {
        margin-top: 0; }
        #gacha-page #fixed-content .relative .btns .btn span {
          font-size: 30px;
          display: inline-block;
          position: relative;
          top: -2px;
          margin-right: 4px; }

#result h2 {
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 4px 18px 0;
  margin-top: 40px; }
  #result h2 + p {
    padding: 0;
    margin-top: 20px; }
#result .result-box p {
  text-align: center;
  font-size: 18px;
  font-weight: bold; }
#result .result-box .result-img {
  margin: 20px 0; }
  #result .result-box .result-img img {
    margin: auto; }
#result .result-box .item-img {
  margin: 20px 0; }
#result .result-box .coin-box .row {
  display: flex;
  align-items: center; }
  #result .result-box .coin-box .row .left,
  #result .result-box .coin-box .row .right {
    width: 50%; }
  #result .result-box .coin-box .row .left {
    text-align: right; }
  #result .result-box .coin-box .row .right {
    font-weight: bold;
    font-size: 16px; }
    #result .result-box .coin-box .row .right span {
      font-size: 22px; }
#result .result-box .btns {
  display: flex;
  gap: 20px; }
  #result .result-box .btns .btn span {
    font-size: 30px;
    display: inline-block;
    position: relative;
    top: -2px;
    margin-right: 4px; }

/*# sourceMappingURL=main.css.map */

/*added==================*/
.required {
	color:#d68273;	
}

.space-6 {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 6px 0 5px;
}
[class*="vspace-6"] {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 6px 0 5px 0;
}

.space-10 {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 10px 0 9px;
}
[class*="vspace-10"] {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 10px 0 9px 0;
}

.space-20 {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 20px 0 19px;
}
[class*="vspace-20"] {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 20px 0 19px 0;
}

.space-30 {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 30px 0 29px;
}
[class*="vspace-30"] {
  max-height: 1px;
  min-height: 1px;
  overflow: hidden;
  margin: 12px 0;
  margin: 30px 0 29px 0;
}

/*added==================*/