@font-face {
    font-family: "NanumSquareNeo";
    font-weight: 100;
    src: url(/assets/fonts/woff/NanumSquareNeoTTF-aLt.woff) format("woff"),
      url(/assets/fonts/woff2/NanumSquareNeoTTF-aLt.woff2) format("woff2"),
  }
  
  @font-face {
    font-family: "NanumSquareNeo";
    font-weight: 300;
    src: url(/assets/fonts/woff/NanumSquareNeoTTF-bRg.woff) format("woff"),
      url(/assets/fonts/woff2/NanumSquareNeoTTF-bRg.woff2) format("woff2"),
  }
  
  @font-face {
    font-family: "NanumSquareNeo";
    font-weight: 500;
    src: url(/assets/fonts/woff/NanumSquareNeoTTF-cBd.woff) format("woff"),
      url(/assets/fonts/woff2/NanumSquareNeoTTF-cBd.woff2) format("woff2"),
  }
  
  @font-face {
    font-family: "NanumSquareNeo";
    font-weight: 700;
    src: url(/assets/fonts/woff/NanumSquareNeoTTF-dEb.woff) format("woff"),
      url(/assets/fonts/woff2/NanumSquareNeoTTF-dEb.woff2) format("woff2"),
  }
  
  @font-face {
    font-family: "NanumSquareNeo";
    font-weight: 800;
    src: url(/assets/fonts/woff/NanumSquareNeoTTF-eHv.woff) format("woff"),
      url(/assets/fonts/woff2/NanumSquareNeoTTF-eHv.woff2) format("woff2"),
  }
* {
    font-feature-settings: "tnum" !important;
    font-variant-numeric: tabular-nums !important;
}
[id^="popupModal"] > div {
    width: fit-content;
}
#mobileMenu > div.offcanvas-body.position-relative > div > div > a > span {
    color: var(--btn-text-color) !important;
}
div:where(.swal2-container) div:where(.swal2-popup) {
    border-radius: 1rem !important;
}
.fw-bolder {
    font-weight: 900 !important;
}
.container {
    max-width: 1140px;
}
.bg-boards-color {
    background-color: var(--boards-color);
}
.bg-point-color-sub {
    background-color: var(--point-color-sub);
}
.bg-point-color {
    background-color: var(--point-color);
}
.kakao-chat-button {
    & svg {
        width: 1rem;
        height: 1rem;
    }
}
.bg-point-color-text {
    background-color: var(--point-color-text);
}
.offcanvas-bg {
    background-color: var(--offcanvas-bg-color);
}
.offcanvas-title {
    color: var(--offcanvas-title-color) !important;
}
.offcanvas.offcanvas-end {
    width: var(--offcanvas-width) !important;
}
nav .nav-item {
    display: inline-block;
    position: relative;
    transition: transform 0.3s;
    transform: translateZ(0);
}
nav .nav-item:hover {
    transform: translateY(-3px);
}
nav .nav-item.nav-active:hover {
    transform: translateY(-3px);
}
nav .nav-active {
    transform: translateY(-3px);
}

