html, body {
	color: #111;
	background:#f5f6f7;
	font-family: "Pretendard", sysmem-ui;
}

input, textarea, select {
	font-family: "Pretendard", system-ui;
	outline: none;
}

/*
	fs-1 = 40px
	fs-2 = 32px
	fs-3 = 28px
	fs-4 = 24px
	fs-5 = 20px
	fs-6 = 16px (default)
	fs-7 = 14px
	fs-8 = 12px
	fs-9 = 11px
	fs-10 = 10px
	fs-11 = 9px
	fs-12 = 8px
	fs-13 = 7px
	fs-14 = 6px
*/

.fs-7 { font-size: 14px; }
.fs-8 { font-size: 12px; }
.fs-9 { font-size: 11px; }
.fs-10 { font-size: 10px; }
.fs-11 { font-size: 9px; }
.fs-12 { font-size: 8px; }
.fs-13 { font-size: 7px; }
.fs-14 { font-size: 6px; }

.position-sticky {
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 999;
}

.wrap {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 500px;
	background: white;
	overflow-y: scroll;
	overflow-x: hidden;
}

.separation {
	position: relative;
	padding-left: 10px;
	margin-left: 10px;
}
.separation::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 10px;
	background-color: #e5e5ec;
}

.tnb { height:60px; margin:0 20px; }
.banner { margin:5px 20px; background:#001A5A; max-width:500px; aspect-ratio:1/1; border-radius:12px; }
.banner-item { margin:0 20px; background:#F4F6FA; border-radius:12px; }
.coupon-item { margin:0 20px; color:#fff; background:#2272EB; border-radius:12px; }
.coupon-item-gray { margin:0 20px; color:#111; background:#F4F6FA; border-radius:12px; }
.gray-border-line { margin:0 20px; border:1px solid #E5E5EC; border-radius:8px; transition: background-color 0.3s ease; }
.input-gray { width:100%; border:0; background:#F1F1F5; color:#999; text-align:center; padding:15px; border-radius:8px; }
.btn-blue { background:#2272EB; height:52px; }
.text-blue { color:#2272EB; }
.bank-info { margin:0 40px; }
.bank-guide-info { background:#F4F6FA; border-radius:12px; padding:20px; }
.notice-item { margin:0 20px; }
.copyright-menu { margin:0 20px; color:#505050; }
.copyright-info { color:#767676; font-size:13px; }
.copyright { color:#767676; }
.blank { height:80px; }

.drop-menu { position:absolute; top:60px; left:0; width:100%; background:#fff; font-size:15px; }
.checkbox-rounded-0 { width:16px; height:16px; border-radius:0 !important; }

.placeholder-overlay {
	pointer-events: none;
	white-space: pre-line;
}

#coupon-list {
  max-height: calc(5 * 77px);
  overflow-y: auto;
}

.alert-slide {
  position: fixed;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1050;
  transition: top 0.5s ease;
  opacity: 1;
}
.alert-slide.show {
  top: 1rem;
}
.alert-slide.hide {
  top: -100px;
}