.qr_div {
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  position: relative;
  display: none;
  z-index: 100000;
  position: fixed;
  inset: 0;
}

.header_div {
  position: fixed;
  top: 0;
  width: 100%;
  max-width: 425px;
  background-color: #ffffff;
  z-index: 10;
}
.header_title_wrapper {
  width: 100%;
  /*   height: 56px; */
  /*   padding: 5px 5px 5px 5px; */
}
.header_title {
  display: flex;
  align-items: center;
  height: 58px;
  padding: 16px;
  overflow: hidden;

}
.header_title.hidden {
  height: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.cell_middle {
  display: table-cell;
  vertical-align: middle;
}
.search_input {
  width: 100%;
  height: 100%;
}
.title_div {
  padding-left: 10px;
}
.store_name_wrapper {
  text-align: center;
}
.store_name_div {
  /*   overflow: hidden; */
  /*   text-overflow: ellipsis; */
  /*   display: -webkit-box; */
  /*   -webkit-line-clamp: 2; */ /* 라인수 */
  /*   -webkit-box-orient: vertical; */
  /*   word-break: break-all; */
  /*   line-height: 1.0em; */
  /*   color: #ffffff; */
  overflow: scroll;
  /* 	text-overflow: ellipsis; */
  display: -webkit-box;
  -webkit-line-clamp: 1; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;
  font-weight: 700;
  font-size: 16px;
  line-height: 23px;
  color: #202020;
  margin-right: 8px;
}
/* .cart_div { */
/*   width: 46px; */
/*   text-align: center; */
/*   position: relative; */
/* } */
.lang_div {
  width: 50px;
  text-align: center;
}
#inout_change_div {
  width: 66px;
  text-align: center;
  display: none;
}
.contents_div {
  width: 100%;
  height: 100%;
  padding-top: 50px;
}
/* .c_group_div { */
/*   width: 100%; */
/*   height: 42px; */
/*   box-sizing: content-box; */
/*   overflow-x: auto; */
/*   border-top: 1px solid #f4f6f8; */
/*   border-bottom: 1px solid #f4f6f8; */
/*   scrollbar-width: none; */
/* } */
/* .c_group_div::-webkit-scrollbar { */
/*   display: none; */
/* } */
.c_group_div {
  width: calc(100% - 34px);
  box-sizing: content-box;
  overflow-x: auto;
}
.c_group_div_wrapper {
  display: flex;
  align-items: center;
  background: rgba(25, 118, 210, 0.2);
  margin: 0px 16px;
  border-radius: 12px;
}

#order_status_list {
  scrollbar-width: none;
}
#order_status_list::-webkit-scrollbar {
  display: none;
}
#order_history_list {
  scrollbar-width: none;
}
#order_history_list::-webkit-scrollbar {
  display: none;
}

/* #c_group_inner { */
/*   display: table; */
/*   height: 42px; */
/*   padding-top: 2px; */
/*   padding-bottom: 2px; */
/* } */
/* #c_group_inner ul { */
/*   display: table-row; */
/*   white-space: nowrap; */
/* } */
/* #c_group_inner ul li { */
/*   display: table-cell; */
/*   padding-left: 3px; */
/*   padding-right: 3px; */
/*   vertical-align: middle; */
/* } */
/* .c_group_default { */
/*   color: #637381; */
/* } */
.c_group_inner {
  display: table;
  padding-left: 4px;
}
.c_group_btn {
  width: 24px;
  height: 24px;
  background-image: url("/shop/img/icon-basic-kebab_vertical.svg");
  background-size: 24px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 4px;
}

.c_group_inner ul {
  display: table-row;
  white-space: nowrap;
}

.c_group_inner ul li {
  display: table-cell;
  padding-left: 16px;
  vertical-align: middle;
}

.c_group_item_select {
  display: table;
  height: 100%;
  font-weight: 800;
  font-size: 14px;
  line-height: 130%;
  color: #1976d2 !important;
}

.group_line {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #1976d2;
  border-radius: 3px;
  display: none;
}
.group_wrapper {
  position: relative;
  height: 100%;
}
.c_group_select .group_line {
  display: block;
}

/* .c_group_item_default { */
/*   display: table; */
/*   height: 100%; */
/*   vertical-align: middle; */
/*   padding-left: 18px; */
/*   padding-right: 18px; */
/*   background: #f4f6f8; */
/*   border: 1px solid rgba(99,115,129,0.5); */
/*   border-radius: 5px; */
/*   margin: 1px; */
/* } */
.c_group_item_default {
  display: table;
  height: 100%;
  font-weight: 800;
  font-size: 14px;
  line-height: 130%;
  color: #3a3a3f;
}
.c_group_item {
  padding: 11.5px 4px;
}
/* .c_group_select { */
/*   color: #3674d9; */
/* } */
/* .c_group_item_select { */
/*   display: table; */
/*   height: 100%; */
/*   vertical-align: middle; */
/*   padding-left: 18px; */
/*   padding-right: 18px; */
/*   background: #f9fafb; */
/*   border: 2px solid #3674d9; */
/*   border-radius: 5px; */
/*   margin: 0px; */
/* } */
.l_group_item {
  display: table;
  height: 100%;
  vertical-align: middle;
  padding-left: 18px;
  padding-right: 18px;
}
@media (max-width: 359px) {
  .l_group_item {
    padding-left: 12px;
    padding-right: 12px;
  }
}
@media (max-width: 319px) {
  .l_group_item {
    padding-left: 6px;
    padding-right: 6px;
  }
}
.l_group_item_default {
  /*  background: #f4f6f8;
  border: 1px solid rgba(99,115,129,0.5);
  border-radius: 5px; */
  margin: 1px;
}
.l_group_item_select {
  background: #f9fafb;
  border: 2px solid #3674d9;
  border-radius: 5px;
  margin: 0px;
}
.group_name {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-weight: 700 !important;
  line-height: 130% !important;
}
/* .item_style1 { */
/*   width: 50%; */
/*   padding: 5px; */
/* } */
.item_style1 {
  width: 50%;
  padding-top: 6px;
  cursor: pointer;
}
.item_style2 {
  width: 100%;
  /*   padding: 4px 5px 4px 5px; */
  cursor: pointer;
}
.item_br {
  border-right: 1px solid #e6e6e6;
}
/* .item_img_div { */
/*   width: 100%; */
/* } */
.item_img_div {
  width: 100%;
  position: relative;
}
/* .item_img_div2 { */
/*   display: flex; */
/*   align-items: center; */
/*   justify-content: center; */
/*   padding-left: 10px; */
/*   padding-top: 10px; */
/*   padding-right: 5px; */
/*   padding-bottom: 10px; */
/* } */
.item_img_div2 {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.item_img {
  /*   border-top-left-radius: 5px; */
  /*   border-top-right-radius: 5px; */
}
/* .c_item_div { */
/*   width: 100%; */
/*   height: calc(100% - 86px); */
/* } */
/* .c_item_inner { */
/*   width: 100%; */
/*   display: inline-flex; */
/*   flex-wrap: wrap; */
/* } */
.c_item_div {
  width: 100%;
  background: #f5f5f5;
}
.c_item_inner {
  width: 100%;
  display: inline-flex;
  flex-wrap: wrap;
  background: #fff;
  padding: 0px 16px;
  margin-bottom: 8px;
}

.c_item_inner:last-child {
  margin-bottom: 0px;
  padding-bottom: 10px;
}
/* .item_contents_div { */
/*   padding: 10px; */
/* } */
.item_contents_div2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 73%;
}

.item_contents_div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.item_name_wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.item_name_wrapper .sub_name {
  flex-basis: 100%;
}

.order_nolist {
  width: 100%;
  height: calc(100% - 48px - 53px); /* 필요 시 조정 */
  display: flex;
  align-items: center; /* 세로 가운데 */
  justify-content: center; /* 가로 가운데 */
  font-size: 18px;
  font-weight: 500;
}
.item_name_div3 {
  line-height: 15px;
  /* font-weight: 600; */
  font-size: 13px;
  color: #2a2a2a;

  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;
}
.favorite_count {
  font-weight: 400;
  font-size: 13px;
  line-height: 19px;
  color: #656c70;
  margin-left: 8px;
}
.favorite_count3 {
  font-weight: 400;
  font-size: 13px;
  line-height: 16px;
  color: #656c70;
  margin-left: 8px;
}
.item_amt_div3 {
  color: #000000;
  font-weight: 700;
  font-size: 13px;
  line-height: 15px;
}

/* .item_doc_div { */
/*   overflow: hidden; */
/*   text-overflow: ellipsis; */
/*   display: -webkit-box; */
/*   -webkit-line-clamp: 2; */ /* 라인수 */
/*   -webkit-box-orient: vertical; */
/*   word-break: break-all; */
/*   line-height: 1.5em; */
/*   max-height: 3.0em; */
/*   font-size: 13px; */
/* } */
.item_doc_div {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;

  font-weight: 500;
  font-size: 13px;
  line-height: 16px;
  color: #949494;
}
.item_doc_div2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;

  font-weight: 500;
  font-size: 13px;
  line-height: 16px;
  color: #949494;
  min-height: 16px;
  padding-top: 4px;
}
/* .item_name_div { */
/*   overflow: hidden; */
/*   text-overflow: ellipsis; */
/*   display: -webkit-box; */
/*   -webkit-line-clamp: 2; */ /* 라인수 */
/*   -webkit-box-orient: vertical; */
/*   word-break: break-all; */
/*   line-height: 1.5em; */
/*   max-height: 3.0em; */
/* } */
.item_name_div {
  line-height: 12px;
  /* font-weight: 700; */
  font-size: 13px;
  color: #2a2a2a;

  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;
}
.item_amt_div {
  color: #000000;
  font-weight: 700;
  font-size: 13px;
  line-height: 14px;
}

.item_amt_div_detail {
  color: #000000;
  font-weight: 700;
  font-size: 20px;
  line-height: 18px;
}

.layout_btn {
  width: 30px;
  height: 30px;
}
.layout_btn_list {
  background-image: url("/shop/img/list2_icon.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_line {
  background-image: url("/shop/img/lines_icon.svg");
  background-size: 28px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_grid {
  background-image: url("/shop/img/grid_icon.svg");
  background-size: 28px;
  background-repeat: no-repeat;
  background-position: center;
}
/* #clipboard_btn_div { */
/*   visibility: hidden; */
/* } */
/* .clipboard_btn { */
/*   width: 34px; */
/*   height: 32px; */
/*   background-image: url('img/clipboard2-check_white.svg'); */
/*   background-size: 26px; */
/*   background-repeat: no-repeat; */
/*   background-position: center; */
/*   margin: auto; */
/*   border-radius: 2px; */
/*   margin-bottom: 1px; */
/* } */
/* #clipboard_btn { */
/*   position: absolute; */
/*   width: 34px; */
/*   height: 32px; */
/*   top: 50%; */
/*   left: 50%; */
/*   transform: translate(-50%, -50%); */
/* } */
#clipboard_cnt {
  position: absolute;
  top: -6px;
  right: -5px;
  width: 10px;
  height: 10px;
  color: #ffffff;
  background-color: #e55c57;
  border-radius: 50%;
  font:
    10px/1.6em "NanumSquareRound",
    sans-serif;
  display: none;
}
/* #password_btn_div { */
/*   visibility: hidden; */
/*   width: 36px; */
/* } */
/* .password_btn { */
/*   width: 34px; */
/*   height: 32px; */
/*   background-image: url('img/qr-password-white.svg'); */
/*   background-size: 26px; */
/*   background-repeat: no-repeat; */
/*   background-position: center; */
/*   margin: auto; */
/*   border-radius: 2px; */
/*   margin-bottom: 1px; */
/* } */
/* #password_btn { */
/*   position: absolute; */
/*   width: 34px; */
/*   height: 32px; */
/*   top: 50%; */
/*   left: 50%; */
/*   transform: translate(-50%, -50%); */
/* } */
/* .cart_btn { */
/*   width: 34px; */
/*   height: 32px; */
/*   background-image: url('img/cart2_white.svg'); */
/*   background-size: 26px; */
/*   background-repeat: no-repeat; */
/*   background-position: center; */
/*   margin: auto; */
/*   border-radius: 2px; */
/*   margin-bottom: 4px; */
/* } */
/* #cart_btn { */
/*   position: absolute; */
/*   width: 34px; */
/*   height: 32px; */
/*   top: 50%; */
/*   left: 50%; */
/*   transform: translate(-50%, -50%); */
/* } */
#cqty_cnt {
  position: absolute;
  top: -6px;
  right: -5px;
  width: 15px;
  height: 15px;
  color: #ffffff;
  background-color: #e55c57;
  border-radius: 50%;
  font:
    10px/1.6em "NanumSquareRound",
    sans-serif;
  display: none;
  text-align: center;
}
#cart_cnt {
  position: absolute;
  top: -6px;
  right: -5px;
  width: 15px;
  height: 15px;
  color: #ffffff;
  background-color: #e55c57;
  border-radius: 50%;
  font:
    10px/1.6em "NanumSquareRound",
    sans-serif;
  display: none;
  text-align: center;
  padding: 0 0 0 1px;
}
.lang_btn {
  width: 48px;
  height: 35px;
  background-size: 45px;
  background-repeat: no-repeat;
  background-position: center;
  margin: auto;
  border-radius: 2px;
  margin-top: 1px;

}
#lang_btn{
	
	margin-right: 6px;
}
/* .lang_btn_kr { */
/*   background-image: url('img/flag_kr.png'); */
/* } */
/* .lang_btn_us { */
/*   background-image: url('img/flag_us.png'); */
/* } */
/* .lang_btn_cn { */
/*   background-image: url('img/flag_cn.png'); */
/* } */
/* .lang_btn_jp { */
/*   background-image: url('img/flag_jp.png'); */
/* } */

/* #inout_top_btn_div {
	display: none;
	margin-right: 8px;
} */
/* .inout_top_btn_img {
	width: 20px;
	height: 20px;
	background-size: 20px;
	background-position: center;
	background-image: url('img/local_dining_w-24px.svg');
}

.inout_top_btn_img:active {
	background-image: url('img/local_dining_w-24px_blue.svg');
}
.inout_top_dinein_btn_img {
	background-image: url('img/local_dining_w-24px.svg');
}
.inout_top_dinein_btn_img:active {
	background-image: url('img/local_dining_w-24px_blue.svg');
}
.inout_top_togo_btn_img {
	background-image: url('img/shopping_basket_w-24px.svg');
}
.inout_top_togo_btn_img:active {
	background-image: url('img/shopping_basket_w-24px_blue.svg');
}
.inout_top_delivery_btn_img {
	background-image: url('img/moped_w-24px.svg');
}
.inout_top_delivery_btn_img:active {
	background-image: url('img/moped_w-24px_blue.svg');
} */

#call_btn_div {
  display: none;
  margin-right: 16px;
  position: relative;
}
.call_btn_img {
  width: 20px;
  height: 20px;
  background-size: 18px;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("/shop/img/bell-line-icon_white.svg");
}
.call_btn_img:active {
  background-image: url("/shop/img/bell-line-icon_blue.svg");
}

#cqty_btn_div {
  display: none;
  margin-right: 16px;
  position: relative;
}
.cqty_btn_img {
  width: 16px;
  height: 16px;
  background-size: 20px;
  background-position: center;
  background-image: url("/shop/img/person.svg");
}
.cqty_btn_img:active {
  background-image: url("/shop/img/person_blue.svg");
}

#password_btn_div {
  display: none;
}
.password_btn_img {
  width: 16px;
  height: 16px;
  background-size: 16px;
  background-position: center;
  background-image: url("/shop/img/qr-password-white.svg");
  filter: brightness(0);
}
.password_btn_img:active {
  background-image: url("/shop/img/qr-password-blue.svg");
}

#cart_btn_div {
  /* 	display: none; */
}
.cart_btn_img {
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-position: center;
  background-image: url("/shop/img/cart2_white.svg");
  filter: brightness(0);
}
.cart_btn_img:active {
  background-image: url("/shop/img/cart2_blue.svg");
}

#clipboard_btn_div {
  display: none;
}
.clipboard_btn_img {
  width: 24px;
  height: 24px;
  background-size: 24px;
  background-position: center;
  background-image: url("/shop/img/clipboard2-check_white.svg");
  filter: brightness(0);
}
.clipboard_btn_img:active {
  background-image: url("/shop/img/clipboard2-check_blue.svg");
}

#lang_btn_div {
  display: none;
  color: #111;
}
#lang_btn_div .top_btn {
  display: flex;
  align-items: center;
  justify-content: center;
}
.lang_btn_img {
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-position: center;
  background-image: url(/shop/img/icon-basic-globe.svg);
  filter: brightness(0);
}
.lang_btn_img:active {
  background-image: url(/shop/img/icon-basic-globe_blue.svg);
}

#inq_btn_div {

}
#inq_btn {
  width: 28px;
  height: 28px;
  color: #ffffff;
  transition: background 0.15s, color 0.15s;
}
#inq_btn:hover {
  background: #ffffff;
  border: 1.6px solid #1976d2;
  color: #1976d2;
}
#inq_btn:active {
  background: #ffffff;
  border: 1.6px solid #1976d2;
  color: #1976d2;
}
#inq_btn svg {
  width: 17px;
  height: 17px;
}


#login_btn_div {
  display: none;
}

.login_btn_img {
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-position: center;
  background-image: url(/shop/img/login-white.svg);
  filter: brightness(0);
}
.login_btn_img:active {
  background-image: url(/shop/img/login-blue.svg);
}

#logout_btn_div {
  display: none;
}

.logout_btn_img {
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-position: center;
  background-image: url(/shop/img/logout-white.svg);
  filter: brightness(0);
}
.logout_btn_img:active {
  background-image: url(/shop/img/logout-blue.svg);
}

#share_btn_div {

}

.share_btn_img {
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-position: center;
  background-image: url(/shop/img/share-icon-white.svg);
  filter: brightness(0);
}
.share_btn_img:active {
  background-image: url(/shop/img/share-icon-blue.svg);
}

.top_btn {
  position: relative;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1976d2;
  border-radius: 16px;
}
.top_btn:active {
  background: #ffffff;
  border: 1.6px solid #1976d2;
}

.top_btn_reverse {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border-radius: 16px;
  border: 1.6px solid #1976d2;
}
.top_btn_reverse:active {
  background: #1976d2;
  /*   border: 1.6px solid #1976D2; */
}

