/* Global Styles */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100% !important;
	text-size-adjust: 100% !important;
	-webkit-tap-highlight-color: transparent;
}

body {
	font-family: Arial, sans-serif;
	background-color: #fff;
	color: #000;
	overflow-x: hidden;
	/* 解决字体层渲染抖动 */
	/* transform: translateZ(0); */
	/* -webkit-transform: translateZ(0); */
	/* 禁止文字被缩放 */
	text-size-adjust: none !important;
	-webkit-text-size-adjust: none !important;
	-webkit-font-smoothing: antialiased;
}

a {
	text-decoration: none;
}

img{
	display: block; /*解决每个图片后面都跟随一个3-5像素空白的BUG*/
}

li{ list-style: none;}

input:focus {
	outline: none;
	/* 通常，聚焦时会显示一个轮廓，使用outline: none;可以去掉它 */
	border: none;
	/* 完全去除边框 */
}

.full-page{
	max-width: 2000px;
	margin: 0 auto;
}

.blank {
	height: 100px;
	clear: both;
}

.sub-header {
	height: 180px;
	line-height: 180px;
	font-size: 48px;
	max-width: 2000px;
	margin: 0 auto;
	margin-top: 48px;
	background: url(../images/page-topbg.jpg) no-repeat;
	background-size: 100%;
	text-align: center;
	color: #FFF;
	font-weight: bold;
}

.container {
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}

/* Navigation Bar */
.navbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: #000;
	height: 48px;
	z-index: 1000;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.navbar .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}

.navbar-left .logo {
	display: block;
}

.navbar-left .logo img {
	margin-top: 2px;
	height: 24px;
}

.navbar-center .nav-links {
	display: flex;
	list-style: none;
	gap: 30px;
}

.navbar-center .nav-links li {
	padding: 0 15px;
}

.navbar-center .nav-links a {
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	transition: opacity 0.3s ease;
}

.navbar-center .nav-links a:hover {
	opacity: 0.7;
}

.navbar-right .user-avatar {
	font-size: 20px;
	color: #fff;
	text-decoration: none;
}

/* Banner section-blockquote */

.banner-blockquote {
	max-width: 1200px;
	padding-top: 60px;
	text-align: center;
	margin: 0 auto;
}

.banner-blockquote h2 {
	font-size: 59px;
	font-weight: 600;
	color: #FFF;
}

.banner-blockquote p {
	font-size: 33px;
	color: rgba(255, 255, 255, 0.9);
	padding-top: 11px;
}

.banner-blockquote .btns {
	padding-top: 50px;
}

.banner-blockquote .btns a {
	padding: 14px 30px;
	border: #0071E3 solid 2px;
	border-radius: 25px;
	text-decoration: none;
	margin: 0 10px;
	font-weight: 600;
}

.banner-blockquote .btns a:hover {
	border: #0076ED solid 2px;
}

.banner-blockquote .btns a.buy {
	background: #0071E3;
	color: #FFF;
}

.banner-blockquote .btns a.buy:hover {
	background: #0076ED;
}

.banner-blockquote .btns a.learn-more {
	color: #0071E3;
}

.banner-blockquote .btns a.learn-more:hover {
	color: #0076ED;
}

.banner-1 {
	background: #000 url('../images/banner-1.jpg') no-repeat center center;
	background-size: cover;
	height: 750px;
	margin-top: 48px;
}

.banner-2 {
	background: #000 url('../images/banner-2.jpg') no-repeat center center;
	background-size: cover;
	height: 750px;
	margin-top: 10px;
}

/* Product */
.product-list {
	display: inline-block;
	width: 100%;
	padding: 5px;
	padding-bottom: 0;
}

.product-list blockquote {
	width: 50%;
	padding: 5px;
	float: left;
	position: relative;
}

.product-list blockquote img {
	width: 100%;
	height: 100%;
}

.product-list blockquote .product-title {
	position: absolute;
	width: 100%;
	display: block;
	left: 0;
	top: 0;
	text-align: center;
}

