
.generic{ width:100%; min-width:930px; float:left; overflow:hidden; position:relative}
.generic .box{ width:1920px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px; font-family:HanHei SC; font-weight:200}
.generic .tit_box{ width:920px; float:left; position:absolute; opacity:0; z-index:10}
.generic .t_1{ width:100%; float:left; font-size:50px; line-height:62px}
.generic .t_2{ width:100%; float:left; font-size:22px; line-height:40px}
.generic .img_box{ width:1920px; float:left; position:absolute; top:0; left:0}
.generic .img_box img{ width:1920px; float:left; position:absolute; top:0; left:0}

.wrist_1{ height:1000px}
.wrist_1 .box{ height:1000px}
.wrist_1 .tit_box{ text-align:center; color:#c7c7c7; top:216px; left:500px}
.wrist_1 .t_1{ font-size:66px; line-height:70px; padding-bottom:5px}
.wrist_1 .t_2{ font-size:22px; line-height:36px}
.wrist_1 .img_box{ height:1000px}
.wrist_1 .img_box img{ transform:scale(1.12); -webkit-transform:scale(1.12)}

.wrist_2{ height:910px}
.wrist_2 .box{ height:910px}
.wrist_2 .tit_box{ top:316px; left:440px}
.wrist_2 .t_1{ padding-bottom:36px}
.wrist_2 .img_box{ height:910px}
.wrist_2 .img_box .img_1{ width:459px; height:468px; position:absolute; top:165px; left:1051px; transition:transform 0.65s ease-out 0.05s}
.wrist_2 .img_box .img_2{ width:593px; height:157px; position:absolute; top:700px; left:1024px; transition:transform 0.65s ease-out 0.05s}

.wrist_3{ height:1368px}
.wrist_3 .box{ height:1368px}
.wrist_3 .tit_box{ top:210px; left:1020px}
.wrist_3 .t_1{ padding-bottom:36px}
.wrist_3 .img_box{ height:1368px}
.wrist_3 ul{ width:680px; float:left; margin:61px 0 0 0}
.wrist_3 li{ width:80px; float:left; padding-top:90px; margin-right:60px; font-size:20px; color:rgba(0,0,0,0.7); text-align:center; line-height:24px; background:url(https://images.iyunmai.com/home/static/images/accessories/wristBall/img_3_bg.png) no-repeat center 0; opacity:0}
.wrist_3 .icon_2{ background-position:center -200px}
.wrist_3 .icon_3{ background-position:center -400px}

.wrist_4{ height:890px}
.wrist_4 .box{ height:890px}
.wrist_4 .playBtn{ font-size:50px; line-height:60px; color:#fff; float:left; position:absolute; top:50%; left:50%; margin:-30px 0 0 -160px; padding-right:66px; background:url(https://images.iyunmai.com/home/static/images/accessories/wristBall/img_4_bg.png) no-repeat right 7px; z-index:10}
.wrist_4 .img_box{ height:890px}

.wrist_5{ height:1526px}
.wrist_5 .box{ height:1526px}
.wrist_5 .tit_box{ text-align:center; color:rgba(0,0,0,0.9); top:150px; left:500px}
.wrist_5 .t_1{ padding-bottom:39px}
.wrist_5 .img_box{ height:1526px}
.wrist_5 .img_box .img_1{ width:500px; height:0; overflow:hidden; float:left; position:absolute; background:url(https://images.iyunmai.com/home/static/images/accessories/wristBall/img_5_bg.png) no-repeat 0 -600px; top:949px; left:913px}
.wrist_5 .img_box .t_3{ width:230px; height:80px; float:left; text-align:right; color:rgba(0,0,0,0.7); font-size:40px; line-height:40px; position:absolute; top:364px; left:160px; opacity:0}
.wrist_5 ul{ width:660px; float:left; position:relative; left:50%; margin:43px 0 0 -330px}
.wrist_5 li{ width:220px; float:left; padding-top:97px; font-size:20px; color:rgba(0,0,0,0.7); text-align:center; line-height:24px; background:url(https://images.iyunmai.com/home/static/images/accessories/wristBall/img_5_bg.png) no-repeat center 0; opacity:0}
.wrist_5 .icon_2{ background-position:center -200px}
.wrist_5 .icon_3{ background-position:center -400px}

@keyframes img_5_1{ 0%{ height:0; transform:translate3d(0,0,0) rotate(0.0001deg)} 99.99%{ height:440px; transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ height:440px; transform:translate3d(0,0,0) rotate(0)}}
@-webkit-keyframes img_5_1{ 0%{ height:0; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 99.99%{ height:440px; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ height:440px; -webkit-transform:translate3d(0,0,0) rotate(0)}}

.wrist_6{ height:1132px}
.wrist_6 .box{ height:1132px}
.wrist_6 .tit_box{ top:398px; left:440px; color:#fff}
.wrist_6 .t_1{ padding-bottom:36px}
.wrist_6 .t_2{ opacity:0.7; padding-bottom:39px}
.wrist_6 .t_3{ font-size:18px; opacity:0.5}
.wrist_6 .img_box{ height:1132px}

.wrist_7{ height:1438px}
.wrist_7 .box{ height:1438px}
.wrist_7 .tit_box{ text-align:center; top:150px; left:500px}
.wrist_7 .t_1{ padding-bottom:27px}
.wrist_7 .img_box{ height:1438px}

.wrist_8{ height:950px}
.wrist_8 .box{ height:950px}
.wrist_8 .tit_box{ text-align:center; top:150px; left:500px}
.wrist_8 .t_1{ padding-bottom:27px}
.wrist_8 .img_box{ height:950px}
.wrist_8 .img_box .img_1{ width:221px; height:353px; position:absolute; top:403px; left:530px; transform:translate3d(110px,0,0) rotate(0.0001deg)}
.wrist_8 .img_box .img_2{ width:287px; height:339px; position:absolute; top:413px; left:726px; transform:translate3d(60px,0,0) rotate(0.0001deg)}
.wrist_8 .img_box .img_3{ width:183px; height:352px; position:absolute; top:403px; left:1005px; transform:translate3d(-60px,0,0) rotate(0.0001deg)}
.wrist_8 .img_box .img_4{ width:163px; height:353px; position:absolute; top:403px; left:1217px; transform:translate3d(-108px,0,0) rotate(0.0001deg)}

@keyframes img_8_1{ 0%{ transform:translate3d(110px,0,0) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_8_1{ 0%{ -webkit-transform:translate3d(110px,0,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)}}

@keyframes img_8_2{ 0%{ transform:translate3d(60px,0,0) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_8_2{ 0%{ -webkit-transform:translate3d(60px,0,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)}}

@keyframes img_8_3{ 0%{ transform:translate3d(-60px,0,0) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0)rotate(0.0001deg)}}
@-webkit-keyframes img_8_3{ 0%{ -webkit-transform:translate3d(-60px,0,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)}}

@keyframes img_8_4{ 0%{ transform:translate3d(-110px,0,0) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0)rotate(0.0001deg)}}
@-webkit-keyframes img_8_4{ 0%{ -webkit-transform:translate3d(-110px,0,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)}}

.wrist_9{ height:798px}
.wrist_9 .box{ height:798px}
.wrist_9 .tit_box{ top:266px; left:1020px}
.wrist_9 .t_1{ padding-bottom:28px}
.wrist_9 .img_box{ height:798px}
.wrist_9 .img_box .img_1{ width:422px; height:422px; position:absolute; top:108px; left:424px; transition:transform 0.65s ease-out 0.05s}
.wrist_9 .img_box .img_2{ width:329px; height:100px; position:absolute; top:628px; left:476px; transition:transform 0.65s ease-out 0.05s}

.wrist_10{ height:800px}
.wrist_10 .box{ height:800px}
.wrist_10 .tit_box{ top:303px; left:440px}
.wrist_10 .t_1{ padding-bottom:30px}
.wrist_10 .img_box{ height:800px}

.wrist_11{ height:1089px}
.wrist_11 .box{ height:1089px}
.wrist_11 .tit_box{ text-align:center; color:#fff; top:148px; left:500px}
.wrist_11 .t_1{ padding-bottom:21px}
.wrist_11 .img_box{ height:1089px}

.wrist_12{ height:919px}
.wrist_12 .box{ height:919px}
.wrist_12 .tit_box{ top:303px; left:1020px}
.wrist_12 .t_1{ padding-bottom:28px}
.wrist_12 .img_box{ height:919px}

.video_pop{ width:100%; height:100%; float:left; position:fixed; top:0; left:0; background-color:rgba(0,0,0,0.8); overflow:hidden; z-index:99999999}
.video_pop video{ width:1280px; height:720px; float:left; position:absolute; top:50%; left:50%; margin:-360px 0 0 -640px}
.video_pop .close{ width:60px; height:60px; float:left; position:absolute; top:50%; left:50%; margin:-360px 0 0 640px; background-position:-400px -780px}

@keyframes opac_1{ 0%{ opacity:0} 100%{ opacity:1}}
@-webkit-keyframes opac_1{ 0%{ opacity:0} 100%{ opacity:1}}

@keyframes scale_1{ 0%{ transform:translate3d(0,0,0) scale(1.12) rotate(0.0001deg)} 99.99%{ transform:translate3d(0,0,0) scale(1) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0) scale(1) rotate(0)}}
@-webkit-keyframes scale_1{ 0%{ -webkit-transform:translate3d(0,0,0) scale(1.12) rotate(0.0001deg)} 99.99%{ -webkit-transform:translate3d(0,0,0) scale(1) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) scale(1) rotate(0)}}

@keyframes x_12{ 0%{ opacity:0; transform:translate3d(12%,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate3d(0,0,0) rotate(0)}}
@-webkit-keyframes x_12{ 0%{ opacity:0; -webkit-transform:translate3d(12%,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0)}}

@keyframes x_15{ 0%{ opacity:0; transform:translate3d(15%,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate3d(0,0,0) rotate(0)}}
@-webkit-keyframes x_15{ 0%{ opacity:0; -webkit-transform:translate3d(15%,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0)}}

@keyframes y_20{ 0%{ opacity:0; transform:translate3d(0,20%,0) rotate(0.0001deg)} 99.99%{ opacity:1; transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate3d(0,0,0) rotate(0)}}
@-webkit-keyframes y_20{ 0%{ opacity:0; -webkit-transform:translate3d(0,20%,0) rotate(0.0001deg)} 99.99%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0)}}