.order_div {
  display: table;
  width: 100%;
  padding-left: 15px;
  padding-top: 5px;
  padding-right: 15px;
  padding-bottom: 5px;
  background-color: #f9e7e7;
  border-bottom: 1px solid #cccccc;
}
.order_cell1 {
  display: table-cell;
  width: 70%;
}
.order_time {
  font-size: 12px;
  line-height: 21px;
}
.order_doc {
  font-size: 14px;
  line-height: 21px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  word-break: break-all;
}
.order_amt {
  font-size: 14px;
  line-height: 21px;
}
.order_cell2 {
  display: table-cell;
  width: 30%;
}
.order_rdy_text {
  font-size: 13px;
  line-height: 21px;
}
.order_rdy_no {
  font-size: 22px;
  line-height: 42px;
  font-weight: bold;
}
#order_status_gray {
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}
/* #order_status_div { */
/*   position: fixed; */
/*   z-index: 100; */
/*   top: 0; */
/*   width: 100%; */
/*   height: 100%; */
/*   max-width: 425px; */
/*   margin: auto; */
/*   background-color: rgba(0, 0, 0, 0.2); */
/*   display: none; */
/* } */
/* #order_status_back { */
/*   width: 100%; */
/*   height: 100%; */
/*   display: flex; */
/*   justify-content: center; */
/*   align-items: center; */
/*   padding: 60px 10px; */
/* } */
/* #order_status_popup { */
/*   width: 100%; */
/*   height: 100%; */
/*   background: #ffffff; */
/*   border-radius: 5px; */
/*   padding: 5px; */
/* } */
/* #order_status_btn_wrap { */
/*   display: flex; */
/*   width: 100%; */
/*   height: 46px; */
/*   padding: 5px 10px; */
/*   background: #5c6ac4; */
/*   border-radius: 5px; */
/* } */
.order_status_btn_div {
  text-align: center;
  font-weight: bold;
}
.order_status_btn_div_select {
  /*   color: #ffffff; */
  color: #1a1a1a;
}
.order_status_btn_div_default {
  color: #212b36;
}
/* .order_status_btn { */
/*   flex-basis: 0; */
/*   flex-grow: 1; */
/*   display: flex; */
/*   justify-content: center; */
/*   align-items: center; */
/*   border-radius: 5px; */
/* } */
#order_status_div {
  position: fixed;
  z-index: 100;
  /* 	top: 0; */
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  /*   	background-color: rgba(0, 0, 0, 0.6); */
  /*  	display: none; */
  top: 100%;
  transition: all 0.3s ease-out;
}
#order_status_back {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 91px;

  display: none;
}
#order_status_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  position: relative;
}
#order_status_btn_wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: 48px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px #f3f3fb solid;
}
.order_status_close_btn {
  width: 18px;
  height: 18px;
  background-image: url("/shop/img/icon-sheet-close.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 16px;
}

#inout_div {
  position: fixed;
  z-index: 100;
  top: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.4);
  display: none;
}

.inout_btn_div {
  display: flex;
  width: 100%;
  background-color: #e5e5e5;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
  max-width: 425px;
  margin: auto;
  border-radius: 28px;
}
.inout_btn {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
}
.inout_btn_back {
  display: table;
  width: calc(50% - 9px);
  text-align: center;
  height: 146px;
  border-radius: 18px;
}
#inout_btn1 {
  /*   background: #e55c57; */
  color: #ffffff;
  background: #1976d2;
}
#inout_btn4 {
  /*   background: #e55c57; */
  color: #ffffff;
  background: #1976d2;
}
#inout_btn3 {
  /*   background: #e55c57; */
  color: #ffffff;
  background: #1976d2;
}
#inout_change_btn {
  border-radius: 2px;
  background: #e55c57;
  color: #ffffff;
  display: table;
  width: 56px;
  height: 30px;
  margin: auto;
}
#inout_change_btn_text {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 15px;
}
.inout_inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.inout_out_img {
  width: 62px;
  height: 62px;
  background-image: url("/shop/img/shopping_basket_w-24px.svg");
  background-size: 56px;
  background-repeat: no-repeat;
  background-position: center;
  margin: auto;
}
.inout_in_img {
  width: 62px;
  height: 62px;
  background-image: url("/shop/img/local_dining_w-24px.svg");
  background-size: 56px;
  background-repeat: no-repeat;
  background-position: center;
  margin: auto;
}
.inout_d_img {
  width: 62px;
  height: 62px;
  background-image: url("/shop/img/moped_w-24px.svg");
  background-size: 56px;
  background-repeat: no-repeat;
  background-position: center;
  margin: auto;
}
/* .soldout_div { */
/*   position: absolute; */
/*   width: calc(100% - 10px); */
/*   height: calc(100% - 9px); */
/*   background-color: rgba(238, 238, 238, 0.4); */
/*   background-image: url('img/soldout.png'); */
/*   background-size: 100%; */
/*   background-repeat: no-repeat; */
/*   background-position: center; */
/*   border-radius: 5px; */
/* } */
.soldout_div {
  position: absolute;
  width: calc(100% - 4.5px);
  height: calc(100% - 4.5px);
}
/* .soldout_div2 { */
/*   position: absolute; */
/*   width: calc(100% - 10px); */
/*   height: calc(100% - 8px); */
/*   background-color: rgba(238, 238, 238, 0.4); */
/*   background-image: url('img/soldout.png'); */
/*   background-size: 29%; */
/*   background-repeat: no-repeat; */
/*   background-position: left; */
/*   background-position-x: 10px; */
/*   border-radius: 5px; */
/* } */
.soldout_div2 {
  position: absolute;
  width: 100%;
  height: 100%;
}
/* .soldout_div3 { */
/*   position: absolute; */
/*   width: calc(100% - 10px); */
/*   height: calc(100% - 8px); */
/*   background-color: rgba(238, 238, 238, 0.4); */
/*   background-image: url('img/soldout.png'); */
/*   background-size: 25%; */
/*   background-repeat: no-repeat; */
/*   background-position: center; */
/*   border-radius: 5px; */
/* } */
.soldout_div3 {
  position: absolute;
  width: 100%;
  height: 100%;
}
.soldout_text {
  opacity: 0.2;
}
.soldout_item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #1a1a1a;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
  margin-left: 8px;
}

.soldout_item2 {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #1a1a1a;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
}
/* .list_group_name { */
/*   padding: 12px 6px 3px 6px; */
/*   font-weight: bold; */
/*   color: #3674d9; */
/* } */
.list_group_name {
  display: flex;
  flex-basis: 100%;
  align-items: center;
  font-weight: 700;
  font-size: 17px;
  line-height: 130%;
  color: #1a1a1a;
  width: 100%;
  margin-bottom: 6px !important;
}

#lang_select_btn_div {
  position: absolute;
  top: 16px;
  right: 16px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: flex-end;
}

.lang_select_btn {
  margin-top: 6px;
}

#lang_select_btn_close {
  margin-bottom: 2px;
}

#lang_select_div {
  /*   position: absolute; */
  /*   z-index: 20; */
  /*   top: 93px; */
  /*   right: 0px; */
  /*   background-color: #f9f9f9; */
  /*   border-top: 1px solid #cccccc; */
  /*   border-bottom: 1px solid #cccccc; */
  /*   border-left: 1px solid #cccccc; */
  /*   border-right: 1px solid #cccccc; */
  /*   box-shadow: 0 1px 6px 0 rgba(32, 33, 36, .28); */
  /*   border-radius: 1px; */
  /*   padding-left: 3px; */
  /*   padding-right: 3px; */
  /*   display: none; */
  position: fixed;
  z-index: 20;
  width: 100%;
  height: 100%;
  max-width: 425px;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}
/* #lang_select_div > .lang_div { */
/*   margin-top: 5px; */
/*   margin-bottom: 5px; */
/* } */
.item_card {
  height: 100%;
  /*   box-shadow: 0 1px 6px 0 rgba(32, 33, 36, .42); */
  /*   background: #f9fafb; */
  /*   border-radius: 5px; */
}
/* .item_btn { */
/*   position: absolute; */
/*   width: calc(100% - 8px); */
/*   height: calc(100% - 8px); */
/* } */
.item_btn {
  position: absolute;
  width: calc(100% - 4.5px);
  height: 100%;
  border-radius: 8px;
}
.tax_font {
  color: #696969;
  font-size: 13px;
  font-weight: normal;
}

.order_status_card {
  /*   margin-top: 10px; */
  /*   background: #f9fafb; */
  /*   box-shadow: 0 1px 6px 0 rgba(32, 33, 36, .42); */
  /*   padding: 3px; */
  width: 100%;
  display: inline-flex;
  flex-wrap: wrap;
  background: #fff;
  padding: 20px 16px 16px 16px;
  margin-bottom: 8px;
}
.order_status_body1 {
  display: flex;
  /*   padding: 3px; */
  font-size: 15px;
  width: 100%;
  margin-bottom: 4px;
}

.order_status_body1_orddt {
  padding-right: 5px;
}
.order_status_body1_time {
  /* margin-bottom: 8px; */
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #707070 !important;
}

.order_status_body1_status {
  flex-grow: 1;
  text-align: right;
  font-weight: bold;
  white-space: nowrap;
  font-size: 15px;
}
.order_status_02 {
  color: #ff334b;
}
.order_status_body2_name {
  flex-grow: 1;

  font-weight: 700;
  font-size: 16px;
  line-height: 130%;
  color: #1a1a1a;
}
.order_status_body2_qty {
  width: 50px;
  text-align: right;

  font-weight: 700;
  font-size: 16px;
  line-height: 130%;
  color: #1a1a1a;
}
.order_status_body2_amt {
  /* 	width: 90px; */
  text-align: right;

  width: 120px;
  font-weight: 700;
  font-size: 16px;
  line-height: 130%;
  color: #1a1a1a;
}
.order_status_body2_item_name {
  flex-grow: 1;

  line-height: 18px;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.04em;
  color: #2a2a2a;
  overflow: hidden;
  text-overflow: ellipsis;
}
.order_status_body2_item_cont {
  flex-shrink: 0;
  width: 50px;
  text-align: right;

  line-height: 17px;
  font-weight: 600;
  font-size: 14px;
  /*     letter-spacing: -0.04em; */
  color: #2a2a2a;
}
.order_status_body2_item_amt {
  flex-shrink: 0;
  /* 	width: 90px; */
  text-align: right;

  width: 120px;
  color: #ff334b;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
}
.order_status_body1_item_amt {
  flex-shrink: 0;
  /* 	width: 90px; */
  text-align: right;

  width: 120px;
  color: #ff334b;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
}
.order_status_body1_line {
  width: 100%;
  height: 1px;
  background: #212b36;
  margin-bottom: 10px;
}
.order_status_body1_item {
  display: flex;
  padding: 10px 0px 0px 0px;
  width: 100%;
  /*border-bottom: 1px #F3F3FB solid;*/
}
.order_status_body_control {
  padding: 5px 0px 2px 0px !important;
}
.order_status_body1_item_name {
  padding-right: 10px;

  line-height: 18px;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.04em;
  color: #2a2a2a;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  word-break: break-all;
}
.order_status_body1_item_cont {
  flex-shrink: 0;
  /* 	margin-left: auto; */

  line-height: 18px;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.04em;
  color: #2a2a2a;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  word-break: break-all;
}
.order_status_body1_item_amt {
  flex-shrink: 0;
  margin-left: auto;
  color: #ff334b;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
}
#order_history_sum {
  display: flex;
  padding: 0px 10px;
  height: 45px;
  align-items: center;
}
#order_history_sum_name {
  flex-grow: 1;

  font-weight: 700;
  font-size: 18px;
  line-height: 130%;
  color: #1a1a1a;
}
#order_history_sum_qty {
  flex-shrink: 0;
  width: 50px;
  text-align: right;

  text-align: right;
  line-height: 130%;
  font-weight: 600;
  font-size: 17px;
  color: #2a2a2a;
}
#order_history_sum_amt {
  flex-shrink: 0;
  /* 	width: 90px; */
  text-align: right;

  width: 120px;
  color: #ff334b;
  font-weight: 700;
  font-size: 17px;
  line-height: 130%;
}
.order_history_sum_line {
  width: 100%;
  height: 1px;
  background: #212b36;
}
.order_status_list {
  max-height: calc(100% - 48px - 53px);
  /*   padding: 16px; */
  font-size: 14px;
  overflow: scroll;
  background: #f5f5f5;
}
.order_history_list {
  height: calc(100% - 168px);
  padding: 5px;
  font-size: 14px;
  overflow: scroll;
}
.order_status_list_empty {
  width: 100%;
  height: calc(100% - 48px - 53px);
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
}
.order_status0 {
  color: #e55c57;
  width: 100%;
}
.order_status1 {
  color: #eec200;
  width: 100%;
}
.order_status2 {
  color: #50b83c;
  width: 100%;
}
.order_status3 {
  color: crimson;
  width: 100%;
}
.order_status4 {
  color: crimson;
  width: 100%;
}
.order_status5 {
  color: crimson;
  width: 100%;
}
.order_status9 {
  color: #3674d9;
  width: 100%;
}
.order_status10 {
  color: #1a1a1a;
  width: 100%;
}

.line_div {
  width: 100%;
  height: 1px;
  background-color: #e5e5e5;
}
.txt_post {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;
  line-height: 1.5em;
  height: 3em;
}
#spinner_div {
  display: none;
  position: fixed;
  z-index: 100;
  top: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.4);
}

#spinner_lottie_div {
  display: none;
  position: fixed;
  z-index: 1000;
  top: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.4);
}

#snackbar {
  min-width: 250px;
  margin-left: -125px;
  background-color: rgba(0, 0, 0, 0.4);
  color: #fff;
  text-align: center;
  border-radius: 8px;
  padding: 16px;
  position: fixed;
  z-index: 99999;
  left: 50%;
  bottom: 30px;
  font-size: 15px;
  display: none;
}

.order_cancel_btn {
  flex-basis: 0;
  flex-grow: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-radius: 5px;
  padding-top: 16px;
}
.order_cancel_btn_div {
  color: #ffffff;
  background-color: crimson;
  padding: 6px 12px 6px 12px;
  border-radius: 6px;
  opacity: 0.8;
  font-weight: bold;
}
.order_cancel_btn_div:active {
  opacity: 0.6;
}
#c_group_header_div {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch; /* 부드러운 터치 스크롤 */
}
#c_group_header_inner > ul {
  display: flex;
  white-space: nowrap; /* 필요시 */
  width: max-content; /* 내용 길이만큼 */
}
#c_group_header_inner > ul > li:first-child {
  margin-left: 0;
  padding-left: 0;
}

#c_group_header_inner > ul {
  margin: 0px 5px 0px 8px;
  padding-left: 0;
}

#c_group_header_div_wrapper {
  display: none;
}

#c_group_header_inner {
  padding-left: 13px !important;
}

.group_wrapper {
  position: relative;
  height: 100%;
}

#group_popup_title {
  font-weight: 700;
  font-size: 16.5px;
  line-height: 130%;
  color: #1e1e22;
}
#group_popup_contents {
  display: flex;
  position: relative;
  padding: 24px 20px;
  flex-direction: row;
  flex-wrap: wrap;
}

#group_popup_div {
  position: fixed;
  z-index: 90;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}

::-webkit-scrollbar {
  display: none;
}

.media_div {
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 0px;
  padding-bottom: 8px;
  background: #fff;
}

.list_group_doc {
  font-weight: 400;
  font-size: 12px;
  line-height: 130%;
  color: #3f3f3f;
  width: 100%;
  margin-top: 5px;
  padding-left: 2px;
}

#group_popup_header {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px #cfcfcf solid;
  position: relative;
}

#group_popup_close_btn {
  width: 18px;
  height: 18px;
  background-image: url(/shop/img/icon-sheet-close.svg);
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 12px;
  right: 16px;
}

#group_popup {
  width: 100%;
  background-color: #ffffff;
  position: absolute;
  overflow: auto;
  border-radius: 16px 16px 0px 0px;
}

#floating_btn {
  position: fixed;
  width: 90px;
  height: 40px;
  right: 16px;
  bottom: 24px;
  background: #1976d2;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
  border-radius: 60px;
  display: none;
}

#floating_btn_event {
  position: fixed;
  width: 50px;
  height: 50px;
  left: auto;
  bottom: 24px;
  background: #1976d2;
  margin-left: 15px;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
  border-radius: 60px;
  display: none;
}

#floating_btn_coupon {
  position: fixed;
  width: 50px;
  height: 50px;
  left: auto;
  bottom: 24px;
  background: #1976d2;
  margin-left: 15px;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
  border-radius: 60px;
  display: none;
}
#floating_btn_coupon img {
  transform-origin: center center;
  will-change: transform;
  animation: btn-vibrate 0.9s linear infinite;
  widht: 30px;
  height: 30px;
}

@keyframes btn-vibrate {
  0% {
    transform: translate(0, 0) rotate(0deg);
  }
  20% {
    transform: translate(-1px, 1px) rotate(-1deg);
  }
  40% {
    transform: translate(-1px, -1px) rotate(1deg);
  }
  60% {
    transform: translate(1px, 0.5px) rotate(0deg);
  }
  80% {
    transform: translate(1px, -1px) rotate(1deg);
  }
  100% {
    transform: translate(0, 0) rotate(0deg);
  }
}

#floating_btn_event img {
  transform-origin: 50% 8%; /* 위쪽을 축으로 매달린 느낌 */
  will-change: transform;
  animation: btn-pendulum 1.5s ease-in-out infinite;
  widht: 28px;
  height: 28px;
}

@keyframes btn-pendulum {
  0%,
  100% {
    transform: rotate(0deg);
  }
  20% {
    transform: rotate(8deg);
  } /* 각도 줄임 */
  50% {
    transform: rotate(0deg);
  }
  80% {
    transform: rotate(-8deg);
  } /* 각도 줄임 */
}
.floating_btn_div {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
}

#detail_floating_btn_event {
  position: fixed;
  width: 50px;
  height: 50px;
  left: auto;
  bottom: 24px;
  background: #1976d2;
  margin-left: 15px;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
  border-radius: 60px;
  display: none;
}

.floating_btn_div_text_event {
  font-weight: 700;
  font-size: 13px;
  line-height: 20px;
  color: #ffffff;
  margin-left: 4px;
}

.floating_btn_div_text {
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #ffffff;
  margin-left: 4px;
}

.item_name_div2 {
  line-height: 16px;
  /*  font-weight: 800; */
  font-size: 13px;
  /* letter-spacing: -0.01em; */
  color: #2a2a2a;

  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 라인수 */
  -webkit-box-orient: vertical;
  word-break: break-all;
}

.soldout_img {
  filter: brightness(40%);
}

.soldout_item_center {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #1a1a1a;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
}

.soldout_item_img {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #1a1a1a;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
}

#store_info_div {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 82px;
  padding-top: 48px;
  background: #fff;
  margin-top: -10px;
}
#store_name_text {
  font-weight: 600;
  font-size: 16px;
  line-height: 19px;
  color: #949494;
  word-break: auto-phrase;
}
#store_addr_text {
  font-weight: 400;
  font-size: 13px;
  line-height: 16px;
  color: #949494;
  margin-top: 8px;
}
#store_phon_text {
  font-weight: 400;
  font-size: 13px;
  line-height: 16px;
  color: #949494;
  margin-top: 4px;
}

.swiper-container {
  height: auto;
}

.new_item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #f4cf00;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 2px;
  color: #1a1a1a;
  margin-left: 8px;
}

.new_item2 {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #f4cf00;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #1a1a1a;
}

.new_item_img {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #f4cf00;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #1a1a1a;
  margin-left: 8px;
}

.hit_item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #ff334b;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
  margin-left: 8px;
}

.hit_item2 {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #ff334b;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
}
.hit_item_img {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #ff334b;
  border-radius: 60px;
  /* font-family: 'NEXON Football Gothic'; */
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  line-height: 10px;
  color: #ffffff;
  margin-left: 8px;
}

#detail_gray {
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}
/*20251010-제품상세화면  */
#detail_div {
  position: fixed;
  z-index: 100;
  /* 	top: 0; */
  width: 100%;
  max-height: calc(100dvh - env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-sizing: border-box;
  max-width: 425px;
  margin: auto;
  /*   	background-color: rgba(0, 0, 0, 0.6); */
  /*  	display: none; */
  /* top: 100%; */
  bottom: 0; /* 화면 맨 아래에 붙임 */
  top: auto !important; /* 기존 top: 0px; 제거 */
  transition:
    transform 0.3s ease-out,
    opacity 0.2s ease-out;
  transform: translateY(100%); /* 처음엔 아래로 숨김 */
  opacity: 0;
  will-change: transform;
}
#detail_list {
  flex: 1 1 auto; /* 남은 높이 차지 */
  overflow-y: auto; /* 여기만 스크롤 */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain; /* 스크롤 체인 방지 */
  touch-action: pan-y; /* 세로 스크롤 의도 힌트 */
  min-height: 0;
  transition: height 0.2s ease;
}

