﻿@charset "utf-8";
/* CSS Document */
* { margin: 0; padding: 0; }
html, body { height: 100%; }
li { list-style: none; }
body { font-family: "microsoft yahei"; background: #fff; }
#swiper-container-v { width: 100%; max-width: 640px; height: 100%; }
.swiper-slide-v { width: 100%; height: 100%; background: -webkit-linear-gradient(top,#c1071c 0,#c1071c 30%,#c1071c 53%,#de0c25 70%,#de0c25 100%); overflow: hidden; }
.swiper-slide-v2 { width: 100%; height: 100%; background: -webkit-linear-gradient(top,#c1071c 0,#c1071c 30%,#c1071c 53%,#c1071c 70%,#c1071c 100%); overflow: hidden; }
.logo { width: 80px; height: 80px; margin:50px auto 0; position: relative; }
.logo img { width:80px;display:block;}
.index-top img { width:100%;height:100%;margin:0 auto;display:block;}

@media(max-width:480px)
{
    .index-top img { width:85%;height:100%;margin:0 auto;display:block;}
}

@-webkit-keyframes start {
    0%,30% { opacity: 0; -webkit-transform: translate(0,10px); }
    60% { opacity: 1; -webkit-transform: translate(0,0); }
    100% { opacity: 0; -webkit-transform: translate(0,-8px); }
}

@-moz-keyframes start {
    0%,30% { opacity: 0; -moz-transform: translate(0,10px); }
    60% { opacity: 1; -moz-transform: translate(0,0); }
    100% { opacity: 0; -moz-transform: translate(0,-8px); }
}

@keyframes start {
    0%,30% { opacity: 0; transform: translate(0,10px); }
    60% { opacity: 1; transform: translate(0,0); }
    100% { opacity: 0; transform: translate(0,-8px); }
}

@-webkit-keyframes myZoomIn1 {
    0% { opacity: 0.4; -webkit-transform: scale3d(.4, .4, .4) translate3d(0, 30%, 0); transform: scale3d(.4, .4, .4) translate3d(0, 30%, 0); }

    100% { opacity: 1; }
}

@keyframes myZoomIn1 {
    0% { opacity: 0.4; -webkit-transform: scale3d(.4, .4, .4) translate3d(0, 30%, 0); transform: scale3d(.4, .4, .4) translate3d(0, 30%, 0); }

    100% { opacity: 1; }
}

.myZoomIn1 { -webkit-animation-name: myZoomIn1; animation-name: myZoomIn1; }

@-webkit-keyframes myZoomIn2 {
    0% { opacity: 0.4; }

    100% { opacity: 1; transform: scale3d(1.06, 1.06, 1.06); }
}

@keyframes myZoomIn2 {
    0% { opacity: 0.4; }

    100% { opacity: 1; transform: scale3d(1.06, 1.06, 1.06); }
}

.myZoomIn2 { -webkit-animation-name: myZoomIn2; animation-name: myZoomIn2; }

@-webkit-keyframes myFlip {
    0% { opacity: 0.4; -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg); transform: perspective(400px) rotate3d(0,1,0,90deg); }

    100% { opacity: 1; }
}

@keyframes myFlip {
    0% { opacity: 0.4; transform: rotateY(360deg); }
    100% { opacity: 1; }
}

.myFlip { -webkit-animation-name: myFlip; animation-name: myFlip; }

@-webkit-keyframes myrotateIn {
    0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0,0,1,-250deg) scale3d(.3,.3,.3); transform: rotate3d(0,0,1,-250deg) scale3d(.3,.3,.3); opacity: 0; }
    100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; }
}

@keyframes myrotateIn {
    0% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0,0,1,-250deg) scale3d(.3,.3,.3); -ms-transform: rotate3d(0,0,1,-250deg) scale3d(.3,.3,.3); transform: rotate3d(0,0,1,-250deg) scale3d(.3,.3,.3); opacity: 0; }
    100% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; }
}

.myrotateIn { -webkit-animation-name: myrotateIn; animation-name: myrotateIn; }


@-webkit-keyframes loading {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes loading {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
/**/
.arrow-box { position: absolute; bottom: -55px; left: 0; right: 0; margin: 0 auto; width: 50%; height: 90px; border-radius: 100%; background: rgba(255,255,255,.18); z-index: 900; }
#array { z-index: 999; -webkit-animation: start 1.5s infinite ease-in-out; display: block; margin: 15px auto 0 auto; width: 20px; height: 15px; z-index: 999; }
