﻿@charset "utf-8";

html {
-ms-touch-action: none;  /* 阻止windows Phone 的默认触摸事件 */
}
body,div,p {
	margin: 0;
	padding: 0;
}
ul {
	list-style: none;
}
body {
	width: 100%;
	*cursor: default;
	/*overflow: hidden;*/
	font: 16px/1.5 "Microsoft YaHei",Helvetica,STHeiti STXihei,Microsoft JhengHei,Arial;
}
#pageContain {
	overflow: hidden;
    position:fixed; 
    z-index:2;
    width:100%;
    top:0;
    left:0;
}
.page {
	display: none;
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: absolute;
	/*top: 0;
	left: 0;*/
}
.contain {
	width: 100%;
	height: 100%;
	display: none;
	position: relative;
	z-index: 0;
}
.current .contain,.slide .contain {
	display: block;
}
.current {
	display: block;
	z-index: 1;
}
.slide {
	display: block;
	z-index: 2;
}
.swipe {
	display: block;
	z-index: 3;
	transition-duration: 0ms !important;
	-webkit-transition-duration: 0ms !important;
}

/* 页面导航 */
#navBar {
	z-index: 3;
	position: absolute;
	top: 10%;
	right: 3%;
}
#navBar .active {
	background: #ccc;
}
#navBar li {
	cursor: pointer;
	margin-bottom: 10px;
	transition: all .7s ease;
	border-radius: 50%;
	line-height: 0.3rem;
	text-align: center;
	width: 0.3rem;
	height: 0.3rem;
}

/* 箭头 */
.arrow_up {position:fixed; bottom:0.1rem; left:50%; width:0.6rem; height:auto; z-index:9999;
-webkit-transform:translateX(-50%);
-webkit-animation:dong 1s linear 0s infinite alternate;
transform:translateX(-50%);
animation:dong 1s linear 0s infinite alternate;
}
@-webkit-keyframes dong {
from {
	bottom:0.1rem;
}
to {
	bottom:0.25rem;
}
}
@keyframes dong {
from {
	bottom:0.1rem;
}
to {
	bottom:0.25rem;
}
}

/* 页面背景 */
.page1, .page2, .page3, .page4, .page5, .page6, .page7, .page8, .page9, .page10, .page11, .page12, .page13, .page14, .page15, .page16 {
    background: url(../images/01.jpg) no-repeat 50%;
}





