* {
  box-sizing: border-box;
}
body {
	-webkit-overflow-scrolling: touch;
}

.bottom-sheet {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: column;
  opacity: 0;
  pointer-events: none;
  transition: 0.3s linear;
  z-index: 999;
}

.bottom-sheet.show {
  opacity: 1;
  z-index: 999;
  pointer-events: auto;
}

.bottom-sheet-overlay {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #4C4C4C;
  opacity: 0.4;
  z-index: -1;
}

.bottom-sheet .bottom-sheet-content {
  height: 50vh;
  max-height: 100vh;
  width: 100%;
  max-width: 500px;
  background: #fff;
  padding: 25px 30px;
  border-radius: 12px 12px 0 0;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.06);
  position: relative;
  transform: translateY(100%);
  transition: 0.3s ease;
}

.bottom-sheet.show .bottom-sheet-content {
  transform: translateY(0%);
}

.bottom-sheet.dragging .bottom-sheet-content {
  transition: none;
}

.bottom-sheet.fullscreen .bottom-sheet-content {
  border-radius: 0;
}

.bottom-sheet .bottom-sheet-content .bottom-sheet-header {
  display: flex;
  justify-content: center;
}

.bottom-sheet .bottom-sheet-content .bottom-sheet-header .drag-icon {
  padding: 15px;
  margin-top: -15px;
  cursor: grab;
  user-select: none;
}

.bottom-sheet .bottom-sheet-content .bottom-sheet-header .drag-icon span {
  height: 4px;
  width: 40px;
  background: #CDCDCD;
  display: block;
  border-radius: 50px;
}

.bottom-sheet .bottom-sheet-content .body {
  height: 100%;
  padding: 15px 0 40px;
  overflow-y: auto;
}

.bottom-sheet .bottom-sheet-content .body::-webkit-scrollbar { 
  width: 0;
}

.bottom-sheet .bottom-sheet-content .body h2 {
  font-size: 1.8rem;
}

.bottom-sheet .bottom-sheet-content .body p {
  font-size: 1.06rem;
  margin-top: 20px;
}
.bottom-sheet .bottom-sheet-content .caption, .rayon_menu .caption{
	color: var(--Gray-800, #1A1A1A);
	text-align: center;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: 0.1px;
	padding-bottom: 10px;
}

.closeMenu {
	position: absolute;
	cursor: pointer;
	margin: -2px 0 0 8px;
}

@media (max-width: 619px) {
	.closeMenu {
		margin: 0px;
		margin-top: -17px; 
	}
}

.bottom-sheet .bottom-sheet-content ul li a.active, .rayon_menu ul li a.active {
	color: #FF2F6B;
	background: url("data:image/svg+xml;charset=UTF-8,%3csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.2102 4.66475C15.4299 4.88442 15.4299 5.24058 15.2102 5.46025L6.96025 13.7102C6.74058 13.9299 6.38442 13.9299 6.16475 13.7102L2.41475 9.96025C2.19508 9.74058 2.19508 9.38442 2.41475 9.16475C2.63442 8.94508 2.99058 8.94508 3.21025 9.16475L6.5625 12.517L14.4148 4.66475C14.6344 4.44508 14.9906 4.44508 15.2102 4.66475Z' fill='%23FF2F6B' stroke='%23FF2F6B' stroke-width='0.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e") right no-repeat;
	display: block;
	padding-right: 40px;
}