/* FONT */
@font-face{
    font-family: 'NN_B';
    src: url('../fonts/NanumSquare/NanumSquareB.ttf') format('truetype');
}

@font-face{
    font-family: 'NN_R';
    src: url('../fonts/NanumSquare/NanumSquareR.ttf') format('truetype');
}
@font-face {
    font-family: Suit;
    src: url('/resources/fonts/SUIT/SUIT-Regular.otf') format("opentype");
}
/* FONT END */
:root {
  --main-color: #04c5d5;
  --red-color: #FF5758;
  --pink-color: #EE1E7B;
}

html, body{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #F1F1F1;
    font-family: Suit;
}

body *{
    -ms-user-select: none;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}

.wrap {
    --base-color: #04c5d5;
    --main-color: #04c5d5;
}

.wrap.shop_type_bz {
    --base-color: #F24A51;
    --main-color: #F24A51;
}

#loading {
    position: fixed;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
}

.loading_not_use {
    display: none;
}

.loading_is_use {
    display: flex;
}

#loading > .loading_spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #F3F3F3;
    border-top: 5px solid var(--main-color);
    border-radius: 50%;
    animation: loading_spin 1s linear infinite;
}

@keyframes loading_spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.wrap {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    background-color: #F9F9FF;
}

.wrap .shop_title {
    width: 100%;
    /*height: 100px;*/
    /*height: 50px;*/
    height: 60px;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    /*background: #FF5758;*/
    background-color: var(--main-color);
    position: fixed;
    font-size: 17pt;
    font-weight: bold;
    color: WHITE;
    z-index: 3;
}

.wrap.simple .shop_title {
    height: 80px;
}
.wrap .shop_title div {
    /*height: 50px;
    line-height: 50px;*/
    height: 60px;
    line-height: 60px;
}

.wrap.simple .shop_title div {
    height: 30px;
    line-height: 30px;
}

.wrap .shop_title div:nth-child(1), .wrap.shop_type_bz .shop_title #shop_name {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    font-weight: bold;
    white-space: nowrap;
}

.wrap .shop_title div:nth-child(2), .wrap.shop_type_bz .shop_title #store_name {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    white-space: nowrap;
}

.wrap.shop_type_bz .shop_title .back_to_bz {
    position:absolute;
    top: 5px;
    left: 10px;
    
    width: 50px;
    height: 50px;
    
    border: none;
    border-radius: 5px;
    background: transparent;

    cursor: pointer;
}

.back_to_bz img {
    width: auto;
    height: 35px;
}

.wrap.simple .shop_title div:nth-child(1) {
    top: 20%;
}

.wrap.simple .shop_title div:nth-child(2) {
    top: 20%;
}

.wrap .node_no {
    display: flex;
    position: fixed;
    top: 0px;
    /* width: calc(100% - 20px); */
    /*height: 50px;*/
    height: 60px;
    /* justify-content: flex-end; */
    align-items: center;
    color: WHITE;
    left: 20px;
    z-index: 3;
    font-weight: bold;
    font-size: 18px;
}

.wrap.simple .node_no {
    height: 30px;
}

.wrap.shop_type_bz .node_no {
    display: none;
}

.wrap .home_btn {
    /*top: 30px;*/
    /*height: 70px;*/
    height: 60px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    color: BLACK;
    font-size: 9pt;
    width: 25%;
}
.wrap.simple .home_btn {
    flex-direction: row;
    color: WHITE;
    justify-content: space-evenly;
    width: 20%;
    font-size: 11pt;
}
.wrap .home_btn img {
    height: 50%;
    /*margin-left: 15px;*/
    -webkit-filter: invert(50%); /* Safari/Chrome */
    filter: invert(50%);
}
.wrap.simple .home_btn img {
    -webkit-filter: none;
    filter: none;
}

.wrap .call_btn {
    height: 60px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    color: BLACK;
    font-size: 9pt;
    width: 25%;
}
.wrap.simple .call_btn {
    flex-direction: row;
    color: WHITE;
    justify-content: space-evenly;
    width: 20%;
    font-size: 11pt;
}
.wrap .call_btn img {
    height: 50%;
    /*margin-left: 15px;*/
    -webkit-filter: invert(50%); /* Safari/Chrome */
    filter: invert(50%);
}
.wrap.simple .call_btn img {
    -webkit-filter: none;
    filter: none;
}

.wrap .order_list_btn {
    height: 60px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    /*color: WHITE;*/
    color: BLACK;
    font-size: 9pt;
    width: 25%;
}

.wrap.simple .order_list_btn {
    flex-direction: row;
    color: WHITE;
    justify-content: space-evenly;
    width: 20%;
    font-size: 11pt;
    white-space: nowrap;
}
.wrap .order_list_btn img {
    height: 50%;
    /*margin-left: 15px;*/
    -webkit-filter: invert(50%); /* Safari/Chrome */
    filter: invert(50%);

}
.wrap.simple .order_list_btn img {
    -webkit-filter: none;
    filter: none;
}

.wrap.shop_type_bz .order_list_btn {
    display: none;
}

.white_filter{
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(107deg) brightness(103%) contrast(104%);
}

.wrap .group_list {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    /* width: calc(100% - 20px); */
    width: 99%;
    padding-left: 10px;
    position: fixed;
    /*top: 100px;*/
    /*top: 50px;*/
    top: 60px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    /*background-color: #F1F1F1;*/
    /*background-color: WHITE;*/
    background-color: #F9F9FF;
    z-index: 2;
    height: 60px;
    align-items: center;
    /* margin-left: 10px; */
    box-sizing: border-box;
}

.wrap.simple .group_list {
    top: 80px;
}

.wrap .top_white {
    position: fixed;
    /*top: 123px;*/
    top: 73px;
    height: 5px;
    background-color: WHITE;
    width: 100%;
}

.wrap .top_blank {
    /*height: 158px;*/
    /*height: 108px;*/
    /*height: 90px;*/
    /*height: 100px;*/
    height: 120px;
}

.wrap.simple .top_blank {
    height: 140px;
}

.wrap .bottom_blank {
    height: 70px;
}

.wrap .bottom_white {
    /*background-color: WHITE;*/
    background-color: #f1f3f5;
    height: 65px;
    width: 100%;
    position: fixed;
    bottom: 0px;
    display: flex;
    /*justify-content: space-between;*/
    justify-content: space-evenly;
    z-index: 1;
}
.wrap.simple .bottom_white {
    top: 25px;
    z-index: 3;
    background-color: transparent;
    padding: 0px 5px;
    width: calc(100% - 10px);
}

.wrap .top_blank_70 {
    /*height: 70px;*/
    height: 110px;
}

