﻿/* 格展网络模板 */
/* 精品与原创网站模板提供商，一站式建站 */
/* 主营业务：快速建站、快排、服务器 */
/* 模板下载：Www.91084.Com */
/* 主机/服务器：Www.zhaodede.Com */
/* QQ：6364544  */

.site-header .main-nav .sf-menu,
.site-header .main-nav .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
	box-sizing: border-box;
}

.site-header .main-nav .sf-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 34px;
	line-height: 1;
}

.site-header .main-nav .sf-menu li {
	float: none;
	position: relative;
	background: transparent;
}

.site-header .main-nav .sf-menu > li {
	height: 92px;
	line-height: 92px;
}

.site-header .main-nav .sf-menu a {
	display: block;
	border: none;
	background: transparent;
	text-decoration: none;
}

.site-header.header-v1 .main-nav .sf-menu > li > a,
.site-header.header-v1 .main-nav .first-level,
.site-header .main-nav .sf-menu > li > a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 92px;
	padding: 0;
	border: none;
	background: transparent;
	color: #1d2737;
	font-size: 18px;
	font-weight: 500;
	line-height: 92px;
	letter-spacing: 0.01em;
	transition: color 0.18s ease;
}

.site-header.header-v1 .main-nav .sf-menu > li:hover,
.site-header.header-v1 .main-nav .sf-menu > li.sfHover,
.site-header.header-v1 .main-nav .sf-menu > li.sfHover > a,
.site-header.header-v1 .main-nav .sf-menu a:focus,
.site-header.header-v1 .main-nav .sf-menu a:hover,
.site-header.header-v1 .main-nav .sf-menu a:active,
.site-header .main-nav .sf-menu > li:hover > a,
.site-header .main-nav .sf-menu > li.sfHover > a,
.site-header .main-nav .sf-menu > li.current > a {
	background: transparent;
	color: #1565d8;
}

.site-header.header-v1 .main-nav .sf-menu li.current,
.site-header.header-v1 .main-nav .sf-menu li.current .first-level,
.site-header.header-v1 .main-nav .sf-menu li.current .first-level:visited {
	background: transparent;
	color: #1565d8;
}

.site-header .main-nav .sf-menu > li.current > a::after,
.site-header.header-v1 .main-nav .sf-menu > li.current > a::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: 18px;
	width: 22px;
	height: 3px;
	border-radius: 999px;
	background: #1565d8;
	transform: translateX(-50%);
}

.site-header .main-nav .sf-menu li i,
.site-header.header-v1 .main-nav .sf-menu li i,
.site-header .main-nav .sf-sub-indicator,
.site-header.header-v1 .main-nav .sf-sub-indicator,
.site-header .main-nav .first-level .sf-sub-indicator,
.site-header.header-v1 .main-nav .first-level .sf-sub-indicator {
	display: none;
}

.site-header .main-nav .sf-menu ul {
	position: absolute;
	top: -999em;
	left: 50%;
	min-width: 168px;
	padding: 8px 0;
	border: 1px solid rgba(21, 101, 216, 0.06);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 16px 34px rgba(15, 40, 80, 0.12);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 10px);
	transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
	z-index: 99;
}

.site-header .main-nav .sf-menu ul li {
	float: none;
	width: 100%;
	margin: 0;
	background: transparent;
}

.site-header .main-nav .sf-menu li:hover > ul,
.site-header .main-nav .sf-menu li.sfHover > ul,
.site-header.header-v1 .main-nav .sf-menu li:hover > ul,
.site-header.header-v1 .main-nav .sf-menu li.sfHover > ul {
	top: calc(100% - 2px);
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}

.site-header .main-nav .sf-menu li li:hover > ul,
.site-header .main-nav .sf-menu li li.sfHover > ul {
	left: 100%;
	top: 0;
	transform: translate(8px, 0);
}

.site-header.header-v1 .main-nav .sf-menu li li,
.site-header .main-nav .sf-menu li li {
	background: transparent;
}

.site-header.header-v1 .main-nav .sf-menu li li a,
.site-header.header-v1 .main-nav .sf-menu li li a:visited,
.site-header .main-nav .sf-menu li li a,
.site-header .main-nav .sf-menu li li a:visited {
	display: block;
	padding: 10px 18px;
	border: none;
	background: transparent;
	color: #233042;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	white-space: nowrap;
	transition: background 0.18s ease, color 0.18s ease;
}

.site-header.header-v1 .main-nav .sf-menu li li:hover,
.site-header.header-v1 .main-nav .sf-menu li.sfHover li.sfHover,
.site-header.header-v1 .main-nav .sf-menu li.sfHover li.sfHover > a,
.site-header.header-v1 .main-nav .sf-menu li li a:focus,
.site-header.header-v1 .main-nav .sf-menu li li a:hover,
.site-header.header-v1 .main-nav .sf-menu li li a:active,
.site-header .main-nav .sf-menu li li:hover,
.site-header .main-nav .sf-menu li li a:hover {
	background: #f4f8ff;
	color: #1565d8;
}

.site-header .sf-shadow ul {
	background: transparent;
	padding: 0;
}

@media (max-width: 1200px) {
	.site-header .main-nav .sf-menu {
		gap: 28px;
	}

	.site-header.header-v1 .main-nav .sf-menu > li > a,
	.site-header.header-v1 .main-nav .first-level,
	.site-header .main-nav .sf-menu > li > a {
		font-size: 15px;
	}
}

@media (max-width: 980px) {
	.site-header.header-v1 .main-nav,
	.site-header .main-nav {
		justify-content: flex-start;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.site-header .main-nav .sf-menu {
		justify-content: flex-start;
		gap: 18px;
		min-width: max-content;
		padding-bottom: 4px;
	}

	.site-header .main-nav .sf-menu > li {
		height: 48px;
		line-height: 48px;
	}

	.site-header.header-v1 .main-nav .sf-menu > li > a,
	.site-header.header-v1 .main-nav .first-level,
	.site-header .main-nav .sf-menu > li > a {
		height: 48px;
		line-height: 48px;
	}

	.site-header .main-nav .sf-menu > li.current > a::after,
	.site-header.header-v1 .main-nav .sf-menu > li.current > a::after {
		bottom: 6px;
	}

	.site-header .main-nav .sf-menu ul {
		left: 0;
		transform: translate(0, 10px);
	}

	.site-header .main-nav .sf-menu li:hover > ul,
	.site-header .main-nav .sf-menu li.sfHover > ul,
	.site-header.header-v1 .main-nav .sf-menu li:hover > ul,
	.site-header.header-v1 .main-nav .sf-menu li.sfHover > ul {
		transform: translate(0, 0);
	}
}