#detail_back {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  /* padding-top: 91px; */

  display: none;
}
#detail_popup {
  display: flex;
  flex-direction: column;
  width: 100%;
  /* height: 100% */
  /* max-height: 86vh; */
  background: #ffffff;
  /* border-radius: 16px 16px 0 0; */
  max-height: calc(100dvh - env(safe-area-inset-bottom, 0px));
  overflow: hidden;
  position: relative;
}
#detail_btn_wrap {
  flex: 0 0 48px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  background: #ffffff;
  /* border-radius: 16px 16px 0 0; */
}

.item_img_div .item_img {
  width: 100% !important;
  object-fit: cover !important;
}

.detail_btn {
  width: 18px;
  height: 18px;
  background-image: url("/shop/img/icon-sheet-close.svg");
  background-repeat: no-repeat;
  background-position: center;
  /* margin-right: 16px; */
}
.detail_btn_div_select {
  color: #ffffff;
}

#cart_gray {
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}

#cart_div {
  position: fixed;
  z-index: 100;
  /* 	top: 0; */
  width: 100%;
  /* 20251126 - 장바구니css */
  height: 100%;
  top: 100%;
  max-height: 100%;
  max-width: 425px;
  /* bottom: 0; */
  bottom: -100%;
  top: auto !important;
  margin: auto;
  /*   	background-color: rgba(0, 0, 0, 0.6); */
  /*  	display: none; */

  transition: all 0.3s ease-out;
}
#cart_back {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 91px;

  display: none;
}
#cart_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  position: relative;
  /* 20251126 - 장바구니수정 */
  display: flex;
  flex-direction: column;
}
#cart_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 46px;
  background: #ffffff;
  border-radius: 0;
  border-bottom: 1px #f3f3fb solid;
  position: relative;
}
.cart_btn {
  position: absolute;
  right: 18px;
  top: 12px;
  width: 18px;
  height: 18px;
  background-image: url("/shop/img/icon-sheet-close.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-position: center;
  border-radius: 12px;
}
.cart_btn_div_select {
  color: #ffffff;
}

.i_contents_div {
  /*   padding: 0px 20px; */
  background: #f5f5f5;
}

#i_name {
  word-break: break-all;
  /* font-weight: 700; */
  font-size: 16px;
  line-height: 130%;
  color: #000000;
}

.i_amt {
  font-weight: 700;
  font-size: 18px;
  line-height: 130%;
  color: #000000;
}

.i_amt2 {
  font-weight: 700;
  font-size: 18px;
  line-height: 130%;
  color: #000000;
  display: none;
}

.i_dlvdiv {
  font-weight: 500;
  font-size: 10px;
  line-height: 130%;
  color: #000000;
  display: none;
}

.discount {
  font-weight: 500;
  font-size: 17px !important;
  line-height: 130%;
  color: gray !important;
  text-decoration: line-through;
  text-decoration-color: black;
}

#i_doc {
  width: 100%;
  text-align: left;
  word-break: auto-phrase;
  font-weight: 400;
  font-size: 12px;
  line-height: 160%;
  color: #59595f;
  padding: 2px 16px;
  background: #ffffff;
}
.select-item-amt.lang-gap {
  align-self: flex-start !important;
}

.dash-circle {
  /*   width: 28px; */
  /*   height: 28px; */
  /*   background-image: url('img/dash-circle.svg'); */
  /*   background-size: 24px; */
  /*   background-repeat: no-repeat; */
  /*   background-position: center; */
  /*   margin: auto; */
  /*   border-radius: 14px; */
  width: 10px;
  height: 10px;
  background-size: 10px;
  background-position: center;
  background-image: url("/shop/img/minus_bold_blue.svg");
}
.dash-circle:active {
  background-image: url("/shop/img/minus_bold_white.svg");
}

.item_qty_input {
  width: 40px;
  height: 32px;
  margin-left: 8px;
  margin-right: 8px;
  text-align: center;
  padding-left: 1px;
  padding-right: 1px;
  font-size: 14px;
}

.plus-circle {
  /*   width: 28px; */
  /*   height: 28px; */
  /*   background-image: url('img/plus-circle.svg'); */
  /*   background-size: 24px; */
  /*   background-repeat: no-repeat; */
  /*   background-position: center; */
  /*   margin: auto; */
  /*   border-radius: 14px; */
  width: 10px;
  height: 10px;
  background-size: 10px;
  background-position: center;
  background-image: url("/shop/img/plus_white.svg");
}
.plus-circle:active {
  background-image: url("/shop/img/plus_blue.svg");
}
#detail_popup .order_btn_div {
  flex: 0 0 auto;
}
.order_btn_div {
  display: flex;
  width: 100%;
  /*   background-color: #eef0f9; */
  /*   padding-left: 5px; */
  /*   padding-right: 5px; */
  /*   padding-top: 7px; */
  /*   padding-bottom: 7px; */
  background-color: #ffffff;
  padding: 14px;
  bottom: 0;
  border-top: 8px #f3f3fb solid;
  position: relative;
  align-items: center;
}
#order_btn1 {
  /*   border: 1px solid #3674d9; */
  border-radius: 5px;
  background: #1976d2;
  color: #ffffff;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
}
.order_btn_back {
  display: table;
  width: 35%;
  text-align: center;
  height: 40px;
  margin-left: 70px;
}
.order_btn {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #ffffff;
}

.order_total_div {
  display: table;
  width: 50%;
  height: 46px;
  /*   padding-left: 20px; */
}

#order_total_label {
  font-size: 14px;
  font-weight: 700;
}

.order_status_group_div {
  padding-top: 8px;
  box-sizing: content-box;
  border-bottom: 1px solid #f2f3f5;
}

#order_history_footer {
  width: 100%;
  padding: 16px;
  position: absolute;
  bottom: 0px;
}

.cart_btn_back {
  display: table;
  /*   width: 50%; */
  text-align: center;
  height: 46px;
  width: 100%;
  margin-right: 6px;
}

.cart_total_div {
  display: table;
  width: 50%;
  height: 46px;
  /*   padding-left: 20px; */
}

.cart_btn_div {
  display: flex;
  width: 100%;
  /*   background-color: #eef0f9; */
  /*   padding-left: 5px; */
  /*   padding-right: 5px; */
  /*   padding-top: 7px; */
  /*   padding-bottom: 7px; */
  background-color: #ffffff;
  padding: 8px 14px;
  position: absolute;
  bottom: 0;
  border-top: 8px #f3f3fb solid;
}
#cart_btn2 {
  /*   border: 1px solid #3674d9; */
  border-radius: 5px;
  background: #1976d2;
  color: #ffffff;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
}

.go_order_btn_div {
  /*   border: 1px solid #3674d9; */
  border-radius: 5px;
  background: #1976d2;
  color: #ffffff;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
  padding: 8px 15px;
  text-align: center;
  height: 35px;
  margin-top: 10px;
  display: table;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
}

.go_order_btn {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-weight: 600;
  font-size: 15px;
  line-height: 10px;
  color: #ffffff;
}
.cart_btn2 {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #ffffff;
}

.pay_btn_div {
  display: flex;
  width: 100%;
  /*   background-color: #eef0f9; */
  /*   padding-left: 5px; */
  /*   padding-right: 5px; */
  /*   padding-top: 7px; */
  /*   padding-bottom: 7px; */
  background-color: #ffffff;
  padding: 16px;
  position: fixed;
  bottom: 0;
  border-top: 1px #f3f3fb solid;
}
#pay_btn2 {
  /*   border: 1px solid #3674d9; */
  border-radius: 12px;
  background: #1976d2;
  color: #ffffff;
  box-shadow: 0px 4px 12px rgba(66, 93, 146, 0.12);
}
.pay_btn2 {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #ffffff;
}

.order_select {
  padding: 16px;
  background: #ffffff;
  /* margin-bottom: 6px; */
  margin-bottom: 0;
  border-bottom: 6px solid #f5f5f5;
}
#cart_list .order_select:last-child:nth-child(n + 3) {
  border-bottom: none;
  margin-bottom: 6px;
}

.selected_name {
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.selected_name_text {
  word-break: auto-phrase;
  font-weight: 700;
  font-size: 18.5px;
  line-height: 130%;
  /*     color: #000000; */
  color: #1a1a1a;
  margin-bottom: 5px;
  min-height: 38px;
}

.selected_name_text2 {
  word-break: auto-phrase;
  font-weight: 500;
  font-size: 17.5px;
  line-height: 130%;
  margin-right: 10px;
  /*     color: #000000; */
  color: #1a1a1a;
}
.x-circle {
  width: 24px;
  height: 24px;
  background-image: url("/shop/img/x-circle.svg");
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: center;
  /* margin: auto; */
  border-radius: 14px;
  margin-top: 2px;
  min-width: 5%;
}

.selected_tbl {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.selected_etc {
  padding-top: 8px;
}

#cart_total_label {
  font-size: 14.5px;
  font-weight: 700;
}

.pay_btn_back {
  display: table;
  /*   width: 50%; */
  text-align: center;
  height: 46px;
  width: 100%;
}

.no_cart_msg {
  /*   text-align: center; */
  /*   display: none; */
  display: flex;
  flex-direction: column; /* ⬅ 세로로 배치 */
  align-items: center; /* 가로 가운데 정렬 */
  justify-content: center; /* 세로 가운데 정렬 */
  text-align: center; /* 텍스트도 가운데 정렬 */
  font-size: 18px;
  font-weight: 500;
  width: 100%;
  /* height: 450px; */
  height: 100%;
}

.video-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.video-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
  transform: translate3d(0px, 0, 0);
}
.video-inner {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.select-item-group-name {
  font-weight: 700;
  font-size: 18px;
  line-height: 130%;
  color: #1a1a1a;
  padding-bottom: 5px;
}

.select-item-card.first.last {
  padding: 16px 16px 7px 16px;
}

.select-item-card.first {
  padding: 15px 16px 10px 16px;
}

.select-item-card.last {
  padding: 7px 16px 7px;
}

.select-item {
  /*     display: flex; */
  padding-top: 11px;
  padding-bottom: 10px;
  border-bottom: 1px #f3f3fb solid;
}

.select-item [type="radio"] {
  vertical-align: middle;
  /*     appearance: none; */
}

.select-item-name {
  line-height: 18px;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.04em;
  color: #2a2a2a;
  margin-left: 10px;
}

.select-item-amt {
  color: #ff334b;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
  padding-left: 5px;
}

.select-item-label {
  margin-bottom: 0px;
  width: 100%;
  display: flex;
}

#order_confirm_div {
  position: fixed;
  z-index: 90;
  top: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.2);
  display: none;
}
#order_confirm_back {
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 10px;
}
#order_confirm_popup {
  width: 100%;
  background: #ffffff;
  border-radius: 10px;
  padding: 5px;
}
#order_confirm_title {
  background: #1976d2;
  color: #ffffff;
  padding: 10px 20px;
  margin: auto;
  border-radius: 10px;
}
#order_confirm_title_wrap {
  text-align: center;
  padding: 30px 0px;
  display: flex;
}
#order_confirm_body_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
}
.order_confirm_status {
  width: 80px;
  height: 80px;
  border: 2px solid #637381;
  border-radius: 50%;
}
.order_confirm_status1 {
  border: 2px solid #eec200;
  background-image: url("/shop/img/check_1.svg");
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: center;
}
.order_confirm_status2_gray {
  border: 2px solid #50b83c;
  background-image: url("/shop/img/check_3.svg");
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: center;
}
.order_confirm_status2 {
  border: 2px solid #50b83c;
  background-image: url("/shop/img/check_2.svg");
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: center;
}
.order_confirm_arrow_div {
  display: flex;
  width: 88px;
  justify-content: center;
}
.order_confirm_arrow {
  width: 22px;
  height: 80px;
}
.order_confirm_arrow_nonfill {
  background-image: url("/shop/img/right_arrow1_blue.svg");
  background-size: 32px;
  background-repeat: no-repeat;
  background-position: center;
}
.order_confirm_arrow_fill {
  background-image: url("/shop/img/right_arrow2_blue.svg");
  background-size: 32px;
  background-repeat: no-repeat;
  background-position: center;
}
#order_confirm_body2_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -5px;
}
.order_confirm_text {
  width: 80px;
  padding: 12px 0px;
  text-align: center;
  font-weight: bold;
}
#order_confirm_text_blank {
  width: 88px;
}
#order_confirm_footer_wrap {
  text-align: center;
  padding: 30px 0px;
}
#order_confirm_footer_count_wrapper {
  padding-top: 18px;
  font-size: 24px;
  display: flex;
}
#order_confirm_footer_count {
  margin: auto;
  border-radius: 50px;
  border: #1976d2 solid 2px;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#spinner_text {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 19px;
  line-height: 1.9em;
  padding-top: 160px;
  width: 100%;
  text-align: center;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* 메뉴리스트 그리드 */
.c_inout_div {
  display: flex;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 6px;
  padding: 1px 0px;
}
#c_inout_div_wrapper {
  height: 36px;
  padding: 0px 16px;
  margin: 10px 0px 6px 0px;
}

.c_inout_div_new {
  display: flex;
  width: 100%;
  height: 100%;
  padding: 1px 0px 3px 0px;
  margin-bottom: -6px;
}
.c_inout_btn_new.full {
  flex: 1 1 100%;
}
#c_view_div_wrapper {
  height: 36px;
  padding: 0px 16px;
  margin-bottom: 5px;
}

#c_view_div {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.select-item-label {
  margin-bottom: 0px;
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 4px;
  padding-bottom: 4px;
  cursor: pointer;
}

.l_group_item_select_new {
  opacity: 1;
}

.l_group_item_new {
  display: table;
  height: 100%;
  vertical-align: middle;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 17px;
  margin: 1px;
}

.layout_btn_list {
  background-image: url("/shop/img/list2_icon_gray.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_list_selected {
  background-image: url("/shop/img/list2_icon.svg");
  background-size: 26px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_line {
  background-image: url("/shop/img/device_list_icon_149945_gray.svg");
  background-size: 26px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_line_selected {
  background-image: url("/shop/img/device_list_icon_149945_black.svg");
  background-size: 28px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_grid {
  background-image: url("/shop/img/apps_overview_icon_149971_gray.svg");
  background-size: 22px;
  background-repeat: no-repeat;
  background-position: center;
}
.layout_btn_grid_selected {
  background-image: url("/shop/img/apps_overview_icon_149971_black.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center;
}

.l_group_item_default_new {
  opacity: 0.7;
}
.add_bottom_border {
  display: none;
  border-top: 2px solid #dddddd;
  margin: 8px 14px;
}

.c_inout_btn_new {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  flex-basis: 50%;
  height: 100%;
  color: #707070;
  border-bottom: 2px solid #ffffff;
  padding-bottom: 10px;
}

.c_inout_selected_new {
  color: #000000;
  border-bottom: 2px solid #1976d2;
}

.favorite-count {
  font-weight: 400;
  font-size: 13px;
  line-height: 19px;
  color: #656c70;
  text-align: center;
}
#cart_title {
  color: #2a2a2a;
  font-weight: 700;
  font-size: 16.5px;
}
.select-item-disable {
  opacity: 0.5;
}

#footer_cart {
  position: fixed;
  bottom: 0px;
  width: 100%;
  height: 64px;
  background: #ffffff;
  border-top: 1px solid #b0b0b0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  max-width: 425px;
  display: none;
}
#footer_cart_btn_wrapper {
  background: #1976d2;
  border-radius: 12px;
  height: 100%;
  width: 100%;
}
#footer_cart_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  height: 100%;
  width: 100%;
}
#footer_cart_inner {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 15px;
  color: #ffffff;
}
#footer_cart_amt {
  font-weight: 700;
  font-size: 15px;
  color: #ffffff;
  padding: 0px 5px;
}
#footer_cart_text {
  font-weight: 700;
  font-size: 15px;
  color: #ffffff;
  padding: 0px 5px;
}
#footer_cart_cnt {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  border-radius: 14px;
  background: #ffffff;
  color: #1976d2;
  width: 17px;
  height: 17px;
}

#order_list_div {
  position: fixed;
  z-index: 109;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
}
#order_list_back {
  width: 100%;
  height: 100%;
  padding-top: 0px;
}
#order_list_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
}
#order_list_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 56px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px solid #dddddd;
  position: relative;
}

.order_list_btn {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 18px;
  height: 18px;
  background-image: url("/shop/img/icon-sheet-close.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-position: center;
  border-radius: 12px;
}
#order_list_title {
  color: #000000;
  font-weight: 700;
  font-size: 17px;
}

#order_list_contents {
  padding: 0px 0px 0px 0px;
  overflow-y: overlay;
  height: calc(100% - 56px);
}
#order_list_contents::-webkit-scrollbar {
  width: 1vw;
  display: block;
}
#order_list_contents::-webkit-scrollbar-thumb {
  background-color: hsla(0, 0%, 42%, 0.49);
  border-radius: 100px;
}

#order_list_body1 {
  padding: 0px 18px;
}
.order_list_order_div {
  padding: 14px 8px 4px 8px;
  border-bottom: 1px solid #707070;
}
.order_list_order_top {
  display: flex;
  align-items: center;
}

.order_list_order_btn {
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  border-radius: 10px;
  background: #1976d2;
  margin-left: auto;
  width: 88px;
  height: 32px;
}

.order_list_order_btn > div {
  border-radius: 10px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.order_list_order_contents {
  margin-top: 0px;
  border-radius: 12px;
  border: 0px solid #dddddd;
  padding: 0px 0px 12px 0px;
}
.order_list_order_item {
  font-size: 15px;
  font-weight: 400;
  color: #000000;
  margin-top: 2px;
}
.order_list_order_additem {
  font-size: 14px;
  font-weight: 400;
  color: #707070;
  padding-left: 4px;
  margin-top: 0px;
}
.order_list_order_bottom {
  display: flex;
  align-items: center;
  padding: 4px 0px 4px 0px;
}
.order_list_order_cancel_text {
  font-size: 16px;
  font-weight: 400;
  color: #ff334b;
  margin-left: auto;
  margin-right: 5px;
}

.order_list_order_cancel_text.lang_en {
  margin-right: 0;
}

.order_list_order_cancel_text.lang_ko {
  margin-right: 5px;
}

.order_list_order_cancel_text.lang_th {
  margin-right: 10px;
}

.order_list_order_amt_text {
  font-size: 16px;
  font-weight: 700;
  color: #000000;
}
.order_list_order_amt {
  font-size: 16px;
  font-weight: 700;
  color: #000000;
  margin-left: 6px;
}

#order_complete_gray {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
}
#order_complete_div {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
}
#order_complete_back {
  width: 100%;
  height: 100%;
  padding-top: 0px;
}
#order_complete_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
}
#order_complete_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 56px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  position: relative;
}
.order_complete_btn {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 18px;
  height: 18px;
  background-image: url("/shop/img/icon-sheet-close.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-position: center;
  border-radius: 12px;
}

#order_complete_title {
  color: #000000;
  font-weight: 700;
  font-size: 17px;
}
#order_complete_contents {
  padding: 0px 0px 0px 0px;
  overflow-y: overlay;
  height: calc(100% - 56px);
}
#order_complete_contents::-webkit-scrollbar {
  width: 1vw;
  display: block;
}
#order_complete_contents::-webkit-scrollbar-thumb {
  background-color: hsla(0, 0%, 42%, 0.49);
  border-radius: 100px;
}

