@charset "utf-8";
/*初始化  reset*/
body,button,dd,dl,dt,form,h1,h2,h3,h4,h5,h6,hr,input,li,ol,p,td,textarea,th,ul{margin:0;padding:0}
body,button,input,select,textarea{font:16px/1.5 "微软雅黑",sans-serif; color:#333;}
h1,h2,h3,h4,h5,h6{font-size:100%}
em,i{font-style:normal}
ol,ul{list-style:none}
a{text-decoration:none;color:#333;}
img{border:0; display:block;}
textarea{resize:none;}
a,input,button,select,textarea{outline:none;}
a,button{cursor:pointer;}
/*清除浮动*/
.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}
.clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-table; }
*html .clearfix { height: 1%; }
.clearfix { display: block; }
*+html .clearfix { min-height: 1%; }
/*-------------------------------banner----------------------------------------------------*/
.banner{ width:100%; }
.banner img{ width:100%;}
.two{ margin:auto; width:1200px; overflow:hidden;}
.bt{ text-align:center; margin:15px;font-size:30px; text-align:center;}
.bt strong{ display:inline-block; border-bottom:4px solid #b10b11; padding:10px;}
.two dl{ overflow:hidden; width:1200px; margin:auto;}
.two dl dt{ float:left; width:530px; margin-top:24px; padding:30px; }
.two dl dt p{ line-height:30px; text-indent:2em;}
.two dl dt strong{ text-align:center; font-size:20px; display:block; margin-bottom:15px;}
.two dl dd{ float:right; width:610px;}
.two dl dd img{ width:100%;}
.three{ width:100%; background:url(../images/bj.gif) no-repeat; background-size:100% 100%; margin:auto; margin-top:50px; overflow:hidden;}
.three_con{ width:1200px;  overflow:hidden; margin:auto;}
.three_con p{ line-height:30px; text-indent:2em;}

.wrapper {
	width:100%; overflow:hidden; padding:30px 0;
}

.stage {
	list-style: none;
	padding: 0;
}

/*************************************
Build the scene and rotate on hover
**************************************/

.scene {
	width: 260px;
	margin: 20px;
	float: left;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;

}

.movie {
	width: 260px;
	height: 260px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-130px);
	-moz-transform: translateZ(-130px);
	transform: translateZ(-130px);
	-webkit-transition: -webkit-transform 350ms;
	-moz-transition: -moz-transform 350ms;
	transition: transform 350ms;
}

.movie:hover {
	-webkit-transform: rotateY(-78deg) translateZ(20px);
	-moz-transform: rotateY(-78deg) translateZ(20px);
	transform: rotateY(-78deg) translateZ(20px);
}

/*************************************
Transform and style the two planes
**************************************/

.movie .poster, 
.info {
	position: absolute;
	width: 240px;
	height: 240px;
	background-color: #fff;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
}

.movie .poster  {
	-webkit-transform: translateZ(130px);
	-moz-transform: translateZ(130px);
	transform: translateZ(130px);
	background-size: cover;
	background-repeat: no-repeat;
}

.movie .info { background:#B10B11; color:#fff;
	-webkit-transform: rotateY(90deg) translateZ(130px);
	-moz-transform: rotateY(90deg) translateZ(130px);
	transform: rotateY(90deg) translateZ(130px);
	border: 1px solid #B8B5B5;
	font-size: 14px;
}

/*************************************
Shadow beneath the 3D object
**************************************/

.csstransforms3d .movie::after {
	content: '';
	width: 260px;
	height: 260px;
	position: absolute;
	bottom: 0;
	box-shadow: 0 30px 50px rgba(0,0,0,0.3);
	-webkit-transform-origin: 100% 100%;
	-moz-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	-webkit-transform: rotateX(90deg) translateY(130px);
	-moz-transform: rotateX(90deg) translateY(130px);
	transform: rotateX(90deg) translateY(130px);
	-webkit-transition: box-shadow 350ms;
	-moz-transition: box-shadow 350ms;
	transition: box-shadow 350ms;
}

.csstransforms3d .movie:hover::after {
	box-shadow: 20px -5px 50px rgba(0,0,0,0.3);
}

/*************************************
Movie information
**************************************/

.info header {
	color: #FFF;
	padding: 7px 10px;
	font-weight: bold;
	height:145px;
	background-size: contain;
	background-repeat: no-repeat;
	text-shadow: 0px 1px 1px rgba(0,0,0,1);
}

.info header h1 {
	margin: 0 0 2px;
	font-size: 1.4em;
}

.info header .rating {
	border: 1px solid #FFF;
	padding: 0px 3px;
}

