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

.meter_mini_bg{ background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/meter_mini.png) no-repeat}

.hqMini_1{ width:100%; min-width:930px; height:1280px; float:left; overflow:hidden; margin-top:-159px; position:relative}
.hqMini_1 .tit_box{ width:720px; height:480px; float:left; position:absolute; margin:844px 0 0 600px; z-index:10; opacity:0}
.hqMini_1 .t_1{ width:100%; height:64px; float:left; overflow:hidden; text-align:center; position:absolute}
.hqMini_1 .t_2{ width:254px; height:58px; float:left; overflow:hidden; position:absolute; border:1px solid #10A570; font-size:36px; color:#10A570; border-radius:5px; text-align:center; line-height:58px; margin:107px 0 0 232px}
.hqMini_1 .t_2:hover{ background-color:#24C189; color:#fff}
.hqMini_1 .t_2:active{ background-color:#1CB07B; color:#fff}
.hqMini_1 .t_3{ width:100%; float:left; font-size:26px; color:#666; line-height:30px; text-align:center; overflow:hidden; position:absolute; margin-top:223px}
.hqMini_1 .box{ width:1920px; height:1284px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_1 .img_1{ width:1661px; height:560px; float:left; position:absolute; margin-left:115px; opacity:0}
.hqMini_1 .img_2{ width:867px; height:1198px; float:left; position:absolute; margin-top:31px; opacity:0}
.hqMini_1 .img_3{ width:927px; height:1295px; float:left; position:absolute; margin:-12px 0 0 993px; opacity:0}

@keyframes tit_1_1{ 0%{ opacity:0} 100%{ opacity:1}}
@keyframes img_1_1{ 0%{ opacity:0; transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_1_2{ 0%{ opacity:0; transform:translate(-30px,30px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_1_3{ 0%{ opacity:0; transform:translate(30px,30px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes tit_1_1{ 0%{ opacity:0} 100%{ opacity:1}}
@-webkit-keyframes img_1_1{ 0%{ opacity:0; -webkit-transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_1_2{ 0%{ opacity:0; -webkit-transform:translate(-30px,30px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_1_3{ 0%{ opacity:0; -webkit-transform:translate(30px,30px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.hqMini_2{ width:100%; min-width:930px; height:680px; float:left; overflow:hidden; position:relative}
.hqMini_2 .box{ width:1920px; height:680px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_2 .imgBox{ width:1150px; height:600px; float:left; overflow:hidden; margin-left:385px; position:relative}
.hqMini_2 .imgBox img{ position:absolute; top:0; left:0; opacity:0}

.hqMini_3{ width:100%; min-width:930px; height:1100px; float:left; overflow:hidden; position:relative}
.hqMini_3 .box{ width:1920px; height:1100px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_3 .tit_box{ width:700px; height:180px; float:left; position:absolute; margin:0 0 0 610px; padding-top:20px; z-index:10; background-color:#fff; opacity:0}
.hqMini_3 .t_1{ width:700px; height:60px; float:left; font-size:44px; line-height:50px; text-align:center; overflow:hidden; position:absolute}
.hqMini_3 .t_2{ width:700px; height:62px; float:left; font-size:20px; color:#333; text-align:center; line-height:30px; overflow:hidden; position:absolute; margin-top:70px}
.hqMini_3 ul{ width:1229px; height:626px; overflow:hidden; float:left; position:absolute; margin:272px 0 0 345px}
.hqMini_3 li{ width:204px; height:208px; overflow:hidden; cursor:pointer; float:left; border-bottom:1px solid rgba(229,229,229,0); border-right:1px solid rgba(229,229,229,0); transition:border-color 0.6s linear; -webkit-transition:border-color 0.6s linear}
.hqMini_3 li:hover .icon_box{ background-color:rgba(250,250,250,1)}
.hqMini_3 .no_bo{ border-right:none}
.hqMini_3 .icon_box{ width:196px; height:70px; padding-top:130px; margin:4px; float:left; position:absolute; opacity:0; line-height:24px; font-size:16px; color:#333; text-align:center; background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_haoqingMini_3_bg.png) no-repeat; background-color:rgba(250,250,250,0); transition:background-color .3s ease; -webkit-transition:background-color .3s ease}
.hqMini_3 .icon_1{ background-position:center 40px}
.hqMini_3 .icon_2{ background-position:center -160px}
.hqMini_3 .icon_3{ background-position:center -360px}
.hqMini_3 .icon_4{ background-position:center -560px}
.hqMini_3 .icon_5{ background-position:center -760px}
.hqMini_3 .icon_6{ background-position:center -960px}
.hqMini_3 .icon_7{ background-position:center -1160px}
.hqMini_3 .icon_8{ background-position:center -1360px}
.hqMini_3 .icon_9{ background-position:center -1560px}
.hqMini_3 .icon_10{ background-position:center -1760px}
.hqMini_3 .icon_11{ background-position:center -1960px}
.hqMini_3 .icon_12{ background-position:center -2160px}
.hqMini_3 .icon_13{ background-position:center -2360px}
.hqMini_3 .icon_14{ background-position:center -2560px}
.hqMini_3 .icon_15{ background-position:center -2760px}
.hqMini_3 .icon_16{ background-position:center -2960px}
.hqMini_3 .icon_17{ background-position:center -3160px}
.hqMini_3 .icon_18{ background-position:center -3302px; cursor:default}
.hqMini_3 li:hover .icon_18{ background-color:rgba(250,250,250,0)}

@keyframes tit_3_1{ 0%{ opacity:0; transform:translate(0,100px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_3_1{ 0%{ opacity:0; transform:scale(0.6,0.6) rotate(0.0001deg)} 100%{ opacity:1; transform:scale(1,1) rotate(0.0001deg)}}

@-webkit-keyframes tit_3_1{ 0%{ opacity:0; -webkit-transform:translate(0,100px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_3_1{ 0%{ opacity:0; -webkit-transform:scale(0.6,0.6) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:scale(1,1) rotate(0.0001deg)}}

.elementMask{ width:100%; height:100%; position:fixed; top:0; left:0; background-color:rgba(0,0,0,0.7); z-index:9999998; opacity:0; display:none; transition:opacity .3s ease; -webkit-transition:opacity .3s ease}
.elementMask .close{ width:50px; height:50px; float:left; position:absolute; top:40px; right:40px; z-index:20; background-position:0 -2400px}
.elementBox{ width:430px; height:560px; float:left; position:absolute; top:50%; left:50%; margin:-280px 0 0 -215px}
.elementBox .imgBox{ width:380px; height:560px; overflow:hidden; float:left; position:absolute; margin:0 0 0 25px; z-index:10}
.elementBox .imgBox ul{ width:8000px; height:560px; float:left; overflow:hidden; transition:transform .3s ease; transform:translate(0,0) rotate(0.001deg); -webkit-transition:-webkit-transform .3s ease; -webkit-transform:translate(0,0) rotate(0.001deg)}
.elementBox .imgBox li{ width:380px; height:560px; position:relative; overflow:hidden; float:left}
.elementBox .imgBox li .t_1{ width:100%; float:left; line-height:32px; font-size:24px; color:#fff; text-align:center; top:152px; left:0; position:absolute; z-index:10}
.elementBox .imgBox li .t_2{ width:250px; float:left; line-height:26px; font-size:16px; color:#fff; text-align:center; top:214px; left:65px; position:absolute; z-index:10}
.elementBox .imgBox img{ position:absolute; opacity:1; margin:7px 0 0 30px}
.elementBox .prev, .elementBox .next{ width:32px; height:80px; margin:240px 0 0 0; cursor:default; float:left; position:absolute; opacity:0; background-position:0 -5746px; transition:opacity .5s ease-out; -webkit-transition:opacity .5s ease-out; z-index:20}
.elementBox .next{ opacity:1; cursor:pointer; margin-left:398px; background-position:0 -5846px}
.elementBox .ele_nav{ width:374px; margin:540px 0 0 28px; float:left; position:absolute; z-index:20}
.elementBox .ele_nav a{ width:8px; height:8px; background-color:#fff; overflow:hidden; float:left; margin:1px 7px 0; border-radius:50px; transition:background-color .3s ease; -webkit-transition:background-color .3s ease}
.elementBox .ele_nav a:hover, .elementBox .ele_nav .cur{ width:10px; height:10px; margin:0 6px; background-color:#25C998}
.element_cen{ margin:-280px 0 0 -215px; top:50%; left:50%}
.element_tran{ transition:transform .4s ease,opacity .2s ease; -webkit-transition:-webkit-transform .4s ease,opacity .2s ease}

.hqMini_4{ width:100%; min-width:930px; height:1480px; float:left; overflow:hidden; position:relative}
.hqMini_4 .box{ width:1920px; height:1500px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_4 .imgBox{ width:662px; height:1476px; float:left; position:absolute; margin:0 0 0 343px; opacity:0}
.hqMini_4 .imgBox img{ opacity:0; position:absolute}
.hqMini_4 .tit_box{ width:484px; height:1000px; float:left; position:absolute; margin:0 0 0 1086px; background-color:#fff; transform:translate(0,0) rotate(0.0001deg)}
.hqMini_4 .t_1, .hqMini_4 .t_2{ width:484px; height:95px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute; opacity:0}
.hqMini_4 .t_2{ font-size:18px; color:#333; line-height:30px; margin-top:116px}
.hqMini_4 .t_3, .hqMini_4 .t_4{ width:484px; height:18px; float:left; font-size:16px; color:#666; line-height:18px; overflow:hidden; position:absolute; margin-top:282px; opacity:0}
.hqMini_4 .t_4{ margin-top:414px}
.hqMini_4 .t_5{ width:484px; height:53px; float:left; overflow:hidden; position:absolute; margin-top:303px}
.hqMini_4 .t_5_1, .hqMini_4 .t_5_2, .hqMini_4 .t_5_3, .hqMini_4 .t_5_4, .hqMini_4 .t_5_5, .hqMini_4 .t_5_6, .hqMini_4 .t_5_7, .hqMini_4 .t_5_8, .hqMini_4 .t_5_9, .hqMini_4 .t_5_10, .hqMini_4 .t_6_1, .hqMini_4 .t_6_2, .hqMini_4 .t_6_3, .hqMini_4 .t_6_4, .hqMini_4 .t_6_5, .hqMini_4 .t_6_6, .hqMini_4 .t_6_7, .hqMini_4 .t_6_8, .hqMini_4 .t_6_9, .hqMini_4 .t_6_10{ width:46px; height:53px; float:left; background:url(https://images.iyunmai.com/home/static/images/title/light-mini/haoqingMini_tit_4.png) no-repeat 0 -120px; position:absolute; transform:rotateX(90deg); -webkit-transform:rotateX(90deg)}
.hqMini_4 .t_5_2{ width:13px; background-position:-69px -120px; margin-left:69px}
.hqMini_4 .t_5_3{ width:48px; background-position:-99px -120px; margin-left:99px}
.hqMini_4 .t_5_4{ width:48px; background-position:-149px -120px; margin-left:149px}
.hqMini_4 .t_5_5{ width:12px; background-position:-215px -120px; margin-left:215px}
.hqMini_4 .t_5_6{ width:12px; background-position:-251px -120px; margin-left:251px}
.hqMini_4 .t_5_7{ width:20px; background-position:-302px -120px; margin-left:302px}
.hqMini_4 .t_5_8{ width:24px; background-position:-324px -120px; margin-left:324px}
.hqMini_4 .t_5_9{ width:12px; background-position:-355px -120px; margin-left:355px}
.hqMini_4 .t_5_10{ width:48px; background-position:-403px -120px; margin-left:403px}
.hqMini_4 .t_6_1{ width:28px; background-position:0 -200px}
.hqMini_4 .t_6_2{ width:29px; background-position:-37px -200px; margin-left:37px}
.hqMini_4 .t_6_3{ width:30px; background-position:-72px -200px; margin-left:72px}
.hqMini_4 .t_6_4{ width:27px; background-position:-114px -200px; margin-left:114px}
.hqMini_4 .t_6_5{ width:28px; background-position:-153px -200px; margin-left:153px}
.hqMini_4 .t_6_6{ width:29px; background-position:-190px -200px; margin-left:190px}
.hqMini_4 .t_6_7{ width:30px; background-position:-225px -200px; margin-left:225px}
.hqMini_4 .t_6_8{ width:27px; background-position:-267px -200px; margin-left:267px}
.hqMini_4 .t_6_9{ width:16px; background-position:-305px -200px; margin-left:305px}
.hqMini_4 .t_6_10{ width:30px; background-position:-331px -200px; margin-left:331px}
.hqMini_4 .t_6{ width:484px; height:52px; float:left; overflow:hidden; position:absolute; margin-top:446px}
.hqMini_4 .t_7{ width:484px; height:331px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute; margin-top:580px; opacity:0}
.hqMini_4 .t_7 img{ margin-top:-278px}
.hqMini_4 .t_8{ width:484px; float:left; font-size:18px; color:#333; line-height:28px; overflow:hidden; position:absolute; margin-top:713px; opacity:0}
.hqMini_4 .t_9{ width:484px; height:18px; float:left; font-size:16px; color:#333; line-height:18px; overflow:hidden; position:absolute; margin-top:864px; opacity:0}
.hqMini_4 .chage{ width:484px; float:left; position:absolute; margin-top:890px; opacity:0}
.hqMini_4 .chage li{ width:48px; height:48px; float:left; border-radius:50%; border:1px solid rgba(45,199,153,0); margin-right:25px; cursor:pointer; transition:border-color .3s ease; -webkit-transition:border-color .3s ease}
.hqMini_4 .chage .icon_1{ background-position:4px -4296px}
.hqMini_4 .chage .icon_2{ background-position:4px -4396px}
.hqMini_4 .chage .icon_3{ background-position:4px -4446px}
.hqMini_4 .chage .icon_4{ background-position:4px -4496px}
.hqMini_4 .chage li:hover, .hqMini_4 .chage .cur{ border:1px solid rgba(45,199,153,1)}

@keyframes tit_4_1{ 0%{ opacity:0; transform:translate(50px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes tit_4_2{ 0%{ opacity:0} 100%{ opacity:1}}
@keyframes tit_4_3{ 0%{ transform:rotateX(90deg)} 100%{ transform:rotateX(0)}}
@keyframes img_4_1{ 0%{ opacity:0; transform:translate(-50px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes tit_4_1{ 0%{ opacity:0; -webkit-transform:translate(50px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes tit_4_2{ 0%{ opacity:0} 100%{ opacity:1}}
@-webkit-keyframes tit_4_3{ 0%{ -webkit-transform:rotateX(90deg)} 100%{ -webkit-transform:rotateX(0)}}
@-webkit-keyframes img_4_1{ 0%{ opacity:0; -webkit-transform:translate(-50px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.hqMini_5{ width:100%; min-width:930px; height:1020px; float:left; overflow:hidden; position:relative}
.hqMini_5 .tit_box{ width:1145px; height:420px; float:left; position:absolute; margin:0 0 0 388px; z-index:10; padding-top:20px; background-color:#fff}
.hqMini_5 .w_430, .hqMini_5 .w_710{ width:430px; height:150px; float:left; overflow:hidden; position:relative; opacity:0}
.hqMini_5 .w_710{ width:710px}
.hqMini_5 .t_1{ width:480px; height:40px; font-size:32px; line-height:40px; float:left; overflow:hidden; position:absolute}
.hqMini_5 .t_2{ width:480px; float:left; font-size:18px; color:#333; line-height:30px; overflow:hidden; position:absolute; margin-top:55px}
.hqMini_5 .t_2 a{ color:#10a570; padding-right:15px; background-position:right -2794px}
.hqMini_5 .t_2 a:hover{ text-decoration:underline}

.hqMini_5 .tag_1, .hqMini_5 .tag_2, .hqMini_5 .tag_3, .hqMini_5 .tag_4{ width:198px; height:198px; float:left; overflow:hidden; position:absolute; margin:213px 0 0 0; opacity:0; left:0}
.hqMini_5 .tag_1 img{ margin:-60px 0 0 0}
.hqMini_5 .tag_2{ margin:213px 0 0 238px}
.hqMini_5 .tag_2 img{ margin:-60px 0 0 -238px}
.hqMini_5 .tag_3{ margin:213px 0 0 709px}
.hqMini_5 .tag_3 img{ margin:-60px 0 0 -709px}
.hqMini_5 .tag_4{ margin:213px 0 0 947px}
.hqMini_5 .tag_4 img{ margin:-60px 0 0 -947px}
.hqMini_5 .box{ width:1920px; height:1000px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_5 .img_1{ width:970px; height:384px; float:left; position:absolute; margin-top:543px; opacity:0}
.hqMini_5 .img_2{ width:956px; height:384px; float:left; position:absolute; margin:543px 0 0 964px; opacity:0}

@keyframes tit_5_1{ 0%{ opacity:0; transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_5_1{ 0%{ opacity:0; transform:translate(100px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_5_2{ 0%{ opacity:0; transform:translate(-100px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_5_3{ 0%{ opacity:0; transform:translate(100px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes tit_5_1{ 0%{ opacity:0; -webkit-transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_5_1{ 0%{ opacity:0; -webkit-transform:translate(100px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_5_2{ 0%{ opacity:0; -webkit-transform:translate(-100px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_5_3{ 0%{ opacity:0; -webkit-transform:translate(100px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.hqMini_6{ width:100%; min-width:930px; height:1200px; float:left; overflow:hidden; position:relative}
.hqMini_6 .tit_box{ width:670px; height:174px; float:left; position:absolute; margin:0 0 0 625px; z-index:10}
.hqMini_6 .t_1{ width:670px; height:50px; font-size:44px; line-height:50px; float:left; text-align:center; overflow:hidden; position:absolute}
.hqMini_6 .t_2{ width:670px; float:left; font-size:18px; color:#333; line-height:30px; text-align:center; overflow:hidden; position:absolute; margin-top:72px}
.hqMini_6 .t_2 span{ display:block}
.hqMini_6 .t_2 a{ color:#10a570; padding-right:13px; background-position:right -2794px}
.hqMini_6 .t_2 a:hover{ text-decoration:underline}
.hqMini_6 .box{ width:1920px; height:1200px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_6 .img_1{ width:1167px; height:646px; float:left; position:absolute; margin:325px 0 0 377px; transition:transform .2s ease-out; -webkit-transition:-webkit-transform .2s ease-out}

.hqMini_7{ width:100%; min-width:930px; height:750px; float:left; overflow:hidden; position:relative; transform:translate(0,0) rotate(0.0001deg)}
.hqMini_7 .tit_box{ width:450px; float:left; position:absolute; margin:170px 0 0 954px; z-index:10; transform:translate(60px,0) rotate(0.0001deg); -webkit-transform:translate(60px,0) rotate(0.0001deg)}
.hqMini_7 .t_1{ width:450px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute}
.hqMini_7 .t_2{ width:450px; float:left; color:#666; line-height:30px; font-size:18px; position:absolute; margin-top:71px}
.hqMini_7 .t_2 span{ margin-top:10px; display:block}
.hqMini_7 .t_2 a{ color:#10a570; padding-right:13px; background-position:right -2794px}
.hqMini_7 .t_2 a:hover{ text-decoration:underline}
.hqMini_7 .box{ width:1920px; height:750px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_7 .img_1{ width:862px; height:750px; float:left; position:absolute; transform:translate(-50px,0) rotate(0.0001deg); -webkit-transform:translate(-50px,0) rotate(0.0001deg)}
.hqMini_7 .img_1 img{ position:absolute}
.hqMini_7 .waterlines{ width:10px; height:10px; position:absolute; background-color:rgba(16,165,112,0.05); opacity:0; margin:277px 0 0 569px; float:left; border:3px solid rgba(16,165,112,0.1); border-radius:50%; transform:rotate(0.001deg); -webkit-transform:rotate(0.001deg)}

@keyframes tit_7_1{ 0%{ transform:translate(60px,0) rotate(0.0001deg)} 100%{ transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_7_1{ 0%{ transform:translate(-50px,0) rotate(0.0001deg)} 100%{ transform:translate(0,0) rotate(0.0001deg)}}
@keyframes hqMini_wl_7_1{ 0%{ opacity:0} 1%{ opacity:1} 40%{ opacity:0.8;} 50%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}
@keyframes hqMini_wl_7_2{ 0%{ opacity:0} 15%{ width:10px; height:10px; opacity:0; margin:277px 0 0 569px} 16%{ opacity:1} 55%{ opacity:0.8} 65%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}
@keyframes hqMini_wl_7_3{ 0%{ opacity:0} 30%{ width:10px; height:10px; opacity:0; margin:277px 0 0 569px} 31%{ opacity:1} 70%{ opacity:0.8} 80%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}

@-webkit-keyframes tit_7_1{ 0%{ -webkit-transform:translate(60px,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_7_1{ 0%{ -webkit-transform:translate(-50px,0) rotate(0.0001deg)} 100%{ -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes hqMini_wl_7_1{ 0%{ opacity:0} 1%{ opacity:1} 40%{ opacity:0.8;} 50%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}
@-webkit-keyframes hqMini_wl_7_2{ 0%{ opacity:0} 15%{ width:10px; height:10px; opacity:0; margin:277px 0 0 569px} 16%{ opacity:1} 55%{ opacity:0.8} 65%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}
@-webkit-keyframes hqMini_wl_7_3{ 0%{ opacity:0} 30%{ width:10px; height:10px; opacity:0; margin:277px 0 0 569px} 31%{ opacity:1} 70%{ opacity:0.8} 80%{ width:500px; height:500px; opacity:0; margin:32px 0 0 324px} 100%{ opacity:0}}

.hqMini_8{ width:100%; min-width:930px; height:1096px; float:left; overflow:hidden; position:relative}
.hqMini_8 .tit_box{ width:800px; height:202px; float:left; color:#fff; position:absolute; margin:90px 0 0 560px; z-index:10; padding-top:30px}
.hqMini_8 .t_1{ width:100%; height:50px; font-size:44px; line-height:50px; float:left; text-align:center; overflow:hidden; position:absolute}
.hqMini_8 .t_2{ width:100%; float:left; font-size:18px; line-height:30px; text-align:center; overflow:hidden; position:absolute; margin-top:70px}
.hqMini_8 .box{ width:1920px; height:1096px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px; transform:translate(0,0) rotate(0.001deg)}
.hqMini_8 .box_bg{ background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_haoqingMini_8_bg.jpg) no-repeat}
.hqMini_8 .img_1, .hqMini_8 .img_2{ width:1115px; height:658px; float:left; position:absolute; margin:438px 0 0 235px; z-index:20; transform:translate(0,658px) rotate(0.0001deg); -webkit-transform:translate(0,658px) rotate(0.0001deg)}
.hqMini_8 .img_1 img{ position:absolute; z-index:5}
.hqMini_8 .img_2{ width:353px; height:481px; margin:615px 0 0 1249px}
.hqMini_8 .img_2 img{ position:absolute; z-index:5}
.hqMini_8 ul{ width:670px; float:left; position:absolute; margin:317px 0 0 625px; z-index:10}
.hqMini_8 li{ width:106px; height:106px; overflow:hidden; float:left; cursor:pointer; position:absolute; opacity:0}
.hqMini_8 .li_2{ margin-left:134px}
.hqMini_8 .li_3{ margin-left:268px}
.hqMini_8 .li_4{ margin-left:402px}
.hqMini_8 .li_5{ margin-left:536px}
.hqMini_8 li .name{ width:100px; line-height:32px; float:left; text-align:center; font-size:14px; color:#fff}
.hqMini_8 li .imgBox{ width:100px; height:100px; float:left; border-radius:18px; overflow:hidden; border:3px solid rgba(16,165,112,0); cursor:pointer; transition:border-color .3s ease; -webkit-transition:border-color .3s ease}
.hqMini_8 li .img{ width:100px; height:100px; border-radius:15px; float:left; background-color:#fff; overflow:hidden}
.hqMini_8 li img{ border-radius:15px; opacity:0.7; transform:translate(0,20px) rotate(0.001deg); transition:transform .3s ease,opacity .3s ease; -webkit-transform:translate(0,20px) rotate(0.001deg); -webkit-transition:-webkit-transform .3s ease,opacity .3s ease}
.hqMini_8 li:hover .imgBox, .hqMini_8 .cur .imgBox{ border:3px solid rgba(16,165,112,1)}
.hqMini_8 li:hover .img img, .hqMini_8 .cur .img img{ opacity:1; transform:translate(0,0) rotate(0.001deg); -webkit-transform:translate(0,0) rotate(0.001deg)}

@keyframes img_8_1{ 0%{ opacity:0; transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}
@keyframes img_8_2{ 0%{ transform:translate(0,658px) rotate(0.0001deg)} 100%{ transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes img_8_1{ 0%{ opacity:0; -webkit-transform:translate(0,-30px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_8_2{ 0%{ -webkit-transform:translate(0,658px) rotate(0.0001deg)} 100%{ -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.meter{ width:235px; height:77px; float:left; position:absolute; z-index:10; margin:182px 0 0 422px; padding-left:29px; opacity:0}
.meter .num_1, .meter .num_2, .meter .num_3, .meter .num_4{ width:48px; height:77px; float:left}
.meter .num_2{ margin-left:-1px}
.meter .num_3{ margin-left:-1px}
.meter .num_4{ width:42px; height:68px; margin:10px 0 0 2px; background-position:-100px 0}

.medicalData{ width:235px; height:392px; float:left; position:absolute; z-index:10; margin:89px 0 0 59px}

body .meter{ background-position:0 -1098px}

@keyframes meter{ 0%{ opacity:0} 100%{ opacity:1}}

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

.hqMini_9{ width:100%; min-width:930px; height:745px; float:left; overflow:hidden; position:relative}
.hqMini_9 .tit_box{ width:500px; float:left; position:absolute; margin:252px 0 0 377px; z-index:10; padding-top:30px}
.hqMini_9 .t_1{ width:500px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute}
.hqMini_9 .t_2{ width:500px; float:left; color:#666; line-height:30px; font-size:18px; position:absolute; margin-top:80px}
.hqMini_9 .t_2 span{ margin-top:10px; display:block}
.hqMini_9 .t_2 a{ color:#10a570; padding-right:13px; background-position:right -2794px}
.hqMini_9 .t_2 a:hover{ text-decoration:underline}
.hqMini_9 .box{ width:1920px; height:745px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_9 .img_1{ width:347px; height:656px; float:left; position:absolute; margin:89px 0 0 1117px; opacity:0}

@keyframes img_9_1{ 0%{ opacity:0; transform:translate(-20px,400px) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes img_9_1{ 0%{ opacity:0; -webkit-transform:translate(-20px,400px) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.hqMini_app{ width:100%; min-width:930px; height:1122px; float:left; overflow:hidden; position:relative}
.hqMini_app .box{ width:1920px; height:1122px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_app .box_bg{ background:url(https://images.iyunmai.com/home/static/images/hero/haoqingMini/hero_haoqingMini_app.jpg) no-repeat}
.hqMini_app .tit_box{ width:640px; float:left; position:absolute; margin:100px 0 0 540px; padding-top:30px; z-index:10; opacity:0}
.hqMini_app .t_1{ width:640px; height:50px; font-size:44px; line-height:50px; float:left; overflow:hidden; position:absolute}
.hqMini_app .t_2{ width:640px; float:left; color:#333; line-height:30px; font-size:18px; position:absolute; margin-top:65px}
.hqMini_app .t_2 span{ margin-top:10px; display:block}
.hqMini_app .t_2 a{ color:#10a570; padding-right:13px; background-position:right -2794px}
.hqMini_app .t_2 a:hover{ text-decoration:underline}

@keyframes img_app{ 0%{ opacity:0; transform:translate(-50px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate(0,0) rotate(0.0001deg)}}

@-webkit-keyframes img_app{ 0%{ opacity:0; -webkit-transform:translate(-50px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate(0,0) rotate(0.0001deg)}}

.hqMini_buy{ width:100%; min-width:930px; height:360px; padding-bottom:10px; float:left; overflow:hidden; position:relative}
.hqMini_buy .box{ width:1920px; height:360px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px}
.hqMini_buy .imgBox{ width:954px; height:360px; overflow:hidden; position:relative; background-color:#FAFAFA}
.hqMini_buy .buyBox{ width:560px; padding:75px}
.hqMini_buy .buyBox img{ float:left; margin-right:40px}
.hqMini_buy .tit_box{ width:140px; float:left; margin-top:46px}
.hqMini_buy .t_1{ width:100%; line-height:30px; font-size:24px; color:#323232; padding-bottom:20px}
.hqMini_buy .buyhqBtn{ width:120px; line-height:42px; height:42px; text-align:center; border-radius:4px; background-color:#2DC799; color:#fff; font-size:16px; float:left}