.product-list blockquote .product-title h2 {
	padding-top: 70px;
	font-size: 43px;
}

.product-list blockquote .product-title p {
	padding-top: 10px;
	font-size: 18px;
}

.product-list .btns {
	padding-top: 30px;
}

.product-list .btns a {
	padding: 10px 20px;
	border: #0071E3 solid 1px;
	border-radius: 25px;
	text-decoration: none;
	margin: 0 10px;
	font-weight: 600;
}

.product-list .btns a:hover {
	border: #0076ED solid 1px;
}

.product-list .btns a.buy {
	background: #0071E3;
	color: #FFF;
}

.product-list .btns a.buy:hover {
	background: #0076ED;
}

.product-list .btns a.learn-more {
	color: #0071E3;
}

.product-list .btns a.learn-more:hover {
	color: #0076ED;
}

.blog-buy{
	background: #0071E3;
	color: #FFF;
	font-size: 24px;
	padding: 10px 30px;
	border-radius: 40px;
}

.foot-ad {
	clear: both;
	height: 930px;
	width: 100%;
	background: #000 url('../images/foot-ad.jpg') no-repeat center center;
	text-align: right;
	padding-right: 100px;
	color: #FFF;
}

.foot-ad blockquote {
	width: 90%;
	margin: 0 auto;
	padding-top: 130px;
}

.foot-ad table {
	width: 100%;
}

.foot-ad table td {
	text-align: right;
}

.foot-ad img {
	width: 700px;
	float: right;
}

.foot-ad .line {
	width: 400px;
	border-top: solid 1px #FFF;
	border-bottom: solid 1px #FFF;
	height: 10px;
	line-height: 10px;
	float: right;
	margin-top: 65px;
}

.foot-ad b {
	display: block;
	font-size: 45px;
	margin-top: 100px;
}

.foot-ad p {
	font-size: 24px;
	font-weight: normal;
	margin-top: 15px;
}

.foot-ad a.foot-shop {
	text-decoration: none;
	text-align: center;
	display: inline-block;
	color: #FFF;
	margin-top: 100px;
}

.foot-ad a.foot-shop i {
	display: block;
	width: 90px;
	height: 90px;
	background: #FFF url('../images/2026-02-03_165502.png') no-repeat center center;
	border-radius: 50%;
	margin: 0 auto;
	margin-bottom: 10px;
}

/* Footer Subscription and Social Icons */
.footer-subscription {
	background-color: #000;
	padding: 30px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.subscription-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.social-icons {
	display: flex;
	gap: 20px;
}

.social-icons span {
	color: #FFF;
	height: 40px;
	line-height: 40px;
}

.social-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #fff;
	text-decoration: none;
	transition: all 0.3s ease;
	border: solid 1px #FFF;
}

.subscription-form {
	float: right;
	color: #FFF;
}

.subscription-form a {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	line-height: 40px;
	color: #FFF;
	float: right;
	border: solid 1px #FFF;
}

.subscription-form span {
	float: right;
	height: 40px;
	line-height: 40px;
	padding-right: 20px;
}


