body {
  font-family: var(--main-font);
}

/*******************/
/*shophead*/
/*******************/

/*******************/
/*shopitems-list*/
/*******************/
.wrap01{
	width:90%;
	margin: 30px 4.5%;
	padding:30px 30px;
	min-height:1200px;
	background-color:#ffffff;
	border-radius:5px;
}
.wrap01 h1{
	font-size:22px;
	text-align:center;
	margin-bottom:40px;
}
.product-grid {
	display: grid;
	grid-template-columns: repeat(var(--grid-col), 1fr);
	gap: 24px;
	margin-top: 30px;
}

/* ====== 상품 카드 ====== */
.product-card {
	position: relative;
	border: 1px solid #eee;
	border-radius: 4px;
	background: #fff;
	transition: all 0.2s;
	min-height: 570px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	transform: translateY(-2px);
	cursor:pointer;
}

.product-card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  transform: translateY(-2px);
}

.product-card img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: #fff;
	border-bottom: 1px solid #eee;
}
.product-img {
	position:relative;
}
/* 남은 시간 */
.remain-time {
	position: absolute;
	width:100%;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.20);
	display: inline-block;
	padding: 6px 12px;
	font-size: 15px;
	font-weight: 600;
	z-index:10;
}
.product-info {
	text-align: left;
	padding: 2px 10px 30px 10px;
}

.product-info p {
  margin: 0 0 5px 0;
}
.product-info span {
  margin-top:10px;
}

.product-info strong {
  font-size: 16px;
}
.p_goods_name{
	font-size: 18px;
	padding-top:10px;
	font-weight:700;
}
@media (max-width: 768px) {
	.wrap01{
		width:100%;
		margin: 10px 0;
		padding:10px 4.5%;
		background-color:#f9f9f9;
		border-radius:5px;
	}
	.wrap01 h1{
		font-size:15px;
		text-align:center;
		margin-bottom:10px;
	}
	.product-grid {
		grid-template-columns: repeat(2, 1fr);

	}

	
	.p_goods_name{
		font-size: 16px;
		padding-top:2px;
		font-weight:700;	
	}
	.product-info strong {
		font-size: 11px;
    }
	.product-card {
	  position: relative;
	  border: 1px solid #eee;
	  border-radius: 4px;
	  background: #fff;
	  transition: all 0.2s;
	  min-height: 300px;
	  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	  transform: translateY(-2px);
	  padding:0;
	}
	.remain-time{
		font-size:8px;
		padding: 3px 5px;
	}
	
}

/*******************/
/*shop_items_list_diff*/
/*******************/

.floating-nav {
    position: fixed;
    right: 15px;
    bottom: 80px;
    z-index: 9999;

    display: flex;
    flex-direction: column;
    gap: 10px;
}

.nav-btn {
    background: #fff;
	border:1px solid var(--main-color);
	color: 1px solid var(--main-color);
	padding: 12px 20px;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0,0,0,0.15);
	z-index: 9999;
	transition: 0.2s;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.nav-btn:hover {
    background: var(--main-hover);
    transform: translateY(-2px);
}

.top-btn {
    background:var(--main-color);
}

.top-btn:hover {
    background:var(--main-hover);
}
/*******************/
/*shop_items_detail*/
/*******************/

.product-detail {
  max-width: 1800px;
  width:90%;
  margin: 30px auto;
  overflow-x: hidden;

}
/*.product-detail .row {*/
/*  align-items: flex-start;*/
/*  justify-content: space-between;*/
/*  display: flex !important;          */
/*  align-items: stretch !important;   */
/*  flex-wrap: nowrap !important;*/
/*  margin-top: 30px;*/
/*}*/
.product-detail .row {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;  
  margin-top: 30px;
}
.product-left,.product-right{
	height:600px;
}
.product-left {
	flex: 0 0 50%;
	display: flex;                     
	flex-direction: column;
	justify-content: center;          
	padding: 30px;
	box-sizing: border-box;

}
.product-right {
	flex: 1 1 50%;
	display: flex;                     
	flex-direction: column;
	justify-content: center;          
	padding: 30px;

	box-sizing: border-box;


}
.slider-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.img-slider {
	position: relative;
	width: 100%;
	max-width: 500px;            
	aspect-ratio: 1 / 1;         
	overflow: hidden;
	border-radius: 2px;
	background: #f9f9f9;
	margin-left:auto;
}

