html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,p{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}

/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
body{font-size:14px;line-height:normal;font-family:"微软雅黑","宋体",Verdana,Arial,Helvetica,sans-serif;margin:0 auto; background-color: #fff;}
ol,ul{list-style:none;}
a{text-decoration:none; color:#505050;}
a:hover{ color:#505050;}
img{border:0px;vertical-align:middle;display: block;}
em{ font-style:normal;}
input,button,select,textarea{ margin:0; padding:0; outline:none;}

/*css3动画定义*/
.ts0_5 { -webkit-transition:600ms all cubic-bezier(0.165, 0.84, 0.44, 1); transition:600ms all cubic-bezier(0.165, 0.84, 0.44, 1);}
.ts1 { -webkit-transition:1s all ease; -moz-transition:1s all ease; -ms-transition:1s all ease; -o-transition:1s all ease; transition:1s all ease; }
.ts2 { -webkit-transition:2s all ease; -moz-transition:2s all ease; -ms-transition:2s all ease; -o-transition:2s all ease; transition:2s all ease; }

/*loading*/
#loading{ width:100%; height:100%; position:fixed; top:0; left:0; z-index:99999;}
#loading .bg{ width:100%; height:100%; position:absolute; top:0; left:0; background-color:#000;}
#loading .icon{ width: 100%; position:absolute; top:50%; left:0; margin-top:-40px;}
#loading .icon img{ display: block; margin: 0 auto;}
#loading p{ width:100%; position:absolute; top:50%; left:0; text-align:center; font-size:18px; margin-top:10px; color:#fff;}

/*共同样式*/
.screen1,.screen2,.screen3,.screen4,.screen5,.screen6,.screen7,.screen8,.screen9{
    overflow: hidden;
}
.screen1con,.screen2con,.screen3con,.screen4con,.screen5con,.screen6con,.screen7con,.screen8con,.screen9con{
    width: 1200px;
    margin: 0 auto;
}

/*p1样式*/
.screen1{
    padding-top: 80px;
    background-color: #5b5c5c;
    background: url("../img/screen1_bg.jpg") center  bottom  no-repeat;
}

.screen1 .screen1con{
    background: url("../img/screen1_bg.jpg") center  bottom  no-repeat;
    position: relative;
    height: 560px;
}
.screen1 .screen1con img{
    display: block;
}
.screen1 .screen1con .screen1_logo{
    padding-top: 36px;
}
.screen1 .screen1con .screen1_t1{
    position: absolute;
    top: 150px;
}
.screen1 .screen1con .screen1_t2{
    position: absolute;
    top: 173px;
    left: 290px;
}
.screen1 .screen1con .screen1_t3{
    position: absolute;
    top: 335px;
    left: 290px;
}
.screen1 .screen1con .screen1_t4{
    position: absolute;
    top: 376px;
}
/*.screen1 .screen1con .screen1_t5{*/
    /*position: absolute;*/
    /*bottom: 38px;*/
/*}*/
.screen1 .screen1con a img.bayicon {
    position: absolute;
    top: 450px;
    cursor: pointer;
}
.screen1 .screen1con .obay:hover{
    animation: move11 1s,ease-in-out;
    -webkit-animation: move11 1s,ease-in-out;
    /*animation-delay: 300s;*/
    /*-webkit-animation-delay: 300s;*/
    /*animation-fill-mode:backwards;*/
    /*-webkit-animation-fill-mode:backwards;*/
}
@keyframes move11{
    0%{transform:scale(1);}
    50%{transform:scale(0.9);}
    100%{transform:scale(1);}
}
@-webkit-keyframes move11{
    0%{transform:scale(1);}
    50%{transform:scale(0.9);}
    100%{transform:scale(1);}
}

.obay img:hover{
    animation: move10 1.5s,ease-in-out;
    -webkit-animation: move10 1.5s,ease-in-out;
    /*animation-fill-mode:backwards;*/
    /*-webkit-animation-fill-mode:backwards;*/
}
@keyframes move10{
    0%{transform:scale(1);}
    50%{transform:scale(0.9);}
    100%{transform:scale(1);}
}
@-webkit-keyframes move10{
    0%{transform:scale(1);}
    50%{transform:scale(0.9);}
    100%{transform:scale(1);}
}

.screen1 .screen1con .screen1_chanpin{
    position: absolute;
    top: 127px;
    left: 615px;
    z-index: 2;
}
.screen1 .screen1con .screen1_chanpin2{
    position: absolute;
    top:363px;
    left: 648px;
    z-index: 1;
}

.screen1 .screen1con .screen1_t1{
    animation: move 1.5s,ease-in-out;
    -webkit-animation: move 1.5s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1s;
    -webkit-animation-delay: 1s;
}
@keyframes move{
    0%{top:0;opacity:0;}
    100%{top:150px;opacity:1;}
}
@-webkit-keyframes move{
    0%{top:0;opacity:0;}
    100%{top:150px;opacity:1;}
}

.screen1 .screen1con .screen1_t2{
    animation: move2 1.5s,ease-in-out;
    -webkit-animation: move2 1.5s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
}
@keyframes move2{
    0%{top:0;opacity:0;}
    100%{top:173px;opacity:1;}
}
@-webkit-keyframes move2{
    0%{top:0;opacity:0;}
    100%{top:173px;opacity:1;}
}

.screen1 .screen1con .screen1_t3{
    animation: move3 1.5s,ease-in-out;
    -webkit-animation: move3 1.5s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1s;
    -webkit-animation-delay: 1s;
}
@keyframes move3{
    0%{top:385px;opacity:0;}
    100%{top:335px;opacity:1;}
}
@-webkit-keyframes move3{
    0%{top:385px;opacity:0;}
    100%{top:335px;opacity:1;}
}
.screen1 .screen1con .screen1_t4,.screen1 .screen1con .screen1_t5{
    animation: move4 1.5s,ease-in-out;
    -webkit-animation: move4 1.5s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1.2s;
    -webkit-animation-delay: 1.2s;
}
    @keyframes move4{
        0%{opacity:0;}
        100%{opacity:1;}
    }
    @-webkit-keyframes move4{
        0%{opacity:0;}
        100%{opacity:1;}
    }

.screen1 .screen1con .bayicon{
    animation: move5 1.5s,ease-in-out;
    -webkit-animation: move5 1.5s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
}
@keyframes move5{
    0%{transform:scale(0);opacity:0;}
    40%{transform:scale(1.1);opacity:1;}
    65%{transform:scale(0.97);opacity:1;}
    100%{transform:scale(1);opacity:1;}
}
@-webkit-keyframes move5{
    0%{transform:scale(0);opacity:0;}
    40%{transform:scale(1.1);opacity:1;}
    65%{transform:scale(0.97);opacity:1;}
    100%{transform:scale(1);opacity:1;}
}
.screen1 .screen1con .screen1_chanpin{
    animation: move6 2s,ease-in-out;
    -webkit-animation: move6 2s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;

    -webkit-transform-origin: 62px 449px;
    transform-origin: 62px 449px;
}
@-webkit-keyframes move6 {
    0% {opacity:0;
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }
    100% {opacity:1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}
@keyframes move6 {
    0% {opacity:0;
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }
    100% {opacity:1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}
.screen1_chanpin2{
    animation: move7 4s,ease-in-out;
    -webkit-animation: move7 4s,ease-in-out;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
}
@-webkit-keyframes move7 {
    0% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
@keyframes move7 {
    0% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
/*p2样式*/
.screen2{
    width: 100%;
    background-color: #887961;
    background: url("../img/screen2_bg.jpg") center  bottom  no-repeat;
}

.screen2 .screen2con{
    position: relative;
    height: 700px;
}
.screen2 .screen2con .screen2_chanpin{
    position: absolute;
    top: -30px;
    left: -480px;
}
.screen2 .screen2con .textcon{
    position: relative;
}
.screen2 .screen2con .textcon .screen2_t1{
    position: absolute;
    top: 80px;
    left: 924px;
    opacity: 0;
}
.screen2 .screen2con .textcon .screen2_bay{
    position: absolute;
    top: 255px;
    left: 1135px;
    opacity: 0;
    cursor: pointer;
}

/*p3样式*/
.screen3{
    width: 100%;
    background-color: #4e4f4f;
    background: url("../img/screen3_bg.jpg") center  bottom  no-repeat;
}
.screen3 .screen3con{
    position: relative;
    height: 700px;
}
.screen3 .screen3con .textcon{
    position: relative;
    z-index: 6;
}
.screen3 .screen3con .textcon .screen3_t1{
    position: absolute;
    top: 56px;
    left: 273px;
    z-index: 7;
    opacity: 0;
}
.screen3 .screen3con .textcon .screen3_t2{
    opacity: 0;
    position: absolute;
    top: 103px;
    left: 618px;
    z-index: 8;
}
.screen3 .screen3con .textcon .screen3_t3{
    opacity: 0;
    position: absolute;
    top: 119px;
    left: 995px;
    z-index: 9;
}
.screen3 .screen3con .textcon .screen3_bay{
    opacity: 0;
    position: absolute;
    top: 272px;
    left: 998px;
    z-index: 10;
}
.screen3 .screen3con .screen3_chanpin1{
    z-index: 1;
    position: absolute;
    top:204px;
    left:19px;
}
.screen3 .screen3con .screen3_chanpin2{
    z-index: 5;
    position: absolute;
    top:281px;
    left:269px;
}
.screen3 .screen3con .screen3_chanpin3{
    z-index: 5;
    position: absolute;
    top:345px;
    left:619px;
}
.screen3 .screen3con .screen3_time{
    z-index: 4;
    position: absolute;
    top:367px;
}
.screen3 .screen3con .screen3_chanpin2 ol li.gy1{
    position: absolute;
    top:111px;
    left: 270px;
    z-index: 6;
}
.screen3 .screen3con .screen3_chanpin3 ol li.gy2{
    position: absolute;
    top:150px;
    left: 355px;
    z-index: 7;
}
.screen3 .screen3con .screen3_chanpin2 img.screen3_pop2{
    position: absolute;
    top:-51px;
    left: 250px;
    z-index: 8;
    display: none;
}
.screen3 .screen3con .screen3_chanpin3 img.screen3_pop3{
    position: absolute;
    top:-29px;
    left: 328px;
    z-index: 9;
    display: none;
}
/*p4样式*/
.screen4{
    width: 100%;
    background-color: #908670;
    background: url("../img/screen4_bg.jpg") center  bottom  no-repeat;
}
.screen4 .screen4con{
    position: relative;
    height: 701px;
}
.screen4 .screen4con .screen4_moble{
    position: absolute;
    top:38px;
    left:137px;
}
.screen4 .screen4con .textcon{
    padding-top: 127px;
    margin-left: 567px;
    z-index: 4;
}
.screen4 .screen4con .textcon .screen4_t2{
    margin-top: 32px;
}
.screen4 .screen4con .textcon .gif1{
    position: absolute;
    top:297px;
    left: 568px;
}

.screen4 .screen4con .textcon .p1{
    font-size: 45px;
    color: #ffffff;
    position: absolute;
    top:295px;
    left: 648px;
}
.screen4 .screen4con .textcon .p2{
    font-size: 45px;
    color: #ffffff;
    position: absolute;
    top:295px;
    left: 980px;
}
.screen4 .screen4con .textcon .gif2{
    position: absolute;
    top:292px;
    left: 883px;
}
.screen4 .screen4con .textcon .screen4_bay{
    margin-top: 36px;
}
/*p5样式*/
.screen5{
    width: 100%;
    background-color: #898688;
    background: url("../img/screen5_bg.jpg") center  bottom  no-repeat;
}
.screen5 .screen5con{
    position: relative;
    height: 694px;
}
.screen5 .screen5con .screen5_shoes{
    position: absolute;
    top:215px;
    left:228px;
    z-index: 1;
}

.screen5 .screen5con .screen5_shoes li.gy1{
    cursor: pointer;
    width:48px ;
    height: 48px;
    position: absolute;
    top: 50px;
    left: 20px;
    z-index: 2;
}
.screen5 .screen5con .screen5_shoes li.gy2{
    cursor: pointer;
    width:48px ;
    height: 48px;
    position: absolute;
    top: 49px;
    left: 525px;
    z-index: 2;
}
.screen5 .screen5con .screen5_shoes li.gy3{
    cursor: pointer;
    width:48px ;
    height: 48px;
    position: absolute;
    top: 134px;
    left: 576px;
    z-index: 2;
}
.screen5 .screen5con .screen5_shoes li.gy4{
    cursor: pointer;
    width:48px ;
    height: 48px;
    position: absolute;
    top: 205px;
    left: 600px;
    z-index: 2;
}
.screen5 .screen5con .screen5_shoes li.gy4,.screen5 .screen5con .screen5_shoes li.gy3,.screen3 .screen3con .screen3_chanpin2 ol li.gy1,
.screen5 .screen5con .screen5_shoes li.gy2,.screen5 .screen5con .screen5_shoes li.gy1,.screen3 .screen3con .screen3_chanpin3 ol li.gy2
{
    animation: gy 1s,ease;
    -webkit-animation: gy 1s,ease;
    animation-fill-mode:backwards;
    -webkit-animation-fill-mode:backwards;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
@keyframes gy{
    0%{transform:scale(1);}
    50%{transform:scale(1.1);}
    100%{transform:scale(1);}
}
@-webkit-keyframes gy{
    0%{transform:scale(1);}
    50%{transform:scale(1.1);}
    100%{transform:scale(1);}
}

.screen5 .screen5con .screen5_shoes .glass1 img{
    z-index: 10;
    position: absolute;
    top: -60px;
    left: -103px;
    display: none;
}
.screen5 .screen5con .screen5_shoes .glass2 img{
    z-index: 10;
    position: absolute;
    top: -65px;
    left: 411px;
    display: none;
}
.screen5 .screen5con .screen5_shoes .glass3 img{
    z-index: 10;
    position: absolute;
    top: 12px;
    left: 452px;
    display: none;
}
.screen5 .screen5con .screen5_shoes .glass4 img{
    z-index: 10;
    position: absolute;
    top: 116px;
    left: 456px;
    display: none;
}
.screen5 .screen5con .textcon{
    position: relative;
    z-index: 4;
}
.screen5 .screen5con .textcon .screen5_t1{
    position: absolute;
    top:54px ;
    left:830px ;
    opacity: 0;
}
.screen5 .screen5con .textcon .screen5_bay{
    position: absolute;
    top: 94px;
    left: 1120px;
    z-index: 4;
    opacity: 0;
}



/*p6样式*/
.screen6{
    width: 100%;
    background-color: #898688;
    background: url("../img/screen6_bg.jpg") center  bottom  no-repeat;
}
.screen6 .screen6con{
    position: relative;
    height: 676px;
}
.screen6 .screen6con .screen6_chanpin{
    position: absolute;
    top:-530px;
    left:-60px;

}
.screen6 .screen6con .screen6_chanpin2{
    position: absolute;
    top:-530px;
    left:466px;
}
.screen6 .screen6con .textcon{
    position: relative;
    height: 700px;
    z-index: 4;
}
.screen6 .screen6con .textcon .screen6_t1{
    opacity: 0;
    position: absolute;
    bottom:188px;
    left:292px;
}
.screen6 .screen6con .textcon .screen6_t2{
    opacity: 0;
    position: absolute;
    bottom:188px ;
    left:872px ;
}
.screen6 .screen6con .textcon .screen6_bay{
    opacity: 0;
    position: absolute;
    bottom:122px ;
    left:292px ;
}
.screen6 .screen6con .textcon .screen6_bay2{
    opacity: 0;
    position: absolute;
    bottom:122px ;
    left:872px ;
}
/*p7样式*/
.screen7{
    width: 100%;
    background-color: #6d6d6d;
    background: url("../img/screen7_bg.jpg") center  bottom  no-repeat;
}
.screen7 .screen7con{
    position: relative;
    height: 676px;
}
.screen7 .screen7con .textcon{
    margin-left: 181px;
    padding-top: 64px;
    float: left;
}
.screen7 .screen7con .textcon img{
    float: left;
}
.screen7 .screen7con .textcon .screen7_t1{
    margin-right: 153px;
}

.screen7 .screen7con .textcon .screen7_t2{
    margin-right: 153px;
}
.screen7 .screen7con .textcon2{
    width: 1200px;
    margin: 0 auto;
    padding-top: 419px;
    z-index: 4;
}
.screen7 .screen7con .textcon2 img{
    float: left;
}
.screen7 .screen7con .textcon2 .screen7_t3{
    margin-right: 861px;
}
.screen7 .screen7con .textcon2 .screen7_t5{
    margin-top: 53px;
    margin-left: 455px;
    margin-right: 477px;
}
.screen7 .screen7con .textcon2 .screen7_bay{
    position: absolute;
    top:572px;
    left:157px;
}

.screen7 .screen7con .textcon2 a.active{
    display: none;
}

.screen7 .screen7con .textcon2 .screen7_bay2{
    position: absolute;
    top:572px;
    left:817px;
}
.screen7 .screen7con .screen7_center{
    position: absolute;
    top:572px;
    left:510px;
}
.screen7 .screen7con .textcon2 .screen7_bay3{
    position: absolute;
    top:572px;
    left:817px;
}
.screen7 .screen7con .screen7_logo{
    position: absolute;
    left:520px;
    top:267px;
}
.screen7 .screen7con .shoes1{
    position: absolute;
    top: 163px;
    left: 80px;
    z-index: 1;
}
.screen7 .screen7con .shoes2{
    position: absolute;
    top: 168px;
    left: 668px;
    z-index: 1;
}
#change1 {
    width: 290px;
    height: 120px;
    margin-left: 43px;
    margin-top: -5px;
}
#change1 li{
    display: block;
    width: 44px;
    height: 21px;
    float: left;
    margin: 0 19px 18px 0;
    background: url("../img/screen7_btnpic1.png") 0 0 no-repeat;
    overflow: hidden;
    cursor: pointer;
}
#change1 .f2{
    background-position: -63px 0;
}
#change1 .f3{
    background-position: -126px 0;
}
#change1 .f4{
    background-position: -189px 0;
}
#change1 .f5{
    background-position: 0 -39px;
}
#change1 .f6{
    background-position: -63px -39px;
}
#change1 .f7{
    background-position: -126px -39px;
}
#change1 .f8{
    background-position: -189px -39px;
}


