/*通用*/
* { margin: 0 auto; padding: 0; }
article,aside,dialog,footer,header,section,footer,nav,figure,menu {display: block}
body { font-family: 微软雅黑, "Arial Narrow", HELVETICA,Arial, sans-serif;font-size: 14px; color: #393939;line-height:28px!important;background-color: #000f5c; background: url(../images/bg.jpg) top center repeat-y;}
ul, ol, li { list-style: none; }
img { border: 0; display: block; }
em { font-style: normal; }
a { text-decoration: none; outline: none; color: #393939; width: 100%}
p {font-size: 14px; font-size: 1rem; color: #787878; padding: 20px 0}
hr{ border: 1px solid #e1e1e1; height: 1px }
/*通用*/
.fl { float: left; }
.fr { float: right; }
.cb { clear: both; }
.oh { overflow: hidden; }
.w400 { width: 400px; }
.w1200 { width: 1200px; }
.mt6 { margin-top: 6px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; } 
.mr10 { margin-right: 10px; }
.mr30 { margin-right: 30px; }
.pr {position: relative}
.abs-left {position: absolute; left: 0}
.abs-right {position: absolute; right: 0}
.w490 { width: 490px; }
.h40 { height: 40px; }
.tc{text-align: center;}
.br1{border-right: 1px solid #e1e1e1}
.pl20{padding-left:20px}
.pr20{padding-right: 20px}
.pt20{padding-top: 20px;}
.pb20{padding-bottom: 20px;}
.f12{font-size:12px;}
.f14{font-size:14px;}
.f20{font-size:20px;}
.f34{font-size: 34px;}
.fwb{font-weight: bold }
/**/

html,body {
}
.p1_1,.p2_1,.p3_1,.p4_1,.p5_1,.p6_1{ display: none }
.demo {

	text-align: center;
	line-height: 100px;
	display: table-cell;
}
.demo-1 {
	position: absolute;
	margin: 0 auto;
	top:360px;
	left:50%;
	-webkit-transform:translateX(-50%);

}
.demo-2 {
	position: absolute;
	top:387px;
	left:25%;
	display: block;
}
.demo-3 {
	position: absolute;
	top:330px;
	left:50%;
	width:50%;
}

.demo-6 {
	position: absolute;
	top:141px;
	left:30%;
	-webkit-transform:translateX(-50%);
}
.demo-7 {
	position: absolute;
	top:45px;
	left:20%;
	-webkit-transform:translateX(-50%);
}
.demo-8 {
	position: absolute;
	top:155px;
	left:70%;
	-webkit-transform:translateX(-50%);
}
.demo-9 {
	position: absolute;
	margin: 0 auto;
	top:690px;
	left:50%;
	-webkit-transform:translateX(-50%);
}
.demo-10 {
	position: absolute;
	margin: 0 auto;
	top:540px;
	left:50%;
	-webkit-transform:translateX(-50%);
}
/*第二页动画导语*/
.demo-4 {
	position: absolute;
	margin: 0 auto;
	top:880px;
	left:50%;
	-webkit-transform:translateX(-50%);
}
.demo-5 {
	position: absolute;
	margin: 0 auto;
	top:725px;
	left:50%;
	-webkit-transform:translateX(-50%);
	display: block;
}

/*第三页动画 古镇*/
.demo-11 {
	position: absolute;
	top:1399px;
	left:23%;
	display: block;
}
.demo-12 {
	position: absolute;
	top:1363px;
	left:60%;
	display: block;
}


.new_list{ width: 1020px;position: absolute;margin: 0 auto;top:1667px;left:50%;-webkit-transform:translateX(-50%);display: block;  }
.new_list ul li{ float: left;width: 468px; margin: 5px 20px }
.new_list ul li p{ padding: 30px; background: #fff; }
.title{ font-size: 24px; font-family: 微软雅黑; background: #e89d62; color: #fff; padding:22px 26px; text-align: center; width: 205px; position:relative;top: 50px; left: -20%}

/*第四页人少景美好地方动画*/
.demo-14 {
	position: absolute;
	top:2920px;
	left:52%;
	display: block;
}
.demo-15 {
	position: absolute;
	top:2896px;
	left:23%;
	display: block;
}

/*美食*/
.demo-16 {
	position: absolute;
	top:4875px;
	left:60%;
	display: block;
}
.demo-17 {
	position: absolute;
	top:4850px;
	left:23%;
	display: block;
}

.demo-18 {
	position: absolute;
	margin: 0 auto;
	top:5900px;
	left:50%;
	-webkit-transform:translateX(-50%);
	display: block;
	padding: 40px 0;
}



.nav{ text-align: center; font-weight: 400; position: fixed; right: 0; top: 40%; background:url(../images/navbg.png); width: 165px;height: 356px;z-index: 9999;font-size:20px;}
.nav ul{margin-top:115px; }
.nav ul li{ height: 64px; padding: 0 20px;color: #c13117; }
.new_list2{ width: 1020px;height: 300px;	position: absolute;margin: 0 auto;top:3200px;left:50%;-webkit-transform:translateX(-50%);display: block; }
.new_list2 ul li{ float: left;width: 100%; margin:0px 0; }
.l_img{ float: left; width: 650px }
.r_text{float: left;
width: 300px;
height: 180px;
padding: 60px 30px;
background: #fff;
font-size: 16px;
vertical-align: middle;
line-height: 34px;}

.new_list3{ width: 1020px;height: 300px;	position: absolute;margin: 0 auto;top:5160px;left:50%;-webkit-transform:translateX(-50%);display: block; }
.new_list3 ul li{ float: left;width: 320px; margin: 10px; }
.l_img2{ float: left; width: 320px }
.title2{font-size: 24px; font-family: 微软雅黑; background: #fff; color: #444;line-height: 60px; padding:0 0; text-align: center; width:320px; }



.more1{ width: 400px; font-family: 微软雅黑; height:60px; background: #3165b8; color: #acd5ff; text-align: center; line-height: 60px; font-size: 32px;	position: absolute;margin: 0 auto; opacity: .5; border-radius: 15px; top:1090px;left:50%;-webkit-transform:translateX(-50%);}
.more2{ width: 400px; font-family: 微软雅黑; height:60px; background: #3165b8; color: #acd5ff; text-align: center; line-height: 60px; font-size: 32px;	position: absolute;margin: 0 auto; opacity: .5; border-radius: 15px; top:1520px;left:50%;-webkit-transform:translateX(-50%);}
.more3{ width: 400px; font-family: 微软雅黑; height:60px; background: #3165b8; color: #acd5ff; text-align: center; line-height: 60px; font-size: 32px;	position: absolute;margin: 0 auto; opacity: .5; border-radius: 15px; top:600px;left:50%;-webkit-transform:translateX(-50%);}
@-webkit-keyframes translate_kf {
	0% {
		-webkit-transform:translateX(100%);
	}
	100% {
		-webkit-transform:translateX(0);
	}
}

/*灯笼固定*/

.demo-99 {
	position: absolute;
	top:2001px;
	left:80%;
	display: block;
}
.demo-999 {
	position: absolute;
	top:1645px;
	left:20%;
	display: block;
}

.demo-9999 {
	position: absolute;
	top:5645px;
	left:20%;
	display: block;
}

.demo-99999 {
	position: absolute;
	top:4045px;
	left:82%;
	display: block;
}
/*--------------------向左滚动出现----------------------------*/
@keyframes mymove
{
	0%   {-webkit-transform:translateY(300px);}
	100% {-webkit-transform:translateY(0);}
}
/* Firefox */
@-moz-keyframes mymove 
{
	0%   {-webkit-transform:translateY(300px);}
	100% {-webkit-transform:translateY(0);}
}
/* Safari 和 Chrome */
@-webkit-keyframes mymove 
{
	0%   {-webkit-transform:translateY(300px);}
	100% {-webkit-transform:translateY(0);}
}
/* Opera */
@-o-keyframes mymove 
{
	0%   {-webkit-transform:translateY(300px);}
	100% {-webkit-transform:translateY(0);}
}
/*--------------------上下循环浮动----------------------------*/
@keyframes updown
{
	0%   {-webkit-transform:translateY(0);}
	50% {-webkit-transform:translateY(30px);}
	100% {-webkit-transform:translateY(0);}
}
/* Firefox */
@-moz-keyframes updown
{
	0%   {-webkit-transform:translateY(0);}
	50% {-webkit-transform:translateY(30px);}
	100% {-webkit-transform:translateY(0);}

}
/* Safari 和 Chrome */
@-webkit-keyframes updown
{
	0%   {-webkit-transform:translateY(0);}
	50% {-webkit-transform:translateY(30px);}
	100% {-webkit-transform:translateY(0);}

}
/* Opera */
@-o-keyframes updown
{
	0%   {-webkit-transform:translateY(0);}
	50% {-webkit-transform:translateY(30px);}
	100% {-webkit-transform:translateY(0);}

}



.demo-1-ani {
	animation:.8s ease translate_kf 0s forwards;
	/* Firefox: */
	-moz-animation:.8s ease translate_kf 0s forwards;
	/* Safari and Chrome: */
	-webkit-animation:.8s ease translate_kf 0s forwards;
	/* Opera: */
	-o-animation:.8s ease translate_kf 0s forwards;
}
/*--------------------向左滚动出现----------------------------*/
.demo-2-ani {
	animation:.8s ease mymove 0s forwards;
	/* Firefox: */
	-moz-animation:.8s ease mymove 0s forwards;
	/* Safari and Chrome: */
	-webkit-animation:.8s ease mymove 0s forwards;
	/* Opera: */
	-o-animation:.8s ease mymove 0s forwards;
}
.demo-3-ani {
	animation:.8s ease translate_kf 1.6s forwards;
	/* Firefox: */
	-moz-animation:.8s ease translate_kf 1.6s forwards;
	/* Safari and Chrome: */
	-webkit-animation:.8s ease translate_kf 1.6s forwards;
	/* Opera: */
	-o-animation:.8s ease translate_kf 1.6s forwards;
}
/*--------------------上下循环浮动----------------------------*/
.demo-4-ani {
	animation:3s ease updown .6s infinite alternate forwards;
	/* Firefox: */
	-moz-animation:3s ease updown .6s  infinite alternate forwards;
	/* Safari and Chrome: */
	-webkit-animation:3s ease updown .6s  infinite alternate forwards;
	/* Opera: */
	-o-animation:3s ease updown .6s  infinite alternate forwards;
}
.demo-5-ani {
	animation:3s ease updown 0s infinite alternate forwards;
	/* Firefox: */
	-moz-animation:3s ease updown 0s  infinite alternate forwards;
	/* Safari and Chrome: */
	-webkit-animation:3s ease updown 0s  infinite alternate forwards;
	/* Opera: */
	-o-animation:3s ease updown 0s  infinite alternate forwards;
}
.translate-wrap {
	width:100%;
	-webkit-transform:translateX(100%);
	position:absolute;
}

@media (max-width: 1660px) {.demo-12,.demo-14,.demo-16{width:200px;left:60%;} .demo-2{ left:15%}
 }
@media (max-width: 1140px) {.demo-2,.demo-12,.demo-14,.demo-16,.demo-10,.demo-3,.nav,.foot_pc{ display: none}
.shouji{left:53%;margin-left:53%;-webkit-transform:translateX(-53%);}
.demo-11,.demo-15,.demo-17{
	margin: 0 auto;
	left:50%;
	-webkit-transform:translateX(-50%);}
.demo-6{left:-8%}.demo-7{left:-2%}
 }