/* 가로로 배치되는 트랙 */
.slide-track {
	display: flex;
	width: calc(100% * var(--slide-count));
	height: 100%;
	transition: transform 0.8s ease-in-out;

}

/* 각 슬라이드 */
.slide-img {
  flex: 0 0 100%;           
  height: 100%;
  text-align: right;
  box-sizing: border-box;
  
}

/* 실제 이미지 */
.slide-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}

/* 남은 시간 */
.remain-time {
	position: absolute;
	width:100%;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.20);
	display: inline-block;
	padding: 6px 12px;
	font-size: 15px;
	font-weight: 600;
	z-index:10;
}


/* 오른쪽 상품정보 */

.product-detail h3 {
  font-size: 30px;
  font-weight: 600;

}
.product-detail h4 {
  font-size: 18px;
  color:#e74c3c;
  width:100%;
}
.product_desc {
	min-height: 260px;
	overflow-wrap: break-word;
}
.product_desc img{
	max-width:100% !important;
	width:50%;
	height:auto !important;
}
.edit_desc{
	padding:10px 30px;
}
.edit_desc img {
    max-width: 100%;
    height: auto;
	object-fit: contain;
}
.opt-txt{
	display: flex;
    justify-content: space-between;
    align-items: center;
	font-size:14px;
	margin-bottom:10px;
}
.opt-info{
	display: flex;
    justify-content: space-between;
    align-items: center;

}
.opt-extra{
	font-size:15px;
	font-weight:700;
}

.total-box {
  font-weight: 600;
  border-top: 1px solid #eee;
  padding-top: 10px;
  margin-top: 10px;
}
.qty-box{
	border:0.2px #eee solid;
	border-radius:2px;
	background-color: #f5f5f5;
	padding:4px 15px;
}
.no_opt-qty button{
	width:30px;
	height:30px;
	font-weight: bold;
}
.no_opt-qty input{
	display: inline-block;
	height: 30px;
	vertical-align: middle;
	width:60px !important;
	margin:0 3px;
	text-align: center;
	font-size:15px;
}
.qty-box button {
	width: 25px;
	height: 25px;
	font-weight: bold;
}
.qty-box input {
	display: inline-block;
	height: 25px;
	vertical-align: middle;
	width:60px !important;
	margin:0 3px;
	text-align: center;
	font-size:15px;
}
.qty-box input:focus{

}
.btn-qty {
	border:1px #808080 solid;
	font-size:13px;
}

/* 버튼 통일 */
.cart_btn{
    border-radius: 4px;
	width:46%;
	height:45px;
	margin:5px 10px;
	font-size:15px;
	color:#fff;
	background-color:var(--main-color);
	border:2px solid var(--main-color);
}
.cart_btn:hover {
	background-color:var(--main-hover);
	border:2px solid var(--main-hover);
}

.cart_btn_outline{
	border-radius: 4px;
	width:46%;
	height:45px;
	margin:5px 10px;
	font-size:15px;
	color:var(--main-color);
	background-color:#fff;
	border:2px solid var(--main-color);
}
.cart_btn_outline:hover{
	color:var(--main-hover);
	border:2px solid var(--main-hover);
}

.cart_btn_pc{
	width:80%;
	position:fixed;
	bottom:20px;
}
.product_buy{
	text-align:center;
}
.cart_btn2 {
    border-radius: 6px;
	width:250px;
    height: 45px;
    margin: 0;
    font-size: 21px;
    color: #fff;
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    cursor: pointer;

    transition:
        background-color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.1s ease;
}

