.tit_box{ width:100%; float:left; color:#323232; font-family:HanHei SC; font-weight:200}

.design_1{ width:100%; min-width:930px; height:805px; float:left; overflow:hidden; position:relative; margin-top:-110px}
.design_1 .tit_box{ width:500px; float:left; position:absolute; margin:262px 0 0 397px; z-index:10; padding-top:30px; transition:transform 1s ease; transform:translate3d(-40px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease; -webkit-transform:translate3d(-40px,0,0) rotate(0.001deg)}
.design_1 .t_1{ width:500px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute}
.design_1 .t_2{ width:500px; float:left; color:#666; line-height:30px; font-size:18px; position:absolute; margin-top:81px}
.design_1 .box{ width:1920px; height:805px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.design_1 .img_1{ width:347px; height:656px; float:left; position:absolute; margin:148px 0 0 1137px; transition:transform 1s ease; transform:translate3d(40px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease; -webkit-transform:translate3d(40px,0,0) rotate(0.001deg)}

.design_2{ width:100%; min-width:930px; height:700px; float:left; overflow:hidden; position:relative; background-color:#F5F5F5}
.design_2 .tit_box{ width:640px; float:left; position:absolute; margin:110px 0 0 640px; z-index:10; padding-top:30px}
.design_2 .t_1{ width:640px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; text-align:center; position:absolute}
.design_2 .t_2{ width:640px; float:left; color:#666; text-align:center; line-height:30px; font-size:18px; position:absolute; margin-top:74px}
.design_2 .box{ width:1920px; height:700px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.design_2 .img_1{ width:1282px; height:260px; float:left; position:absolute; margin:434px 0 0 638px; opacity:0; transition:transform 1.6s ease,opacity 1.6s ease; transform:translate3d(120px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.6s ease,opacity 1.6s ease; -webkit-transform:translate3d(120px,0,0) rotate(0.001deg)}
.design_2 .rmbBox{ width:160px; height:170px; float:left; position:absolute; margin:431px 0 0 424px; opacity:0; transform:translate3d(-590px,0,0) rotate(0.001deg); -webkit-transform:translate3d(-590px,0,0) rotate(0.001deg)}
.design_2 .rmbBox .rmb{ width:160px; height:160px; float:left; position:absolute; z-index:10; background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_miniDesign_2_2.png) no-repeat}
.design_2 .rmbBox .rmbBg{ width:160px; height:164px; float:left; position:absolute; z-index:11; background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_miniDesign_2_3.png) no-repeat}
.design_2 .rmbBoxClass{animation:rmbBox 2.5s linear; -webkit-animation:rmbBox 2.5s linear}
.design_2 .rmbClass{animation:rmb 2.5s linear; -webkit-animation:rmb 2.5s linear}

@keyframes rmbBox{ 0%{ transform:translate3d(-390px,0,0) rotate(0.001deg)} 20%{ opacity:1} 70%{ transform:translate3d(79px,0,0) rotate(0.001deg); animation-timing-function:cubic-bezier(.1,0,.4,1)} 100%{ transform:translate3d(0,0,0) rotate(0.001deg); opacity:1}}
@keyframes rmb{ 0%{ transform:rotate(-10deg)} 70%{ transform:rotate(420deg); animation-timing-function:cubic-bezier(.1,0,.4,1)} 100%{ transform:rotate(360deg)}}

@-webkit-keyframes rmbBox{ 0%{ -webkit-transform:translate3d(-390px,0,0) rotate(0.001deg)} 20%{ opacity:1} 70%{ -webkit-transform:translate3d(79px,0,0) rotate(0.001deg); -webkit-animation-timing-function:cubic-bezier(.1,0,.4,1)} 100%{ -webkit-transform:translate3d(0,0,0) rotate(0.001deg); opacity:1}}
@-webkit-keyframes rmb{ 0%{ -webkit-transform:rotate(-10deg)} 70%{ -webkit-transform:rotate(420deg); -webkit-animation-timing-function:cubic-bezier(.1,0,.4,1)} 100%{ -webkit-transform:rotate(360deg)}}

.design_3{ width:100%; min-width:930px; height:1230px; float:left; overflow:hidden; position:relative}
.design_3 .tit_box{ width:840px; float:left; position:absolute; margin:138px 0 0 540px; z-index:10; padding-top:30px}
.design_3 .t_1{ width:840px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; text-align:center; position:absolute}
.design_3 .t_2{ width:840px; float:left; color:#666; text-align:center; line-height:30px; font-size:18px; position:absolute; margin-top:74px}
.design_3 .box{ width:1920px; height:1280px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.design_3 .img_1{ width:985px; height:289px; float:left; position:absolute; margin:439px 0 0 467px; z-index:20; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); transform:translate3d(0,186px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); -webkit-transform:translate3d(0,186px,0) rotate(0.001deg)}
.design_3 .img_2{ width:985px; height:68px; float:left; position:absolute; margin:679px 0 0 467px; z-index:20; opacity:0; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.8s ease; transform:translate3d(0,183px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.8s ease; -webkit-transform:translate3d(0,183px,0) rotate(0.001deg)}
.design_3 .img_3{ width:319px; height:94px; float:left; position:absolute; margin:752px 0 0 786px; z-index:15; opacity:0; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.2s ease; transform:translate3d(0,80px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.2s ease; -webkit-transform:translate3d(0,80px,0) rotate(0.001deg)}
.design_3 .img_4{ width:839px; height:343px; float:left; position:absolute; overflow:hidden; margin:756px 0 0 541px; z-index:10; opacity:0; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.2s ease; transform:translate3d(0,-130px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995),opacity 0.2s ease; -webkit-transform:translate3d(0,-130px,0) rotate(0.001deg)}
.design_3 .img_4_1{ width:839px; height:286px; float:left; position:absolute; z-index:10}
.design_3 .img_4_2{ width:816px; height:279px; float:left; position:absolute; z-index:5; margin:64px 0 0 11px; opacity:0; transition:opacity 0.5s ease; -webkit-transition:opacity 0.5s ease}
.design_3 .img_5{ width:1001px; height:343px; float:left; position:absolute; margin:808px 0 0 460px; z-index:5; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); transform:translate3d(0,-186px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); -webkit-transform:translate3d(0,-186px,0) rotate(0.001deg)}
.design_3 .img_6{ width:145px; height:85px; float:left; position:absolute; margin:1132px 0 0 518px; z-index:1; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); transform:translate3d(0,-245px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); -webkit-transform:translate3d(0,-245px,0) rotate(0.001deg)}
.design_3 .img_7{ width:145px; height:85px; float:left; position:absolute; margin:1132px 0 0 1267px; z-index:1; transition:transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); transform:translate3d(0,-245px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 2.5s cubic-bezier(0.49, 0, 0.09, 0.995); -webkit-transform:translate3d(0,-245px,0) rotate(0.001deg)}

.design_4{ width:100%; min-width:930px; height:720px; float:left; overflow:hidden; position:relative}
.design_4 .tit_box{ width:750px; float:left; position:absolute; margin:68px 0 0 585px; z-index:10; padding-top:30px}
.design_4 .t_1{ width:750px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; text-align:center; position:absolute}
.design_4 .t_2{ width:750px; float:left; color:#333; line-height:30px; text-align:center; font-size:18px; position:absolute; margin-top:70px}
.design_4 .box{ width:1920px; height:720px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.design_4 .img_1{ width:251px; height:244px; float:left; position:absolute; margin:306px 0 0 588px}
.design_4 .electricity{ width:420px; float:left; position:absolute; margin:298px 0 0 934px}
.design_4 .et_1{ width:420px; color:#333; float:left; line-height:30px; font-size:14px}
.design_4 .durationBox{ width:393px; height:48px; float:left; overflow:hidden; margin-bottom:20px}
.design_4 .duration_1, .design_4 .duration_2{ width:380px; height:48px; float:left; background-color:#5ED85A; line-height:48px; color:#fff; text-align:right; font-size:14px; padding-right:13px; transition:transform 0.8s ease; transform:translate3d(-100%,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 0.8s ease; -webkit-transform:translate3d(-100%,0,0) rotate(0.001deg)}
.design_4 .duration_2{ width:254px; background-color:#E4E4E4; color:#666}

.design_5{ width:100%; min-width:930px; height:750px; float:left; overflow:hidden; position:relative}
.design_5 .tit_box{ width:730px; float:left; position:absolute; margin:102px 0 0 595px; z-index:10; padding-top:30px}
.design_5 .t_1{ width:730px; height:50px; font-size:44px; line-height:50px; color:#fff; float:left; overflow:hidden; text-align:center; position:absolute}
.design_5 .t_2{ width:730px; float:left; color:#c4c4c4; text-align:center; line-height:30px; font-size:18px; position:absolute; margin-top:70px}
.design_5 .box{ width:1920px; height:750px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px; background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_miniDesign_5_bg.jpg) no-repeat}
.design_5 .performance{ width:440px; float:left; position:absolute; margin:357px 0 0 941px}
.design_5 .pt_1{ width:420px; color:#979797; float:left; line-height:30px; font-size:14px}
.design_5 .performanceBox{ width:436px; height:48px; float:left; overflow:hidden; margin-bottom:20px}
.design_5 .performance_1, .design_5 .performance_2{ width:423px; height:48px; float:left; background-color:rgba(25,199,20,0.7); line-height:48px; color:#fff; text-align:right; font-size:14px; padding-right:13px; transition:transform 0.8s ease; transform:translate3d(-100%,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 0.8s ease; -webkit-transform:translate3d(-100%,0,0) rotate(0.001deg)}
.design_5 .performance_2{ width:103px; background-color:#E4E4E4; color:#666}

.design_6{ width:100%; min-width:930px; height:872px; float:left; overflow:hidden; position:relative}
.design_6 .box{ width:1920px; height:872px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.design_6 .imgBox{ width:954px; height:862px; overflow:hidden; position:relative; background-color:#FAFAFA; margin-top:10px}
.design_6 .img_1{ width:251px; height:749px; float:left; position:absolute; margin:122px 0 0 334px; opacity:0; transition:transform 1.5s ease, opacity 1.5s ease; transform:translate3d(0,80px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.5s ease, opacity 1.5s ease; -webkit-transform:translate3d(0,80px,0) rotate(0.001deg)}
.design_6 .img_2{ width:259px; height:749px; float:left; position:absolute; margin:123px 0 0 383px; opacity:0; transition:transform 1.5s ease, opacity 1.5s ease; transform:translate3d(0,80px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.5s ease, opacity 1.5s ease; -webkit-transform:translate3d(0,80px,0) rotate(0.001deg)}