#order_save_bar {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #ffffff;
  border-top: 1px solid #eeeeee;
  padding: 10px 16px 24px;
  z-index: 111;
  box-sizing: border-box;
}
#order_save_bar_text {
  font-size: 12px;
  color: #999999;
  text-align: center;
  margin-bottom: 10px;
}
#order_save_btn {
  width: 100%;
  height: 46px;
  background: #4361ee;
  color: #ffffff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 600;
}

#order_complete_body1 {
  padding: 0px 20px 12px 20px;
  /* margin-bottom: 22px; */
}
#order_complete_store_name {
  font-size: 18px;
  font-weight: 700;
  display: flex;
  justify-content: center;
}

#order_complet_status_ko {
  font-size: 18px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  color: var(--main-color);
  letter-spacing: 1px;
  font-weight: bold;
  text-align: center;
}

#order_complete_rdy_no {
  font-size: 28px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 4px 0px 26px 0px;
}
#order_complete_rdy_text {
  font-size: 18px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  margin: 14px 0px 18px 0px;
}
#order_complete_status_div {
  display: flex;
  justify-content: center;
  align-items: center;
}
#order_complete_cancel_div {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
}
#order_complete_cancel_text {
  color: #ff334b;
  font-size: 16px;
  background: #ffffff;
  padding: 4px;
}
.order_complete_status {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 88px;
  height: 88px;
  border-radius: 50px;
  border: 2px solid #d9d9d9;
  background: #ffffff;
  color: #000000;
  font-weight: 700;
  font-size: 17px;
  line-height: 110%;
}
.order_complete_status_on {
  background: var(--main-color);
  color: #ffffff;
}
#back {
  padding: 0px 20px 0px 20px;
}
#back_color {
  background-color: rgba(217, 217, 217, 0.2);
}
#order_complete_body2 {
  padding: 15px 15px;
}

#order_complete_order_info {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0px;
  padding-left: 4px;
}
#order_complete_order_div {
  font-size: 16px;
  font-weight: 400;
}
.order_complete_bottom_border {
  border-bottom: 1px solid #1a1a1a;
}
#order_complete_order_time {
  padding: 0px 0px;
}
#order_complete_order_detail {
  padding: 8px 4px 15px 4px;
}
.order_complete_order_item {
  display: flex;
  font-size: 16px;
  font-weight: 400;
  margin-top: 7px;
}
.order_complete_order_item_amt {
  margin-left: auto;
}
.order_complete_order_additem {
  font-size: 15px;
  padding-left: 4px;
  margin-top: 0px;
}
.order_complete_order_item2 {
  display: flex;
  font-size: 16px;
  font-weight: 400;
  margin-top: 7px;
}
.order_complete_order_item2_sub {
  font-size: 16px;
  padding: 0px 0px 0px 4px;
  color: #212529;
  margin-top: 7px;
}
#order_complete_order_dc {
  padding: 0px 4px 15px 4px;
}
#order_complete_order_pay {
  padding: 8px 4px 15px 4px;
}
#order_complete_order_acc {
  padding: 8px 4px 15px 4px;
}
#order_complete_order_cash {
  padding: 8px 4px 15px 4px;
}
#order_complete_memo {
  padding: 8px 4px 15px 4px;
}

#order_complete_body3 {
  padding: 0px 7px;
}
@keyframes blinkBg {
  0%,
  100% {
    background-color: transparent;
  }
  50% {
    background-color: rgba(200, 200, 200, 0.4);
  } /* 연한 회색 */
}

.blink {
  animation: blinkBg 0.8s ease-in-out 2;
  border-radius: 8px; /* 모서리 둥글게 있으면 유지 */
}

.swx {
  border-radius: 16px;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  min-height: 17vh;
  width: 92% !important;
  word-break: keep-all;
}

/* 제목/본문 */
.swx .swal2-title {
  margin: 20px 16px 0;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
}
.common-popup3 .swal2-title {
  margin: 30px 16px 0;
  font-size: 23px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
}
.common-popup10 {
  width: 90% !important;
  max-height: 90vh !important;
  box-sizing: border-box;
  background: white;
  border-radius: 16px;
  z-index: 500000;
}
.common-popup10 .swal2-title {
  margin: 30px 16px 0;
  font-size: 23px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.common-popup10 .swal2-actions.split-actions .swal2-styled {
  all: unset !important;
  display: block !important;
  width: 100% !important;
  height: 50px !important;
  line-height: 52px !important;
  text-align: center !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  background: #fff !important;
  color: #111827 !important;
}

.common-popup10 .swal2-actions.split-actions .btn-no {
  border-right: 1px solid #e5e7eb !important; /* 중앙 구분선 */
  border-radius: 0 0 0 16px !important;
  font-size: 17px !important;
  margin-top: 19px !important;
}
.common-popup10 .swal2-actions.split-actions .btn-yes {
  border-radius: 0 0 16px 0 !important;
  font-size: 17px !important;
  font-weight: bold;
  margin-top: 19px !important;
}
.title {
  margin: 0px 0 20px;
  font-size: 23px;
  font-weight: 700;
  color: #545454;
}

.info-bold {
  margin: 0px 0 10px;
  font-size: 17px;
  font-weight: 600;
}

.swx .swal2-html-container,
.swx .swal2-title + .swal2-html-container {
  margin: 12px 16px 0;
  text-align: center;
  word-break: keep-all;
  z-index: 5000000;
}

/* 로더 숨김(간혹 inline 으로 들어옴) */
.swx .swal2-loader {
  display: none !important;
}
.swal2-container {
  z-index: 5000000;
}

/* ===== ONE: 하단 전체폭 버튼 ===== */
.swx.one .swal2-actions.fill-actions {
  /* 인라인 display:flex 덮기 */
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #e5e7eb !important;
}

/* confirm 버튼이 inline-block으로 들어오는 걸 강제로 block+100% */
.swx.one .swal2-actions.fill-actions .swal2-confirm {
  all: unset !important;
  display: block !important; /* ← inline-block 덮기 */
  width: 100% !important; /* 전체 폭 */
  height: 60px !important;
  line-height: 52px !important;
  text-align: center !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  background: #fff !important;
  color: #111827 !important;
  border-radius: 0 0 16px 16px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}
.swx.two .swal2-actions.split-actions {
  display: grid !important; /* ← flex 덮기 */
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #e5e7eb !important;
}

.common-popup2.two .swal2-actions.split-actions {
  min-height: 7vh !important;
}

.swx .swal2-actions.split-actions .swal2-styled {
  all: unset !important;
  display: block !important;
  width: 100% !important;
  height: 70px !important;
  line-height: 52px !important;
  text-align: center !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  background: #fff !important;
  color: #111827 !important;
}
.swx .swal2-actions.split-actions .btn-no {
  border-right: 1px solid #e5e7eb !important; /* 중앙 구분선 */
  border-radius: 0 0 0 16px !important;
  font-size: 17px !important;
}
.swx .swal2-actions.split-actions .btn-yes {
  border-radius: 0 0 16px 0 !important;
  font-size: 17px !important;
  font-weight: bold;
}
.swx .swal2-actions button {
  -webkit-appearance: none !important; /* iOS 기본 버튼 스타일 제거 */
  appearance: none !important;
  border: none !important; /* 기본 border 제거 */
  outline: none !important; /* 포커스 outline 제거 */
  background: #fff !important; /* 배경만 지정 */
  box-shadow: none !important; /* 그림자 제거 */
  font-size: 17px !important;
}

/* (공통) 불필요한 버튼 테두리/그림자 제거 */
.swx .swal2-actions button {
  border: none !important;
  box-shadow: none !important;
}
.swal2-popup.swx.has-badge {
  overflow: visible !important;
  padding: 0px 0px 2px 0px;
}
.swal2-popup.swx.custom-padding {
  padding: 0px 0px 20px 0px;
}
.swx.has-badge {
  position: relative;
}
.swx.has-badge::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -28px;
  transform: translateX(-50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;

  background-color: #f2d8ab;
  border: 3px solid #fff;
  background-image: url("/shop/img/check-mark.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 35px 35px;
  pointer-events: none;
  z-index: 2;
}
/* 배지로 인해 위 여백 조금 내려줌 */
.swx.has-badge .swal2-title,
.swx.has-badge .swal2-html-container {
  margin-top: 36px;
}
.swal2-popup.has-badge {
  overflow: visible !important;
  position: relative;
}
.swal2-popup.has-badge::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -28px;
  transform: translateX(-50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-color: none; /* 원 배경색(원하면 투명/다른색으로) */
  border: 3px solid #fff; /* 테두리 */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 70px 70px;
  background-image: url("/shop/img/info-icon.svg");
  pointer-events: none;
  z-index: 2;
}
.swal2-popup.has-badge .swal2-title,
.swal2-popup.has-badge .swal2-html-container {
  margin-top: 30px;
}

.common-popup3 .swal2-title {
  margin: 30px 16px 0;
  font-size: 23px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
}
.common-popup3 .swal2-actions.split-actions {
  display: grid !important; /* ← flex 덮기 */
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #e5e7eb !important;
}
.common-popup3 .swal2-actions.split-actions .swal2-styled {
  all: unset !important;
  display: block !important;
  width: 100% !important;
  height: 70px !important;
  line-height: 52px !important;
  text-align: center !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  background: #fff !important;
}
.common-popup3 .swal2-actions.split-actions .btn-no {
  border-right: 1px solid #e5e7eb !important; /* 중앙 구분선 */
  border-radius: 0 0 0 16px !important;
  font-size: 19px !important;
  margin-top: 19px !important;
}
.common-popup3 .swal2-actions.split-actions .btn-yes {
  border-radius: 0 0 16px 0 !important;
  font-size: 17px !important;
  font-weight: bold;
  margin-top: 19px !important;
}
.common-popup3 .swal2-actions button {
  -webkit-appearance: none !important; /* iOS 기본 버튼 스타일 제거 */
  appearance: none !important;
  border: none !important; /* 기본 border 제거 */
  outline: none !important; /* 포커스 outline 제거 */
  background: #fff !important; /* 배경만 지정 */
  box-shadow: none !important; /* 그림자 제거 */
  font-size: 19px !important;
}
.common-popup3 .swal2-actions button {
  border: none !important;
  box-shadow: none !important;
}
.common-popup3 {
  width: 90% !important;
  min-height: 20vh !important;
  box-sizing: border-box;
  background: white;
  border-radius: 16px;
  word-break: keep-all;
  max-width: 400px;
  z-index: 500000;
}

.common-popup3 .swal2-html-container {
  padding: 10px !important;
  font-size: 16px;
  text-align: center;
  margin: 20px 0px 0px 0px !important;
  z-index: 500000;
}
.common-popup3 .info-wrap {
  text-align: left;
}
.common-popup3 .content-title {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #0f172a;
}

.common-popup3 .kv {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 16px auto;
  padding: 16px 20px;
  width: 55%; /* 카드 폭의 일정 비율 */
  border-radius: 12px;
  background: #fff;
  border: 1px solid #e5e7eb;
  position: relative;
}

/* 안쪽 label/value 정렬 */
.common-popup3 .kv-label {
  font-weight: 700;
  color: #475569;
  text-align: left; /* ✅ 왼쪽 정렬 */
}
.common-popup3 .kv-value {
  font-weight: 600;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  margin-bottom: 8px;
  word-break: break-word;
}
.common-popup3 .swal2-loader {
  display: none !important;
}
.common-popup3 .swal2-actions.fill-actions {
  /* 인라인 display:flex 덮기 */
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #e5e7eb !important;
}

.common-popup3 .swal2-actions.fill-actions .swal2-confirm {
  all: unset !important;
  display: block !important;
  width: 100% !important;
  height: 48px !important;
  line-height: 29px !important;
  text-align: center !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  background: #fff !important;
  color: #111827 !important;
  border-radius: 0 0 16px 16px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}
.content-scroll {
  min-height: 60px;
  max-height: calc(100vh - 668px);
  overflow-y: auto;
  padding: 12px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fafafa;
  line-height: 1.5;
  -webkit-overflow-scrolling: touch;
  text-align: left;
  font-size: 13px;
  color: #334155;
  margin: 20px 0px 10px 0px;
  scrollbar-gutter: stable; /* 크롬/파폭 */
}
.content-scroll2 {
  min-height: 60px;
  max-height: calc(100vh - 468px);
  overflow-y: auto;
  padding: 12px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fafafa;
  line-height: 1.5;
  -webkit-overflow-scrolling: touch;
  text-align: left;
  font-size: 13px;
  color: #334155;
  margin: 20px 0px 10px 0px;
  scrollbar-gutter: stable; /* 크롬/파폭 */
}
.scroll-always::-webkit-scrollbar {
  width: 4px; /* 스크롤바 너비 */
}
.scroll-always::-webkit-scrollbar-track {
  background: #f0f0f0; /* 빈 공간 색 */
}

.scroll-always::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.3); /* 스크롤바 색 */
  border-radius: 4px;
}
.scroll-always2::-webkit-scrollbar {
  width: 4px; /* 스크롤바 너비 */
}

.scroll-always2::-webkit-scrollbar-track {
  background: #ffffff; /* 빈 공간 색 */
}

.scroll-always2::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.3); /* 스크롤바 색 */
  border-radius: 4px;
}
.card-content {
  font-size: 17px !important;
  padding: 0px 10px 10px 10px;
}
.container2 {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-right: 0px;
  padding-left: 0px;
}

#reader {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  position: relative;
}
#reader > div {
  width: 100% !important;
  height: 100% !important;
}

#reader video {
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}

.html5-qrcode-element {
  font-size: 14px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  background-color: white !important;
  border: 1px solid #ccc !important;
  margin: 4px !important;
  cursor: pointer;
}

.html5-qrcode-element:hover {
  background: #f1f1f1 !important;
}

#info {
  position: absolute;
  top: 100px;
  margin: 0px 5px 5px 5px;
  z-index: 9000;
  background: white;
  color: black;
  padding: 10px 25px;
  border-radius: 10px;
  font-size: 17px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  font-weight: bold;
}

#close {
  position: absolute;
  top: 25px;
  right: 17px;
  width: 50px;
  height: 50px;
  z-index: 10;
  background: none;
  color: white; /* 아이콘 색상은 이걸 따름 */
  font-size: 30px; /* 있어도 무방(이젠 SVG 크기로 제어) */
  border-radius: 50%;
  cursor: pointer;
  display: flex; /* Flexbox로 정렬 */
  align-items: center; /* 수직 중앙 */
  justify-content: center; /* 수평 중앙 */
}

#qr-overlay {
  overscroll-behavior: contain;
}

/* 클래스 기반 잠금 (데스크톱·안드 공통) */
.scroll-lock {
  overflow: hidden; /* 크롬/안드로이드 */
  touch-action: none; /* 터치 스크롤 제스처 막기 */
  overscroll-behavior: none; /* 바운스 방지 */
}
#peekOverlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.35);
  z-index: 20;
  opacity: 0;
  pointer-events: none; /* 기본 클릭차단 */
  transition: opacity 0.25s ease;
}
#peekOverlay.show {
  opacity: 1;
  pointer-events: auto; /* 보일 때만 클릭 가능 */
}
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(4px);
  z-index: 109998;
  display: none;
}

.overlay video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 비율 유지하며 꽉 채움 */
  pointer-events: none; /* 마우스로 제어 못 하게 */
}

.overlay.show {
  display: block;
}
.result-slideup {
  position: fixed;
  top: 50%;
  left: 50%;
  opacity: 0;
  transform: translate(-50%, -48%) scale(0.95);
  transition: none;
  width: calc(100% - 40px);
  max-width: 360px;
  min-height: 200px;
  max-height: 250px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  text-align: center;
  padding: 24px 16px 20px;
  z-index: 9999;
  visibility: hidden;
  pointer-events: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.result-slideup.show {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.result-slideup {
  backdrop-filter: blur(6px);
  background: rgba(255, 255, 255, 0.8);
  z-index: 2000000;
}
.result-slideup h2 {
  font-size: 1.6rem;
  font-weight: bold;
  margin: 0 0 12px 0;
  padding-top: 8px;
}

.result-slideup p {
  font-size: 1.2rem;
  margin-bottom: 28px;
}

.result-slideup button {
  padding: 10px 16px;
  margin: 0 6px;
  font-size: 14px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

/* 버튼 공통 */
#resultPanel .result-actions {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  transform: none;
  display: block; /* ← grid 대신 block으로 */
  height: 70px;
  border-top: 1px solid #e5e7eb;
  overflow: hidden;
  border-radius: 0 0 16px 16px;
  z-index: 2000010;
}

/* 버튼: 셀 전체가 클릭 영역 */
#resultPanel .result-actions button {
  all: unset;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  color: #111827;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}

#win-lose {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-right: 0px;
  padding-left: 0px;
  z-index: 1000000;
  display: none;
}
#store_policy_div {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px 20px 40px 20px;
  background: #f5f5f5;
  margin-top: 0px;
  border-top: 1px solid #f1f4f6;
}
#policy_btn_div {
  display: flex;
  align-items: center;
}
#corp_name_div {
  display: flex;
  padding-top: 20px;
  align-items: center;
  cursor: pointer;
}
#corp_name {
  text-align: center;
  font-weight: 600;
  font-size: 14px;
  line-height: 16px;
  color: #757575;
}
.policy_down_arrow {
  width: 25px;
}
.policy_up_arrow {
  width: 25px;
}

.policy-divider {
  margin: 0 8px;
  color: #ccc;
  line-height: 1;
  padding-top: 1px;
  font-size: 14px;
}

.policy-jp-btn {
  font-size: 12px;
  color: #666;
  white-space: nowrap;
}

#corp_detail_text {
  padding-top: 10px;
  text-align: center;
  font-weight: 400;
  font-size: 11px;
  color: #757575;
}

#term_policy_gray {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
}
#term_policy_div {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
}
#term_policy_back {
  width: 100%;
  height: 100%;
}
#term_policy_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
}
#term_policy_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 56px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  position: relative;
}
#term_policy_wrap_title {
  color: #000000;
  font-weight: 700;
  font-size: 17px;
}
#term_policy_contents {
  overflow-y: auto;
  height: calc(100% - 56px);
  word-break: auto-phrase;
}
.term_policy_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  margin-bottom: 6px;
}
.term_policy_name {
  text-align: center;
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  color: #757575;
  cursor: pointer;
}
.term_policy_mdl_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  padding: 0 26px;
  margin-bottom: 6px;
}
.term_policy_detail {
  padding: 5px 26px;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 6px;
}

#specific_act_gray {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
}
#specific_act_div {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
}
#specific_act_back {
  width: 100%;
  height: 100%;
}
#specific_act_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
}
#specific_act_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 56px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  position: relative;
}
#specific_act_wrap_title {
  color: #000000;
  font-weight: 700;
  font-size: 17px;
}
#specific_act_contents {
  overflow-y: auto;
  height: calc(100% - 56px);
  word-break: auto-phrase;
  padding: 15px 10px 20px 15px;
  justify-content: center;
}
.specific_act_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  margin-bottom: 6px;
}
.specific_act_name {
  text-align: center;
  font-weight: 500;
  font-size: 14px;
  line-height: 16px;
  color: #949494;
}
.specific_act_mdl_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  padding: 0 26px;
  margin-bottom: 6px;
}
.specific_act_detail {
  padding: 5px 26px;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 6px;
}

