@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');

:root {
	--ice-primary: #1A8CFF;
	--ice-primary-dark: #0B5ED7;
	--ice-deep: #071525;
	--ice-navy: #0C2340;
	--ice-sky: #4DB6FF;
	--ice-frost: #E8F4FF;
	--ice-mist: #F3F8FD;
	--ice-line: #D5E6F5;
	--ice-text: #10243A;
	--ice-muted: #6B849C;
	--ice-accent: #00C2FF;
}

html, body {
	font-family: 'Pretendard', 'Noto Sans KR', sans-serif !important;
}

body {
	background:
		radial-gradient(1200px 400px at 50% -80px, #1A8CFF22, transparent 60%),
		linear-gradient(180deg, #D7ECFB 0%, #EEF6FC 180px, #F3F8FD 100%) !important;
	color: var(--ice-text);
	padding-top: 64px !important;
}

/* 헤더 */
.main_head {
	height: 64px !important;
	background: linear-gradient(90deg, #06111E 0%, #0B1E36 55%, #0E2A4D 100%) !important;
	border-bottom: none !important;
	box-shadow: 0 8px 24px rgba(7, 21, 37, 0.28);
	overflow: visible !important;
}

.main_head .logo_link {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	background: transparent !important;
	z-index: 2;
}

.main_head .app_logo {
	float: none !important;
	width: auto !important;
	height: 36px !important;
	max-width: 158px !important;
	margin: 0 !important;
	padding: 0 !important;
	object-fit: contain;
}

.main_head .map_info_wrap {
	left: auto !important;
	right: 52px !important;
	transform: translateY(-50%) !important;
	max-width: calc(100% - 230px) !important;
	height: 32px;
	padding: 0 10px 0 8px !important;
	background: rgba(255,255,255,0.12) !important;
	border: 1px solid rgba(255,255,255,0.16);
	border-radius: 999px;
	color: #fff;
}

.main_head .map_info_wrap .map_info {
	color: #fff !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

.main_head .map_info_wrap i {
	color: #9FD4FF !important;
}

.main_head .top_cart,
.main_head .bi-cart3 {
	color: #fff !important;
	padding-top: 18px !important;
	padding-right: 16px !important;
}

.sub_head {
	height: 64px !important;
	background: linear-gradient(90deg, #06111E 0%, #0B1E36 100%) !important;
	border: none !important;
	box-shadow: 0 8px 24px rgba(7, 21, 37, 0.28);
}

.sub_head .menu_name {
	color: #fff !important;
	font-size: 16px !important;
	font-weight: 700 !important;
}

.sub_head .top_prev,
.sub_head .top_cart,
.sub_head .bi-chevron-left,
.sub_head .bi-cart3 {
	color: #fff !important;
}

.cart_num span.top_cart,
#CartNum span.top_cart {
	background-color: var(--ice-primary) !important;
	border: 2px solid #0B1E36;
}

/* 하단 탭 */
.bottom_menu {
	background: rgba(255,255,255,0.92) !important;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-radius: 22px 22px 0 0 !important;
	box-shadow: 0 -10px 30px rgba(12, 35, 64, 0.12) !important;
}

.bot_menu_list span {
	font-weight: 700 !important;
	color: #7A93A8 !important;
}

.bot_on {
	color: #fff !important;
	background: linear-gradient(180deg, #4DB6FF 0%, #1A8CFF 100%) !important;
	border-radius: 999px !important;
	padding: 3px 10px !important;
}

.new_push {
	background-color: var(--ice-primary) !important;
}

/* 포인트 컬러 치환 */
.green,
.cateOn,
.review_btn,
.login,
.member span,
.btn_g_01,
.mem_out_btn,
.notice_wrap button,
.order_title span,
input:checked + .slider,
.mart_none button,
.m_pro_info .cart_price i,
.cate_more_btn {
	color: inherit;
}

.green { color: var(--ice-primary) !important; }
.cateOn { background: linear-gradient(180deg, #4DB6FF, #1A8CFF) !important; color: #fff !important; border: none !important; }
.cate_more_btn { color: var(--ice-primary) !important; border-top-color: var(--ice-line) !important; }
.login, .btn_g_01, .mem_out_btn, .notice_wrap button, .mart_none button { background-color: var(--ice-primary) !important; border-color: var(--ice-primary) !important; }
.member span { color: var(--ice-primary) !important; }
.review_btn { border-color: var(--ice-primary) !important; color: var(--ice-primary) !important; }
.order_title span { background-color: var(--ice-primary) !important; }
input:checked + .slider { background-color: var(--ice-primary) !important; }
.m_pro_info .cart_price i { color: var(--ice-primary) !important; }
.num_info, .ph_num_wrap .num_info, .ph_num_wrap2 span { color: var(--ice-primary) !important; }
.point_wrap .point_title span { color: var(--ice-primary) !important; }
.swal-button--confirm { background-color: var(--ice-primary) !important; }

.log input { caret-color: var(--ice-primary) !important; }
.search_box { caret-color: var(--ice-primary) !important; }

.part_btn button:nth-child(2) {
	background-color: var(--ice-primary) !important;
	border-color: var(--ice-primary) !important;
}

/* 메인 레이아웃 */
.main {
	background: transparent !important;
	padding-bottom: 12px;
}

.ice-search {
	margin: 12px 12px 0;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 14px;
	height: 46px;
	background: #fff !important;
	border-radius: 16px;
	box-shadow: 0 8px 22px rgba(12, 35, 64, 0.08);
	cursor: pointer;
}

.ice-search i {
	color: var(--ice-primary);
	font-size: 16px;
}

.ice-search span {
	color: var(--ice-muted);
	font-size: 14px;
	font-weight: 500;
}

.main_banner {
	position: relative;
	aspect-ratio: 16 / 9 !important;
	margin: 14px 12px 0;
	border-radius: 22px;
	overflow: hidden;
	background: #0B1E36 !important;
	box-shadow: 0 16px 32px rgba(7, 21, 37, 0.18);
}

.main_banner .swiper-container { height: 100% !important; border-radius: 22px; }
.main_banner .swiper-slide { background: #0B1E36 !important; }
.main_banner .swiper-slide a { position: relative; display: block; height: 100%; }
.main_banner .swiper-slide img { width: 100%; height: 100% !important; object-fit: cover; }
.main_banner .banner_copy {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 22px 16px 28px;
	background: linear-gradient(180deg, transparent 0%, rgba(6,17,30,0.78) 100%);
	text-align: left;
	color: #fff;
}
.main_banner .banner_copy em {
	display: inline-block;
	margin-bottom: 6px;
	padding: 3px 8px;
	font-style: normal;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #071525;
	background: #9FE7FF;
	border-radius: 999px;
}
.main_banner .banner_copy strong {
	display: block;
	font-size: 22px;
	line-height: 1.25;
	font-weight: 800;
	letter-spacing: -0.03em;
}
.main_banner .banner_copy span {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	opacity: 0.9;
}
.main_banner .swiper-pagination {
	bottom: 10px !important;
	right: 12px !important;
	left: auto !important;
	background: rgba(7,21,37,0.45) !important;
}

.ice-sheet {
	position: relative;
	margin-top: -18px;
	padding: 22px 0 8px;
	background: transparent !important;
	z-index: 2;
}

.quick-menu {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
	margin: 0 12px 14px;
	padding: 14px 8px 12px;
	background: #fff !important;
	border-radius: 20px;
	box-shadow: 0 10px 24px rgba(12, 35, 64, 0.07);
}

.quick-menu a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	text-decoration: none;
	color: var(--ice-text);
	background: transparent !important;
}

.quick-menu .qm-ico {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 16px;
	font-size: 20px;
	color: #fff;
	background: linear-gradient(160deg, #4DB6FF 0%, #1A8CFF 100%);
	box-shadow: 0 8px 16px rgba(26, 140, 255, 0.28);
}

.quick-menu a:nth-child(2) .qm-ico { background: linear-gradient(160deg, #7AD7FF, #2B9BFF); }
.quick-menu a:nth-child(3) .qm-ico { background: linear-gradient(160deg, #67C6FF, #1574E8); }
.quick-menu a:nth-child(4) .qm-ico { background: linear-gradient(160deg, #9FE7FF, #1A8CFF); color: #0B1E36; }

.quick-menu span {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.main_pro_wrap {
	margin: 0 12px 12px !important;
	padding: 16px 12px 12px !important;
	background: #fff !important;
	border: 1px solid #E7F1FA;
	border-radius: 20px !important;
	box-shadow: 0 10px 24px rgba(12, 35, 64, 0.06) !important;
}

.main_pro_wrap.ice-sale {
	padding: 0 0 12px !important;
	overflow: hidden;
	background: #071525 !important;
	border: none;
}

.main_pro_wrap.ice-sale .sale-hero {
	position: relative;
	display: block;
	width: 100%;
}

.main_pro_wrap.ice-sale .sale-hero img {
	width: 100%;
	height: 128px;
	object-fit: cover;
	display: block;
}

.main_pro_wrap.ice-sale .sale-hero .sale-copy {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 16px;
	background: linear-gradient(180deg, transparent 20%, rgba(7,21,37,0.72) 100%);
	color: #fff;
	text-align: left;
}

.main_pro_wrap.ice-sale .sale-hero em {
	font-style: normal;
	font-size: 11px;
	font-weight: 800;
	color: #9FE7FF;
}

.main_pro_wrap.ice-sale .sale-hero strong {
	font-size: 20px;
	font-weight: 800;
}

.main_pro_wrap.ice-sale .p_img_wrap,
.main_pro_wrap.ice-sale .cate_more_btn {
	background: #fff !important;
}

.main_pro_wrap.ice-sale .p_img_wrap {
	padding: 10px 10px 0 !important;
	margin: 0 !important;
}

.main_pro_wrap.ice-sale .cate_more_btn {
	width: calc(100% - 20px);
	margin: 8px 10px 0;
	border-top: none !important;
	border-radius: 12px;
	background: var(--ice-frost) !important;
}

.con_title {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	border-bottom: none !important;
	margin-bottom: 12px !important;
	padding-bottom: 0 !important;
	text-align: left !important;
}

.con_title .bold {
	position: relative;
	padding-left: 12px;
	font-size: 17px !important;
	font-weight: 800 !important;
	letter-spacing: -0.03em;
	color: var(--ice-text) !important;
}

.con_title .bold::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	bottom: 3px;
	width: 4px;
	border-radius: 4px;
	background: linear-gradient(180deg, #4DB6FF, #1A8CFF);
}

.con_title .more {
	float: none !important;
	color: var(--ice-muted);
	font-size: 12px;
	font-weight: 600;
}

.proCate {
	display: flex;
	gap: 6px;
	padding-bottom: 4px;
	margin-bottom: 12px !important;
}

.proCate span {
	flex-shrink: 0;
	padding: 6px 12px !important;
	line-height: 1.2 !important;
	border: 1px solid var(--ice-line) !important;
	border-radius: 999px !important;
	background: #F7FBFE;
	color: #4C647A !important;
	font-weight: 600;
}

.p_img_wrap {
	gap: 8px !important;
}

.main_product {
	width: 42% !important;
	padding: 0 !important;
	border: 1px solid #EAF3FA !important;
	border-radius: 16px !important;
	background: #fff !important;
	box-shadow: none;
}

.p_img_wrap.cate_p_img_wrap {
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 10px !important;
}

.p_img_wrap.cate_p_img_wrap .main_product {
	width: 100% !important;
}

.m_pro_img {
	border-radius: 16px 16px 0 0 !important;
	background-color: #F4FAFF !important;
}

.m_pro_info .proName {
	font-size: 13px !important;
	font-weight: 600;
	color: var(--ice-text) !important;
}

.m_pro_info .cart_price b {
	color: var(--ice-navy) !important;
	font-size: 15px;
}

#footer {
	background: transparent !important;
	color: var(--ice-muted);
}

#footer table tr td {
	color: var(--ice-navy);
	font-weight: 600;
}

.footer_sub_info {
	color: var(--ice-muted) !important;
}

.content {
	background-color: #fff !important;
}

.content.log {
	background: #fff !important;
}
.content.log .point_wrap {
	background: linear-gradient(180deg, #06111E 0%, #0E2A4D 100%) !important;
	padding: 36px 20px 30px !important;
	margin: 0 0 12px !important;
	border-radius: 0 0 28px 28px;
}
.content.log .point_wrap img {
	width: 72% !important;
	max-width: 280px !important;
	filter: drop-shadow(0 10px 18px rgba(0,0,0,0.35));
}

.log_btn.login {
	background: linear-gradient(180deg, #4DB6FF, #1A8CFF) !important;
	border: none !important;
}

@media (max-width: 430px) {
	.main_head .app_logo { max-width: 132px !important; height: 32px !important; }
	.main_banner .banner_copy strong { font-size: 18px; }
	.quick-menu .qm-ico { width: 44px; height: 44px; }
}