nav .nav-item.nav-active::after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    content: "";
    background-color: var(--nav-underline-color);
    width: 80%;
    height: 2px;
    transition: all 0.3s;
}
nav .nav-item::after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    content: "";
    background-color: var(--nav-underline-color);
    width: 0%;
    height: 2px;
    transition: all 0.3s;
}
nav .nav-item:hover::after {
    width: 80%;
}
.nav-logo{
    height: var(--nav-logo-lg-height);
}
.nav-order-search {
    border: 1px solid #bbbbbb;
    border-radius: 2rem;
    background-color: white;
    font-size: .85rem;
    font-weight: 700;
}
.banner-background > img{
    width: 100%;
    height: var(--banner-background-lg-height);
    object-fit: cover;
    object-position: center;
}
.main-banner-background > img{
    width: 100%;
    height: var(--main-banner-background-lg-height);
    object-fit: cover;
    object-position: center;
}
.page-title-box {
    height: var(--banner-background-lg-height);
    color: var(--page-title-color);
    & svg {
        width: 3rem;
        height: 3rem;
    }
}
.page-title-line {
    width: 10%;
    margin: 0;
    height: 3px;
    opacity: 1;
    background-color: var(--page-divider-color);
}
#main-banner-swiper.swiper-container {
    pointer-events: none;
    height: var(--main-banner-background-lg-height);
}
.swiper-slide {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.main-banner-container {
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}
.main-banner__image-item img {
    width: 100%;
}
.swiper-button-next, .swiper-button-prev {
    color: rgba(255, 255, 255, 0.5);
    z-index: 9999;
}
.gridbox {
    box-shadow: var(--box-shadow);
    border-radius: 1rem;
}
.main-list-container {
    margin: auto;
    display: grid;
    grid-template-columns: 2fr minmax(0, 1fr);;
    grid-template-rows: 1fr 1fr;
    gap: 1rem;
}
.main-orderform-container {
    margin: auto;
    display: grid;
    grid-template-columns: 2fr minmax(0, 1fr);;
    grid-auto-rows: min-content;
    gap: 1rem;
}
.order-list-box {
    grid-row: 1 / 3;
}
.notice-list-box {
    grid-row: 1 / 2;
}
.faq-list-box {
    grid-row: 2 / 3;
}
.gridbox svg {
    width: 1.65rem;
    height: 1.65rem;
}
.gridbox-icon-box {
    display: flex;
    align-items: center;
    padding: .75rem;
    background-color: #f5f5f5;
    border-radius: 2.5rem;
    align-self: center;
    
}
.gridbox-arrow-box i {
    font-size: 1.25rem;
    font-weight: 900;
    background: #f5f5f5;
    color: #acacac;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    padding: .5rem;
}
.order-giftcard-box {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    background: white;
}
.order-extractor-box {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    background: white;
}
.order-form-box {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    top: 2rem;
    position: sticky;
    align-self: start;
    height: auto;
    background: white;
}
.order-pin-box {
    grid-column: 1 / 2;
    grid-row: 3 / 4;
    background: white;
}
.order-list-grid {
    display: grid;
    grid-template-columns: 4fr 1fr 1fr 1fr;
    grid-template-rows: 1fr var(--order-list-height);
    background-color: #f7f7f7;
}
.order-list-header {
    grid-column: 1 / 5;
    grid-row: 1 / 2;
    display: grid;
    width: 100%;
    align-items: center;
    grid-template-columns: 4fr 1fr 1fr 1fr;
    border-bottom: 1px solid #f7f7f7;
    & p {
        text-align: center;
        font-size: .75rem;
        padding: .25rem 0;
        color: #acacac;
        background-color: white;
    }
}
.order-list-body {
    height: var(--order-list-height);
    grid-column: 1 / 5;
    grid-row: 2 / 3;
}
#order-list-body.swiper-container {
    pointer-events: none;
    height: 100%;
    overflow: hidden;
    background-color: white;
}
.order-list-row {
    text-wrap: nowrap;
    width: 100%;
    height: 100%;
    display: grid;
    align-items: center;
    color: #222;
    grid-template-columns: 4fr 1fr 1fr 1fr;
    border-bottom: 1px dashed #f7f7f7;
    & > div:nth-child(1) {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1rem;
    }
}
.order-list-row > div:nth-child(2){
    color: #777;
}
.order-list-row > div:nth-child(3){
    color: var(--point-color-text);
}
.order-row__info-date {
}
.order-row__info-giftcard {
    display: flex;
    align-items: center;
    gap: .25rem;
    & img {
        padding: .25rem;
        background-color: #f5f5f5;
        border-radius: .5rem;
        height: 34px;
    }
    & p {
        margin: 0;
        font-weight: bold;
    }
}
.order-row__info-bank {
    display: flex;
    align-items: center;
    gap: .25rem;
    & img {
        height: 20px;
    }
    & p {
        margin: 0;
    }
}
.order-row__status{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    font-weight: 500;
    position: relative;
}
.giftcards-scroll-guide {
    
}
.order-status__text {
    width: 4rem;
    color: white;
    background-color: #000;
    display: flex;
    gap: 2px;
    align-items: center;
    justify-content: center;
    padding: .3rem .5rem;
    border-radius: 20px;
}
.order-status__text--waiting {
    background-color: #6c757d;
}
.order-status__text--depositing {
    background-color: #E4A11B;
}
.order-status__text--processing {
    background-color: #3B71CA;
}
.order-status__text--complete {
    background-color: #0ab39c;
}
.order-status__text--fail {
    background-color: #f06548;
}
.point-color-text {
    color: var(--point-color-text);
}
.notice-list-row, .faq-list-row{
    font-size: .75rem;
    width: 100%;
    display: flex;
    align-items: center;
    height: 2.5rem;
    min-width: 0;
    border-bottom: 1px dashed #f7f7f7;
    & svg {
        height: 20px;
    }
}
.dashed-hr {
    /* margin: 1rem 0rem;
    border: #8a8a8a dashed 1px; */
    margin: 1rem 0rem;
    border: #f7f7f7 dashed 1px;
    opacity: 1;
}
.loader {
    width: 12px;
    height: 12px;
    border: 2px solid #FFF;
    border-bottom-color: transparent;
    border-radius: 50%;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}