#change2 {
    width: 280px;
    margin-left: 87px;
    margin-top: -5px;
}
#change2 li{
    display: block;
    width: 44px;
    height: 21px;
    float: left;
    margin: 0 19px 18px 0;
    background: url("../img/screen7_btnpic2.png") 0 0 no-repeat;
    overflow: hidden;
    cursor: pointer;
}
#change2 .f2{
    background-position: -63px 0;
}
#change2 .f3{
    background-position: -126px 0;
}
#change2 .f4{
    background-position: -187px 0;
}
#change2 .f5{
    background-position: 0 -39px;
}
#change2 .f6{
    background-position: -63px -39px;
}
#change2 .f7{
    background-position: -126px -39px;
}
#change2 .f8{
    background-position: -189px -39px;
}


/*p8样式*/
.screen8{
    width: 100%;
    background-color: #e6e6e6;
    /*background: url("../img/screen7_bg.jpg") center  bottom  no-repeat;*/
}
.screen8 .screen8con{

    position: relative;
    height: 850px;
}
.screen8 .screen8con .textcon{
    z-index: 4;
    padding-top: 70px;
    margin-left: 240px;
}
.screen8 .screen8con .textcon .screen8_t1{

    margin-left: 26px;
}
.screen8 .screen8con .textcon p{
    float: left;
    display:block;
    margin-top: 70px;
    margin-right: 20px;
    font-size: 18px;
    height: 36px;
    vertical-align: middle;
}
.screen8 .screen8con .textcon select{
    float: left;
    display:block;
    border: 1px solid #000000;
    width: 127px;
    height: 36px;
    margin-top: 62px;
    margin-right: 24px;
}
.screen8 .screen8con .textcon .screen8_bayicon2{
    float: left;
    width:132px;
    height:36px;
    margin-left: 56px;
    margin-top: 62px;
}
.screen8 .screen8con ul{
    position: absolute;
    top: 276px;

}
.screen8 .screen8con ul li{
    width: 220px;
    font-family: "微软雅黑";
    height: 115px;
    /*padding-bottom: 40px;*/
    margin-right: 80px;
    float: left;
    font-size: 14px;
    list-style-image: url("../img/icon2.png");
}
.screen8 .screen8con ul li p{
    line-height: 20px;
    /*word-spacing:2px;*/
    /*letter-spacing: 2px;*/
}
.screen8 .screen8con ol{
    position: relative;
    top: 550px;
    display: inline-block;
    height: 24px;
    text-align: center;
    width: 1200PX;
}
.screen8 .screen8con ol li{
    display: inline-block;
    margin-right: 24px;
}
.screen8 .screen8con ol li a{
    font-family: '微软雅黑';
    font-size: 18px;
    color: #000000;

}
.screen8 .screen8con ol li a.hover{
    color: #919191;
    text-decoration:underline;
}

/*.screen8 .screen8con ol li a:hover,.screen8 .screen8con ol li a:active{*/
    /*color: #919191;*/
    /*text-decoration:underline;*/
/*}*/