@charset "utf-8";
/* 页面内容 css*/
/* 手机小于 768*/
@media (max-width: 768px) {
	/* 主标题 */
	.content-h1{
		font-size: 16px;
		color: #333333;
		font-weight: bolder;
		font-family: 幼圆;
	}
	/* 副标题 */
	.content-h2{
		font-size: 13px;
		color: #999999;
	}
	/* 内容 */
	.content-h3{
		font-size: 11px;
	}
	/* 加大突出 */
	.content-h4{
		font-size: 16px;
	}
	/* 图片下面的解释文字*/
	.content-h5{
		font-size: 13px;
	}
	/* 内容段落 */
	.p-content{
		line-height:20px

	}
	.white-div{
			 height: 8px;
		 }
	/* 主标题下面的下划线*/
	.line-div{
		width: 40px;
		margin: 0 auto;
		background-color: #f05f40;
		height: 2px;
	}
	.white-divIndex{
		height: 1px;
	}
	.picture1{
		padding-bottom: 30px;
	}
	/*图片亭子结构*/
	.picture_jg{
		padding: 0px;
	}
	.content-sp1{
		padding-top:5px;
	}
	.row-margin{
		margin: 0px 0px 15px 0px
	}
	.a-shipin{
		position: relative;
		left: 20px;
		bottom: 30px;
		z-index:10
	}
	.img-shipin{
		width: 100px;
		height: auto;
	}
	.div-left {
		margin-right: 0px;
	}

	.div-right {
		margin-left: 0px;
	}

	.div-height-change {
		height: auto;
	}
	/*卡片多样部署*/
	.div-height-change-bs{
		height: auto;
	}
	/*卡片多样部署高度小*/
	.div-height-change-s{
		height: 170px;
	}
	/*卡片多样部署高度中*/
	.div-height-change-m{
		height: 200px;
	}
	/*卡片固定高度-高度较低*/
	.div-height-change-low {
		height: 180px;
	}
	/*卡片固定高度-高度较高*/
	.div-height-change-high{
		height: 260px;
	}
	.cad_change{
		height: 450px;
	}
	/*图片 数字*/
	.img_num{
		float: left;
		width: 20px;
	}
	/*内容大图片*/
	.pic_big{
		padding: 0px;
	}
	/*手机下载*/
	.phoneDownload{
	}
	/*电脑下载*/
	.pcDownload{
		display:none;
	}
	/*天天落实APP图标*/
	.img-ttluoshi{
		width: 60px;
		height: 60px;
	}

}
/* 平板电脑 768到992*/
@media (min-width: 768px) {
	.content-h1{
		font-size: 30px;
		color: #333333;
		font-weight: bolder;
		font-family: 幼圆;
	}
	.content-h2{
		font-size: 18px;
		color: #999999;
	}
	.content-h3{
		font-size: 16px;
	}
	/* 加大突出 */
	.content-h4{
		font-size: 20px;
	}
	/* 图片下面的解释文字*/
	.content-h5{
		font-size: 14px;
	}
	.white-div{
		height: 30px;
	}
	/* 主标题下面的下划线*/
	.line-div{
		width: 50px;
		margin: 0 auto;
		height: 3px;
		background-color: #f05f40;
	}
	.white-divIndex{
		height: 5px;
	}
	.picture1{
		padding-bottom: 75px;
	}
	/*图片亭子结构*/
	.picture_jg{
		padding: 0px;
	}
	.content-sp1{
		padding-top:15px
	}
	.row-margin{
		margin: 0px 0px 20px 0px
	}
	/* 内容段落 */
	.p-content{
		line-height:30px

	}
	.a-shipin{
		position: relative;
		left: 100px;
		bottom: 50px;
		z-index:10
	}
	.img-shipin{
		width: 150px;
		height: auto;
	}
	.div-left {
		margin-right: 20px;
	}

	.div-right {
		margin-left: 20px;
	}

	.div-height-change {
		height: 450px;
	}
	/*卡片多样部署*/
	.div-height-change-bs{
		height: 540px;
	}
	/*卡片固定高度-高度较低*/
	.div-height-change-low {
		height: 250px;
	}
	/*卡片固定高度-高度较高*/
	.div-height-change-high{
		height: 350px;
	}
	/*卡片多样部署高度小*/
	.div-height-change-s{
		height: 200px;
	}
	/*卡片多样部署高度中*/
	.div-height-change-m{
		height: 200px;
	}
	/*卡片解决了什么问题*/
	.cad_change{
		height: 450px;
	}
	/*图片 数字*/
	.img_num{
		float: left;
		width: 30px;
	}
	/*内容大图片*/
	.pic_big{
		padding: 0px;
	}
	/*手机下载*/
	.phoneDownload{

	}
	/*电脑下载*/
	.pcDownload{

	}
	/*天天落实APP图标*/
	.img-ttluoshi{
		width: 80px;
		height: 80px;
	}
}
/* 台式电脑或更大 992*/
@media (min-width: 992px) {
	.content-h1{
		font-size: 30px;
		color: #333333;
		font-family: 幼圆;
	}
	.content-h2{
		font-size: 18px;
		color: #999999;
		font-weight: bolder;
	}
	.content-h3{
		font-size: 16px;
	}
	/* 加大突出 */
	.content-h4{
		font-size: 20px;
	}
	/* 图片下面的解释文字*/
	.content-h5{
		font-size: 14px;
	}
	/* 内容段落 */
	.p-content{
		line-height:35px
	}
	.white-div{
		height: 30px;
	}
	.white-div2{
		height: 50px;
	}
	/* 主标题下面的下划线*/
	.line-div{
		width: 50px;
		margin: 0 auto;
		height: 3px;
		background-color: #f05f40;
	}
	.white-divIndex{
		height: 15px;
	}
	.picture1{
		padding-bottom: 75px;
	}
	/*图片亭子结构*/
	.picture_jg{
		padding:0px 50px 0px 50px;
	}
	.content-sp1{
		padding-top:15px
	}
	.row-margin{
		margin: 0px 0px 30px 0px
	}
	.a-shipin{
		position: relative;
		left: 300px;
		bottom: 60px;
		z-index:10
	}
	.img-shipin{

	}

	.div-left {
		margin-right: 50px;
	}

	.div-right {
		margin-left: 50px;
	}

	.div-height-change {
		height: 420px;
	}
	/*卡片多样部署*/
	.div-height-change-bs{
		height: 460px;
	}
	/*卡片固定高度-高度较低*/
	.div-height-change-low {
		height: 330px;
	}
	/*卡片固定高度-高度较高*/
	.div-height-change-high{
		height: 360px;
	}
	/*卡片多样部署高度小*/
	.div-height-change-s{
		height:300px;
	}
	/*卡片多样部署高度中*/
	.div-height-change-m{
		height:300px;
	}
	/*卡片解决了什么问题*/
	.cad_change{
		height: 450px;
		 }
	/*图片 数字*/
	.img_num{
		float: left;
		width: 35px;
	}
	/*内容大图片*/
	.pic_big{
		padding: 20px 50px 20px 50px;
	}
	/*手机下载*/
	.phoneDownload{
		display:none;
	}
	/*电脑下载*/
	.pcDownload{
	}
	/*天天落实APP图标*/
	.img-ttluoshi{
		width: 100px;
		height: 100px;
	}

}


	/* 触发弹窗图片的样式 */