/* hover */
.cart_btn2:hover {
    background-color: var(--main-hover);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* active (클릭 순간) */
.cart_btn2:active {
    transform: translateY(1px);
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}


.buy-sheet {
	width: 100%;
	height: 70vh !important;
	padding:20px 10%;

	background: #fff;
	border-radius: 16px;
	box-shadow: 0 12px 40px rgba(0,0,0,0.25);

	display: flex;
	flex-direction: column;
	align-items: center;      /* 세로 가운데 */
	justify-content: center;  /* 가로 가운데 */
	text-align: center;
}

@media (max-width: 768px) {
	.pc_display{
		display:none;
	}
	.mobile_display{
	}
	.product-detail {
		width: 95%;
		padding:0 10px;
		margin: 10px auto;
	}

	.product-detail .row {
		flex-direction: column;       
		align-items: center;          
	}

	.product-left,
	.product-right {
		flex: none;                   
		width: 100%;                  
		padding: 0;
		height: auto;
	}
	.product_desc img{
		width:100%;
	}
	.product-detail h4 {
		text-align:right;
	    padding:0 10px;
	}
	.edit_desc{
		padding:2px 5px;
	}

	.img-slider {
		max-width: 100%;              
		aspect-ratio: auto;           
	}

	.slide-img img {
		object-fit: contain;          
	}
	.cart_btn_pc{
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
		background-color:#fefefe;
		z-index:3;
		padding:0;
		padding-top:5px;
		border-top:2px #eee solid;
		margin:0 auto;
		text-align:center;
	}
	.cart_btn_mobile{
		display:block;
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
	}
	.cart_btn2 {
		width: 100%;                  
		height: 55px;
		margin: 0 auto;
		color:#fff;
		background-color:var(--main-color);
		border:2px solid var(--main-color);
		border-radius:0;
		display:inline-block;
	}
	.cart_btn {
		width: 49%;                  
		height: 50px;
		margin: 0 auto;
		color:#fff;
		background-color:var(--main-color);
		border:2px solid var(--main-color);
		display:inline-block;
	}
	.cart_btn_outline{
		width: 49%;                  
		height: 50px;
		margin: 0 auto;
		background-color:#fff;
		display:inline-block;


	}
	.qty-box {
		text-align: center;
	}

	.product-right h3 {
		font-size: 20px;
		text-align: center;
	}

	.buy-sheet {
		min-height: 40vh !important;
		max-height: 70vh !important;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		padding:0;
	}

	.sheet-handle {
		width: 40px;
		height: 4px;
		background: #ccc;
		border-radius: 2px;
		margin: 0 auto 8px;
	}

	/* 헤더 */
	.buy-sheet .offcanvas-header {
		flex-direction: column;
		gap: 6px;
		border-bottom: 1px solid #eee;
	}

	/* 바디 스크롤 */
	.buy-sheet .offcanvas-body {
		padding-bottom: 120px;
		overflow-y: auto;
	}

	/* 하단 고정 영역 */
	.sheet-footer {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 12px 16px;
		border-top: 1px solid #eee;
		background: #fff;
	}

	.sheet-price {
		font-size: 16px;
		font-weight: 600;
		margin-bottom: 8px;
	}

	.sheet-price span {
		color: #e74c3c;
		font-size: 18px;
	}
	.no_opt-qty{
		text-align:center;
	}

}

/****cart***/

.wrap01c{
	width:70%;
	margin: 0px 15%;
	padding:0px 30px;
	min-height:1200px;
	background-color:#ffffff;
}

.checkout-steps {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 15px;
  font-size: 15px;
  font-weight: 600;
  color: #999;
  margin: 10px 40px 0 0;
}

.checkout-steps .step {
  position: relative;
  padding: 6px 12px;
}

.checkout-steps .step.active {
  color: #111;
  font-weight: 700;
  border-bottom: 2px solid var(--main-color);
}

.checkout-steps .step:not(:last-child)::after {
  content: "›";
  margin-left: 10px;
  color: #ccc;
}

/* 모바일에서는 가운데 정렬 */
@media (max-width: 768px) {
  .checkout-steps {
    justify-content: center;
    flex-wrap: wrap;
    font-size: 13px;
    margin: 10px auto;
  }
}
/* ======================= */
/* 장바구니 레이아웃 좌우  */
/* ======================= */
#cartSection {
  background: #fff;
  border-radius: 4px;
  padding: 15px;
  overflow: visible;
}
.cart-left {
  display: inline-block;
  vertical-align: top;
  width: 70%;
  padding-right: 2%;
  border-right: 1px solid #eee;
  min-height: 200px;
}
.cart-right {
  display: inline-block;
  vertical-align: top;
  width: 28%;
  padding-left: 2%;
  text-align: right;
  position: -webkit-sticky;
  position: sticky;
  top: 120px; /* 스크롤 시 따라다님 */
}
.cart-header {
  display: flex;                
  justify-content: space-between; 
  align-items: center;          
  padding: 8px 0;
  border-bottom: 1px solid #ddd;
}

