@charset "utf-8";
/* CSS Document */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, img, dl, dt, dd, ol, ul, li, form, table { margin:0; padding:0; border:0; list-style:none;}
input { margin:0; padding:0; }
h1,h2,h3,h4,h5,h6 { font-weight:normal;}
a { text-decoration:none; color: #000000; display: block; overflow: hidden;}
*{box-sizing: border-box;}
html, body { font-family:"微软雅黑", "宋体";font-size:14px;}
img{ display: block; border:none; }
.bk{width:100%; height:auto; overflow: hidden; }
/***********************************************************************************/


/*music*/
.jjc_music{ position: fixed; z-index: 99; top:2%; right: 3%; width:1rem; height: auto; }
.jjc_music img{width:100%; height: auto; float: right; }
.jjc_audio_pause{display:none;}
.jjc_audio_open{
	-webkit-animation: rotate 3s linear infinite;
	animation: rotate 3s linear infinite;
}

@keyframes rotate{
	0{
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100%{
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@-webkit-keyframes rotate{
	0{
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100%{
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}





/*loding*/
.loding{
	width:100%;
	height: 100vh; 
	position: fixed; 
	left:0;
	top: 0; 
	z-index: 1000; 
	background: #fff;
}
.loding_logo{
	display: block;
	width: 200px; 
	height: auto; 
	margin: 20vh auto 0; 
}
.loading_icon{
	display: block;
	width:95px;
	height: auto;
	margin: 20vh auto 0; 	
}
.pointer{
	display: block;
	width: 170px;
	height:auto;
	margin: 20vh auto 0; 	
}
.mb_black{
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #000;
	opacity: .15;
	z-index: -1;
}



.jjc_zt{
	width:750px; 
	height:auto; 
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;

}


.imgbox{ 
	width: 100%; 
	height: auto;
	overflow: hidden;
}

.img_item{
	position: relative; 
	width: 100%; 
	height:auto; 	
}
.img_item img{
	width: 100%; 
	height: auto;
}
.upimg,.downimg{
	position:absolute;
	top:0;
	left: 0;
}

.downimg{ display: none; }

	
.footer{
	width:100%;
	height:auto;  	 
	text-align: center; 
    background: #f7f7f7;
	padding: 7% 0;
}
.footer p{
	font-size: 16px; 
	line-height: 45px;
}









@media screen and (max-width:768px){
	.jjc_zt{
	    width: 100%;
	}
	
	.jjc_music{
		transform: rotate(90deg);
	}
    
	.loding{
		transform-origin: left top ;
		transform: rotate(90deg) translate(0,-100vmin);
		width: 100vmax;
		height: 100vmin;
	}
	
	.loding_logo{		
		width: 180px; 
		height: auto;
		margin: 15vh auto 0; 
	}
	.loading_icon{
		width: 60px;
		height: auto;
		margin: 3vh auto 0; 	
	}
	.mb_black{
		width: 100vmax;
		height: 100vmin;		
	}
	.pointer{
		display: block;
		width: 100px;
		height:auto;
		margin: 3vh auto 0; 	
	}

	
	.footer{
		transform-origin: left top ;
		transform: rotate(90deg) translate(0,-100vmin); 		
		width: 400px;
		height: 100vmin;
		padding: 12% 0;
	}
	
	.footer p{
		font-size: 0.35rem;
		line-height: 1rem;
	}
	
	.footer p b{
		font-size: 0.45rem;
	}
	

	

}