.paysc_btn {
  position: absolute;
  right: 12px;
  top: 12px;
  width: 32px;
  height: 32px;
  background-size: 32px;
  background-image: url("/shop/img/x.svg");
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 12px;
}
.order_list_order_time {
  font-size: 13px;
  font-weight: 400;
  color: #707070;
}

.specific-act-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  color: #000;
}

.specific-act-table th,
.specific-act-table td {
  border: 1px solid #ccc;
  padding: 8px 10px;
  vertical-align: top;
  background: #fff;
}

.specific-act-table th {
  width: 30%;
  font-weight: 500;
  text-align: left;
}

.specific-act-table th,
.specific-act-table td {
  vertical-align: middle;
}

.specific-act-table th,
.specific-act-table td {
  overflow-wrap: anywhere; /* 가장 잘 먹음 */
  word-break: break-word; /* 보조 */
  white-space: normal; /* 혹시 nowrap 걸린 경우 대비 */
}
/* 검은 반투명 배경 */
.cqty-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 999;
}

/* 팝업 컨테이너 */
.cqty-popup {
  width: 90%;
  max-width: 350px;
  background: white;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* 헤더 */
.cqty-header {
  background: #3674d9;
  color: white;
  text-align: center;
  padding: 12px;
  font-size: 18px;
  font-weight: bold;
}

/* 콘텐츠 */
.cqty-content {
  background: white;
  padding: 16px;
}

.cqty-buttons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.cqty-btn {
  border: 1px solid #1976d2;
  background: rgba(25, 118, 210, 0.1);
  color: #3674d9;
  font-size: 20px;
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: all 0.2s;
  user-select: none;
  text-align: center;
}

/* 선택된 버튼 */
.cqty-btn.cqty-selected {
  background: #3674d9;
  color: white;
}

/* 확인 버튼 */
.cqty-footer {
  padding: 12px;
}

.cqty-confirm-btn {
  width: 100%;
  background: #3674d9;
  color: white;
  border: none;
  border-radius: 12px;
  padding: 12px 0;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  user-select: none;
  text-align: center;
}

.camera-loader {
  position: fixed;
  inset: 0;
  background: #fff; /* 흰색 종이 느낌 */
  display: grid;
  place-items: center;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.25s ease;
  z-index: 5000000; /* 스캐너 위로 */
}
.camera-loader--hidden {
  opacity: 0;
  pointer-events: none;
  display: none;
}

.camera-loader__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.camera-loader__text {
  font-size: 16px;
  color: #333;
  margin: 0;
}
.camera-loader__spinner {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid #e5e7eb;
  border-top-color: #111827;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.cart_block_div_text {
  background-color: rgba(255, 255, 255, 0.9);
  color: #e55c57;
  border-radius: 5px;
  font-weight: 600;
  font-size: 18px;
}
/*배송팝업  */
#paysc_gray {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
}

#paysc_back {
  width: 100%;
  height: 100%;
  padding-top: 0px;
}
#paysc_popup {
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
}

#paysc_btn_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 56px;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px #dddddd solid;
  position: relative;
}
.paysc_btn {
  position: absolute;
  right: 12px;
  top: 12px;
  width: 32px;
  height: 32px;
  background-size: 32px;
  background-image: url("/shop/img/x.svg");
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 12px;
}
#paysc_title {
  color: #000000;
  font-weight: 700;
  font-size: 17px;
}
#paysc_contents {
  padding: 0px 0px 0px 0px;
  overflow-y: auto;
  height: calc(100% - 56px);
}
#paysc_body1 {
  border-bottom: 1px #dddddd solid;
}
#paysc_total {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 10px;
}
#paysc_order_info {
  color: #000000;
  font-weight: 400;
  font-size: 15px;
  display: flex;
}
#paysc_request {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 10px;
}

#paysc_body4 {
}
#paysc_phon_input_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin: 0px 0px 10px 0px;
}

#paysc_addr_input_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin: 0px 0px 10px 0px;
}

#paysc_customsid_input_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin: 0px 0px 10px 0px;
}

#paysc_email_input_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin: 0px 0px 10px 0px;
}

#paysc_name_input_title {
  color: #000000;
  font-weight: 700;
  font-size: 16px;
  margin: 0px 0px 10px 0px;
}

#paysc_div {
  position: fixed;
  z-index: 110;
  width: 100%;
  height: 100%;
  max-width: 425px;
  margin: auto;
  top: 0;
  display: none;
}
.paysc_body {
  padding: 17px 26px;
}

#paysc_footer {
  position: fixed;
  bottom: 0px;
  height: 66px;
  width: 100%;
  max-width: 425px;
  padding: 8px 14px;
  background: #ffffff;
}
#paysc_pay_btn {
  height: 100%;
  width: 100%;
  border-radius: 12px;
  background: #1976d2;
}
#paysc_pay_btn_inner {
  height: 100%;
  width: 100%;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#paysc_pay_btn_amt {
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  padding: 5px;
}
#paysc_pay_btn_text {
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  padding: 5px;
}

/*20251125 - 룰렛 css */

#rouletteOverlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 101;

  display: none; /* 기본은 숨김 */
  justify-content: center; /* 가로 가운데 정렬 */
  /* align-items는 안 줌 → 위쪽에 붙게 */
}

.wheel-container {
  position: relative;
  width: 100%;
  max-width: 380px;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
}

.outer-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 86%;
  height: 86%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 4;
  background: repeating-conic-gradient(from 4deg, #3674d9 0deg 12deg, #5a87e0 12deg 20deg);
}

/* 💡 전구: 밝은 파랑 구간에만 */
.bulb {
  position: absolute;
  /* 크기도 비율로 주면 더 예쁨. 대충 1.7% 정도부터 시작해서 조절 */
  width: 1.7%;
  height: 1.7%;
  border-radius: 50%;
  background: #ffd452;
  box-shadow:
    0 0 6px rgba(255, 212, 82, 0.9),
    0 0 12px rgba(255, 212, 82, 0.7);
  z-index: 5;
  transform: translate(-50%, -50%); /* 👉 중앙 기준으로 맞추기 */
  pointer-events: none;
}

/* 🎡 룰렛 캔버스 */
#canvas {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: 90%;
  border-radius: 50%;
  z-index: 3;
}

/* 🔻 포인터 */
.pointer {
  position: absolute;
  top: 2%;
  left: 50%;
  transform: translate(-50%, -40%);
  width: 20%; /* 컨테이너 기준 */
  height: auto;
  z-index: 6;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}

/* ⚪ 중앙 금속 핀 */
.center-pin {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 9%;
  height: 9%;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ffffff, #c0c0c0 40%, #7e7e7e 80%);
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.7),
    0 3px 6px rgba(0, 0, 0, 0.5);
  z-index: 5;
}

/* 🎯 스핀 버튼 */
.center-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 26%;
  height: 26%;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #4c8cf0, #2450a0); /* 은은한 그라데이션으로 입체감 */

  /* 바깥 링들 */
  box-shadow:
    inset 0 3px 6px rgba(255, 255, 255, 0.3),
    /* 위쪽 하이라이트 */ inset 0 -3px 8px rgba(0, 0, 0, 0.35),
    /* 아래쪽 어두움 */ 0 0 0 4px #ffffff,
    /* 흰색 링 */ 0 0 0 10px #cfd2d6,
    /* 실버 링 */ 0 4px 10px rgba(0, 0, 0, 0.45); /* 바깥 그림자 */

  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 18px;
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); /* 글씨에도 살짝 깊이감 */
  cursor: pointer;
  user-select: none;
  z-index: 107;
  transition:
    transform 0.1s ease,
    box-shadow 0.1s ease;
}

.center-button:active {
  transform: translate(-50%, -50%) scale(0.96);
  box-shadow:
    inset 0 2px 4px rgba(0, 0, 0, 0.3),
    0 0 0 4px #ffffff,
    0 0 0 10px #cfd2d6,
    0 2px 6px rgba(0, 0, 0, 0.4);
}

/* 🎉 팝업 */
.result-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 75%;
  min-height: 20%;
  background: rgba(255, 255, 255, 0.98);
  border-radius: 18px;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 10px 10px 0px;
  z-index: 109;
  opacity: 1;
  word-break: auto-phrase;

  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    /* 큰 그림자 */ 0 10px 20px rgba(0, 0, 0, 0.15),
    /* 중간 그림자 */ 0 20px 40px rgba(0, 0, 0, 0.2); /* 부드럽게 퍼지는 그림자 */
}
.result-inner {
  padding: 5px 0px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.animate-title {
  animation: bounceTitle 0.6s ease-out;
}
@keyframes bounceTitle {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  60% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}

.result-title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 13px;
  padding-top: 10px;
  color: #3674d9;
}

.result-prize {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 20px;
}

.result-prize {
  /* 기존 폰트 설정은 놔두고, 레이아웃만 정리 */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.result-prize-line {
  display: block;
  line-height: 1.2;
}

/* 첫 줄: 위에 들어가는 설명(상품명 / 교환권 등) */
.result-prize-line.sub {
  font-size: 16px;
  font-weight: 600;
}

/* 두 번째 줄 이후: 금액, 퍼센트, 메인 텍스트 */
.result-prize-line.main {
  font-size: 18px;
  font-weight: 700;
}

.result-close {
  background: transparent;
  box-shadow: none; /* 버튼 그림자는 없애고 팝업만 그림자 */
}
.close-div {
  display: flex;
  justify-content: center; /* 가로 중앙 정렬 */
  align-items: center; /* 세로 중앙 정렬 */
  width: 100%; /* div가 전체 너비 차지 */
  height: 100%; /* 부모 높이를 다 채움 (필요시 px로 지정 가능) */
  border-top: 1px solid #adb4ba;
  height: 56px;
}

.close-div button {
  width: 100%; /* 버튼이 div 전체를 덮도록 */
  height: 100%; /* 버튼이 div 전체를 덮도록 */
  font-size: 16px; /* 글씨 크기 보기 좋게 */
  border: none;
  cursor: pointer;
  font-weight: 600;
}

.fireworks-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 8;
  display: none;
}

.fireworks-layer video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1; /* 너무 세면 줄이고, 약하면 1로 올려도 됨 */
}

.modal-backdrop2 {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 7;
  display: none;
}
.center-button,
.result-close,
.center-button:focus,
.result-close:focus,
.center-button:active,
.result-close:active {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: none; /* 파란/검은 포커스 라인 제거 */
}

#lottieDiv {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  z-index: 200;
  display: none;
  pointer-events: none;
}
#lottieDiv2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  z-index: 200;
  display: none;
  pointer-events: none;
}

.roulette-wrap {
  width: 100%;
  max-width: 425px;

  height: 100%; /* 세로 전체 사용 */
  box-sizing: border-box;

  padding: 24px 16px 24px; /* 양옆 padding + 위/아래 기본 여백 */

  display: flex;
  flex-direction: column;
  justify-content: space-between; /* 위: 헤더, 중간: 룰렛, 아래: 버튼 */
  align-items: center;
}

#rouletteLoading {
  position: absolute;
  inset: 0; /* 전체 덮고 */
  display: none; /* 기본은 숨김 */
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #fff;
  background: rgba(0, 0, 0, 0.7); /* 살짝 어둡게 */
  z-index: 10; /* 룰렛보다 위 */
}

#rouletteLoadingText {
  margin-right: 4px;
}

/* 가운데 룰렛 영역: 최대 425px 안에서 정중앙 */
.roulette-center-area {
  width: 100%;
  max-width: 425px;
  flex: 1; /* 남은 공간을 모두 사용 → 중앙 배치 가능 */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* wheel-container는 가운데에만 */
.wheel-container {
  width: 100%;
  max-width: 360px;
  aspect-ratio: 1 / 1;
  position: relative;
}

/* 하단 버튼: 화면 전체 폭 */
.roulette-skip-btn {
  width: 100%;
  height: 52px;

  border: none;
  border-radius: 12px;

  background: #ffffff;
  color: #333;
  font-size: 16px;
  font-weight: 600;

  margin-top: 16px;
  margin-bottom: 4px; /* 아래쪽 살짝 여유 */

  cursor: pointer;
}
#rouletteOverlay.show {
  display: flex;
}
/*가위바위보 - RPS  */

#rpsGameDiv {
  position: relative;
  width: 395px;
  height: 395px;
  display: none; /* JS에서 block으로 변경 */
  transform-origin: center center;
  background-color: #f9fafb;
  border-radius: 16px;
}

#rps-game {
  width: 100%;
  height: 100%;
  /* background: #f5f5f5; */
  user-select: none;
  text-align: center;
  position: relative;
  padding-top: 20px;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* 위쪽: 컴퓨터 이미지 */
.rps-top {
  margin-top: 15px;
  align-items: center;
  justify-items: center;
}

.rps-top img {
  width: 25%;
  height: auto;
  display: block;
  margin: 10px;
}

/* 가운데 VS */
.rps-vs {
  margin: 30px 0;
  font-size: 2.6rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  justify-content: center;
  align-items: center;
}

.rps-vs img.vs-icon {
  width: 80px; /* 사이즈 조절 */
  height: auto;
  user-select: none;
  pointer-events: none;
}

/* 아래쪽: 사용자 선택 버튼들 */
.rps-bottom {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 42px;
}

.rps-choice {
  width: 100px; /* 카드 박스 가로 */
  height: 100px; /* 카드 박스 세로 */
  /* background: #ffffff; */
  border-radius: 16px;
  border: none;
  padding: 10px;
  cursor: pointer;
  box-shadow:
    0 4px 10px rgba(0, 0, 0, 0.12),
    0 2px 4px rgba(0, 0, 0, 0.08);
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rps-scissors {
  background-color: #ffe2e2; /* 가위 */
}

.rps-rock {
  background-color: #e2f0ff; /* 바위 */
}

.rps-paper {
  background-color: #e9ffe2; /* 보 */
}

.rps-choice:active {
  transform: scale(0.94);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.08);
}

.rps-choice img {
  width: 90%;
  height: 90%;
  object-fit: contain; /* ← 정사각형 이미지 절대 안 잘림 */
}

.rps-rock.rps-choice.selected {
  border: 3px solid #3674d9;
  box-shadow:
    0 0 0 3px rgba(54, 116, 217, 0.25),
    0 6px 14px rgba(0, 0, 0, 0.18);
  transform: translateY(-4px);
}
.rps-scissors.rps-choice.selected {
  border: 3px solid #d93636;
  box-shadow:
    0 0 0 3px rgba(54, 116, 217, 0.25),
    0 6px 14px rgba(0, 0, 0, 0.18);
  transform: translateY(-4px);
}
.rps-paper.rps-choice.selected {
  border: 3px solid #2fa53a;
  box-shadow:
    0 0 0 3px rgba(54, 116, 217, 0.25),
    0 6px 14px rgba(0, 0, 0, 0.18);
  transform: translateY(-4px);
}

/* 🔢 카운트다운 / START 오버레이 */
#rps-overlay {
  position: absolute;
  inset: 0;
  background: transparent; /* ← 배경색 투명 */
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10;
  pointer-events: auto;
}

#rps-countdown {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 100px;
  height: 100px;
  border-radius: 50%;

  background-color: #3674d9; /* 시그니처 파랑 */
  color: #ffffff;
  font-size: 25px;
  font-weight: 800;
  /*font-family: "Pretendard Variable"; */
  font-style: italic;

  text-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);

  transform: scale(0.2);
  opacity: 0;
}

/* 퐁! 하고 튀어나오는 애니메이션 */
.rps-pop {
  animation: rpsPop 1.2s ease-out forwards;
}

/* START 전용 : 글자 간격 조금 넓게 + 사이즈 조정 */
.rps-start {
  font-size: 20px !important;
  letter-spacing: 0.1rem;
}

/* 팝업 느낌 키프레임 */
@keyframes rpsPop {
  0% {
    transform: scale(0.2);
    opacity: 0;
  }
  30% {
    transform: scale(1.15);
    opacity: 1;
  }
  60% {
    transform: scale(1);
    opacity: 1; /* 유지 시간 */
  }
  100% {
    transform: scale(1);
    opacity: 0; /* 서서히 사라짐 */
  }
}

/* ✨ 가위바위보 결과 팝업 (룰렛 팝업 스타일 재활용) */
#rpsResultPopup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 300px;
  min-height: 100px;
  background: rgba(255, 255, 255, 0.98);
  border-radius: 18px;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 10px 10px 0px;
  z-index: 12;
  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    0 10px 20px rgba(0, 0, 0, 0.15),
    0 20px 40px rgba(0, 0, 0, 0.2);
  text-align: center;
}

/* 배경 반투명 막 (가위바위보용) */
/* #rpsBackdrop {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 104%;
  height: 104%;
  background: rgba(0, 0, 0, 0.45);
  z-index: 11;
  display: none;
} */

#rpsBackdrop {
  position: fixed; /* 화면 전체 기준 */
  top: 0;
  left: 0;
  width: 100vw; /* 전체 너비 */
  height: 100vh; /* 전체 높이 */
  background: rgba(0, 0, 0, 0.45);
  z-index: 11; /* 결과 팝업보다 바로 아래 */
  display: none;
}

.computer-rotate {
  transform: rotate(180deg);
}

.computer-appear {
  animation: slideDown 0.4s ease-out forwards;
  animation-delay: 0.5s;
  opacity: 0;
}

@keyframes slideDown {
  0% {
    transform: translateY(-60px) rotate(180deg);
    opacity: 0;
  }
  100% {
    transform: translateY(0) rotate(180deg);
    opacity: 1;
  }
}

#RPSOverlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 101;

  display: none; /* 기본은 숨김 */
  justify-content: center; /* 가로 중앙 */
  align-items: center;
}

#RPSOverlay.show {
  display: flex;
}

#RPSLoading {
  position: absolute;
  inset: 0; /* 전체 덮고 */
  display: none; /* 기본은 숨김 */
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #fff;
  background: rgba(0, 0, 0, 0.7); /* 살짝 어둡게 */
  z-index: 10; /* 룰렛보다 위 */
}

#RPSLoadingText {
  margin-right: 4px;
}

.start-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 330px;
  min-height: 175px;
  background: rgba(255, 255, 255, 0.98);
  border-radius: 18px;
  display: block;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 10px 10px 0px;
  z-index: 8;
  opacity: 1;
  word-break: auto-phrase;

  box-shadow:
    0 4px 6px rgba(0, 0, 0, 0.1),
    /* 큰 그림자 */ 0 10px 20px rgba(0, 0, 0, 0.15),
    /* 중간 그림자 */ 0 20px 40px rgba(0, 0, 0, 0.2); /* 부드럽게 퍼지는 그림자 */
}
.start-inner {
  padding: 5px 0px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.animate-title {
  animation: bounceTitle 0.6s ease-out;
}
@keyframes bounceTitle {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  60% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}

.start-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  padding-top: 15px;
  color: #3674d9;
}

.start-prize {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
  text-align: center;
}