/* Footer Copyright */
.footer-copyright {
	background-color: #000;
	padding: 30px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-copyright p {
	text-align: center;
	color: rgba(255, 255, 255, 0.5);
	font-size: 14px;
	line-height: 1.7;
}
















/* 移动端样式 */

.mobile-menu-btn {
	display: none;
	background: none;
	border: none;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
}

.mobile-nav-user{
	display: none;
	color: #fff;
	font-size: 16px;
	width: 100%;
	text-align: right;
	padding-right: 30px;
}
.mobile-nav-user a{
	color: #fff;
}
.mobile-nav-user i{
	padding-left: 10px;
}

/* Mobile Navigation Menu */
.mobile-menu {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #F5F5F7;
	color:#666;
	z-index: 1100;
	display: none;
	align-items: center;
	justify-content: center;
}

.mobile-menu.active {
	display: flex;
}

.mobile-menu-content {
	position: relative;
	width: 100%;
	max-width: 400px;
	padding: 40px;
}

.mobile-menu-close {
	position: absolute;
	top: 20px;
	right: 20px;
	background: none;
	border: none;
	color: #000;
	font-size: 24px;
	cursor: pointer;
}

.mobile-nav-links {
	list-style: none;
	text-align: left;
}

.mobile-nav-links li {
	margin: 30px 0;
}

.mobile-nav-links a {
	color: #000;
	font-weight: 600;
	text-decoration: none;
	font-size: 32px;
	transition: opacity 0.3s ease;
}

.mobile-nav-links a:hover {
	opacity: 0.7;
}



@media (max-width: 1200px) {
	
	.product-list blockquote .product-title h2{
		font-size: 30px;
		padding-top: 35px;
	}
	.product-list blockquote .product-title p{
		font-size: 16px;
	}
	.product-list .btns{
		padding-top: 20px;
	}
	.product-list .btns a{
		padding:8px 16px;
	}
		
	.foot-ad {
		width: 100%;
		height:550px;
		background-size: 100%;
		padding-right: 0;
	}
	.foot-ad blockquote{
		padding-top: 40px;
	}
	
	.foot-ad .line{
		margin-top: 30px;
	}
	
	.foot-ad b{
		font-size: 32px;
		margin-top: 30px;
	}
	
	.foot-ad p{
		font-size: 16px;
	}
	
	.foot-ad a.foot-shop{
		margin-top: 50px;
	}
	
	.foot-ad a.foot-shop i{
		width:70px;
		height:70px;
		background-size:80%;
	}
	

	
/* 	.social-icons span{
		display: none;
	}
	
	.sub-header{
		height:100px;
		line-height: 100px;
		font-size: 32px;
	}
	
	.blank {
		height: 40px;
	} */

}



@media (max-width: 768px) {
	.navbar-center {
		display: none;
	}
	
	.navbar-right {
		display: none;
	}
	
	.mobile-menu-btn {
		display: block;
	}
	.mobile-nav-user{
		display: block;
	}
	
	.banner-blockquote{
		padding-top: 30px;
	}
	.banner-blockquote h2{
		font-size: 32px;
	}
	.banner-blockquote p{
		font-size: 18px;
	}
	.banner-1{
		height:480px;
	}
	.banner-2{
		height:450px;
		margin-top: 0;
	}
	.banner-blockquote .btns{
		padding-top:40px;
	}
	.banner-blockquote .btns a{
		padding:8px 16px;
	}
	
	.product-list{
		padding: 0;
	}
	.product-list blockquote{
		width:100%;
		overflow-x: hidden;
		padding: 0;
	}
	.product-list blockquote img{
		width:140%;
		margin-left: -20%;
	}
	.product-list blockquote .product-title h2{
		font-size: 30px;
		padding-top: 20px;
	}
	.product-list blockquote .product-title p{
		font-size: 16px;
	}
	.product-list .btns{
		padding-top: 20px;
	}
	.product-list .btns a{
		padding:8px 16px;
	}
	
	/*首页底部*/
	.foot-ad {
		width: 100%;
		height:500px;
		background-image: url('../images/mobile-foot-ad.jpg?t=11');
		background-size: 100%;
		padding-right: 20px;
	}
	
	.foot-ad blockquote {
		width: 100%;
		padding-top: 50px;
	}
	.foot-ad img{
		width:80%;
		float: right;
	}
	.foot-ad .line{
		width:40%;
		margin-top: 30px;
	}
	.foot-ad b{
		font-size: 20px;
		margin-top: 30px;
	}
	.foot-ad p{
		font-size: 10px;
		margin-top: 5px;
	}
	.foot-ad a.foot-shop{
		margin-top: 50px;
		font-size: 12px;
	}
	.foot-ad a.foot-shop i{
		width:50px;
		height:50px;
		background-size:80%;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.social-icons span{
		display: none;
	}
	
	.sub-header{
		height:100px;
		line-height: 100px;
		font-size: 32px;
	}
	
	.blog-buy{
		font-size: 18px;
		display: block;
		width:90%;
	}
	
	.blank {
		height: 40px;
	}

}