.wrap .top_blank_100 {
    /*height: 100px;*/
    /*height: 50px;*/
    height: 60px;
}

.wrap.simple .top_blank_100 {
    height: 80px;
}

.wrap .top_blank_110 {
    height: 110px;
}

.wrap .top_blank_120 {
    height: 120px;
}

.wrap .group_list .group_item {
    /*min-width: 25%;
    height: 30px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    /*border-bottom: 3px solid #F1F1F1;*/
    /*font-size: 15pt;*/
    font-size: 0.9em;
    margin: 5px;
    /*padding: 5px 10px;*/
    padding: 7px 20px;
    flex: none;
    color: GRAY;
    border: 1px solid;
    border-radius: 15px;
    height: 15px;
    font-weight: bold;
}

.wrap .group_list .group_item.active {
    /*border-bottom: 3px solid var(--red-color);
    font-weight: bold;*/
    color: BLACK;
    border: 1px solid var(--main-color);
}

.wrap .product_list {
    /* 스크롤형으로 변경 */
    /*display: none;*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0px 10px 0px 10px;
}

.wrap .product_list.active {
    display: flex;
}

.wrap .product_list .product_title {
    width: 100%;
    /*font-size: 13pt;*/
    font-size: 1.0em;
    font-weight: bold;
    margin: 10px 5px;
}

.wrap .product_list .product_item {
    /*width: calc(50% - 12px);*/
    width: calc(50% - 5px);
    /*border: 1px solid #D5D5D5;*/
    /*margin: 5px;*/
    border-radius: 10px;
    background-color: WHITE;
    margin-bottom: 10px;
}

.wrap .product_list .product_item:nth-child(odd) {
    margin-left: 5px;
}

.wrap .product_list .product_item:nth-child(even) {
    margin-right: 5px;
}

.wrap .product_list .product_item.hidden {
    display: none;
}

.wrap .product_list .product_item div {
    display: flex;
    justify-content: center;
    align-items: center;
    /*min-height: 40px;*/
    min-height: 30px;
    font-size: 15pt;
    text-align: center;
    font-weight: normal;
}
.wrap .product_list .product_item div.menu_icon {
    position: relative;
    width: 98%;
    height: 50px;
    margin: 0 1%;
    z-index: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.wrap .product_list .product_item div.menu_icon img {
    height: 90%;
    width: auto;
    margin-left: 5px;
}
.wrap .product_list .product_item div:not(.menu_icon) {
    position: relative;
    /*top: -50px;*/
    font-size: 1.0em;
    font-weight: normal;
}

.wrap .product_list .product_item div:nth-child(2) {
    margin-top: 5px;
}

.wrap .product_list .product_item div:nth-child(3) {
    /*color: #5C358C;*/
    /*color: var(--base-color);*/
    color: var(--red-color);
    font-weight: bold;
    margin-bottom: 5px;
}

.wrap .product_list .product_item div:nth-child(3) span{
    color: #ced4da;
    margin-right: 10px;
    font-weight: normal;
}
.wrap .product_list .product_item div:nth-child(3) span.origin_price{
    text-decoration: line-through;
}

.wrap .product_list .product_item img {
    width: 100%;
    aspect-ratio : 1 / 1;   /* 비율이 언제나 동일하게 처리 */
    border-radius: 10px 10px 0px 0px;
}
.wrap .product_list .product_item img.soldout{
    filter: brightness(60%);
}

.wrap .product_list .product_item.desc .desc_soldout_img {
    margin-left: -100%;
    aspect-ratio: 1 / 0 !important;
}

.wrap .product_list .product_item video {
    width: 100%;
    aspect-ratio : 1 / 1;   /* 비율이 언제나 동일하게 처리 */
    border-radius: 10px 10px 0px 0px;
}
.wrap .product_list .product_item video.soldout{
    filter: brightness(60%);
}

.wrap .product_info {
    
}

.wrap .product_info .product_img {
}

.wrap .product_info .product_img img {
    width: 100%;
    object-fit: cover;
    height: 250px;
}

.wrap .product_info .product_img video {
    width: 100%;
}
.wrap .product_info .product_detail {
    background-color: WHITE;
}

.wrap .product_info .product_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    font-size: 14pt;
    flex-direction: column;
}

.wrap .product_info .product_desc {
    padding: 0px 20px 20px 20px;
    /*color: DARKGRAY;*/
    /*color: lightslategrey;*/
    color: midnightblue;
    font-size: 12pt;
}
.wrap .product_info .product_desc pre {
    white-space: pre-wrap; /* pre tag내에 word wrap */
    font-family: inherit;
}

.wrap .product_info .product_title .product_name {
}

.wrap .product_info .product_title .product_price {
    color: var(--red-color);
    display: flex;
    text-align: right;
    width: 100%;
    justify-content: center;
    font-weight: bold;
}

.wrap .product_info .product_title .product_price span {
    color: #ced4da;
    margin-right: 10px;
    font-weight: normal;
}
.wrap .product_info .product_title .product_price span.origin_price {
    text-decoration: line-through;
}
.wrap .product_info .option_list .option_info {
    background-color: WHITE;
    border-top: 5px solid #F1F1F1;
    padding: 20px;
}
.wrap .product_info .option_list .option_info:last-child {
    border-bottom: 5px solid #F1F1F1;
}

.wrap .product_info .option_list .option_info .option_sub {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
    color: SLATEGRAY;
}

.wrap .product_info .count_info {
    padding: 20px 0;
    margin: 0 20px;
    display: flex;
    flex-direction: row;
    border-top: 1px solid #ededed;
}

.wrap .product_info .count_info .count_title {
    width: 50%;
    display: flex;
    align-items: center;
}