#extractor-textarea {
    display: block;
    border: 0;
    background: #f7f7f7;
    font-size: .75rem;
    width: 100%;
    height: 8rem;
    box-sizing: border-box;
    padding: 1rem;
    border-radius: 1rem;
    resize: none;
}
#extractor-textarea:focus {
    outline-color: var(--point-color);;
    /* outline-color: #acacac; */
    outline-width: 1px;
    outline-style: solid;
}
.extractor-buttons {
    margin-top: 1rem;
    display: flex;
    gap: 1rem;
    flex-shrink: 0;
    
}
.btn-default-bg {
    color: var(--btn-text-color);
    background-color: var(--point-color) !important;
    box-shadow: var(--box-shadow);
    border: 0;
}
.btn-default-bg:hover {
    color: var(--btn-hover-color);
    background-color: var(--point-color-sub) !important;
    transition: 0.2s;
}
.btn-default {
    background-color: white !important;
    box-shadow: var(--box-shadow);
    border: 0;
}
.btn-default:hover {
    color: var(--btn-hover-color);
    background-color: var(--point-color) !important;
    transition: 0.2s;
}
.extractor-box {
    margin-top: 1rem;
}
.infobox {
    border: 0;
    background: #f7f7f7;
    font-size: .75rem;
    width: 100%;
    box-sizing: border-box;
    padding: 1rem;
    border-radius: 1rem;
    grid-column: 1 / -1; /* 3칸을 차지하도록 설정 */
}
.infobox.active {
    display: block !important; 
  }