.info {
	padding:10px;
	border-top: 5px solid #999;
	height:220px !important;

}
.info p{font-size:12px !important;	line-height:22px !important;}
.info p a{ display:block; color:#FFF; height:31px;}
.info p a:hover{ text-decoration:underline;}
/*************************************
Generate "lighting" using box shadows
**************************************/

.movie .poster,
.movie .info,
.movie .info header {
	-webkit-transition: box-shadow 350ms;
	-moz-transition: box-shadow 350ms;
	transition: box-shadow 350ms;
}

.csstransforms3d .movie .poster {
	box-shadow: inset 0px 0px 40px rgba(255,255,255,0);
}

.csstransforms3d .movie:hover .poster {
	box-shadow: inset 300px 0px 40px rgba(255,255,255,0.8);
}

.csstransforms3d .movie .info, 
.csstransforms3d .movie .info header {
	box-shadow: inset -300px 0px 40px rgba(0,0,0,0.5);
}

.csstransforms3d .movie:hover .info, 
.csstransforms3d .movie:hover .info header {
	box-shadow: inset 0px 0px 40px rgba(0,0,0,0);
}

/*************************************
Posters and still images
**************************************/

.scene:nth-child(1) .movie .poster {
  background-image:url(../images/tu01.jpg);
}

.scene:nth-child(2) .poster {
  background-image: url(../images/tu02.jpg);
}

.scene:nth-child(3) .poster {
  background-image: url(../images/tu03.jpg);
}
.scene:nth-child(4) .poster {
  background-image: url(../images/tu04.jpg);
}

.scene:nth-child(1) .info header {
  background-image: url(../images/tu05.jpg);
}

.scene:nth-child(2) .info header {
	background-image: url(../img/still02.jpg);
}

.scene:nth-child(3) .info header {
	background-image: url(../img/still03.jpg);
}
.scene:nth-child(4) .info header {
	background-image: url(../img/still03.jpg);
}

/*************************************
Fallback
**************************************/
.no-csstransforms3d .movie .poster, 
.no-csstransforms3d .movie .info {
	position: relative;
}

/*************************************
Media Queries
**************************************/
@media screen and (max-width: 60.75em){
	.scene {
		float: none;
		margin: 30px auto 60px;
	}
}


/*.three_con ul{ width:1200px; overflow:hidden; padding-top:30px; margin-top:10px;}
.three_con ul li{ width:18%; border:1px solid #B10B11; padding:0 20px;float:left; margin:0 1.5%;border-radius:5px;}
.three_con ul li:hover{ cursor:pointer; box-shadow:0 0 10px #B10B11;-webkit-transform:translateY(-20px);transition:all 0.6s;}
.three_con ul li span{ display:block; width:100px; height:100px; background:#B10B11; color:#FFF; text-align:center; line-height:100px; border-radius:50%; margin:20px auto; font-size:24px; }
.three_con ul li strong{ font-size:20px; text-align:center; color:#B10B11; font-weight:normal; display:block; margin-bottom:10px; }
.three_con ul li p{ font-size:14px; color:#666;}
*/
.four{ width:100%;margin:auto; overflow:hidden;}
.four_con{ width:1200px; margin:auto;}
.four_con p{ line-height:30px; text-indent:2em;}
.four_con dl{ overflow:hidden; width:1200px; margin-top:15px;}
.four_con dl dt{ width:690px;  float:right; overflow:hidden;}
.four_con dl dd{ float:left; width:450px; overflow:hidden; padding-left:50px;}
.four_con dl dd ul{ overflow:hidden;}
.four_con dl dd ul li{ overflow:hidden}
.four_con dl dd ul li input{ width:350px; height:30px; border-radius:5px; border:1px solid #CCC; padding:5px; margin:10px 0;}
#ctl00_cpMainWrapper_btnOk{width:360px; border:none; height:40px; line-height:20px; color:#FFF; font-size:16px; display:block; margin-top:15px;}
#ctl00_cpMainWrapper_btnOk:hover{ background:#02b9fd; cursor:pointer;}
.four_con dl dd ul li span{ font-size:14px;}






.five{ width:1200px; overflow:hidden; margin:auto;}
.up{ overflow:hidden; margin-bottom:20px;}
.up dt{ float:left; width:530px; text-align:center; padding-top:20px; overflow:hidden; padding:40px 20px;}
.up dt h1{ font-size:26px; color:#B10B11; display:block; margin:10px;}
.up dt h2{ font-size:18px; display:block; margin:10px;}
.up dt strong{ font-size:18px; display:block; margin:10px;}
.up dt p{ margin:10px 0; line-height:26px;color:#B10B11;}
.up dd{ float:left; width:400px; margin-left:140px;}
.up dd img{ width:100%;}


.six{ width:100%; padding:10px 0;background:#f7f7f7; }
.six_con{ width:1200px; margin:auto; background:#B10B11; margin-bottom:20px;}
.six_con{ overflow:hidden;}
.six_con dt{ float:left; width:740px; padding:30px; color:#FFF; font-size:16px;}
.six_con dt p{ text-indent:2em; color:#FFF; line-height:30px;}
.six_con dd{ width:240px; height:46px; display:block; background:#0394d7; color:#FFF; line-height:46px; font-size:16px; float:right; text-align:center;margin:80px; }
.six_con dd:hover{ background:#02b9fd;transition:all 0.6s}

.seven{ width:900px; margin:auto; overflow:hidden; margin-bottom:40px;}
.seven dl dt{ width:180px; text-align:center; float:left; margin-left:200px;}
.seven dl dt img{ width:100%;}
.seven dl dd{ width:450px; float:right;}
.seven dl dd ul li{ line-height:50px; font-size:14px; width:350px; overflow:hidden;}
.seven dl dd ul li span{ display:inline-block; width:50px; margin-top:10px; float:left;}
.seven dl dd ul li strong{ margin-left:15px; display:inline-block; margin-top:10px; font-weight:normal;}
.seven dl dd ul li span img{ width:100%;}


.foot{ width:100%; padding:10px 0; color:#FFF; text-align:center; background:#4A4A4A;}
.fuchuang{ overflow:hidden; position:fixed; bottom:5%; right:0;}
.fuchuang ul{ overflow:hidden; padding:5px; }
.fuchuang ul li{ overflow:hidden;margin:10px; background:#e88702; display:block;width:120px; line-height:26px; text-align:center; color:#FFF; padding:10px 0;}
.fuchuang ul li strong{ display:block; font-size:18px;}
.fuchuang ul li:hover{ background:#3db7e4;transition:all 0.6s}
.fuchuang ul li img{ margin:auto; margin-top:10px; width:40%;}
.fuchuang ul li a{ color:#fff;  }
/*------------------------------banner----------------------------------------------------*/
.banner0{ display:none;}

/*------------------------------下载页样式----------------------------------------------------*/
.box { width: 1040px; margin: 30px auto; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.25); }
.banner{ width:100%;}
.banner p{ width:100%; margin:auto;}
.banner p img{ width:100%; margin:auto;}
.main { width: 990px; border-top: 36px solid #ce3133; margin: 20px auto; padding: 20px 25px; background: #fff; }
.main h3 { font-size: 24px; color:#ce3133; text-align: center; line-height: 50px; border-bottom: 1px solid #ce3133; font-weight:bold; }
.main .outer { padding: 10px 0; border-bottom: 1px dashed #999; overflow: hidden; }
.main .outer dt { margin: 5px 0; color: #111; font-weight:bold; font-size:20px;}
.main .outer dd { margin: 0 30px; font-size: 15px; }
.main .outer dd .inner { float: left; width: 100%; margin: 5px 0; }
.main .outer dd .inner6 { margin: 5px 0; }
.main .outer dd .left { float: left; width: 50%; }
.main .outer dd .right { float: left; width: 50%; }
.main .outer dd .inner6 p { font-weight: bold; }
.main .outer dd .inner6 ol { margin-left: 25px; }
.main .outer dd .innertop { width: 100%; font-weight: bold; }
.main .outer dd .inner .line input { width: 100px; border: 0; border-bottom: 1px solid #ccc; outline: none; }
.biao{ color:#F00}
.information .left { margin-top:30px; overflow:hidden; }
.information .left h5 { font-size: 20px; margin-bottom: 10px; font-weight:bold;}
.information .left h5 span { font-size: 14px; color: red; }
.information .left ul{ width:60%; overflow:hidden; }
.information .left li { float:left; margin-top: 15px; overflow: hidden; width:100%;}
.information .left li input{ width:350px; height:30px; border-radius:5px; border:1px solid #CCC; padding:5px; }
.information .left dl{ width:100%; overflow:hidden;}
.information .left dt { width:24%; margin-right:10px; float:left; margin-right:20px; text-align:right;}
.information .left dd { float: left; }
.information .left dt span { color: red; }
.information .left input, .information .left select { width:400px; height: 32px; border: 1px solid #ccc; } 
.information .left .botton { width: 270px; height: 32px; background: #009c9a; color: #fff; font-family: "Microsoft YaHei","微软雅黑","Arial Narrow"; font-size: 16px; }
.information .right { float: left; width: 290px; }
.information .right dl { margin-top: 80px; }
.information .right dt img { display: block; margin: 0 auto; }
.information .right dd { line-height: 50px; text-align: center; }
.footer { background:#666; color:#FFF; text-align: center; font-size: 14px; padding: 20px 0; }
.btn{ width:350px; background:#ce3133; border:none; height:50px; line-height:50px; color:#FFF; font-size:16px; display:block;}
.btn:hover{ background:#F00; cursor:pointer; color:#FFF;}

































