

@-webkit-keyframes fadeInDown {

            0% {

                opacity: 0;

                -webkit-transform: translate3d(0,-100%,0);

                transform: translate3d(0,-100%,0)

            }



            100% {

                opacity: 1;

                -webkit-transform: none;

                transform: none

            }

        }



@keyframes fadeInDown {

            0% {

                opacity: 0;

                -webkit-transform: translate3d(0,-100%,0);

                -ms-transform: translate3d(0,-100%,0);

                transform: translate3d(0,-100%,0)

            }



            100% {

                opacity: 1;

                -webkit-transform: none;

                -ms-transform: none;

                transform: none

            }

        }

@-webkit-keyframes fadeInUp {

            0% {

                opacity: 0;

                -webkit-transform: translate3d(0, 100%, 0);

                transform: translate3d(0, 100%, 0)

            }

            100% {

                opacity: 1;

                -webkit-transform: none;

                transform: none

            }

        }

@keyframes fadeInUp {

            0% {

                opacity: 0;

                -webkit-transform: translate3d(0, 100%, 0);

                -ms-transform: translate3d(0, 100%, 0);

                transform: translate3d(0, 100%, 0)

            }

            100% {

                opacity: 1;

                -webkit-transform: none;

                -ms-transform: none;

                transform: none

            }

        }





html,body,.swiper-container,.swiper-wrapper,.swiper-slide{

    width:100%;

    height:100%;

}





/*common*/

*:focus {outline: none;}



/* display */

.dn { display: none; }

.di { display: inline; }

.db { display: block; }

.dib { display: inline-block; } /* if the element is block level(eg. div, li), using 'inline-any' instead */









/* 鍧楃姸鍏冪礌姘村钩灞呬腑 */

.auto { margin-left: auto; margin-right: auto; }



/* overflow */

.ovh { overflow: hidden; }



/* position */

.rel { position: relative; }

.abs { position: absolute; }



/* font-family */

.fw { font-family: 'Microsoft Yahei'; }



/* font-style */

.n { font-weight: normal; font-style: normal; }

.b { font-weight: bold; }

.i { font-style: italic; }



/* text-align */

.tc { text-align: center; }

.tr { text-align: right; }

.tl { text-align: left; }

.tj { text-align: justify; }



/* 娓呴櫎娴� 鍔�*/

.fix { *zoom:1; }

.fix:after { content:" "; display:block; height:0; clear:both; visibility:hidden; font-size:0;}



/*table*/

table {

    width: 100%;

    border-collapse: collapse;

}



/* margin */

.m0 { margin:0 auto; }

.ml1 { margin-left: 1px; }

.ml2 { margin-left: 2px; }

.ml5 { margin-left: 5px; }

.ml10 { margin-left: 10px; }

.ml15 { margin-left: 15px; }

.ml20 { margin-left: 20px; }

.ml30 { margin-left: 30px; }



.mr1 { margin-right: 1px; }

.mr2 { margin-right: 2px; }

.mr5 { margin-right: 5px; }

.mr10 { margin-right: 10px; }

.mr15 { margin-right: 15px; }

.mr20 { margin-right: 20px; }

.mr30 { margin-right: 30px; }



.mt1 { margin-top: 1px; }

.mt2 { margin-top: 2px; }

.mt5 { margin-top: 5px; }

.mt10 { margin-top: 10px; }

.mt15 { margin-top: 15px; }

.mt20 { margin-top: 20px; }

.mt30 { margin-top: 30px; }



.mb1 { margin-bottom: 1px; }

.mb2 { margin-bottom: 2px; }

.mb5 { margin-bottom: 5px; }

.mb10 { margin-bottom: 10px; }

.mb15 { margin-bottom: 15px; }

.mb20 { margin-bottom: 20px; }

.mb25 { margin-bottom: 25px; }

.mb30 { margin-bottom: 30px; }



/* padding */

.p0 { padding: 0; }

.p1 { padding: 1px; }

.pl1 { padding-left: 1px; }

