@charset "UTF-8";
.mainContents {
  max-width: var(--width474);
  margin: auto;
}
.mainContents .page-ttl {
  font-size: 1em;
  display: flex;
  justify-content: center;
  gap: 5px;
  margin-bottom: 45px;
}
.mainContents .cart-page__txt:not(:last-child) {
  margin-bottom: 30px;
}
.mainContents .bag-item-list {
  margin-bottom: 45px;
  text-transform: uppercase;
}
.mainContents .bag-item-list .bag-item {
  display: grid;
  grid-template-columns: 114px calc(100% - 114px - var(--spacing15));
  gap: var(--spacing15);
}
@media (max-width: 63.94em) {
  .mainContents .bag-item-list .bag-item {
    grid-template-columns: 98px calc(100% - 98px - var(--spacing15));
    padding-right: var(--padding15);
  }
}
.mainContents .bag-item-list .bag-item__info {
  padding-top: var(--padding15);
  line-height: var(--lineHeightRate);
}
.mainContents .bag-item-list .bag-item__info__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
  /* p
  {
    line-height: var(--lineHeightRate);
  } */
}
.mainContents .bag-item-list .bag-item__row:not(:last-child) {
  margin-bottom: var(--spacing15);
}
.mainContents .bag-item-list .bag-item__ttl {
  width: 61.9512195122%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 0.8;
}
.mainContents .bag-item-list .bag-item__qty {
  display: flex;
  gap: 40px;
}
.mainContents .bag-item-list .bag-item__delete__button {
  background: none;
  color: unset;
  font-size: unset;
  line-height: unset;
}
.mainContents .bag-item-list .bag-item__delete__button:hover {
  font-weight: bold;
}
.mainContents .bag-item-list .qty {
  position: relative;
}
.mainContents .bag-item-list .qty__input {
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.mainContents .bag-item-list .qty__input * {
  line-height: var(--lineHeightRate);
}
.mainContents .bag-item-list .qty__input .open_select--button {
  display: flex;
  gap: 6px;
  cursor: pointer;
}
.mainContents .bag-item-list .qty__input .open_select--button:after {
  content: "";
  display: block;
  background: url(https://www.ambushdesign.com/assets/front/img/icon/ico-down.svg) no-repeat center center;
  width: 8px;
  height: 8px;
}
.mainContents .bag-item-list .qty__input .open_select--button:hover {
  font-weight: bold;
}
.mainContents .bag-item-list .qty__input:has(.open_select__list[style="display: block;"]) .open_select--button:after {
  background: url(https://www.ambushdesign.com/assets/front/img/icon/ico-up-bold.svg) no-repeat center center;
  background-size: contain;
}
.mainContents .bag-item-list .qty .open_select__list {
  position: absolute;
  bottom: calc(var(--spacing15) * -1);
  right: 0;
  transform: translateY(100%);
  background: white;
  border-radius: 5px;
  padding: var(--padding7) 0;
  border: solid 1px black;
  line-height: var(--lineHeightRate);
  display: none;
}
.mainContents .bag-item-list .qty .open_select__list .quantity_list {
  padding: var(--padding7) var(--padding15);
  cursor: pointer;
}
.mainContents .bag-item-list .qty .open_select__list .quantity_list:hover {
  font-weight: bold;
}
.mainContents .bag-item-list .qty:has(.open_select.on) {
  z-index: 2;
}
.mainContents .bag-item-list .cart_delete {
  text-transform: none;
  text-decoration: underline;
  text-underline-offset: 7px;
}
.mainContents .price-area {
  margin-top: 45px;
  margin-bottom: 45px;
}
.mainContents .price-area .price {
  display: flex;
  justify-content: space-between;
}
.mainContents .price-area .price__ttl {
  text-transform: uppercase;
}
.mainContents .price-area .price:not(:last-child) {
  margin-bottom: 15px;
}
.mainContents .price-area .price * {
  line-height: var(--lineHeightRate);
}
.mainContents .price-area__bottom {
  color: var(--ambushGray);
}
.mainContents .promotion-code-wrap--show {
  text-decoration: underline;
  text-underline-offset: 7px;
}
.mainContents .promotion-code-wrap--show.hide {
  display: none;
}
.mainContents .promotion-code-wrap {
  display: none;
  line-height: var(--lineHeightRate);
}
.mainContents .promotion-code-wrap.show {
  display: block;
}
.mainContents .promotion-code-wrap .promotion-code-input {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  width: 180px;
}
.mainContents .promotion-code-wrap .promotion-code-input::placeholder {
  color: var(--ambushGray);
}
.mainContents .promotion-code-wrap .promotion-code-input-btn {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  color: unset;
  font-size: unset;
  text-decoration: underline;
  text-underline-offset: 7px;
}
.mainContents .promotion-code-wrap .promotion-code {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.mainContents .promotion-code-wrap .promotion-code-other-coupon {
  text-transform: uppercase;
}
@media (max-width: 63.94em) {
  .mainContents .promotion-code-wrap .promotion-code-other-coupon {
    width: 100%;
  }
}
.mainContents .button-list {
  margin-bottom: 30px;
}
.mainContents .button-list .button {
  border-radius: 5px;
  background: black;
  color: white;
  height: var(--height38);
  padding: 0;
  font-weight: normal;
  display: grid;
  place-content: center;
  border: none;
}
.mainContents .button-list .button:hover {
  font-weight: bold;
}
.mainContents .button-list .buttonWhite {
  background: white;
  color: unset;
  border: solid 1px black;
}
.mainContents .credit {
  margin-top: 45px;
}
.mainContents .credit .credit-intro {
  margin-bottom: var(--spacing15);
}
.mainContents .credit .credit-intro .credit-ttl {
  margin-bottom: var(--spacing15);
}
.mainContents .credit .credit-intro img {
  margin-bottom: var(--spacing15);
}
.mainContents .credit .inputLabel {
  text-transform: uppercase;
}
.mainContents .credit .question {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mainContents .credit .question .validity-wrap {
  width: calc(100% - 40px);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing15);
}
.mainContents .credit .gmo_new_card_area {
  margin-bottom: 45px;
}
.mainContents .credit .creditcardForm2 {
  margin-top: 45px;
}
.mainContents .credit .creditcardForm2__txt-list {
  margin-top: var(--spacing15);
}
.mainContents .credit .inputHintForm {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mainContents .credit .inputHintForm .line {
  width: calc(100% - 40px);
}
.mainContents .cart-page__bottom a {
  text-decoration: underline;
}

/*-----------------------------------------
step02,step03
-------------------------------------------*/
.step02 .page-ttl,
.step03 .page-ttl {
  margin-bottom: 45px;
  text-transform: uppercase;
}
.step02 .order-box,
.step03 .order-box {
  margin-bottom: 60px;
}
.step02 .order-box__ttl,
.step03 .order-box__ttl {
  font-size: unset;
  margin-bottom: 45px;
}
.step02 .orderShippingFlagRadioList .orderShippingFlagRadio,
.step03 .orderShippingFlagRadioList .orderShippingFlagRadio {
  display: flex;
  justify-content: space-between;
}
.step02 .orderShippingFlagRadioList .orderShippingFlagRadio:not(:last-child),
.step03 .orderShippingFlagRadioList .orderShippingFlagRadio:not(:last-child) {
  margin-bottom: var(--spacing15);
}
.step02 .orderShippingFlagRadioList .orderShippingFlagRadio .deliveryAddressList,
.step03 .orderShippingFlagRadioList .orderShippingFlagRadio .deliveryAddressList {
  display: none;
}
.step02 .orderShippingFlagRadioList .orderShippingFlagRadio .deliveryAddressList select,
.step03 .orderShippingFlagRadioList .orderShippingFlagRadio .deliveryAddressList select {
  border: none;
  height: auto;
  background-position: right center;
  padding-right: 25px;
}
.step02 .shippingForm,
.step03 .shippingForm {
  margin-top: 45px;
}
.step02 .shippingForm .shippingForm-heder-text,
.step03 .shippingForm .shippingForm-heder-text {
  margin-bottom: 45px;
}
.step02 .form_order_name_kana_area.hide,
.step03 .form_order_name_kana_area.hide {
  display: none !important;
}

@media (max-width: 63.94em) {
  .step02 .orderShippingFlagRadioList {
    font-size: 1.1rem;
  }
  .step02 .orderShippingFlagRadioList .orderShippingFlagRadio {
    align-items: center;
  }
  .step02 .orderShippingFlagRadioList .orderShippingFlagRadio .deliveryAddressList select {
    padding-right: 15px;
    padding-left: 10px;
  }
}
.mainContents .shippingForm .form_shipping_name_kana_area.hide {
  display: none !important;
}

.step02 .order-box .bag-item-list .bag-item .bag-item__row,
.step03 .order-box .bag-item-list .bag-item .bag-item__row {
  color: var(--ambushGray);
}
.step02 .price-area__bottom,
.step03 .price-area__bottom {
  color: var(--ambushGray);
}
.step02 .buttonArea__txt,
.step03 .buttonArea__txt {
  margin-bottom: 30px;
}
.step02 .termLinks-area,
.step03 .termLinks-area {
  display: flex;
  justify-content: center;
  margin-bottom: 45px;
  gap: var(--spacing15);
}
.step02 .buttonArea,
.step03 .buttonArea {
  padding: 0;
}
.step02 .buttonArea .single-btn,
.step03 .buttonArea .single-btn {
  max-width: 100%;
}
.step02 .buttonArea .single-btn .button,
.step03 .buttonArea .single-btn .button {
  margin: 0;
}
.step02 .button-list li:not(:last-child),
.step03 .button-list li:not(:last-child) {
  margin-bottom: var(--spacing15);
}
.step02 .button-list .button,
.step03 .button-list .button {
  width: 100%;
  margin: 0;
  text-transform: uppercase;
}
.step02 .button-list .button:hover,
.step03 .button-list .button:hover {
  opacity: 1;
}

.step02 .gmoCreditoptionForm .date,
.step02 .gmoCreditoptionForm .slash,
.step02 .gmoCreditoptionForm .date {
  display: none;
}

.step02 .gmoCreditcardForm1 {
  padding-bottom: 20px;
}

/*-----------------------------------------
step03
-------------------------------------------*/
.step03 .form-content:has(.corre-btn) {
  padding-right: 60px;
  position: relative;
}
.step03 .corre-btn {
  position: absolute;
  right: 0;
  top: 0;
}
.step03 .corre-btn .button {
  padding: 0;
  border: none;
  height: auto;
  margin: 0;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 7px;
  padding-bottom: 7px;
}
.step03 .form-area .form-box__ttl {
  line-height: var(--lineHeightRate);
  margin-bottom: var(--spacing15);
}
.step03 .form-area .form-box .form-content .inputRow .inputCol:not(:last-child) {
  margin: 0;
}

/*-----------------------------------------
step04
-------------------------------------------*/
.step04 .step04-wrap .step04-row {
  margin-bottom: 45px;
}
.step04 .step04-wrap .step04-order-number {
  text-decoration: underline;
}
.step04 .buttonArea {
  padding: 0;
  margin-top: 45px;
  margin-bottom: 60px;
}
.step04 .buttonArea .button {
  margin: 0;
  text-transform: uppercase;
}
.step04 .form-box:not(:last-child) {
  margin-bottom: 60px;
}
.step04 .form-box__ttl {
  text-transform: uppercase;
  font-size: unset;
  margin-bottom: 45px;
}
.step04 .form-box .form-content .inputRow:not(:last-child) {
  margin-bottom: 45px;
}
.step04 .form-box .form-content .order-detail-ttl {
  margin-bottom: var(--spacing15);
  text-transform: uppercase;
}

/* GmoOpenAPI コンビニ用 from */
.formTable .cart-label {
  margin-left: -2rem;
  margin-bottom: -1rem;
}

.formTable .convenienceoptionForm .gray-form {
  padding-left: 3rem;
  padding-top: 1rem !important;
}

.formTable .convenienceoptionForm .gray-form .convenienceForm {
  margin: 24px -3rem 0 -3rem;
  padding: 0px 1rem;
}

/* GmoOpenAPI コンビニ用 to */
.formTable .applepayoptionForm .gray-form,
.formTable .paypayoptionForm .gray-form {
  padding-bottom: 25px;
}

.formTable .applepayoptionForm .credit-intro,
.formTable .paypayoptionForm .credit-intro {
  margin-bottom: 0;
}

/** amazonpay */
#AmazonPayButton img {
  width: 50%;
}

.stripe_load_stepping_now {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  text-align: center;
  background: rgba(134, 125, 125, 0.5);
  overflow: auto;
  z-index: 9;
}

#stripe--card-number,
#stripe--card-expiry,
#stripe--card-cvc {
  width: 100%;
  height: var(--height38);
  line-height: var(--height38);
  border-radius: 5px;
  box-shadow: none;
  padding: var(--padding7) var(--padding15);
  border: solid 1px black;
  font-size: unset;
  outline: none;
}
