body, h1, h2, h3, h4, h5, h6, p, div, ul, li, dl, dt, dd, h1{margin:0; padding: 0;}
html{font:20px/1.5 'microsoft yahei',Arial;}
input,textarea{font-size:12px;overflow:auto; padding:0; padding-left:3px;resize:none;}
textarea{ padding:3px 0 0 3px;}
li{list-style:none;}
img{border:none; margin:0; padding:0; vertical-align:top;max-width: 100%;}
a{text-decoration:none; color:#000;}
a:hover{text-decoration:none; color:#CC0033}
table{border-collapse:collapse;border-spacing:0}
body{ background-color:#fff; color:#000}
h1,h2,h3,h4,h5,h6{ text-align:left; }
em{ font-style:normal}
/*clearfix*/
.clearfix:after{clear:both; content:" "; display:block; height:0; visibility:hidden}
.clearfix{display:inline-block;zoom:1}
*html .clearfix{height:1%}
.clearfix{display:block}
.home p{ text-indent:0; text-align:left;}

/*圆角*/
.radius3{-moz-border-radius: 3px; -webkit-border-radius:3px ; border-radius:3px;}
.radius5{-moz-border-radius: 5px; -webkit-border-radius:5px ; border-radius:5px;}
.radius8{-moz-border-radius: 8px; -webkit-border-radius:8px ; border-radius:8px;}
.radius10{-moz-border-radius: 10px; -webkit-border-radius:10px ; border-radius:10px;}
/*圆形*/
.circle{ -moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%;}
/*透明背景色*/
.alph3{ background:rgba(255,255,255,0.3);}
/*强制不换行*/
.nowrap{word-break:keep-all;white-space:nowrap;}
/*浮动排列，最后一排margin-bottom IE下无效bug修复
.box2 .list{ width:100%; height:auto;  *padding-bottom:23px;}*/
/*阴影*/
.boxshadow4{box-shadow: 0px 0px 4px 0px #000;}
body,html{ width:100%; height:100%; background:#fff;}

.loading{ margin:0 auto; width:100%; text-align:center; height:60px; top:50%; margin-top:-30px; position:absolute}
.home{ width:100%; background:#fff; height:100%; display:none;width:100%; height:100%; max-width:640px; margin:0 auto; position:relative; overflow:hidden;  }

.pagination {position: absolute;z-index: 10000;left: 0px; bottom:0%; height:12px; width:100%; text-align:center}
.pagination .swiper-pagination-switch {display: inline-block;width: 12px;height: 12px;-moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%;;background:#f1f1f1;;margin: 0 3px;cursor: pointer;}
.pagination .swiper-active-switch{background:#fff600;}


.slidetips{ position:absolute; z-index:100; left:0; bottom:4px; text-align:center; width:100%;  height:22px; }
.slidetips img{ width:auto; height:100%; vertical-align:middle; margin-right:3px;}
.slidetips{
    bottom:7px;
    -webkit-animation:1.8s 0.5s ease infinite both;
    -webkit-animation-name:sldearrow;
    -moz-animation:1.8s 0.5s ease infinite both;
    -moz-animation-name:sldearrow;
    animation:1.8s 0.5s ease infinite both;
    animation-name:sldearrow;
}
@-webkit-keyframes sldearrow{
    0%{bottom:5px;opacity:0;}
    45%,55%{bottom:9px;opacity:1;}
    100%{bottom:12px;opacity:0;}
}
@-moz-keyframes sldearrow{
    0%{bottom:5px;opacity:0;}
    45%,55%{bottom:9px;opacity:1;}
    100%{bottom:12px;opacity:0;}
}
@-o-keyframes sldearrow{
    0%{bottom:5px;opacity:0;}
    45%,55%{bottom:9px;opacity:1;}
    100%{bottom:12px;opacity:0;}
}
@keyframes sldearrow{
    0%{bottom:5px;opacity:0;}
    45%,55%{bottom:9px;opacity:1;}
    100%{bottom:12px;opacity:0;}
}
.beatfox{
    -webkit-transform:translate3d(0%,0,0);
    opacity:1;
    -webkit-animation:0.8s 0s liner 2 alternate;
    -webkit-animation-name:beatfoxframe;
    -moz-animation:0.8s 0s liner 2 alternate;
    -moz-animation-name:beatfoxframe;
    animation:0.8s 0s liner 2 alternate;
    animation-name:beatfoxframe;
}
@-webkit-keyframes beatfoxframe{
    0%{-webkit-transform:translate3d(0%,0,0);opacity:0;}
     25%{-webkit-transform:translate3d(-30%,0,0);opacity:1;}
     75%{-webkit-transform:translate3d(30%,0,0);opacity:1;}
    100%{-webkit-transform:translate3d(0%,0,0); opacity:0;}
}

@keyframes beatfoxframe{
     0%{transform:translate3d(0%,0,0);opacity:0;}
     25%{transform:translate3d(-30%,0,0);opacity:1;}
     75%{transform:translate3d(30%,0,0);opacity:1;}
    100%{transform:translate3d(0%,0,0);opacity:0;}
}

@-webkit-keyframes logofanpai{
   0%{-webkit-transform:perspective(500px) rotateX(180deg) ; opacity:0;}
   100%{-webkit-transform:perspective(500px) rotateX(0deg);;opacity:1;;}
}

@keyframes logofanpai{
    0%{transform:perspective(500px) rotateX(180deg) ; opacity:0;;}
    100%{transform:perspective(500px) rotateX(0deg) ;;opacity:1;;}
}
/*缓冲升上去*/
@-webkit-keyframes bounceInUp {
    0% {opacity:0;-webkit-transform:translateY(200px) scale(0.3,0.3)}
    60% {opacity:1;-webkit-transform:translateY(-30px) scale(1.05,1.05)}
    80% {-webkit-transform:translateY(10px) scale(0.9,0.9)}
    100% {-webkit-transform:translateY(0) scale(1,1)}
}

@keyframes bounceInUp {
    0% {opacity:0;transform:translateY(200px) scale(0.3,0.3)}
    60% {opacity:1;transform:translateY(-30px) scale(1.05,1.05)}
    80% {transform:translateY(10px) scale(0.9,0.9)}
    100% {transform:translateY(0) scale(1,1)}
}
@-webkit-keyframes inUp {
    0% {opacity:0;-webkit-transform:translateY(60px) }
    100% {opacity:1;-webkit-transform:translateY(0) }
}

@keyframes inUp {
    0% {opacity:0;transform:translateY(60px) }
    100% {opacity:1;transform:translateY(0) }
}
/*向右缓动出现*/
@-webkit-keyframes rshow{
    0%{-webkit-transform:translate3d(-50px,0,0) ; opacity:0}
    100%{-webkit-transform:translate3d(0px,0,0); opacity:1}
}
@keyframes rshow{
    0%{transform:translate3d(-50px,0,0) ;opacity:0}
    100%{transform:translate3d(0px,0,0) ;opacity:1}
}
/*向左缓动出现*/
@-webkit-keyframes lshow{
    0%{-webkit-transform:translate3d(50px,0,0) ; opacity:0}
    100%{-webkit-transform:translate3d(0px,0,0); opacity:1}
}
@keyframes lshow{
    0%{transform:translate3d(50px,0,0) ;opacity:0}
    100%{transform:translate3d(0px,0,0) ;opacity:1}
}
@-webkit-keyframes gobig{
    0% {opacity:0;-webkit-transform:scale(.3)}
    100%{opacity:1;-webkit-transform:scale(1)}
}
@keyframes gobig{
    0% {opacity:0;transform:scale(.3)}
    100%{opacity:1;transform:scale(1)}
}
/*.transition{-webkit-transition:all 0.8s linear;-moz-transition:all 0.8s linear;-o-transition:all 0.8s linear;transition:all 0.8s linear;}
.transitionlaz{-webkit-transition:all 0.8s linear;-moz-transition:all 0.8s linear;-o-transition:all 0.8s linear;transition:all 0.8s linear;transition-delay:0.5s;}*/
.transition{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;;-o-transition:all 0.5s ease;;transition:all 0.5s ease;;}
.transitionlaz12{-webkit-transition-delay:1.2s;-moz-transition-delay:1.2s;-o-transition-delay:1.2s;transition-delay:1.2s;}
.transitionlaz10{-webkit-transition-delay:1.0s;-moz-transition-delay:1.0s;-o-transition-delay:1.0s;transition-delay:1.0s;}
.transitionlaz07{-webkit-transition-delay:0.7s;-moz-transition-delay:0.7s;-o-transition-delay:0.7s;transition-delay:0.7s;}
.transitionlaz05{-webkit-transition-delay:0.5s;-moz-transition-delay:0.5s;-o-transition-delay:0.5s;transition-delay:0.5s;}
.transitionlaz03{-webkit-transition-delay:0.3s;-moz-transition-delay:0.3s;-o-transition-delay:0.3s;transition-delay:0.3s;}
.transitionlaz01{-webkit-transition-delay:0.1s;-moz-transition-delay:0.1s;-o-transition-delay:0.1s;transition-delay:0.1s;}

.page{width:100%; height:100%;  position:absolute;  left:0; top:0; display:none}
.background1{ width:100%; height:100%; background:url(../pics/page1.jpg) center center no-repeat; background-size:100% auto; }
.background2{ width:100%; height:100%; background:url(../pics/page2.jpg) center center no-repeat;background-size:100% auto; }
.page1{ z-index:10; display:block}
.page2{ z-index:9; display:block;}
.page2 img{ position:absolute}
.page2 .logo{ left:12%; top:20%;}
.page2 .slg{ left:11.33%; top:33%;}
.page2 .startbtn{ left:41%; top:45%;}
.page2 .author{ position:absolute; font-size:12px; color:#cfa972; width:100%; text-align:center; bottom:30px;}

.swiper-parent .swipertips{ position:absolute; max-width:52px; width:14%; left:43%; z-index:5; top:35%}
.swiper-parent{ position:absolute; z-index:8; left:0; top:0; width:100%; height:100%;}
.swiper-parent .swiper-slide{ position:relative}
.swiper-slide .title{ width:100%; background:url(../pics/titlebg.png) center center no-repeat;  background-size:auto 100% ; height:30px; position:absolute; top:12%; text-align:center; font-size:21px; color:#604b34; line-height:30px;}
.swiper-slide .title2{ background:url(../pics/titlebg2.png) center center no-repeat;  background-size:auto 72% ;}

.spage2{ background:url(../pics/page3.jpg) center center no-repeat; background-size:100% auto;}
.spage2 .imola{ position:absolute; left:18.44%; top:20%;}

.spage11{ background:url(../pics/page5.jpg) center center no-repeat; background-size:100% auto;}
.spage11 .imola{ position:absolute; left:18.44%; top:20%;}

.spage3{ background:url(../pics/page4.jpg) center center no-repeat; background-size:100% auto;}
.spage3 .imola{ position:absolute; left:18.44%; top:20%;}
.spage3 .nestswper1{ width:85%; position:absolute; left:7.5%; top:20%;}
.spage3 .swiper-slide p{ width:95%; border:2px solid #766450; padding:3px; background:#fff; text-align:center; margin:0 auto;}
.spage3 .swiper-slide p img{ width:100%;}
.spage3 .imgtitle { position:absolute; top:57%; width:100%;}
.spage3 .imgtitle li{ display:none; width:85%; margin:0 7.5%;}
.spage3 .imgtitle li span{ display:block; width:100%; text-align:center; background:url(../pics/cicibg.png) center center no-repeat; background-size:auto 100%; height:54px; font-size:14px; color:#50381e; line-height:55px; margin-bottom:5px;}
.spage3 .imgtitle li p{ color:#573a30; font-size:14px; line-height:19px;text-align:justify;}
.spage3 .imgtitle li.cur{ display:block;}

.spage4{ background:url(../pics/page5.jpg) center center no-repeat; background-size:100% auto;}
.spage4 .tabs{ position:absolute; width:100%; height:80%; top:17%;}
.spage4 .tabs .tab{ display:none; text-align:center; width:100%; height:100%;}
.spage4 .tabs .curtab{ display:block;}
.spage4 .imgtitle { position:absolute; top:54%; width:100%;}
.spage4 .imgtitle li{ display:none; width:85%; margin:0 7.5%;}
.spage4 .imgtitle li span{ display:block; width:100%; text-align:center; background:url(../pics/cicibg.png) center center no-repeat; background-size:auto 100%; height:54px; font-size:14px; color:#fcfbf5; line-height:55px; margin-bottom:5px;}
.spage4 .imgtitle li p{ color:#573a30; font-size:11px; line-height:19px; text-align:justify;}
.spage4 .imgtitle li.cur{ display:block;}
.spage4 .nav{ width:100%; height:30px; border:1px solid #604b34; border-left:0 none;border-right:0 none;text-align:center; position:absolute; top:5%;}
.spage4 .nav li{ float:left; width:20%; height:100%; line-height:30px; color:#573a30;  border-left:1px solid #604b34; font-size:13px; cursor:pointer;}
.spage4 .nav li:first-child{ border-left:0px none; margin-left:10%;}
.spage4 .nav li.cur{ background:#604b34; color:#fff}

.spage4 .swiperbg{ width:64%; max-width:410px; left:18%; height:70%; top:0%; max-height:410px; position:absolute ; z-index:1; overflow:hidden;}
.spage4 .swiper-container{ width:91%; max-width:376px; left:0;top:0; right:0; bottom:0; height:91%;  max-height:376px; margin:auto; position:absolute ; z-index:1; overflow:hidden;}
.spage4 .swiper-container .swiper-slide{ width:100%; height:auto; text-align:center}
.spage4 .swiper-container .swiper-slide img{  width:100%; -moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%; vertical-align:middle; }

.spage4 .swiperbg2{ width:64%; max-width:410px; left:18%; height:70%; top:0%; max-height:410px; position:absolute ; z-index:1; overflow:hidden;}
.spage4 .swiperbg2 .swiper-slide{ width:91%; max-width:376px; left:0;top:0; right:0; bottom:0; height:91%;  max-height:376px; margin:auto; position:absolute ; z-index:1; overflow:hidden;}
.spage4 .swiperbg2 .swiper-slide img{  width:100%; -moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%; vertical-align:middle; }

.spage5{ background:url(../pics/page6.jpg) center center no-repeat; background-size:100% auto;}
.spage5 .p65{ position:absolute; left:31%; top:25%;}
.spage5 .p100{ position:absolute; left:0%; top:47%; font-size:13px; color:#604b34; text-align:center; width:100%;}
.spage5 .p1999{ position:absolute; width:84%; left:8%; top:65%; font-size:12px; color:#58412a;text-align:justify;line-height:19px;}

.spage6{ background:url(../pics/page7.jpg) center center no-repeat; background-size:100% auto;}
.spage6 .nestswper4{ width:85%; position:absolute; left:7.5%; top:20%;}
.spage6 .swiper-slide p{ width:95%; border:2px solid #766450; padding:5px; background:#fff; text-align:center; margin:0 auto;}
.spage6 .swiper-slide p img{ width:100%;}
.spage6 .imgtitle { position:absolute; top:57%; width:100%;}
.spage6 .imgtitle li{ display:none; width:85%; margin:0 7.5%;}
.spage6 .imgtitle li span{ display:block; width:100%; text-align:center; background:url(../pics/cicibg.png) center center no-repeat; background-size:auto 100%; height:54px; font-size:13px; color:#fcfbf5; line-height:55px; margin-bottom:5px;}
.spage6 .imgtitle li p{ color:#573a30; font-size:11px; line-height:19px;text-align:justify;}
.spage6 .imgtitle li.cur{ display:block;}


.spage7{ background:url(../pics/page8.jpg) center center no-repeat; background-size:100% auto;}
.spage7 .tabs{ position:absolute; width:100%; height:80%; top:17%;}
.spage7 .tabs .tab{ display:none; text-align:center; width:100%; height:100%;}
.spage7 .tabs .curtab{ display:block;}
.spage7 .imgtitle { position:absolute; top:64%; width:100%;}
.spage7 .imgtitle li{ display:none; width:74%; margin:0 13%;}
.spage7 .imgtitle li span{ display:block; width:100%; text-align:left;  height:24px; font-size:14px; color:#604b34; line-height:24px; margin-bottom:5px;}
.spage7 .imgtitle li p{ color:#58412a; font-size:11px; font-weight:bold; font-size:18px; text-align:justify;}
.spage7 .imgtitle li.cur{ display:block;}
.spage7 .swiperbg{ width:64%; max-width:410px; left:18%; height:70%; top:20%; max-height:410px; position:absolute ; z-index:1; overflow:hidden;}
.spage7 .swiper-container{ width:91%; max-width:376px; left:0;top:0; right:0; bottom:0; height:91%;  max-height:376px; margin:auto; position:absolute ; z-index:1; overflow:hidden;}
.spage7 .swiper-container .swiper-slide{ width:100%; height:auto; text-align:center}
.spage7 .swiper-container .swiper-slide img{  width:100%; -moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%; vertical-align:middle; }

.spage8{ background:url(../pics/page7.jpg) center center no-repeat; background-size:100% auto;}
.spage8 .nestswper6{ width:85%; position:absolute; left:7.5%; top:20%;}
.spage8 .swiper-slide p{ width:95%; border:2px solid #766450; padding:5px; background:#fff; text-align:center; margin:0 auto;}
.spage8 .swiper-slide p img{ width:100%;}
.spage8 .p1{ text-align:justify; font-size:12px; color:#58412a; width:85%; left:7.5%; top:58%; position:absolute; line-height:19px; }

.spage9{ background:url(../pics/page5.jpg) center center no-repeat; background-size:100% auto;}
.spage9 .imgtitle { position:absolute; top:64%; width:100%;}
.spage9 .imgtitle li{ display:none; width:85%; margin:0 7.5%;}
.spage9 .imgtitle li span{ display:block; width:100%; text-align:center; background:url(../pics/cicibg.png) center center no-repeat; background-size:auto 100%; height:54px; font-size:14px; color:#fcfbf5; line-height:55px; margin-bottom:5px;}
.spage9 .imgtitle li p{ color:#573a30; font-size:11px; line-height:19px; text-align:justify;}
.spage9 .imgtitle li.cur{ display:block;}
.spage9 .swiperbg{ width:64%; max-width:410px; left:18%; height:70%; top:20%; max-height:410px; position:absolute ; z-index:1; overflow:hidden;}
.spage9 .swiperbg .swiper-slide{ width:91%; max-width:376px; left:0;top:0; right:0; bottom:0; height:91%;  max-height:376px; margin:auto; position:absolute ; z-index:1; overflow:hidden;}
.spage9 .swiperbg .swiper-slide img{  width:100%; -moz-border-radius: 50%; -webkit-border-radius:50% ; border-radius:50%; vertical-align:middle; }

.spage10{ background:url(../pics/page11.jpg) center center no-repeat; background-size:100% auto;}
.spage10 .aimg{ position:absolute;}
.spage10 .logo{ top:15%; left:12%;}
.spage10 .dlsh{ top:27%; left:23%;}
.spage10 .ewm{ top:40%; left:25%; width:50%; text-align:center; font-size:12px; color:#58412a; position:absolute; display:block;}
.spage10 .ewm img{ width:94%; margin-bottom:3px;}
.spage10 .site{ top:80%; left:15%;}
.spage10 .logo2{ bottom:10%; left:0%;}

.initfirst .logo{
    -webkit-animation:lshow 1.0s 0.1s ease-out both;
    animation:lshow 1.0s 0.1s ease-out both;
}
.initfirst .slg{
    -webkit-animation:logofanpai 1.6s 1s ease both;
    animation:logofanpai 1.6s 1s ease both;
}
.initfirst .startbtn{
    -webkit-animation:inUp 1.0s 2s ease-out both;
    animation:inUp 1.0s 2s ease-out both;
}
.swiper-slide-active .title,.swiper-slide-active .nav,.swiper-slide-active .dlsh{
    -webkit-animation:logofanpai 1.2s 0s ease both;
    animation:logofanpai 1.2s 0s ease both;
}
.swiper-slide-active .imola{
    -webkit-animation:inUp 1.0s 0.8s ease-out both;
    -moz-animation:inUp 1.0s 0.8s ease-out both;
    animation:inUp 1.0s 0.8s ease-out both;
}
.swiper-slide-active .nestswper1{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .nestswper1 .swipertips,.swiper-slide-active .nestswper2 .swipertips,.swiper-slide-active .nestswper4 .swipertips,.swiper-slide-active .nestswper5 .swipertips,.swiper-slide-active .nestswper6 .swipertips{
    -webkit-animation:beatfoxframe 1.0s 1.6s ease both;
    animation:beatfoxframe 1.0s 1.6s ease both;
}
.swiper-slide-active .imgtitle1{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .curtab{
    -webkit-animation:inUp 1.0s 0.8s ease-out both;
    animation:inUp 1.0s 0.8s ease-out both;
}
.swiper-slide-active .p65{
    -webkit-animation:gobig 1.0s 0.8s ease-out both;
    animation:gobig 1.0s 0.8s ease-out both;
}
.swiper-slide-active .p100{
    -webkit-animation:lshow 1.0s 1.4s ease-out both;
    animation:lshow 1.0s 1.4s ease-out both;
}
.swiper-slide-active .p1999{
    -webkit-animation:rshow 1.0s 1.8s ease-out both;
    animation:rshow 1.0s 1.8s ease-out both;
}
.swiper-slide-active .nestswper4{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .imgtitle4{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .swiperbg5{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .imgtitle5{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .nestswper6{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .pend{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .ewm{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .site{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .logo2{
    -webkit-animation:inUp 1.0s 1.4s ease-out both;
    animation:inUp 1.0s 1.4s ease-out both;
}
.swiper-slide-active .swiperbg9{
    -webkit-animation:lshow 1.0s 0.8s ease-out both;
    animation:lshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .imgtitle9{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
.swiper-slide-active .imgtitle2{
    -webkit-animation:rshow 1.0s 0.8s ease-out both;
    animation:rshow 1.0s 0.8s ease-out both;
}
@media  screen and (min-width:640px){

}
@media  screen and (max-height:420px){


}
@media  screen and (min-width:420px){
    .spage7 .imgtitle{ top:72%;}
    .spage4 .imgtitle{ top:60%;}
}