.mypage {

input[type="radio"],
input[type="checkbox"] {
  appearance: radio;
  /* 명시적으로 설정 */
  -webkit-appearance: radio;
  -moz-appearance: radio;
  background-color: #fff;
  border: 1px solid #ccc;
  cursor: pointer;
}

input[type="radio"]:hover,
input[type="checkbox"]:hover {
  outline: none;
  border-color: #3182f6;
}
.user-container-wrap {
	position:relative;
	width:100vw;
	height:100vh;
	display:flex;
	justify-content:center;
	align-items:center;
	background:rgba(0,0,0,0.8);
	height:224px;
	background:linear-gradient(to right,#26A7DE,#AA94F8,#F5999B,#FFF16A);
}
.user-container {
	margin:20px auto !important;
	position:relative;
	width:1300px;
	height:144px;
	background:white;
	border-radius:20px;
	padding:28px 30px;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	box-shadow:0 4px 12px rgba(0,0,0,0.08);
}
.user-info {
	margin-bottom:10px;
	justify-content:space-between;
	align-items:center;
	text-align:center;
	font-size:20px !important;  
	color:#333;
	flex:1 1 100%;
}
.user-info strong {
  color: #FF7A00;
}
.user-info .company-id {
	background-color:#fff;
	font-size:14px !important;
	padding:2px 8px;
	border-radius:10px;
	border:1px solid #ccc;
	/* margin-left:8px; */
	color:#000;
}
.user-status-boxes-wrap {
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.user-status-boxes {
	display:flex;
	gap:158px;
	justify-content:space-between;
}
.user-status-item {
	display:flex;
	text-align:left;
	color:#555;
}
.txt-box {
	margin-left:8px;
}
.user-status-item .value {
	font-weight:600;
	color:#2F3438;
	margin-top:2px;
	font-size:18px !important;
	text-align:left;
}
.img-wrap {
	width:50px;
	height:50px;
	border-radius:50%;
	background-color:#F5F5F5;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	/* border:2px solid #d1d1d1;*/
}
.info-list {
	width:200px;
	color:#333;
}
.info-item {
	font-size:14px !important;
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:8px 30px;
	cursor:pointer;
}
.info-item .txt {
	margin-right:46px;
}
.info-item:hover {
	background-color:#f9f9f9;
}
.divider {
	height:1px;
	background-color:#e5e5e5;
	margin: 0 16px;
}
/* tab-wrap start */
.tabs {
	display:flex;
	/* border-bottom:1px solid #e0e0e0;*/
	justify-content:space-around;
	max-width:1300px;
	margin:0 auto;
}
hr.line-tabs {
	margin:0;
	border:solid #ddd;
	border-width:1px 0 0;
	height:0px;
	opacity:0.25;
}
.tab {
	padding:16px 16px;
	font-size:16px !important;
	color:#999 !important;
	cursor:pointer;
	position:relative;
}
.tab.active {
	font-weight:bold;
	color:#2F3438 !important;
}
.tab.active::after {
	content:"";
	position:absolute;
	bottom:0;
	left:-60%;
	right:0;
	width:220%;
	height:3px;
	background-color:#4e6ef2;
	/* 파란 밑줄 */
}
.status-list {
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	margin:0 auto;
	width:1300px;
	padding:24px 60px;
}
.status-list-modal {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      margin: 0 auto;
      width: 1038px;
      height: 88px;
      padding: 0 0;
      border: 1px solid #ddd;
      margin-bottom: 16px;
    }
	.pay-status-item-last {
      margin-right: 100px;
    }
    .delivery-status-item-last {
      margin-right: 10px ;
    }
.status-list-pay {
	display:flex;
	justify-content:space-around;
	align-items:center;
	flex-wrap:wrap;
	margin:0 auto;
	width:1300px;
	padding:24px 160px;
}
.status-item {
	display:flex;
	flex-direction:column;
	align-items:center;
	font-size:13px !important;
	color:#555;
}
.status-item-modal {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      color: #555;
      width: 12.5%;
      height: 88px;
    }
.status-item-modal.active {
	border: 1px solid #4264EC;
	background-color: #E5F4FF;
}
.status-item img {
	width:32px;
	height:32px;
	margin-bottom:5px;
}
.status-name {
	margin-bottom:4px;
}
.status-count {
	font-size:16px !important;
	color:#4e6ef2;
	font-weight: bold;
}
/* mypage-table start */
.mypage-table-title {
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	flex-wrap:wrap;
	gap:20px;
	max-width:1300px;
	padding:20px 0;
	margin:auto;
}
.left-section {
	display:flex;
	flex-direction:column;
}
.title {
	font-weight:bold;
	font-size:28px !important;
	margin:20px 0 6px 0;
	color:#2F3438;
	letter-spacing:-0.04em;
}
.subtitle {
	font-weight:500;
	font-size:14px !important;
	color:#777;
	margin-left:4px;
	letter-spacing:-0.01em
}
.status-buttons {
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	font-size:16px !important;
}
.status-button-active {
	display:inline-flex;
	align-items:center;
	border:1px solid #b3c3ea;
	background:#47517D 0% 0% no-repeat padding-box;
	border-color:#ABB9EF;
	border-radius:20px;
	font-weight:600;
	color:#fff;
	cursor:pointer;
	padding:6px 16px;
}
.status-button-active .divider {
	width:1px;
	height:12px;
	background-color:#fff;
	margin:0 6px;
}
.status-button {
	display:inline-flex;
	align-items:center;
	border:1px solid #b3c3ea;
	background:#F4F6FF 0% 0% no-repeat padding-box;
	border-color:#ABB9EF;
	border-radius:20px;
	font-weight:600;
	color:#47517D;
	cursor:pointer;
	padding:6px 14px;
}
.status-button .count {
	color:#4e6ef2;
	font-weight:bold;
	margin-left:4px;
}
.status-button .divider {
	width:1px;
	height:12px;
	background-color:#d4d9e3;
	margin:0 6px;
}
.right-section {
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	/* align-items:center; */
	margin-top:16px;
	font-size:14px !important;
}
.select-box {
	position:relative;
	width: 110px;
}
.select-box select {
	width:94%;
	padding:10px 8px 10px 12px;
	border:1px solid #d0d5dc;
	border-radius:8px;
	/* border:none;text-decoration:underline;*/
	color:#333;
	appearance:none;
	/* 기본 화살표 제거 */
	-webkit-appearance:none;
	-moz-appearance:none;
	cursor:pointer;
}
.mp-search-inputs select option {
	cursor:pointer;
}
.select-box::after {
	content:"▼";
	position:absolute;
	right:22px;
	top:49%;
	transform:translateY(-50%);
	font-size:11px !important;
	color:#aaa;
	pointer-events: none;
}
.mp-search-bar {
	display:flex;
	align-items: center !important;
	gap:8px;
	/* margin:0 3px 0 2px; */
}
.mp-search-left {
	display:flex;
	flex-direction:column;
	margin:0 4px 5px 4px;
	cursor:pointer;
}
/* .mp-underline {
	margin-top:4px;
	height:1px;
	background-color: #ccd1d9;
} */
.mp-search-inputs {
	display:flex;
	gap:6px;
	cursor:pointer;
}
.mp-search-inputs input {
	/* cursor:pointer;*/
	width:160px;
}
select {
	appearance:none;
	-webkit-appearance:none;
	border:none;
	background:transparent;
	font-size:14px !important;
	padding-right:20px;
	background-repeat:no-repeat;
	background-position:right center;
	background-size:14px;
	color:#333;
}
input[type="text"] {
	border:none;
	outline:none;
	background:transparent;
	font-size:14px !important;
	/* color:#aaa;*/
}
.mp-search-button {
	display:inline-flex;
	align-items:center;
	gap:4px;
	padding:10px 16px;
	border-radius:6px;
	color:#fff !important;
	background-color:#4e6ef2;
	cursor:pointer;
}
.mp-search-button svg {
	width:16px;
	height:16px;
	stroke:white;
}
.mp-calendar input[type="date"],.mp-calendar select,.mp-calendar input[type="text"],.mp-calendar button {
	padding:10px 12px 10px 12px;
	border:1px solid #DADFE2;
	border-radius:8px;
	cursor: pointer;
}

.mp-calendar input {
	cursor:pointer;
}
.mp-calendar input[type="date"]:invalid {
	color:red;
}
.mp-calendar span {
	margin:0 3px 0 3px;
}
.search-box input[type="text"] {
	width:100%;
	padding:8px 34px 8px 12px;
	border:1px solid #d0d5dc;
	border-radius:8px;
	color:#333;
}
.search-box input::placeholder {
	color:#bbb;
}
.search-box .icon {
	position:absolute;
	right:10px;
	top:50%;
	transform:translateY(-50%);
	color:#aaa;
	pointer-events: none;
}
/* mypage-table start */
.mypage-table {
	max-width:1300px;
	margin:auto;
	/* margin-bottom:82px; */
	display:flex;
	flex-direction:column;
	gap:16px;
}
.order-card {
	display:flex;
	justify-content:space-between;
	align-items:center;
	background:#fff;
	border:1px solid #e0e0e0;
	border-radius:12px;
	padding:20px;
}
.order-left {
	display:flex;
	flex-direction:column;
	margin:0 0 0 20px;
}
.order-id {
	font-weight:bold;
	font-size:15px !important;
	color:#2F3438;
}
.order-date {
	font-size:13px !important;
	color:#999;
	text-align:center;
	margin:4px 0;
}
.badge {
	 margin:0 26px 0 26px; 
	font-size:14px !important;
	padding:8px 12px;
	border-radius:20px;
	font-weight:500;
}
.badge-blue {
	color:#4e6ef2;
	border:1px solid #4e6ef2;
	background-color:#fff;
}
.badge-black {
	color:#2F3438;
	border:1px solid #2F3438;
	;
	background:var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
}
.badge-red {
	color:#F66161;
	border:1px solid #F66161;
	background:var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
}
.badge-gray {
	margin-left:44px;
	color:#fff;
	background:#6c7073 no-repeat padding-box;
}
.order-center {
	display:flex;
	align-items:center;
	gap:16px;
	flex:1;
}
.img-wrap-table {
	width:80px;
	height:80px;
	border-radius:6px;
	background-color:#F5F5F5;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
}
.product-info {
	font-size:14px !important;
	color:#333;
}
.today {
	color:#e53935;
	font-weight:bold;
	margin-bottom:2px;
}
.product-name {
	color:#2F3438;
	font-size:16px !important;
	font-weight:bold;
	margin-bottom:2px;
}
.product-detail {
	color:#777;
}
.order-right {
	display:inline-block;
	text-align:right;
	min-width:120px;
	line-height:1.2;
	margin:0 20px 0 6px;
}
.price {
	font-size:20px !important;
	font-weight:bold;
	margin-bottom:4px;
	color:#2F3438;
}
.point {
	font-size:12px !important;
	color:#999;
	text-align:right;
}
.btn-group {
	flex-direction:column;
	margin-left:30px;
	display:flex;
	gap:6px;
}
.btn {
	font-size:14px !important;
	padding:6px 6px;
	border-radius:4px !important;
	border:1px solid #ccc;
	background-color:#fff;
	cursor:pointer;
}
.btn-primary {
	background-color:#4e6ef2;
	color:#fff;
	border-color:#4e6ef2;
	border-radius:4px !important;
}
.spec {
	display:flex;
	justify-content:center;
}
.icon-lines-box {
	margin:3px 4px 0 0;
	width:12px;
	height:16px;
	border:2px solid #999;
	border-radius:4px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.icon-lines {
	display:flex;
	flex-direction:column;
	gap:2px;
}
.icon-lines span {
	width:4px;
	height:1px;
	background-color:#555;
	border-radius:2px;
}
.pagination-wrapper {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 6px;
      margin: 50px 0 160px 0;
    }

.pagination-btn {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: #f5f5f5;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 16px;
	color: #555;
	cursor: pointer;
	/* transition: background-color 0.2s; */
}

.pagination-btn p {
	margin-bottom: 5px;
}

.pagination-btn.short {
	width: 24px;
	height: 24px;
	font-size: 12px;
}
.pagination-btn.short p {
	margin-bottom: 3px;
}

.pagination-btn:hover {
	background-color: #e0e0e0;
}

.page-container {
	display: flex;
	background-color: #f5f5f5;
	border-radius: 20px;
	padding: 4px 30px;
	gap: 10px;
}

.page {
	width: 32px;
	height: 32px;
	border-radius: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555;
	font-size: 14px;
	cursor: pointer;
	transition: background-color 0.2s;
}

.page:hover {
	color: #4e6ef2;
}

.page.active {
	background-color: #4e6ef2;
	color: white;
	font-weight: bold;
	/* box-shadow: 0 0 8px rgba(0, 0, 0, 0.2); */
}

/* mypage-pay */
.mp-pay-table-container {
	display:flex;
	justify-content:center;
}
.mp-pay-table {
	width:1300px;
}
.mp-pay-table table {
	border-collapse:collapse;
	width:100%;
}
.mp-pay-table table {
	border-top:1px solid #2F3438;
}
.mp-pay-table table .thread {
	margin:20px 20px;
}
.mp-pay-table th,td {
	border-bottom:1px solid #ddd;
	text-align:center;
	padding:10px;
}
.mp-pay-table .mp-order-info {
	display:flex;
	align-items:center;
	gap:10px;
	text-align:left;
}
.mp-pay-table .mp-order-info img {
	width:50px;
	height:auto;
}
.mp-pay-table .mp-gray-text {
	color:gray;
	font-size:0.85em;
}
.mp-pay-table .mp-status-complete {
	color:black;
}
.mp-pay-table .mp-status-complete-red {
	color:#F66161;
}
.mp-pay-table .mp-status-merged {
	color:red;
}
.mp-pay-table table {
	border-collapse:collapse;
	width:100%;
	table-layout:fixed;
	/* 고정 레이아웃 */
}
.mp-pay-table th:nth-child(1),
.mp-pay-table td:nth-child(1) {
	width: 5%;
}
/* No */
.mp-pay-table th:nth-child(2), 
.mp-pay-table td:nth-child(2) {
	width: 15%;
}
/* 주문번호/날짜 */
.mp-pay-table th:nth-child(3),
.mp-pay-table td:nth-child(3) {
	width: 46%;
}
/* 주문내용 */
.mp-pay-table th:nth-child(4),
.mp-pay-table td:nth-child(4) {
	width: 10%;
}
/* 수량 */
.mp-pay-table th:nth-child(5),
.mp-pay-table td:nth-child(5) {
	width: 10%;
}
/* 주문금액 */
.mp-pay-table th:nth-child(6), .mp-pay-table td:nth-child(6) {
	width: 10%;
}
/* 결제방법 */
.mp-pay-table th:nth-child(7),.mp-pay-table td:nth-child(7) {
	width: 10%;
}
/* mypage-coupons */
.mp-coupons-table th:nth-child(1),.mp-pay-table td:nth-child(1) {
	width: 6%;
}
/* No */
.mp-coupons-table th:nth-child(2),.mp-pay-table td:nth-child(2) {
	width: 12%;
}
/* 주문번호/날짜 */
.mp-coupons-table th:nth-child(3),.mp-pay-table td:nth-child(3) {
	width: 12%;
}
/* 주문내용 */
.mp-coupons-table th:nth-child(4),.mp-pay-table td:nth-child(4) {
	width: 12%;
}
/* 수량 */
.mp-coupons-table th:nth-child(5),.mp-pay-table td:nth-child(5) {
	width: 20%;
}
/* 주문금액 */
.mp-coupons-table th:nth-child(6), .mp-pay-table td:nth-child(6) {
	width: 20%;
}
/* 결제방법 */
.mp-coupons-table th:nth-child(7),.mp-pay-table td:nth-child(7) {
	width: 10%;
}
/* 쿠폰상태 */
.mp-coupons-table .point-plus {
	font:22px bold;
	text-align:center;
	;
}
.mp-coupons-table .blue {
	color:#4e6ef2;
	background-color:transparent !important;
	border-color:transparent !important;
}
.mp-coupons-table .red {
	color:#f66161;
	background-color:transparent !important;
	border-color:transparent !important;
}
.point-symbol-img {
	width:24px;
	height:24px;
	object-fit:contain;
	margin-bottom:7px;
	vertical-align:middle;
}
.mp-support-table th:nth-child(1), .mp-support-table td:nth-child(1) {
	width: 6%;
}
/* No */
.mp-support-table th:nth-child(2),.mp-support-table td:nth-child(2) {
	width: 12%;
}
/* 주문번호/날짜 */
.mp-support-table th:nth-child(3),.mp-support-table td:nth-child(3) {
	width: 12%;
}
/* 주문내용 */
.mp-support-table th:nth-child(4),.mp-support-table td:nth-child(4) {
	width: 30%;
}
/* 수량 */
.mp-support-table th:nth-child(5),.mp-support-table td:nth-child(5) {
	width: 12%;
}
/* 주문금액 */
.mp-support-table th:nth-child(6),.mp-support-table td:nth-child(6) {
	width: 12%;
}
/* 결제방법 */
.mp-support-table th:nth-child(7),.mp-support-table td:nth-child(7) {
	width: 12%;
}
/* 쿠폰상태 */
.mp-support-table .answer-red {
	font-weight:bold;
	;
	color: #F66161;
}
.mp-support-table .urgent-answer-red {
	/* font-weight:bold;*/
	display:inline-flex;
	align-items:center;
	gap:4px;
	padding:6px 10px;
	border:1px solid #F66161;
	background-color:#fff;
	border-radius:6px;
	cursor:pointer;
}
.mp-support-table .urgent-answer-red span {
	color:#f66161;
}
.mp-support-table .answer-blue {
	font-weight:bold;
	;
	color: #4e6ef2;
}
.mp-support-table .urgent-answer {
	/* font-weight:bold;*/
	display:inline-flex;
	align-items:center;
	gap:4px;
	padding:6px 10px;
	border:1px solid #DADFE2;
	background-color:#fff;
	border-radius:6px;
	cursor:pointer;
}
.mp-support-table .urgent-answer span {
	color: #2F3438;
}
/* mypage-benefits */
.mp-benefits-grade-container {
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:18px;
	width:1300px;
	margin:0 auto;
	letter-spacing:-0.03em
}
.mp-benefits-grade-container .grade-box {
	width:170px;
	background:#fff;
	box-shadow:0 0 5px rgba(0,0,0,0.1);
	border-radius:8px;
	overflow:hidden;
	text-align:center;
}
.mp-benefits-grade-container .grade-header {
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	color:#fff;
	height:46px;
	width:100%;
	font-size:20px;
	font-weight:bold;
	letter-spacing:-0.03em
}
.mp-benefits-grade-container .grade-content {
	padding: 20px 10px;
}
.mp-benefits-grade-container .grade-box img.icon {
	/* width:40px;height:40px;*/
	margin:16px 0;
	border-radius:50%;
	object-fit:cover;
}
.mp-benefits-grade-container .grade-box h3 {
	font-size:20px;
	font-weight:bold;
	margin:4px 0 2px;
}
.mp-benefits-grade-container .grade-box small {
	display:block;
	font-size:14px;
	color:#555;
}
.mp-benefits-grade-container .grade-box hr {
	margin:20px 0;
	border:none;
	border-top: 1px solid #e9eaea;
}
.mp-benefits-grade-container .grade-box .benefit {
	/* font-size:13px;*/
	color:#2F3438;
}
.mp-benefits-grade-container .grade-box .highlight {
	font-size:20px;
	font-weight:bold;
	/* margin-top: 5px;*/
}
/* 상단 색상 */
.mp-benefits-grade-container .welcome .grade-header {
	background:#ff9000;
}
.mp-benefits-grade-container .silver .grade-header {
	background:#777;
}
.mp-benefits-grade-container .family .grade-header {
	background:#3b88f5;
}
.mp-benefits-grade-container .gold .grade-header {
	background:#ffc107;
}
.mp-benefits-grade-container .diamond .grade-header {
	background:#00c6c6;
}
.mp-benefits-grade-container .vip .grade-header {
	background:#ff5588;
}
.mp-benefits-grade-container .vvip .grade-header {
	background: #223366;
}
.mp-benefits-notice-box {
	width:1300px;
	margin:30px auto 120px;
	/* 가로 가운데+상단 여백 */
	color:#2F3438;
}
.mp-benefits-notice-box .notice-title {
	font-weight:bold;
	margin-bottom:10px;
}
.mp-benefits-notice-box .notice-title img {
	margin-right:6px;
}
.mp-benefits-notice-box .notice-list {
	margin:0;
	width:1300px;
	padding-left:20px;
	background-color:#f5f5f5;
	border-radius:5px;
	padding:20px 25px;
	line-height:1.2;
}
.notice-list li::before {
	content:"•";
	position:relative;
	right:4px;
	color:#555;
}
.mp-benefits-notice-box .notice-list li {
	margin-bottom:5px;
	border-radius: 5px;
}
/* mypage-editMember */
.edit-member-container {
	width:1300px;
	margin:0 auto 100px;
	border-top:1px solid #2F3438;
}
.edit-member-container form {
	padding:10px 10px;
}
.edit-member-container .form-row {
	display:flex;
	align-items:center;
	margin:16px 0 16px;
}
.edit-member-container hr {
	margin:0;
	border:solid #ddd;
	border-width:1px 0 0;
	height:0px;
}
.edit-member-container .form-row-space {
	display:flex;
	align-items:center;
	margin-left:12px;
}
.form-row-address2 {
	margin-top:-8px !important;
}
.edit-member-container .form-row label {
	width: 130px !important;
  display: inline-block;
}
.edit-member-container .form-row .mp-withdrawal-checkbox-grid label {
  width: 160px !important;
  margin: 8px 0;
}

.edit-member-container .form-row .mp-withdrawal-textarea-box textarea {
  width: 1000px;
  height: 120px;
  padding: 12px;
  resize: none;
  border: 1px solid #ccc;
  border-radius: 8px;
  box-sizing: border-box;
}
.edit-member-container .form-row input[type="text"],.edit-member-container .form-row input[type="password"],.edit-member-container .form-row input[type="number"],.edit-member-container .form-row input[type="email"] {
	padding:7px 9px ;
	border:1px solid #DADFE2;
	border-radius:4px;
	font-size:13px;
	color:#2F3438;
}
.medium-input-space {
	margin-right:1%;
}
.edit-member-container .readonly {
	background-color:#f5f5f5;
}
.edit-member-container .inline {
	display:flex;
	gap:12px;
	align-items:center;
}
.edit-member-container .btn-change {
	padding:7px 12px;
	/* background:#fff; */
	/* border:1px solid #2f80ed; */
	/* color:#2f80ed; */
	/* font-weight:bold; */
	border-radius:4px;
	cursor:pointer;
	white-space:nowrap;
	color: #fff !important;
    background-color: #47517D;
	
}
.edit-member-container .checkbox-group,.edit-member-container .radio-group {
	display:flex;
	gap:12px;
	align-items:center;
}
.edit-member-container .checkbox-group label,.edit-member-container .radio-group label {
	font-weight:normal;
}
.edit-member-container .checkbox-group label:hover {
	display:inline-block;
}
.edit-member-container .btn-group-editMember {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	margin-top:36px;
}
.edit-member-container .btn {
	padding:12px 24px;
	border-radius:4px;
	cursor:pointer;
	width:160px;
}
.edit-member-container .btn-cancel {
	font-size:16px;
}
.edit-member-container .btn-submit {
	background-color:#3182f6;
	color:#fff;
	font-size:16px;
}
.editMember-number {
	margin-left:64px;
}
.btn-submit {
	border: none;
}
.left-section-editMember {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* padding: 20px; */
    max-width: 1300px;
    /* margin: auto; */
} 
.btn-withdraw {
  margin: 16px 0 0 900px;
  padding: 8px 16px;
  border: 1px solid #ccc;
  background-color: white;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
}

.btn-withdraw:hover {
  background-color: #f2f2f2;
}

.mp-calendar input[type="date"] {
    padding: 10px 30px 10px 12px; /* 오른쪽 패딩으로 아이콘 공간 확보 */
    border: 1px solid #DADFE2;
    border-radius: 8px;
    cursor: pointer;
    width: 150px;
    background: transparent; /* 배경 간섭 제거 */
    position: relative;
    z-index: 1; /* 다른 요소 위에 표시 */
    display: block; /* 숨겨지지 않도록 */
    opacity: 1; /* 투명도 문제 방지 */
}
.date-input-wrapper {
    position: relative;
    display: inline-block;
}


    .mp-order-modal-wrap {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 9995;
        background: rgba(0, 0, 0, 0.8);
        color: #2F3438;
        letter-spacing : -0.01em
    }
  
    
    .mp-order-modal {
        position: relative;
        width: 1110px;
        /* height: 600px; */
        /* padding: 60px 40px; */
        border-radius: 12px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
        text-align: center;
        z-index: 9996;
        background-color: #fff;
        text-align: left;
    }

    .mp-orderM-scroll-wrap {
        position: relative;
        width: 1110px;
        height: 600px;
        /* padding: 60px 40px; */
        border-radius: 12px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
        text-align: center;
        z-index: 9996;
        background-color: #fff;
        text-align: left;
        overflow-y: scroll;
    }

    .mp-orderM-scroll-wrap::-webkit-scrollbar{
      width: 24px;
    }

    /* 스크롤바 막대 설정*/
    .mp-orderM-scroll-wrap::-webkit-scrollbar-thumb{
      background-color: #4264EC;
      /* 스크롤바 둥글게 설정    */
      border-radius: 12px; 
      border: 8px solid #fff;
    }

    /* 스크롤바 뒷 배경 설정*/
    .mp-orderM-scroll-wrap::-webkit-scrollbar-track{
      background-color: rgba(0,0,0,0);
    }

    
    .mp-orderM-summary-wrap {
      padding: 36px 24px 0px 24px;
    }

    .mp-orderM-summary {
      border: 1px solid #ddd;
      padding: 16px;
      border-radius: 6px;
      font-family: sans-serif;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      gap: 8px;
      width: 1038px;
      margin: 0 auto;
      letter-spacing : -0.01em;
    }

    .mp-orderM-summary-right {
      position: absolute;
      right: 16px;
      display: flex;
      align-items: center;
    }

    .mp-orderM-summary-center {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 6px;
    }

    .mp-orderM-textArea { 
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .mp-orderM-check-icon {
      width: 20px;
      height: 20px;
      background-color: #4e6ef2;
      color: white;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      font-size: 14px !important;;
    }

    .mp-orderM-amount-highlight {
      color: #4e6ef2;
      font-weight: bold;
      font-size: 26px !important;;
      margin: 0 8px 4px 8px;
      letter-spacing: -0.02em;
    }

    .mp-orderM-divider {
      border-left: 1px solid #ccc;
      height: 16px;
      margin: 0 12px;
    }

    .mp-orderM-title {
      font-weight: 600;
      font-size: 18px !important;;
    }

    .mp-orderM-summary-details {
      font-size: 14px !important;;
      color: #777;
    }

    
    .mp-orderM-header {
      border-radius: 12px 12px 0 0;
      background-color: #4264EC;
      color: white;
      font-weight: bold;
      font-size: 20px !important;;
      padding: 16px 24px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      text-align: center;
    }

    .mp-orderM-closeBtn {
      background: none;
      color: white;
      font-size: 20px !important;;
      border: none;
      cursor: pointer;
    }
    
    .mp-orderM-section-divider {
      display: flex;
      align-items: center;
      text-align: center;
      margin: 0 auto;
      /* margin: 25px 0 10px; */
      width: 1038px;
      color: #999;
	  opacity:0.25; 
    }

    .mp-orderM-section {
      padding: 36px 24px 36px 24px;
    }

    .mp-orderM-section:first-child {
      padding: 36px 24px 0px 24px;
      border-top: 1px solid #ddd;
    }

    .mp-orderM-section:last-child {
      padding: 36px 24px 46px 24px;
    }

    .mp-orderM-number {
      font-size: 20px !important;;
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #2F3438;
    }

    .mp-orderM-img {
      margin-bottom: 5px;
    }

    .mp-orderM-number span {
      font-size: 14px !important;;
      font-weight: normal;
      color: #777;
    }

    .mp-orderM-content {
      font-size: 14px !important;;
      color: #2F3438;
      font-weight: bold;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 12px 0 12px 0;
    }

    .mp-orderM-content span {
      font-weight: normal;
      color: #2F3438;
    }

    .mp-order-info-table-modal {
      width: 100%;
      border-collapse: collapse;
      font-size: 14px !important;;
      border-top: 1px solid #2F3438;
      /* display: flex;
      flex: 1 1 auto; */
    }

    .mp-order-info-table-modal th,
    .mp-order-info-table-modal td {
      padding: 10px;
      border-bottom: 1px solid #eee;
    }
    .mp-order-info-table-modal th {
      width: 140px;
      background: #f7f7f7;
      text-align: left;
      font-weight: 500;
      color: #2F3438;
    }
    .mp-order-info-table-modal td {
      width: 379px;
      background: #fff;
      text-align: left;
      font-weight: 500;
      color: #2F3438;
    }

    .mp-order-sub-label {
      color: #777;
      margin-left: 8px;
    }

    .mp-order-addresses {
      display: flex;
      padding: 30px 24px 36px 24px;
      gap: 24px;
      text-align: left;;
    }

    .mp-order-address {
      width: 50%;
    }

    .mp-orderM-input-cell select {
      width: 120px;
      padding: 8px 30px 8px 10px; /* 오른쪽 화살표 공간 확보 */
      font-size: 14px !important;;
      text-align: left; /* 일부 브라우저에선 필요 없음 */
      text-align-last: left; /* 중요: 선택된 항목 왼쪽 정렬 */
      border: 1px solid #ccc;
      border-radius: 6px;
      appearance: none;
      background: white url('data:image/svg+xml;utf8,<svg fill="gray" height="10" viewBox="0 0 24 24" width="10" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat right 10px center;
      background-size: 10px;
    }

    .mp-orderM-input-cell select:focus {
      outline: none;
      border-color: #4e6ef2;
    }

    .mp-order-address h4 {
      margin-bottom: 12px;
      font-size: 20px !important;;
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .mp-order-sender {
      margin-top: 15px;  
    }

    .mp-order-spaceBot {
      margin-top: 15px;
    }

    .mp-order-address-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 14px !important;;
      text-align: left;
      border-top: 1px solid #000000;
    }

    .mp-order-address-table th {
      width: 140px ;
      background: #f7f7f7;
      text-align: left;
      font-weight: 500;
      color: #2F3438;
    }

    .mp-order-address-table td {
      width: 377px;
      padding: 10px;
      border-bottom: 1px solid #eee;
      text-align: left;
    }

    .mp-order-address-table th,
    .mp-order-address-table td {
      padding: 10px;
      border-bottom: 1px solid #eee;
    }

    .mp-order-spec-wrap {
      display: flex;
      align-items: center;
      justify-content: left;
    }

    .mp-orderM-array {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .mp-orderM-strong {
      color: #4264EC;
      font-size: 18px !important;;
    }

    .spec {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      font-size: 14px !important;
      color: #2F3438;
    }

    .btn {
      font-size: 14px !important;;
      padding: 6px 10px;
      border-radius: 4px !important;
      border: 1px solid #ccc;
      background-color: #fff;
      cursor: pointer;
      margin-left: 12px;
    }

    /* .btn:hover {
      font-size: 14px;
      padding: 6px 10px;
      border-radius: 4px !important;
      border: 1px solid #ccc;
      background-color: #fff;
      cursor: pointer;
      margin-left: 12px;
    } */

    .icon-lines-box {
      width: 12px;
      height: 16px;
      border: 2px solid #999;
      border-radius: 4px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .icon-lines {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .icon-lines span {
      width: 4px;
      height: 1px;
      background-color: #555;
      border-radius: 2px;
    }



    /* mypage-orderMC */
    .mp-orderMC-wrap {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 9997;
        background: rgba(0, 0, 0, 0.8);
        color: #2F3438;
        letter-spacing : -0.01em
    }

   .mp-orderMC {
        position: relative;
        width: 460px;
        /* height: 600px; */
        /* padding: 60px 40px; */
        border-radius: 12px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
        text-align: center;
        z-index: 9998;
        background-color: #fff !important;
        text-align: left;
    }

    .mp-orderMC-header {
      border-radius: 12px 12px 0 0;
      background-color: #f65a5a;
      color: white;
      padding: 14px 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
      font: 16px !important;
    }

    .mp-orderMC-header {
      border-radius: 12px 12px 0 0;
      background-color: #4264EC;
      color: white;
      padding: 14px 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
      font: 16px !important;
    }

    .mp-orderMC-header h4 {
      font-size: 16px;
      margin: 3px 0 0 0;
    }

    .mp-orderMC-close-btn {
      background: none;
      border: none;
      font-size: 18px !important;;
      color: white;
      cursor: pointer;
    }

    .mp-orderMC-body {
      padding: 24px;
      text-align: center;
      background-color: #fff;
      border-radius: 0 0 12px 12px;
    }

    .mp-orderMC-body h3 {
      margin: 0;
      font-size: 20px !important;;
      font-weight: bold;
    }

    .mp-orderMC-body p {
      margin-top: 2px;
      font-size: 13px !important;;
      color: #666;
    }

    .mp-orderMC-reason-list {
      background-color: #fafafa;
      padding: 24px;
      margin: 16px 0;
      border: 1px solid #eee;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px 12px;
      font-size: 14px !important;;
      text-align: left;
    }

    .mp-orderMC-reason-list input[type="text"] {
      width:100%;
      grid-column: span 3;
      padding: 8px;
      font-size: 13px !important;;
      border: 1px solid #ccc;
      border-radius: 4px;
    }

    .mp-orderMC-footer {
      display: flex;
      justify-content: center;
      gap: 0px;
      margin-bottom: 16px;
    }

    .btn {
      padding: 8px 18px;
      font-size: 14px !important;;
      border-radius: 4px;
      border: 1px solid #ccc;
      cursor: pointer;
    }

    .mp-orderMC-btn-cancel {
      background-color: white;
    }

    .mp-orderMC-btn-confirm {
      background-color: #f65a5a;
      border-color: #f65a5a;
      color: white;
    }

    .mp-orderMC-btn-confirm:hover {
      background-color: #e24c4c;
    }

    .mp-orderMC-text {
      margin-top: 8px;
    }

	    .mp-status-complete img {
      width: 22px;
      height: 22px;
    }
    
    .mp-status-complete-img-btn {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 6px 10px;
      border: 1px solid #ccc;
      background-color: white;
      color: #333;
      border-radius: 6px;
      cursor: pointer;
    }
    
    .mp-status-complete-img-btn img {
      width: 18px; 
      height: 18px;
      object-fit: contain;
    }


	/* mypage-pay-refund */
    .mp-pay-refund-table th:nth-child(1), .mp-pay-refund-table td:nth-child(1) { width: 5%; }     /* No */
    .mp-pay-refund-table th:nth-child(2), .mp-pay-refund-table td:nth-child(2) { width: 20%; }    /* 주문번호/날짜 */
    .mp-pay-refund-table th:nth-child(3), .mp-pay-refund-table td:nth-child(3) { width: 15%; }    /* 주문내용 */
    .mp-pay-refund-table th:nth-child(4), .mp-pay-refund-table td:nth-child(4) { width: 20%; }    /* 수량 */
    .mp-pay-refund-table th:nth-child(5), .mp-pay-refund-table td:nth-child(5) { width: 10%; }    /* 주문금액 */
    .mp-pay-refund-table th:nth-child(6), .mp-pay-refund-table td:nth-child(6) { width: 20%; }    /* 결제방법 */

	.mp-status-btn-blue {
      gap: 4px;
      padding: 6px 18px;
      color: #fff;
      background-color:  #4e6ef2;
      border: 1px solid  #4e6ef2;
      border-radius: 6px;
      cursor: pointer;
      margin-right: 4px;
    }

    .mp-status-btn {
      gap: 4px;
      padding: 6px 18px;
      color: #333;
      background-color: white;
      border: 1px solid #ccc;
      border-radius: 6px;
      cursor: pointer;
    }
	.pagination-section {
      display: flex;
      position: relative;
      align-items: center;
      margin: 0 auto;
      gap: 30px;
      width: 1300px;;
    }
	.mp-pay-botRightBtn-container {
      position: absolute;
      right: 0px;
      display: flex;
      align-items: center;
      margin: 50px 0 160px 0;
      gap: 6px;
    }

    .mp-pay-botRightBtn {
      /* font-weight: bold; */
      display: inline-flex;
      align-items: center;
      padding: 8px 14px;
      border: 1px solid #DADFE2;
      background-color: #47517D;
      color: #fff;
      border-radius: 6px;
      cursor: pointer;
    }

/* mypage-pay-modal.css */
.mp-payM-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
    background: rgba(0, 0, 0, 0.8);
}

.mp-payM {
    display: inline-block;
    text-align: left;
    margin-top: -40px;
}

.mp-payM-scroll {
    width: 380px;
    /* height: 520px;
    overflow-y: scroll; */
    padding: 28px 40px;
    background: white;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    border-radius: 0 0 16px 16px;
}

.mp-payM-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #4264EC;
    color: white;
    /* font-size: 16px; */
    font-weight: bold;
    padding: 12px 16px;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.mp-payM-scroll-p {
    font-weight: 400;
    font-size: 14px;
    color: #888;
    line-height: 1.5;
}

.mp-payM-scroll-divider {
    border-top: 1px solid #ddd;
    margin: 16px 0;
}

.mp-payM-header span {
    font-size: 20px;
    margin-left: 12px;
}

.mp-payM-closeW {
    right: 16px;
    top: 12px;
    font-size: 20px;
    color: white;
    cursor: pointer;
    border: none;
    background: none;
}

/* 스크롤바 설정*/
.mp-payM-scroll::-webkit-scrollbar {
    width: 24px;
    /* transform: translate3d(0px, -100px, 0px); */
}

/* 스크롤바 막대 설정*/
.mp-payM-scroll::-webkit-scrollbar-thumb {
    background-color: #4264EC;
    /* 스크롤바 둥글게 설정    */
    border-radius: 24px;
    border: 8px solid #fff;
}

/* 스크롤바 뒷 배경 설정*/
.mp-payM-scroll::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0);
}

.mp-payM .mp-payM-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 20px;
    color: #888;
    cursor: pointer;
}

.mp-payM .mp-payM-subtitle {
    font-size: 13px;
    color: #888;
    margin: 24px 0 1px 2px;
}

.mp-payM h2 {
    margin-bottom: 20px;
    font-size: 28px;
    font-weight: bold;
    line-height: 1.24;
    letter-spacing: -0.04em
}

.mp-payM h2 .mp-payM-highlight {
    color: #4264EC;
}

.mp-payM-btn-container {
    display: flex;
    align-items: center;
    margin-top: 16px;
    width: 100%;
}

.mp-payM-btn-container-first {
    margin-top: 0px;
}

.mp-payM-btn-container label {
    display: block;
    color: #2F3438;
    font-size: 14px;
    font-weight: 500;
    margin: 0 0px 0 0;
    width: 22%;
}

.mp-payM-option label {
    margin-top: 30px;
}

.mp-payM-option-container label {
    margin: 0 auto;
}

.mp-payM-input-row {
    display: flex;
    gap: 6px;
    align-items: center;
}

.mp-payM-input-row input {
    flex: 1;
}

.mp-payM-btn-bot-container {
    display: flex;
    gap: 8px;
}

/* .mp-payM .mp-payM-btn {
    width: 100%;
    padding: 14px;
    font-size: 15px;
    font-weight: 500;
    border: none;
    border-radius: 10px;
    margin-top: 10px;
    cursor: pointer;
} */

.mp-payM-btn {
    margin-top: 28px;
    width: 100%;
    padding: 12px;
    font-size: 16px;
    font-weight: 500;
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

.mp-payM-btn-enabled {
    border: 1px solid #2F3438;
    background-color: #fff;
    color: #2F3438;
}

.mp-payM-btn-active {
    border: 1px solid #4264EC;
    background-color: #4264EC;
    color: white;
}


input[type="text"],
input[type="password"],
input[type="number"],
select {
    color: #2F3438;
    width: 230px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 400;
    border: 1px solid #EBEBEB;
    border-radius: 8px;
    outline: none;
    box-sizing: border-box;
    /* margin-right: 1%; */
}

select {
    appearance: none;
    /* 기본 화살표 제거 */
    background: url('data:image/svg+xml;utf8,<svg fill="gray" height="12" viewBox="0 0 24 24" width="12" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat;
    background-position: right 10px center;
    /* ▶ 여기서 아이콘 위치 왼쪽으로 조정 */
    background-size: 16px;
    padding-right: 30px;
    /* 아이콘 안겹치게 오른쪽 여백 추가 */
    cursor: pointer;
}

.mp-payM-btn-check {
    padding: 14px 20px;
    background-color: #4264EC;
    color: white;
    border: none;
    border-radius: 10px;
    font-weight: bold;
    cursor: pointer;
    font-size: 14px;
}

.mp-payM-input-row-spacing {
    margin-top: 10px;
}


.mp-payM-btn-join {
    background-color: #4264EC;
    color: white;
}

.mp-payM-btn-corp {
    background-color: #1b2a38;
    color: white;
}

.mp-payM-divider {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 25px 0 10px;
}

.mp-payM-divider::before,
.mp-payM-divider::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #ddd;
}

.mp-payM-divider:not(:empty)::before {
    margin-right: .75em;
}

.mp-payM-divider:not(:empty)::after {
    margin-left: .75em;
}

.mp-payM-btn-kakao {
    background-color: #ffe812;
    color: #3c1e1e;
}

.mp-payM-btn-naver {
    margin: 0 0 30px 0;
    background-color: #03c75a;
    color: white;
}

/* ratio */
.mp-payM-agreement-title {
    font-weight: bold;
    margin-bottom: 10px;
}

.mp-payM-agreement-box {
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 20px;
    width: 320px;
}

.mp-payM-agreement-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 15px;
}

.mp-payM-agreement-left {
    display: flex;
    align-items: center;
}

.mp-payM-custom-checkbox {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #e0e0e0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: white;
    margin-right: 6px;
    flex-shrink: 0;
}

input[type="checkbox"]:checked+.mp-payM-custom-checkbox {
    background-color: #3f51b5;
}

input[type="checkbox"]:checked+.mp-payM-custom-checkbox::before {
    content: '✔';
}

.mp-payM-bold {
    font-weight: 700;
    font-size: 16px;
}

.mp-payM-view-link {
    font-size: 13px;
    color: #ccc;
    margin-left: 16px;
    cursor: pointer;
    text-decoration: underline;
}

.mp-payM-view-link:hover {
    color: #3f51b5;
    text-decoration: underline;
}



/* sign-up3 */
.mp-payM-divider-company {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 28px 0 0 0;
}

.mp-payM-divider-company::before,
.mp-payM-divider-company::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #ddd;
}

.mp-payM-divider-company:not(:empty)::before {
    margin-right: .75em;
}

.mp-payM-divider-company:not(:empty)::after {
    margin-left: .75em;
}
.mp-notice-box {
  width: 1300px;
  margin: 30px auto 30px;
  /* 가로 가운데 + 상단 여백 */
  color: #2F3438;
}
.mp-notice-box .notice-title {
  display: flex;
  align-items: center;
  font-weight: bold;
  margin-bottom: 10px;
}

.mp-notice-box .notice-title img {
  margin-right: 6px;
}
.mp-notice-box .notice-list {
  font-size: 14px !important;
  margin: 0;
  width: 1300px;
  padding-left: 20px;
  background-color: #f5f5f5;
  border-radius: 5px;
  padding: 20px 25px;
  line-height: 1.2;
}

.mp-notice-box .notice-list li::before {
  content: "•";
  position: relative;
  right: 4px;
  color: #555;
}

.mp-notice-box .notice-list li {
  margin-bottom: 5px;
  border-radius: 5px;
}

.mp-notice-box .notice-list span {
  color: #F66161;
  font-weight: bold;
}
.edit-member-container .btn-submit-red {
  background-color: #F66161;
  border: 1px solid #F66161;
  color: #fff;
  font-size: 16px;
}

.mp-delivery-address-table th:nth-child(1),
.mp-delivery-address-table td:nth-child(1) {
  width: 8%;
}

.mp-delivery-address-table th:nth-child(2),
.mp-delivery-address-table td:nth-child(2) {
  width: 8%;
}

.mp-delivery-address-table th:nth-child(3),
.mp-delivery-address-table td:nth-child(3) {
  width: 12%;
}

.mp-delivery-address-table th:nth-child(4),
.mp-delivery-address-table td:nth-child(4) {
  width: 20%;
}

.mp-delivery-address-table th:nth-child(5),
.mp-delivery-address-table td:nth-child(5) {
  width: 16%;
}

.mp-delivery-address-table th:nth-child(6),
.mp-delivery-address-table td:nth-child(6) {
  width: 8%;
}

.mp-delivery-address-table th:nth-child(7),
.mp-delivery-address-table td:nth-child(7) {
  width: 30%;
}
.mp-botRightBtn-container {
  position: absolute;
  right: 0px;
  display: flex;
  align-items: center;
  margin: 50px 0 160px 0;
  gap: 8px;
}
.mp-botRightBtn-enabled {
  /* font-weight: bold; */
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  color: #47517D;
  border: 1px solid #47517D;
  background-color: #fff;
  border-radius: 6px;
  cursor: pointer;
}
.mp-botRightBtn-active {
  /* font-weight: bold; */
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  color: #fff;
  border: 1px solid #DADFE2;
  background-color: #47517D;
  border-radius: 6px;
  cursor: pointer;
}
/* mp-deliveryM start */
.mp-deliveryM-address-wrap {
    margin: 16px 0 0 0;
}

.mp-deliveryM-address-wrap .mp-payM-btn-container {
    margin-top: 8px;
}

.default-address {
    margin-left: 22%;
    width: 100px;
    display: flex;
    align-items: center;
    gap: 4px;
    /* 간격 조절 */
}

.mp-deliveryM-address-wrap input {
    width: 160px;
}

.default-address input[type="checkbox"] {
  display: block;
  width: 16px;
}

.mp-deliveryM-address-btn input {
    margin-left: 22%;
    width: 140px;
}
.mp-text500-blue {
  color: #4e6ef2;
  font-weight: 500;
}

.mp-text500-gray {
  color: #777777;
  font-weight: 500;
}
.notice-title-answer {
  font-size: 20px !important;
  color: #3182f6;
}
/* mp-deliveryM end */

.mp-upload-btn {
  padding: 8px 12px;
  background: #fff;
  border: 1px solid #ccc;
  color: #2f3438;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
}
.notice-title-answer .subtitle {
  font-weight: 500;
  font-size: 14px;
  color: #777;
  margin: 8px 0 0 8px;
  letter-spacing: -0.01em
}
/* 이용후기 작성 start */
        .mp-modal-stars {
      direction: rtl; /* 별 순서 역방향 */
      font-size: 32px !important;
      unicode-bidi: bidi-override;
      display: inline-block;
      margin: 4px 0 12px 0;
    }

    .mp-modal-stars input {
      display: none;
    }

    .mp-modal-stars label {
      color: #ccc !important;
      cursor: pointer;
    }

    .mp-modal-stars input:checked ~ label {
      color: #ffc107 !important; /* 채워진 별색 */
    }

    textarea.mp-modal-review {
      width: 100%;
      height: 100px;
      resize: none;
      padding: 10px;
      font-size: 14px !important;
      border: 1px solid #ddd;
      border-radius: 8px;
      margin-bottom: 4px;
    }

    .mp-modal-file-upload {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 13px !important;
      margin-bottom: 20px;
    }

    .mp-modal-file-upload input[type="file"] {
      display: none;
    }

    .mp-modal-file-upload label {
      padding: 6px 12px;
      background: #fff;
      border: 1px solid #ddd;
      border-radius: 4px;
      cursor: pointer;
    }



    /* 작성한 이용후기 start*/
    .reviews-written-modal-body {
      /* padding: 24px; */
      text-align: left;
      margin-bottom: 28px;
    }
    .reviews-written-modal-body .title-row {
      font-weight: bold;
      margin-bottom: 8px;
      font-size: 22px;
    }
    .reviews-written-modal-body hr {
      border: none;
      border-top: 1px solid #ddd;
      margin: 8px 0 8px 0;
    }
    .reviews-written-modal-body .rating-row {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #999;
      margin: 12px 0 4px;
    }
    .reviews-written-modal-body .stars {
      font-size: 20px !important;
      color: #ffc107;
    }
    .reviews-written-modal-body .stars .off {
      color: #ccc;
    }
    .reviews-written-modal-body .review-text {
      background: #f8f8f8;
      padding: 20px 16px;
      line-height: 1.5;
    }

    .reviews-written-modal-body .review-image {
      margin: 12px 0;
    }

    .reviews-written-modal-body .review-image img {
      width: 100px;
      height: auto;
      border: 1px solid #ddd;
    }

  .mp-modal-btn-long {
    padding: 8px 12px;
    width: 120px;
    border: 1px solid #2F3438;
    background-color: #fff;
    color: #2F3438;

  }

  .mp-modal-btn-long-active {
    padding: 8px 12px;
    width: 120px;
    background-color: #4264EC;
    border-color: #4264EC;
    color: white;

  }

  .mp-modal-btn-long-active:hover {
    background-color: #3859c7;
    border-color: #3859c7;
    color: #fff;
  }

  /* mypage-icon-nav */
  .mp-icon-nav {
    width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    justify-items: center;
    gap: 12px;
    box-sizing: border-box;
  }

  .mp-icon-radio {
    display: none;
  }

  .mp-icon-item {
    flex: 0 0 calc(1300px / 8);
    display: flex;
    justify-content: center;
  }

  .mp-icon-label {
    /* width: 140px;
    height: 140px; */
    padding: 10px;
    margin: 16px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #333;
    font-size: 14px;
    cursor: pointer;
    /* transition: background-color 0.3s, border 0.3s; */
    transition: filter 0.3s ease;
    border-radius: 10px;
    border: 1px solid transparent; 
  }

  .mp-icon-circle:hover,
  .mp-icon-radio:checked + .mp-icon-circle {
    background-color: #8BC8F4;
  }

  .mp-icon-label.active .mp-icon-circle {
    border: 2px solid #4264EC;
  }

  .mp-icon-circle:hover {
    background-color: #8BC8F4;
  }
  .mp-icon-circle {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background-color: #F5F5F5;
    display: flex;
    align-items: center;
    justify-content: center;
    
  }

  .mp-icon-circle img {
    margin: 3px 0 0 3px;
    /* width: 46px; */
    object-fit: contain;
    display: block;
  }

  .mp-icon-text {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.04em;
  }

  .mp-icon-number {
    color: #4e6ef2;
  }
  /* mypage-icon-nav end */

  .user-info .account-btn {
      background-color: #f8f8f8;
      border: 1px solid #ccc;
      padding: 4px 8px;
      border-radius: 10px;
      font-size: 12px;
      cursor: pointer;
  }

  .user-info .account-btn:hover {
      background-color: #eee;
  }
}




/* Edit an Errors */
/* === Mypage 검색바 수직정렬 & 같은 높이 === */
:root { --mpFieldH: 40px; }  /* 필요시 44px 등으로 조절 */

.mypage .right-section { align-items: center; }        /* 부모 정렬 */
.mypage .mp-search-bar { display:flex; align-items:center; gap:8px; }

/* 불필요한 들뜸 제거 (하단 여백 때문에 위로 붙어 보임) */
.mypage .mp-search-left { margin:0 !important; }

/* 3개 요소 높이 통일 + 수직 중앙정렬 */
.mypage .select-box,
.mypage .mp-search-inputs input,
.mypage .mp-search-button {
  height: var(--mpFieldH) !important;
  box-sizing: border-box;
  vertical-align: middle;
}

.mypage .select-box { display:flex; align-items:center; }

.mypage .select-box select,
.mypage .mp-search-inputs input {
  height: 100% !important;
  /* padding-top: 0; padding-bottom: 0; */
  display: inline-flex; align-items: center;
}

/* 버튼도 높이 고정 & 텍스트 중앙 */
.mypage .mp-search-button {
  display: inline-flex; align-items: center; justify-content: center;
  line-height: var(--mpFieldH);
  padding: 0 16px; /* 좌우만 유지 */
}

/* 커스텀 화살표 위치 살짝 보정 */
.mypage .select-box::after {
  top: 50% !important;
  transform: translateY(-50%);
}



/* ✅ order-center 내부 레이아웃을 그리드로 고정 */
.mypage .order-center{
  display: grid !important;
  grid-template-columns: 80px 1fr 220px; /* 썸네일 | 정보 | 결제상세 고정폭 */
  column-gap: 16px;
  align-items: center;
  flex: 1 1 auto;   /* 카드에서 가변폭 */
  min-width: 0;     /* 오버플로우 방지 */
}

/* 썸네일은 1열 고정 */
.mypage .order-center .img-wrap-table{
  width: 80px; height: 80px;
  grid-column: 1;
}

/* 상품 정보는 2열(가변) */
.mypage .order-center .product-info{
  grid-column: 2;
  min-width: 0;  /* 긴 텍스트 말줄임 허용 */
}

/* 말줄임 처리(원하면 제목만 적용해도 됨) */
.mypage .order-center .product-name,
.mypage .order-center .product-title,
.mypage .order-center .product-detail{
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 결제상세는 3열(고정폭) */
.mypage .order-center .order-payinfo{
  grid-column: 3;
  margin-left:50px;
}

/* 결제상세 내부 줄 */
.mypage .order-center .order-payinfo .pay-row{
  display: flex;
  align-items: center ;
  /* justify-content: space-between; */
  gap: 12px;
  line-height: 1.35;
  padding: 2px 0;
  color:#606b85;
}
.mypage .order-center .order-payinfo .label{
  color:#777777;
  white-space:nowrap;
  font-size: 14px !important;
}
.mypage .order-center .order-payinfo .value{
  color:#2b3148;
  font-weight:500;
  white-space:nowrap;
  font-size: 14px !important;
}

/* 반응형: 좁으면 결제상세를 아래로 내리기 */

/* .mypage .mp-calendar,
.mypage .mp-search-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
}

.mypage .date-input-wrapper input[type="date"] {
  height: var(--mpFieldH);
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid #DADFE2;
  box-sizing: border-box;
}

.mypage .mp-calendar:first-child {
  margin-left: 4px;
}

.mypage .mp-search-bar:last-child {
  margin-right: 4px;
} */