.pt1 { padding-top: 1px; }

.pr1 { padding-right: 1px; }

.pb1 { padding-bottom: 1px; }



.p2 { padding: 2px; }

.pl2 { padding-left: 2px; }

.pt2 { padding-top: 2px; }

.pr2 { padding-right: 2px; }

.pb2 { padding-bottom: 2px; }



.pl5 { padding-left: 5px; }

.p5 { padding: 5px; }

.pt5 { padding-top: 5px; }

.pr5 { padding-right: 5px; }

.pb5 { padding-bottom: 5px; }



.p10 { padding: 10px; }

.pl10 { padding-left: 10px; }

.pt10 { padding-top: 10px; }

.pr10 { padding-right: 10px; }

.pb10 { padding-bottom: 10px; }



.p15 { padding: 15px; }

.pl15 { padding-left: 15px; }

.pt15 { padding-top: 15px; }

.pr15 { padding-right: 15px; }

.pb15 { padding-bottom: 15px; }



.p20 { padding: 20px; }

.pl20 { padding-left: 20px; }

.pt20 { padding-top: 20px; }

.pr20 { padding-right: 20px; }

.pb20 { padding-bottom: 20px; }



.p30 { padding: 30px; }

.pl30 { padding-left: 30px; }

.pt30 { padding-top: 30px; }

.pr30 { padding-right: 30px; }

.pb30 { padding-bottom: 30px; }



/* vertical-align */

.vm { vertical-align: middle; }

.vtb { vertical-align: text-bottom; }

.vb { vertical-align: bottom; }

.vt { vertical-align: top; }

.vn { vertical-align: -2px; }



.bgnone{background:none !important;}

.bnone{border:none !important;}



.swiper-slide{background-position:50% 50%; position:relative;}







.pagination{

    position: fixed;

    z-index: 100;

    margin-top: -81.5px;

    top: 50%;

    right:17px;

}

.swiper-pagination-switch{

    width:11px;

    height:11px;

    background:#fff;

    border-radius:50%;

    display:block;

    margin:7px 7px 13px;

    cursor:pointer;

}

.swiper-active-switch{

    background:url(../img/hvyq.png) no-repeat center center;

     width:20px;

    height:20px;

    position: relative;

    left: -5px;

}



.ani-slide .ani1-1{

    opacity:1;

    -webkit-animation: fadeInDown 0.5s both;

    animation: fadeInDown 0.5s both;

}

.ani-slide .ani1-2{

    opacity:1;

    -webkit-animation: fadeInDown 1s 0.5s both;

    animation: fadeInDown 1s 0.5s both;

}

.ani-slide .ani1-3{

    opacity:1;

    -webkit-animation: fadeInDown 1s 1s both;

    animation: fadeInDown 1s 1s both;

}

.ani-slide .ani2-1,.ani-slide .ani3-1,.ani-slide .ani4-1,.ani-slide .ani5-1{

    opacity: 1;

    -webkit-animation: fadeInUp 1s both;

    animation: fadeInUp 1s both;

}

.ani-slide .ani2-2,.ani-slide .ani3-2,.ani-slide .ani4-2,.ani-slide .ani5-2{

    opacity: 1;

    -webkit-animation: fadeInUp 1s 0.5s both;

    animation: fadeInUp 1s 0.5s both;

}

.ani-slide .ani5-1-2{

    opacity: 1;

    -webkit-animation: fadeInUp 1s 0.3s both;

    animation: fadeInUp 1s 0.3s both;

}

.ani-slide .ani6-1 {

    opacity: 1;

    -webkit-animation: fadeInDown 0.5s both;

    animation: fadeInDown 0.5s both;

}

.ani-slide .ani6-2 {

    opacity: 1;

    -webkit-animation: fadeInDown 1s 0.5s both;

    animation: fadeInDown 1s 0.5s both;

}

.ani-slide .ani6-3 {

    opacity: 1;

    -webkit-animation: fadeInDown 1s 1s both;

    animation: fadeInDown 1s 1s both;

}
