
.all-products, .all-products *{
	display: flex;
}

.main-title{
	font-size:14px;
	font-family:'Cambay Devanagari' serif;
	font-weight: bold;
	color: #3C3C3C;
	line-height:15px;
}
.vertical-line{
	width: 1px;
	height: 12px;
	border: 1px solid #E5E5E5;
	/* margin:0 10px; */
	transform: scaleX(0.3);
}
.sub-title{
	font-family: 'Source Han Sans CN' serif;
	font-size: 12px;
	font-weight: 400;
	color: #787878;
	line-height:15px;
}


@font-face{
	font-family:'Cambay Devanagari'; 
	src: url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/CambayDevanagari-Bold.AH.eot');
	src:url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/CambayDevanagari-Bold.AH.woff') format('woff'),
	    url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/CambayDevanagari-Bold.AH.ttf') format('truetype'),
	    url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/CambayDevanagari-Bold.AH.svg') format('svg');
}

@font-face{
	font-family: 'Source Han Sans CN'; 
	src: url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/SourceHanSansCNExtraLight.eot');
	src:url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/SourceHanSansCNExtraLight.woff') format('woff'),
	    url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/SourceHanSansCNExtraLight.ttf') format('truetype'),
	    url('https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/SourceHanSansCNExtraLight.svg') format('svg');
}


.all-products{
	display: none;
	z-index: 999!important;
	width:100vw;
	flex-direction: row;
	position: fixed;
	left:0;
	background-color:#FFFFFF;
	justify-content: center;
}
/* 手机端  所有产品14px 14px 12px 12px */
@media only screen and (max-width:750px) {
	
	.pc-pro-box,.pc-pro-img,
	.pc-pro-content,.pc-pro-row,
	.pc-pro-nav,.line-a,.line-b,.line-c,
	.pc-pro-block-box,
	.pc-wap2app,
	.pc-wap2app-line,
	.pc-sub-wap2app,
	.pc-pro-block{
		display: none;
	}
	
	.all-products{
		height:100vh;
		top:100px;
	}
	
	.mob-nav-box{
		height:100vh;
		flex-direction:column;
		background-color:#F4F4F4;
		justify-content: flex-start;
		align-items: flex-start;
		padding-top:10px;
	}
	.mob-nav{
		width:30vw;
		justify-content: center;
		position:relative;
		font-size:14px;
		font-family: Lantinghei SC;
		color: #414141;
		height:45px;
		line-height:45px;
		margin-top: 20px;
		cursor: pointer;
		background-color:#F4F4F4;
		transition-property: background-color;
		transition-duration: 0.1s;
		transition-timing-function: linear;
		transition-delay:0.1s;
	}
	.mob-nav.active-mob{
		background-color:#FFFFFF;
		font-weight:600;
		transition: background-color 0.3s;
		-webkit-transition: background-color 0.3s; /* Safari */
	}
	.mob-nav.active-mob::before{
		content: "";
		width:4px;
		height:14px;
		top:15px;
		left:0;
		position:absolute;
		background-color:#2B9939;
	}
	.mob-content{
		width: 70vw;
		height: 100vh;
		overflow: auto;
		flex-direction: column;
		padding: 20px;
		display: none;
		padding-bottom: 120px;
	}
	.mob-show{
		display: flex;
	}
	.mob-close-icon{
		width: 15px;
		height: 15px;
		margin-bottom: 10px;
		color: #787878;
		align-self: flex-end!important;
		position: fixed;
		top:110px;
		right:10px;
	}
	.mob-row{
		flex-direction: row;
		height:45px;
		align-items: center;
		flex-shrink: 0;
	}
	
	.mob-row .main-title{
		font-size:12px;
	}
	.mob-row .sub-title{
		font-size:12px;
	}	
	
	.mob-row .vertical-line{
		width: 1px;
		height: 12px;
		border: 1px solid #E5E5E5;
		margin:0 10px;
		transform: scaleX(0.3);
	}
}


/* 所有产品16px 14px 12px 10px */
@media only screen and (min-width:751px) and (max-width:1024px){
	
	
	.mob-nav-box,.mob-nav,
	.mob-content,.mob-show,
	.mob-row,
	.mob-close-icon
	{
		display: none;
	}
	.nav-bottom a {
	    margin-left: 2vw!important;
	    font-size: 16px;
	}
	.all-products {
	    top: 78px;
	    /* height:450px; */
		 height:100vh;
		 overflow-y: scroll;
	    border-top: 1px solid #eae2d6;
	    border-bottom: 1px solid #eae2d6;
	}
	.all-products::after{
		content: "";
		width:0;
		height:0;
		pointer-events:none;
	}
	.pc-pro-content-box{
		flex-direction: row;
		justify-content: flex-start;
	}
	.pc-pro-box{
		width:50%;
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
		margin-top:12px;
	}
	.pc-pro-img {
	    width: 36px;
	    height: 36px;
		 margin-right:10px;
	}

	
	.pc-pro-nav {
	    margin-bottom: 16px;
	    width: 65px;
	    font-size:14px;
	    font-family: Lantinghei SC;
	    font-weight:600;
	    color: #414141;
	    margin-top: 10px;
	}
	.pc-pro-block-box {
		width:900px;
	    flex-direction: column;
	    align-items: flex-start;
	    justify-content: space-between;
	    width: auto;
	}
	.pc-pro-content{
		flex-direction: column;
		justify-content: flex-start;
	}
	.line-a {
	    width:25vw;
	    height: 2px;
	    background: #E1E1E1;
	    opacity: 0.42;
	}
	.line-b {
	    width: 22vw;
	    height: 2px;
	    background: #E1E1E1;
	    opacity: 0.42;
	}
	.line-c {
	    width: 22vw;
	    height: 2px;
	    background: #E1E1E1;
	    opacity: 0.42;
	}

	.pc-pro-block{
		flex-direction: column;
		/* margin-top:16px; */
		align-items: flex-start;
		justify-content: flex-start;
	}

	.pc-pro-row{
		flex-direction: row;
		align-items: center;
		margin:13px 0;
		cursor: pointer;
		transition: all 0.6s;
		/* width:20vw; */
		margin-right:10px;
	}
	.pc-pro-row .main-title{
		font-size:12px;
	}
	.pc-pro-row .sub-title{
		font-size:10px;
	}
	.pc-pro-row:hover .main-title{
		font-family: 'Source Han Sans CN' serif;
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
		font-size:12px;
	}
	.pc-pro-row:hover .sub-title{
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
		font-size:10px;
	}
	.pc-pro-row:hover .vertical-line{
		border: 1px solid #2B9939;
	}
	.main-title{
		min-width:70px;
		/* word-break: break-all; */
	}
	.vertical-line{
		margin:0 10px;
	}
}