.cart-header .left-area label {
  font-size: 14px;
  color: #333;
  margin: 0;
}

.cart-header .right-area button {
  padding: 4px 10px;
  font-size: 13px;
}
.cart-header input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
/*	position: absolute;*/
	width:14px;
	height:14px;
/*	left: 20px;*/
/*	top: 70px;*/
	transform: scale(1.3);
	border:1px solid #B0B0B0;
	outline:0;
}
.cart-header input[type="checkbox"]:checked {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.173 12.414a1 1 0 0 1-1.414 0L1.293 8.95a1 1 0 1 1 1.414-1.414l3.05 3.05 7.536-7.536a1 1 0 0 1 1.414 1.414l-8.536 8.536z'/%3E%3C/svg%3E");
  background-color:var(--main-color);
  border:none;
}
/* ======================= */
/* 장바구니 상품 카드     */
/* ======================= */
.cart-item {
	border: 1px solid #eee;
	border-radius: 4px;
	padding: 12px;
	min-height:210px;
	margin-bottom: 10px;
	background: #FCFCFC;
	position: relative;
	overflow: hidden;
}
.cart-item input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	position: absolute;
	width:25px;
	height:25px;
	left: 20px;
	top: 20px;
	transform: scale(1.3);
	border:1px solid #B0B0B0;
	outline:0;
}
.cart-item input[type="checkbox"]:checked {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.173 12.414a1 1 0 0 1-1.414 0L1.293 8.95a1 1 0 1 1 1.414-1.414l3.05 3.05 7.536-7.536a1 1 0 0 1 1.414 1.414l-8.536 8.536z'/%3E%3C/svg%3E");
  background-color:var(--main-color);
  border:none;
}
.cart-item img {
  width: 200px;
  height: 200px;
  margin-right: 15px;
  object-fit: cover;
}
.group-header{
	display: flex;                


}
.group-header .left-area{
	flex: 0 0 30%;
	align-items: center;


}
.group-header .right-area{
	flex: 1 1 auto;
	align-items: left;

}
.group-info {
  overflow: hidden;
}
.group-name {
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 6px;
}
.group-desc{
	min-height:20px;
}
.group-price {
  color: #0070f3;
  font-weight: bold;
  font-size: 15px;
}
.cart-option-line{
	background-color:#eee;
	border-radius:4px;
	margin:5px 0;
	padding:5px 10px;
	display: flex;                
	justify-content: space-between; 
	align-items: center;
}


/* 수량 조절 */
.qty-control {
	
	background-color:#eee;
	border-radius: 4px;
	height: 34px;
	justify-content: space-between; 
	align-items: center;
	display: flex;
}

