*{   margin:0;
     padding: 0;

}

body {
            color: #222;
            -webkit-text-size-adjust: none;
        }

        body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, iframe {
            margin: 0;
            padding: 0;
        }

        h1, h2, h3, h4, h5, h6 {
            font-size: 100%;
        }

        body, button, input, select, textarea {
            font-family: Tahoma, Arial, Roboto, ”Droid Sans”, ”Helvetica Neue”, ”Droid Sans Fallback”, ”Heiti SC”, sans-self;
            font-size: 62.5%;
            line-height: 1.5;
        }

        ol, ul {
            list-style: none;
        }

        html, body {
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        img {
            width: 100%;
            height: 100%;
        }

        .section-wrap {
            width: 100%;
            height: 100%;
            overflow: visible;
            transition: transform 1s cubic-bezier(0.86, 0, 0.03, 1);
            -webkit-transition: -webkit-transform 1s cubic-bezier(0.86, 0, 0.03, 1);
        }

        .section-wrap .section {
            position: relative;
            width: 100%;
            height: 100%;
            background-position: center center;
            background-repeat: no-repeat;
        }

        .section-wrap .section .title {
            width: 100%;
            position: absolute;
            top: 10%;
            color: #fff;
            font-size: 2.4em;
            text-align: center;
        }

        .section-wrap .section .title p {
            padding: 0 4%;
            opacity: 0
        }

        .section-wrap .section .title.active .tit {
            opacity: 1;
            transform: translateY(-25px);
            -webkit-transform: translateY(-25px);
            transition: all 2s cubic-bezier(0.86, 0, 0.8, 1);
            -webkit-transition: all 2s cubic-bezier(0.86, 0, 0.8, 1);
        }

        .section-wrap .section-1 {
            background-color: #fff
        }

        .section-wrap .section-2 {
            background-color: #fff
        }

        .section-wrap .section-3 {
            background-color: #fff
        }

        .section-wrap .section-4 {
            background-color: #fff
        }

        .section-wrap .section-5 {
            background-color: #fff
        }

        .put-section-0 {
            transform: translateY(0);
            -webkit-transform: translateY(0);
        }

        .put-section-1 {
            transform: translateY(-100%);
            -webkit-transform: translateY(-100%);
        }

        .put-section-2 {
            transform: translateY(-200%);
            -webkit-transform: translateY(-200%);
        }

        .put-section-3 {
            transform: translateY(-300%);
            -webkit-transform: translateY(-300%);
        }

        .put-section-4 {
            transform: translateY(-400%);
            -webkit-transform: translateY(-400%);
        }

        .section-btn {
            width: 14px;
            position: fixed;
            right: 4%;
            top: 50%;
        }

        .section-btn li {
            width: 14px;
            height: 14px;
            cursor: pointer;
            text-indent: -9999px;
            border-radius: 50%;
            -webkit-border-radius: 50%;
            margin-bottom: 12px;
            background: #fff;
            text-align: center;
            color: #fff;
            onsor: pointer;
        }

        .section-btn li.on {
            background: #41aaaa
        }

        .arrow {
            opacity: 1;
            animation: arrow 3s cubic-bezier(0.5, 0, 0.1, 1) infinite;
            -webkit-animation: arrow 3s cubic-bezier(0.5, 0, 0.1, 1) infinite;
            transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            position: absolute;
            bottom: 10px;
            left: 50%;
            margin-left: -30px;
            width: 60px;
            height: 60px;
            border-radius: 100%;
            -webkit-border-radius: 100%;
            line-height: 60px;
            text-align: center;
            font-size: 20px;
            color: #fff;
            border: 1px solid #fff;
            cursor: pointer;
            overflow: hidden;
        }

        .arrow:hover {
            animation-play-state: paused;
            -webkit-animation-play-state: paused;
        }

        @keyframes arrow {

        %
        0
        ,
        %
        100
        {
            bottom: 10px
        ;
            opacity: 1
        ;
        }
        50
        %
        {
            bottom: 50px
        ;
            opacity: .5
        }
        }
        @-webkit-keyframes arrow {

        %
        0
        ,
        %
        100
        {
            bottom: 10px
        ;
            opacity: 1
        ;
        }
        50
        %
        {
            bottom: 50px
        ;
            opacity: .5
        }
        }