.wrap .product_info .count_info .count_content {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.wrap .product_info .count_info .count_content img {
    width: 30px;
}

.wrap .add_cart_btn:not(.external_skin) {
    position: fixed;
    display: flex;
    /*bottom: 10px;*/
    bottom: 65px;
    width: 90%;
    height: 50px;
    align-items: center;
    justify-content: center;
    /*background-color: #FF5758;*/
    background-color: var(--main-color);
    border-radius: 10px;
    color: WHITE;
    margin-left: 5%;
}

.wrap .add_cart_btn.external_skin {
    position: fixed;
    left: 0;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 90%;
    height: 50px;
    margin-left: 5%;

    background-color: var(--main-color);
    border-radius: 10px;
    color: white;
    cursor: pointer;
}

.wrap.simple .add_cart_btn {
    /*bottom: 75px;*/
    bottom: 15px;
}

.wrap .add_cart_btn.width_40p {
    width: 43%;
}

.wrap .add_cart_mov {
    position: fixed;
    display: flex;
    /*bottom: 10px;*/
    bottom: 65px;
    width: 43%;
    height: 50px;
    align-items: center;
    justify-content: center;
    /*background-color: #FF5758;*/
    background-color: var(--main-color);
    border-radius: 10px;
    color: WHITE;
    left: 52%;
}

.wrap.simple .add_cart_mov {
    /*bottom: 75px;*/
    bottom: 15px;
}

.cart_btn_div {
    /*height: 70px;*/
    height: 60px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    /* color: WHITE; */
    color: BLACK;
    font-size: 9pt;
    width: 25%;
}

.wrap.simple .cart_btn_div {
    flex-direction: row;
    color: WHITE;
}
.cart_btn_div.index {
    /*top: auto;
    bottom: 10px;*/
}
.cart_img {
    /*width: 50px;*/
    height: 50%;
    -webkit-filter: invert(50%);
    filter: invert(50%);
}
.wrap.simple .cart_img {
    -webkit-filter: none;
    filter: none;
}

.wrap .none_cart_list {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100% - 400px);
    font-size: 17pt;
    font-weight: bold;
    color: #343535;
}

.wrap .cart_info {
    padding: 0px 15px;
}

.external_node .cart_info {
    position: relative;
}

.wrap .gray_line {
    margin: 20px 15px;
    border-top: 1px solid LIGHTGRAY;
}

.wrap .cart_delivery_info {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100% - 80px);
}

.wrap .cart_delivery_popup {
    display: none;
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    height: calc(100% - 80px);
    padding-top: 10px;
    background-color: #F9F9FF;
    z-index: 1000;
    box-sizing: border-box;
}

.wrap .cart_delivery_popup.cart_delivery_popup_on {
    display: flex;
    flex-direction: column;
}

.wrap .cart_delivery_popup > .cart_delivery_popup_menu_name {
    display: flex;
    align-items: center;

    width: calc(100% - 20px);
    height: 50px;
    padding-left: 15px;
    margin: 0 10px;
    border-radius: 10px;
    background-color: #FFF;
    color: #222;

    font-size: 1.0rem;
    font-weight: bold;

    box-sizing: border-box;
}

.wrap .delivery_list {
    width: 100%;
    flex: 1;
    overflow-y: auto;
}

.wrap .cart_list {
    margin: 10px;
    display: flex;
    flex-direction: column;
    background-color: WHITE;
    /*height: calc(100% - 265px);*/
    height: calc(100% - 310px);
    border-radius: 10px;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    padding-bottom: 15px;
}

.wrap.simple .cart_list {
    height: calc(100% - 265px);
}

.wrap .cart_list.use_kiosk_pickup {
    height: calc(100% - 315px);
}

.wrap .cart_list.use_kiosk_seat {
    height: calc(100% - 315px);
}

.wrap .cart_list.external_pack {
    height: auto !important;
}

.wrap .cart_list.cart_info_in_delivery {
    height: auto !important;
    padding-bottom: 15px !important;
}

.wrap .cart_list.cart_info_in_delivery > .cart_info {
    padding-top: 15px;
}

.wrap .cart_list > .cart_list_delivery_title {
    width: calc(100% - 30px);
    margin: 0px 15px 5px 15px;
    padding: 15px 0 5px 5px;
    border-bottom: 1px solid #808080;
    color: var(--main-color);
    font-size: 1rem;
}

.wrap .cart_list > .cart_list_delivery_title.del_type_not {
    display: none;
}

.wrap .cart_list > .cart_list_delivery_footer {
    display: flex;
    justify-content: space-between;
    width: calc(100% - 30px);
    border-top: 1px solid #808080;
    margin: 5px 15px 0px 15px;
    padding: 0 5px;
    box-sizing: border-box;
    padding-top: 5px;
}

.wrap .cart_list > .cart_list_delivery_footer > span:last-child {
    color: var(--red-color);
}

.wrap .cart_info .menu_info {
    display: flex;
    flex-direction: row;
}

.wrap .cart_info .menu_info .menu_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.wrap .cart_info .menu_info .lmenu {
    width: 70px;
}
.wrap .cart_info .menu_info .lmenu img {
    width: 100%;
}
.wrap .cart_info .menu_info .lmenu video {
    width: 100%;
    aspect-ratio: 1 / 1;
}
.wrap .cart_info .menu_info .rmenu {
    display: flex;
    width: calc(100% - 80px);
    margin-left: 10px;
    flex-direction: column;
}

.wrap .cart_info .menu_info .menu_top .delete_btn {
    width: 25px;
}

.wrap .cart_info .menu_info .menu_title {
    font-size: 13pt;
    font-weight: bold;
}

.wrap .cart_info .menu_info .option_info {
    padding: 10px 10px 0px 15px;
}

.wrap .cart_info .menu_info .option_info .option_title {
    
}

.wrap .cart_info .origin_price {
    color: GRAY;
    padding: 10px 10px 0px 15px;
}