.qty-control .left-area {
    display: flex;
    flex-shrink: 0;
	border: 1px solid #ccc;
}

.qty-control .right-area {
    flex-shrink: 0;
	margin-left:3px;
	border: 1px solid #ccc;
}
.qty-control button {
  width: 28px;
  height: 28px;
  border: none;
  background: #f5f5f5;
  font-weight: bold;
  font-size:15px;
}
.qty-control input {
  width: 40px;
  height: 28px;
  border: none;
  text-align: center;
  background-color:#fff;
  font-size:15px;
}
/* 삭제 버튼 */
.del-btn {
	font-size:8px;
	color: #888;
	cursor: pointer;
	border:1px red solid;
}
.del-btn:hover{
  color:#686868;
}
/* ======================= */
/* 합계 & 구매 버튼       */
/* ======================= */
.cart-right {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 12px;
  overflow:visible;

}
.goods_buy {
  width: 100%;
  height: 42px;
  line-height: 42px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  background: var(--main-color);
  border: none;
  border-radius: 4px;
}
.goods_buy:hover {
  background: var(--main-hover);
}
/* 오른쪽 요약 영역 */
.cart-summary {
  top: 120px;

}
.cart-summary-box {
	border: 1px solid #eee;
	border-radius: 4px;
	padding: 20px;
	margin-bottom: 15px;
	text-align: center;
	background: #fafafa;
}
.cart-total-label {
	font-size: 14px;
	color: #666;
	margin-bottom: 5px;
}
.cart-total-price {
	font-size: 22px;
	font-weight: bold;
	color: #111;
}

.group-total{
	text-align:right;
	font-size:13px;
}
.group-total span{
	font-weight:bold;
}




@media (max-width: 768px) {
	.wrap01c{
		width:100%;
		margin: 10px 0;
		padding:30px 0px;
		min-height:5000px;
		background-color:#ffffff;
		border-radius:5px;
	}
/*	.cart-item {*/
/*		border: 1px solid #eee;*/
/*		border-radius: 4px;*/
/*		padding: 10px;*/
/*		height:140px;*/
/*		margin-bottom: 0;*/
/*		background: #FCFCFC;*/
/*		position: relative;*/
/*		overflow: hidden;*/
/*	}*/
	.group-header{
		display:block;
	}
	.group-header .left-area{
		flex: 0 0 80%;
		align-items: center;


	}
	.group-header .right-area{
		flex: 1 1 auto;
		align-items: left;

	}
	.cart-left,.cart-right {
		float: none;
		width: 100%;
		border: none;
	}
	.cart-right {
		text-align: center;
		margin-top: 20px;
	}
	.cart-item input[type="checkbox"] {
		width:25px;
		height:25px;
		transform: scale(1);
		left:13px;
		top: 9px;
		background-color:#ffffff;
	}

	.cart-item img {
	  float: left;
	  width: 110px;
	  height: 110px;
	  border: 1px solid #eee;
	  background: #fff;
	  margin-left: 0px;
	  margin-right: 15px;
	  object-fit: cover;
	}

}



/*************orderproduct*******************/

.order_hr{
	color:#909090;
	margin:50px 0 20px 0;
}
.wrap02{
	width:70%;
	margin: 0px 15%;
	padding:100px 30px;
	min-height:1000px;
	background-color:#ffffff;
	border-radius:5px;
}
.wrap02 h4{
	margin:10px 0;
	font-size:16px;
	font-weight:bold;
}
.order_wrap{
	width:80%;
	margin:0 10%;
}

