/** Shopify CDN: Minification failed

Line 196:0 Expected "}" to go with "{"

**/
.default-banner-accord{
  margin-top: var(--default-margin-mob-top);
  margin-bottom: var(--default-margin-mob-bot);
  background-color: var(--default-bg-color, unset);
}
.default-banner-accord .head-content {
    margin-bottom: 25px;
}
.default-banner-accord .accordion-icons .inner-content {
    width: 100%;
    color: var(--color, var(--color-text));
    font-size: var(--size, 15px);
}
.default-banner-accord .accordion-icons h3 {
    font-size: 15px;
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    gap: 0 15px;
    padding: 10px 0;
    position: relative;
    cursor: pointer;
    padding-right: 25px;
    color: var(--default-affirm-title-color, var(--color-text));
}
.default-banner-accord .head-content h {
    font-size: var(--size_mb, 30px);
    margin-top: 0px;
    color: var(--color, var(--color-text));
    text-align: center;
}
.default-banner-accord .accordion-icons .inner-content .description {
    padding: 10px;
}
.default-banner-accord  .row.accordion-icons {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid;
}
.default-banner-accord .accordion-icons p {
    margin-top: 0;
    color: var(--default-affirm-content-color, var(--color-text));
}
.default-banner-accord .accordion-icons .accord-col {
    gap: 15px;
    border-bottom: 1px solid;
    align-items: center;
}
.default-banner-accord .accordion-icons .accord-col:last-child {
    border-bottom: 0;
}
.default-banner-accord .content-display {
    gap: 40px 0;
}
.default-banner-accord .accordion-icons .accord-col:last-child {
    margin-bottom: 0;
}
.default-banner-accord .btm-display a.button {
    color: var(--color-button-style);
    background-color: var(--bg-button-style);
    border-color: var(--border-button-style);
    max-width: var(--width-button-style);
    margin-top: var(--margin_top_button-style);
}
.default-banner-accord .btm-display a.button:hover {
    background-color: var(--bg-button-hover-style);
    color: var(--color-button-hover-style);
    border-color: var(--border-button-hover-style);
}
.default-banner-accord svg.store_svg{
    width: 50px;
}
.default-banner-accord .accordion-button {
    position: absolute;
    right: 0;
    top: calc(50%);
    height: 15px;
    width: 15px;
}

.default-banner-accord .accordion-button span {
    width: 100%;
    height: 2px;
    background-color: var(--default-icon-color);
    position: absolute;
    display: block;
    transition: 300ms all ease;
}
.default-banner-accord .accordion-button span.acc_b_2 {
    transform: rotate(90deg);
}
.default-banner-accord h3.active .accordion-button span.acc_b_2 {
    transform: rotate(0deg);
}
.default-banner-accord .row.content-display.align-items-center.image-above {
    flex-flow: column;
    gap: 0;
}
.default-banner-accord .row.table-comparison-wrap {
    border: 1px solid #002d40;
    border-radius: 10px;
    background-color: var(--default-affirm-background, #fff);
}
.default-banner-accord .row.content-display.align-items-center.image-above .head-content h3 {
    margin-bottom: 0;
    margin-top: 25px;
}
.default-banner-accord .image-container img {
    margin-bottom: 15px;
}
@media(min-width: 768px){
  .default-banner-accord .row.head-content-container.desktop-only {
    display: flex !important;
  }
  .default-banner-accord .row.head-content-container.mobile-only {
    display: none;
  }
  .default-banner-accord{
    margin-top: var(--default-margin-top);
    margin-bottom: var(--default-margin-bot);
  }
  .default-banner-accord .head-content {
    margin-bottom: 30px;
  }
  .default-banner-accord .head-content h3 {
    font-size: var(--size, 38px);
    line-height: 1.1;
    margin-bottom: 20px;
    text-align: left;
  }
  .default-banner-accord .row.content-display.align-items-center.image-above .head-content h3 {
    justify-content: center;
  }
  .default-banner-accord .head-content h3 br {
      display: none;
  }
  .default-banner-accord .image-container img {
    width: 100%;
    max-width: 90%;
    margin: 0 0px 15px;
    min-height: 400px;
    object-fit: cover;
  }
  .default-banner-accord .row.content-display.image-above .image-container img {
    max-width: 100%;
    min-height: unset;
  }
  .default-banner-accord .accordion-icons .accord-col {
    margin-right: auto;
  }
  .default-banner-accord .row.btm-display.two_button_display {
    justify-content: center;
    gap: 20px;
  }
  .default-banner-accord .row.btm-display.two_button_display a.button {
    margin-left: 0;
    margin-right: 0;
  }
}


/* accordion right image */
@media(min-width: 768px){
.default-banner-accord .content-display.image-right {
    flex-flow: row-reverse;
}
/* accordion left image */

/* [Archies] Match the [Arch] Default Accordion's borders to the accordion on the PDP.
   The PDP's is .tabs-contents-vertical: outer box 1px solid #E6E6E6 with a 10px radius,
   dividers from component-tab.css:126 (.tab-content + .tab-content { border-top: 1px
   solid #E6E6E6 }). Measured on /products/thongs-classic-black — both are 1px, so only
   the colour changes here; the weight already matched.
   The divider rule above declares `border-bottom: 1px solid` with NO colour, so it was
   painting the row's text colour (#002d40) through currentColor. Naming the colour stops
   it tracking the text if that ever changes.
   Only the colour is set, not the shorthand, so the 1px width stays owned by the rules
   above and the two cannot drift apart.
   Scoped to this section alone: .default-banner-accord is shared with tabs-accordion
   (which also carries .tabs-accordion-section) and with multipurpose-banner and
   seeding-custom-banner (where the class sits on .accordion-block rather than the
   .banner-section wrapper), and none of those were in scope. */
.banner-section.default-banner-accord:not(.tabs-accordion-section) .row.table-comparison-wrap {
    border-color: #E6E6E6;
}
.banner-section.default-banner-accord:not(.tabs-accordion-section) .accordion-icons .accord-col {
    border-bottom-color: #E6E6E6;
}