.start-prize {
  /* 기존 폰트 설정은 놔두고, 레이아웃만 정리 */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.start-prize-line {
  display: block;
  line-height: 1.2;
}

/* 첫 줄: 위에 들어가는 설명(상품명 / 교환권 등) */
.start-prize-line.sub {
  font-size: 16px;
  font-weight: 600;
}

/* 두 번째 줄 이후: 금액, 퍼센트, 메인 텍스트 */
.start-prize-line.main {
  font-size: 22px;
  font-weight: 700;
}

.start-close {
  background: transparent;
  box-shadow: none;
}

.modal-backdrop2 {
  position: absolute; /* fixed ❌ → absolute ✅ */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* roulette 중심에 정렬 */

  width: 700px; /* 부모(600×600)보다 더 크게 */
  height: 700px;

  background: rgba(0, 0, 0, 0.45);
  z-index: 7;
  display: none;
}

.center-button,
.result-close,
.start-close,
.center-button:focus,
.result-close:focus,
.start-close:focus,
.center-button:active,
.start-close:active,
.result-close:active {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: none; /* 파란/검은 포커스 라인 제거 */
}

#lottieDiv {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  z-index: 100;
  display: none;
  pointer-events: none;
}
#lottieDiv2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  z-index: 100;
  display: none;
  pointer-events: none;
}

.status-wrapper {
  width: 100%;
  padding: 4px 0;
  display: none;
  margin: 40px 0px !important;
}

#status-labels {
  margin-top: 15px;
  display: flex;
}

.label {
  width: 33.33%;
  text-align: center;
  font-size: 14px;
  color: #a6a6a6;
  font-weight: 500;
}
.label_active {
  color: #3674d9;
  font-weight: 500;
  width: 33.33%;
  text-align: center;
  font-weight: bold;
}

.progress_bar {
  width: 100%;
  height: 10px;
  background-color: #d9d9d9;
  border-radius: 2px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  background-color: #3674d9;
  transition: width 0.3s ease;
  width: 0%;
}

.status-labels {
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  position: relative;
  color: #a6a6a6;
}

.dialog-container {
  position: fixed;
  z-index: 1000 !important;
  width: 100%;
  height: 100%;
  max-width: 425px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  display: none;

  /* 오버레이를 부모가 직접 깔기 */
  background: rgba(0, 0, 0, 0.6);
}

.dialog-container .overlay {
  display: none;
}

.dialog-box {
  width: 300px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  z-index: 1;
}

#mall_login_screen {
  position: fixed;
  z-index: 999 !important;
  width: 100%;
  height: 100%;
  max-width: 425px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: rgba(255, 255, 255, 1);
}
/* 제목 + 내용 영역 */
.dialog-title-wrap {
  padding: 15px 15px 0;
  text-align: center;
}

.dialog-title {
  font-size: 16px;
  font-weight: bold;
}

.dialog-text-wrap {
  padding: 8px 15px 20px;
  text-align: center;
}

.dialog-text {
  font-size: 15px;
}

/* 버튼 영역 */
.dialog-action-wrap {
  display: flex;
  height: 50px;
  border-top: 1px solid #dddddd;
}

.dialog-action-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: #52b4ff;
  cursor: pointer;
}

/* 가운데 선 */
.dialog-action-btn.cancel {
  border-right: 1px solid #dddddd;
}

/* ===== PG9 결제 수단 선택 바텀시트 ===== */
@keyframes pg9-slide-up {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}
.pg9-sheet-overlay {
  position: fixed;
  z-index: 1001;
  width: 100%;
  height: 100%;
  max-width: 425px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: flex-end;
}
.pg9-sheet-box {
  width: 100%;
  background: #fff;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  animation: pg9-slide-up 0.28s ease-out;
}
.pg9-sheet-header {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 52px;
  border-bottom: 1px solid #ebebeb;
}
.pg9-sheet-title {
  font-size: 16px;
  font-weight: 700;
  color: #222;
}
.pg9-sheet-close {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  font-size: 18px;
  color: #aaa;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}
.pg9-payment-list {
  padding: 8px 0 8px;
}
.pg9-payment-item {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  gap: 14px;
  cursor: pointer;
  transition: background 0.15s;
}
.pg9-payment-item:active {
  background: #f5f5f5;
}
.pg9-icon-wrap {
  width: 58px;
  height: 38px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #fff;
  padding: 4px;
  box-sizing: border-box;
}
.pg9-pay-icon {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.pg9-payment-label {
  flex: 1;
  font-size: 15px;
  font-weight: 600;
  color: #222;
}
.pg9-arrow {
  font-size: 22px;
  color: #ccc;
  line-height: 1;
}
/* ===== /PG9 ===== */

/* ===== 소셜 로그인 ===== */
.social-icon-wrap {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}
.social-icon-google {
  background: #fff;
  border: 1px solid #ddd;
  color: #5f6368;
}
.social-icon-kakao {
  background: #fee500;
  color: #3c1e1e;
}
.social-icon-naver {
  background: #03a94d;
  color: #fff;
}
.social-icon-line {
  background: #06c755;
  color: #fff;
}
.social-icon-facebook {
  background: #0866ff;
  color: #fff;
}

.social-login-divider {
  height: 1px;
  background: #f0f0f0;
  margin: 4px 16px;
}
.social-login-guest-wrap {
  padding: 12px 16px 16px;
}
.social-guest-btn {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 8px;
  background: #f5f5f5;
  color: #666;
  font-size: 14px;
  cursor: pointer;
}
.social-guest-btn:active {
  background: #e8e8e8;
}
/* ===== /소셜 로그인 ===== */
/*
.mall_login_screen_inner{
  min-height: 100vh;
  box-sizing: border-box;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 420px;
  margin: 0 auto;
}
*/

.mall_login_screen_inner {
  min-height: 100vh;
  box-sizing: border-box;
  padding: 10px 24px 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 420px;
  margin: 0 auto;
}

.mall_login_title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: #111;
}

.mall_login_desc {
  margin-top: 8px;
  margin-bottom: 24px;
  font-size: 14px;
  color: #666;
  text-align: center;
}

.mall_login_form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mall_login_input {
  width: 100%;
  height: 48px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 0 14px;
  font-size: 15px;
}

.mall_login_submit_btn {
  width: 100%;
  height: 50px;
  border: 0;
  border-radius: 12px;
  background: #1976d2;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

.mall_login_sns_title {
  margin-top: 28px;
  margin-bottom: 12px;
  text-align: center;
  font-size: 14px;
  color: #666;
}

.mall_login_sns_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.mall_sns_btn {
  height: 46px;
  border: 0;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
}

.mall_sns_btn.google {
  background: #f1f1f1;
  color: #111;
}
.mall_sns_btn.kakao {
  background: #fee500;
  color: #191919;
}
.mall_sns_btn.line {
  background: #06c755;
  color: #fff;
}
.mall_sns_btn.facebook {
  background: #1877f2;
  color: #fff;
}

.mall_login_error {
  margin-top: 14px;
  text-align: center;
  font-size: 13px;
  color: #e53935;
}

.mall_login_screen_inner {
  position: relative; /* 이거 있어야 X 위치 정상 */
}

.mall_login_header {
  position: relative;
  height: 40px; /* 적당히 */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 제목은 항상 정중앙 */
.mall_login_title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: 28px;
  line-height: 1.3;
  color: #111;
  font-weight: 700;
}

/* X 버튼은 오른쪽 */
#mall_login_close_btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
}

.select-item-group-name {
  font-size: 14px;
  font-weight: 600;
  color: #757575;
  padding-bottom: 10px;
  text-align: left;
  white-space: normal !important;
  min-width: 0;
}

.select-item-box-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* 기본 상태 */
.select-item-box {
  position: relative;
  min-width: 55px;
  max-width: 80px;
  min-height: 54px;
  padding: 10px 14px;
  border: 0.5px solid #9aa0a6;
  background: #fff;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  cursor: pointer;
  line-height: 1.1;
  border-radius: 5px;
}

/* 라디오 숨김 */
.select-item-box input[type="radio"] {
  display: none;
}

/* 선택 상태 */
.select-item-box.active {
  border: 2px solid #3674d9; /* ✅ 선택시 브랜드 색 */
}

/* 옵션명 */
.select-item-box-name {
  font-size: 12px;
  font-weight: 500;
  color: #000; /* ✅ 기본 검정 */
}

.select-item-box-name2 {
  margin-top: 2px;
  font-size: 10px;
  line-height: 1.1;
  color: #000;
}

/* 가격 */
.select-item-box-price {
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  color: #d60000;
}

/* 선택되면 옵션명만 색 변경 */
.select-item-box.active .select-item-box-name,
.select-item-box.active .select-item-box-name2 {
  color: #3674d9;
}

.select-item-box-wrap {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}

.select-item-box-wrap::-webkit-scrollbar {
  height: 6px;
}

.select-item-box-wrap::-webkit-scrollbar-thumb {
  background: #c7c7c7;
  border-radius: 999px;
}

.select-item-box-wrap::-webkit-scrollbar-track {
  background: transparent;
}

.select-item-box-wrap {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0px;
  box-sizing: border-box;
}

.select-item-box {
  flex: 0 0 auto; /* 이거 중요 */
}

@media (min-width: 769px) {
  .select-item-box-wrap::-webkit-scrollbar {
    height: 6px;
  }

  .select-item-box-wrap::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 999px;
  }

  .select-item-box-wrap::-webkit-scrollbar-track {
    background: transparent;
  }
}

@media (max-width: 768px) {
  .select-item-box-wrap {
    scrollbar-width: none;
  }

  .select-item-box-wrap::-webkit-scrollbar {
    display: none;
  }
}

.select-item-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 0;
  padding: 2px 16px 5px 16px;
  width: 100%;
  box-sizing: border-box;
  justify-content: center;
  text-align: center;
}

.select-item-group-name {
  flex: 0 0 55px;
  width: 55px;
  min-width: 55px;
  max-width: 55px;
  font-size: 13px;
  font-weight: 600;
  color: #757575;
  padding-bottom: 0;
  line-height: 1.25;
  white-space: normal;
  word-break: keep-all;
  padding-top: 3px;
  text-align: left;
  white-space: normal;
}

.select-item-group-sub {
  display: inline-block;
  margin-left: 4px;
  font-size: 10px;
  font-weight: 400;
  color: #777;
}

.select-item-box-wrap {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0px;
  box-sizing: border-box;
}

.select-item-box {
  flex: 0 0 auto;
  min-width: 56px;
  min-height: 44px;
  padding: 5px 5px;
  border: 0.5px solid #9aa0a6;
  background: #fff;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  cursor: pointer;
  line-height: 1.1;
  border-radius: 5px;
}

.select-item-box-name {
  font-size: 11px;
  font-weight: 500;
  color: #000;
}

.select-item-box-name2 {
  margin-top: 2px;
  font-size: 9px;
  line-height: 1.1;
  color: #000;
}

.select-item-box-price {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #d60000;
}

.item_share_btn {
  cursor: pointer;
}

.mall_login_first_header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

/* 👇 화면 높이 작을 때 */
@media (max-height: 700px) {
  .mall_login_first_header {
    margin-bottom: 20px;
  }
  .mall_login_screen_inner {
    padding: 20px 24px 30px;
  }
}

.mall_login_logo {
  width: 100px;
  margin-bottom: 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.mall_login_logo.banner_mode {
  height: 150px;
  width: auto;

  aspect-ratio: 16 / 9;
  border-radius: 8px;

  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.mall_login_storeName {
  font-weight: 700;
  font-size: 28px;
  text-align: center;
  line-height: 1.3;
}

.inquery {
  margin-top: 48px;
  text-align: center;
  font-size: 13px;
  color: #888;
  line-height: 1.6;
}

.inquery span {
  display: block;
}

.td-add {
  padding: 0 2px;
}

.detail-section-divider {
  width: 100%;
  height: 4px;
  background: #f1f1f1;
  margin: 5px 0 0;
}

.detail-section-divider2 {
  width: 100%;
  height: 10px;
  background: #f1f1f1;
  margin: 0px 0 0;
}

.detail-info-section {
  background: #fff;
  padding: 16px;
}

.detail-info-title {
  font-size: 16px;
  font-weight: 800;
  color: #111;
  margin-bottom: 14px;
}

.detail-info-body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  font-size: 14px;
  line-height: 1.6;
  color: #111;
  word-break: break-word;
}

.detail-info-body * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.detail-info-body figure {
  margin: 0 auto !important;
}

.detail-info-body img,
.detail-info-body video,
.detail-info-body iframe {
  max-width: 100% !important;
  height: auto !important;
  display: block;
  width: 100% !important
}

.item_price_top {
  display: flex;
  align-items: center;
  gap: 1px;
  flex-wrap: wrap;
  margin-top: 3px;
}

.item_origin_price {
  font-size: 12px;
  color: #9a9a9a;
  text-decoration: line-through;
  line-height: 1.2;
}

.item_origin_price_detail {
  font-size: 15px;
  color: #9a9a9a;
  text-decoration: line-through;
  line-height: 1.2;
}

.item_origin_price_detail {
  text-decoration: line-through;
}

.item_discount_rate {
  font-size: 13px;
  font-weight: 800;
  color: #ff2b4f;
  line-height: 14px;
}

.item_discount_rate_detail {
  font-size: 15px;
  font-weight: 700;
  color: #ff2b4f;
  line-height: 14px;
}

.item_delivery_fee {
  margin-top: 4px;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  color: #9a9a9a;
}

.item_delivery_fee2 {
  margin-top: 4px;
  display: flex;
  align-items: end;
  gap: 3px;
  font-size: 12px;
  color: #9a9a9a;
  line-height: 12px;
}

.delivery_icon {
  font-size: 13px;
}

.layout3_price_align {
  justify-content: flex-end;
  text-align: right;
}

.layout2_price_wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.layout2_price_left {
  display: flex;
  flex-direction: column;
}

.layout2_delivery_right {
  display: flex;
  align-items: flex-end;
}

.layout3_left_row > * + * {
  margin-left: 8px;
}

#detail_btn_wrap {
  justify-content: space-between;
  padding: 0px 16px;
  box-sizing: border-box;
}

#detail_header_title {
  flex: 1 1 auto;
  min-width: 0;
  padding-right: 12px;

  font-size: 16px;
  font-weight: 700;
  line-height: 48px;
  color: #1a1a1a;

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.item_delivery_fee {
  display: flex;
  align-items: flex-end; /* 아래 기준 정렬 */
}

.delivery_icon_img {
  display: block;
}

.delivery_icon_wrap {
  height: 14px;
  overflow: hidden;
}

.detail-info-body {
  min-height: 200px;
}

.select-item-group-name {
  white-space: normal !important;
  word-break: break-all !important;
  overflow-wrap: anywhere !important;
}

.select-item-group-name span {
  display: block;
  white-space: normal !important;
  word-break: break-all !important;
  overflow-wrap: anywhere !important;
}

.select-item-box {
  white-space: normal !important;
}

.select-item-box-name {
  display: block;
  white-space: normal !important;
  word-break: break-all !important;
  overflow-wrap: anywhere !important;
}

#detail_popup {
  position: relative;
}

.detailFloatingBtn {
  position: absolute;
  right: 16px;
  bottom: 88px;
  z-index: 20;

  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #1976d2;
  color: #fff;

  display: none;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

/* 1. 닫기 버튼 본체: 평상시 (화이트 테마) */
html body .viewer-container .viewer-button.viewer-close {
  background-color: rgba(255, 255, 255, 0.9) !important; /* 평상시 흰색 배경 */
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;

  /* 위치는 이미지 상단에 붙도록 유지 */
  top: 6px !important;
  right: 6px !important;
  width: 44px !important;
  height: 44px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important; /* 은은한 테두리 */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 2. 내부 X 아이콘: 평상시 (어두운 글자) */
html body .viewer-container .viewer-button.viewer-close::before {
  content: "\2715" !important;
  position: static !important; /* 중앙 정렬을 위한 리셋 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* 기존 라이브러리 스프라이트 이미지 제거 (중요!) */
  background: none !important;

  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  color: #1d1d1f !important; /* 평상시 검정색 X */
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;

  /* 정중앙 수직 보정 */
  transform: translateY(-1px) !important;
}

/* 3. 호버 시: 블랙 테마로 반전 */
html body .viewer-container .viewer-button.viewer-close:hover {
  background-color: rgba(0, 0, 0, 0.85) !important; /* 호버 시 검정색 배경 */
  transform: scale(1.08) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
}

/* 4. 호버 시 내부 X 아이콘: 흰색으로 반전 */
html body .viewer-container .viewer-button.viewer-close:hover::before {
  color: #ffffff !important; /* 호버 시 흰색 X */
}

#cart_list.cart_list {
  margin-top: 1px;
  overflow: auto;
  background: #f5f5f5 !important;
  padding-bottom: 118px;
}

.mall-cart-select-top {
  height: 52px;
  padding: 0 16px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px #f3f3fb solid;
}

.mall-cart-select-top input,
.mall-cart-check {
  width: 22px;
  height: 22px;
  accent-color: #222;
}

.mall-cart-delete-selected {
  border: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 800;
}

.mall-cart-thumb {
  width: 84px;
  height: 84px;
  object-fit: cover;
  flex: 0 0 84px;
}

.mall-cart-info {
  flex: 1;
  min-width: 0;
  padding-right: 26px;
}

.mall-cart-brand {
  font-size: 17px;
  line-height: 21px;
  font-weight: 900;
  color: #111;
}

.mall-cart-name {
  margin-top: 3px;
  font-size: 14px;
  line-height: 18px;
  color: #555;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mall-cart-size {
  margin-top: 7px;
  font-size: 14px;
  font-weight: 700;
}

.mall-cart-origin {
  color: #999;
  font-size: 13px;
  text-decoration: line-through;
}

.mall-cart-rate {
  color: #e33131;
  font-size: 17px;
  font-weight: 900;
}

.mall-cart-sale {
  color: #111;
  font-size: 18px;
  font-weight: 900;
}

.mall-cart-control {
  margin-top: 14px;
  display: flex;
  gap: 10px;
}

.mall-cart-qty {
  height: 34px;
  display: flex;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}

.mall-cart-qty button {
  width: 34px;
  height: 34px;
  border: 0;
  background: #fff;
  font-size: 22px;
}

.mall-cart-qty input {
  width: 36px;
  border: 0;
  text-align: center;
  font-weight: 800;
}

.mall-cart-option-btn {
  height: 34px;
  padding: 0 12px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  font-weight: 800;
}

.mall-cart-bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 425px;
  margin: auto;
  height: auto !important;
  background: #fff;
  z-index: 220;
  display: flex !important;
  flex-direction: column;
}

.mall-cart-summary-row {
  height: 48px;
  padding: 0 18px;
  display: flex;
  align-items: center;
}

.mall-cart-summary-row > span {
  font-size: 15px;
  font-weight: 800;
}

.mall-cart-summary-price {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 7px;
}
#cart_popup .mall-cart-arrow {
  width: 22px;
  height: 22px;
  border: 1px solid #ddd;
  border-radius: 50%;
  color: #999;
  display: flex;
  align-items: center;
  justify-content: center;
}

#cart_popup .mall-cart-arrow svg {
  transition: transform 0.25s ease;
}

/* 팝업 열리면 아래 방향 */
#cart_popup .mall-cart-bottom.open .mall-cart-arrow svg {
  transform: rotate(180deg);
}

.mall-cart-detail {
  display: none;
  padding: 16px 22px 12px;
  background: #fff;
  border-radius: 18px 18px 0 0;
}

.mall-cart-bottom.open .mall-cart-detail {
  display: block;
}

.sheet-handle {
  width: 44px;
  height: 5px;
  border-radius: 99px;
  background: #e5e5e5;
  margin: 0 auto 22px;
}