.page1, .page2, .page3, .page4, .page5, .page6, .page7, .page8, .page9, .page10, .page11, .page12, .page13, .page14, .page15, .page16 {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/* 页面元素 */
.contain{overflow:hidden;}
.contain ul {position:absolute; width:100%; height:100%; margin:0; padding:0;}
.contain li img{position:absolute; z-index:10;}


/* 自适应框架（设计图宽度） */
body {
	max-width: 6.4rem; 
	margin: 0 auto;
}
body * {
	max-width: 6.4rem;
}
.none{display:none;}


@-webkit-keyframes bounce-down {
    25% {
        -webkit-transform: translateY(-1rem);
        opacity:0.5
    }
    50%, 100% {
        -webkit-transform: translateY(0);
        opacity:1;
    }
    75% {
        -webkit-transform: translateY(0.5rem);
        opacity:0.5
    }
}
 
@keyframes bounce-down {
    25% {
        transform: translateY(-1rem);
        opacity:0.5
    }
    50%, 100% {
        transform: translateY(0);
        opacity:1
    }
    75% {
        transform: translateY(0.5rem);
        opacity:0.5
    }
}

@-webkit-keyframes src {
    0% {
        -webkit-transform: scale(0);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

@keyframes src {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}
@-webkit-keyframes big{
    0% {
        -webkit-transform: scale(0) rotateZ(0deg);
        opacity: 0
    }

    100% {
        -webkit-transform: scale(1) rotateZ(360deg);
        opacity: 1;
    }
}

@keyframes big{
    0% {
        transform: scale(0) rotateZ(0deg);
        opacity: 0
    }

    100% {
        transform: scale(1) rotateZ(360deg);
        opacity: 1;
    }
}
 

@-webkit-keyframes rt{
   to{
        stroke-dashoffset:0;
   } 
}
@keyframes rt{
   to{
        stroke-dashoffset:0;
   } 
}

@-webkit-keyframes op{
   to{
        opacity:1;
   } 
}
@keyframes op{
   to{
        opacity:1;
   } 
}



.tcenter {
    text-align: center
}

.FL {
    float: left;
    display: inline;
}

.FR {
    float: right;
    display: inline;
}

.clear {
    clear: both;
    height: 0px;
    margin: 0;
    padding: 0;
    width: 0;
    border: none;
    overflow: hidden;
}

.fb {
    font-weight: bold;
}

.t1 {
    color: #F6DF9B
}

.t2 {
    color: #F23030
}

.t3 {
    color: #fff
}
.t4 {
    color: #c69d4b
}

.f16 {
    font-size: 0.7em;
}

.f18 {
    font-size: 0.85em;
}

.f20 {
    font-size: 0.9em;
}

.f22 {
    font-size: 0.95em;
}

.f26 {
    font-size: 1.05em;
}
.f30 {
    font-size: 1.15em;
}
.f36 {
    font-size: 1.4em;
}
.f40 {
    font-size: 1.6em;
}

.lh120 {
    line-height: 120%
}

.lh140 {
    line-height: 140%
}

.lh180 {
    line-height: 180%
}

@media screen and (max-width: 640px) {
    .f16 {
        font-size: 0.7em;
    }

    .f18 {
        font-size: 0.85em;
    }

    .f20 {
        font-size: 0.9em;
    }

    .f22 {
        font-size: 0.95em;
    }

    .f26 {
        font-size: 1.05em;
    }
    .f30 {
        font-size: 1.15em;
    }
    .f36 {
        font-size: 1.4em;
    }
    .f40 {
        font-size: 1.6em;
    }
}

@media screen and (max-width: 414px) {
    .f16 {
        font-size: 0.5em;
    }

    .f18 {
        font-size: 0.65em;
    }

    .f20 {
        font-size: 0.7em;
    }

    .f22 {
        font-size: 0.75em;
    }

    .f26 {
        font-size: 0.85em;
    }
    .f30 {
        font-size: 0.95em;
    }
    .f36 {
        font-size: 1.4em;
    }
    .f40 {
        font-size: 1.6em;
    }
}

@media screen and (max-width: 400px) {
    .f16 {
        font-size: 0.5em;
    }

    .f18 {
        font-size: 0.65em;
    }

    .f20 {
        font-size: 0.7em;
    }

    .f22 {
        font-size: 0.75em;
    }

    .f26 {
        font-size: 0.85em;
    }
    .f30 {
        font-size: 0.95em;
    }
    .f36 {
        font-size: 1.4em;
    }
    .f40 {
        font-size: 1.6em;
    }
}

@media screen and (max-width: 392px) {
    .f16 {
        font-size: 0.45em;
    }

    .f18 {
        font-size: 0.6em;
    }

    .f20 {
        font-size: 0.65em;
    }

    .f22 {
        font-size: 0.7em;
    }

    .f26 {
        font-size: 0.8em;
    }
    .f30 {
        font-size: 0.9em;
    }
    .f36 {
        font-size: 1.3em;
    }
    .f40 {
        font-size: 1.5em;
    }
}

@media screen and (max-width: 385px) {
    .f16 {
        font-size: 0.45em;
    }

    .f18 {
        font-size: 0.6em;
    }

    .f20 {
        font-size: 0.65em;
    }

    .f22 {
        font-size: 0.7em;
    }

    .f26 {
        font-size: 0.8em;
    }
    .f30 {
        font-size: 0.9em;
    }
    .f36 {
        font-size: 1.3em;
    }
    .f40 {
        font-size: 1.5em;
    }
}

@media screen and (max-width: 375px) {
    .f16 {
        font-size: 0.45em;
    }

    .f18 {
        font-size: 0.6em;
    }

    .f20 {
        font-size: 0.65em;
    }

    .f22 {
        font-size: 0.7em;
    }

    .f26 {
        font-size: 0.8em;
    }
    .f30 {
        font-size: 0.9em;
    }
    .f36 {
        font-size: 1.3em;
    }
    .f40 {
        font-size: 1.5em;
    }
}

@media screen and (max-width: 359px) {
    .f16 {
        font-size: 0.4em;
    }

    .f18 {
        font-size: 0.5em;
    }

    .f20 {
        font-size: 0.55em;
    }

    .f22 {
        font-size: 0.6em;
    }

    .f26 {
        font-size: 0.7em;
    }
    .f30 {
        font-size: 0.8em;
    }
    .f36 {
        font-size: 1.1em;
    }
    .f40 {
        font-size: 1.3em;
    }
}


.bg_yd {
    -webkit-animation: bg_yds 1s infinite alternate;
    animation: bg_yds 1s infinite alternate;
}

@-webkit-keyframes bg_yds {
    0% {
        -webkit-transform: rotateX(0deg);
        opacity: 1
    }


    100% {
        -webkit-transform: rotateX(-5deg);
        opacity: 0.5
    }
}

@keyframes bg_yds {
    0% {
        transform: rotateX(0deg);
        opacity: 1
    }

    100% {
        transform: rotateX(-5deg);
        opacity: 0.5
    }
}

.textbg {
    background-color: rgba(199,159,79,1);
    width: 88%;
    padding: 0.2rem 6%;
}
.none{display:none}
.tit_bg {
    width: 5.92rem;
    background: url(../images/7_2.png) no-repeat;
    background-size:100% 0.38rem;
    background-position:center bottom;
    padding-bottom:0.1rem;
    margin:0.4rem auto;
}
 