.order-item {
	border: 1px solid #eee;
	border-radius: 4px;
	padding: 8px;
	min-height:135px;
	margin-bottom: 10px;
	background: #FCFCFC;
	position: relative;
	overflow: hidden;
}
.order-item img {
	float: left;
	width: 120px;
	height: 120px;
	border: 1px solid #eee;
	background: #fff;
	margin-left: 10px;
	margin-right: 30px;
	object-fit: cover;
}
.order-info {
  overflow: hidden;
}
.order-name {
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 6px;
}
.order-desc {
  font-size: 12px;
  margin-bottom: 6px;
}
.order-price {
  font-weight: bold;
  font-size: 12px;
}
.order-total {
  color: #0070f3;
  font-weight: bold;
  font-size: 15px;
}
.order_wrap .form-label {
  display: inline-block;
  font-weight: 500;
  color: #333;
  line-height: 34px;
  font-size:13px;
}
.order_wrap .text-danger {
  color: #e60023 !important;
  margin-left: 3px;
}
.order_wrap .form-control {
  border-radius: 4px;
  height: 42px;
  font-size: 14px;
}
.order_submit{
	width:40%;
	font-size:20px;
	background-color:var(--main-color);
	border:1px solid var(--main-color);
}
.order_submit:hover{
	background-color:var(--main-hover);
	border:1px solid var(--main-hover);
}

.coupon_info{
	display:none;
	border: 1px solid #eee;
	border-radius: 4px;
	padding: 15px 0;
	text-align: left;
	background: #fafafa;
	font-size:13px;
}
.coupon-row {
    display: flex;
    margin-bottom: 6px;
}

.coupon_info .coupon_label {
    text-align: left;   
	color: #333;
	font-weight:600;
	
}

.coupon_info .coupon_label::after {
    content: ":";
	margin:0 10px;

}

.coupon_info .coupon_value {

}
.coupon-card {
    display: inline-flex;
    flex-direction: column;
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #f8f9fa;
	min-width:23%;
}

.coupon-card span {
    margin-right: 8px;
    font-size: 13px;
}

.coupon-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.coupon-name {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.coupon-num {
    font-size: 12px;
    color: #888;
    word-break: break-all;
	text-align:right;
}


.btn-remove-coupon {
    border: none;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 13px;
    line-height: 18px;
    cursor: pointer;
}

.cart-summary-box {
	border: 1px solid #eee;
	border-radius: 4px;
	padding: 20px;
	margin-bottom: 15px;
	text-align: left;
	background: #fafafa;

}
.cart-summary-box span{
	text-align:right;

}
.cart-total-label {
	display: flex;
    justify-content: space-between; /* 양끝 정렬 */
    align-items: center;
	font-size: 18px;
	color: #666;
	margin: 10px 10px;
}
.cart-total-price {
	font-size: 22px;
	font-weight: bold;
	color: #111;
}

.addr-item {
	cursor: pointer;
}
.addr-item:hover {
	background: #f8f9fa;
}
.addr-line-zip {
	font-size: 14px;        
	font-weight: 600;
	color: #333;
	margin-bottom: 4px;
}

.addr-line-main {
	font-size: 15px;        
	color: #111;
	line-height: 1.4;
}

.btn-delete-addr {
	font-size: 12px;
	padding: 2px 6px;
	position:absolute;
	top:8px;
	right:8px;
}
#addrList {
	max-height: 50vh !important;
	overflow-y: auto !important;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
#addrListCanvas #addrList::-webkit-scrollbar{
	display:none;
}
.deli_addr_btn{
	width:65px;
	height:30px;
}


/*스위치 버튼*/
.switch {
  position: relative;
  display: inline-block;
  width: 54px;
  height: 27px;
}
.switch-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  inset: 0;
  background-color: #ccc;
  transition: .3s;
  border-radius: 34px;
}

.slider:before {
  content: "";
  position: absolute;
  height: 20px;
  width: 20px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: .3s;
  border-radius: 50%;
}


input:checked + .slider {
  background-color: #10BD54;
}

input:checked + .slider:before {
  transform: translateX(26px);
}

/*개인정보 수집 동의 */
.agree-row {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
}

.agree-row input[type="checkbox"] {
	width: 20px;
	height: 20px;
}