.mall-cart-detail h3 {
  margin: 0 0 24px;
  font-size: 22px;
  font-weight: 900;
}

.sheet-row,
.sheet-total {
  display: flex;
  justify-content: space-between;
  margin: 14px 0;
}

.sheet-row span {
  color: #666;
  font-weight: 700;
}

.sheet-row b {
  font-size: 16px;
}

.minus {
  color: #e33131;
}

.sheet-total {
  border-top: 1px solid #eee;
  padding-top: 17px;
  font-weight: 900;
}

.sheet-total b {
  font-size: 23px;
}

#pay_btn2.pay_btn_back {
  width: 100% !important;
  height: 58px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

#mall_pay_origin_amt {
  color: rgba(255, 255, 255, 0.55);
  text-decoration: line-through;
  font-size: 16px;
}

#mall_pay_sale_amt {
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

#pay_btn2_text {
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.mall-cart-option-list {
  margin-top: 7px;
}

.mall-cart-option-text {
  font-size: 13px;
  line-height: 18px;
  color: #707070;
  font-weight: 500;
}

.mall-cart-option-group {
  color: #555;
  font-weight: 700;
}

.mall-cart-option-name {
  color: #707070;
}

#mall_cart_overlay {
  display: none;
  position: fixed;
  inset: 0;
  max-width: 425px;
  margin: auto;
  background: rgba(0, 0, 0, 0.55);
  z-index: 210;
}

.mall-cart-bottom {
  z-index: 220;
}

.mall-cart-left {
  width: 104px;
  flex: 0 0 104px;
}

.mall-cart-detail {
  display: none;
  padding: 18px 22px 12px;
  background: #fff;
  border-bottom: 1px solid #eee;
}

.mall-cart-bottom.open .mall-cart-detail {
  display: block;
}

.sheet-total {
  display: none !important;
}

.mall-cart-left {
  width: 104px;
  flex: 0 0 104px;
}

.mall-cart-left .mall-cart-thumb {
  width: 84px;
  height: 84px;
  object-fit: cover;
}

.mall-cart-left .mall-cart-qty {
  width: 104px;
  margin-top: 8px;
  display: flex;
}

.mall-cart-left .mall-cart-qty button {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
}

.mall-cart-left .mall-cart-qty input {
  width: 36px;
  height: 34px;
  flex: 0 0 36px;
  text-align: center;
}

#cart_list.cart_list {
  background: #f5f5f5 !important;
  padding-bottom: 126px;
  overflow: auto;
}

.mall-cart-select-top {
  height: 44px;
  padding: 0 14px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mall-cart-select-top label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  color: #202020;
  margin-bottom: 0px;
}

.mall-cart-select-top input,
.mall-cart-check {
  width: 18px;
  height: 18px;
  accent-color: #1976d2;
}

.mall-cart-delete-selected {
  border: 0;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  color: #2a2a2a;
}

.mall-cart-item {
  position: relative;
  display: grid;
  grid-template-columns: 18px 74px 1fr 18px;
  column-gap: 8px;
  padding: 12px 14px;
  margin-bottom: 2px;
  background: #fff;
  align-items: start;
}

.mall-cart-left {
  width: 74px;
}

.mall-cart-thumb {
  width: 74px;
  height: 74px;
  object-fit: cover;
}

.mall-cart-info {
  min-width: 0;
  padding-right: 0;
}

.mall-cart-brand {
  font-size: 13px;
  line-height: 16px;
  font-weight: 700;
  color: #202020;
}

.mall-cart-name {
  margin-top: 2px;
  font-size: 13px;
  line-height: 16px;
  color: #2a2a2a;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-all;
}

.mall-cart-option-list {
  margin-top: 4px;
}

.mall-cart-option-text {
  font-size: 12px;
  line-height: 15px;
  color: #707070;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mall-cart-bottom-row {
  grid-column: 2 / 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
}

.mall-cart-qty {
  width: 74px;
  height: 28px;
  display: flex;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  flex: 0 0 74px;
}

.mall-cart-qty button {
  width: 24px;
  height: 28px;
  border: 0;
  background: #fff;
  font-size: 15px;
  color: #707070;
  padding: 0;
}

.mall-cart-qty input {
  width: 26px;
  height: 28px;
  border: 0;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  padding: 0;
}

.mall-cart-price {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
  flex-wrap: wrap;
}

.mall-cart-origin {
  color: #949494;
  font-size: 12px;
  line-height: 15px;
  text-decoration: line-through;
}

.mall-cart-rate {
  color: #e33131;
  font-size: 13px;
  line-height: 15px;
  font-weight: 700;
}

.mall-cart-sale {
  color: #000;
  font-size: 13px;
  line-height: 15px;
  font-weight: 700;
}

.mall-cart-remove {
  width: 18px;
  height: 18px;
  border: 0;
  background: transparent;
  font-size: 35px;
  line-height: 18px;
  padding: 0;
  color: #202020;
}

.mall-cart-bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 425px;
  margin: auto;
  background: #fff;
  z-index: 220;
  height: auto !important;
  display: flex !important;
  flex-direction: column;
}

.mall-cart-summary-row > span {
  font-size: 14px;
  font-weight: 700;
  color: #202020;
}

.mall-cart-summary-price {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

#cart_total_amt {
  font-size: 16px;
  font-weight: 700;
}

#mall_cart_arrow {
  width: 20px;
  height: 20px;
  border: 1px solid #ddd;
  border-radius: 50%;
  color: #999;
  font-size: 12px;
  text-align: center;
  line-height: 18px;
}

.mall-cart-detail {
  max-height: 0;
  overflow: hidden;
  padding: 0 22px;
  background: #fff;
  opacity: 0;
  transform: translateY(16px);
  transition:
    max-height 0.28s ease,
    padding 0.28s ease,
    opacity 0.22s ease,
    transform 0.28s ease;
}

.mall-cart-bottom.open .mall-cart-detail {
  max-height: 170px;
  padding: 16px 22px 12px;
  opacity: 1;
  transform: translateY(0);
}

.sheet-row {
  display: flex;
  justify-content: space-between;
  margin: 10px 0;
}

.sheet-row span {
  font-size: 13px;
  color: #707070;
}

.sheet-row b {
  font-size: 14px;
  color: #202020;
}

.sheet-row .minus {
  color: #e33131;
}

.mall-pay-btn-wrap {
  background: #fff;
  box-sizing: border-box;
}

#pay_btn2.pay_btn_back {
  width: 100% !important;
  height: 100%;
  border-radius: 12px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

#mall_pay_origin_amt {
  font-size: 15px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.55);
  text-decoration: line-through;
}

#mall_pay_sale_amt,
#pay_btn2_text {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
}

#pay_btn2.disabled,
#cart_btn2.disabled {
  background: #dcdcdc !important;
  color: #999 !important;
  pointer-events: none;
}

.cart-pay-footer-btn {
  width: 100% !important;
  height: 56px !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

#cart_pay_inner,
#cart_order_inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
}

#mall_pay_origin_amt,
#mall_cart_origin_amt {
  color: rgba(255, 255, 255, 0.45);
  text-decoration: line-through;
  font-size: 15px;
  font-weight: 700;
}

#mall_pay_sale_amt,
#mall_cart_sale_amt,
#pay_btn2_text,
#cart_btn2_text {
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
}

.mall-cart-brand,
.mall-cart-name {
  font-size: 13px !important;
  line-height: 16px !important;
  color: #2a2a2a;
}

.mall-cart-brand {
  font-weight: 700;
}

.mall-cart-name {
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.mall-cart-option-text {
  font-size: 13px !important;
  line-height: 16px !important;
  color: #707070;
}

.mall-cart-origin {
  font-size: 13px;
  color: #949494;
  text-decoration: line-through;
}

.mall-cart-rate {
  font-size: 13px;
  font-weight: 700;
  color: #e33131;
}

.mall-cart-sale {
  font-size: 13px;
  font-weight: 700;
  color: #000;
}

#cart_popup .mall-pay-btn-wrap {
  padding: 0px !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

#cart_popup #pay_btn2.cart-pay-footer-btn {
  height: 48px !important;
  width: 100% !important;
  border-radius: 12px !important;
  background: #1976d2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#cart_popup #cart_pay_inner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  height: 100% !important;
}

#cart_popup #mall_pay_origin_amt {
  color: rgba(255, 255, 255, 0.45) !important;
  text-decoration: line-through !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

#cart_popup #mall_pay_sale_amt,
#cart_popup #pay_btn2_text {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

#cart_popup .mall-cart-bottom {
  border-top: 0 !important;
}

/* summary row 간격 줄이기 */
#cart_popup .mall-cart-summary-row {
  margin: 0 !important;
  padding: 0 14px !important;
}

/* detail 열렸을 때 위 밀림 제거 */
#cart_popup .mall-cart-detail {
  padding-top: 0 !important;
}

#cart_popup .mall-cart-info {
  min-width: 0 !important;
  padding-left: 0 !important;
}

#cart_popup .mall-cart-bottom-row {
  grid-column: 3 / 5 !important;
  display: flex;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin-top: 8px !important;
}

#cart_popup .mall-cart-price {
  flex: 0 1 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  white-space: nowrap !important;
}

#cart_popup .mall-cart-qty {
  width: 90px !important;
  height: 28px !important;
  flex: 0 0 74px !important;
  display: flex !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

#cart_popup .mall-cart-qty button {
  width: 28px !important;
  height: 28px !important;
  border: 0 !important;
  background: #fff !important;
  font-size: 15px !important;
}

#cart_popup .mall-cart-qty input {
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

#cart_popup .mall-cart-summary-row {
  margin: 0 16px !important;
  padding: 0 !important;
  height: 48px !important;
}

/* 수량 (이미지 밑) */
#cart_popup .mall-cart-qty {
  margin-top: 8px !important;
  display: flex !important;
  width: 74px !important;
  height: 28px !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

#cart_popup .mall-cart-qty button {
  width: 24px !important;
  border: 0 !important;
  background: #fff !important;
}

#cart_popup .mall-cart-qty input {
  width: 26px !important;
  border: 0 !important;
  text-align: center !important;
}

/* 오른쪽 */
#cart_popup .mall-cart-info {
  min-width: 0 !important;
}

/* 설명 2줄 */
#cart_popup .mall-cart-doc {
  font-size: 13px !important;
  line-height: 16px !important;
  color: #707070 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

/* 옵션 */
#cart_popup .mall-cart-option-text {
  font-size: 13px !important;
  color: #707070 !important;
}

/* 가격을 수량 옆으로 보이게 */
#cart_popup .mall-cart-price {
  position: absolute !important;
  left: 165px !important; /* 이미지 + 간격 */
  display: flex !important;
  gap: 4px !important;
}

#cart_popup .mall-cart-item.order_select {
  display: grid !important;
  grid-template-columns: 22px 116px minmax(0, 1fr) 18px !important;
  column-gap: 12px !important;
  row-gap: 8px !important;
  padding: 16px !important;
  align-items: start !important;
  position: relative !important;
}

#cart_popup .mall-cart-info {
  grid-column: 3 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  padding-right: 22px !important;
}

#cart_popup .mall-cart-brand {
  font-size: 13px !important;
  line-height: 16px !important;
  font-weight: 700 !important;
  color: #2a2a2a !important;
}

#cart_popup .mall-cart-name,
#cart_popup .mall-cart-doc {
  margin-top: 5px !important;
  font-size: 13px !important;
  line-height: 16px !important;
  font-weight: 500 !important;
  color: #707070 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  word-break: break-all !important;
}

#cart_popup .mall-cart-option-list {
  margin-top: 8px !important;
}
#cart_popup .mall-cart-option-text {
  font-size: 13px !important;
  line-height: 16px !important;
  color: #707070 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#cart_popup .mall-cart-bottom-row {
  grid-column: 2 / 4 !important;
  grid-row: 2 !important;
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: center !important;
  margin-top: 2px !important;
}

#cart_popup .cart-qty-btn {
  border: 1px solid #1976d2 !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #1976d2 !important;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px !important;
  font-weight: 700 !important;

  padding: 0 !important;
}

#cart_popup .cart-plus-btn {
  background: #1976d2 !important;
  color: #fff !important;
}

#cart_popup .cart-qty-input {
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  background: transparent !important;
}

#cart_popup .mall-cart-price {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  white-space: nowrap !important;
  margin-top: 5px;
}

#cart_popup .mall-cart-origin {
  font-size: 13px !important;
  color: #949494 !important;
  text-decoration: line-through !important;
}

#cart_popup .mall-cart-rate {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #ff334b !important;
}

#cart_popup .mall-cart-sale {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #000 !important;
}

#cart_popup .mall-cart-remove {
  grid-column: 4 !important;
  grid-row: 1 !important;
  width: 18px !important;
  height: 18px !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  font-size: 35px !important;
  line-height: 18px !important;
}

#cart_popup .cart-qty-input {
  width: 34px !important;
  height: 26px !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

#cart_popup .mall-cart-thumb {
  width: 98px !important;
  height: 100px !important;
  object-fit: cover !important;
  border: 1px solid #e5e5e5;
  border-radius: 5px !important;
}

#cart_popup .mall-cart-left {
  width: 100px !important;
}

#cart_popup .mall-cart-item.order_select {
  grid-template-columns: 22px 100px minmax(0, 1fr) 20px !important;
}

#cart_popup .mall-cart-bottom-row {
  grid-template-columns: 100px minmax(0, 1fr) !important;
}

#cart_popup .cart-qty-wrap {
  width: 100px !important; /* 전체 영역 조금 늘림 */
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* 버튼 작게 */
#cart_popup .cart-qty-btn {
  width: 22px !important;
  height: 22px !important;
  font-size: 16px !important;
  line-height: 22px !important;
}

/* input 크게 */
#cart_popup .cart-qty-input {
  width: 44px !important;
  height: 28px !important;
  font-size: 14px !important;
}

/* 버튼과 input 사이 간격 */
#cart_popup .cart-qty-wrap {
  gap: 6px !important;
}

#cart_popup #mall_cart_overlay {
  display: none;
  position: fixed;
  inset: 0;
  max-width: 425px;
  margin: auto;
  background: rgba(0, 0, 0, 0.55);
  z-index: 210;
}

/* bottom base */
#cart_popup .mall-cart-bottom {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  padding: 0 !important;
  background: #fff;
  z-index: 220;
  display: flex;
  flex-direction: column;
}
.cart_div_line {
  height: 8px;
  background-color: #f5f5f5; /* 원하는 색 */
  width: 100%;
}

/* detail sheet: 열렸을 때 위로 추가 */
#cart_popup .mall-cart-detail {
  max-height: 0;
  overflow: hidden;
  padding: 0 22px;
  background: #fff;
  opacity: 0;
  transform: translateY(18px);
  transition:
    max-height 0.28s ease,
    padding 0.28s ease,
    opacity 0.22s ease,
    transform 0.28s ease;
}

#cart_popup .mall-cart-bottom.open .mall-cart-detail {
  max-height: 132px;
  padding: 18px 22px 12px;
  opacity: 1;
  transform: translateY(0);
}

/* 가운데 손잡이 */
#cart_popup .sheet-handle {
  width: 42px;
  height: 5px;
  border-radius: 99px;
  background: #e5e5e5;
  margin: 0 auto 18px;
}

/* detail rows */
#cart_popup .sheet-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 12px 0 0;
}

#cart_popup .sheet-row span {
  font-size: 14px;
  font-weight: 700;
  color: #707070;
}

#cart_popup .sheet-row b {
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1a;
}

#cart_popup .mall-cart-summary-row > span {
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1a;
}

#cart_popup .mall-cart-summary-price {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

#cart_popup #cart_total_amt {
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
  color: #1a1a1a;
}

/* SVG 느낌 토글 버튼: 이미지 없이 CSS chevron */
#cart_popup .mall-cart-arrow {
  width: 22px;
  height: 22px;
  border: 1px solid #ddd;
  border-radius: 50%;
  position: relative;
  flex: 0 0 22px;
}

#cart_popup .mall-cart-arrow::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 8px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #999;
  border-left: 2px solid #999;
  transform: rotate(45deg);
  transition:
    transform 0.25s ease,
    top 0.25s ease;
}

/* 열렸을 때 아래 화살표 */
#cart_popup .mall-cart-bottom.open .mall-cart-arrow::before {
  top: 6px;
  transform: rotate(225deg);
}

/* 결제 버튼은 지금 완성된 상태 유지 */
#cart_popup .mall-pay-btn-wrap {
  height: 64px;
  padding: 8px 14px !important;
  background: #fff;
  box-sizing: border-box;
}

#cart_popup .sheet-close-arrow {
  width: 42px;
  height: 18px;
  margin: 0 auto 14px;
  position: relative;
}

#cart_popup .sheet-close-arrow::before,
#cart_popup .sheet-close-arrow::after {
  content: "";
  position: absolute;
  top: 7px;
  width: 22px;
  height: 4px;
  background: #e5e5e5;
  border-radius: 99px;
}

#cart_popup .sheet-close-arrow::before {
  left: 2px;
  transform: rotate(15deg);
}

#cart_popup .sheet-close-arrow::after {
  right: 2px;
  transform: rotate(-15deg);
}

#cart_popup .sheet-title {
  font-size: 18px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 22px;
}

#cart_popup .sheet-divider {
  height: 1px;
  background: #e5e5e5;
  margin: 14px 0 4px;
}

#cart_popup .sheet-total-row span,
#cart_popup .sheet-total-row b {
  color: #1a1a1a;
  font-size: 16px;
  font-weight: 700;
}

#cart_popup .mall-cart-bottom.open .mall-cart-detail {
  max-height: 260px;
  padding: 16px 22px 14px;
}

#cart_popup .mall-cart-bottom {
  overflow: visible !important;
}

#cart_popup .mall-cart-detail {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 112px; /* summary 48 + button 64 */
  z-index: 230;

  background: #fff;
  border-radius: 16px 16px 0 0;
  padding: 16px 22px 14px !important;

  max-height: none !important;
  opacity: 0;
  transform: translateY(110%);
  pointer-events: none;

  transition:
    transform 0.32s ease-out,
    opacity 0.22s ease-out;
}

#cart_popup .mall-cart-bottom.open .mall-cart-detail {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* dim overlay */
#cart_popup #mall_cart_overlay {
  display: none;
  position: fixed;
  inset: 0;
  max-width: 425px;
  margin: auto;
  background: rgba(0, 0, 0, 0.55);
  z-index: 210;
}

/* 아래 고정 영역은 그대로 */
#cart_popup .mall-cart-summary-row,
#cart_popup .mall-pay-btn-wrap {
  position: relative;
  z-index: 240;
}
.mall-cart-option-text {
  margin-top: 4px;
}

.cart_hide {
  display: none !important;
}
.cart_show {
  display: flex !important;
}

.toast-msg {
  position: fixed;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);

  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  padding: 10px 15px;
  border-radius: 5px;

  min-width: 250px;
  max-width: 500px;

  font-size: 14px;
  font-weight: 500;
  text-align: center;

  white-space: nowrap; /* ⭐ 한 줄 강제 */

  z-index: 9999;
  opacity: 0;
  transition:
    opacity 0.3s,
    top 0.3s;
}
.toast-msg.show {
  opacity: 1;
  bottom: 40px;
}

.c_item_inner .item_root_div.item_style2:first-of-type {
  padding-top: 13px;
}