.wrap .cart_info .count_info {
    margin-top: 20px;
    display: flex;
    align-items: center;
}
.wrap .cart_info .count_info .count {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.l_margin_10px {
    margin-left: 10px;
}

.l_margin_20px {
    margin-left: 20px;
}

.wrap .cart_info .count_info .price {
    width: 50%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: var(--red-color);
    font-weight: bold;
}

.wrap .cart_info .count_info div img {
    width: 30px;
}

.wrap .pack_applicant_info {
    margin: 10px;
    padding: 15px;
    border-radius: 10px;
    background-color: #FFF;
}

.wrap .pack_applicant_info .applicant_info_line {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.wrap .pack_applicant_info .applicant_info_line > #applicant_info_tel {
    font-family: inherit;
    font-size: 1.1rem;
    border: 1px solid grey;
    border-radius: 5px;
    padding: 5px 7px;
    margin-bottom: 5px;
    font-weight: bold;
}

.wrap .pack_applicant_info .applicant_info_line > p {
    font-size: .85rem;
    color: var(--base-color);
    margin: 0;
    margin-bottom: 10px;
}

.wrap .pack_applicant_info .applicant_info_line input[type=radio] {
    display: none;
}

.wrap .pack_applicant_info .applicant_info_line .applicant_info_tel_title {
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px solid grey;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_title {
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px solid grey;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector {
    min-height: 30px;
    height: auto;
    display: flex;
    align-items: center;
    gap: 5px;
} 

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > input + svg {
    opacity: 0;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > input:checked + svg {
    opacity: 1;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 1;
    gap: 5px;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > label > .line_title {
    word-break: keep-all;
    text-align: center;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > label .line_value {
    font-weight: bold;
    text-align: right;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > label select {
    min-width: 80px;
    padding: 5px;
    border: none;
    border-bottom: 1px solid gray;
    font-family: inherit;
    font-weight: inherit;
    background: transparent;
}

.wrap .pack_applicant_info .applicant_info_line .pickup_time_selector > label select:focus {
    outline: none;
}

.wrap .total_price_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 50px;
    padding: 0px 20px;
}

.wrap .total_price_info .total_txt {
    font-weight: bold;
}

.wrap .total_price_info .cart_price {
    color: var(--red-color);
    font-weight: bold;
}

.wrap .total_price_info.in_cart_delivery {
    flex-direction: column;
    height: auto;
    padding: 5px 20px;
}

.wrap .cart_delivery_popup_receipt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: auto;
    padding: 5px 20px;
}

.wrap .cart_delivery_popup_receipt .total_txt {
    font-weight: bold;
}

.wrap .cart_delivery_popup_receipt .cart_price {
    color: var(--red-color);
    font-weight: bold;
}

.wrap .total_price_info.in_cart_delivery > div, .wrap .cart_delivery_popup_receipt > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 30px;
    border-bottom: 1px solid lightgray;
    padding: 2px 0;
    font-size: 1.0rem;
    box-sizing: border-box;
}

.wrap .total_price_info.in_cart_delivery > div:not(:first-child), .wrap .cart_delivery_popup_receipt > div:not(:first-child) {
    font-size: .9rem;
    border: 0;
    color: lightgray;
    width: 90%;
    height: auto;
    margin-left: 10%;
    box-sizing: border-box;
}

.wrap .kiosk_div {
    display: flex;
    flex-direction: column;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: auto;
    padding: 0px 20px;
}

.wrap .kiosk_div > div:nth-child(1) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
    min-height: 50px;
}

.wrap .kiosk_div > div:nth-child(2).kiosk_div_notice {
    padding-bottom: 10px;

    font-size: .8rem;
    font-weight: normal;
    line-height: 1rem;
    color: #C9C9C9;
}

.wrap .kiosk_div .kiosk_div_txt {
    font-weight: bold;
}

.wrap .kiosk_div .kiosk_div_value input, .wrap .kiosk_div .kiosk_div_value select {
    width: 190px;
    height: 35px;
    padding: 0 10px;
    background-color: #FEFEFE;
    border: 1px solid #C9C9C9;
    border-radius: 5px;
    font-size: 1.0rem;
    font-weight: bold;
    text-align: right;
    box-sizing: border-box;
}

/* 키오스크 체크박스 디자인 START */
.kiosk_call_agree_chk_case {
    box-sizing: border-box;
    --background-color: #FFF;
    --checkbox-height: 25px;
}

/** 배달 관련 **/
.wrap .cart_delivery_area {
    display: flex;
    flex-direction: column;
    background-color: WHITE;
    border-radius: 10px;
    height: auto;
    padding: 15px 20px;
    margin: 10px 10px 0 10px;
    flex: 1;
}

.wrap .cart_delivery_area .cart_delivery_title {
    font-weight: bold;
    margin-bottom: 15px;
    padding-bottom: 7px;
    border-bottom: 1px solid #222;
}

.wrap .cart_delivery_area .cart_delivery_contents {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.wrap .cart_delivery_area .cart_delivery_contents .cart_delivery_contents_name {
    margin-bottom: 5px;
    color: #444;
    letter-spacing: -.2px;
}

.wrap .cart_delivery_area .cart_delivery_contents .cart_delivery_contents_data .cart_buyer_adr_search {
    margin-left: 2rem;
    padding: 0 1.1rem;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    white-space: nowrap;
    background-color: var(--main-color);
    box-shadow: 1px 1px 3px 0px #026068;
    color: #f8f8f8;
}

.wrap .cart_delivery_area .cart_delivery_contents .cart_delivery_contents_data > div {
    display: flex;
    margin-bottom: 5px;
}

.wrap .cart_delivery_area .cart_delivery_contents .cart_delivery_contents_data input {
    width: 100%;
    padding: 7px 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-sizing: border-box;
    font-size: .98rem;
    color: #333;
    background-color: #fff;
}

.wrap .cart_delivery_area .cart_delivery_contents .cart_delivery_contents_data input[readonly] {
    background-color: #fcfcfc;
}

@-moz-keyframes kiosk_chk_start {
    0% {height: 0;}
    100% {height: calc(var(--checkbox-height) / 2)}
}

@-webkit-keyframes kiosk_chk_start {
    0% {height: 0;}
    100% {height: calc(var(--checkbox-height) / 2)}
}

@keyframes kiosk_chk_start {
    0% {height: 0;}
    100% {height: calc(var(--checkbox-height) / 2)}
}

@-moz-keyframes kiosk_chk_end {
    0% {height: 0;}
    50% {height: 0;}
    100% {height: calc(var(--checkbox-height) * 1.2);}
}

@-webkit-keyframes kiosk_chk_end {
    0% {height: 0;}
    50% {height: 0;}
    100% {height: calc(var(--checkbox-height) * 1.2);}
}

@keyframes kiosk_chk_end {
    0% {height: 0;}
    50% {height: 0;}
    100% {height: calc(var(--checkbox-height) * 1.2);}
}

.kiosk_call_agree_chk_case > input {
    display: none;
}

.kiosk_call_agree_chk_case > label {
    position: relative;
    display: inline-block;
    width: var(--checkbox-height);
    height: var(--checkbox-height);

    background-color: transparent;
    border: calc(var(--checkbox-height) * .1) solid #C9C9C9;
    border-radius: 5px;

    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    transition: border-color ease 0.2s;
    -moz-transition: border-color ease 0.2s;
    -o-transition: border-color ease 0.2s;
    -webkit-transition: border-color ease 0.2s;

    cursor: pointer;
}

.kiosk_call_agree_chk_case > input + label::before
, .kiosk_call_agree_chk_case > input + label::after {
    content: " ";

    position: absolute;
    display: inline-block;
    width: calc(var(--checkbox-height) * .2);
    height: 0;

    background-color: #F9157C;
    border-radius: 5px;

    transform-origin: left top;
    -moz-transform: left top;
    -ms-transform: left top;
    -o-transform: left top;
    -webkit-transform: left top;
    transition: opacity ease 0.5;
    -moz-transition: opacity ease 0.5;
    -webkit-transition: opacity ease 0.5;
}

.kiosk_call_agree_chk_case > input + label::before {
    top: calc(var(--checkbox-height) * .72);
    left: calc(var(--checkbox-height) * .41);
    box-shadow: 0 0 0 calc(var(--checkbox-height) * .05) var(--background-color);
    transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.kiosk_call_agree_chk_case > input + label::after {
    top: calc(var(--checkbox-height) * .37);
    left: calc(var(--checkbox-height) * .05);
    transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.kiosk_call_agree_chk_case > input:checked + label {
    border-color: #F9157C;
}

.kiosk_call_agree_chk_case > input:checked + label::after {
    height: calc(var(--checkbox-height) / 2);
    animation: kiosk_chk_start 0.2s ease 0s forwards;
    -moz-animation: kiosk_chk_start 0.2s ease 0s forwards;
    -o-animation: kiosk_chk_start 0.2s ease 0s forwards;
    -webkit-animation: kiosk_chk_start 0.2s ease 0s forwards;
}

.kiosk_call_agree_chk_case > input:checked + label::before {
    height: calc(var(--checkbox-height) * 1.2);
    animation: kiosk_chk_end 0.4s ease 0s forwards;
    -moz-animation: kiosk_chk_end 0.4s ease 0s forwards;
    -o-animation: kiosk_chk_end 0.4s ease 0s forwards;
    -webkit-animation: kiosk_chk_end 0.4s ease 0s forwards;
}
/* 키오스크 체크박스 디자인 END */

.wrap .btn_group {
    display: flex;
    align-items: center;
    min-height: 60px;
    height: auto;
}

.wrap .btn_group .open_delivery_popup {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    /*background: #FF5758;*/
    background: var(--main-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    width: 100%;
}

.wrap .btn_group .close_delivery_popup {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    /*background: #FF5758;*/
    background: var(--red-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    width: 100%;
}

.wrap .btn_group .order_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    /*background: #FF5758;*/
    background: var(--main-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    width: 100%;
}

.wrap .btn_group .order_btn.width_50 {
    width: 50%;
}

.wrap .btn_group .payment_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 10px 10px 5px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    background: #FFEB00;
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    width: 50%;
}

.wrap .btn_group .payment_btn img {
    max-width: 80%;
    max-height: 80%;
}

.wrap .btn_group .payment_pg_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 5px 10px 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    background: var(--base-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    flex: 1;
}

.wrap .btn_group .today_not_open {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 5px 10px 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    background: var(--base-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
    flex: 1;
    filter: grayscale(1);
}

.wrap .btn_group .payment_pg_btn_in_cart_delivery
, .wrap .btn_group .external_payment_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    width: 100%;
    height: 60px;
    background: var(--base-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
}

.wrap .call_list {
    margin: 10px;
    background-color: WHITE;
    /*height: calc(100% - 210px);*/
    /*height: calc(100% - 260px);*/
    height: calc(100% - 290px);
    border-radius: 10px;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    padding-bottom: 15px;
}

.wrap.simple .call_list {
    height: calc(100% - 310px);
}
.wrap .call_list .call_item {
    padding: 15px;
}
.wrap .call_list .call_item label {

}

.wrap .call_info {
    height: 45px;
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 0px 10px;
}

.wrap .call_info .call_text {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
}

.wrap .call_info .call_text input {
    width: 100%;
    height: 70%;
    /*border: 2px solid #FF5758;*/
    border: 2px solid var(--main-color);
}

.wrap .call_info .call_count {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: row;
}

.wrap .call_info .call_count .call_count_content {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}

.wrap .call_info .call_count .call_count_content div {
    height: 100%;
    display: flex;
    align-items: center;
}

.wrap .call_info .call_count .call_count_content div img {
    height: 80%;
}

.wrap .staff_call_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    background-color: WHITE;
    border-radius: 10px;
    height: 60px;
    /*background: #FF5758;*/
    background: var(--main-color);
    color: WHITE;
    font-size: 15pt;
    font-weight: bold;
}

.wrap .insert_form {
    width: 500px;
    margin: 0 auto;
}

.wrap .insert_form .row {
    display: flex;
}

.wrap .insert_form .row div {
    width: 50%;
}

.wrap .insert_form .row div input {
    width: calc(100% - 7px);
}

.wrap .cart_count_badge {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: YELLOW;
    color: BLACK;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10pt;
    /*position: fixed;*/
    position: absolute;
    margin-top: -40px;
    margin-left: 25px;
}
.wrap.simple .cart_count_badge {
    background-color: var(--pink-color);
    color: WHITE;
    margin-left: 0px;
    position: unset;
    margin: 0px 0px 0px 5px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    font-size: 14pt;
}

.wrap .order_list {
    height: calc(100% - 130px - 70px - 30px);
    background-color: WHITE;
    margin: 10px;
    border-radius: 10px;
    padding: 10px;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.wrap.simple .order_list {
    height: calc(100% - 130px - 70px - 50px);
}

.wrap .order_list table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    font-size: 11pt;
}

.wrap .order_list table th {
    text-align: center;
    font-weight: bold;
    padding: 10px 5px;
    /*font-size: 11pt;*/
    font-size: 0.9em;
    background-color: #EDEDED;
}

.wrap .order_list table td {
    text-align: center;
    padding: 10px 5px;
}
.wrap .order_list table td:nth-child(1) {
    text-align: left;
    /*font-weight: bold;*/
    color: blue;
}

.wrap .order_list table tr:nth-child(odd) {
    /*background-color: #EDEDED;*/
}

.wrap .order_list .order_detail.bottom_line {
    border-bottom: 1px solid #EDEDED;
}

.wrap .cart_btn_div_widge {
    position: fixed;
    display: none !important;
    bottom: 30px;
    right: 10px;
    /* height: 70px; */
    display: flex;
    align-items: center;
    z-index: 3;
    background-color: var(--red-color);
    padding: 10px;
    width: 40px;
    border-radius: 30px;
}

.wrap .cart_btn_div_widge img {
    width: 100%;
}
.wrap .cart_count_badge_widge {
    width: 20px;
    display: none !important;
    height: 20px;
    border-radius: 10px;
    background-color: YELLOW;
    color: BLACK;
    position: fixed;
    bottom: 65px;
    right: 15px;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10pt;
}

.entry_blank {
    z-index: 10;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: GRAY;
    opacity: 0.5;
}

.entry_info {
    width: 80%;
    height: 50%;
    display: flex;
    z-index: 11;
    position: fixed;
    top: 0;
    left: 0;
    background-color: WHITE;
    flex-direction: column;
    align-items: center;
    position: fixed;
    left: 10%;
    top: 25%;
}

.entry_info .entry_title {
    width: 100%;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--base-color);
    font-size: 15pt;
    color: WHITE;
    font-weight: bold;
}

.entry_info .entry_content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100% - 140px);
    align-items: center;
}

.entry_info .entry_content .rows {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: calc(100% - 30px);
    justify-content: space-evenly;
    padding: 15px;
    font-size: 14pt;
}

.entry_info .entry_content .rows div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25%;
    font-size: 15pt;
}

.entry_info .entry_content .rows div img {
    width: 40px;
}

.entry_info .enter_btn {
    display: flex;
    width: calc(100% - 20px);
    height: 55px;
    align-items: center;
    justify-content: center;
    background-color: var(--main-color);
    border-radius: 10px;
    color: WHITE;
    font-size: 13pt;
    font-weight: bold;
}

.receipt_blank {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: GRAY;
    opacity: 0.5;
    z-index: 4;
}

.receipt_info {
    width: 90%;
    position: fixed;
    height: 70%;
    display: none;
    z-index: 5;
    /* padding: 50px; */
    /* background: #F1F1F1; */
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    align-content: center;
    flex-direction: row;
    justify-content: center;
}

.receipt_info .receipt_background {
    background-image: url(/resources/img/design/receipt/receipt2.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.receipt_background .blank {
    width: 100%;
    height: 20px;
}

.receipt_background .dot_line {
    width: 80%;
    border-top: 1px dashed GRAY;
}

.receipt_background .row {
    width: 80%;
    display: flex;
    margin: 5px 0px;
}

.receipt_background .row div.right {
    text-align: right;
}

.receipt_background .row div.red {
    color: red;
}

.receipt_background .content {
    width: 80%;
    height: calc(100% - 320px);
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.receipt_background .content .menu_row {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 10px;
}

.receipt_background .content .menu_row div {
    width: 50%;
}

.receipt_background .content .menu_row div.width_30 {
    width: 30%;
}

.receipt_background .content .menu_row div.width_70 {
    width: 70%;
}

.receipt_background .content .menu_row div.right {
    text-align: right;
}



.receipt_background .row div {
    width: 50%;
}
.receipt_background .logo {
    font-size: 17pt;
    font-weight: bold;
}
.receipt_background .logo span {
    font-size: 12pt;
    color: #ABABAB;
    margin-left: 10px;
}

.wrap .order_count_badge {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: YELLOW;
    color: BLACK;
    /*position: fixed;*/
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10pt;
    margin-top: -40px;
    margin-left: 25px;
}

.wrap.simple .order_count_badge {
    margin-left: -25px;
    margin-top: -30px;
}

.wrap.shop_type_bz .order_count_badge {
    display: none;
}

.wrap .timer_btn_div_widge {
    position: fixed;
    bottom: 30px;
    right: 10px;
    /* height: 70px; */
    display: flex;
    align-items: center;
    z-index: 3;
    background-color: var(--main-color);
    padding: 10px;
    width: 40px;
    border-radius: 30px;
}

.wrap .timer_btn_div_widge.bottom_100 {
    bottom: 100px;
}

.wrap .timer_btn_div_widge.hidden {
    display: none;
}

.wrap .timer_btn_div_widge img {
    width: 100%;
}

.wrap .coupon_timer_info {
    position: fixed;
    bottom: 30px;
    right: 80px;
    /* height: 70px; */
    display: flex;
    align-items: center;
    z-index: 3;
    background-color: BLACK;
    padding: 10px;
    width: 60%;
    border-radius: 10px;
    flex-direction: column;
    overflow: hidden;
    white-space:nowrap;
}

.wrap .coupon_timer_info.bottom_100 {
    bottom: 100px;
}

.wrap .coupon_timer_info.hidden {
    display: none;
}

.wrap .coupon_timer_info .coupon_name {
    color: WHITE;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.wrap .coupon_timer_info .coupon_line {
    width: 100%;
    height: 1px;
    background-color: WHITE;
}

.wrap .coupon_timer_info .coupon_timer {
    color: RED;
    font-size: 20pt;
    letter-spacing: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.wrap .best_title {
    width: calc(100% - 30px);
    /* font-size: 13pt; */
    font-size: 1.0em;
    font-weight: bold;
    margin: 10px 15px;
}

.wrap .best_list {
    display: flex;
    width: calc(100% - 20px);
    overflow-x: auto;
    flex-direction: row;
    margin: 0px 10px 0px 10px;
    -ms-overflow-style: none;
 }
 
.wrap .best_list::-webkit-scrollbar {
  display: none;
}

.wrap .best_list .best_item {
    width: calc(45% - 12px);
    /* border: 1px solid #D5D5D5; */
    margin: 5px;
    border-radius: 10px;
    background-color: WHITE;
    /*min-width: 200px;*/
    min-width: 110px;
}

.wrap .best_list .best_item:nth-child(1) {
    margin-left: 0px;
}

.wrap .best_list .best_item div {
    position: relative;
    font-size: 1.0em;
    display: flex;
    justify-content: center;
    align-items: center;
    /*min-height: 40px;*/
    min-height: 30px;
    text-align: center;
    font-weight: normal;
}

.wrap .best_list .best_item div img {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 10px 10px 0px 0px;
}

.wrap .best_list .best_item img.soldout {
    filter: brightness(60%);
}

.wrap .best_list .best_item div:nth-child(2) {
    margin-top: 5px;
}

.wrap .best_list .best_item div:nth-child(3) {
    color: #FF5758;
    font-weight: bold;
    margin-bottom: 5px;
}

.wrap .best_list .best_item div:nth-child(3) span.origin_price {
    text-decoration: line-through;
}

.wrap .best_list .best_item div:nth-child(3) span {
    color: #ced4da;
    /*margin-right: 10px;*/
    margin-right: 3px;
    font-weight: normal;
}

.wrap.simple .cart_list_info {
    /*background: WHITE;*/
    height: 60px;
    width: calc(100% - 20px);
    position: fixed;
    bottom: 0px;
    z-index: 2;
    display: flex;
    align-items: center;
    /*justify-content: space-between;*/
    justify-content: space-evenly;
    padding: 5px 10px;
    font-weight: bold;
    border-top: 2px solid lightgray;
    background: #F1F1F1;
}

.wrap.simple .cart_list_info > div {
    height: 100%;
    display: flex;
    align-items: center;
}

.wrap.simple .cart_list_info .cart_img {
    /*-webkit-filter: invert(50%);
    filter: invert(50%);*/
    height: 80%;
}

.wrap.simple .cart_list_info .cart_btn {
    background-color: var(--pink-color);
    width: 100px;
    height: 80%;
    color: WHITE;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.wrap.simple .cart_list_info .footer_total_price {
    font-size: 13pt;
}

#country_list {
    position: absolute;
    top: 8px;
    right: 3px;

    display: flex;
    width: 80px;
    height: auto;
    padding: 5px 0;
    border-radius: 15px;
    background-color: rgba(0, 0, 0, 0.15);
    overflow: hidden;
    z-index: 1001;
}

#country_list_ul {
    list-style: none;
    padding: 0;
    margin: 0;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
}

.country_lists {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
    cursor: pointer;
}

.country_lists > img {
    width: 80%;
    height: auto;
}

.country_lists.country_active, .country_lists.country_view {
    display: flex !important;
}

.country_lists:not(.country_view) {
    display: none;
}

/**
 * (260318)
 * 헤더페이지 BACK 버튼
 */
.header_btn_back {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;

    border: none;
    background-color: transparent;
    z-index: 3;
    cursor: pointer;
}

.header_btn_back > svg {
    width: 30px;
    height: 30px;
}

/**
 * (260112)
 * 메인페이지 푸터
 */
.client_info_footer:not(.external_skin) {
    display: flex;
    padding: 10px;
    color: #525252;
    font-size: .9rem;
    margin: 20px 10px 70px 10px;
    background-color: #ededed;
    border-radius: 5px;
}

.client_info_footer.external_skin {
    display: flex;
    padding: 20px;
    color: #555;
    font-size: .85rem;
    margin-top: 50px;
    padding-bottom: 100px;
    background-color: #ededed;
}

.client_info_footer_icon {
    flex: .25;
}

.client_info_footer_contents {
    flex-shrink: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.client_info_footer_contents > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.client_info_footer_contents > .dist_line {
    width: 100%;
    height: 1px;
    background-color: #ddd;
}

.client_info_footer_contents > div > span:first-child {
    font-weight: bold;
}

/**
 *  (260317)
 *  외부노드용 하단 푸터
 */
.external_node_footer {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    
    width: 100%;
    height: 85px;
    padding: 5px 0;
    border-top: 1px solid #eee;
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(15px);
    box-shadow: 0 -3px 15px rgba(0, 0, 0, 0.08);

    box-sizing: border-box;
    z-index: 9999;
}

.external_node_footer_box {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.left_footer_box {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding: 0 5px;
    border-right: 1px solid #f0f0f0;
}

.cart_visual_wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.cart_svg_main {
    width: 29px; /* 너비 감소에 맞춰 아이콘 크기 조정 */
    height: 29px;
}

.badge_count_ui {
    position: absolute;
    top: -10px;
    right: -12px;
    background-color: #f24a51;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
    min-width: 22px;
    height: 22px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.price_text_ui {
    /* font-size: clamp(18px, 4.5vw, 26px); */
    font-size: 1.5rem;
    font-weight: 900;
    color: #000;
    letter-spacing: -1px;
    white-space: nowrap;
}

.right_footer_box {
    display: flex;
    flex: 1;
    height: 80%;
    gap: 6px;
    padding: 0 10px;
}

.external_footer_btn {
    flex: 1;
    border: none;
    border-radius: 6px;
    /* font-size: clamp(13px, 3.2vw, 15px); */
    font-size: 1.0rem;
    font-weight: 800;
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.1s;
    word-break: keep-all;
}
.external_footer_btn:active {
    transform: scale(0.95);
    filter: brightness(0.9);
}

.external_footer_btn.style_btn_pickup {
    background-color: #4C6EF5;
}

.external_footer_btn.style_btn_delivery {
    background-color: #3d9ba6;
}

.external_footer_btn.style_btn_shipping {
    border: 3px solid #3d9ba6;
    color: #3d9ba6;
    background: transparent;
}

.right_footer_box:has(.external_footer_btn:nth-last-child(n+3)) .external_footer_btn::after {
    content: ' ';
}

.right_footer_box:has(.external_footer_btn:nth-last-child(-n+2):first-child) .external_footer_btn {
    content: ' 주문';
}

/* -----
 * desc 템플릿
 * ----- */
.wrap .product_list.desc {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    box-sizing: border-box;
    padding: 0 10px 10px 10px;
}

.wrap .product_list.desc .product_title {
    all: unset;
    width: 100%;
    grid-column: 1 / -1;
    padding: 0 5px;
    font-size: 1.0em;
    font-weight: bold;
}

.wrap .product_list.desc .product_item {
    all: unset;
    position: relative;
    width: 100%;
    border-radius: 10px;
    background-color: white;
    overflow: hidden;
    box-shadow: 0 0 2px 1px lightgray, 0 0 7px 0 lightgray;
}

.wrap .product_list.desc .product_item .menu_icon {
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
    width: 100%;
    height: 45px;
    box-sizing: border-box;
    padding: 5px;
}

.wrap .product_list.desc .product_item .menu_icon > img {
    all: unset;
    width: auto;
    height: 100%;
}

.wrap .product_list.desc .product_item .menu_icon > .view_product_discount_per {
    all: usnet;
    flex: 1;
    display: flex;
    justify-content: flex-end;
}

.wrap .product_list.desc .product_item .menu_icon > .view_product_discount_per > span {
    padding: 6px 10px;
    font-size: .8rem;
    border-radius: 50px;

    background: linear-gradient(
        to bottom,
        #d9363d 0%, 
        #b81c22 85%,
        #8a1217 100%
    );
    box-shadow: 
        inset 0 1px 0 rgba(255, 255, 255, 0.4),
        inset 0 12px 12px rgba(255, 255, 255, 0.1),
        inset 0 -4px 6px rgba(0, 0, 0, 0.3);

    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.wrap .product_list.desc .product_item > .product_img {
    all: unset;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.wrap .product_list.desc .product_item > .product_img > img
, .wrap .product_list.desc .product_item > .product_img > video {
    width: 100%;
    aspect-ratio: 1 / 1;
}

.wrap .product_list.desc .product_img > .product_sale_type_icon {
    position: absolute;
    bottom: 0;
    z-index: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
    width: 100%;
    height: 45px;
    box-sizing: border-box;
    padding: 5px;
}

.wrap .product_list.desc .product_img > .product_sale_type_icon > .product_sale_type_icon_badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    min-width: 45px;
    max-width: 80px;
    height: 100%;
    max-height: 28px;
    gap: 5px;
    margin: 0;

    border: none;
    border-radius: 9999px;

    outline: none;

    color: #fff;
    font-size: .85rem;
    font-weight: bold;

    user-select: none;
    white-space: nowrap;
}

.wrap .product_list.desc .product_item > .product_text {
    all: unset;
    display: flex;
    flex-direction: column;
    padding: 10px;
}

.wrap .product_list.desc .product_item > .product_text > .product_name {
    all: unset;
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 8px;
}

.wrap .product_list.desc .product_item > .product_text > .product_desc {
    all: unset;
    position: relative;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 8px;

    overflow: hidden;
    text-overflow: ellipsis;
    color: gray;
    font-size: .9rem;

    word-break: break-all;
}

.wrap .product_list.desc .product_item > .product_text > .product_dist_line {
    all: unset;
    border-top: 1px solid #eee;
    margin: 0px 5px 8px 5px;
}

.wrap .product_list.desc .product_item div:nth-child(3) span {
    all: unset;
}

.wrap .product_list.desc .product_item > .product_text > .product_origin_price {
    all: unset;
    height: 20px;
    font-size: .85rem;
    line-height: 30px;
    text-decoration: line-through;
    color: lightgray;
    margin-bottom: 8px;
}

.wrap .product_list.desc .product_item > .product_text > .product_sell_price {
    all: unset;
    font-size: 1.1rem;
    font-weight: bold;
}

.wrap .product_list.desc .product_item > .product_text > .product_origin_price + .product_sell_price {
    color: #f24a51;
}

.wrap .product_list.desc .product_item > .product_text .product_price_unit {
    font-size: .8em;
    margin-left: 1.5px;
}

/**
 * (260318)
 * body에 external_node가 있는 cart_external_page에서의 경우
 */
body.external_node .wrap .cart_delivery_info {
    height: calc(100% - 60px);
}

body.external_node .wrap .cart_delivery_popup {
    top: 60px;
    height: calc(100% - 60px);
}

body.external_node .wrap .total_price_info, body.external_node .wrap .cart_delivery_popup_receipt {
    gap: 5px;
}

body.external_node .wrap .total_price_info.in_cart_delivery > div:not(:first-child)
, body.external_node .wrap .cart_delivery_popup_receipt > div:not(:first-child) {
    color: #a7a7a7;
    width: 100%;
    padding-left: 5%;
    margin: 0;
}

body.external_node .wrap .btn_group {
    padding: 10px;
    box-sizing: border-box;
    gap: 10px;
}

body.external_node .wrap .btn_group .open_delivery_popup
, body.external_node .wrap .btn_group .close_delivery_popup
, body.external_node .wrap .btn_group .payment_pg_btn_in_cart_delivery
, body.external_node .wrap .btn_group .external_payment_btn {
    margin: 0;
}

body.external_node .wrap .btn_group .open_delivery_popup:active
, body.external_node .wrap .btn_group .close_delivery_popup:active
, body.external_node .wrap .btn_group .payment_pg_btn_in_cart_delivery:active
, body.external_node .wrap .btn_group .external_payment_btn:active {
    transform: scale(0.95);
    filter: brightness(0.9);
}

/**
 * (260331) 장바구니에서 주문이 불가능한 상품에 대한 설정
 */
.cart_list_cant_order {
    position: absolute;
    inset: 0 0 5px 5px;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #6a728299;
    border-radius: 10px;
    color: #F8F9FA;
    font-size: 1.2rem;
    font-family: inherit;
    font-weight: 700;
    height: 100%;
}

.cart_list_cant_order + .menu_info .menu_delete {
    z-index: 2;
    background-color: #f7f9fa;
    border-radius: 100%;
    height: 25px;
    cursor: pointer;
}

.notice_cart_cant_order {
    width: 100%;
    height: 60px;
    padding: 10px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--red-color);
    word-break: keep-all;
    text-align: center;
}

.product_detail_type_icon {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    width: 100%;
    height: 40px;
    margin-bottom: 5px;
    padding: 5px;
    box-sizing: border-box;
}

.product_detail_type_icon > div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: auto;
    height: 100%;
    padding: 0 1rem;
    border-radius: 9999px;
    font-size: 12pt;
    color: #fff;
}

.product_detail_type_icon > div > svg {
    width: 12pt;
    height: 12pt;
}

.icon_badge_packaging {
    background-color: #f2994a;
    box-shadow: 
        0 3px 5px rgba(0, 0, 0, 0.1), 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.3),
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.2);
}

.icon_badge_packaging > svg {
    fill: currentColor;
}

.icon_badge_delivery {
    background-color: #2d9cdb;
    box-shadow: 
        0 3px 5px rgba(0, 0, 0, 0.1), 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.3),
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.2);
}

.icon_badge_delivery > svg {
    fill: currentColor;
}

.icon_badge_shipping {
    background-color: #27ae60;
    box-shadow: 
        0 3px 5px rgba(0, 0, 0, 0.1), 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.3),
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.2);
}

.icon_badge_shipping > svg {
    stroke: currentColor;
    fill: transparent;
}

.icon_badge_reserve {
    background-color: #9b51e0;
    box-shadow: 
        0 3px 5px rgba(0, 0, 0, 0.1), 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.3),
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.2);
}

.icon_badge_reserve > svg {
    fill: currentColor;
}

/* =========================
   장바구니 담당 직원 선택
========================= */

.cart_employee_area {
    margin: 18px 15px;
    padding: 18px;
    border: 1px solid #ececec;
    border-radius: 14px;
    background: #fff;
    box-sizing: border-box;
}

.cart_employee_title_wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.cart_employee_title {
    color: #222;
    font-size: 17px;
    font-weight: 700;
}

.cart_employee_required {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 999px;
    background: #fff0e4;
    color: #f58220;
    font-size: 11px;
    font-weight: 700;
}

.cart_employee_desc {
    margin-bottom: 13px;
    color: #888;
    font-size: 13px;
    line-height: 1.4;
}

.cart_employee_select_wrap {
    position: relative;
    width: 100%;
}

.cart_employee_select {
    width: 100%;
    height: 50px;

    padding: 0 46px 0 14px;
    border: 1px solid #ddd;
    border-radius: 10px;
    outline: none;

    background: #fff;
    color: #222;

    font-size: 15px;
    font-weight: 600;

    appearance: none;
    -webkit-appearance: none;

    box-sizing: border-box;
    cursor: pointer;
}

.cart_employee_select:focus {
    border-color: #f58220;
    box-shadow: 0 0 0 3px rgba(245, 130, 32, 0.12);
}

.cart_employee_select.selected {
    border-color: #f58220;
    background: #fffaf6;
}

.cart_employee_select_arrow {
    position: absolute;
    top: 50%;
    right: 16px;

    color: #777;
    font-size: 20px;
    line-height: 1;

    pointer-events: none;
    transform: translateY(-55%);
}

@media (max-width: 520px) {
    .cart_employee_area {
        margin-right: 10px;
        margin-left: 10px;
        padding: 16px;
    }

    .cart_employee_select {
        height: 48px;
        font-size: 14px;
    }
}