.giftcards-selector {
    

    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(25%, auto));
    gap: 1rem;
}
.giftcards-selector__item {
    overflow: visible !important;

    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: .8rem;
    padding: .5rem .75rem;
    overflow: hidden;
    transition: .1s;
    color: #626262;
    box-shadow: var(--box-shadow);
    border-radius: 1rem;
    gap: .5rem;
    user-select: none;
    & img {
        height: 38px;
        border-radius: .5rem;
        pointer-events: none;
    }
    & span {
        display: inline-block;
        word-break: keep-all;
        line-height: 1rem;
        font-weight: 500;
    }
    & span.badge {
        top: -6px;
        right: -6px;
        visibility: hidden;
    }
}
.gridbox-title-box {
    user-select: none;
}
.giftcards-selector__item:active {
    background: transparent;
    
}
.giftcards-selector__item--active {
    background: var(--giftcards-selector-selected-bakground-color);
    color: var(--giftcards-selector-selected-text-color);

    transform: scale(1.015);
    & span.badge {
        visibility: visible;
        transition: .5s !important;
    }
}
#addPin {
    padding: .70rem .75rem;
}
.pinbox {
    display: grid;
    gap: .5rem;
    & input:focus {
        outline-color: var(--point-color);
        outline-width: 1px;
        outline-style: solid;
    }
    & input {
        min-width: 0 !important;
        border: 0;
        text-align: center;
        background: #f7f7f7;
        font-size: .75rem;
        width: 100%;
        box-sizing: border-box;
        padding: .70rem .75rem;
        border-radius: 1rem;
    }
}
.pinbox-type1 {
    grid-template-columns: 1fr 1fr 1fr 8rem;
}
.pinbox-type2 {
    grid-template-columns: 1fr 1fr 1fr 1fr 8rem;
}
.pinbox-type3 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 8rem;
}
.pinbox-type4 {
    grid-template-columns: 1fr 1fr 1fr 1.2fr 8rem;
}
.pins {
    font-size: .85rem;
    width: 100%;
    color: #a9a9a9;
    border-radius: 1rem;
    & svg {
        color: #a9a9a9 !important;
        font-weight: 400;
        width: 3rem !important;
        height: 3rem !important;
    }
}
.empty-pins {
    background-color: #f7f7f7;
    border-radius: 1rem;
}
.pins-container {
    display: flex;
    gap: .5rem;
    flex-direction: column;
}
.pin-row {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: .8rem;
    padding: .75rem .75rem;
    overflow: hidden;
    transition: .2s;
    color: #626262;
    box-shadow: var(--box-shadow);
    border-radius: 1rem;
    gap: .5rem;
    border: transparent solid 1px;
    & img {
        height: 38px;
        padding: .25rem;
        background-color: #f5f5f5;
        border-radius: .5rem;
    }
    svg {
        width: 2rem !important;
        height: 2rem !important;
        padding: .5rem .5rem;
        background: #f7f7f7;
        border-radius: 1rem;
    }
}
.bg-gray {
    background-color: #f0f0f0;
}
.pin-row:hover, .giftcards-selector__item:hover, #orderFormProc:hover{
    /* transform: scale(1.015); */
}
.order-form-bank {
    cursor: pointer;
    font-size: .75rem;
    background-color: #f7f7f7;
    border-radius: 1rem;
    border: var(--bs-border-color) solid 1px;
    padding: 1rem .75rem;
}
.order-form-body {
    font-size: .75rem;
    & input[type="text"] {
        background-color: #f7f7f7;
        font-size: .85rem !important;
        border: var(--bs-border-color) solid 1px;
        border-radius: 1rem;
    }
    & input[type="text"]:focus {
        color: var(--bs-body-color);
        background-color: #f7f7f7;
        border: var(--point-color) solid 1px;
        outline: 0;
        box-shadow: unset;
    }
    & input[type="radio"] {
        background-color: #f7f7f7;
        border: var(--point-color) solid 1px;
        outline: 0;
        box-shadow: unset;
    }
    & .form-check-input:focus {
        background-color: #f7f7f7;
        border: var(--point-color) solid 1px;
        box-shadow: unset;
    }
    & .form-check-input:checked {
        border: 0;
        box-shadow: unset;
        background-color: var(--point-color);
    }
    & .form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after {
        background-color: #f7f7f7;
    }
    & .form-floating>.form-control, .form-floating>.form-control-plaintext, .form-floating>.form-select {
        height: calc(3rem + calc(var(--bs-border-width)* 2));
        min-height: calc(3rem + calc(var(--bs-border-width)* 2));
        line-height: 1.25;
    }
}
.customer-box .box-content {
    align-items: center;
}

.customer-box .box-title {
    font-weight: bold;
    margin-bottom: 0.25rem; /* mb-1 */
}

.customer-box .custom-list {
    list-style: none;
    padding-left: 0;
}

.customer-box .list-item {
    font-size: .8rem; /* equivalent to fs-10 */
    color: #6c757d; /* equivalent to text-secondary */
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 0.25rem; /* mb-1 */
}

.customer-box .list-item:last-child {
    margin-bottom: 0;
}

.customer-box .list-item::before {
    content: "- ";
}
.giftcards-table  td{
    height: 55px;
}
.giftcards-row {
    
}
.orders-row {
    display: flex;
    align-items: center;
}
.giftcards-row img, .orders-row > img {
    height: 38px;
    border-radius: .5rem;
    background-color: #f6f6f6;
    padding: .25rem;
}
.orders-headers, .orders-contents {
    display: grid;
    grid-template-columns: 6rem 4fr 1fr 1fr 1fr 1fr;
    border: #ffffff00 solid 1px;
    cursor: pointer;
    text-align: center;
    align-items: center;
    box-shadow: var(--box-shadow);
    border-radius: 1rem;
    text-wrap: nowrap;
}
.boards-headers, .boards-contents {
    display: grid;
    grid-template-columns: 6rem 4fr 1fr 1fr;
    border: #ffffff00 solid 1px;
    cursor: pointer;
    text-align: center;
    align-items: center;
    box-shadow: var(--box-shadow);
    border-radius: 1rem;
    text-wrap: nowrap;
}
.boards-contents svg {
    width: 1.25rem;
    height: 1.25rem;
}

.orders-contents .order-row__icon {
    height: 14px;
}
.pagination .page-link {
    color: var(--bs-secondary);
}
.pagination .active>.page-link, .page-link.active {
    color: white;
    background-color: var(--point-color) !important;
    border-color: var(--point-color) !important;
}
.pagination {
    /* box-shadow: var(--box-shadow); */
}
.pagination .page-link:focus{
    box-shadow: none;
}
.pagination-rounded .page-link {
    border-radius: 1rem!important;
    margin: 0 3px!important;
    border: none;
    text-align: center
}

