@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap");

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");

@import url("https://fonts.googleapis.com/css2?family=Poller+One&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Noto+Sans+KR:wght@100..900&family=Noto+Serif+TC:wght@200..900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding:wght@400;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap");

@import url("./icon.css");
@import url("./reset.css");
@import url("./common/style.css");
@import url("./login/style.css");
@import url("./header/style.css");
@import url("./footer/style.css");

.wrapper {
  padding: 0 calc(50svw - 609px);
  box-sizing: border-box;
  font-family: "Noto Sans KR" !important;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.wrapper.short {
  padding: 0 calc(50svw - 609px);
  box-sizing: border-box;
  font-family: "Noto Sans KR" !important;
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.wrapper .slider {
  border-radius: 12px;
  box-sizing: border-box;
  background-image: url("../../../imgs/item/slider.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 24px;
  height: 24px;
  display: flex;
  height: fit-content;
  width: 100%;
}
.wrapper .slider img {
  width: 100%;
  aspect-ratio: 16/5;
  object-fit: cover;
}
.wrapper .slider.white {
  filter: brightness(0) saturate(100%) invert(100%) sepia(99%) saturate(0%) hue-rotate(51deg) brightness(105%) contrast(100%) !important;
}
.wrapper .slider.green {
  filter: brightness(0) saturate(100%) invert(53%) sepia(49%) saturate(421%) hue-rotate(54deg) brightness(99%) contrast(90%);
}
.wrapper .slider.black {
  filter: brightness(0) saturate(100%) invert(8%) sepia(16%) saturate(935%) hue-rotate(125deg) brightness(90%) contrast(88%);
}
.wrapper .slider.gray {
  filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(511%) hue-rotate(135deg) brightness(82%) contrast(83%);
}
.wrapper .promotion-img {
  border-radius: 8px;
  box-sizing: border-box;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 24px;
  height: 24px;
  display: flex;
  width: 100%;
  height: 100px;
}
.wrapper .promotion-img.white {
  filter: brightness(0) saturate(100%) invert(100%) sepia(99%) saturate(0%) hue-rotate(51deg) brightness(105%) contrast(100%) !important;
}
.wrapper .promotion-img.green {
  filter: brightness(0) saturate(100%) invert(53%) sepia(49%) saturate(421%) hue-rotate(54deg) brightness(99%) contrast(90%);
}
.wrapper .promotion-img.black {
  filter: brightness(0) saturate(100%) invert(8%) sepia(16%) saturate(935%) hue-rotate(125deg) brightness(90%) contrast(88%);
}
.wrapper .promotion-img.gray {
  filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(511%) hue-rotate(135deg) brightness(82%) contrast(83%);
}
.wrapper .container {
  display: flex;
  gap: 14px;
}
.wrapper .container .content-section {
  border-radius: 8px;
  border: 1px solid #dcdee9;
  padding:16px 18px;
  flex: 1;
  gap: 12px;
  display: flex;
  flex-direction: column;
}
.wrapper .container .content-section.notice {
  flex: 0.8;
}
.wrapper .container .content-section h2 {
  color: #272836;
  font-size: 20px;
  font-weight: 600;
  align-items: center;
  line-height: 100%;
  display: flex;
  justify-content: space-between;
}
.wrapper .container .content-section h2 a {
  border-radius: 2px;
  border: 1px solid #edf1ff;
  background: #f3f6ff;
  color: #3f4cc4;
  font-size: 14px;
  font-weight: 500;
  padding: 6px 10px;
  line-height: 100%;
}
.wrapper .container .content-section h2 a.opacity-zero {
  opacity: 0;
  pointer-events: none;
}
.wrapper .container .content-section .content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wrapper .container .content-section .content-wrapper h3 {
  color: #272836;
    font-size: 16px;
    font-weight: 400;
}
.wrapper .container .content-section .content-wrapper .item-list {
  display: flex;
  gap: 12px;
}
.wrapper .container .content-section .content-wrapper .item-list.is-item {
  padding: 18px 16px;
  border-radius: 6px;
  border: 1px solid #f1f2f7;
  background: #f8faff;
}
.wrapper .container .content-section .content-wrapper .item-list.is-item > div {
  color: #6a6b8a;
  font-size: 14px;
  font-weight: 400;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
  justify-content: center;
  flex: 1;
}
.wrapper .container .content-section .content-wrapper .item-list.is-item > div span {
  display: block;
  height: 18px;
}
.wrapper .container .content-section .content-wrapper .item-list.is-item > div b {
  color: #272836;
  font-size: 18px;
  font-weight: 700;
}
.wrapper .container .content-section .content-wrapper .item-list .item {
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
  justify-content: center;
  flex: 1;
  border-radius: 6px;
  border: 1px solid #f1f2f7;
  background: #f8faff;
  color: #373a44;
  font-size: 14px;
  font-weight: 500;
}
.wrapper .container .content-section .content-wrapper .item-list .item > div {
  width: 22px;
  filter: brightness(0) saturate(100%) invert(20%) sepia(14%) saturate(558%) hue-rotate(189deg) brightness(96%) contrast(90%);
  height: 22px;
}
.wrapper .container .content-section .notice-list li {
  padding: 8px 0;
}
.wrapper .container .content-section .notice-list li a {
  color: #2c2c2e;
  font-size: 16px;
  font-weight: 400;
}
.main-title-wrapper {
  display: flex;
  gap: 12px;
  align-items: center;
}
.main-title-wrapper > div.icon-wrapper {
  width: 64px;
  height: 64px;
}
.main-title-wrapper .title-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.main-title-wrapper .title-item-wrapper h2 {
  color: #000;
  font-size: 24px;
  font-weight: 700;
}
.main-title-wrapper .title-item-wrapper h4 {
  color: #505360;
  font-size: 16px;
  font-weight: 400;
}
.section > .title-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.section > .title-wrapper h2 {
  color: #000;
  font-size: 18px;
  font-weight: 700;
}
.section > .title-wrapper + .item-list.all{
  margin-top : -12px;
}
.section {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.section .item-list {
  display: flex;
  gap: 16px;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: stretch;
}
.section .item-list.all {
  flex-wrap: nowrap;
  align-items: stretch;
  gap : 12px;
}
.section .item-list.all .promotion-item-wrapper {
  border-radius: 4px;
  aspect-ratio: 1/1;
}
.section .item-list.all .promotion-item-wrapper img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 4px;
}
.section .item-list.all .row-card-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex  :1;
  overflow: hidden;
  align-items: center;
}
.section .item-list.all .row-card-wrapper .card.row {
  min-width: calc(33% - 5px);
  max-width: calc(50% - 5px);
  gap : 8px;
}
.section .item-list.all .row-card-wrapper .card.row .image-wrapper{
  min-width: 124px;
  width: 25%;
}
.section .item-list.all .row-card-wrapper .card.row .image-wrapper img{
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.card {
  font-family: Pretendard !important;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: calc(20% - 12.8px);
  min-width: calc(20% - 12.8px);
  
}
.card .image-wrapper {
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
  border : 1px solid #eee;
  aspect-ratio: 1;
  position: relative;
}
.card .image-wrapper:hover .icon {
  opacity: 1;
}
.card .image-wrapper .icon {
  width: fit-content;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.25);
  position: absolute;
  right: 12px;
  padding: 4px;
  bottom: 12px;
  opacity: 0;
  transition: opacity 0.3s;
  border: none;
}
.card .image-wrapper.small img {
  border: 2px solid transparent;
}
.card .image-wrapper.small img.active {
  border: 2px solid #6d7fda;
  box-sizing: border-box;
  border-radius: 4px;
}
.card .image-wrapper .icon div {
  width: 32px;
  height: 32px;
}
.card .image-wrapper img {
  display: block;
  aspect-ratio: 1/1;
  border-radius: 4px;
  outline: none;

  background-image: url("../img/temp.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 56px 56px;
}
.card .info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex : 1;
}
.card .info h3 {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 135%;
}
.card .info .price-wrapper {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top : auto;
}
.card .info .price-wrapper .old-price {
  display: flex;
  gap: 8px;
  align-items: center;
}
.card .info .price-wrapper .old-price .rate {
  width: fit-content;
  border-radius: 4px;
  background: #FFF7F7;
  color: #DF0004;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 8px;
}
.card .info .price-wrapper .old-price .rate.red {
  background: #ffedf0;
  color: #DF0004;
}
.card .info .price-wrapper .old-price .price {
  color: #505360;
  font-size: 14px;
  font-weight: 400;
}
.card .info .price-wrapper .current-price {
  color: #DF0004;
  font-size: 22px;
  font-weight: 700;
}
.card .info .price-wrapper .item-data {
  display: inline-flex;
  gap: 4px;
  align-items: flex-start;
}
.card .info .price-wrapper .item-data.center {
  align-items: center;
}
.card .info .price-wrapper .item-data b {
  margin-top: 2px;
  color: #111928;
  font-weight: 600;
  line-height: 140%;
}
.card .info .price-wrapper .item-data input {
  color: #111928;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%;
 /* 21px */
  width: 40px;
  border: 1px solid #d2d3da;
  padding: 2px 8px;
  border-radius: 4px;
  text-align: center;
}
.card .info .price-wrapper .item-data button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: 1px solid transparent;
  background: #1a56db;
}
.card .info .price-wrapper .item-data button div {
  width: 12px;
  height: 12px;
}
.card.row {
  max-width: calc(50% - 16px);
  min-width: calc(33% - 16px);
  gap: 12px;
  align-items: stretch;
  height: fit-content;
  flex-direction: row;
}
.card.row.big {
  align-items: stretch;
  height: fit-content;
  flex-direction: row;
  max-width: initial;
  min-width: initial;
}
.card.row.big .image-wrapper {
  width: 240px;
  height: 240px;
  aspect-ratio: 1;
}
.card.row.big .info {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 12px 0;
}
.card.row.big .info h3 {
  font-size: 22px;
  font-weight: 500;
  line-height: 120%;
}
.card.row.big .info h2 {
  color: #1a56db;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: auto;
}
.card.row.big .info .price-wrapper .old-price .rate {
  font-size: 16px;
}
.card.row.big .info .price-wrapper .old-price .price {
  font-size: 18px;
}
.card.row.big .info .price-wrapper .current-price {
  font-size: 22px;
  font-weight: 700;
}
.card.row .image-wrapper {
  
  aspect-ratio: 1;
  max-width: 30%;
  min-width: initial;
}
.card.row .image-wrapper .icon {
  right: 4px;
  padding: 4px;
  bottom: 4px;
}
.card.row .image-wrapper .icon div {
  width: 18px;
  height: 18px;
}
.card.row .info {
  flex: 1;
  padding : 6px 0;
}
.card.row .info h3 {
  font-size: 14px;
  font-weight: 500;
  line-height: 135%;
}
.card.row .info .price-wrapper .current-price {
  font-size: 20px;
  font-weight: 700;
}
.card.row.detail {
  align-items: stretch;
  height: fit-content;
  flex-direction: row;
  max-width: initial;
  min-width: initial;
  gap : 24px;
}
.card.row.detail .image-wrapper {
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  aspect-ratio: initial;
  width: 940px;
  border: none;
}
.card.row.detail .image-wrapper img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}
.card.row.detail .image-wrapper.small {
  width: 100%;
  display: flex;
  justify-content: space-between;
  min-width: 100%;
  min-height: 120px;
  border: none;
  flex-direction: row;
  margin-top: 12px;
  aspect-ratio: 0;
}
.card.row.detail .image-wrapper.small img {
  max-width: 120px !important;
  height: 120px;
}
.card.row.detail .info {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}
.card.row.detail .info h3 {
  font-size: 22px;
  font-weight: 500;
  line-height: 120%;
}
.card.row.detail .info h2 {
  color: #1a56db;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: auto;
}
.card.row.detail .info .price-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  width: 400px;
}
.card.row.detail .info .price-wrapper .old-price .rate {
  font-size: 16px;
}
.card.row.detail .info .price-wrapper .old-price .price {
  font-size: 18px;
}
.card.row.detail .info .price-wrapper .current-price {
  font-size: 22px;
  font-weight: 700;
}
.buy-item-button-wrapper {
  padding: 24px;
  border-radius: 8px;
  border: 1px solid #f7f9ff;
  background: #fbfdff;
  display: flex;
  flex-direction: column;
  gap: 18px;
  flex: 1;
  max-height: fit-content;
}
.buy-item-button-wrapper .purchase-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.buy-item-button-wrapper .purchase-wrapper .purchase-quantity {
  display: flex;
  gap: 18px;
  align-items: center;
  white-space: nowrap;
}
.buy-item-button-wrapper .purchase-wrapper .purchase-quantity label {
  color: #111928;
  font-size: 18px;
  font-weight: 500;
  line-height: 150%;
 /* 27px */
}
.buy-item-button-wrapper .purchase-wrapper .purchase-quantity label.min {
  min-width: 30%;
}
.buy-item-button-wrapper .purchase-wrapper .purchase-quantity input, .buy-item-button-wrapper .purchase-wrapper .purchase-quantity select {
  border: 1px solid #ededf0;
  border-radius: 4px;
  padding: 12px;
}
.buy-item-button-wrapper .purchase-wrapper .price {
  color: #111928;
  font-size: 24px;
  font-weight: 700;
  line-height: 150%;
  white-space: nowrap;
 /* 45px */
}
.buy-item-button-wrapper .action-buttons {
  display: flex;
  gap: 24px;
}
.buy-item-button-wrapper .action-buttons button {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 16px;
  flex: 1;
  justify-content: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
 /* 21px */
  font-family: Pretendard !important;
  border-radius: 4px;
  transition: all 0.3s;
}
.buy-item-button-wrapper .action-buttons .cart-button {
  border: 1px solid #f0f3ff;
  background: #fff;
  color: #111928;
}
.buy-item-button-wrapper .action-buttons .cart-button:hover {
  border-radius: 4px;
  border: 1px solid #1a56db;
  background: #1a56db;
  color: #fff;
}
.buy-item-button-wrapper .action-buttons .cart-button:hover div {
  filter: brightness(0) saturate(100%) invert(99%) sepia(100%) saturate(0%) hue-rotate(192deg) brightness(108%) contrast(100%);
}
.buy-item-button-wrapper .action-buttons .buy-button {
  border-radius: 4px;
  border: 1px solid #1a56db;
  background: #1a56db;
  color: #fff;
}
.buy-item-button-wrapper .action-buttons .buy-button:hover {
  filter: brightness(120%);
}
.bedge-wrapper {
  display: flex;
  gap: 12px;
}
.promotion-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: calc(25% - 18.45px);
  min-width: calc(25% - 18.45px);
  min-height: fit-content;
}
.promotion-item-wrapper img{
  aspect-ratio: 380/237.5;
  width: 100%;
  object-fit: cover;
  border : 1px solid #eee;
  cursor: pointer;
  border-radius: 8px;
}
.promotion-item-wrapper.row {
  height: auto;
  width: fit-content;
  max-width: calc(33% - 24px);
  min-width: calc(33% - 24px);
}
.promotion-item-wrapper.row img {
  width: 100%;
  object-fit: cover;
  min-height: 77px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.title-wrapper h2 {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 135%;
}
.title-wrapper span {
  color: #2d2e32;
  font-size: 14px;
  font-weight: 500;
}
.all-view {
  display: flex;
  align-items: center;
  color: #2a3849;
  font-size: 16px;
  font-weight: 400;
  gap: 8px;
  filter: brightness(0) saturate(100%) invert(17%) sepia(31%) saturate(666%) hue-rotate(172deg) brightness(96%) contrast(86%);
}
.section .main-title-wrapper .title-item-wrapper + .all-view {
  margin-left: auto;
  padding-bottom: 8px;
}
.all-view div {
  margin-top: 2px;
  width: 18px;
  height: 18px;
}
.category-button-list {
  display: flex;
  gap: 24px;
}
.category-button-list button {
  width: 100px;
  aspect-ratio: 1;
  display: flex;
  padding: 18px 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  border-radius: 16px;
  border: 1px solid #ebefff;
  background: #fff;
  color: #505360;
  font-size: 12px;
  font-weight: 400;
  transition: background-color 0.3s, color 0.3s;
}
.category-button-list.no-ratio-button button {
  aspect-ratio: initial;
  flex: 1;
}
.category-button-list button > div {
  width: 26px;
  height: 26px;
}
.category-button-list button.active, .category-button-list button:hover {
  font-weight: 600;
  color: #fff;
  background: #1a56db;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
  border: 1px solid transparent;
}
.category-button-list button.active > div, .category-button-list button:hover > div {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(157deg) brightness(105%) contrast(104%);
}
.category-title-wrapper {
  display: flex;
  gap: 8px;
  color: #444549;
  font-size: 20px;
  font-weight: 700;
  align-items: center;
}
.category-title-wrapper h1 {
  color: #1a56db;
  display: flex;
  gap: 6px;
  align-items: center;
}
.category-title-wrapper h1 span {
  color: #505360;
  font-weight: 400;
  font-size: 16px;
}
.category-title-wrapper div {
  width: 22px;
  height: 22px;
  margin-top: 3px;
}
.row-promotion-item-list {
  display: flex;
  gap: 24px;
  justify-content: center;
}
.row-promotion-item-list img {
  width: calc(25% - 24px);
  flex: 1;
  object-fit: cover;
}
.search-navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.search-navbar .input-warpper {
  width: 30%;
}
.search-navbar .input-warpper input {
  flex: 1;
}
.detail-section {
  display: flex;
  flex-direction: column;
}
.detail-section .detail-button-wrapper {
  display: flex;
  position: sticky;
  top: 120.195px;
  background: #fff;
  z-index: 1;
}
.detail-section .detail-button-wrapper.no-sticky {
  position: initial;
  top: initial;
  z-index: initial;
}
.detail-section .detail-button-wrapper.no-sticky div {
  border: none !important;
}
.detail-section .detail-button-wrapper div {
  border-radius: 8px 8px 0px 0px;
  flex: 1;
  text-align: center;
  padding: 24px 12px;
  font-size: 22px;
  line-height: 18px;
 /* 81.818% */
  color: #d2d3da;
  font-weight: 700;
  border-bottom: 2px solid #f7f8fb;
  transition: all 0.3s;
  cursor: pointer;
}
.detail-section .detail-button-wrapper div.active, .detail-section .detail-button-wrapper div:hover {
  color: #1a56db;
  border-color: #1a56db;
}
.detail-section .detail-content-wrapper {
  display: flex;
  flex-direction: column;
  color: #444;
  padding: 24px;
  gap: 8px;
 /* text-base/font-normal */
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
 /* 24px */
  border: 1px solid #f7f8fb;
  border-top: none;
  padding-bottom: 42px;
}
.detail-section .detail-content-wrapper img {
  max-width: 100% !important;
}
.wrapper .info-wrapper {
  border-radius: 8px;
  border: 1px solid #dcdee9;
  padding: 32px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  display: flex;
  box-sizing: border-box;
  font-family: Pretendard;
}
.popup-content .info-wrapper, .login-wrapper .left .info-wrapper {
  border-radius: 8px;
  border: 1px solid #dcdee9;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  display: flex;
  box-sizing: border-box;
  font-family: Pretendard;
}
.info-wrapper.no-padding {
  padding: 0 !important;
  border: none !important;
}
.info-wrapper.no-padding .info-input {
  width: 100%;
  padding: 0 !important;
}
.info-wrapper .info-input .point-input {
  min-width: 180px;
}
.info-wrapper.no-padding button {
  width: 100%;
}
.info-wrapper > .info-content-box-wrapper{
  margin : 6px 0;
}
.info-wrapper h3 {
  color: #23232a;
  font-size: 20px;
  font-weight: 700;
  line-height: 150%;
  width: 100%;
  margin-bottom: 8px;
}
.info-wrapper h3.blue {
  color: #1a56db;
}
.info-wrapper .info-input {
  align-items: center;
  gap: 16px;
  display: flex;
  width: 100%;
  padding-right: 60%;
  box-sizing: border-box;
  height: 38px;
  font-weight: 400;
  /** 2025-07-11 **/
  min-height: fit-content;;
}
.info-wrapper .info-input.long-width {
  width: 100%;
}
.info-wrapper .info-input.short-width {
  width: 50%;
}
.info-wrapper .info-input.short-width input {
  width: 120px;
}
.info-wrapper .info-input span {
  font-size: 16px;
  font-weight: 400;
}
.info-wrapper .info-input.result {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.info-wrapper .info-input.result .icon {
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  display: flex;
}
.info-wrapper .info-input.result .icon.plus {
  border-radius: 32px;
  background-color: #0024df;
}
.info-wrapper .info-input.result .icon.minus {
  border-radius: 32px;
  background-color: #e80000;
}
.info-wrapper .info-input.result .icon div {
  width: 12px;
  height: 12px;
}
.info-wrapper .info-input.result.plusIcon {
  filter: brightness(0) saturate(100%) invert(25%) sepia(54%) saturate(2985%) hue-rotate(210deg) brightness(98%) contrast(97%);
  border-radius: 36px;
}
.info-wrapper .info-input.result.minusIcon {
  filter: brightness(0) saturate(100%) invert(15%) sepia(99%) saturate(3671%) hue-rotate(16deg) brightness(98%) contrast(119%);
  border-radius: 36px;
}
.info-wrapper .info-input.result label {
  flex: 0.3;
}
.info-wrapper .info-input.result span {
  text-align: right;
}
.info-wrapper .info-input .total {
  color: #0024df;
  font-size: 18px;
  font-weight: 700;
  line-height: 150%;
 /* 27px */
}
.info-wrapper .info-input .radio-wrapper {
  display: flex;
  gap: 12px;
  align-items: center;
}
.info-wrapper .info-input .radio-wrapper label {
  min-width: fit-content;
}
.info-wrapper .info-input .radio-wrapper label input {
  width: fit-content;
  height: fit-content;
}

.info-wrapper .info-input label {
  color: #3b3c49;
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
 /* 24px */
  display: flex;
  box-sizing: border-box;
  gap: 6px;
  align-items: center;
  white-space: nowrap;
  min-width: 127px;
}
.info-wrapper .info-input .radio-wrapper label{
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
}
.info-wrapper .info-input .radio-wrapper label b{
  font-weight: 700;
  color: #0e7bea;
}
.info-wrapper .info-input label input {
  margin-bottom: 4px;
}
.info-wrapper .info-input input, .info-wrapper .info-input select {
  width: 100%;
  padding: 8px 12px;
  border-radius: 4px;
  border: 1px solid #bec2cd;
  background: #fff;
  font-size: 16px;
  font-weight: 400;
 /* 24px */
  box-sizing: border-box;
  font-family: Pretendard !important;
  height: 38px;
  /** 2025-07-11 **/
  min-height: fit-content;
}
.info-wrapper .info-input input.readonly, .info-wrapper .info-input select.readonly {
  border: 1px solid #d9e5f6;
  background: #f3f6fa;
}
.info-wrapper .info-input input.half-width, .info-wrapper .info-input select.half-width {
  width: 35%;
}
.info-wrapper .info-input > .post-wrapper {
  gap: 12px;
  display: flex;
  align-items: center;
  width: 100%;
}
.info-wrapper .info-input .check-wrapper {
  gap: 4px;
  display: flex;
  align-items: center;
}
.info-wrapper .info-input .check-wrapper input {
  width: fit-content;
  border-radius: 4px;
  border: 1px solid #f7f7f8;
  background: #fff;
}
.info-wrapper .info-input .check-wrapper label {
  color: #3b3c49;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
 /* 24px */
  margin-bottom: 2px;
}
.info-wrapper .info-input.phone .phone-wrapper {
  gap: 12px;
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
 /* 24px */
}
.info-wrapper .info-input.phone .phone-wrapper input {
  width: 68px;
  text-align: center;
}
.info-content-box-item-list-wrapper {
  display: flex;
  gap: 16px;
}
.info-content-box-item-list-wrapper .info-content-box-wrapper {
  flex: 1;
}
.info-content-box-wrapper {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  border-radius: 6px;
}
.info-content-box-wrapper .info-flex {
  display: flex;
  gap: 16px;
  width: 100%;
  align-items: stretch;
}
.info-content-box-wrapper .info-flex .input {
  border-radius: 4px;
  padding: 6px 12px;
  width: 30%;
  box-sizing: border-box;
}
.info-content-box-wrapper .info-flex button {
  margin-left: auto;
}
.info-content-box-wrapper .info-flex p {
  align-self: center;
}
.info-content-box-wrapper .info-flex .info-input-with-label {
  display: flex;
  gap: 12px;
  width: 100%;
  align-items: stretch;
  flex: 1;
}
.info-content-box-wrapper .info-flex .info-input-with-label input.input {
  flex: 1;
}
.info-content-box-wrapper .info-flex .info-input-with-label label {
  align-self: center;
}
.info-content-box-wrapper h2 {
  font-size: 16px !important;
  font-weight: 700;
  display: flex;
  gap: 4px;
  align-items: center;
  line-height: 100%;
}
.info-content-box-wrapper h2 span {
  width: 18px;
  height: 18px;
  margin-top: 2px;
}
.info-content-box-wrapper * input, .info-content-box-wrapper * select {
  background-color: white;
  padding : 0 8px;
  border-radius: 4px;
}
.info-content-box-wrapper p {
  font-size: 14px;
  font-weight: 500;
  line-height: 135%;
 /* 21px */
}
.info-content-box-wrapper p span.bedge-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.info-content-box-wrapper p b {
  font-weight: 600;
}
.info-content-box-wrapper ul {
  display: flex;
  flex-direction: column;
}
.info-content-box-wrapper ul li {
  font-size: 14px;
  font-weight: 500;
  line-height: 150%;
  list-style-type: disc;
  margin-left: 12px;
}
.info-content-box-wrapper.blue {
  background: #f3f6fa;
}
.info-content-box-wrapper.blue h2 {
  color: #004aa0;
}
.info-content-box-wrapper.blue h2 span {
  filter: brightness(0) saturate(100%) invert(20%) sepia(39%) saturate(4256%) hue-rotate(200deg) brightness(96%) contrast(103%);
}
.info-content-box-wrapper.blue p, .info-content-box-wrapper.blue ul {
  color: #004aa0;
}
.info-content-box-wrapper.gray {
  background: #fcfcfc;
}
.info-content-box-wrapper.gray h2 {
  color: #373a44;
}
.info-content-box-wrapper.gray h2 span {
  filter: brightness(0) saturate(100%) invert(19%) sepia(8%) saturate(1167%) hue-rotate(189deg) brightness(92%) contrast(84%);
}
.info-content-box-wrapper.gray p {
  color: #373a44;
}
.info-content-box-wrapper.dark-gray {
  background: #f7f7f7;
}
.info-content-box-wrapper.dark-gray h2 {
  color: #222 !important;
}
.info-content-box-wrapper.dark-gray p {
  color: #424242;
}
.info-content-box-wrapper.dark-gray.border {
  border: 1px solid #d9d9d9;
  background-color: #f9f9f9;
}

.info-content-box-wrapper.blue-gray {
  background: #f2f7ff;
}
.info-content-box-wrapper.blue-gray h2 {
  color: #222 !important;
}
.info-content-box-wrapper.blue-gray p {
  color: #424242;
}
.info-content-box-wrapper.blue-gray.border {
  border: 1px solid #eee;
}

.info-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.info-section h2 {
  color: #333a48;
  font-size: 18px;
  font-weight: 700;
  line-height: 150%;
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}
.info-section.container .content-section {
  padding: 0;
  flex-direction: row;
  border: none;
  gap: 32px;
}
.info-section.container .content-section > div {
  flex: 1;
}
.qna-wrapper {
  display: flex;
  flex-direction: column;
  border-radius: 4px;
  border: 1px solid #dcdee9;
  font-family: Pretendard;
}
.qna-wrapper .title-wrapper {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 14px 18px;
  border-radius: 4px 4px 0px 0px;
  flex-direction: row;
}
.qna-wrapper .title-wrapper span {
  font-weight: 700;
}
.qna-wrapper .content-wrapper {
  padding: 18px 24px;
  color: #323232;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
 /* 24px */
  display: flex;
  gap: 8px;
  flex-direction: column;
}
.qna-wrapper .content-wrapper b {
  font-weight: 600;
}
.qna-wrapper .content-wrapper .row-wrapper {
  display: flex;
  gap: 16px;
  margin: 24px 0;
  align-items: center;
}
.qna-wrapper .content-wrapper .row-wrapper .inner-content {
  flex: 1;
  display: flex;
  padding: 16px 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 6px;
  line-height: 125%;
}
.qna-wrapper .content-wrapper .row-wrapper .inner-content h4 {
  font-size: 18px;
  font-weight: 700;
  line-height: 150%;
 /* 27px */
}
.qna-wrapper .content-wrapper .row-wrapper .inner-content b {
  font-size: 16px;
  font-weight: 600;
  line-height: 125%;
}
.qna-wrapper .content-wrapper .row-wrapper .inner-content.blue {
  color: #1a56db;
  background: #f0f9ff;
}
.qna-wrapper .content-wrapper .row-wrapper .inner-content.red {
  color: #eb0000;
  background: #fff2f2;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item {
  flex: 1;
  display: flex;
  padding: 18px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  box-sizing: border-box;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item .step {
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
 /* 21px */
}
.qna-wrapper .content-wrapper .row-wrapper .step-item .title {
  color: #32353b;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
 /* 18px */
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.blue {
  background: #e6f5ff;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.blue .step {
  color: #1a56db;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.green {
  background: #edffe6;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.green .step {
  color: #45b500;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item + .rightArrowIcon {
  min-width: 24px;
  height: 24px;
  flex: 0;
  background-size: auto 100%;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.gray {
  background-color: #f7f7f7;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.gray .step {
  color: #6b7280;
}
.qna-wrapper .content-wrapper .row-wrapper .step-item.active {
  border: 1px solid #dcdee9;
}
.qna-wrapper .content-wrapper .column-wrapper {
  margin-bottom: 24px;
  display: flex;
  gap: 16px;
  flex-direction: column;
  color: #32353b;
  font-size: 16px;
  font-weight: 400;
  line-height: 100%;
 /* 16px */
  width: 100%;
}
.qna-wrapper .content-wrapper .column-wrapper li {
  display: flex;
  width: 100%;
}
.qna-wrapper .content-wrapper .column-wrapper li span {
  display: inline-block;
}
.qna-wrapper .content-wrapper .column-wrapper li span.bold {
  color: #474747;
  font-weight: 700;
  flex: 1;
  max-width: 20%;
}
.qna-wrapper.blue .title-wrapper {
  background: #1a56db;
}
.qna-wrapper.blue .title-wrapper span{
  color: #fff;
  font-size: 16px;
 /* 27px */
}
.qna-wrapper.blue .title-wrapper div {
  filter: brightness(0) saturate(100%) invert(98%) sepia(0%) saturate(7500%) hue-rotate(272deg) brightness(101%) contrast(104%);
}
.qna-wrapper.gray .title-wrapper {
  background: #fff;
  color: #7c7d8d;
  border-bottom: 1px solid #dcdee9;
}
.qna-wrapper.gray .title-wrapper div {
  filter: brightness(0) saturate(100%) invert(49%) sepia(5%) saturate(969%) hue-rotate(199deg) brightness(99%) contrast(88%);
}
.qna-wrapper.dark-gray .title-wrapper {
  background: #fff;
  color: #32353b;
  border-bottom: 1px solid #dcdee9;
  font-weight: 600;
}
.qna-wrapper.dark-gray .title-wrapper div {
  filter: brightness(0) saturate(100%) invert(15%) sepia(10%) saturate(739%) hue-rotate(182deg) brightness(96%) contrast(82%);
}
.verify-item-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}
.verify-item-wrapper > .info-content-box-wrapper {
  width: 100%;
  box-sizing: border-box;
}
.verify-item-wrapper > .info-content-box-wrapper h2{
  align-items: flex-start;
  font-size: 14px;
}
.verify-item-wrapper.find-info {
  width: 100%;
  gap: 16px;
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #dcdee9;
  box-sizing: border-box;
}
.verify-item-wrapper.find-info .info-content-box-wrapper {
  width: 100%;
}
.verify-item-wrapper.find-info span {
  font-size: 16px;
  font-weight: 600;
  line-height: 150%;
 /* 24px */
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.verify-item-wrapper.find-info span button {
  flex: 0;
  justify-content: flex-end;
  padding: 0;
}
.verify-item-wrapper.find-info span button span {
  width: 12px;
  height: 12px;
}
.verify-item-wrapper > h2 {
  color: #32353b;
  font-size: 18px;
  font-weight: 500;
  line-height: 18px;
 /* 100% */
}
.verify-item-wrapper button {
  flex: 1;
  width: 100%;
  height: 42px;
  max-height: 42px;
  min-height: 42px;
}
.verify-item-wrapper button span{
  width: 14px;
  height: 14px;
  margin-top: 1px;
}
.verify-item-wrapper .button-row-wrapper {
  display: flex;
  gap: 12px;
  width: 100%;
}
.verify-item-wrapper .button-row-wrapper > button {
  flex: 1;
}
.row-wrapper {
  display: flex;
  gap: 32px;
}
.row-wrapper > div {
  flex: 1;
}
.popup-wrapper {
  width: 100%;
  border-radius: 4px;
  border: 1px solid #dfe7f1;
}
.popup-wrapper .popup-title {
  display: flex;
  padding: 12px 18px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-bottom: 1px solid #dfe7f1;
}
.popup-wrapper .popup-title h1 {
  color: #000;
  text-align: center;
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
 /* 27px */
}
.popup-wrapper .popup-title .closeIcon {
  width: 14px;
  height: 14px;
    filter: brightness(0) saturate(100%) invert(72%) sepia(1%) saturate(0%) hue-rotate(42deg) brightness(94%) contrast(91%) !important;

}
.popup-wrapper .popup-content {
  display: flex;
  padding: 24px 18px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.popup-wrapper .popup-content .info-wrapper {
  padding: 0;
  border: none;
  width: 100%;
}
.popup-wrapper .popup-content .info-wrapper .info-input {
  width: 100%;
  padding-right: 0;
}
.popup-wrapper .popup-content .info-wrapper .info-input .long-width {
  width: 100%;
}
.popup-wrapper .popup-content hr {
  width: 100%;
  height: 0px;
  border: none;
  border-bottom: 1px solid #dfe7f1;
}
.popup-wrapper .popup-content .address-item-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  width: 100%;
  padding: 0 18px;
  box-sizing: border-box;
}
.popup-wrapper .popup-content .address-item-wrapper .address-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
}
.popup-wrapper .popup-content .address-item-wrapper .address-title .address-name-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}
.popup-wrapper .popup-content .address-item-wrapper .address-title .address-name-wrapper span.name {
  color: var(--gray-900, #111928);
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
 /* 18px */
}
.popup-wrapper .popup-content .address-item-wrapper .address-title .address-action-button-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}
.popup-wrapper .popup-content .address-item-wrapper .address-title .address-action-button-wrapper button {
  border-radius: 2px;
  background: #1a56db;
  color: #fff;
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 800;
  line-height: 150%;
 /* 15px */
  border: none;
  display: flex;
  padding: 4px 12px;
  align-items: center;
  gap: 10px;
}
.popup-wrapper .popup-content .address-item-wrapper .address-title .address-action-button-wrapper button.red {
  background: #f32b2b;
}
.popup-wrapper .popup-content .address-item-wrapper .address-phone span {
  color: var(--gray-900, #111928);
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
 /* 18px */
}
.popup-wrapper .popup-content .address-item-wrapper .address-text span, .popup-wrapper .popup-content .address-item-wrapper .address-memo span {
  color: #505661;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
 /* 16px */
}
.popup-wrapper .button-list {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.popup-wrapper button.popup {
  width: 100%;
  border-radius: var(--rounded-md, 6px);
  border: 1px solid #1a56db;
  display: flex;
  padding: var(--25, 10px) var(--5, 20px);
  justify-content: center;
  align-items: center;
  gap: var(--2, 8px);
  background-color: #fff;
  color: #1a56db;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
 /* 24px */
}
.popup-wrapper button.popup.blue {
  background: #1a56db;
  color: #fff;
  border: none;
}
.popup-wrapper button.popup.red-strock {
  border: 1px solid #f32b2b;
  color: #f32b2b;
}
.input-warpper {
  border-radius: 4px;
  border: 1px solid #a6a8b1;
  background: #fff;
  padding: 0px 12px;
  display: flex;
  align-items: center;
}
.input {
  font-family: Pretendard;
  color: #222;
  font-size: 14px;
  font-weight: 500;
  border: none;
  min-height: 38px;
  box-sizing: border-box;
  outline: none;
  background-color: white;
}
text
.input.border {
  border: 1px solid #dcdee9;
}
.input-warpper .button > .searchIcon{
  width: 18px;
  height: 18px;
}
.filter-button-list {
  display: flex;
  gap: 14px;
}
.filter-button-list button {
  height: fit-content;
  border-radius: 32px;
  color: #969696;
  font-size: 14px;
  font-weight: 500;
  padding: 6px 12px;
  border: 1px solid #ececec;
  background-color: #fff;
  transition: background-color 0.2s, color 0.2s;
}
.filter-button-list button.active, .filter-button-list button:hover {
  color: #0e7bea;
  background: #e3f0fc;
  font-weight: 700;
  border-color: transparent;
}
.page-nav {
  margin: 36px 0;
  display: flex;
  gap: 12px;
  justify-content: center;
  border-radius: 4px;
}
.page-nav button {
  transition: background-color 0.2s, color 0.2s;
  border: 1px solid #eaeef1;
  background-color: #fff;
  width: 36px;
  height: 36px;
  color: #8b9cbb;
  font-size: 14px;
  font-weight: 400;
  border-radius: 6px;
}
.page-nav button .leftThinArrowIcon, .page-nav button .rightThinArrowIcon {
  width: 20px;
  height: 20px;
  filter: brightness(0) saturate(100%) invert(69%) sepia(9%) saturate(940%) hue-rotate(180deg) brightness(88%) contrast(84%);
}
.page-nav button.active, .page-nav button:hover {
  color: #fff;
  font-weight: 500;
  background-color: #1a56db;
}
.page-nav button.active .leftThinArrowIcon, .page-nav button:hover .leftThinArrowIcon, .page-nav button.active .rightThinArrowIcon, .page-nav button:hover .rightThinArrowIcon {
  filter: brightness(0) saturate(100%) invert(99%) sepia(100%) saturate(0%) hue-rotate(192deg) brightness(108%) contrast(100%);
}
.up-down-button {
  border-radius: 8px;
  border: 1px solid #e6e6e6;
  box-shadow: 2px 4px 4px 0px rgba(0, 0, 0, 0.25);
  background-color: white;
  display: flex;
  padding: 6px 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  position: fixed;
  right: calc(50svw - 749px);
  bottom: 6svh;
  align-items: center;
  justify-content: center;
}
.up-down-button button {
  border: none;
  background: none;
  color: #1a56db;
  text-align: center;
  font-family: Pretendard;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  padding: 4px 0px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.up-down-button button .rightThinArrowIcon {
  filter: brightness(0) saturate(100%) invert(19%) sepia(100%) saturate(2039%) hue-rotate(215deg) brightness(111%) contrast(94%);
}
.up-down-button button:first-of-type .rightThinArrowIcon {
  transform: rotate(90deg);
}
.up-down-button button:last-of-type .rightThinArrowIcon {
  transform: rotate(270deg);
}
.up-down-button hr {
  width: 100%;
  height: 0px;
  border: none;
  border-bottom: 1px solid #e6e6e6;
}
.wrapper.short.img-wrapper p img {
  width: 100%;
}
.wrapper.short.policy-wrapper {
  font-family: Pretendard;
  font-size: 14px;
  line-height: 140%;
}
.wrapper.short.policy-wrapper .table-wrapper {
  overflow: auto;
  width: 100%;
  box-sizing: border-box;
  display: block !important;
}
.wrapper.short.policy-wrapper .table-wrapper table {
  width: 100%;
}
.wrapper.short.policy-wrapper .table-wrapper table th {
  font-size: 14px;
  font-weight: 700;
  color: #222;
  text-align: left;
  padding: 12px 0;
  border-bottom: 1px solid #e6e6e6;
}
.wrapper.short.policy-wrapper .table-wrapper table td {
  font-size: 14px;
  font-weight: 400;
  color: #222;
  text-align: left;
  padding: 12px 12px;
  border-bottom: 1px solid #e6e6e6;
  white-space: nowrap;
}
/** 2025년 4월 26일 추가 **/
.margin-top-auto {
  margin-top: auto;
}
.qna-wrapper.health-check .content-wrapper {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: flex-start;
  align-self: stretch;
  height: 100%;
  min-height: 100%;
  margin: 6px 0;
}
.qna-wrapper .content-wrapper .column-wrapper {
  width: 100%;
  align-self: stretch;
}
.qna-wrapper .content-wrapper .column-wrapper li {
  min-width: 100%;
}
.qna-wrapper .content-wrapper .column-wrapper li p {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  flex: 1;
  flex-wrap: wrap;
}
.qna-wrapper .content-wrapper .column-wrapper li p span {
  flex: 1;
  color: #0024df;
  font-weight: 600;
  min-width: calc(50% - 12px);
  max-width: calc(50% - 12px);
  display: flex;
  line-height: 135%;
}
.qna-wrapper .content-wrapper .column-wrapper li p span b {
  margin-left: auto;
}
.qna-wrapper .content-wrapper .column-wrapper li p.gray {
  flex: 1;
}
.qna-wrapper .content-wrapper .column-wrapper li p.gray span {
  color: #505360;
  padding: 12px;
  background-color: #f7f7f7;
  border-radius: 4px;
  font-weight: 600;
  box-sizing: border-box;
}
.qna-wrapper .content-wrapper .column-wrapper li p.blue span {
  color: #505360;
  padding: 12px;
  background-color: #f7f7f7;
  border-radius: 4px;
  font-weight: 600;
  box-sizing: border-box;
  background-color: #f0f9ff;
  color: #222;
  font-weight: 500;
}
.qna-wrapper .content-wrapper .column-wrapper li p.gray span b {
  color: #222;
}
.qna-wrapper .content-wrapper .column-wrapper li p.blue span b {
  color: #0024df;
}
.promotion-item-wrapper.health.row {
  gap: 4;
  border-radius: 4px;
  border: 1px solid #dcdee9;
  padding: 16px 12px;
  box-sizing: border-box;
  max-width: calc(33% - 24px);
}
.promotion-item-wrapper.health.row.top-down-row {
  gap: 12px;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
  flex-direction: row;
  align-items: center;
}
.promotion-item-wrapper.health.row.top-down-row img {
  min-width: 200px;
  object-fit: none;
  flex: 0;
}
.promotion-item-wrapper.health.row.top-down-row .button-group-column {
  margin-left: auto;
  gap: 6px;
  display: flex;
  flex-direction: column;
}
.promotion-item-wrapper.health.row.top-down-row .button-group-column .basic-button{
  height: 36px;
  box-sizing: border-box;
}
.promotion-item-wrapper.health.row .button-group {
  width: 100%;
  align-self: stretch;
}
.promotion-item-wrapper.health.row .button-group button {
  width: 100%;
}
.promotion-item-wrapper.health.row .title-wrapper {
  padding: 0 8px;
  gap: 6px;
  align-items: flex-start;
  border: none;
}
.promotion-item-wrapper.health.row .title-wrapper span.gray {
  font-size: 14px;
  font-weight: 500;
  color: #505360;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--2, 6px);
}
.promotion-item-wrapper.health.row .title-wrapper span.gray span {
  margin-bottom: -2px;
}
.promotion-item-wrapper.health.row .title-wrapper h2 {
  line-height: 150%;
  display: flex;
  align-items: center;
  gap: 6px;
}
.promotion-item-wrapper.health.row .title-wrapper span.gray .icon {
  min-width: 20px;
  min-height: 20px;
  max-width: 20px;
  max-height: 20px;
  filter: brightness(0) saturate(100%) invert(52%) sepia(7%) saturate(755%) hue-rotate(196deg) brightness(89%) contrast(88%);
}
.promotion-item-wrapper.health.row .title-wrapper .basic-button {
  margin-top: 8px;
  width: 100%;
  box-sizing: border-box;
}
.flex-column-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.flex-row-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 24px;
  width: 100%;
}
.flex-row-wrapper .info-content-box-wrapper {
  flex: 1;
  width: 100%;
  align-self: stretch;
}
.date-table-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.date-table-wrapper .flex-row-wrapper {
  align-items: center;
  justify-content: center;
}
.date-table-wrapper .flex-row-wrapper .month {
  font-size: 16px;
  font-weight: 600;
  color: #0024df;
}
.date-table-wrapper table.date-table {
  width: 100%;
  border-radius: 4px;
  border: 1px solid #eaeef1;
  box-sizing: border-box;
  table-layout: fixed;
}
.date-table-wrapper table.date-table thead tr th {
  font-size: 14px;
  font-weight: 600;
  color: #222;
  text-align: center;
  padding: 12px 0;
  border-bottom: 1px solid #e6e6e6;
}
.date-table-wrapper table.date-table tbody tr td {
  padding: 6px;
  border: 1px solid #e6e6e6;
}
.date-table-wrapper table.date-table tbody tr td > span {
  padding: 6px;
  box-sizing: border-box;
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: space-between;
  min-height: 120px;
}
.date-table-wrapper table.date-table tbody tr td > span b {
  display: flex;
  gap: 6px;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  font-family: Pretendard;
  color: #505360;
  font-size: 14px;
  font-weight: 500;
}
.date-table-wrapper table.date-table tbody tr td > span b .bedge {
  box-sizing: border-box;
  align-items: center;
  display: flex;
  justify-content: center;
}
.date-table-wrapper table.date-table tbody tr td > span button {
  width: 100%;
  margin-top: 8px;
}
.health-check.pc-column .content-wrapper {
  flex-direction: column;
  width: 100%;
  box-sizing: border-box;
}
.qna-wrapper.health-check.pc-column .content-wrapper .row-wrapper {
  width: 100%;
}

/** swiper **/
.swiper {
  width: 100%;
}
.swiper.swiper-initialized.swiper-horizontal{
  overflow: hidden;
}
.swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden > div.swiper-button-next > div, .swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden > div.swiper-button-prev > div {
  background-color: #fff 98;
  min-width: 36px;
  min-height: 36px;
  border-radius: 320px;
  background-size: 80% auto;
  background-position: center;
  transition: background-color 0.2s;
}
.swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden > div.swiper-button-next:hover > div, .swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden > div.swiper-button-prev:hover > div {
  background-color: #fff;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.15);
}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after, .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
  content: "";
  display: none;
}
/** swiper end **/


#mall-scroll{
  display: flex;
  gap: 36px;
  width: 100%;
  justify-content: space-between;
}
#scroll-header.header-all-wrapper.scroll > .sub-navbar > a:first-child{
  flex : 1; 
  justify-content: flex-start;
}

.info-content-box-wrapper ~ .button-group{
  width: fit-content;
}

.ui-datepicker-trigger{
  min-width: 16px;
  max-width: 16px !important;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 600px) {
  .promotion-item-wrapper {
    height: auto;
    gap: 8px;
    max-width: initial;
    min-width: initial;
    width: 47%;
 }
  .promotion-item-wrapper.row {
    gap: 4px;
    max-width: 100%;
    min-width: calc(55% - 24px);
 }
  .promotion-item-wrapper.row img {
    border-radius: 6px;
 }
  .promotion-item-wrapper img {
    width: 100%;
 }
  .promotion-item-wrapper .title-wrapper {
    gap: 4px;
 }
  .promotion-item-wrapper .title-wrapper h2 {
    font-size: 14px;
 }
  .promotion-item-wrapper .title-wrapper span {
    font-size: 12px;
    font-weight: 500;
 }
  .all-view {
    font-size: 14px;
    padding-bottom: 3px;
    white-space: nowrap;
    gap: 2px;
 }
  .all-view div {
    margin-top: 0px;
    width: 14px;
    height: 14px;
 }
  .category-button-list {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
 }
  .category-button-list button {
    flex-direction: row;
    height: fit-content;
    width: calc(51% - 12px);
    aspect-ratio: initial;
    padding: 8px 12px;
    font-size: 12px;
    border-radius: 6px;
 }
  .category-button-list.no-ratio-button button {
    flex: initial;
 }
  .category-button-list button > div {
    width: 18px;
    height: 18px;
 }
  .category-title-wrapper {
    font-size: 16px;
 }
  .category-title-wrapper div {
    width: 14px;
    height: 14px;
    margin-top: 1px;
 }
  .verify-item-wrapper {
    gap: 16px;
 }
  .verify-item-wrapper > h2 {
    font-size: 16px;
 }
  .verify-item-wrapper button {
    padding: 12px 24px;
    flex: 1;
    width: 100%;
    box-sizing: border-box;
 }
  .verify-item-wrapper .button-row-wrapper {
    gap: 8px;
    flex-direction: column;
 }
  .search-navbar {
    flex-direction: column;
    gap: 12px;
 }
  .search-navbar .input-warpper {
    width: 100%;
    box-sizing: border-box;
 }
  .search-navbar .input-warpper button {
    width: 16px;
    height: 16px;
 }
  .detail-section .detail-button-wrapper {
    top: 109.125px;
 }
  .detail-section .detail-button-wrapper div {
    padding: 14px 8px;
    font-size: 14px;
    line-height: 16px;
   /* 81.818% */
 }
  .detail-section .detail-content-wrapper {
    font-size: 12px;
    padding: 14px 0;
    padding-bottom: 24px;
 }
  .wrapper.short {
    padding: 0 16px;
 }
  .info-wrapper {
    padding: 16px;
    gap: 14px;
 }
  .info-wrapper h3 {
    font-size: 18px;
 }
  .info-wrapper .info-input {
    gap: 4px;
    width: 100%;
 }
  .info-wrapper .info-input.short-width, .info-wrapper .info-input.long-width {
    gap: 6px;
    width: 100%;
 }
  .info-wrapper .info-input span {
    font-size: 14px;
    font-weight: 500;
 }
  .info-wrapper .info-input.result {
    flex-direction: row;
    align-items: center;
    gap: 8px;
 }
  .info-wrapper .info-input.result .icon {
    width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
    display: flex;
 }
  .info-wrapper .info-input.result .icon.plus {
    border-radius: 32px;
    background-color: #0024df;
 }
  .info-wrapper .info-input.result .icon.minus {
    border-radius: 32px;
    background-color: #e80000;
 }
  .info-wrapper .info-input.result .icon div {
    width: 12px;
    height: 12px;
 }
  .info-wrapper .info-input.result.plusIcon {
    filter: brightness(0) saturate(100%) invert(25%) sepia(54%);
    border-radius: 36px;
 }
  .info-wrapper .info-input.result.minusIcon {
    filter: brightness(0) saturate(100%) invert(15%) sepia(99%);
    border-radius: 36px;
 }
  .info-wrapper .info-input.result label {
    flex: 0.3;
 }
  .info-wrapper .info-input.result span {
    text-align: right;
 }
  .info-wrapper .info-input .total {
    color: #0024df;
    font-size: 18px;
    font-weight: 700;
    line-height: 150%;
 }
  .info-wrapper .info-input .radio-wrapper {
    display: flex;
    gap: 12px;
    align-items: center;
 }
 .info-wrapper .info-input > .post-wrapper .radio-wrapper label{
  width: fit-content;
  min-width: initial;
 }
  .info-wrapper .info-input label {
    font-size: 14px;
    gap: 4px;
 }
  .info-wrapper .info-input label input {
    margin-bottom: 3px;
 }
  .info-wrapper .info-input input, .info-wrapper .info-input select {
    padding: 6px 8px;
    font-size: 14px;
    flex :1;
 }
  .info-wrapper .info-input > .post-wrapper {
    gap: 8px;
    flex-wrap: wrap;
    width: fit-content;
 }
 .info-wrapper .info-input > .post-wrapper input ~ span.bedge{
    border: none;
    padding: 0;
    background-color: transparent;
    font-weight: 600;
    font-size: 14px;
    white-space: wrap;
    margin-bottom: 4px;
    line-height: 135%;
    width: 100%;
    text-align: left;
  }
  .info-wrapper .info-input > .check-wrapper {
    gap: 4px;
    display: flex;
    align-items: center;
 }
  .info-wrapper .info-input > .check-wrapper input {
    width: fit-content;
    border-radius: 4px;
    border: 1px solid #f7f7f8;
    background: #fff;
 }
  .info-wrapper .info-input > .check-wrapper label {
    color: #3b3c49;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
   /* 24px */
    margin-bottom: 2px;
 }
  .info-wrapper .info-input.phone .phone-wrapper {
    gap: 8px;
 }
  .info-wrapper .info-input.phone .phone-wrapper input {
    width: 54px;
 }
  .info-content-box-item-list-wrapper {
    flex-direction: column;
 }
  .info-content-box-wrapper {
    padding: 12px;
    gap: 4px;
    border-radius: 2px;
 }
  .info-content-box-wrapper .info-flex {
    flex-direction: column;
    gap: 8px;
 }
 .info-content-box-wrapper .info-flex .info-input-with-label button{
  min-width: fit-content;
 }
  .info-content-box-wrapper .info-flex .info-input-with-label input.input {
    flex: 1;
 }
  .info-content-box-wrapper .info-flex .info-input-with-label select.half {
    flex: 0.5;
 }
  .info-content-box-wrapper .info-flex .info-input-with-label label {
    font-size: 14px;
    white-space: nowrap;
 }
  .info-content-box-wrapper .info-flex .input {
    width: 100%;
    height: 32px;
    min-height: initial;
 }
  .info-content-box-wrapper .info-flex button {
    min-width: 100%;
 }
  .info-content-box-wrapper h2 {
    font-size: 16px;
    gap: 6px;
    line-height: 135%;
 }
  .info-content-box-wrapper p {
    font-size: 14px;
    font-weight: 500;
    line-height: 135%;
 }
  .info-content-box-wrapper p span.bedge-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
 }
  .info-section {
    gap: 24px;
 }
  .info-section h2 {
    font-size: 14px;
 }
  .info-section .is-row-scroll {
    width: 100%;
    overflow-x: scroll;
 }
  .info-section.container .content-section {
    flex-direction: column;
    gap: 16px;
 }
  .qna-wrapper .title-wrapper {
    padding: 12px 14px;
    gap: 4px;
 }
 .qna-wrapper .title-wrapper span{
  font-size: 14px;
 }
  .qna-wrapper .title-wrapper div {
    width: 16px;
    height: 16px;
 }
  .qna-wrapper .content-wrapper {
    padding: 16px 14px;
    font-size: 14px;
 }
  .qna-wrapper .content-wrapper .row-wrapper {
    gap: 12px;
    margin: 24px 0;
    align-items: center;
 }
  .qna-wrapper .content-wrapper .row-wrapper.is-bokji {
    flex-direction: column;
 }
  .qna-wrapper .content-wrapper .row-wrapper.is_step {
    width: 100%;
    overflow-x: scroll;
 }
  .qna-wrapper .content-wrapper .row-wrapper .inner-content {
    padding: 16px 18px;
    gap: 8px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .inner-content h4 {
    font-size: 16px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .inner-content b {
    font-size: 14px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .rightArrowIcon {
    min-width: 16px;
    max-width: 16px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .step-item {
    padding: 12px 16px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .step-item .step {
    font-size: 12px;
 }
  .qna-wrapper .content-wrapper .row-wrapper .step-item .title {
    font-size: 14px;
    white-space: nowrap;
 }
  .qna-wrapper .content-wrapper .column-wrapper {
    margin-bottom: 16px;
    gap: 12px;
    font-size: 14px;
 }
  .qna-wrapper .content-wrapper .column-wrapper li {
    gap: 12px;
 }
  .qna-wrapper .content-wrapper .column-wrapper li span {
    display: inline-block;
 }
  .qna-wrapper .content-wrapper .column-wrapper li span.bold {
    min-width: 90px;
 }
  .row-wrapper {
    flex-direction: column;
 }
  .card.row.detail .info .price-wrapper {
    width: 100%;
 }
  .card {
    flex-direction: row;
    gap: 12px;
    max-width: initial;
    min-width: initial;
 }
  .card .image-wrapper {
    width: 80px;
    height: 80px;
    border-radius: 4px;
 }
  .card .image-wrapper .icon {
    right: 8px;
    padding: 4px;
    bottom: 8px;
 }
  .card .image-wrapper .icon div {
    width: 18px;
    height: 18px;
 }
  .card .info {
    gap: 10px;
    flex: 1;
 }
  .card .info h3 {
    font-weight: 500;
    font-size: 14px;
 }
  .card .info .price-wrapper {
    gap: 4px;
 }
  .card .info .price-wrapper .old-price {
    gap: 6px;
 }
  .card .info .price-wrapper .old-price .rate {
    border-radius: 2px;
    font-size: 10px;
 }
  .card .info .price-wrapper .old-price .price {
    color: #505360;
    font-size: 12px;
    font-weight: 500;
 }
  .card .info .price-wrapper .current-price {
    font-size: 16px;
 }
  .card.row {
    flex-direction: row;
    gap: 12px;
    max-width: 100%;
    min-width: 100%;
 }
  .card.row .image-wrapper {
    min-width: 100px !important;
    max-width: 100px;
    min-height: 100px;
    max-height: 100px;
    border-radius: 4px;
 }
  .card.row .image-wrapper .icon {
    right: 8px;
    padding: 4px;
    bottom: 8px;
 }
  .card.row .image-wrapper .icon div {
    width: 18px;
    height: 18px;
 }
  .card.row .info {
    gap: 10px;
    flex: 1;
 }
  .card.row .info h3 {
    font-weight: 500;
    font-size: 14px;
 }
  .card.row .info .price-wrapper {
    gap: 4px;
 }
  .card.row .info .price-wrapper .old-price {
    gap: 6px;
 }
  .card.row .info .price-wrapper .old-price .rate {
    border-radius: 2px;
    font-size: 10px;
 }
  .card.row .info .price-wrapper .old-price .price {
    color: #505360;
    font-size: 12px;
    font-weight: 500;
 }
  .card.row .info .price-wrapper .current-price {
    font-size: 16px;
 }
  .card.row.big {
    padding: 12px;
    border-radius: 4px;
    border: 1px solid #edf1ff;
    flex-direction: column;
    gap: 12px;
 }
  .card.row.big .image-wrapper {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
 }
  .card.row.big .image-wrapper .icon {
    right: 16px;
    padding: 6px;
    bottom: 16px;
 }
  .card.row.big .image-wrapper .icon div {
    width: 24px;
    height: 24px;
 }
  .card.row.big .info {
    padding: 0;
 }
  .card.row.big .info h3 {
    font-size: 16px;
 }
  .card.row.big .info h2 {
    color: #1a56db;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: auto;
 }
  .card.row.big .info .price-wrapper .old-price .rate {
    font-size: 12px;
 }
  .card.row.big .info .price-wrapper .old-price .price {
    font-size: 14px;
 }
  .card.row.big .info .price-wrapper .current-price {
    font-size: 18px;
    font-weight: 700;
 }
  .card.row.detail {
    flex-direction: column;
 }
 .card.row.detail .image-wrapper {
  width: 100%;
  min-width: initial;
  max-width: initial;
  max-height: fit-content;
}
 .card.row.detail .image-wrapper img {
  width: 100%;
  height: calc(100% - 92px);
  min-height: fit-content;
  aspect-ratio: 1;
}
  .card.row.detail .image-wrapper.small {
    width: 100%;
    height: 80px;
    flex-direction: row;
    max-height: 80px;
 }
  .card.row.detail .image-wrapper.small img {
    max-width: 120px !important;
    height: 80px;
    aspect-ratio: 1/1;
    flex-direction: row;
 }
  .card.row.detail .info {
    padding: 12px 0;
    gap: 14px;
 }
  .card.row.detail .info h3 {
    font-size: 18px;
 }
  .card.row.detail .info h2 {
    font-size: 12px;
 }
  .card.row.detail .info .price-wrapper span {
    font-size: 14px;
 }
  .card.row.detail .info .price-wrapper .old-price .rate {
    font-size: 12px;
 }
  .card.row.detail .info .price-wrapper .old-price .price {
    font-size: 14px;
 }
  .card.row.detail .info .price-wrapper .current-price {
    font-size: 16px;
    font-weight: 700;
 }
  .buy-item-button-wrapper {
    padding: 16px;
    border-radius: 6px;
    gap: 16px;
 }
  .buy-item-button-wrapper .purchase-wrapper {
    gap: 8px;
 }
  .buy-item-button-wrapper .purchase-wrapper .purchase-quantity {
    gap: 6px;
 }
  .buy-item-button-wrapper .purchase-wrapper .purchase-quantity label {
    font-size: 14px;
 }
  .buy-item-button-wrapper .purchase-wrapper .purchase-quantity input {
    padding: 4px 8px;
    width: 40px;
 }
  .buy-item-button-wrapper .purchase-wrapper .price {
    font-size: 16px;
 }
  .buy-item-button-wrapper .action-buttons {
    gap: 8px;
    flex-direction: column;
 }
  .buy-item-button-wrapper .action-buttons button {
    padding: 10px;
    font-size: 14px;
 }
  .page-nav button {
    width: 28px;
    height: 28px;
    font-size: 12px;
 }
  .filter-button-list button {
    font-size: 12px;
 }
  .wrapper .info-wrapper {
    padding: 14px;
    gap: 8px;
 }
  .wrapper .info-wrapper .info-input {
    flex-wrap: wrap;
    padding-right: 0px;
    min-height: fit-content;
    height: 32px;
 }
  .wrapper .info-wrapper .info-input label {
    min-width: 78px;
    font-size: 14px;
 }
  .info-wrapper .info-input.result label {
    min-width: fit-content;
 }
  .wrapper .info-wrapper .info-input.long-width {
    width: 100%;
 }
  .input {
    font-size: 12px;
    padding: 6px 0;
 }
  .flex-row-wrapper {
    flex-direction: column;
    gap: 12px;
    align-items: center;
    justify-content: center;
 }
  .flex-row-wrapper .info-content-box-wrapper {
    box-sizing: border-box;
 }
  .info-wrapper .info-input > .check-wrapper > label {
    word-break: break-all;
    text-wrap: wrap;
    align-self: flex-end;
 }
  .category-title-wrapper h1 {
    flex-direction: column;
    align-items: flex-start;
    font-size: 18px;
 }
  .category-title-wrapper h1 span {
    font-size: 12px;
 }
  .promotion-item-wrapper.health.row {
    min-width: 100%;
 }
  .promotion-item-wrapper.health.row.top-down-row {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
 }
  .promotion-item-wrapper.health.row.top-down-row img {
    width: 100%;
 }
  .promotion-item-wrapper.health.row.top-down-row .button-group-column {
    margin-left: 0;
    margin-top: 12px;
    gap: 12px;
 }
  .qna-wrapper.health-check .content-wrapper {
    flex-direction: column;
 }
  .qna-wrapper.health-check .content-wrapper img {
    width: 100%;
 }
  .qna-wrapper.health-check .content-wrapper .row-wrapper.is_step {
    gap: 12px;
 }
  .qna-wrapper.health-check .content-wrapper .row-wrapper.is_step .step-item {
    width: 100%;
    box-sizing: border-box;
 }
  .qna-wrapper .content-wrapper .column-wrapper li p {
    flex-direction: column;
 }
  .qna-wrapper .content-wrapper .column-wrapper li p span {
    min-width: 100%;
    max-width: 100%;
 }
  .qna-wrapper .content-wrapper #map {
    max-width: 100% !important;
 }
  #daumRoughmapContainer1609824181397 {
    max-width: 100% !important;
 }
  .mobile-column-force {
    flex-direction: column !important;
 }
 .mobile-column-force > span{
  white-space: nowrap;
 }
  .qna-wrapper.health-check .content-wrapper .row-wrapper.is_step .step-item {
    min-width: 100%;
    max-width: 100%;
 }
  .date-table-wrapper {
    width: 100%;
    overflow: auto;
    align-items: flex-start;
 }
  .date-table-wrapper .flex-row-wrapper {
    flex-direction: row;
    position: sticky;
    left: 0;
    right: 0;
 }
  .date-table-wrapper table.date-table {
    min-width: fit-content;
    table-layout: auto;
 }
  .date-table-wrapper table.date-table tbody tr td {
    min-width: fit-content;
 }
  .date-table-wrapper table.date-table tbody tr td span {
    min-width: fit-content;
 }
  .section .item-list.all .promotion-item-wrapper {
    max-width: 100%;
    min-width: 100%;
 }
  .section {
    gap: 16px;
 }
  .section .item-list {
    gap: 12px;
    width: calc(100svw - 32px);
 }
  .section .item-list.all {
    flex-direction: column;
 }
  .section .item-list.all .row-card-wrapper {
    gap: 12px;
    flex-wrap: wrap;
 }
  .main-title-wrapper {
    gap: 8px;
 }
  .main-title-wrapper > div.icon-wrapper {
    width: 42px;
    height: 42px;
 }
  .main-title-wrapper .title-item-wrapper {
    gap: 6px;
 }
  .main-title-wrapper .title-item-wrapper h2 {
    font-size: 18px;
 }
  .main-title-wrapper .title-item-wrapper h4 {
    font-size: 12px;
    max-width: 100%;
    font-weight: 500;
 }
  .wrapper {
    padding: 0 16px;
    gap: 24px;
    padding-top: 184px;
 }
  .wrapper .slider {
    border-radius: 4px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: fit-content;
    display: flex;
    aspect-ratio: 3.2;
 }
  .wrapper .slider.white {
    filter: brightness(0) saturate(100%) invert(100%) sepia(99%) saturate(0%) hue-rotate(51deg) brightness(105%) contrast(100%) !important;
 }
  .wrapper .slider.green {
    filter: brightness(0) saturate(100%) invert(53%) sepia(49%) saturate(421%) hue-rotate(54deg) brightness(99%) contrast(90%);
 }
  .wrapper .slider.black {
    filter: brightness(0) saturate(100%) invert(8%) sepia(16%) saturate(935%) hue-rotate(125deg) brightness(90%) contrast(88%);
 }
  .wrapper .slider.gray {
    filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(511%) hue-rotate(135deg) brightness(82%) contrast(83%);
 }
  .wrapper .container {
    flex-direction: column;
    gap: 16px;
 }
  .wrapper .container .content-section {
    border-radius: 4px;
    gap: 12px;
    padding:10px 12px;
  } 
  .wrapper .container .content-section.notice {
    flex: 1;
    gap: 8px;
 }
  .wrapper .container .content-section h2 {
    font-size: 16px;
 }
  .wrapper .container .content-section h2 a {
    font-size: 10px;
    padding: 5px 10px;
 }
  .wrapper .container .content-section .content-wrapper {
    gap: 10px;
 }
  .wrapper .container .content-section .content-wrapper h3 {
    font-size: 14px;
 }
  .wrapper .container .content-section .content-wrapper .item-list {
    gap: 8px;
 }
  .wrapper .container .content-section .content-wrapper .item-list.is-item {
    padding: 12px 16px;
    border-radius: 4px;
 }
  .wrapper .container .content-section .content-wrapper .item-list.is-item > div {
    font-size: 12px;
    font-weight: 500;
 }
  .wrapper .container .content-section .content-wrapper .item-list.is-item > div span {
    height: auto;
 }
  .wrapper .container .content-section .content-wrapper .item-list.is-item > div b {
    font-size: 12px;
 }
  .wrapper .container .content-section .content-wrapper .item-list .item {
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    gap: 6px;
 }
  .wrapper .container .content-section .content-wrapper .item-list .item > div {
    width: 20px;
    height: 20px;
 }
  .wrapper .container .content-section .notice-list li {
    padding: 6px 0;
 }
  .wrapper .container .content-section .notice-list li a {
    color: #505360;
    font-size: 14px;
    font-weight: 400;
 }
  .wrapper .promotion-img {
    border-radius: 4px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 24px;
    height: initial;
    display: flex;
    aspect-ratio: 10.6666666667;
 }
  .wrapper .promotion-img.white {
    filter: brightness(0) saturate(100%) invert(100%) sepia(99%) saturate(0%) hue-rotate(51deg) brightness(105%) contrast(100%) !important;
 }
  .wrapper .promotion-img.green {
    filter: brightness(0) saturate(100%) invert(53%) sepia(49%) saturate(421%) hue-rotate(54deg) brightness(99%) contrast(90%);
 }
  .wrapper .promotion-img.black {
    filter: brightness(0) saturate(100%) invert(8%) sepia(16%) saturate(935%) hue-rotate(125deg) brightness(90%) contrast(88%);
 }
  .wrapper .promotion-img.gray {
    filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(511%) hue-rotate(135deg) brightness(82%) contrast(83%);
 }
  .row-promotion-item-list {
    gap: 16px;
    flex-wrap: wrap;
 }
  .row-promotion-item-list img {
    width: calc(50% - 16px);
    flex: 1;
    object-fit: cover;
 }
 .card.row {
  max-width: 100% !important;
  min-width: 100% !important;
  }
  .section > .title-wrapper + .item-list.all{
    margin-top: 0;
  }
  .detail-section .detailMore button{
    white-space: nowrap;
    width: fit-content;
    height: 36px;
    padding : 0 12px !important;
  }
  .detail-section .detail-content-wrapper img {
    max-width: 100%;
    width: 100% !important;
    min-width: 100%;
    height: fit-content !important;
    object-fit: contain;
  }
  .info-content-box-wrapper ul li{
    margin-left: 18px;
  }

  
  .mobile-none {
    display: none !important;
  }
  .header-all-wrapper .navbar-right a.mobile-none {
    display: none !important;
  }
}


/** 2025-06-17 추가 **/
a.button.red-strock.pc-none {
  display: none !important;
}

@media screen and (max-width: 600px) {
  a.button.red-strock.pc-none {
      display: flex !important;
      border: 1px solid #f32b2b !important;
      color: #f32b2b !important;
      justify-content: center !important;
      flex-direction: row !important;
  }
}

/** 2025-06-18 추가 **/
#main-slider{
  aspect-ratio: 16/3.5;
  min-height: 400px;
}
@media screen and (max-width: 600px) {
  #main-slider{
    aspect-ratio: initial;
    min-height: initial;
  }
}

/** 2025-07-11 추가 **/
.hr{
  margin : 2px 0;
  border: none;
  border-top: 1px solid #ccc;
  width: 100%;
}
.option-item-list-wrapper{
  display: flex; flex-direction: column; gap: 8px; width: 100%;
}
.option-list {
  display: flex;
  box-sizing: border-box;
  flex : 1;
  }
.option-list h2{
  display: flex;
  width: 100%;
  line-height: 125%;
  align-items: flex-start;
}
.option-list h2 button {
  background-color: transparent; margin-left: auto;
}
.option-list h2 button .closeIcon{
  width: 10px; height: 10px;
  filter: brightness(0) saturate(100%) invert(72%) sepia(1%) saturate(0%) hue-rotate(42deg) brightness(94%) contrast(91%) !important;
}
.option-list .option-list-item-info {
  width: 100%;
}
.option-list .option-list-item-info p{
    display: flex;
  width: 100%;
  align-items: center;
  gap : 4px;
}
.option-list .option-list-item-info p .closeIcon {
  width: 10px !important;
  height: 10px !important;
  margin-left: auto;
  filter: brightness(0) saturate(100%) invert(72%) sepia(1%) saturate(0%) hue-rotate(42deg) brightness(94%) contrast(91%) !important;
}
.option-list .option-list-item-buy-count-and-price {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.option-list .option-list-item-buy-count-and-price .price-wrapper .item-data .input {
  height: fit-content;
  min-height: 28px;
}

.option-list .option-list-item-buy-count-and-price .price-wrapper button .closeIcon{
  width: 10px;
  height: 10px;
  margin-left: auto;
  filter: brightness(0) saturate(100%) invert(72%) sepia(1%) saturate(0%) hue-rotate(42deg) brightness(94%) contrast(91%) !important;
}

.option-list p b.label {
  display: inline-block;
  min-width: 102px;
}
.option-list p b.label.smallWidth {
  min-width: 72px;
}

.option-list .option-list-item-buy-count-and-price p {
  font-size: 16px;
  color: #004aa0;
  padding:0;
  margin:0 !important;
}
.option-list .option-list-item-buy-count-and-price .price-wrapper{
  justify-content: flex-start !important;
  align-items: center !important;
}
.option-list.info-content-box-wrapper h2{
  white-space: wrap;
  font-size: 12px;
}
.option-list.no-padding{
  padding: 0 !important;
  background-color: transparent !important;
  border: none !important;
}
.product-with-option-wrapper-for-cart{
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;  
}
.option-list .option-list-item-buy-count-and-price p.option-price{
  margin-left: auto !important;
}
@media screen and (max-width: 600px) {
     
   .option-list .option-list-item-buy-count-and-price .price-wrapper button{
    padding : 0;
   }
 .option-list .option-list-item-buy-count-and-price .price-wrapper button .closeIcon{
  width: 10px;
  height: 10px;
  margin-left: 0;
}
 .option-list-wrapper{
    flex-direction: column;
    align-items: flex-start !important;
  }
  .option-list {
    width: 100%;
    max-width: 100%;
  }
  .option-list p b.label {
    min-width: 82px;
  }
.purchase-quantity .option-list-wrapper{
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.option-list h2 button .closeIcon{
  width: 10px; height: 10px;
}
.option-list .option-list-item-buy-count-and-price .price-wrapper{
  justify-content: space-between !important;
}
.option-list .option-list-item-buy-count-and-price .price-wrapper p:last-of-type{
}
.option-list h2{
  font-size: 14px !important;
}
.option-list hr{
  margin : 6px 0;
}
.option-list .option-list-item-buy-count-and-price{
  align-items: flex-start;
  flex-direction: column;
  width: 100%;

}
.option-list .option-list-item-buy-count-and-price p {
  font-size: 14px;
}
.option-list .option-list-item-buy-count-and-price p.option-price{
  margin-left: auto;
  font-size: 16px;
  margin-top: 4px;
}
.option-list .option-list-item-buy-count-and-price p.row-wrapper{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

}

.table-wrapper .table-row.data .item .item-data .product-with-option-wrapper-for-cart .bedge{
  width: fit-content !important;
}
.table-wrapper .table-row.data .item .item-data .product-with-option-wrapper-for-cart hr{
  margin : -4px 0 !important;
}

.card.row.detail .image-wrapper.view{
      min-width: 520px;
      justify-content: flex-start;
}
.card.row.detail .image-wrapper.view img{
  aspect-ratio: 1/1;
  object-fit: contain;
  max-height: fit-content;
}
.buy-item-button-wrapper.view{
  min-height: 50%;
}
.card.row.detail .info.view{
  max-width: calc(100% - 520px - 24px);
  box-sizing: border-box;
}
.card.row.detail .info.view .price-wrapper{
  width: 100%;
}
@media screen and (max-width: 600px) {
  .card.row.detail .info.view{
    max-width: 100%;
  } 
}