.item_img_div,
.item_img_wrapper,
.item_img {
  position: relative;
}
.gb_progress_overlay {
  position: absolute;
  width: 100%;
  bottom: -4px;
  padding: 6px 7px;
  border-radius: 8px;
  background: rgba(25, 25, 25, 0.82);
  color: #fff;
  z-index: 5;
  box-sizing: border-box;
}

.gb_progress_text_row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  margin-bottom: 4px;
}

.gb_progress_text_row span:last-child {
  color: white;
}

.gb_progress_bar {
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.45);
  overflow: hidden;
}

.gb_progress_fill {
  height: 100%;
  border-radius: 999px;
  background: #3674d9;
}
.gb_timer_text {
  letter-spacing: 1.5px;
}

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

.gb_progress_bar2 {
  flex: 1;
  height: 6px;
  background: #e8e8e8;
  border-radius: 999px;
  overflow: hidden;
}

.gb_progress_fill2 {
  height: 100%;
  background: #3674d9;
}

.gb_progress_text2 {
  font-size: 12px;
  min-width: 60px;
  text-align: right;
  margin-left: 5px;
}

.gb_progress_wrap3 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}

.gb_progress_bar3 {
  flex: 1;
  height: 5px;
  background: #e8e8e8;
  border-radius: 999px;
  overflow: hidden;
}

.gb_progress_fill3 {
  height: 100%;
  background: #3674d9;
  border-radius: 999px;
}

.gb_progress_text3 {
  font-size: 12px;
  color: #666;
  min-width: 55px;
  text-align: right;
  margin-left: 5px;
}

.gb_progress_wrap3 {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
}

.gb_progress_bar3 {
  flex: 1;
  height: 5px;
  background: #e8e8e8;
  border-radius: 999px;
}

.gb_progress_text3 {
  flex-shrink: 0;
}

.gb_detail_overlay {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 12px;
  height: 34px;
  padding: 0 12px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  z-index: 5;
}

.gb_detail_bar {
  flex: 1;
  height: 7px;
  background: rgba(255, 255, 255, 0.65);
  border-radius: 999px;
  overflow: hidden;
}

.gb_detail_fill {
  height: 100%;
  background: #3674d9;
  border-radius: 999px;
}

.gb_detail_percent,
.gb_detail_text {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.detail-video-fullscreen {
  position: absolute;
  right: 10px;
  bottom: 58px;
  z-index: 12;
}

.mall-gb-cart-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-radius: 8px;
  background: linear-gradient(90deg, #eef6ff 0%, #f7fbff 100%);
}

.mall-gb-cart-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #dcebff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.mall-gb-cart-icon img {
  width: 26px;
  height: 26px;
}

.mall-gb-cart-label {
  color: #1683ff;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 2px;
}

.mall-gb-cart-title {
  color: #111;
  font-size: 14px;
  font-weight: 600;
}

.mall-gb-cart-banner-wrap {
  padding: 8px 16px;
  background: #fff;
  border-bottom: 1px #f3f3fb solid;
}

.mall-gb-cart-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-radius: 8px;
  background: linear-gradient(90deg, #eef6ff 0%, #f7fbff 100%);
}

.order_list_order_top {
  display: flex;
  align-items: center;
}

.order-gb-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 7px;
  border-radius: 5px;
  background: #eef6ff;
  color: #1683ff;
  font-size: 12px;
  font-weight: 600;
}

.order-gb-badge img {
  width: 15px;
  height: 15px;
}

.order_list_order_time {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* 
body.notice-lock {
  overflow: hidden;
  touch-action: none;
}

#notice_popup_overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(2px);
}

#notice_popup_box {
  width: 380px;
  max-width: calc(100vw - 32px);
  max-height: 85vh;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  font-family: "Pretendard Variable", Pretendard, sans-serif;
}

#notice_popup_header {
  flex-shrink: 0;
  padding: 18px 20px 14px;
  border-bottom: 1px solid #f0f0f0;
  background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
}


#notice_popup_title {
  font-size: 18px;
  font-weight: 800;
  color: #111;
  line-height: 1.35;
  word-break: break-word;
}

#notice_popup_click_area {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0px;
  cursor: pointer;
  -webkit-overflow-scrolling: touch;
}

#notice_popup_img {
  width: 100%;
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 14px;
  background: #f5f5f5;
}

#notice_popup_content {
  font-size: 14px;
  line-height: 1.65;
  color: #222;
  word-break: break-word;
}

#notice_popup_content img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 10px auto;
}

#notice_popup_content p {
  margin: 0 0 10px;
}

#notice_popup_content ul {
  padding-left: 20px;
  list-style: disc;
}

#notice_popup_content ol {
  padding-left: 20px;
  list-style: decimal;
}

#notice_popup_footer {
  flex-shrink: 0;
  display: flex;
  width: 100%;
  border-top: 1px solid #ededed;
  background: #fff;
}

#notice_popup_footer button {
  width: 50%;
  height: 48px;
  border: 0;
  background: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

#notice_popup_week_btn {
  color: #777;
  border-right: 1px solid #ededed !important;
}

#notice_popup_close_btn {
  color: #111;
}

#notice_popup_footer button:active {
  background: #f5f5f5;
}

 */

#notice_popup_overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 425px;
  z-index: 995;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  animation: fadeIn 0.3s ease-out;
}

#notice_popup_box {
  width: 90%;
  max-width: 400px;
  max-height: 80vh;
  background: #ffffff;
  border-radius: 5px; /* 더 둥글게 해서 귀여운 거북이 이미지와 매칭 */
  overflow: hidden;
  display: flex;
  flex-direction: column;
  /* 부드럽고 깊은 그림자 효과 */
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  animation: slideUp 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
}

#notice_popup_click_area {
  flex: 1;
  overflow-y: auto;
  cursor: pointer;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
}

#notice_popup_click_area::-webkit-scrollbar {
  width: 3px;
}
#notice_popup_click_area::-webkit-scrollbar-track {
  background: transparent;
}
#notice_popup_click_area::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.25);
  border-radius: 10px;
}

#notice_popup_content img {
  display: block;
  width: 100%;
  height: auto;
  /* 이미지 상단 라운딩 유지 */
}

#notice_popup_footer {
  display: flex;

  background: #fff;
  border-top: 1px solid #f2f2f2;
}

#notice_popup_footer button {
  flex: 1;
  border: none;
  background: none;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  height: 40px;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

/* '일주일간 보지않기' 버튼 - 연하게 */
#notice_popup_week_btn {
  color: #999;
  font-weight: 500 !important;
}

/* '닫기' 버튼 - 강조 */
#notice_popup_close_btn {
  color: #3674d9;
  position: relative;
}

/* 버튼 사이 세로선 대신 간격과 배경색으로 구분 */
#notice_popup_week_btn:after {
  content: "";
  position: absolute;
  right: 0;
  top: 20%;
  height: 60%;
  width: 1px;
  background: #eee;
}

#notice_popup_footer button:hover {
  background: #f9f9f9;
}

#notice_popup_footer button:active {
  background: #f0f0f0;
}

/* 애니메이션 효과 추가 */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.gb_detail_progress_overlay {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 10;

  display: flex;
  align-items: center;
  gap: 10px;

  padding: 6px 10px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.6);
  box-sizing: border-box;
}

/* 왼쪽 % */
.gb_detail_progress_left {
  font-size: 12px;
  font-weight: 700;
  color: white; /* 주황 포인트 */
  white-space: nowrap;
}

/* 가운데 바 */
.gb_detail_progress_bar {
  flex: 1;
  height: 6px;
  background: #e8e8e8;
  border-radius: 999px;
  overflow: hidden;
}

.gb_detail_progress_fill {
  height: 100%;
  background: #3674d9;
  border-radius: 999px;
  transition: width 0.3s;
}

/* 오른쪽 수량 */
.gb_detail_progress_right {
  font-size: 12px;
  color: #fff;
  white-space: nowrap;
}

.paysc-gb-banner-wrap {
  padding: 8px 16px;
  background: #fff;
  border-bottom: 1px #dddddd solid;
}

.paysc-gb-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-radius: 8px;
  background: linear-gradient(90deg, #eef6ff 0%, #f7fbff 100%);
}

.paysc-gb-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #dcebff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.paysc-gb-icon img {
  width: 26px;
  height: 26px;
}

.paysc-gb-label {
  color: #1683ff;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 2px;
}

.paysc-gb-title {
  color: #111;
  font-size: 14px;
  font-weight: 600;
}

.item_card {
  position: relative;
}

.layout2_price_wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
}

.layout2_price_wrap {
  padding-right: 5px;
}

@media (max-width: 380px) {
  .gb_progress_wrap2 {
    padding-right: 8px !important;
  }
  .layout2_price_wrap {
   padding-right: 15px;
  }
}

.layout2_price_left {
  min-width: 0;
}

.layout2_delivery_right {
  flex: 0 0 auto;
  margin-right: 0; /* 기존 오른쪽 마진 있으면 제거 */
}

.item_delivery_fee2 {
  white-space: nowrap;
}

.layout2_favorite_area {
  position: absolute;
  right: 0;
  bottom: 23px;
  width: 40px;
  text-align: center;
  z-index: 2;
}

.notice-nav-btn:hover {
  background: rgba(0, 0, 0, 0.55);
}

.scrollDisable {
  overflow: hidden;
  height: 100%;
}

#notice_popup_img_wrap {
  position: relative;
}

.notice-nav-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  width: 25px;
  height: 30px;
  border: none;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
}

.notice-prev-btn {
  left: 8px; /* 이미지 안쪽 왼쪽 */
}

.notice-next-btn {
  right: 8px; /* 이미지 안쪽 오른쪽 */
}

#notice_popup_content img {
  display: block;
  width: 100%;
  height: auto;
}

.notice-nav-btn svg,
.notice-nav-btn svg * {
  pointer-events: none;
}

@media (hover: hover) {
  #notice_popup_footer button:hover {
    background: #f9f9f9;
  }

  .notice-nav-btn:hover {
    background: rgba(0, 0, 0, 0.55);
  }
}

#notice_popup_box {
  position: relative; /* 기준 */
}

#notice_popup_click_area {
  position: relative;
}

#notice_popup_content img {
  width: 100%;
  display: block;
}

#notice_popup_week_btn {
  position: relative; /* 🔥 이거 추가 */
}

.notice-nav-btn {
  position: fixed; /* 🔥 핵심 */
  top: 50vh; /* 화면 기준 중앙 */
  transform: translateY(-50%);
  z-index: 99999;

  width: 25px;
  height: 30px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 데탑 */
@media (min-width: 426px) {
  .notice-prev-btn {
    left: calc(50% - 175px + 10px);
  }

  .notice-next-btn {
    left: calc(50% + 175px - 35px);
  }
}

#notice_popup_close_btn,
#notice_popup_week_btn,
#notice_popup_content {
  font-family: inherit;
}

#notice_popup_content > p {
  margin-bottom: 0rem !important;
}

#notice_popup_prev_btn,
#notice_popup_next_btn {
  display: none !important;
}

#notice_popup_content img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
}

#notice_popup_content figure.image {
  margin-left: 0;
  margin-right: 0;
  text-align: center;
}


/* width 100% 이미지는 좌우 padding 뚫고 전체폭 */
#notice_popup_content img[style*="width:100%"],
#notice_popup_content img[style*="width: 100%"],
#notice_popup_content img[width="100%"] {
  margin-left: -20px;
  margin-right: -20px;
  max-width: none;
  width: calc(100% + 40px) !important;
}


#notice_popup_content figure.image {
  margin: 0 auto ;
  text-align: center;
}

#notice_popup_content figure.image img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: 0 auto !important;
}


#notice_popup_content p,
#notice_popup_content h1,
#notice_popup_content h2,
#notice_popup_content h3,
#notice_popup_content h4,
#notice_popup_content h5,
#notice_popup_content h6,
#notice_popup_content blockquote,
#notice_popup_content table {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

#notice_popup_content ul,
#notice_popup_content ol {
  padding-left: 50px;  
  padding-right: 20px;
  box-sizing: border-box;
}

#paysc_customsid_section{
	display: none;
}

#paysc_customsid_section.show{
	display: block;
}

.pay_disable_color {
  background: #97999b !important;
  cursor: not-allowed !important;
  pointer-events: none;
}

.pay_disable {
  display: none !important;
}

.pay_disable_show{
  display: block !important;
}

#pay_disable {
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* 상세화면 shimmer */
.detail-thumb.loading::after,
.banner-slide.loading::after,
#detail_main_media.loading::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer2d5 1.2s infinite;
  z-index: 10;
}
#detail_main_media.loaded::after,
.detail-thumb.loaded::after,
.banner-slide.loaded::after { display: none; }

/* 2.5D 상세화면 */
#detail-2d5-stage {
  position: relative;
  width: 100%; height: 100%;
  perspective: 800px;
}
#detail-2d5-stage img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  will-change: transform;
  backface-visibility: hidden;
}
#detail-2d5-stage .d25-bg      { z-index: 1; }
#detail-2d5-stage .d25-shadow  { z-index: 2; mix-blend-mode: multiply; }
#detail-2d5-stage .d25-subject { z-index: 3; }
#detail-2d5-stage.loading::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer2d5 1.2s infinite;
  z-index: 10;
}
#detail-2d5-stage.loaded::after { display: none; }

/* 2.5D parallax */
@keyframes shimmer2d5 {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.item-2d5-wrap {
  position: relative;
  overflow: hidden;
  perspective: 600px;
  background: #fafafa;
}
.item-2d5-wrap.loading::after,
.item-img-shimmer.loading::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer2d5 1.2s infinite;
  z-index: 10;
}
.item-2d5-wrap.loaded::after,
.item-img-shimmer.loaded::after { display: none; }

.item-img-shimmer {
  position: relative;
  overflow: hidden;
  background: #fafafa;
}
.item-img-shimmer img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.item-2d5-wrap img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  will-change: transform;
  backface-visibility: hidden;
}
.item-2d5-wrap .layer-bg      { z-index: 1; transform: scale(1.03); }
.item-2d5-wrap .layer-shadow  { z-index: 2; filter: blur(5px); mix-blend-mode: multiply; }
.item-2d5-wrap .layer-subject { z-index: 3; }


.item_name_wrapper.heart_inline {
  display: block;
  overflow: hidden;
  line-height: 12px;
  max-height: 30px;
  word-break: auto-phrase;
}

.item_name_wrapper.heart_inline .item_name_div {
  display: inline;
  overflow: visible;
  text-overflow: initial;
  -webkit-line-clamp: unset;
  -webkit-box-orient: initial;
}

.item_name_wrapper.heart_inline .favorite_count {
  display: inline;
  white-space: nowrap;
  margin-left: 4px;
}

.auto-resize-textarea {
  width: 100%;
  padding: 10px;
  line-height: 1.5; 
  min-height: calc(1.5em + 20px);
  max-height: calc((1.5em * 4) + 20px); 
  
  field-sizing: content;
  resize: none;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-sizing: border-box;
}


.header_div {
  position: fixed;
  top: 0;
  width: 100%;
  max-width: 425px;
  background: #fff;
  z-index: 10;
}

.header_title {
  height: 52px;
  padding: 14px 20px 12px;
  display: flex;
  align-items: center;
  position: relative;
}

.header_title::after {
  content: '';
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 0;
  height: 1px;
  background: #e4e6e7;
}

.store_name_div {
  flex: 1;
}

#header_action_bar {
  display: flex;
  justify-content: space-around;
  align-items: center;
  height: 58px;
  background: #fff;
  padding: 4px 0 8px 0;
  margin-top: 5px;
}

.header-action {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #111;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}

.top_btn {
  width: 28px;
  height: 28px;
  background: transparent;
  border-radius: 0;
  color: #111;
}

.top_btn:hover,
.top_btn:active,
.header-action:hover,
.header-action:hover .top_btn {
  color: #1976d2;
  background: transparent;
  border: 0;
}

.header_div.is-scrolled #header_action_bar {
  height: 40px;
}

.header_div.is-scrolled .header-action-text {
  display: none;
}

.header_div.is-scrolled #header_action_bar .top_btn {
  width: 24px;
  height: 24px;
}

.contents_div {
  padding-top: 150px;
}

#top_btn_div {
  width: 100%;
  order: 2;
  display: flex !important;
  justify-content: space-around;
  align-items: center;
  background: #fff;
}

#login_btn_div,
#logout_btn_div,
#share_btn_div,
#clipboard_btn_div,
#cart_btn_div,
#inq_btn_div {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #111;
}

#header_div.is-scrolled .action-label {
  display: none;
}

#inq_btn.common_btn {
  /* 브라우저가 강제로 먹이는 모든 테두리 라인 해제 */
  outline: none !important;
  box-shadow: none !important;
  border: none; /* 혹시 border로 잡혀있을 가능성 대비 */
  
  /* 마우스 클릭 시 순간적으로 생기는 하이라이트 방지 */
  -webkit-tap-highlight-color: transparent !important;
  
  /* 버튼 크기가 내부 아이콘에 딱 맞게 정렬되도록 처리 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* 2. 혹시 가상 요소(:before, :after)로 사각형을 만들고 있는지 방지 */
#inq_btn:focus,
#inq_btn:active,
#inq_btn:focus-visible,
#inq_btn:focus-within {
  outline: none !important;
  box-shadow: none !important;
}

/* 3. 아이콘 사이즈 20px 고정 및 호버 설정 */
.inq_icon {
  /* flex 안에서 찌그러지지 않도록 고정 크기 지정 */
  width: 22px !important;
  height: 22px !important;
  min-width: 22px;
  min-height: 22px;
  
  color: #000000;
  transition: color 0.2s ease;
}

/* 호버 시 파란색 변경 */
#inq_btn:hover .inq_icon {
  color: #3674d9;
}

#inq_btn_div:hover{
  color: #3674d9;
}

#login_btn_div:hover {
  color: #3674d9; /* 글자, 카운트, SVG 색상을 동시에 파란색으로! */
}
#login_btn_div:hover .login_btn_img {
  /* 검은색 이미지를 #3674d9 색상으로 강제 픽셀 변환하는 필터 조합 */
  filter: invert(41%) sepia(35%) saturate(3199%) hue-rotate(198deg) brightness(94%) contrast(87%);
}

/* 2. 로그아웃 버튼 호버 */
#logout_btn_div:hover {
  color: #3674d9;
}
#logout_btn_div:hover .logout_btn_img {
  filter: invert(41%) sepia(35%) saturate(3199%) hue-rotate(198deg) brightness(94%) contrast(87%);
}

/* 3. 공유 버튼 호버 */
#share_btn_div:hover {
  color: #3674d9;
}
#share_btn_div:hover .share_btn_img {
  filter: invert(41%) sepia(35%) saturate(3199%) hue-rotate(198deg) brightness(94%) contrast(87%);
}

/* 4. 주문내역 버튼 호버 */
#clipboard_btn_div:hover {
  color: #3674d9;
}
#clipboard_btn_div:hover .clipboard_btn_img {
  filter: invert(41%) sepia(35%) saturate(3199%) hue-rotate(198deg) brightness(94%) contrast(87%);
}

/* 5. 장바구니 버튼 호버 */
#cart_btn_div:hover {
  color: #3674d9;
}
#cart_btn_div:hover .cart_btn_img {
  filter: invert(41%) sepia(35%) saturate(3199%) hue-rotate(198deg) brightness(94%) contrast(87%);
}

.header-action:hover .inq_icon,
.header-action:hover #inq_lang_text {
    color: #3674d9;
    stroke: #3674d9;
}