@charset "utf-8";

.tk2-cart__scene {
  padding-right: 15px;
  padding-left: 15px;
}

.tk2-cart .tk2-cart__btn--payment,
.tk2-cart .tk2-cart__btn--next,
.tk2-cart .tk2-cart__btn--back,
.tk2-cart .tk2-cart__btn--submit {
  transition: 0.3s;
}

.tk2-cart .tk2-cart__btn--payment:hover,
.tk2-cart .tk2-cart__btn--next:hover,
.tk2-cart .tk2-cart__btn--back:hover,
.tk2-cart .tk2-cart__btn--submit:hover {
  background: #304772;
  border-color: #304772;
}

.tk2-cart__scene .tk2-cart__btn-auth {
  display: flex;
  flex-wrap: wrap;
  width: fit-content;
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #2475e2;
  background: #fff;
  gap: 10px;
}
.tk2-cart__scene .tk2-cart__btn-auth a {
  color: #2475e2;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.tk2-cart__scene .tk2-cart__btn-auth span {
  font-weight: bold;
  color: #f25757;
}

/* リンク決済対応 */
.tk2-cart__link-pay {
  font-size: 14px;
  margin: 15px 0 0;
}

.tk2-cart__link-caution[data-type="manual"] {
  display: none;
}
.tk2-cart__link-pay[data-display="hide"] .tk2-cart__link-caution[data-type="manual"] {
  display: block;
  margin-top: 8px;
  padding: 0;
}
.tk2-cart__link-pay[data-display="hide"] .tk2-cart__link-step {
  display: none;
}

.tk2-cart__link-pay p:not(:last-of-type) {
  margin:0 0 12px;
}
.tk2-cart__link-pay dt {
  margin: 0 0 8px;
}
.tk2-cart__link-pay dd:not(:last-of-type) {
  margin: 0 0 8px;
}
.tk2-cart__link-pay dd.tk2-cart__link-step {
  margin: 0;
}
.tk2-cart__link-pay dd.tk2-cart__link-caution {  
  margin: 0;
}
.tk2-cart__link-pay .tk2-cart__link-caution strong {
  font-weight: bold;
}
.tk2-cart__link-pay-toggle {
  color: #2475e2;
  cursor: pointer;
  font-size: 14px;
}
.tk2-cart__link-pay-toggle span span {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.tk2-cart__link-pay-toggle > span::after {
  content: '▲';
  margin: 0 0 0 2px;
  font-size: 12px;
}
.tk2-cart__link-pay[data-display="hide"] .tk2-cart__link-pay-toggle > span::after {
  content: '▼';
}
.tk2-cart__link-pay ol {
  margin: 0;
  padding: 0 0 0 20px;
  list-style: decimal;
}
.tk2-cart__link-pay ol li {
  margin: 5px 0 0;
  list-style: decimal;
}
.tk2-cart__link-step {
  padding: 16px;
  background: #fff;
}
.tk2-cart__link-step-img img {
  display: block;
  max-width: 100%;
  height: auto;
}

.tk2-cart__link-step-list {
  margin-bottom: 0;
  padding: 16px 0;
  background: #fff;
}
.tk2-cart__link-step-list > div:not(:first-child) {
  margin-top: 10px;
}
.tk2-cart__link-step-list dt,
.tk2-cart__link-step-list dd {
  margin: 0;
}  
.tk2-cart__link-step-list dt {
  font-weight: bold;
}
.tk2-cart__link-step-list dd {
  padding-left: 1em;
}

.tk2-cart__link-caution {
  margin-top: 10px;
  padding: 16px;
  background: #f9f9f9;
}
.tk2-cart__link-caution strong {
  font-weight: bold;
}
.tk2-cart__link-caution ol {
  margin-top: 0;
  font-weight: normal;
}

/* リンク決済対応（モーダル内） */
.tk2-cart__info-4-section .tk2-cart__link-step-list {
  column-count: unset;
  margin-top: 10px;
}
.tk2-cart__info-4-section .tk2-cart__link-step-list  > div {
  margin-bottom: 0;
}
.tk2-cart__info-4-section .tk2-cart__link-step-list dt {
  font-size: 14px;
}
.tk2-cart__info-4-section .tk2-cart__link-step-list dt::before {
  content: unset;
}

/* リンク決済時の完了画面 */
.tk2-cart__nav-flow {
  &.tk2-cart__nav-flow--4all {
    
    ol {
      grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    li {
      width: 25vw;

      &:nth-child(3)::after,
      &:nth-child(4)::before {
        background-color: #eee;
      }

      &:nth-child(3) span {
        gap: 0;
        color: #2a303d;

        &::before {
          background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC43NTgiIGhlaWdodD0iMTIuMTE4IiB2aWV3Qm94PSIwIDAgMTguNzU4IDEyLjExOCI+CiAgPHBhdGggaWQ9IuODkeOCuV8xMTE1NzQiIGRhdGEtbmFtZT0i44OR44K5IDExMTU3NCIgZD0iTTExNjEuMDcyLDQwNC4zMTlsLTEwLDEwLTcuMzQ3LTcuMzQ3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTE0My4wMjEgLTQwMy42MTIpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIvPgo8L3N2Zz4K);
          background-size: 50% auto;
          width: 50px;
          height: 50px;
          translate: 0 -5px;
        }
      }

      &:last-child {
        span {
          gap: 10px;
          color: #aaa;

          &::before {       
            height: 40px;
            width: 40px;
            background-color: #eee;
            background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23707070" viewBox="0 0 16 16"%3E%3Cpath d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v1h14V4a1 1 0 0 0-1-1zm13 4H1v5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1z"/%3E%3Cpath d="M2 10a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/%3E%3C/svg%3E');
            translate: unset;
          }
        }
      }
    }

    span {
      white-space: nowrap;
    }
  }
}

.tk2-cart__unit-caution-text {
  display: inline-block;
  margin: 0 0 10px;
  padding: 10px;
  border: 1px solid #ff3d2a;
  color: #ff3d2a;
  background: #fff;
  font-weight: bold;
}


.tk2-cart__text-caution {
  color: #ff3d2a;
}

.tk2-cart__strong {
  font-weight: bold;
}


.tk2-cart__unit-howto-linkpay {
  margin: 16px 0 0;
  padding: 16px;
  background: #fff;  
}
.tk2-cart__unit-howto-linkpay strong {
  font-weight: bold;
}

.tk2-cart__unit-howto-linkpay-image {
  max-width: 640px;
  padding: 0 0 10px;
}
.tk2-cart__unit-howto-linkpay-image img {  
  height: auto;
  margin: auto;
}

.tk2-cart__unit-howto-linkpay-image-pc {
  display: block;
  max-width: 545px;
}
.tk2-cart__unit-howto-linkpay-image-sp {
  display: none;
  width: 545px;
  max-width: 100%;
}
@media (max-width: 760px) {
  .tk2-cart__unit-howto-linkpay-image-pc {
    display: none;
  }
  .tk2-cart__unit-howto-linkpay-image-sp {
    display: block;
  }
}

.tk2-cart__unit-howto-linkpay-text {
  margin: 0;
  padding: 0 0 0 20px;
  font-size: 15px;
}

.tk2-cart__unit-howto-linkpay-text li:not(:first-child) {
  margin-top: 5px;
}

.tk2-cart__unit-howto-linkpay-caution {
  font-weight: bold;
  color: #ff3d2a;
}