@charset "utf-8";
/* CSS Document */

/* 메인 ----------------------------------------- */
.main-left-mid {
  /* min-height: 732px; */
	min-height: 532px;
}

table tbody:hover {
  scrollbar-width: auto;
}

/* 장바구니 --------------------------------------------- */
.main-right-cart-mid { height: 302px; width: 100%; border: 1px solid #dadcde; border-radius: 8px; overflow: hidden; margin-top: 12px; }

	.main-right-cart-mid table tbody { display: block; /* max-height: 320px; */ /*max-height: 220px;*/ max-height: 266px; overflow-y: scroll; overflow-x: hidden; }
	.main-right-cart-mid tbody { position: relative; scrollbar-width: none; }
	.main-right-cart-mid tbody:hover { scrollbar-width: auto; }
	.main-left-mid-bottom table tbody:hover,
	.main-right-cart-mid table tbody:hover { overflow-y: scroll; }
	tr.deco_red_line { background-color: rgba(255, 182, 193, 0.2); text-decoration: line-through; }


td button.delete {
	position: relative;
	width: 24px; height: 24px; background-color: #ffffff; border-radius: 1000px; border: 1px solid; border-color: #f85f51; box-shadow: 0px 1px 0px #0000001a;  /*vertical-align: sub;*/
	cursor: pointer; transition: all 0.3s ease-in-out; padding: 0; display: inline-flex; /* inline-flex로 변경 */
	align-items: center; justify-content: center; vertical-align: middle; /* 수직 중앙 정렬 */ }
	td button.delete:hover { background-color: #f85f51; box-shadow: 0px 4px 8px rgba(248, 95, 81, 0.5); }
	td button.delete:hover div { background-color: #ffffff; transition: background-color 0.3s ease-in-out; }
	td button.delete:active { transform: scale(1.05); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2); }

	td button.delete .ic-minus { position: relative; width: 10px; height: 2px; background-color: #f85e50; border-radius: 1000px; }
		td button.delete:hover .ic-minus { background-color: #ffffff; /* 호버 시 마이너스 아이콘 색상 변경 */ }



/* 클릭 시 버튼이 눌리는 효과 */
.main-left-top {
  display: flex;
  justify-content: space-between;
}

.main-left-top .main-left-top-left button { background-color: #f0f2f4; border: 1px solid #CCC; border-radius: 8px;
  padding: 10px 0px; margin-right: 8px; cursor: pointer; font-size: 15px; font-weight: 500; color: #333; height: 40px; }
	.main-left-top .main-left-top-left button.active { background-color: #f8b428; border: 1px solid #ebac27; color: #ffffff; font-weight: 700; }
	.main-left-top .main-left-top-left button:hover { background-color: #747474; border: 1px solid #e4e7e9; color: #ffffff; font-weight: 700; }
	.main-left-top .main-left-top-left button .btn_span_number { padding-left: 4px; font-size: 12px; color: red; animation: smooth-blink 1s ease-in-out infinite alternate; } /* 주문추천 숫자 */

.star { margin-left: 4px; }

.main-left-top .main-left-top-left button div {
  background-image: url(/img/Btn_Star_Off.png);
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center left;
  background-size: contain;
  display: inline-block;
  vertical-align: top;
}

.main-left-top .main-left-top-left button.active div {
  background-image: url(/img/Btn_Star_On.png);

}

.main-left-top .main-left-top-left button.favorite div {
  background-image: url(/img/yellow_star.png);

}

.main-left-top .main-left-top-right {
  display: flex;
  gap: 12px;
}

.main-left-top .main-left-top-right span {
  font-size: 12px;
  color: #6c6f72;
}

.main-left-top .main-left-top-right span div {
  display: inline-block;
  width: 17px;
  height: 17px;
  font-size: 10px;
  color: #ffffff;
  font-weight: 500;
  border-radius: 4px;
  text-align: center;
  align-content: center;
}

div.blue-mini-box {
  display: inline-block;
  color: #ffffff;
  background-color: #4b96f0;
  border: 1px solid #4588da;
}

div.green-mini-box {
  color: #ffffff;
  display: inline-block;
  background-color: #8ecc58;
  border: 1px solid #81b951;
}

div.orange-mini-box {
  color: #ffffff;
  display: inline-block;
  background-color: #eaa03c;
  border: 1px solid #d49138;
}

div.gray-mini-box {
  color: #ffffff;
  display: inline-block;
  background-color: #b4b4b4;
  border: 1px solid #a3a3a4;
}

.main-left-top .main-left-top-right span div.blue-mini-box {
  background-color: #4b96f0;
  border: 1px solid #4588da;
}

.main-left-top .main-left-top-right span div.green-mini-box {
  background-color: #8ecc58;
  border: 1px solid #81b951;
}

.main-left-top .main-left-top-right span div.orange-mini-box {
  background-color: #eaa03c;
  border: 1px solid #d49138;
}

.main-left-top .main-left-top-right span div.gray-mini-box {
  background-color: #b4b4b4;
  border: 1px solid #a3a3a4;
}







.main-left-mid-top {
  margin-top: 16px;
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
}

.main-left-mid-top-left {
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  color: #3b3f43;
}
	.main-left-mid-top-left span#PD_SEARCH_PHARM_LIST_CNT { color: #000; font-weight: bold; }

.main-left-mid-top-right {
  font-size: 13px;
  font-weight: 400;
  color: #9d9fa1;
}

.main-left-mid-top-right img {
  vertical-align: text-top;
}

.main-left-mid-top-right button {
  background: transparent;
  border: none;
  cursor: pointer;
  color: #6c6f72;
}

.mgl10 {
  margin-left: 10px;
}

.main-left-mid-top-right button.active {
  background: transparent;
  border: none;
  cursor: pointer;
  color: #3b3f43;
  font-weight: 700;
}

/* 테이블 컨테이너 div **************************************************************************************/

.main-left-mid-bottom { border: 1px solid #dadcde; border-radius: 8px; overflow: hidden; height: 582px; }

	/* 검색결과 테이블 ----------------------------------------------------- */
	.main-left-mid-bottom table { width: 100%; position: relative; max-height: 582px; border-collapse: collapse; border-spacing: 0; }
	.main-left-mid-bottom table::-webkit-scrollbar { z-index: -1; }
	.main-left-mid-bottom table tbody { display: block; max-height: 544px; overflow-y: scroll; overflow-x: hidden; scrollbar-width: auto; }
	.main-left-mid-bottom table tbody:hover { scrollbar-width: auto; }
	
	.main-left-mid-bottom table thead, .main-left-mid-bottom table tbody { width: 907px; }

	.main-left-mid-bottom table tr:first-child { border-top: none; }		
	.main-left-mid-bottom table tr { border-top: 1px solid #dcdee0; }
	.main-left-mid-bottom table tr:last-child { border-bottom: 1px solid #dcdee0; }

	.main-left-mid-bottom table thead tr,
	.main-left-mid-bottom table tbody tr { display: table; width: 100%; white-space: nowrap; }
	
	.main-left-mid-bottom table thead tr th { background-color: #f6f8fa; font-size: 13px; font-weight: 600; padding: 10px 20px; height: 36px; color: #0a0f1480; vertical-align: middle; }
	.main-left-mid-bottom table tbody tr td,
	.main-left-mid-bottom table thead tr th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	

	.main-left-mid-bottom table tbody tr:hover { background-color: #f8f9fa;	}
	.main-left-mid-bottom table tbody tr.active { background-color: #f4f6ff; }
	.main-left-mid-bottom table tbody tr td { font-size: 14px; font-weight: 400; padding-left: 20px; padding-right: 20px; color: #0a0f14; height: 44px; align-content: center; vertical-align: middle; }

	.main-left-mid-bottom table tbody tr td input[type="text"] { width: 42px; height: 30px; border-radius: 6px; border: 1px solid #b4b6b8; text-align: center; }
	
	.main-left-mid-bottom table tbody tr td:first-child,
	.main-left-mid-bottom table thead tr th:first-child { max-width: 116px; width: 116px; text-align: left; }
	.main-left-mid-bottom table tbody tr td:first-child { font-size: 12px; }

	.main-left-mid-bottom table tbody tr td:nth-child(2),
	.main-left-mid-bottom table thead tr th:nth-child(2) { max-width: 100px; width: 100px; text-align: left; padding-left:0; }

	.main-left-mid-bottom table tbody tr td:nth-child(3), /* 제품명 */
	.main-left-mid-bottom table thead tr th:nth-child(3) { width: 178px; max-width: 178px; text-align: left; cursor: pointer; 
	  white-space: normal; /* 줄바꿈 허용 */ -webkit-line-clamp: 2; /* 최대 2줄 제한 */ -webkit-box-orient: vertical; text-overflow: ellipsis; /* 2줄을 초과하면 말줄임표 표시 */ padding-left:0; }
	.main-left-mid-bottom table tbody tr:hover td:nth-child(3) { font-weight: 700; color: #000; transition: all 0.3s ease-in-out; }

	.main-left-mid-bottom table tbody tr td:nth-child(4) { max-width: 95px; width: 95px; padding-left: 0; padding-right: 0; text-align: left; 
		white-space: normal; /* 자동 줄바꿈 허용 */ word-wrap: break-word; /* 긴 단어도 줄바꿈 */ overflow-wrap: break-word; /* 추가적인 줄바꿈 지원 */ font-size: 12px; }
	.main-left-mid-bottom table thead tr th:nth-child(4) { max-width: 95px; width: 95px; padding-left: 0; padding-right: 0; text-align: left; }

	.main-left-mid-bottom table tbody tr td:nth-child(5) { max-width: 55px; width: 55px; text-align: center; padding-left: 0; padding-right: 0; }
	.main-left-mid-bottom table thead tr th:nth-child(5) { max-width: 55px; width: 55px; text-align: left; padding-left: 5px; padding-right: 0; }
	.main-left-mid-bottom table tbody tr td:nth-child(5) div.box-wrap { justify-content: right; display: flex; width: 44px; gap: 2px; }
	.main-left-mid-bottom table tbody tr td:nth-child(5) div { width: 20px; height: 20px; text-align: center; align-content: center; border-radius: 4px; }

	.main-left-mid-bottom table tbody tr td:nth-child(6) { width: 70px; text-align: right; padding-left: 0; padding-right: 0; }
	.main-left-mid-bottom table thead tr th:nth-child(6) { max-width: 70px; width: 70px; text-align: right; padding-left: 15px; padding-right: 0; }
	.main-left-mid-bottom table tbody tr td:nth-child(6) img { margin-left: 1px; }

	.main-left-mid-bottom table tbody tr td:nth-child(7),
	.main-left-mid-bottom table thead tr th:nth-child(7) { max-width: 63px; width: 63px; text-align: right; padding-left: 0; padding-right: 8px; }
	.main-left-mid-bottom table tbody tr td:nth-child(7) { font-weight: 700; }
	.main-left-mid-bottom table tbody tr td:nth-child(7) img { margin-left: 0.5px; }
	.main-left-mid-bottom table tbody tr td:nth-child(7) button.empty-btn { width: 52px; height: 22px; background: #ffeeec; border: 1px solid #e7d8d7; color: #f85f51; font-size: 12px; font-weight: 700; text-align: center; border-radius: 6px; padding: 0; margin-right: -6px; }

	.main-left-mid-bottom table tbody tr td:nth-child(8), /* 수량 컬럼 */
	.main-left-mid-bottom table thead tr th:nth-child(8) { max-width: 50px; width: 50px; text-align: center; padding-left: 0; padding-right: 0; }

	.main-left-mid-bottom table tbody tr td:nth-child(9), /* 관심 컬럼 */
	.main-left-mid-bottom table thead tr th:nth-child(9) { max-width: 32px; width: 32px; text-align: center; padding-left: 0; padding-right: 0; }
	.main-left-mid-bottom table tbody tr td:nth-child(9) { padding-left: 5px; }

	.main-left-mid-bottom table tbody tr td:nth-child(10), /* 비고 컬럼 */
	.main-left-mid-bottom table thead tr th:nth-child(10) { width: 50px; text-align: center; padding-left: 0; padding-right: 0; }

	.main-left-mid-bottom table tbody tr td:nth-child(11), /* 추가버튼 */
	.main-left-mid-bottom table thead tr th:nth-child(11) { text-align: left; padding-left: 0; padding-right: 0; position: relative; width: 50px; /* 78 */ }
	.main-left-mid-bottom table thead tr th:nth-child(11) { padding-left: 12px; }
	.main-left-mid-bottom table tbody tr td:nth-child(11) { padding-right: 0px /*12*/; text-align: left; }
	.main-left-mid-bottom table tbody:hover tr td:nth-child(11) { padding-right: 0; }
	
	.main-left-mid-bottom table tbody tr td:nth-child(12),
	.main-left-mid-bottom table thead tr th:nth-child(12) { text-align: center; padding-left: 0; padding-right: 0; position: relative; }
		button.btn_pd_detail { width: 30px !important; }
	/* ----------------------------------------------------------------------------------------------------------- */
	


	/*추가버튼에 대해서만 해제*/
	.main-left-mid-bottom table tbody tr td:nth-child(10) { text-overflow: initial;  /* 또는 text-overflow: clip; */ }

	.main-left-mid-bottom table tbody:hover tr td:nth-child(10) { text-overflow: initial; overflow: visible; }

	/* 테이블-버튼 --------------------------------------------- */
	.main-left-mid-bottom table tbody tr td button {
	  background-color: #ffffff; border-radius: 1000px; border: 1px solid #c8cacc; width: 48px; height: 30px; cursor: pointer; box-shadow: 0px 1px 0px #0000001a; transition: all 0.3s ease-in-out; }

		/* 기본 hover 상태 */
		.main-left-mid-bottom table tbody tr td button:hover { background-color: #374173; color: #ffffff; box-shadow: 0px 4px 10px rgba(55, 65, 119, 0.4); }
		/* active 클래스가 있을 때 */
		.main-left-mid-bottom table tbody tr.active td button { background-color: #ffffff; color: #374173; }
		/* active 상태에서 hover될 때 */
		.main-left-mid-bottom table tbody tr.active td button:hover { background-color: #374173; color: #ffffff; }
		.main-left-mid-bottom table tbody tr td::after {
		  content: ""; position: absolute; height: 1px; width: 15px; background-color: #000; right: -15px; top: -1px; z-index: 1000; }

	/* 테이블 - 아이콘 */
	div.star-icon {
	  background-image: url(/img/_Btn_Favorite_OFF.png);
	  width: 24px; height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat; cursor: pointer; }

	.favorite div.star-icon, div.star-icon:hover { background-image: url(/img/_Btn_Favorite_ON.png);
	  width: 24px; height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat; }


/**********************************************************************************************************************/
.main-left-bottom {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
}

.main-left-bottom select {
  width: 74px;
  height: 32px;
  padding-left: 8px;
  border-radius: 6px;
  border: 1px solid #C8CACC;
}

.custom-select {
  position: relative;
  font-size: 1.15rem;
  width: 74px;
  height: 32px;
}

.custom-select select {
  appearance: none;
  background-color: #fff;
  border: 1px solid #caced1;
  border-radius: 0.25rem;
  color: #000;
  cursor: pointer;
  position: absolute;
}

.custom-select::after {
  content: '';
  width: 14px;
  height: 16.5px;
  background-image: url(/img/ic-arrow-down.svg);
  position: absolute;
  top: 50%;
  right: 9px;
  transform: translateY(-50%);
  pointer-events: none;
}

.custom-select select:hover,
.custom-select select:focus {
  /*border-color: #007bff;*/
  border-color: #374173;
  outline: none;
  box-shadow: 0 0 0 2px rgba(55, 65, 115, 0.25);
}

.main-left-bottom button {
  background-color: #ffffff;
  border: 1px solid #c8cacc;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  width: 74px;
  height: 32px;
  cursor: pointer;
}

.main-right-order-history-top {
  display: flex;
}


div.wrapper .inner .main .main-right .main-right-cart .main-right-cart-top {
  color: #0a0f14;
  font-size: 20px;
  font-weight: 700;
  position: relative;
	margin-right: 0px;
}
.main-right-order-history-top h1 {
  color: #0a0f14;
  font-size: 20px;
  font-weight: 700;
  position: relative;
	margin-right: 34px;
}
.main-right-cart-top span.req-next-month { float: right; font-size: 14px; }
div.main-right-cart-top { display: flex; }
div.main-right-cart-top div.cart_title { margin-top: 6px; white-space: nowrap; width: 76px; }
div.main-right-cart-top input.dmemo { margin-left: 10px; border: 1px solid #b4b6b8; border-radius: 6px; width: 340px; height: 30px; padding: 0 0 0 5px;  }

.main-right-order-history-top h1::after {
  content: "";
  position: absolute;
  top: 3px;
  right: -19px;
  width: 2px;
  height: 12px;
  background-color: #dcdee0;
}

.main-right-order-history-top div {
  font-size: 15px;
  color: #6c6f72;
  font-weight: 600;
  line-height: 19px;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

/* 주문 이력 테이블 ------------------------------------------------------------------------------- */
.main-right-order-history-bottom { width: 427px; /* height: 212px; */ height: 216px; border: 1px solid #dadcde; border-radius: 8px; overflow: auto; margin-top: 12px; }

	.main-right-order-history-bottom table { width: 627px; /* 427px */ table-layout: fixed; /* 테이블 레이아웃 고정 */ }	
	.main-right-order-history-bottom table tbody { display: block; 	/* max-height: 180px; */ overflow-y: scroll; overflow-x: hidden; }
	.main-right-order-history-bottom tbody { position: relative; scrollbar-width: none; }
	.main-right-order-history-bottom tbody:hover { scrollbar-width: auto; }
	.main-right-order-history-bottom table tbody:hover { overflow-y: scroll; }

	.main-right-order-history-bottom table tr { border-top: 1px solid #dcdee0; }
	.main-right-order-history-bottom table tr:first-child { border-top: none; }
	.main-right-order-history-bottom table tr:last-child { border-bottom: 1px solid #dcdee0; }

	.main-right-order-history-bottom table tr td,
	.main-right-order-history-bottom table tr th { text-align: center; }

	/*.main-right-order-history-bottom table thead tr {*/
	/*  height: 36px; !* 헤더 높이 고정 *!*/
	/*  display: table-row;*/
	/*}*/
	.main-right-order-history-bottom table thead tr { height: 36px!important; line-height: 36px; }
	.main-right-order-history-bottom table tbody tr { height: 44px !important; line-height: 44px; }

	.main-right-order-history-bottom table thead tr th {
	  /* font-family: "Pretendard-SemiBold", Helvetica, sans-serif; */
	  background-color: #f6f8fa;
	  font-size: 13px;
	  font-weight: 600;
	  padding: 0 20px; /* 좌우 패딩만 유지 */
	  border-bottom: 1px solid #dcdee0;
	  vertical-align: middle;
	  color: #0a0f1480;
	}

	.main-right-order-history-bottom table thead,
	.main-right-order-history-bottom table tbody tr {
	  display: table;
	  width: 627px; /* 427 */
	  table-layout: fixed;
	}

	.main-right-order-history-bottom table tbody tr td {
	  font-size: 14px;
	  font-weight: 400;
	  height: 44px;
	  line-height: 44px;
	  padding: 0 20px; /* 좌우 패딩만 유지 */
	  vertical-align: middle;
	}

	.main-right-order-history-bottom table tbody tr td:first-child,
	.main-right-order-history-bottom table thead tr th:first-child {
	  width: 140px;
	  text-align: left;
	}

	.main-right-order-history-bottom table tbody tr td:nth-child(2),
	.main-right-order-history-bottom table thead tr th:nth-child(2) {
	  width: 70px;
		text-align: right;
	}

	.main-right-order-history-bottom table tbody tr td:nth-child(3),
	.main-right-order-history-bottom table thead tr th:nth-child(3) {
	  width: 114px; text-align: right;
	}

	.main-right-order-history-bottom table tbody tr td:nth-child(4) {
	  padding: 0;
	  padding-right: 20px;
	  text-align: right;
	}

	.main-right-order-history-bottom table thead tr th:nth-child(4) {
	  text-align: right;
	  padding-left: 12px;
	}

/**********************************************************************************************************************/

.main-right-cart-mid table thead tr th {
  /* font-family: "Pretendard-SemiBold", Helvetica, sans-serif; */
  background-color: #f6f8fa;
  font-size: 13px;
  font-weight: 600;
  border-bottom: 1px solid #dcdee0;
  color: #0a0f1480;
  height: 36px;
  line-height: 36px;
}

.main-right-cart-mid table thead, .main-right-cart-mid table tbody tr {
  display: table;
  width: 100%;
}

.main-right-cart-mid table, .main-right-cart-mid table tbody {
  width: 100%;
}

.main-right-cart-mid table thead tr th:first-child,
.main-right-cart-mid table tbody tr td:first-child {
  width: 50px; /* 삭제 버튼의 크기를 적절히 조정 */
  text-align: center; /* 가운데 정렬 */
  padding-left: 20px;
  padding-right: 0;
  min-width: 50px;
}

.main-right-cart-mid table tbody tr td {
  line-height: 44px;
  height: 44px;
  padding-left: 20px;
  font-size: 14px;
}

/*.main-right-cart-mid table tbody tr td:first-child {*/
/*  width: 220px;*/
/*}*/

/*.main-right-cart-mid table thead tr th:first-child {*/
/*  width: 220px;*/
/*}*/

.main-right-cart-mid table tbody tr td {
  line-height: 16px;
  height: 44px;
  padding-left: 20px;
  font-size: 14px;
  font-weight: 400;
  vertical-align: middle; /* 수직 중앙 정렬 */
  display: table-cell; /* 명시적으로 table-cell 지정 */
}

.main-right-cart-mid table tbody tr td input {
  width: 42px;
  height: 30px;
  border-radius: 6px;
  border: 1px solid #b4b6b8;
  text-align: right;
  vertical-align: middle; /* 수직 중앙 정렬 */
}

/*.main-right-cart-mid table thead tr th:nth-child(2) {*/
/*  text-align: left;*/
/*  padding-left: 9px;*/
/*  width: 51px;*/
/*}*/

/*.main-right-cart-mid table tbody tr td:nth-child(2) {*/
/*  padding-left: 0;*/
/*  width: 51px;*/
/*}*/

/* 제품명 위치 조정 */
.main-right-cart-mid table thead tr th:nth-child(2),
.main-right-cart-mid table tbody tr td:nth-child(2) {
  width: 200px; /* 제품명 칸 크기 조정 */
  text-align: left;
  padding-left: 20px;
}

/*.main-right-cart-mid table thead tr th:nth-child(3) {*/
/*  text-align: right;*/
/*  padding-left: 32px;*/
/*  width: 75px;*/
/*}*/

/*.main-right-cart-mid table tbody tr td:nth-child(3) {*/
/*  !*TODO max-width 고민*!*/
/*  width: 77px; text-align: right; max-width: 77px;*/
/*}*/

/* 수량 및 단가 위치 유지 */
.main-right-cart-mid table thead tr th:nth-child(3),
.main-right-cart-mid table tbody tr td:nth-child(3) {
  width: 75px;
  text-align: center;
  padding-left: 20px;
}

/*.main-right-cart-mid table tbody tr td:nth-child(4) {*/

/*  text-align: left;*/
/*  padding-left: 36px;*/
/*}*/

.main-right-cart-mid table thead tr th:nth-child(4),
.main-right-cart-mid table tbody tr td:nth-child(4) {
  /*width: 80px;*/
  text-align: left;
  padding-left: 20px;
}


.main-right-cart-mid table tr {
  border-bottom: 1px solid #dcdee0;
}

.main-right-cart-bottom {
  margin-top: 20px;
  display: flex;

  height: 44px;
  width: 100%;
  gap: 8px;
}

.main-right-cart-bottom .result {
  padding: 10px 20px;
  display: flex;
  width: 269px;
  height: 100%;
  background-color: #F6F8FA;
  border-radius: 8px;
  border: 1px solid #e9ecee;
  justify-content: space-between;
}

.result-left {
  color: #808387;
  font-weight: 600;
  line-height: 22px;
  font-size: 15px;
}

.result-right {
  font-size: 14px;
  color: #808387;
}

.result-right span {
  font-size: 20px;
  font-weight: 700;
  color: #0A0F14;
  margin-right: 2px;
}

.main-right-cart-bottom button {
  width: 150px;
  height: 100%;
  background-color: #374173;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}

/*TODO maybe 제거?*/
/* 호버 효과 */
.main-right-cart-bottom button:hover {
  background-color: #444f8a; /* 기존 색상보다 약간 밝게 */
  box-shadow: 0 4px 8px rgba(55, 65, 115, 0.2); /* 은은한 그림자 */
  transform: translateY(-1px); /* 살짝 떠오르는 효과 */
}

/* 클릭 효과 */
.main-right-cart-bottom button:active {
  background-color: #2f3660; /* 기존 색상보다 약간 어둡게 */
  box-shadow: 0 2px 4px rgba(55, 65, 115, 0.1); /* 그림자 줄이기 */
  transform: translateY(1px); /* 살짝 눌리는 효과 */
}



/* 상세보기 모달 -------------------------------------------------------------- */
.main-left-modal {
  background-color: white;
  width: 957px;
  height: 766px;
  position: absolute;
  left: 0; bottom: 0px;
  padding: 24px;
  border-radius: 12px;
  border: 2px solid #374173;
  display: none;
	z-index: 111;
}
	.main-left-modal:hover { border-color: #AAA; box-shadow: 0 0 4px #999; }

.main-left-modal.show {
  display: block;
  z-index: 222;
}

.main-left-modal h1 {
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: 700;
  color: #0A0F14;
} .main-left-modal h1:hover { cursor: pointer; }

.main-left-modal-content {
  display: flex;
  gap: 8px;
}

.main-left-modal-content-left {
  width: 216px;
  height: 216px;
} .main-left-modal-content-left:hover { cursor: pointer; }

.main-left-modal-content-left img {
  width: 216px;
  height: 216px;
  object-fit: contain;
  aspect-ratio: 1/1;
  border-radius: 8px;
  border: 1px solid #DADCDE;
}

.main-left-modal-content-right {
  border-radius: 8px;
  border: 1px solid #DADCDE;
  width: 685px;
  height: 216px;
  overflow: hidden;
  display: flex;

}

/**********************************************************************************************************************/
.main-left-modal-content-right table {
  width: 100%;
  height: 100%;
}

.main-left-modal-content-right table tr {
  border-top: 1px solid #DCDEE0;

}

.main-left-modal-content-right table tr td {
  padding-left: 8px;
  padding-right: 8px;
  height: 36px;
  padding-top: 10px;
  border-left: 1px solid #DCDEE0;
  font-size: 13px;
}

.main-left-modal-content-right table tr td.subject {

  background-color: #F6F8FA;
}

.main-left-modal-content-right table tr td:first-child {
  width: 88px;
  background-color: #F6F8FA;
  border-left: none;
}

.main-left-modal-content-right table tr td:nth-child(2) {
  width: 125px;

}

.main-left-modal-content-right table tr td:nth-child(3) {
  width: 88px;
  background-color: #F6F8FA;

}

.main-left-modal-content-right table tr td:nth-child(4) {
  width: 125px;

}

.main-left-modal-content-right table tr td:nth-child(5) {
  width: 258px;

}

.main-left-modal-content-right table tr:first-child {
  border-top: none;
}

.spacebtwn {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.content .spacebtwn { margin-top: 8px !important; }
.spacebtwn strong { margin-top: -8px; }

.spacebtwn span {
  font-size: 13px;
}

.main-left-modal-content-right .flex-box {
  display: flex;
  border-bottom: 1px solid #DCDEE0;
	height: 36px;
  /*box-sizing: border-box;*/
}

.main-left-modal-content-right .subject {

  background-color: #F6F8FA;
}

.main-left-modal-content-right .flex-box div.subject {
  width: 88px;
  height: 36px;
  line-height: 36px;
  background-color: #F6F8FA;
  padding-left: 8px;
  padding-right: 8px;
  font-size: 13px;
	border-bottom: 1px solid #DCDEE0;
}

.main-left-modal-content-right .flex-box div.content {
  width: 125px;
  height: 36px;
  padding-left: 8px;
  padding-right: 8px;
  line-height: 35px;
  border-left: 1px solid #DCDEE0;
  border-right: 1px solid #DCDEE0;
  font-size: 13px;
	overflow: auto;
}

.main-left-modal-content-right .flex-box div.content div { margin-top: 6px; }

.main-left-modal-content-right div.subject2 {
  width: 258px;
  height: 36px;
  font-size: 13px;
  line-height: 36px;
  padding-left: 8px;
  padding-right: 8px;
  background-color: #F6F8FA;
  border-bottom: 1px solid #DCDEE0;
}

.main-left-modal-content-right div.content2 {
  width: 258px;
  height: 72px;
  font-size: 13px;
  padding-left: 8px;
  padding-right: 8px;
  border-bottom: 1px solid #DCDEE0;
	overflow-y: auto;
}

.main-left-modal-content-right div.content2 .spacebtwn span {
  margin-top: 4px;
  line-height: 16px;
}

.main-left-modal-content-right div.content2 .spacebtwn button {
  margin-top: 20px;
}

.main-left-modal-content-right-left {
  width: 427px;
  height: 216px;
  /*border-right: 1px solid #DCDEE0;*/
}

/*111111111111111111111111111111111111111*/
.main-left-modal-content-right button {
  background-color: #ffffff;
  border: 1px solid #C8CACC;
  border-radius: 6px;
  padding: 5px 9px;
  cursor: pointer;
}

button.search-btn2 {
  width: 77px !important;
  padding: 5px;
}

button.search-btn-same {
  width: 77px !important;
  padding: 5px;
	float: right; margin: 4px -2px 0 0;
} button.search-btn-same:hover { border-color: #666; box-shadow: 0 0 4px #999; }

.main-left-modal-content-right button.request {
  height: 26px;
  line-height: 25px;
  padding: 0; margin-top: -10px;
  width: 40px;
}	.main-left-modal-content-right button.request:hover { border-color: #666; box-shadow: 0 0 4px #999; }

.main-left-modal-content-right button img {
  width: 11.4px;
  height: 11.4px;
  vertical-align: middle;
  margin-right: 2px;
}

/*상세 제품 정보*/

.main-left-modal-content-right div.green-mini-box {
  width: 20px;
  height: 20px;
  text-align: center;
  align-content: center;
  border-radius: 4px;
  line-height: 20px;
}
.main-left-modal-content-right div.gray-mini-box {
  width: 20px;
  height: 20px;
  text-align: center;
  align-content: center;
  border-radius: 4px;
  line-height: 20px;
}
.main-left-modal-content-right div.blue-mini-box {
  width: 20px;
  height: 20px;
  text-align: center;
  align-content: center;
  border-radius: 4px;
  line-height: 20px;
}
.main-left-modal-content-right div.orange-mini-box {
  width: 20px;
  height: 20px;
  text-align: center;
  align-content: center;
  border-radius: 4px;
  line-height: 20px;
}


.main-left-modal-content-right strong {
  font-weight: 700;
}

.main-left-modal-content-right-right {
  width: 100%;
}
	
	/* 성분, 효능용법  */
	.main-left-modal-content-right { display: flex; flex-direction: column; height: 100%; }
	.main-left-modal-content-right > div { flex: 1; }
	.main-left-modal-content-right div.subject2 { width: 100%; height: 100%; }
	.main-left-modal-content-right div.content2 { width: 100%; height: 100%; min-height: 298px; max-height: 255px; padding: 10px 20px; }
	.main-left-modal-content-right div.content2:nth-child(2) { min-height: 99px; }
	.main-left-modal-content-right-right { height: 444px; }
	.main-left-modal-content-right button { float:  right; margin-top: 5px;  }
	.main-left-modal-content-right-right > div:nth-child(3) > div.content2 > div > div { font-size: 12pt; line-height: 16pt; }

button.close-btn {
  position: absolute;
  right: 0;
  top: 0;
  background-color: transparent;
  border: none;
  width: 24px;
  height: 24px;
  padding: 6px;
  margin: 8px;
  cursor: pointer;
} button.close-btn:hover { border-radius: 4px; border-color: #666; box-shadow: 0 0 4px #999; }

button.close-btn img {
  width: 100%;
  height: 100%;
}


/* 상품목록-상태: 약가인하 - 가격 변동 표시 기본 스타일 ----------------------------------- */
.price-change {
  font-size: 14px;
  color: #666;
}

	.price-up {
	  color: #888888; /* 인상은 더 연한 회색으로 */
	  color: #898989; /* 연한 회색 */
	}

	.price-down {
	  color: #0550F8; /* 인하는 더 밝은 파란색으로 */
	  font-weight: 700; /* 볼드처리 */
	  color: #F8B428; /* 사이트에서 사용되는 노란색/황금색 */
	  font-weight: 700;
	}
	.main-left-mid-bottom table tbody tr:has(td.price-down) {
	  background-color: #FFF8E7; /* 인하: 은은한 황금빛 배경 */
	}

/* 상품목록-상태: 위해 ----------------------------------- */
.pdstatus {
  font-size: 14px;
  color: #666;
}

	.pdstatus-danger {
	  color: #D42E00;
	  font-weight: 700;
	} 
	.pdstatus-danger:hover { transition: all 0.1s ease-in-out; border: 1px solid #D42E00; border-radius: 12px; padding: 2px 4px; }
/* ------------------------------------------------------------------- */