/* 笔记本电脑 小屏 @media only screen and (min-width:641px) and (max-width:1920px)*/
@media only screen and (min-width:1025px) and (max-width:1530px){
	.mob-nav-box,.mob-nav,
	.mob-content,.mob-show,
	.mob-row,
	.mob-close-icon
	{
		display: none;
	}
	
	.nav-bottom a {
	    margin-left: 2vw!important;
	    font-size: 16px;
	}
	.all-products{
		top:78px;
		height:500px;
		border-top: 1px solid #eae2d6;
		border-bottom: 1px solid #eae2d6;
	}
	.all-products::after{
		content: "";
		width:100vw;
		background-color: #000000;
		opacity:0.1;
		z-index:10;
		position: fixed;
		top: 0;
		left:0;
		pointer-events:none;
	}
	.pc-pro-content-box{
		flex-direction: row;
	}
	.pc-pro-box{
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
		margin-top:10px;
	}
	.pc-pro-img{
		width: 36px;
		height: 36px;
		margin-right:15px;
	}
	.pc-pro-content{
		flex-direction: column;
		justify-content: flex-start;
	}
	.pc-pro-nav{
		margin-bottom:16px;
		font-size: 16px;
		font-family: Lantinghei SC;
		font-weight: 600;
		color: #414141;
		margin-top:10px;
		
	}
	.line-a{
		width:45vw;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.line-b{
		width:180px;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.line-c{
		width:180px;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.pc-pro-block-box{
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
	}
	.main-title{
		min-width: 70px;
	}
	
	.pc-pro-block{
		flex-direction: column;
		margin-top:16px;
		min-width: 210px;
		/* min-width: 30%; */
	}
	
	.pc-pro-row{
		flex-direction: row;
		align-items: center;
		margin:20px 0;
		cursor: pointer;
		transition: all 0.6s;
		width:16vw;
	}
	
	.pc-pro-row:hover .main-title{
		font-family: 'Source Han Sans CN' serif;
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
	}
	
	.pc-pro-row:hover .sub-title{
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
	}
	.pc-pro-row:hover .vertical-line{
		border: 1px solid #2B9939;
	}
	.vertical-line{
		margin:0 6px;
	}
}


/* 所有产品16px 16px 14px 12px 
pc端 @media only screen and (min-width:641px) and (max-width:1920px)*/
@media only screen and (min-width:1531px) {
	
	.mob-nav-box,.mob-nav,
	.mob-content,.mob-show,
	.mob-row,
	.mob-close-icon
	{
		display: none;
	}
	
	.nav-bottom a {
	    margin-left: 2vw!important;
	    font-size: 16px;
	}
	.all-products{
		top:78px;
		height:500px;
		padding:0 60px;
		border-top: 1px solid #eae2d6;
		border-bottom: 1px solid #eae2d6;
	}
	.all-products::after{
		content: "";
		width:100vw;
		background-color: #000000;
		opacity:0.1;
		z-index:10;
		position: fixed;
		top: 0;
		left:0;
		pointer-events:none;
	}
	.pc-pro-content-box{
		flex-direction: row;
		
	}
	.pc-pro-box{
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
		margin-top:10px;
	}
	.pc-pro-img{
		width: 36px;
		height: 36px;
		margin-right:15px;
	}
	.pc-pro-content{
		flex-direction: column;
		justify-content: flex-start;
		
	}
	.pc-pro-nav{
		margin-bottom:16px;
		font-size: 16px;
		font-family: Lantinghei SC;
		font-weight: 600;
		color: #414141;
		margin-top:10px;
	}
	.main-title{
		min-width: 80px;
	}
	.line-a{
		width: 800px;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.line-b{
		width: 237px;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.line-c{
		width: 260px;
		height: 2px;
		background: #E1E1E1;
		opacity: 0.42;
	}
	.pc-pro-block-box{
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
	}

	.pc-pro-block{
		flex-direction: column;
		margin-top:16px;
		margin-bottom: 30px;
		margin-right: 25px;
	}
	
	.mr-2{
		margin-right:2vw;
	}

	.pc-pro-row{
		flex-direction: row;
		align-items: center;
		margin:20px 0;
		cursor: pointer;
		transition: all 0.6s;
		width:14vw;
	}
	
	.pc-pro-row:hover .main-title{
		font-family: 'Source Han Sans CN' serif;
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
	}
	
	.pc-pro-row:hover .sub-title{
		font-weight: bold;
		/* font-style: italic; */
		color: #2B9939;
	}
	.pc-pro-row:hover .vertical-line{
		border: 1px solid #2B9939;
	}
	.vertical-line{
		margin:0 10px;
	}
	
}


