@charset "utf-8";
.products-header{
	margin-top: 100px;
	background: url(../img/products-bg.jpg) no-repeat;
	color: white;
	overflow: hidden;
	background-size: 904px;
}
.products-header.service{
	background: url(../img/service-bg.jpg) no-repeat;
	height: 300px;
}
.products-header.contact{
	background: url(../img/contact.jpg) no-repeat;
	height: 300px;
}
.products-header h2{
	font-size: 60px;
	margin: 20px;
	float: left;
}
.products-header .mav-menu{
	width: 296px;
	margin-left: 904px;
	background: #16497e;
	height: 300px;
	height: 100%;
	padding: 24px 0;
}
.products-header .mav-menu ul li{
	line-height: 50px;
	padding: 0 50px;
	font-size: 18px;
}
.products-header .mav-menu ul li a:hover{
	text-decoration: underline;
}

/*左侧菜单*/
.left-navss{
	width: 248px;
	margin-top: 38px;
	float: left;
	margin:5px;
}
.left-navss li{
	height: 40px;
	line-height: 40px;
	padding: 0 20px;
}
.left-navss li a{
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.left-navss li:hover{
	background: #dbf1ff;
}

.left-nav{
	width: 248px;
	margin-top: 38px;
	border:solid 1px #e6e6e6;
	float: left;
}
.left-nav li{
	height: 40px;
	line-height: 40px;
	padding: 0 20px;
}
.left-nav li a{
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.left-nav li:hover{
	background: #dbf1ff;
}
.left-nav li.active{
	color: white;
	background: #16497e;
}
.left-nav~.right-content{
	margin-left: 300px;
	min-height: 100px;
	margin-top: 38px;
}
/*左侧菜单end*/
.double-col{
	overflow: hidden;
}
.products-list {
	padding-bottom: 30px;
}
.products-list ul{
	font-size: 0;
	margin-left: -20px;
}
.products-list li{
	display: inline-block;
	vertical-align: top;
	margin-left: 20px;
	width: 384px;
    height: 524px;
	border:solid 1px #e6e6e6;
	margin-bottom: 30px;
	box-sizing: border-box;
}
.products-list li:hover{
	border: solid 2px #16497e;
}
.products-list li a{
	display: block;
	width: 100%;
	height: 100%;
}
.products-list li img{
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}
.products-box{
	height: 448px;
	position: relative;
	border:solid 1px #e6e6e6;
}
.products-box img{
	margin: auto;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top:0;
	display: block;
	max-width: 100%;
	max-height: 100%;
}
table{
	border-collapse: collapse;
	width: 100%;
	margin: 20px 0;
}
table td,
table th{
	border: solid 1px #e6e6e6;
	padding: 20px 0;
	box-sizing: border-box;
}
table th{
	background: #dbf1ff;
	height: 50px;
	text-align: center;
}
table td{
	height: 40px;
	padding: 10px 20px;
}
table tr:nth-child(2n+1){
	background: #f0f0f0;
}
table a{
	color: #16497e;
}
table a:hover{
	text-decoration: underline;
}


.products-header.online-order{
	height: 300px;
	background: url(../img/online-order-bg.jpg) no-repeat;
	background-size: cover;
}
.products-header.online-order h2{
	float: right;
}

.online-order-box{
	overflow: hidden;
}
.online-order-box .left-col{
	margin-top: 40px;
	width: 494px;
	float: left;
	border:solid 1px #e6e6e6;
	box-sizing: border-box;
	padding: 30px 100px;
	margin-bottom: 40px;
	min-height: 421px;
}
.online-order-box .left-col h4{
	font-size: 20px;
	color: #00aeef;
	margin-top: 32px;
	word-break: break-word;
}
.online-order-box .left-col p{
	word-break: break-word;
	font-size: 16px;
	color: #999;
	margin-top: 24px;
	line-height: 1.5;
}
.online-order-box .right-col{
	margin-top: 40px;
	border:solid 1px #e6e6e6;
	margin-left: 524px;
	padding: 30px 100px;
	font-size: 16px;
	min-height: 421px;
	margin-bottom: 40px;
	box-sizing: border-box;
}
.online-order-box .right-col .item:first-child{
	margin-top: 10px;
}
.online-order-box .right-col .item {
	line-height: 54px;
	margin-top: 8px;
	border-bottom: solid 1px #e5e5e5;
}
.online-order-box .right-col .item label{
	font-size: 16px;
	color: #999;
	width: 130px;
	vertical-align: top;
	display: inline-block;
}
.online-order-box .right-col .item label.required:after{
	content: "\*";
}
.online-order-box .right-col .item input{
	width: calc(100% - 140px);
	vertical-align: top;
	display: inline-block;
	height: 54px;
	line-height: 54px;
	border: 0;
	outline: none;
	padding: 0;
}
.online-order-box .right-col .item textarea{
	resize: none;
	display: block;
	width: 100%;
	border: 0;
	height: 94px;
	padding: 0;
	outline: none;
	font-size: 16px;
	line-height: 1.6;
	position: relative;
}

.submit-btn{
	width: 180px;
	text-align: center;
	color: white;
	line-height: 50px;
	height: 50px;
	border-radius: 25px;
	font-size: 20px;
	background: #00aeef;
	display: inline-block;
	vertical-align: top;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.submit-btn:hover{
	opacity: .8;
}
.online-order-box .right-col .submit-btn{
	margin-top: 24px;
}


.map-box{
	height: 764px;
	border: solid 1px #e6e6e6;
	margin-top: 40px;
	margin-bottom: 88px;
	position: relative;
}
.map-box .map{
	margin-left: 300px;
	height: 100%;
}
.map-box .map iframe{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.map-box .info{
	height: 100%;
	width: 100%;
	/*background: url(../img/map-mask.png) no-repeat;*/
	background: rgb(246,246,246);
	width: 300px;
	position: absolute;
	top:0;
	left: 0;
	padding: 32px;
	border-right: solid 1px #e6e6e6;
	box-sizing: border-box;
}
.map-box .info h4{
	font-size: 24px;
}
.map-box .info p{
	word-break: break-word;
	font-size: 16px;
	margin-top: 46px;
	line-height: 1.5;
}
.map-box .info p.blue{
	color: #16497e;
}

/*samson add */
            #div1{
                position: relative;/*相对定位*/
				width: 380px;
				height: 520px;
				margin:auto;/*居中显示*/
            }
            /*图片部分的设置*/
            #img1{
                /*position: static;默认定位,可以省略*/
				position: absolute;/*绝对定位*/
                width:100%;
                height: 100%;
                top: 0px;/*离底下0像素*/
                left: 0px;/*left: 0px;离左边0像素*/				
            }
            /*文字的设置*/
            #span1{
                position: absolute;/*绝对定位*/
                width:100%;
				height:28%;
                bottom: 0px;/*离底下0像素*/
                left: 0px;/*left: 0px;离左边0像素*/
                text-align: center;
                font-size: 28px;
                color: red;
				background-color:rgba(255,255,255,1	);/*background-color:rgba(60,50,60,.2);*/
				font-family: arial;/*font-family: arial;simsun*/
            }  
/*samson add */
@media only screen and (max-width: 1024px) {
	.products-header {
	    margin-top: 0;
	    background: url(../img/products-bg.jpg) no-repeat center center;
	    background-size: cover;
	    height: 8rem;
	}
	.products-header h2{
		font-size: 2rem;
		margin: .75rem;
	}
	.left-nav{
		float: none;
		width: auto;
		display: block;
		border: 0;
		margin-top: .75rem;
	}
	.left-nav ul{
		display: block;
		font-size: 0;
		white-space: nowrap;
	}
	.left-nav{
		padding: 0;
		overflow-x: auto;
		border-bottom: solid 1px #16497e;
		padding: 0 .55rem;
	}
	.left-nav li{
		display: inline-block;
		vertical-align: top;
		font-size: 0.875rem;
		height: 2rem;
		line-height: 2rem;
		padding: 0 .75rem;
		margin: 0 .25rem;
	}
	.left-nav li:hover{
		background: inherit;
	}
	.left-nav~.right-content{
		float: none;
		margin: .75rem
	}
	.products-box{
		height: 12rem;
	}
	table{
		margin: .75rem 0;
	}
	table th{
		padding: .2rem 0;
		font-size: 0.875rem;
		height: 2.5rem;
	}
	table td{
		height: 1.75rem;
		padding: .2rem .5rem;
		font-size: 0.8125rem;
	}
	footer{
		margin-top: 1rem;
	}
	
	img{
		width: auto; height: auto; max-width: 100%; max-height: 100%;
	}
	
	.products-header.contact{
	    margin-top: 0;
	    background: url(../img/contact.jpg) no-repeat center center;
	    background-size: cover;
	    height: 8rem;
	}
	.map-box{
		margin-top: 0;
		margin-bottom: 0;
		border: none;
		height: auto;
	}
	.map-box .map{
		margin: .75rem;
		height: 16rem;
	}
	.map-box .info{
		width: auto;
		height: auto;
		position: relative;
		padding: 0;
		margin: 0.75rem;
		border: 0;
		background: none;
		top: auto;
    	left: auto;
	}
	.map-box .info h4{
		height: 1.75rem;
	}
	.map-box .info p{
		font-size: 0.9375rem;
		margin-top: .5rem;
	}
	.map-box .info p.blue{
		width: auto;
	}
	.products-header.online-order{
		margin-top: 0;
	    background: url(../img/online-order-bg.jpg) no-repeat center center;
	    background-size: cover;
	    height: 8rem;
	}
	.online-order-box .left-col{
		margin-top: 1rem;
		width: auto;
		float: none;
		padding: .75rem;
		margin: .75rem;
		min-height: 0;
	}
	.online-order-box .left-col h4{
		margin-top: 1rem;
		font-size: 1.0625rem;
	}
	.online-order-box .left-col p {
	    word-break: break-word;
	    font-size: 0.875rem;
	    margin-top: .3rem;
	}
	.online-order-box .right-col {
	    margin-top: .75rem;
	    border: solid 1px #e6e6e6;
	    margin: .75rem;
	    padding: .75rem;
	    font-size: 0.875rem;
	    min-height: 0;
	}
	.online-order-box .right-col .item{
		line-height: 2rem;
	}
	.online-order-box .right-col .item label{
		font-size: 0.875rem;
		width: 6.5rem;
	}
	.online-order-box .right-col .item input {
	    width: calc(100% - 7rem);
	    height: 2rem;
	    line-height: 2rem;
	    font-size: 0.875rem;
	    background: none;
	}
	.online-order-box .right-col .submit-btn{
		margin-top: 1rem;
	}
	.online-order-box .right-col .item textarea{
	    height: 4rem;
	    font-size: 0.875rem;
	    line-height: 1.6;
	    font-family: arial;
	}
	.submit-btn{
		width: 6rem;
	    text-align: center;
	    color: white;
	    line-height: 2rem;
	    height: 2rem;
	    border-radius: 1.25rem;
	    font-size: 1rem;
	    display: block;
	    margin: 0 auto;
	}
	.products-header.service{
	    margin-top: 0;
	    background: url(../img/service-bg.jpg) no-repeat no-repeat center center;
	    background-size: cover;
	    height: 8rem;
	}
	
	
	.products-list {
		padding-bottom: 0;
	}
	.products-list ul{
		font-size: 0;
		margin-left: -.75rem;
	}
	
	
	/*	width: 384px; height: 524px;524*100/750=70vw  height: 38vw;
	
		.products-list li{
		display: inline-block;
		vertical-align: top;
		margin-left: .75rem;
	    width: calc(50% - .75rem);
	    height: 38vw;
		margin-bottom: .75rem;
	}

	*/

	.products-list li{
		display: inline-block;
		vertical-align: top;
		width: 384px;
		height: 524px;
	}
	
	.products-list li:hover{
		border: solid 2px #16497e;
	}
	.products-list li img{
		width: auto; height: auto; max-width: 100%; max-height: 100%;
	}
/*samson add */
	.product2-div{
		position: relative;/*相对定位*/
		width: 380px;/*auto;*/
		height: 520px;
		margin:auto;/*居中显示*/
    }
            /*图片部分的设置*/
    .product2-div .product2-img{
                /*position: static;默认定位,可以省略*/
		position: absolute;/*绝对定位*/
		width:100%;
		height: 100%;
		top: 0px;/*离底下0像素*/
        left: 0px;/*left: 0px;离左边0像素*/				
    }
            /*文字的设置*/
	.product2-div .product2-span{
		position: absolute;/*绝对定位*/
		width:100%;
		height:28%;
		bottom: 0px;/*离底下0像素*/
		left: 0px;/*left: 0px;离左边0像素*/
		text-align: center;
		font-size: 28px;
		color: green;
		background-color:rgba(255,0,255,1	);/*background-color:rgba(60,50,60,.2);*/
	}  
/*samson add */


}