/* Sidebar */
body {
	font-size: 13px;
}

a {
	color: inherit;
	/* 부모 색상 사용 */
	text-decoration: none;
	/* 밑줄 제거 */
}

a:hover {
	color: inherit;
	/* 부모 색상 사용 */
	text-decoration: none;
	/* 밑줄 제거 */
}

.sidebar .sidebar-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.sidebar .nav>li>a::before {
	content: none !important;
}

.sidebar .nav,
.sidebar .nav .nav-collapse {
	list-style-type: none !important;
	padding-left: 0 !important;
}

.sidebar .nav .nav-collapse li a span::before {
	display: none !important;
	content: none !important;
}

/* Main Panel */
.table-custom-borders {
	border-left: 0;
	border-right: 0;
	border-top: 1px solid #dee2e6 !important;
}

.table-custom-borders thead th:first-child {
	border-left: 0;
}

.table-custom-borders thead th:last-child {
	border-right: 0;
}

.table-custom-borders tbody th:first-child,
.table-custom-borders tbody td:first-child {
	border-left: 0;
}

.table-custom-borders tbody th:last-child,
.table-custom-borders tbody td:last-child {
	border-right: 0;
}

/* index2.html 적용 */
/* Main Panel */
.nav-pills .nav-item .nav-link.active {
	background-color: #000000 !important;
	color: #ffffff !important;
}

.nav-pills .nav-item .nav-link {
	background-color: #ffffff !important;
	color: #000000 !important;
}

/* 색상 확인 및 변경 필요 */
.nav-pills .nav-item .nav-link:hover {
	background-color: #cce5ff !important;
	color: #0056b3 !important;
}

/* 여기부터 index1.html*/
.search-btn {
	height: 29px;
	margin-top: 1px;
}

.table-value {
	width: 70px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.table td,
.table th {
	padding: .25rem !important;
}

/* 여기까지 index1.html*/

.wd-90 {
	width: 90px;
}

.font11 {
	font-size: 11px;
}

.pd-sm {
	padding: 0.6rem 0.2rem;
}

.wd-200 {
	width: 200px;
}

.wd-120 {
	width: 120px;
}

.ellipsis {
	max-width: 500px;
	white-space: nowrap;
	/* 줄바꿈 없이 한 줄로 표시 */
	overflow: hidden;
	/* 넘친 텍스트 숨김 */
	text-overflow: ellipsis;
}

.ellipsis2 {
	max-width: 200px;
	white-space: nowrap;
	/* 줄바꿈 없이 한 줄로 표시 */
	overflow: hidden;
	/* 넘친 텍스트 숨김 */
	text-overflow: ellipsis;
}

.ellipsis3 {
	max-width: 300px;
	white-space: nowrap;
	/* 줄바꿈 없이 한 줄로 표시 */
	overflow: hidden;
	/* 넘친 텍스트 숨김 */
	text-overflow: ellipsis;
}

.ellipsis4 {
	max-width: 100px;
	white-space: nowrap;
	/* 줄바꿈 없이 한 줄로 표시 */
	overflow: hidden;
	/* 넘친 텍스트 숨김 */
	text-overflow: ellipsis;
}

/* .modal-back {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 99999;
	display: none;
}

.modal-img {
	position: absolute;
	top: 20%;
	left: 50%;
	margin-left: -250px;
} */

.cursor-pointer {
	cursor: pointer;
}

.cs-modal {
	max-height: 700px;
	overflow-y: auto;
}

.btn-light {
	border: 1px solid #ced4da;
	color: #000;
}

.form-control {
	font-size: 13px;
}

.filter-option {
	font-size: 13px;
}

.no-results {
	font-size: 13px;
}

.btn-xs {
	padding: 0.3rem 0.6rem;
	font-size: 10px;
	line-height: 1.5;
	border-radius: 0.15rem;
}

.btn-sm {
	padding: 5.5px 10px;
	font-size: 12px;
	line-height: 1.5;
	border-radius: 0.15rem;
}

#logoutText {
	font-size: 12px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 20px;
}

.h5 {
	font-size: 16px;
}

.card {
	border: 1px solid rgba(0, 0, 0, 0.05);
}

.btn {
	font-size: 12px;
}

.cartText {
	font-size: 14px;
}

table td input {
	text-align: center;
	/* input 값 가운데 정렬 */
	margin: 0 auto;
	/* input 자체를 가운데 배치 */
}

