.mark.self-mark {
  background-color: #00d3d7;
}
.mt-10 {
  margin-top: 10px !important;
}
.mb-10 {
  margin-bottom: 10px !important;
}
.mt-25 {
  margin-top: 25px !important;
}
.mt-28 {
  margin-top: 28px !important;
}
.mt-42 {
  margin-top: 42px !important;
}
.mt-72 {
  margin-top: 72px !important;
}
.pt-12 {
  padding-top: 12px !important;
}
.pb-24 {
  padding-bottom: 24px !important;
}
.pt-26 {
  padding-top: 26px !important;
}
.pt-32 {
  padding-top: 32px !important;
}
.pb-32 {
  padding-bottom: 32px !important;
}
.pt-42 {
  padding-top: 42px !important;
}
.pt-58 {
  padding-top: 58px !important;
}
.pb-115 {
  padding-bottom: 115px !important;
}
.pv-none {
  padding-block: 0 !important;
}
.pv-20 {
  padding-block: 20px !important;
}
.pl-40 {
  padding-left: 40px !important;
}

.ml-auto {
  margin-left: auto !important;
}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.hidden {
  display: none !important;
}

.page-top > p.sm {
  font-size: 14px;
}

.checkbox-wrap > label:empty {
  min-height: 28px;
}
.checkbox-wrap.square > label {
  font-size: 16px;
  font-weight: 600;
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.75 3H5.75C4.64543 3 3.75 3.89543 3.75 5V19C3.75 20.1046 4.64543 21 5.75 21H19.75C20.8546 21 21.75 20.1046 21.75 19V5C21.75 3.89543 20.8546 3 19.75 3Z' stroke='%23E8ECEF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: 24px;
}
.checkbox-wrap.square.sm > label {
  font-size: 14px;
}
.checkbox-wrap.square > label:empty {
  padding-left: 24px;
  min-height: 24px;
}
.checkbox-wrap.square > input:checked + label {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM11.0026 16L18.0737 8.92893L16.6595 7.51472L11.0026 13.1716L8.17421 10.3431L6.75999 11.7574L11.0026 16Z' fill='%2300D3D7'/%3E%3C/svg%3E%0A");
}
.checkbox-wrap.align-left > label {
  background-position: right center;
  padding-inline: 0 28px;
}