#myImg {
	border-radius: 5px;
	cursor: pointer;
	transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* 弹窗背景 */
.modal {

	margin: 0 auto;
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1; /* Sit on top */
	padding-top: 50px; /* Location of the box */

	top: 20%;
	width: 350px; /* Full width */
	height: 500px; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* 图片 */
.modal-content {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 300px;
}

/* 文本内容 */
#caption {
	margin: auto;
	display: block;
	width: 100%;
	max-width: 500px;
	text-align: center;
	color: #ccc;
	padding: 20px 0;
	height: 150px;
	font-size: 30px;
}

/* 添加动画 */
.modal-content, #caption {
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
	from {-webkit-transform:scale(0)}
	to {-webkit-transform:scale(1)}
}

@keyframes zoom {
	from {transform:scale(0)}
	to {transform:scale(1)}
}

/* 关闭按钮 */
.close {
	position: absolute;
	top: 15px;
	right: 35px;
	color: #f1f1f1;
	font-size: 40px;
	font-weight: bold;
	transition: 0.3s;
}

.close:hover,
.close:focus {
	color: #bbb;
	text-decoration: none;
	cursor: pointer;
}

/* 小屏幕中图片宽度为 100% */
@media only screen and (max-width: 300px){
	.modal-content {
		width: 300px;
	}
}