/* 선택된 날짜를 흰 배경 + 검은 글씨로 강제 */
body .flatpickr-calendar .dayContainer .flatpickr-day.selected,
body .flatpickr-calendar .dayContainer .flatpickr-day.startRange,
body .flatpickr-calendar .dayContainer .flatpickr-day.endRange,
body .flatpickr-calendar .dayContainer .flatpickr-day.selected.inRange,
body .flatpickr-calendar .dayContainer .flatpickr-day.today.selected {
	background: #fff !important;
	color: #000 !important;
	border-color: #000 !important;
	box-shadow: none !important;
}

/* hover 시에도 회색 안 뜨게 */
body .flatpickr-calendar .dayContainer .flatpickr-day:hover {
	background: #f5f5f5 !important;
	/* 연한 구분 원하면 유지, 완전 제거 원하면 #fff */
	color: #000 !important;
}

/* 범위 선택(inRange) 색도 흰색으로 통일하고 싶다면 */
body .flatpickr-calendar .dayContainer .flatpickr-day.inRange {
	background: #fff !important;
	color: #000 !important;
	box-shadow: none !important;
}

/* 오늘(today) 기본 파란 테두리 제거하고 싶다면(선택 아님) */
body .flatpickr-calendar .dayContainer .flatpickr-day.today {
	border-color: #000 !important;
	/* 필요 없으면 주석 처리 */
}


/* 메인헤더 - 위치 기준*/
.main-header {
	position: relative;
}

/* 메인헤더 - 로고 위치 */
.main-header .scroll_logo {
	z-index: 9999;
	margin-top: 20px;
}

/* 메인헤더 - 버튼 위치 */
#category-group {
	position: absolute;
	left: 1301px;
	top: 26px;
	display: flex;
	gap: 37px;
}

/* 메인헤더 - 폰트 */
.header-font-custom1 {
	color: #221815;
	font-size: 18px;
	font-style: normal;
	letter-spacing: 0px;
	font-weight: inherit;
	font-family: 'KoPubDotum', sans-serif;
	text-decoration: none;
	/* font-weight: bold; */
}

/* 메인헤더 - 전화버튼 */
/* .phone-pill {
	position: absolute;
	left: 225px;
	top: -10px;
	width: 150px;
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 0px;

	background: #fff;
	padding: 12px 30px;
	border-radius: 999px;

	text-decoration: none;
	color: #222;
	font-family: 'KoPubDotum', sans-serif;
	font-size: 15px;
} */
.phone-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	left: 25px;
	top: -8px;

	background: #fff;
	/* padding: 10px 16px; */
	padding: 13px 19px;
	border-radius: 999px;

	text-decoration: none;
	color: #222;
	/* font-weight: 700; */
}

html,
body {
	height: 100%;
}

body {
	background-color: #fffaed;
}

/* 상단 메뉴들 일반/호버 */
.header-link {
	position: relative;
	display: inline-block;
	font-family: 'KoPubDotum', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #222;
	text-decoration: none;
	letter-spacing: -0.04em;
	padding-bottom: 4px;
	transition: color 0.2s ease;
}

.header-link:hover {
	color: #333;
}

.header-link.active {
	color: #e37617;
	font-weight: 600;
}

.header-link.active:hover {
	color: #222;
}

.header-link.active::after {
	width: 100%;
}

.header-link,
.header-link:hover {
	text-decoration: none;
}

.phone-text {
	font-family: 'Noto Sans KR', sans-serif;
	letter-spacing: -0.02em;

	font-weight: 500;
	font-size: 14px;
}

.phone-pill .phone-text {
	position: relative;
	top: -6px;
}

.phone-pill .phone-icon {
	position: relative;
	font-size: 14px;
	top: -5px;
}

.phone-pill:hover {
	color: #e37617;
}

.form-control {
	padding-left: 4px;
	padding-right: 4px;
}

/* 컵과일 다건 주문 내역서 표 텍스트 크기 */
#cupOrderTable th,
#cupOrderTable td,
#basketOrderTable th,
#basketOrderTable td {
	font-size: 12px;
}

/* 배송시간 */
/* 품목 */
.ocdOrderTime,
.ocdItemSelect {
	width: 80px !important;
}

/* 주문서 카드 배경색 */
.card-red {
	background-color: #FEF4F5;
}

.card-orange {
	background-color: #FFF7F1;
}

.card-green {
	background-color: #F3FBF2;
}

#ui-datepicker-div {
	z-index: 999999 !important;
}

.date-picker[readonly],
.date-picker:read-only {
	background-color: #fff !important;
	color: #000 !important;
	opacity: 1 !important;
	-webkit-text-fill-color: #000;
}

.ui-datepicker {
	font-size: 14px !important;
	width: 280px !important;
}

.ui-datepicker table {
	font-size: 14px !important;
}