.checkbox-wrap.type-2 > label {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 11L12 14L22 4' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H16' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.checkbox-wrap.type-2 > input:checked + label {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 11L12 14L22 4' stroke='%2300d3d7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H16' stroke='%2300d3d7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.checkbox-wrap.spacing > label {
  padding-left: min(100px, 23vw);
  background-position: min(35px, 8.3vw) center;
}

.header .hd-btn.cart-btn {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.00391 16V4H2.00391V2H5.00391C5.5562 2 6.00391 2.44772 6.00391 3V15H18.4423L20.4423 7H8.00391V5H21.7231C22.2754 5 22.7231 5.44772 22.7231 6C22.7231 6.08176 22.7131 6.16322 22.6932 6.24254L20.1932 16.2425C20.082 16.6877 19.682 17 19.2231 17H5.00391C4.45163 17 4.00391 16.5523 4.00391 16ZM6.00391 23C4.89934 23 4.00391 22.1046 4.00391 21C4.00391 19.8954 4.89934 19 6.00391 19C7.10848 19 8.00391 19.8954 8.00391 21C8.00391 22.1046 7.10848 23 6.00391 23ZM18.0039 23C16.8993 23 16.0039 22.1046 16.0039 21C16.0039 19.8954 16.8993 19 18.0039 19C19.1085 19 20.0039 19.8954 20.0039 21C20.0039 22.1046 19.1085 23 18.0039 23Z' fill='black'/%3E%3C/svg%3E%0A");
}
.count-box {
  min-width: 91px;
  max-width: 100%;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding-inline: 15px;
}
.count-box.large {
  min-width: 124px;
  height: 48px;
}

.plus-btn {
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.33398 8.21362V4.21362H8.66732V8.21362H12.6673V9.54696H8.66732V13.547H7.33398V9.54696H3.33398V8.21362H7.33398Z' fill='black'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.count-box > button {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.count-box.large > button {
  width: 24px;
  height: 24px;
}
.count-box > button:disabled {
  pointer-events: none;
  opacity: 0.25;
}
.count-box .count-minus {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.33398 8.21362V9.54696H12.6673V8.21362H3.33398Z' fill='black'/%3E%3C/svg%3E%0A");
}
.count-box .count-plus {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.33398 8.21362V4.21362H8.66732V8.21362H12.6673V9.54696H8.66732V13.547H7.33398V9.54696H3.33398V8.21362H7.33398Z' fill='black'/%3E%3C/svg%3E%0A");
}
.count-box .count {
  color: #222;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  flex: 1 1 auto;
}
.count-box.large .count {
  font-size: 18px;
}

.add-btn__wrap {
  padding-block: 38px;
}
.add-btn {
  width: 24px;
  height: 24px;
}
.add-btn,
.management-add__btn {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 5V19' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5 12H19' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.sticky-bottom.static {
  position: static;
}
.sticky-bottom.md {
  padding-block: 20px;
}
.sticky-bottom.border-black {
  border-color: black;
}
/* 두 개 버튼 나란히 (grid-3 제외: 장바구니+담기는 grid-3 사용) */
.sticky-bottom .btns:not(.grid-3) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.sticky-bottom .btns:not(.grid-3) .btn {
  width: 100%;
}
.sticky-bottom .btns {
  width: 100%;
}
.video-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.video-wrap .video-iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.prepare-content + .prepare-content {
  margin-top: 62px;
}
.prepare-content .prepare-title {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}
.prepare-content .prepare-sub {
  color: #222;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 8px;
}
:is(.prepare-title, .prepare-sub) + .prepare-list {
  margin-top: 20px;
}
.prepare-list {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}
:is(.prepare-list, .store-list) > li .img-box {
  width: 82px;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
:is(.prepare-list, .store-list) > li .img-box > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.prepare-list > li > p {
  color: #686868;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
  margin-top: 8px;
}

.bottom-txt {
  color: #666;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 6px;
  word-break: break-word;
}

.purifier-list > li .purifier-info > p.sm {
  font-size: 16px;
  font-weight: 500;
}
.types-list > li + li {
  margin-top: 30px;
}
.types-list > li .purifier-info__list {
  margin-top: 3px;
}
.types-list > li .purifier-info__list > li {
  font-size: 16px;
}

.grid-radio.txt-radio > li > label {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding: 7px 11px;
  text-align: left;
  background-color: white;
  color: black;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  display: block;
}
.grid-radio.txt-radio > li > input:checked + label {
  background-color: white;
  border-color: black;
  color: black;
  font-weight: 500;
}
.grid-radio.txt-radio > li + li {
  margin-top: 16px;
}
.grid-radio.txt-radio > li > label > span {
  display: block;
}

.img-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
}
.img-modal:not(.active) {
  display: none !important;
}
.img-modal .img-modal__container {
  position: relative;
  padding-inline: 40px;
  width: 100%;
  height: 100%;
  display: flex;
  overflow-y: auto;
  flex-direction: column;
  justify-content: center;
  z-index: 1;
}
.img-modal__content {
  width: 100%;
  position: relative;
  max-height: calc(100% - 80px);
}
.img-modal__content img {
  max-width: 100%;
}
.img-modal .close-btn {
  position: absolute;
  top: -30px;
  right: 0;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg width='15' height='14' viewBox='0 0 15 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3984 1L1.39844 13' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M1.39844 1L13.3984 13' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-repeat: no-repeat;
}
.dimmer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.purifier-list > li .purifier-info > p > small {
  font-size: 14px;
  font-weight: 400;
}

.toggle-btn__wrap .toggle-btn {
  flex: 0 0 auto;
}
.toggle-btn__wrap > .label {
  gap: 40px;
}
.toggle-btn__wrap .toggle-btn__txt > p {
  color: #222;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}
.toggle-btn__wrap .toggle-btn__txt > span {
  color: #646668;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

.purifier-list.self-management > li {
  padding-top: 24px;
}
.purifier-list.self-management > li + li {
  margin-top: 38px;
}

.accordion-wrap {
}
.accordion-wrap .accordion + .accordion {
  margin-top: 8px;
}
.accordion-trigger {
  position: relative;
  width: 100%;
  height: 56px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  padding-inline: 18px 42px;
  text-align: left;
  font-size: 16px;
  font-weight: 700;
}
.accordion-trigger::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  margin-top: -12px;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 5V19' stroke='%238D8D8D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19 12L12 19L5 12' stroke='%238D8D8D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.accordion.active .accordion-trigger::after {
  transform: rotate(180deg);
}
.accordion:not(.active) .accordion-content {
  display: none;
}
.store-list > li,
.store-list > li > .list-link {
  display: flex;
  align-items: flex-start;
  gap: 38px;
  padding-block: 26px 14px;
  width: 100%;
}
.store-list > li:has(.list-link) {
  padding-block: 0;
}
.store-list > li .img-box {
  width: 100px;
}
.store-list > li .img-box > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.store-list.sm > li .img-box > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.store-list > li + li {
  border-top: 1px solid #dddddd;
}

.store-list.sm > li {
  gap: 12px;
}
.store-list.sm > li .img-box {
  width: 72px;
}

.store-item__left {
  flex: 0 0 100px;
  position: relative;
}
.store-list.sm .store-item__left {
  flex: 0 0 72px;
}
.store-item__left > p {
  text-align: center;
  width: 100%;
  /* margin-top: 8px; */
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translate(-50%, 100%);
  white-space: nowrap;
}
.store-list.sm .store-item__left > p {
  color: #666;
  font-size: 12px;
}
.store-item__right {
  flex: 1 1 auto;
}
.store-list.sm .store-item__right {
  padding-left: 20px;
}
.store-item__name .item-sub {
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  display: flex;
  align-items: center;
  gap: 4px;
}
.store-list.sm .store-item__name .item-sub {
  font-size: 16px;
  font-weight: 600;
}
.store-item__name .item-sub > img {
  width: 54px;
  height: auto;
  flex: 0 0 auto;
  margin-left: auto;
}
.store-item__name .item-name {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 3px;
  display: flex;
}
.store-list.sm .store-item__name .item-name {
  font-size: 13px;
}

.store-item__price {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.store-list.sm .store-item__price {
  margin-top: 20px;
}
.store-item__price .item-price {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
.store-item__price .count-box {
}
.store-item__price .item-qty {
  color: black;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.sticky-bottom.lg .price-info:not(.sm) {
  font-size: 18px;
}
.sticky-bottom .bottom-control,
.tgl-btn {
  width: 100%;
}
.sticky-bottom .bottom-control::before,
.tgl-btn::before {
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  margin: 0 auto;
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.5 15L12.5 9L6.5 15' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.tgl-btn.active::before {
  transform: rotate(0);
}
.sticky-bottom .bottom-control.active::before,
.tgl-btn:not(.active)::before {
  transform: rotate(180deg);
}

.bottom-price__detail > li {
  display: grid;
  grid-template-columns: 6fr 2fr 2fr;
  font-size: 14px;
  font-weight: 400;
  padding-block: 10px;
  border-bottom: 1px solid #d9d9d9;
}
.bottom-price__detail:not(.active) {
  display: none;
}

.tap-bar > .tap-btn.self-management::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Crect x='2' y='2' width='17.2414' height='20' fill='url(%23pattern0_1850_4030)'/%3E%3Cdefs%3E%3Cpattern id='pattern0_1850_4030' patternContentUnits='objectBoundingBox' width='1' height='1'%3E%3Cuse xlink:href='%23image0_1850_4030' transform='matrix(0.0052356 0 0 0.00451345 0 -0.0122766)'/%3E%3C/pattern%3E%3Cimage id='image0_1850_4030' width='191' height='227' preserveAspectRatio='none' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL8AAADjCAYAAADUpsWKAAAACXBIWXMAAAsSAAALEgHS3X78AAAFvElEQVR4nO3dzXXc5hmG4Uc83NsleIWtlAokV2K7A6eDdJCkgkgdOBWY6oBaEiunA7oCZaGJQknDn5nBH+e5rnO44SE43+J+gSEIYF7c3Nx8n+RV/u92GIbrwJm7zKfwf7/7zXEc11nNw96vvYA9rpPcrr2Ir/yx+9qUYRiu1l7D1y7XXsABXq+9gD22uKZN2uAO9ceLtVcAaxE/tcRPLfFTS/zUEj+1xE8t8VNL/NQSP7XETy3xU0v81BI/tcRPLfFTS/zUEj+1xE8t8VNL/NQSP7XETy3xU0v81BI/tcRPLfFTS/zUEj+1xE8t8VNL/NQSP7XETy3xU0v81BI/tcRPLfFTS/zUEj+1xE8t8VNL/NQSP7Uu117AGXuX5O0J279K8vdplsI+4p/PH8MwXB278TiO062EvbztoZb4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWpdrL+CMvRnH8W8nbP/DROvgHuKfz+vdFxvlbQ+1xE8t8VNL/NQSP7XETy3xU0v81BI/tcRPLfFTS/zUEj+1xE+tiyTXST6svRBY0Ick1xfDMNwmeRMDQIcPSd4Mw3B7kSQGgBKfw0/uvOc3AJy5L8JPvvqD1wBwpr4JP9lztscAcGb2hp/cc6rTAHAm7g0/SV58/Pjx3i3Hcfw+yVWSl7MsDebzbhiGnx/6gQf/yeUIwDP1aPjJE/7DawB4Zp4UfvLEyxsMAM/Ek8NPDri2xwCwcQeFnxx4YdudAXh/yHYws4PDTx452/OQcRzfJvnpqI1hOv8chuHXYzY8Ov7EALC6X4ZheHvsxiddz7871Lw75XfAkU4KP5ngZhYDwApODj+Z6E4uA8CCJgk/mfA2RgPAAiYLP5n4Hl4DwIwmDT+Z4QZ2A8DE/swM4Scnnup8iNOgTODPfLok+XqOXz7bo0scATjRrOEnMz+3xwBwpNnDTxZ4aJUB4ECLhJ8s9MS23QD8dYnX4llbLPxkxj949xnH8eck/1rsBXlOFg0/WfhZnbvTVb8s+Zo8C//JwuEnC+/5/8cRgDsefMLCnFZ5SrMjADurhZ+s+IhyA1Bv1fCTlZ/PbwBqrR5+soEPpzAAdTYRfrKB+BMDUGQz4ScbiT8xAAX+nQ2Fn6x0qvMh4zheJXm99jqY3F+WPo//mM3s+ZPPl0EL/zxdjeP4au1F3LWZ+F3/f/a+y8YGYBPxC7/GpgZg9fiFX2czA7Bq/MKvtYkBWC1+4ddbfQBWiX8cx18jfFYegMXP87ucmT0Wv5ElWXjPL3zuscoRYLH4hc8jFh+AReIXPk+06ADMHr/wOdBiAzBr/MLnSN8lebv7EPTZzBa/8DnRy3w6Asw2ALPEL3wmMusATH6ef/de7SqfDl0whVnuAJt0zy98ZjLLEWCy+IXPzCYfgEniFz4LmXQATo5f+CxssgE4KX7hs5JJBuDo+IXPyk4egKPiFz4bcdIAHHyefxzHH5JcR/hsx1H/Bzhoz7+bsN8ifLblqCPAk+Pf/eKr3QvB1hw8AE+KX/g8EwcNwKPxC59n5skD8GD8wueZetIA3Bu/8HnmXib5x0M/sDd+4XMmfto9HG2vb+IXPmfm3gHYt+f/LcLnvOwdgC/i9+EQnLFvBuBz/B4cS4EvBuAiET5VPg/Ai5ubmzdJfl91ObC8H1f/ZBZYi/ipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qSV+aomfWuKnlvipJX5qiZ9a4qeW+KklfmqJn1rip5b4qXWZ5DbJ+7UXAgu7/S9Ccc7G3Tfo+wAAAABJRU5ErkJggg=='/%3E%3C/defs%3E%3C/svg%3E%0A");
}

.tap-bar > .tap-btn.add::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13 1C13 0.447715 12.5523 0 12 0C11.4477 0 11 0.447715 11 1V11H1C0.447715 11 0 11.4477 0 12C0 12.5523 0.447715 13 1 13H11V23C11 23.5523 11.4477 24 12 24C12.5523 24 13 23.5523 13 23V13H23C23.5523 13 24 12.5523 24 12C24 11.4477 23.5523 11 23 11H13V1Z' fill='%23D9D9D9'/%3E%3C/svg%3E%0A");
}
.tap-bar > .tap-btn.add.active::before {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13 1C13 0.447715 12.5523 0 12 0C11.4477 0 11 0.447715 11 1V11H1C0.447715 11 0 11.4477 0 12C0 12.5523 0.447715 13 1 13H11V23C11 23.5523 11.4477 24 12 24C12.5523 24 13 23.5523 13 23V13H23C23.5523 13 24 12.5523 24 12C24 11.4477 23.5523 11 23 11H13V1Z' fill='%2300d3d7'/%3E%3C/svg%3E%0A");
}

.order-detail__img {
  width: 100%;
  max-width: 662px;
  aspect-ratio: 1 / 1;
  position: relative;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.order-detail__img .product-img {
  object-fit: cover;
  object-position: center;
  display: flex;
  max-width: 100%;
}

.order-detail__img .product-logo {
  position: absolute;
  top: 20px;
  right: 22px;
  height: 29px;
  width: auto;
  max-width: 100%;
}

.order-info {
  padding-top: 12px;
  padding-bottom: 8px;
}
.order-info .product-name {
  color: #222;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
}
.order-info .product-price__wrap {
  padding-top: 16px;
  padding-bottom: 16px;
}
.order-info .product-price__wrap {
  display: flex;
  justify-content: space-between;
}
.order-info .product-price__wrap .product-price {
  display: flex;
  flex-direction: column;
}
.order-info .product-price__wrap .product-price .list-price {
  position: relative;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  width: fit-content;
}
.order-info .product-price__wrap .product-price .list-price::before {
  content: "";
  width: calc(100% + 10px);
  height: 1px;
  background-color: #686868;
  position: absolute;
  top: 50%;
  left: -5px;
}
.order-info .product-price__wrap .product-price .actual-price {
  color: #222;
  font-size: 24px;
  font-weight: 700;
}

.detail-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.detail-list .detail-list__item {
  display: flex;
  gap: 18px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
.detail-list .detail-list__item > dt {
  font-weight: 500;
  flex: 0 0 80px;
}
.detail-list .detail-list__item > dd {
  flex: 1 1 auto;
}

.divide {
  border-top: 8px solid #fafafa;
}

.order-tabs {
  padding-top: 4px;
}
.tab-btns.lined-tab {
  display: flex;
  gap: 24px;
}
.tab-btns.lined-tab .tab-btn {
  color: #222;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  padding-bottom: 6px;
  border-bottom: 2px solid transparent;
}
.tab-btns.lined-tab .tab-btn.active {
  color: var(--main-color);
  border-color: var(--main-color);
}
.tab-btns {
  overflow-x: auto;
}
.btn.tab-btn {
  white-space: nowrap;
  flex: 0 0 auto;
}
.tab-btns.sm .tab-btn {
  height: 36px;
}
.layout .tab-btns {
  width: calc(100% + 48px);
  margin-left: -24px;
  padding-inline: 24px;
}

.detail-sect {
  padding-block: 48px;
}
.detail-sect .detail-sect__title {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 32px;
}
.detail-sect img {
  max-width: 100%;
  display: block;
  margin: 0 auto;
}
.detail-sect p {
  margin-top: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
}
.detail-sect p.alert {
  margin-top: 11px;
  position: relative;
  padding-left: 36px;
}
.detail-sect p.alert::before {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  left: 0;
  top: 5px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 8V12' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 16H12.01' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.basic-table {
  border: 1px solid black;
  width: 100%;
  table-layout: fixed;
  text-align: center;
  border-collapse: collapse;
}
.basic-table :is(th, td) {
  border: 1px solid black;
  padding: 7px;
  font-size: 16px;
  font-weight: 400;
}

.order-tabs .tab-content .btn-sect {
}

.btn.font-sm {
  font-size: 14px;
}
.btn.rounded {
  border-radius: 8px;
}
.btn.write-icon::before {
  content: "";
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='16' viewBox='0 0 17 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.66176 12.6646H14.5V13.9979H2.5V11.1695L9.09967 4.56986L11.9281 7.39826L6.66176 12.6646ZM10.0425 3.62705L11.4567 2.21284C11.7171 1.95249 12.1391 1.95249 12.3995 2.21284L14.2851 4.09846C14.5455 4.3588 14.5455 4.78092 14.2851 5.04127L12.8709 6.45548L10.0425 3.62705Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 2px;
}

.detail-inquiry-list > li + li {
  border-top: 4px solid #fafafa;
}

.mark.lg {
  height: 28px;
}
.mark.before-mark {
  color: #686868;
  background-color: #eeeeee;
  font-weight: 500;
}
.mark.after-mark {
  color: #fafafa;
  background-color: #8bb551;
  font-weight: 500;
}

.detail-inquiry-list > li {
  padding-block: 30px 26px;
}
.detail-inquiry-top {
  display: flex;
  gap: 13px;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
}
.detail-inquiry-top .inq-name {
  color: #222;
}
.detail-inquiry-top .inq-date {
  color: #686868;
}

.detail-inquiry-list .inq-title {
  margin-top: 8px;
  color: #222;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.32;
}
.detail-inquiry-list .inq-desc {
  color: #0c1a30;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  margin-top: 16px;
}

.star-total__wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}
.star-total__wrap .star-score {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
}
.star-range {
  display: flex;
  align-items: center;
}
.star-range > span {
  width: 12px;
  height: 24px;
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='25' viewBox='0 0 26 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6183 0.5L16.5174 8.39905L25.2366 9.6735L18.9274 15.8186L20.4164 24.5L12.6183 20.3991L4.82019 24.5L6.30915 15.8186L0 9.6735L8.71924 8.39905L12.6183 0.5Z' fill='%23D9D9D9'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: left;
}
.star-range > span.active {
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='25' viewBox='0 0 26 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6183 0.5L16.5174 8.39905L25.2366 9.6735L18.9274 15.8186L20.4164 24.5L12.6183 20.3991L4.82019 24.5L6.30915 15.8186L0 9.6735L8.71924 8.39905L12.6183 0.5Z' fill='%23FFC120'/%3E%3C/svg%3E%0A");
}
.star-range > span:nth-child(even) {
  background-position: right;
  margin-right: 4px;
}
.star-range > span:last-child {
  margin-right: 0;
}

.order-tabs .tab-content .btn-sect .star-total__wrap {
  margin-bottom: 32px;
}

.detail-review-list > li {
  padding-block: 17px 24px;
}
.detail-review-top {
  display: flex;
  color: #222;
  font-size: 14px;
  line-height: 1.4;
}
.detail-review-top .review-score {
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 4px;
}
.detail-review-top .review-score::before {
  content: "";
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='25' viewBox='0 0 26 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6183 0.5L16.5174 8.39905L25.2366 9.6735L18.9274 15.8186L20.4164 24.5L12.6183 20.3991L4.82019 24.5L6.30915 15.8186L0 9.6735L8.71924 8.39905L12.6183 0.5Z' fill='%23FFC120'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.detail-review-top .review-auth {
  font-weight: 500;
}
.detail-review-top .review-date {
  margin-left: auto;
  color: #686868;
}

.detail-review-list > li .review-desc {
  white-space: pre-line;
  color: #222;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  margin-top: 16px;
}
.detail-review-list > li .review-imgs {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
.detail-review-list > li .review-imgs .img-box {
  width: 100px;
  height: 100px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  border: 1px solid #d9d9d9;
}
.detail-review-list > li .review-imgs .img-box > img {
  display: flex;
  object-fit: cover;
  object-position: center;
  max-width: 100%;
}

.top-divide {
  color: #d9d9d9;
  font-size: 14px;
  font-weight: 400;
}

.btn.lined.orange {
  color: #ff611e;
  border-color: #ff611e;
}

@property --val {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

.star-rating {
  --s: 50px; /* control the size*/

  --min: attr(min type(<number>), 1);
  --max: attr(max type(<number>), 100);
  height: var(--s);
  aspect-ratio: var(--max);
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M50 5 L79 95 L2 40 L98 40 L21 95 Z'/></svg>")
    0 / var(--s) var(--s);
  background: linear-gradient(
    90deg,
    hsl(calc(30 + 4 * var(--val)) 100% 56%) calc(var(--val) * 100% / var(--max)),
    #7b7b7b 0
  );
  appearance: none;
  cursor: pointer;
  /**/
  timeline-scope: --val;
  animation: --val linear both;
  animation-timeline: --val;
  animation-range: entry 100% exit 0%;
  overflow: hidden;
}
.star-rating:disabled {
  pointer-events: none;
}
.star-rating.sm {
  --s: 24px;
  mask: url("data:image/svg+xml,%3Csvg width='26' height='25' viewBox='0 0 26 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6183 0.5L16.5174 8.39905L25.2366 9.6735L18.9274 15.8186L20.4164 24.5L12.6183 20.3991L4.82019 24.5L6.30915 15.8186L0 9.6735L8.71924 8.39905L12.6183 0.5Z' fill='%23FFC120'/%3E%3C/svg%3E%0A")
    0 / var(--s) var(--s);
}
@keyframes --val {
  0% {
    --val: var(--max);
  }
  to {
    --val: var(--min);
  }
}
.star-rating::-webkit-slider-thumb {
  opacity: 0;
  view-timeline: --val inline;
}
.star-rating::-moz-range-thumb {
  opacity: 0;
  view-timeline: --val inline;
}
.star-rating:focus-visible {
  outline: 2px solid #000;
  outline-offset: -2px;
  /* --_m:,conic-gradient(from 90deg at 2px 2px,#0000 25%,#000 0) 0 0/calc(100% - 2px) calc(100% - 2px); */
}

.cart-top {
  padding-block: 16px 24px;
  border-bottom: 8px solid #fafafa;
}
.plain-btn {
  color: #222;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
}

.store-list.cart-list > li {
  gap: 11px;
  padding-block: 26px 14px;
  border-bottom: 1px solid #ddd;
  border-top: 0 !important;
}

.form-title {
  color: #222;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  display: flex;
  align-items: center;
}
.form-title .order-date {
  margin-left: auto;
  color: #222;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  gap: 12px;
}

.input-item .input-wrap .input > label.bold,
.label.bold {
  font-size: 16px;
  font-weight: 600;
}

.order-form {
  position: relative;
}
.order-form > .checkbox-wrap {
  position: absolute;
  top: 12px;
  right: 0;
  z-index: 1;
}

.order-form__payment {
  margin-top: 32px;
  padding-top: 30px;
  border-top: 1px solid #eee;
}

.grid-radio.type-2 > li > label {
  min-height: 36px;
  background-color: white;
  border: 1px solid #d9d9d9;
  color: #222;
  font-size: 14px;
  font-weight: 500;
}
.grid-radio.type-2 > li > input:checked + label {
  border-color: var(--main-color);
  font-weight: 500;
}

.select.bold {
  font-weight: 16px;
  font-weight: 700;
}

.order-form__bottom .order-price__title {
  color: #222;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 20px;
}
.order-price__info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.order-price__info > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}
.order-price__info > li.total-price {
  border-top: 1px solid #eee;
  padding-top: 12px;
  color: #222;
  font-size: 18px;
  font-weight: 700;
}

.complete-txt {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  background-color: #fafafa;
  padding: 24px;
  text-align: center;
}

.btn.cart {
  border: 1px solid var(--main-color);
  background-color: white;
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2693_7396)'%3E%3Cpath d='M9.5 22C10.0523 22 10.5 21.5523 10.5 21C10.5 20.4477 10.0523 20 9.5 20C8.94772 20 8.5 20.4477 8.5 21C8.5 21.5523 8.94772 22 9.5 22Z' stroke='%2300D3D7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M20.5 22C21.0523 22 21.5 21.5523 21.5 21C21.5 20.4477 21.0523 20 20.5 20C19.9477 20 19.5 20.4477 19.5 21C19.5 21.5523 19.9477 22 20.5 22Z' stroke='%2300D3D7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M1.5 1H5.5L8.18 14.39C8.27144 14.8504 8.52191 15.264 8.88755 15.5583C9.25318 15.8526 9.7107 16.009 10.18 16H19.9C20.3693 16.009 20.8268 15.8526 21.1925 15.5583C21.5581 15.264 21.8086 14.8504 21.9 14.39L23.5 6H6.5' stroke='%2300D3D7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2693_7396'%3E%3Crect width='24' height='24' fill='white' transform='translate(0.5)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-position: center;
}
/* 하단 sticky 버튼(장바구니·담기): 터치 영역 확대 */
.sticky-bottom .btns .btn {
  min-height: 56px;
}
.sticky-bottom .btns .btn.cart {
  min-width: 56px;
  background-size: 24px 24px;
}
/* 장바구니 약 28%, 담기 약 72% 비율 */
.sticky-bottom .btns:has(.btn.cart) {
  grid-template-columns: 1fr 2.6fr;
}
.sticky-bottom .btns:has(.btn.cart) .btn:not(.cart) {
  min-width: 0;
}
.sticky-bottom .btns:has(.btn.cart) .btn.cart {
  min-width: 0;
  max-width: none;
}

/* 장바구니(1칸) + 담기(2칸) 나란히, 좌우 거의 꽉 채우도록 */
.btns.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.btns .btn.span-2 {
  grid-column: span 2;
}

.card-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.card-list > li {
  width: 100%;
  height: 56px;
  border-radius: 6px;
  background-color: #f8f8fa;
  display: flex;
  align-items: center;
  gap: 15px;
  padding-inline: 15px 40px;
  position: relative;

  color: #474a56;
  font-size: 16px;
  font-weight: 500;
}
.delete-btn {
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.25 3H5.25C4.14543 3 3.25 3.89543 3.25 5V19C3.25 20.1046 4.14543 21 5.25 21H19.25C20.3546 21 21.25 20.1046 21.25 19V5C21.25 3.89543 20.3546 3 19.25 3Z' stroke='%23D5D5D5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.25 9L15.25 15' stroke='%23D5D5D5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M15.25 9L9.25 15' stroke='%23D5D5D5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.card-list > li .delete-btn {
  position: absolute;
  top: 50%;
  right: 13px;
  margin-top: -12px;
}
.card-add__form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.input-item .input-wrap .input .info-btn {
  width: 20px;
  height: 20px;
  position: absolute;
  right: 2px;
  bottom: 5px;
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='20' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.25 20C4.72715 20 0.25 15.5228 0.25 10C0.25 4.47715 4.72715 0 10.25 0C15.7728 0 20.25 4.47715 20.25 10C20.25 15.5228 15.7728 20 10.25 20ZM10.25 18C14.6683 18 18.25 14.4183 18.25 10C18.25 5.58172 14.6683 2 10.25 2C5.83172 2 2.25 5.58172 2.25 10C2.25 14.4183 5.83172 18 10.25 18ZM9.25 13H11.25V15H9.25V13ZM11.25 11.3551V12H9.25V10.5C9.25 9.9477 9.6977 9.5 10.25 9.5C11.0784 9.5 11.75 8.8284 11.75 8C11.75 7.17157 11.0784 6.5 10.25 6.5C9.5223 6.5 8.9156 7.01823 8.7788 7.70577L6.81731 7.31346C7.13637 5.70919 8.552 4.5 10.25 4.5C12.183 4.5 13.75 6.067 13.75 8C13.75 9.5855 12.6957 10.9248 11.25 11.3551Z' fill='%23222222'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
}

.checkbox-wrap > label {
  min-height: 24px;
  display: flex;
  align-items: center;
}
.checkbox-wrap > label.sm {
  font-size: 16px;
  font-weight: 500;
}
.checkbox-wrap > label.xs {
  font-size: 14px;
  font-weight: 400;
}

.full {
  width: 100%;
  max-width: 100%;
}
.cvc-info {
  color: #222;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  margin-top: 24px;
}

.grid-radio.simple-payment__radio > li > label {
  background-color: white;
  border: 2px solid #ddd;
  display: flex;
  flex-direction: column;
  font-size: 12px;
  padding-bottom: 12px;
}
.grid-radio.simple-payment__radio > li > input:checked + label {
  background-color: white;
  border-color: var(--main-color);
  color: #222;
}
.grid-radio.simple-payment__radio .payment-logo {
  width: 100%;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.grid-radio.simple-payment__radio > li .payment-logo img {
  max-width: 100%;
  width: 45px;
}

.delivery-info__list > li {
  border-bottom: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-left: 20px;
}
.delivery-info__list > li + li {
  margin-top: 12px;
}
.delivery-info__list > li .info-top {
  display: flex;
  align-items: center;
}
.delivery-info__list > li .info-top .default-location {
  color: var(--main-color);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.delivery-info__list > li .info-top .delete-btn {
  margin-left: auto;
}
.delivery-info__list > li .info-list,
.delivery-info__list > li:not(:has(.info-list)) {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 26px;
}
.delivery-info__list > li dl {
  display: flex;
  gap: 4px;
  font-size: 14px;
  line-height: 1.5;
}
.delivery-info__list > li dl > dt {
  width: 80px;
  flex: 0 0 auto;
  color: #222;
  font-weight: 600;
}
.delivery-info__list > li dl > dd {
  color: #686868;
  font-weight: 400;
  flex: 1 1 auto;
}

.order-details__item {
  border-bottom: 1px solid #ddd;
  padding-block: 36px 13px;
}
.order-details__item .order-details__bottom {
  display: flex;
  justify-content: space-between;
  margin-top: 28px;
}
.order-details__item .order-details__bottom > button {
  color: #222;
  font-size: 14px;
  font-weight: 600;
}

.payment-info .payment-info__item {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.payment-info .payment-info__item > li {
  display: flex;
  justify-content: space-between;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}

.management-item {
  padding: 16px 16px 32px 16px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
}
.management-item__hd {
  display: flex;
  margin-bottom: 8px;
}
.management-item__hd .delete-btn {
  margin-left: auto;
}
.management-item .complete-date {
  color: black;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.management-item__dl {
  display: flex;
  color: black;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  padding-block: 8px;
  border-bottom: 1px solid #d9d9d9;
}
.management-item__info .management-item__dl:first-child {
  border-top: 1px solid #d9d9d9;
}
.management-item__dl > dt {
  width: 75px;
  flex: 0 0 auto;
  color: #7a7a7a;
}
.management-item__dl > dd {
  flex: 1 1 auto;
}

.management-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.management-add__btn {
  color: black;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  padding-block: 3px;
  border-bottom: 1px solid #d9d9d9;
  background-position: right center;
  background-size: 24px;
  text-align: left;
  width: calc(100% - 32px);
  margin-inline: auto;
  margin-block: 67px 24px;
}

.management-item .management-title {
  color: #222;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  padding-bottom: 3px;
  border-bottom: 1px solid #d9d9d9;
}

.management-form {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
}
.management-form .select,
.management-form .input-item .input-wrap .input > input {
  height: 45px;
  padding-left: 0;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
}
.management-form .select {
  border: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.management-form .input-item .input-wrap {
  padding-bottom: 0;
  border-color: #d9d9d9;
}
.management-form .input-item .input-wrap .input:focus-within > input,
.management-form .select,
.management-form .input-item .input-wrap:has(.input:focus-within) {
  border-color: #d9d9d9 !important;
}

.form-btns {
  display: flex;
  gap: 14px;
}
.form-btns .btn {
  flex: 1;
  height: 36px;
  font-size: 14px;
  font-weight: 500;
}
.management-forms {
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.management-forms .management-item {
  padding-bottom: 16px;
}
.management-form .calendar-btn {
  width: 100%;
  height: 45px;
  text-align: left;
  border-bottom: 1px solid #d9d9d9;
  display: flex;
  align-items: center;
}
.calendar-btn > input {
  width: 100%;
  border: 0;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  padding: 0;
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-position: right 15px center;
}
.period-setting__list .calendar-btn > input {
  background-image: none;
  padding: 0;
}

.period-setting__wrap {
  padding-block: 32px;
  color: #686868;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}
.period-setting__wrap .period-toggle {
  width: 100%;
  text-align: left;
  background-position: right 12px center;
}
.period-setting__list {
  padding-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.period-setting__list > li {
  display: flex;
  align-items: flex-start;
}
.period-setting__list > li > span {
  text-align: center;
}
.period-setting__list > li > span:first-child {
  width: calc(100% - 140px);
  text-align: left;
}

.period-setting__list > li > div,
.period-setting__list > li > span:not(:first-child) {
  width: 70px;
}
.period-setting__list > li > div {
  display: flex;
  justify-content: center;
}
.period-setting__list .calendar-btn {
  background-image: none;
  padding: 0;
  border-bottom: 1px solid black;
  height: auto;
  width: fit-content;
  text-align: center;
}
.period-setting__list .calendar-btn > input {
  color: black;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}
.period-setting__list .comlete-month {
  color: #686868;
  font-size: 13px;
  font-weight: 700;
  border-bottom: 1px solid #686868;
  width: fit-content;
}

.calendar-wrap .calendar-hd {
  display: flex;
  padding: 16px 8px;
  justify-content: space-between;
  text-align: center;
  position: relative;
  border-bottom: 1px solid #eeeeee;
}
.calendar-wrap .calendar-hd > p {
  color: #222;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
.calendar-wrap .calendar-hd > button {
  width: 24px;
  height: 24px;
  background-size: cover;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23222222' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.calendar-wrap .calendar-hd > button.cal-prev {
  transform: rotate(180deg);
}

.popup .btns {
  display: flex;
  gap: 8px;
}
.popup .btns .btn {
  flex: 1;
}

.calendar-table {
  width: 100%;
  text-align: center;
  margin-block: 8px 12px;
  border-spacing: 4px;
}
.calendar-table thead tr th {
  padding-block: 8px;
  color: #222;
  font-size: 12px;
  font-weight: 500;
}
.calendar-table tbody tr td {
}
.calendar-table tbody tr td > button {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}
.calendar-table tbody tr td > button.active {
  background-color: var(--main-color);
  color: white;
}

.header .hd-btns {
  display: flex;
  gap: 9px;
}

.input-item .textarea-wrap > textarea {
  line-height: 1.5;
  font-size: 16px;
  font-weight: 500;
}
.input-item.lined.rounded.md .input-wrap .input > input {
  font-size: 16px;
}

.inquiry-write .content > p {
  line-height: 1.4;
}

.popup .popup-alert {
  color: black;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.purifier-list .dot-menu__wrap {
  position: absolute;
  top: 24px;
  right: 2px;
}

.dot-menu__wrap > button {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.dot-menu {
  position: absolute;
  top: 100%;
  right: 0;
  white-space: nowrap;
  padding: 16px 20px;
  border-radius: 8px;
  background-color: white;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
  z-index: 1;
}
.dot-menu > li > a {
  display: block;
  padding: 4px;
  font-size: 16px;
  font-weight: 500;
}
.dot-menu__wrap:not(.active) .dot-menu {
  display: none !important;
}

.ui-datepicker:not(:empty) {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 999 !important;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  padding-top: 30px;
}
.ui-datepicker-header {
  background-color: white;
  width: 100%;
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 32px 24px 0 24px;
  border-radius: 10px 10px 0 0;
}
.ui-datepicker-header::before {
  content: "날짜를 선택해주세요";
  width: 100%;
  display: block;
  color: #222;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 24px;
}

:is(.ui-datepicker-prev, .ui-datepicker-next) {
  width: 24px;
  height: 24px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23222222' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.ui-state-disabled {
  opacity: 0.25;
}
.ui-datepicker-prev {
  transform: rotate(180deg);
  margin-left: 8px;
}
.ui-datepicker-next {
  order: 1;
  margin-right: 8px;
}
:is(.ui-datepicker-prev, .ui-datepicker-next) > span {
  display: none;
}
.ui-datepicker-title {
  color: #222;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  padding-block: 16px;
}

.ui-datepicker-calendar {
  background-color: white;
  border-top: 1px solid #eee;
  padding: 8px 12px;
}
.ui-datepicker-calendar thead th {
  color: #222;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  padding-block: 8px;
}
.ui-datepicker-calendar thead {
  padding-bottom: 4px;
}
.ui-datepicker-calendar tbody td {
  text-align: center;
}
.ui-datepicker-calendar tbody td > * {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #222;
  font-size: 18px;
  font-weight: 500;
}
.ui-datepicker-calendar tbody td > span {
  color: #b9b9b9;
}
.ui-datepicker-buttonpane {
  padding: 8px 24px 36px 24px;
  background-color: white;
  display: flex;
  gap: 8px;
}
.ui-datepicker-buttonpane > button[data-handler="today"] {
  display: none;
}
.ui-datepicker-buttonpane > button {
  flex: 1;
  background-color: #eee;
  height: 56px;
  border-radius: 8px;
  color: #686868;
  font-size: 16px;
  font-weight: 700;
}

.reply-list {
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.5;
}
.reply-list .detail-inquiry-top {
  margin-bottom: 12px;
}
.reply-list > li {
  border-top: 1px solid #eee;
  padding-block: 20px;
  padding-left: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 16 16' id='reply'%3E%3Cg transform='rotate(180 8 8)'%3E%3Cpath fill='%23212121' d='M3.707,7.99946609 L6.3890873,10.6819805 C6.58434944,10.8772427 6.58434944,11.1938252 6.3890873,11.3890873 C6.21552094,11.5626536 5.94609654,11.5819388 5.7512284,11.4469427 L5.68198052,11.3890873 L2.11603371,7.82029139 L2.11603371,7.82029139 L2.06639375,7.74915207 L2.06639375,7.74915207 L2.03875135,7.69334249 L2.03875135,7.69334249 L2.0159743,7.62570887 L2.0159743,7.62570887 L2.01108568,7.60498705 C2.00382515,7.57130067 2,7.53609704 2,7.5 L2.00546187,7.57391777 L2.00179699,7.5424826 L2.00179699,7.5424826 L2.00179763,7.45747863 L2.00179763,7.45747863 L2.01678848,7.37116919 L2.01678848,7.37116919 L2.03779224,7.30896344 L2.03779224,7.30896344 L2.07718801,7.23298968 L2.07718801,7.23298968 L2.13168953,7.16184291 L2.13168953,7.16184291 L5.68198052,3.6109127 C5.87724266,3.41565056 6.19382515,3.41565056 6.3890873,3.6109127 C6.56265365,3.78447906 6.5819388,4.05390346 6.44694275,4.2487716 L6.3890873,4.31801948 L3.707,6.99946609 L8,7 C11.5217665,7 13.8853902,8.97580254 13.9959473,11.7924218 L14,12 C14,12.2761424 13.7761424,12.5 13.5,12.5 C13.2238576,12.5 13,12.2761424 13,12 C13,9.72683267 11.1925298,8.09541085 8.26151713,8.00404239 L8,8 L3.707,7.99946609 L6.3890873,10.6819805 L3.707,7.99946609 Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
  background-size: 18px;
  background-position: left 20px;
}

/* 2025.07.20 */
.hd-btn.cart-btn,
.btn.cart {
  position: relative;
}
.cart-count {
  position: absolute;
  top: -6px;
  right: -8px;
  color: white;
  font-size: 0.65rem;
  font-weight: 700;
  border-radius: 50%;
  background-color: var(--main-color);
  width: 1.125rem;
  height: 1.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.btn.cart .cart-count {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 0.85rem;
}
.tab-btns::-webkit-scrollbar {
  display: none;
}
.grid-radio.txt-radio > li > input:checked + label {
  border-color: var(--main-color);
}

.period-setting__list {
  padding-top: 12px;
  border-top: 1px solid #d9d9d9;
}
.period-setting__wrap .period-toggle {
  padding-bottom: 12px;
}

.tap-bar > .tap-btn.self-management.active::before {
  filter: brightness(0) saturate(100%) invert(82%) sepia(37%) saturate(2500%)
    hue-rotate(146deg) brightness(95%) contrast(85%);
}

.input-item .textarea-wrap.single-line {
  padding-block: 8px;
  border-bottom: 1px solid #d9d9d9;
}
.input-item .textarea-wrap.single-line textarea {
  border: 0;
  border-radius: 0;
  padding: 0;
  font-size: 14px;

  height: 1.5em;
  min-height: 1.5em;
  max-height: calc(1.5em * 3);
  resize: none;
  line-height: 1.5em;
}

.dl-wrap > dl {
  flex: 1 1 auto;
}
.dl-wrap > dl > dt {
  color: #7a7a7a;
  margin-bottom: 12px;
}
.dl-wrap > dl > dd {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dl-wrap > dl.dl-recent {
  width: 70px;
  flex: 0 0 auto;
}