.orders-contents:hover, .boards-contents:hover, .pin-row:hover {
    border-color: var(--point-color);
}
.boards-categories .nav-link.active{
    color: var(--point-color-text) !important;
}
.boards-categories .nav-link {
    color: var(--bs-nav-underline-link-active-color);
    /* color: var(--point-color-text); */
}
.boards-categories .nav-underline .nav-link:focus, .nav-underline .nav-link:hover {
    color: var(--point-color-text);
    border-bottom-color: var(--point-color-text);
}
#bankSelectModal .bank-select-box{
    height: 400px;
    display: grid;
    align-items: start;
    grid-template-columns: repeat(auto-fill, minmax(20%, auto));;
    grid-auto-rows: min-content;
    gap: .5rem;
}
#bankSelectModal .bank-item {
    border-radius: 1rem;
    cursor: pointer;
    display: flex;
    gap: .25rem;
    align-items: center;
    padding: .5rem;
    border: transparent solid 1px;
    & img {
        width: 24px;
        height: 24px;
    }
    & p {
        margin: 0;
    }
}
.order-form-body > .order-form-bank > img {
    height: 16px;
    margin-right: .20rem;
}
#bankSelectModal .bank-item:hover {
    border-color: var(--point-color);
}
.my-order-container {
    margin: auto;
    display: grid;
    grid-template-columns: 2fr minmax(0, 1fr);
    grid-auto-rows: min-content;
    gap: 1rem;
}
.my-order-info {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    top: 0;
    position: sticky;
    align-self: start;
    height: auto;
    background: white;
}
.my-order-info .order-status__text {
    width: 100%;
    padding: unset;
}
.pins-container .order-row__status {
    min-width: 7rem;
}
.pins-container .order-status__text {
    width: unset;
    padding: .4rem .6rem;
}
.board-content {
    background-color: #f7f7f7;
}
.board-contentbox {
    background-color: transparent;
    min-height: 300px;
}
.main-order-row__info-bank {
    width: 50px;
}
@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
} 
@media (max-width: 1140px) {
    .giftcards-selector {
        grid-template-columns: repeat(auto-fill, minmax(45%, auto));
    }
}
@media (max-width: 992px) {
    
    .order-list-grid {
        grid-template-columns: 4fr 1fr ;
    }
    .order-list-header {
        grid-template-columns: 4fr 1fr ;
        & p:nth-child(4) {
            text-align: end;
            padding-right: 1rem;
        }
    }
    .order-list-row {
        grid-template-columns: 4fr 1fr ;
    }
    .order-row__status{
        margin-left: auto;
    }

    #addPin {
        grid-column: 1/6;
    }
    .pinbox-type1 {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto;
    }
    .pinbox-type2 {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: auto;
    }
    .pinbox-type3 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: auto;
    }
    .pinbox-type4 {
        grid-template-columns: 1fr 1fr 1fr 1.2fr;
        grid-template-rows: auto;
    }
    #bankSelectModal .bank-select-box{
        grid-template-columns: repeat(auto-fill, minmax(30%, auto));;
        height: 400px;
    }
}
@media (max-width: 830px) {
    nav ul li{
        font-size: .85rem !important;
    }
}
@media (max-width: 768px) {
    .main-order-row__info-bank {
        width: unset;
    }
    .order-list-row {
        & > div:nth-child(1) {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 1rem;
        }
    }
    .pins-container .order-row__status {
        min-width: unset;
        margin-left: unset;
    }
    .my-order-container {
        grid-template-columns: 1fr;
    }
    .my-order-pins {
        order: 1;
    }
    .my-order-info {
        order: 2 !important;
        position: relative;
    }

    #bankSelectModal .bank-select-box{
        grid-template-columns: repeat(auto-fill, minmax(45%, auto));;
        height: 400px;
    }
    .orders-headers, .orders-contents {
        grid-template-columns: 4fr 4rem ;
    }
    .boards-headers, .boards-contents {
        grid-template-columns: 2rem 1fr ;
    }
    .customer-info-box {
        border-right: 0 !important;
    }
    .container {
        max-width: unset;
    }
    .nav-logo{
        height: var(--nav-logo-height);
    }
    .banner-background > img{
        height: var(--banner-background-height);
    }
    .main-banner-background > img{
        height: var(--main-banner-background-height);
    }
    .page-title-box {
        height: var(--banner-background-height);
        & svg {
            width: 3rem;
            
        }
    }
    
    #main-banner-swiper.swiper-container {
        height: var(--main-banner-background-height);
    }
    .main-banner-container {
        padding: 1.25rem 0;
        grid-template-columns: 1fr;
    }
    .main-banner__image-item {
        height: 100%; 
        overflow: hidden;
    }
    .main-banner__image-item img{
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
    .main-list-container, .main-orderform-container {
        grid-template-columns: auto;
    }
    .order-list-box {
        grid-column: 1;
        grid-row: unset;
    }
    .notice-list-box {
        grid-column: 1;
        grid-row: unset;
    }
    .faq-list-box {
        grid-column: 1;
        grid-row: unset;
    }
    .order-list-grid {
        grid-template-rows: 1fr 300px;
    }
    .main-list-container, .main-orderform-container {
        grid-template-rows: 1fr auto;
    }
    .order-giftcard-box {
        order: 1;
        grid-column: 1;
        grid-row: unset;
    }
    .order-form-box {
        order: 4;
        grid-column: 1;
        grid-row: unset;
    }
    .order-extractor-box {
        order: 2;
        grid-column: 1;
        grid-row: unset;
    }
    .order-pin-box {
        order: 3;
        grid-column: 1;
        grid-row: unset;
    }
    .notice-list-row { 
        height: 2.8rem;
        & span:nth-child(1) {
            position: absolute;
            max-width: 80%;
        }
    }
    .faq-list-row { 
        height: 2.8rem;
        & span:nth-child(2) {
            max-width: 80%;
        }
    }
   
    .giftcards-selector {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(50%, auto));
        gap: 1rem;
    }
}
.toastify {
    padding: 12px 16px;
    color: var(--toastify-text-color);
    display: inline-block;
    -webkit-box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
            box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
    background: var(--toastify-bg-color);
    position: fixed;
    opacity: 0;
    -webkit-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
    border-radius: 1rem;
    cursor: pointer;
    text-decoration: none;
    max-width: calc(50% - 20px);
    z-index: 2147483647;
    font-size: .75rem;
    
  }
  .toastify.on {
    opacity: 1;
    display: flex;
  }
  
  .toast-close {
    opacity: .8;
    font-family: 'remixicon';
  }
  
  .toastify-right {
    right: 15px;
  }
  
  .toastify-left {
    left: 15px;
  }
  .toastify-left .toast-close {
    left: -4px;
    margin-left: 0;
    margin-right: 4px;
  }
  
  .toastify-top {
    top: -150px;
  }
  
  .toastify-bottom {
    bottom: -150px;
  }
  
  .toastify-rounded {
    border-radius: 25px;
  }
  
  .toastify-avatar {
    width: 1.5em;
    height: 1.5em;
    margin: -7px 5px;
    border-radius: 2px;
  }
  
  .toastify-center {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: -webkit-fit-content;
    max-width: fit-content;
    max-width: -moz-fit-content;
  }
  
  @media only screen and (max-width: 360px) {
    .toastify-right, .toastify-left {
      margin-left: auto;
      margin-right: auto;
      left: 0;
      right: 0;
      max-width: -webkit-fit-content;
      max-width: -moz-fit-content;
      max-width: fit-content;
    }
  }
@media only screen and (max-width: 360px) {
    .toastify-right, .toastify-left {
      margin-left: auto;
      margin-right: auto;
      left: 0;
      right: 0;
      max-width: -webkit-fit-content;
      max-width: -moz-fit-content;
      max-width: fit-content;
    }
  }

  figure.image {
    display: inline-block;
    margin: 1em auto;
    text-align: center;
}

figure.image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

figure.image.image_resized {
    display: inline-block;
    margin: 1em auto;
    text-align: center;
}

figure.image.image_resized img {
    max-width: 100%;
    height: auto;
    width: auto;
    aspect-ratio: attr(aspect-ratio);
}

figure.image figcaption {
    margin-top: 0.5em;
    font-size: 0.9em;
    color: #666;
    text-align: center;
}
.ck {
    p {
        margin-bottom: 0;
    }
}