.agree-row label {
	margin: 0;
	cursor: pointer;
}

.terms-btn {
	background: none;
	border: none;
	padding: 0;
	font-size: 13px;
	color: var(--main-color);
	cursor: pointer;
}

.terms-btn:hover {
	text-decoration: underline;
}
#btnSaveAddr .active {
	color: #212529;
}

#btnSaveAddr.active::after {
	color: #198754;
	font-size: 14px;
}
.same_as_orderer{

}
.same_as_orderer input[type="checkbox"]{
	width:20px !important;
	height:20px !important;
	vertical-align: middle;
	margin:0 2px 5px 10px;
}
/*개인정보 수집 동의 모달*/
.simple-modal_custom {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	z-index: 9999;
}

.simple-modal-content_custom {
	background: #fff;
	width: 90%;
	max-width: 700px;
	max-height: 80vh;
	margin: 10vh auto;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
}

.simple-modal-header_custom {
	padding: 12px 16px;
	border-bottom: 1px solid #e5e5e5;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: 600;
}

.simple-modal-body_custom {
	padding: 16px;
	overflow-y: auto;
	font-size: 14px;
}

.simple-modal-footer_custom {
	padding: 12px;
	border-top: 1px solid #e5e5e5;
	text-align: right;
}

.close-btn_custom {
	background: none;
	border: none;
	font-size: 18px;
	cursor: pointer;
}

@media (max-width: 768px) {
	.wrap02{
		width:100%;
		margin: 10px auto;
		padding:30px 0px;
		min-height:1200px;
		background-color:#ffffff;
		border-radius:5px;
	}
	.order_wrap{
		width:92%;
		margin:0 auto;
	}
	#btnSaveAddr, #btnLoadAddr{
		margin:5px auto;
	}
}
/*결제 프로세스 */
.wrap03{
	width:70%;
	margin: 0px 15%;
	padding:100px 30px;
	min-height:500px;
	background-color:#ffffff;
	border-radius:5px; 
	display:none;
}
.pay-tabs {
  background: #fff;
  border-radius: 8px;
}

.pay-tab-buttons {
  display: flex;
  border-bottom: 1px solid #ddd;
}

