/* 盒子方式 */
.border-box {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

.d-flex {
	display: -webkit-box;
	/* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;
	/* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;
	/* TWEENER - IE 10 */
	display: -webkit-flex;
	/* NEW - Chrome */
	display: flex;
	/* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.d-none {
	display: none;
}

.flex-1,
.flex1 {
	-webkit-box-flex: 1;
	/* OLD - iOS 6-, Safari 3.1-6 */
	-moz-box-flex: 1;
	/* OLD - Firefox 19- */
	-webkit-flex: 1;
	/* Chrome */
	-ms-flex: 1;
	/* IE 10 */
	flex: 1;
	/* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.wx {
	width: 66px;
}

.w-100 {
	width: 100%;
}

.h-100 {
	height: 100%;
}

.h-50 {
	height: 50%;
}

.d-no {
	display: none;
}

.hidden {
	visibility: hidden;
}

.clearfix:after {
	content: ' ';
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.f-left {
	float: left;
}

.w-20 {
	width: 20%;
}

.w-30 {
	width: 30%;
}

.w-70 {
	width: 70%;
}

.w-80 {
	width: 80%;
}

.over-one {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.align-center {
	align-items: center;
}

.pointer {
	cursor: pointer;
}

.not-allowed {
	cursor: not-allowed;
}

.container {
	width: 1280px;
	min-width: 1280px;
	margin: 0 auto;
}

.new_container {
	/* width: 1800px; */
	width: 98%;
	max-width: 1800px;
	min-width: 1200px;
	margin: 0 auto;
}

.content_box {
	width: 854px;
	margin: 0 auto;
}

.new_content_box {
	width: 1280px;
	margin: 0 auto;
}

/* 分页按钮 */


.page_check {
	text-align: center;
	margin-top: 121px;
	margin-bottom: 150px;
	justify-content: center;

}

.page_check>div {
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 36px;
	color: #999999;
	border: 1px solid #E5E5E5;
	margin-right: 7px;
	font-size: 16px;
	cursor: pointer;
}

.page_check>div.active {
	background-color: #444444;
	color: #FFFFFF;
	border-color: #444444;
	cursor: default;
}

/* 顶部logo和展开按钮 */
.top_logo_box {
	flex-direction: column;
}

.logo {
	width: 208px;
}

.zhankai {
	width: 70px;
	height: 21px;
	margin: 20px 44px 0;
}

/* 弹出文字提醒 */
.alert {
	position: fixed;
	top: 5%;
	z-index: 9999999999;
	width: 100%;
	display: flex;
	justify-content: center;
}

.alert>span {
	padding: 10px 20px;
	background-color: #FEF0F0;
	border-radius: 10px;
	position: absolute;
	color: #F56C6C;
	animation: alert 0.3s linear;
}

@keyframes alert {
	from {
		top: -30px;
		opacity: 0;
	}

	to {
		top: 0;
		opacity: 1;
	}
}

/* 左侧固定的logo和展开图标 */
.left_open_icon_box {
	position: fixed;
	top: 10px;
	left: 0;
	text-align: center;
	z-index: 10000;
}

.logo_fixed {
	width: 240px;
	cursor: pointer;
}

.left_open_icon {
	width: 55px;
	margin-top: 0;
	cursor: pointer;
	position: relative;
	left: -53px;
}

/* 左侧悬浮展开 */
.left_open_box {
	position: fixed;
	z-index: 9999;
	height: 100%;
	background-color: #fff;
	font-size: 14px;
}

.left_open_one_box {
	width: 240px;
	text-align: left;
	/* padding: 0 35px; */
}

.left_open_one_centent {
	/* margin: 0 35px; */
}

.left_open_one_box_logo {
	width: 100%;
	margin-top: 14px;
	margin-bottom: 60px;
	cursor: pointer;
	/* opacity: 0; */
}

.left_open_one_item {
	color: #999999;
	padding: 15px 60px;
	margin-bottom: 5px;
	/* font-size: 12px; */
	display: -webkit-box;
	/* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;
	/* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;
	/* TWEENER - IE 10 */
	display: -webkit-flex;
	/* NEW - Chrome */
	display: flex;
	/* NEW, Spec - Opera 12.1, Firefox 20+ */
	align-items: center;
	justify-content: space-between;
}

.left_open_one_item>img {
	width: 5px;
	height: 8px;
	margin-left: 30px;
	vertical-align: middle;
}

.left_open_one_item:hover .new_two {
	left: 240px;
}

.new_two {
	position: absolute;
	left: 0px;
	top: 0px;
	transition: all 0.3s;
	z-index: 99999;
}

.have_two {
	position: relative;
	cursor: pointer;
}

.have_two.active {
	color: #444444;
}

.have_two.active::before {
	position: absolute;
	left: -70px;
	top: 9px;
	content: " ";
	width: 30px;
	height: 1px;
	background-color: #999999;
}

.left_box_two,
.left_box_one {
	overflow: hidden;
}

.left_box_one.active,
.left_box_two.active {
	display: block;
	animation: left_open_one .3s linear;
}

.left_box_one.active {
	animation: left_open_one .3s linear;
	border-right: 1px solid #e5e5e5;
}

@keyframes left_open_one {
	from {
		width: 0px;
	}

	to {
		width: 240px;
	}
}

.left_box_two.active {
	animation-name: left_open_two;
}

.left_box_two.active.close {
	animation-name: left_open_close;
}

@keyframes left_open_two {
	from {
		width: 0px;
	}

	to {
		width: 240px;
	}
}

@keyframes left_open_close {
	from {
		width: 240px;
	}

	to {
		width: 0px;
	}
}

.left_box_one.close {
	display: block;
	animation: left_open_one_close .2s linear;
}

.left_box_one.close.d-none {
	display: none;
}

@keyframes left_open_one_close {
	from {
		width: 160px;
	}

	to {
		width: 0;
	}
}


/* 左侧悬浮窗的二级分类 */
.new_two_box {
	position: absolute;
	width: 0;
	height: 100%;
	overflow: hidden;
	left: 241px;
	top: 0px;
	transition: all .3s;
}

.left_open_two_box,
.new_two {
	width: 200px;
	height: 100%;
	color: #999999;
	padding: 182px 30px 0 30px;
	/* border-left: 1px solid #E5E5E5; */
	visibility: hidden;
}

.left_open_one_item:hover .new_two_box {
	width: 200px;
}

.left_open_one_item:hover .new_two {
	left: 0px;
}

.new_two {
	visibility: visible;
	position: relative;
	left: -240px;
	transition: all .3s;
	background-color: #fff;
	box-sizing: border-box;
}

.new_two>div {
	cursor: pointer;
}

.left_open_two_box>div,
.new_two>div {
	margin-bottom: 30px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.left_open_two_box>div:hover,
.new_two>div:hover {
	color: #444444;
	/* cursor: pointer; */
}

/* 部分页面的banner图 */
.banner {
	width: 100%;
	min-width: 1280px;
}

.banner>img {
	width: 100%;
}

/* 没有数据盒子 */
.no_data_box {
	height: 500px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.justify-center {
	justify-content: center;
}


/* 滚动条 */
body,
.popup>div>div,
.introduce_introduce_content::-webkit-scrollbar {
	scrollbar-arrow-color: #f2f2f3;
	/*上下箭头*/
	scrollbar-track-color: #1589ce;
	/*底层背景色*/
	scrollbar-face-color: #666;
	/*滚动条前景色*/
	scrollbar-Shadow-color: #1589ce;
	/*滚动条边线色*/
}

/*chrome滚动条颜色设置*/
body::-webkit-scrollbar,
.popup>div>div::-webkit-scrollbar,
.introduce_introduce_content::-webkit-scrollbar{
	width: 10px;
	height: 10px;
	background-color: transparent;
}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
body::-webkit-scrollbar-track,
.popup>div>div::-webkit-scrollbar-track,
.introduce_introduce_content::-webkit-scrollbar-track {
	background-color: #ccc;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

/*定义滚动条轨道 内阴影+圆角*/
body::-webkit-scrollbar-thumb,
.popup>div>div::-webkit-scrollbar-thumb,
.introduce_introduce_content::-webkit-scrollbar-thumb {
	background-color: #555;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}


/* 产品搜索的样式 */
.search_box {
	position: fixed;
	top: 30px;
	left: 50%;
	margin-left: -200px;
	width: 400px;
	height: 50px;
	border: 1px solid #e5e5e5;
	color: #999;
	align-items: center;
	box-sizing: border-box;
	z-index: 999999;
	background-color: #fff;
}

.search_box>input {
	flex: 1;
	outline: none;
	border: 0;
	font-size: 16px;
	padding: 0 20px;
	height: 100%;
}

.search {
	width: 30px;
	height: 30px;
	margin-right: 20px;
	cursor: pointer;
}