.ui-datepicker th,
.ui-datepicker td {
	padding: 4px !important;
}

#ui-datepicker-div {
	font-size: 14px !important;
	transform: none !important;
	zoom: 1 !important;
}

#sameTextBtn,
#sameTextBtn2 {
	width: 70px;
	height: 20px;
	font-size: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
}

/*  */
/* .main-header {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 0 24px;
	box-sizing: border-box;
}

.main-header>a {
	display: flex;
	justify-content: center;
}

.header-nav {
	position: absolute;
	right: 10%;
	display: flex;
	align-items: center;
	gap: 28px;
}

.phone-pill {
	white-space: nowrap;
	left: -10px;
	top: -3px;
} */
.main-header {
	position: relative;
}

.header-nav {
	display: flex;
	align-items: center;
	/* gap: 28px; */
}

#basketTitle {
	margin-left: 40px;
}

.phone-pill {
	white-space: nowrap;
	display: block;
}

.wrapper {
	width: 100%;
}

.main-header {
	width: 100%;
}

.top-content {
	width: 100%;
	max-width: 1200px;
	height: 80px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between
}

.phone-btn {
	padding: 10px 20px;
	background-color: #fff;
	border-radius: 50px;
	margin-left: 40px;
	font-size: 14px;
	color: #000;
	font-weight: 600;
}

select.form-control:not([size]):not([multiple]) {
	height: auto;
}

.orderImgWrap {
	width: 100%;
	box-sizing: border-box;
}

.orderImg {
	width: 100%;
	max-width: 800px;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* 툴팁 설정 */
.tooltip-inner {
	max-width: 220px;
	overflow: hidden;
}

/* 툴팁 설정 */
.tooltip-inner img {
	max-width: 100%;
	height: auto;
	display: block;
}

.modal-back {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .6);
	display: none;
	z-index: 99999;
}

/* 이미지 */
.modal-img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	max-width: 90vw;
	max-height: 90vh;
	object-fit: contain;
	border-radius: 12px;
}

/* 일요일 헤더 */
.ui-datepicker .ui-datepicker-calendar th:first-child {
	color: #e11d48;
}

/* 토요일 헤더 */
.ui-datepicker .ui-datepicker-calendar th:last-child {
	color: #2563eb;
}

/* 일요일 날짜 */
.ui-datepicker .ui-datepicker-calendar tbody td:first-child a,
.ui-datepicker .ui-datepicker-calendar tbody td:first-child span {
	color: #e11d48 !important;
}

/* 토요일 날짜 */
.ui-datepicker .ui-datepicker-calendar tbody td:last-child a,
.ui-datepicker .ui-datepicker-calendar tbody td:last-child span {
	color: #2563eb !important;
}

.menuLink {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	color: inherit;
	width: 100%;
}

.menuImg {
	display: block;
	width: 800px;
	height: auto;
	max-width: 100%;
	max-height: 650px;
}

.menuName {
	font-weight: 700;
	font-size: 30px;
}

.sameTextBtn2 {
	width: 70px;
	height: 20px;
	font-size: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
}

html {
	overflow-y: scroll;
}

#menu1>.card,
#menu2>.card {
	border: solid #FF8414 3px;
	border-radius: 5px;
}

@media (max-width: 768px) {
	#basketTitle {
		margin-left: 20px;
	}

	.phone-btn {
		padding: 5px 10px;
		background-color: #fff;
		border-radius: 50px;
		margin-left: 20px;
		font-size: 14px;
		color: #000;
		font-weight: 600;
		margin-right: 10px;
	}

	.main-header .scroll_logo {
		width: 100px;
		margin-top: 30px;
		margin-left: 10px;
	}

	.info-msg {
		white-space: normal !important;
	}

	.header-nav a {
		font-size: 13px;
	}

	#menuBox {
		margin-top: 16px !important;
	}

	.menuName {
		font-weight: 700;
		font-size: 20px;
	}

	.menuImg {
		/* display: block;
		width: auto;
		height: 200px;
		max-width: 100%;
		max-height: 650px; */
		display: block;
		width: 100%;
		height: auto;
		max-width: 100%;
	}

	.card-body {
		padding-top: 0px !important;
		padding-bottom: 0px !important;
	}

	#menu1 {
		margin-bottom: 10px;
	}

	#menu1,
	#menu2 {
		/* max-width: 280px;
		margin-left: auto;
		margin-right: auto; */
		max-width: 70%;
		max-height: 70%;
		width: 100%;
		height: 100%;
		flex: 0 0 100%;
	}

	#menu2 {
		margin-bottom: 10px;
	}

	.header-link {
		visibility: hidden;
	}
}