.pay-tab-btn {
	flex: 1;
	padding: 14px 10px;
	border: none;
	background: linear-gradient(180deg, #fafafa, #f1f1f1);
	cursor: pointer;
	font-size: 15px;
	color: #555;
	box-shadow: inset 0 -1px 0 rgba(0,0,0,0.04);
	font-weight: 600;
}

.pay-tab-btn:hover {
  background: linear-gradient(180deg, #ffffff, #f3f3f3);
}

.pay-tab-btn.active {
  background: #fff;
  color: var(--main-color);
  

  box-shadow:
    0 -2px 6px rgba(0,0,0,0.06),
    inset 0 1px 0 #fff;

  border-bottom: 3px solid var(--main-color);
  z-index: 2;
}

.pay-tab-panel {
  display: none;
  padding: 16px;
}

.pay-tab-panel.active {
  display: block;
}

.pay-btn {
	width: 100%;
	padding: 14px;
	margin-top: 10px;
	font-size: 18px;
	background: var(--main-color);
	/*background: #dc3545;*/
	color: #fff;
	border: none;
	border-radius: 6px;
}

.pay-btn2 {
    height: 120px;

    display: grid;
    place-items: center;
    text-align: center;

    gap: 6px;
    background: #ffffff;
    color: #222;
    border-radius: 14px;
    padding: 22px 16px;
    font-size: 18px;
    font-weight: 600;
    border: 1px solid rgba(0,0,0,0.06);

    box-shadow:
        0 4px 12px rgba(0,0,0,0.08),
        0 1px 2px rgba(0,0,0,0.04);

    transition: all 0.2s ease;
}
.pay-btn2 small {
    font-size: 13px;
    color: #777;
    line-height: 1.3;
}
.pay-btn2:hover {
    transform: translateY(-2px);
    box-shadow:
        0 8px 20px rgba(0,0,0,0.12),
        0 2px 4px rgba(0,0,0,0.06);
}

.pay-btn2:active {
    transform: translateY(0);
    box-shadow:
        0 3px 8px rgba(0,0,0,0.1);
}
.pay-methods {
    display: grid;
    gap: 16px;
}
.pay-methods {
	grid-template-columns: repeat(3, 1fr);
}

.form-disabled {
	pointer-events: none;
	opacity: 0.6;
}
@media (max-width: 768px) {
	.wrap03{
		width:100%;
		margin: 10px 0;
		padding:30px 0px;
		min-height:1200px;
		background-color:#ffffff;
		border-radius:5px;
		
	}
	.pay-methods {
		grid-template-columns: repeat(1, 1fr);
	}
}
/********************************/

/*****resultproduct*****/
.wrap04{
	width:90%;
	padding:20px 0;
	margin:0 auto;
	min-height:1000px;
	background-color:#ffffff;
	border-radius:5px;
}

.resultproduct-container{
    max-width:800px;
    margin:0px auto;
    padding:0 20px;
}
.resultproduct-text{
	font-size:16px;
	font-weight:600;
	display:inline-block;
	text-align:center;
	margin:0 auto;
}

.resultproduct-status-box{
    background:#fff;
    border-radius:20px;
    padding:32px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,0.06);
    margin-bottom:30px;
}

.resultproduct-status-icon{
    font-size:40px;
    margin-bottom:12px;
}

.resultproduct-status-success{
    color:var(--main-color);
}

.resultproduct-status-fail{
    color:#dc3545;
}

.resultproduct-status-title{
    font-size:22px;
    font-weight:700;
    margin-bottom:8px;
}

.resultproduct-status-sub{
    font-size:14px;
    color:#666;
}


.resultproduct-card{
    background:#fff;
    border-radius:16px;
    padding:24px;
    box-shadow:0 6px 24px rgba(0,0,0,0.05);
    margin-bottom:24px;

}

.resultproduct-card-title{
    font-size:17px;
    font-weight:700;
    margin-bottom:20px;
    
}


.resultproduct-item{
    display:flex;
    align-items:center;
    gap:16px;
    padding:16px 0;
    border-bottom:1px solid #eee;
}

.resultproduct-item:last-child{
    border-bottom:none;
}

.resultproduct-item-img{
    width:70px;
    height:70px;
    border-radius:12px;
    background:#e9ecef;
}
.resultproduct-item-img img{
    width:70px;
    height:70px;
	object-fit :cover;

}

.resultproduct-item-info{
    flex:1;
}

.resultproduct-item-name{
    font-weight:600;
	font-size:16px;
    margin-bottom:6px;
}

.resultproduct-item-qty{
    font-size:16px;
    color:#666;
}

.resultproduct-item-price{
	font-size:18px;
    font-weight:700;
}


.resultproduct-info-row{
    display:flex;
    justify-content:space-between;
    padding:8px 0;
    font-size:14px;
}

.resultproduct-info-label{
    color:#666;
}

.resultproduct-info-value{
    font-weight:500;
    text-align:right;
}


.resultproduct-action{
    text-align:center;
    margin-top:30px;
}

.resultproduct-btn-main{
    padding:14px 28px;
    border-radius:12px;
    border:none;
    font-weight:600;
    background:var(--main-color);
    color:#fff;
    cursor:pointer;
    transition:.2s ease;
}

.resultproduct-btn-main:hover{
    background:var(--main-hover);
    transform:translateY(-2px);
}
.resultproduct-footer{
	text-align:center;
}
.resultproduct-footer button{
	font-size:18px;
}

@media (max-width:768px){
	.wrap04{
		width:100%;
		min-height:600px;
	}
    .resultproduct-container{
        margin:0px auto;
    }
}