

.color_bg{ background:url(https://images.iyunmai.com/home/m/static/images/color_bg.png) no-repeat; background-size:420px 5000px}

.hqMini_1{ width:100%; float:left; position:relative; overflow:hidden}
.hqMini_1 .t_1{ width:268px; height:62px; float:left; overflow:hidden; position:absolute; margin:462px 0 0 296px; opacity:0; transition:opacity 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95)}
.hqMini_1 .t_2{ width:220px; height:80px; float:left; border:2px solid #25C998; border-radius:6px; color:#10A570; text-align:center; line-height:80px; font-size:34px; overflow:hidden; position:absolute; margin:565px 0 0 320px; opacity:0; transition:opacity 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95); z-index:10}
.hqMini_1 .t_3{ width:100%; float:left; text-align:center; position:relative; margin:685px 0 0 0; font-size:32px; color:#666; line-height:48px; opacity:0; transition:opacity 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition:opacity 1.5s cubic-bezier(0.445, 0.05, 0.55, 0.95)}
.hqMini_1 .box{ width:860px; position:relative; left:50%; margin:0 0 0 -430px}
.hqMini_1 .img_1{ width:796px; height:298px; float:left; position:absolute; overflow:hidden; margin-left:30px; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(0,-10px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(0,-10px,0) rotate(0.001deg)}
.hqMini_1 .img_2{ width:390px; height:548px; float:left; position:absolute; overflow:hidden; margin-top:49px; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(-10px,10px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(-10px,10px,0) rotate(0.001deg)}
.hqMini_1 .img_3{ width:408px; height:598px; float:left; position:absolute; overflow:hidden; margin:25px 0 0 452px; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(10px,10px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(10px,10px,0) rotate(0.001deg)}

.hqMini_2{ width:100%; float:left; overflow:hidden; position:relative; padding-top:176px}
.hqMini_2 .box{ width:860px; height:400px; float:left; position:relative; left:50%; margin:0 0 0 -430px}
.hqMini_2 .img_1{ width:680px; height:262px; float:left; position:absolute; overflow:hidden; margin-left:90px; z-index:10; opacity:0; transition:transform 1.4s ease-out,opacity 1.4s ease-out; transform:translate3d(0,-20px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.4s ease-out,opacity 1.4s ease-out; -webkit-transform:translate3d(0,-20px,0) rotate(0.001deg)}

.hqMini_3{ width:100%; float:left; overflow:hidden; position:relative; padding-bottom:110px}
.hqMini_3 .titBox{ width:100%; float:left; overflow:hidden; position:relative}
.hqMini_3 .t_1{ font-size:50px; line-height:66px; padding-bottom:25px}
.hqMini_3 .t_2{ font-size:32px; line-height:50px; color:#666}
.hqMini_3 ul{ width:720px; float:left; position:relative; left:50%; margin:50px 0 0 -360px}
.hqMini_3 li{ width:240px; height:40px; float:left; padding-top:130px; margin-bottom:82px; overflow:hidden; font-size:28px; line-height:40px; text-align:center; color:#323232; background:url(../images/body_bg.png) no-repeat center 0}
.hqMini_3 .icon_2{ background-position:center -200px}
.hqMini_3 .icon_3{ background-position:center -400px}
.hqMini_3 .icon_4{ background-position:center -600px}
.hqMini_3 .icon_5{ background-position:center -800px}
.hqMini_3 .icon_6{ background-position:center -1000px}
.hqMini_3 .icon_7{ background-position:center -1200px}
.hqMini_3 .icon_8{ background-position:center -1400px}
.hqMini_3 .icon_9{ background-position:center -1600px}
.hqMini_3 .icon_10{ background-position:center -1800px}
.hqMini_3 .icon_11{ background-position:center -2000px}
.hqMini_3 .icon_12{ background-position:center -2200px}
.hqMini_3 .icon_13{ background-position:center -2400px}
.hqMini_3 .icon_14{ background-position:center -2600px}
.hqMini_3 .icon_15{ background-position:center -2800px}
.hqMini_3 .icon_16{ background-position:center -3000px}
.hqMini_3 .icon_17{ background-position:center -3200px}


.hqMini_4{ width:100%; float:left; position:relative; overflow:hidden; padding-bottom:160px}
.hqMini_4 .titBox{ width:100%; float:left; overflow:hidden; position:relative; padding-bottom:120px}
.hqMini_4 .t_1{ font-size:50px; line-height:66px; padding-bottom:25px}
.hqMini_4 .t_2{ font-size:32px; line-height:50px; color:#666; padding-bottom:20px}
.hqMini_4 .t_4{ font-size:20px; line-height:20px; color:#888; padding:50px 0 10px; opacity:0; transition:transform 1.2s ease-out,opacity 1.2s ease-out; transform:translate3d(20px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.2s ease-out,opacity 1.2s ease-out; -webkit-transform:translate3d(20px,0,0) rotate(0.001deg)}
.hqMini_4 .t_5{ font-size:45px; line-height:60px; color:#41b46f; opacity:0; transition:transform 1.2s ease-out,opacity 1.2s ease-out; transform:translate3d(20px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.2s ease-out,opacity 1.2s ease-out; -webkit-transform:translate3d(20px,0,0) rotate(0.001deg)}
.hqMini_4 .box{ width:860px; position:relative; left:50%; margin:120px 0 0 -430px}
.hqMini_4 .imgBox{ width:520px; height:1100px; overflow:hidden; position:relative; float:left; margin:0 0 0 170px}
.hqMini_4 .imgBox img{ width:520px; height:1100px; position:absolute}
.hqMini_4 ul{ width:536px; float:left; margin:0 0 0 162px; position:relative}
.hqMini_4 li{ width:84px; height:84px; float:left; border:1px solid rgba(45,199,153,0); border-radius:50%; overflow:hidden; margin:0 24px}
.hqMini_4 li a{ width:64px; height:64px; float:left; margin:10px}
.hqMini_4 li .co_1{ background-position:-200px 0}
.hqMini_4 li .co_2{ background-position:-200px -100px}
.hqMini_4 li .co_3{ background-position:-200px -200px}
.hqMini_4 li .co_4{ background-position:-200px -300px}
.hqMini_4 .cur{ border:1px solid rgba(45,199,153,1)}

.hqMini_5{ width:100%; float:left; position:relative; overflow:hidden; background-color:#F7F7F7; padding:110px 0}
.hqMini_5 .titBox, .hqMini_5 .titBox_2, .hqMini_5 .titBox_3{ width:100%; float:left; overflow:hidden; position:relative; padding-bottom:70px}
.hqMini_5 .titBox_2{ padding-top:50px}
.hqMini_5 .titBox_3{ padding:50px 0 0 0}
.hqMini_5 .t_1{ font-size:50px; line-height:66px; padding-bottom:25px}
.hqMini_5 .t_2{ font-size:32px; line-height:50px; color:#666; padding-bottom:20px}
.hqMini_5 .t_3{ font-size:32px; line-height:50px; color:#10a570; margin-bottom:90px; display:block}
.hqMini_5 .t_4{ font-size:36px; line-height:50px; color:#221e1f; padding-bottom:20px}
.hqMini_5 .box, .hqMini_5 .box_2{ width:860px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px}
.hqMini_5 .box_2{ height:292px}
.hqMini_5 .img{ width:734px; height:464px; float:right; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(40px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(40px,0,0) rotate(0.001deg)}
.hqMini_5 .tag_1, .hqMini_5 .tag_2, .hqMini_5 .tag_3, .hqMini_5 .tag_4{ width:250px; height:250px; float:left; background:url(https://images.iyunmai.com/home/m/static/images/title/haoqingMini_tit_5.png) no-repeat; position:absolute; margin-left:135px; opacity:0; transition:transform 1.2s ease-out,opacity 1.2s ease-out; transform:translate3d(20px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1.2s ease-out,opacity 1.2s ease-out; -webkit-transform:translate3d(20px,0,0) rotate(0.001deg)}
.hqMini_5 .tag_2{ background-position:-340px 0; margin-left:475px}
.hqMini_5 .tag_3{ background-position:0 -280px}
.hqMini_5 .tag_4{ background-position:-340px -280px; margin-left:475px}

.hqMini_6{ width:100%; float:left; position:relative; overflow:hidden; padding-top:110px}
.hqMini_6 .titBox{ width:100%; float:left; overflow:hidden; position:relative}
.hqMini_6 .t_1{ font-size:50px; line-height:66px; padding-bottom:25px}
.hqMini_6 .t_2{ font-size:32px; line-height:50px; color:#666; padding-bottom:20px}
.hqMini_6 .t_3{ font-size:32px; line-height:50px; color:#10a570; margin-bottom:60px; display:block}
.hqMini_6 .box{ width:860px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px}
.hqMini_6 .img{ width:762px; height:878px; float:left; margin-left:-20px; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(-20px,0,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(-20px,0,0) rotate(0.001deg)}

.hqMini_7{ width:100%; float:left; position:relative; overflow:hidden; padding-top:110px}
.hqMini_7 .titBox{ width:100%; float:left; overflow:hidden; position:relative}
.hqMini_7 .t_1{ font-size:50px; line-height:66px; padding-bottom:30px}
.hqMini_7 .t_2{ font-size:32px; line-height:50px; color:#666; padding-bottom:15px}
.hqMini_7 .t_3{ font-size:32px; line-height:50px; color:#10a570; margin-bottom:70px; display:block}
.hqMini_7 .box{ width:860px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px}
.hqMini_7 .img{ width:752px; height:620px; float:left; margin-left:-30px; opacity:0; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(0,40px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(0,40px,0) rotate(0.001deg)}

.hqMini_8{ width:100%; height:996px; float:left; position:relative; overflow:hidden; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingMini/hero_haoqingMini_8.jpg) no-repeat center 0; padding-top:110px}
.hqMini_8 .titBox{ width:100%; float:left; overflow:hidden; position:relative; color:#fff}
.hqMini_8 .t_1{ width:100%; position:relative; height:66px; overflow:hidden; font-size:50px; line-height:66px; margin-bottom:30px}
.hqMini_8 .t_2{ width:100%; position:relative; height:250px; overflow:hidden; font-size:32px; line-height:50px}
.hqMini_8 .box{ width:860px; height:740px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px}
.hqMini_8 ul{ width:592px; float:left; position:absolute; margin:70px 0 0 134px; z-index:10; background-color:#000}
.hqMini_8 li{ width:94px; float:left; position:absolute; opacity:1}
.hqMini_8 .li_2{ margin-left:126px}
.hqMini_8 .li_3{ margin-left:252px}
.hqMini_8 .li_4{ margin-left:378px}
.hqMini_8 .li_5{ margin-left:496px}
.hqMini_8 li .name{ width:88px; line-height:48px; float:left; text-align:center; font-size:28px; color:rgba(255,255,255,1); transition:color .3s ease; -webkit-transition:color .3s ease}
.hqMini_8 li .imgBox{ width:88px; height:88px; 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:88px; height:88px; float:left; background-color:#fff; overflow:hidden}
.hqMini_8 li img{ width:88px; height:88px; border-radius:15px; opacity:0.7; transform:translate(0,10px) rotate(0.001deg); transition:transform .3s ease,opacity .3s ease; -webkit-transform:translate(0,10px) rotate(0.001deg); -webkit-transition:-webkit-transform .3s ease,opacity .3s ease;}
.hqMini_8 .cur .imgBox{ border:3px solid rgba(16,165,112,1)}
.hqMini_8 .cur .img img{ opacity:1; transform:translate(0,0) rotate(0.001deg); -webkit-transform:translate(0,0) rotate(0.001deg)}

.meter{ width:180px; height:58px; float:left; position:absolute; z-index:10; margin:357px 0 0 361px; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingMini/meter_mini.png) no-repeat 102px -1048px}
.meter .num_1, .meter .num_2, .meter .num_3, .meter .num_4{ width:37px; height:58px; float:left; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingMini/meter_mini.png) no-repeat}
.meter .num_2{ margin-left:-1px}
.meter .num_3{ margin-left:-1px}
.meter .num_4{ width:33; height:52; margin:6px 0 0 0; background-position:-100px 0}

.town{ width:100%; float:left; overflow:hidden; position:relative}
.town .con_box{ width:100%; float:left; overflow:hidden; position:relative}
.town .tit_1{ font-size:48px; color:#000; line-height:64px; padding-bottom:14px}
.town .tit_2{ font-size:32px; color:#323232; line-height:44px}
.town_img_m{ width:100%; height:389px; float:left; overflow:hidden; display:none; position:relative; z-index:99}
.town_img_m .img_box{ width:430px; height:389px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -215px; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingColor/hero_haoqingColor_7.png) no-repeat; background-size:430px 389px}
.town_img{ width:100%; height:778px; float:left; overflow:hidden; display:block; position:relative; z-index:99}
.town_img .img_box{ width:860px; height:778px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingColor/hero_haoqingColor_7.png) no-repeat; background-size:860px 778px}

.town .car_1{ width:10px; height:20px; float:left; background-color:#328BDE; position:absolute; animation:car_1 9s linear infinite; -webkit-animation:car_1 9s linear infinite}
.town .car_2{ width:10px; height:20px; float:left; background-color:#EC7845; position:absolute; animation:car_2 15s linear infinite; -webkit-animation:car_2 15s linear infinite}
.town .car_3{ width:10px; height:20px; float:left; background-color:#FFB43D; position:absolute; animation:car_3 11s linear infinite; -webkit-animation:car_3 11s linear infinite}
.town .car_4{ width:20px; height:10px; float:left; background-color:#EC7845; position:absolute; animation:car_4 19s linear infinite; -webkit-animation:car_4 19s linear infinite}
.town .car_5{ width:20px; height:10px; float:left; background-color:#328BDE; position:absolute; animation:car_5 7s linear infinite; -webkit-animation:car_5 7s linear infinite}
.town .cloud{ width:420px; height:244px; float:left; background-position:0 -2000px; position:absolute; z-index:999; animation:cloud 60s linear infinite; -webkit-animation:cloud 60s linear infinite}
.town .cloud_bg{ width:420px; height:304px; float:left; background-position:0 -2250px; position:absolute; z-index:998; animation:cloud_bg 60s linear infinite; -webkit-animation:cloud_bg 60s linear infinite}

@keyframes car_1{ 0%{ transform:translate(186px,800px) rotate(-5deg)} 100%{ transform:translate(105px,-60px) rotate(-5deg)}}
@keyframes car_2{ 0%{ transform:translate(366px,-60px) rotate(-5deg)} 100%{ transform:translate(446px,800px) rotate(-5deg)}}
@keyframes car_3{ 0%{ transform:translate(676px,800px) rotate(-5deg)} 100%{ transform:translate(596px,-60px) rotate(-5deg)}}
@keyframes car_4{ 0%{ transform:translate(-60px,700px) rotate(-30deg)} 100%{ transform:translate(920px,96px) rotate(-30deg)}}
@keyframes car_5{ 0%{ transform:translate(920px,76px) rotate(-30deg)} 100%{ transform:translate(-60px,680px) rotate(-30deg)}}
@keyframes cloud{ 0%{ transform:translate(120px,240px) rotate(-1deg)} 25%{ transform:translate(220px,180px) rotate(-1deg)} 50%{ transform:translate(320px,240px) rotate(-1deg)} 75%{ transform:translate(220px,180px) rotate(-1deg)} 100%{ transform:translate(120px,240px) rotate(-1deg)}}
@keyframes cloud_bg{ 0%{ transform:translate(80px,240px) rotate(-1deg) scale(1,1)} 25%{ transform:translate(220px,180px) rotate(-1deg) scale(0.9,0.9)} 50%{ transform:translate(360px,240px) rotate(-1deg) scale(1,1)} 75%{ transform:translate(220px,180px) rotate(-1deg) scale(0.9,0.9)} 100%{ transform:translate(80px,240px) rotate(-1deg) scale(1,1)}}

@-webkit-keyframes car_1{ 0%{ -webkit-transform:translate(196px,800px) rotate(-5deg)} 100%{ -webkit-transform:translate(106px,-60px) rotate(-5deg)}}
@-webkit-keyframes car_2{ 0%{ -webkit-transform:translate(366px,-60px) rotate(-5deg)} 100%{ -webkit-transform:translate(446px,800px) rotate(-5deg)}}
@-webkit-keyframes car_3{ 0%{ -webkit-transform:translate(676px,800px) rotate(-5deg)} 100%{ -webkit-transform:translate(596px,-60px) rotate(-5deg)}}
@-webkit-keyframes car_4{ 0%{ -webkit-transform:translate(-60px,700px) rotate(-30deg)} 100%{ -webkit-transform:translate(920px,96px) rotate(-30deg)}}
@-webkit-keyframes car_5{ 0%{ -webkit-transform:translate(920px,76px) rotate(-30deg)} 100%{ -webkit-transform:translate(-60px,680px) rotate(-30deg)}}
@-webkit-keyframes cloud{ 0%{ -webkit-transform:translate(120px,240px) rotate(-1deg)} 25%{ -webkit-transform:translate(220px,180px) rotate(-1deg)} 50%{ -webkit-transform:translate(320px,240px) rotate(-1deg)} 75%{ -webkit-transform:translate(220px,180px) rotate(-1deg)} 100%{ -webkit-transform:translate(120px,240px) rotate(-1deg)}}
@-webkit-keyframes cloud_bg{ 0%{ -webkit-transform:translate(80px,240px) rotate(-1deg) scale(1,1)} 25%{ -webkit-transform:translate(220px,180px) rotate(-1deg) scale(0.9,0.9)} 50%{ -webkit-transform:translate(360px,240px) rotate(-1deg) scale(1,1)} 75%{ -webkit-transform:translate(220px,180px) rotate(-1deg) scale(0.9,0.9)} 100%{ -webkit-transform:translate(80px,240px) rotate(-1deg) scale(1,1)}}

	
.town .car_m_1{ width:5px; height:10px; float:left; background-color:#328BDE; position:absolute; animation:car_m_1 9s linear infinite; -webkit-animation:car_m_1 9s linear infinite}
.town .car_m_2{ width:5px; height:10px; float:left; background-color:#EC7845; position:absolute; animation:car_m_2 15s linear infinite; -webkit-animation:car_m_2 15s linear infinite}
.town .car_m_3{ width:5px; height:10px; float:left; background-color:#FFB43D; position:absolute; animation:car_m_3 11s linear infinite; -webkit-animation:car_m_3 11s linear infinite}
.town .car_m_4{ width:10px; height:5px; float:left; background-color:#EC7845; position:absolute; animation:car_m_4 19s linear infinite; -webkit-animation:car_m_4 19s linear infinite}
.town .car_m_5{ width:10px; height:5px; float:left; background-color:#328BDE; position:absolute; animation:car_m_5 7s linear infinite; -webkit-animation:car_m_5 7s linear infinite}
.town .cloud_m{ width:210px; height:122px; float:left; background-position:0 -1000px; position:absolute; z-index:999; animation:cloud_m 60s linear infinite; -webkit-animation:cloud_m 60s linear infinite}
.town .cloud_m_bg{ width:210px; height:152px; float:left; background-position:0 -1125px; position:absolute; z-index:998; animation:cloud_m_bg 60s linear infinite; -webkit-animation:cloud_m_bg 60s linear infinite}

@keyframes car_m_1{ 0%{ transform:translate(93px,400px) rotate(-5deg)} 100%{ transform:translate(53px,-30px) rotate(-5deg)}}
@keyframes car_m_2{ 0%{ transform:translate(183px,-30px) rotate(-5deg)} 100%{ transform:translate(223px,400px) rotate(-5deg)}}
@keyframes car_m_3{ 0%{ transform:translate(338px,400px) rotate(-5deg)} 100%{ transform:translate(298px,-30px) rotate(-5deg)}}
@keyframes car_m_4{ 0%{ transform:translate(-30px,350px) rotate(-30deg)} 100%{ transform:translate(460px,48px) rotate(-30deg)}}
@keyframes car_m_5{ 0%{ transform:translate(460px,38px) rotate(-30deg)} 100%{ transform:translate(-30px,340px) rotate(-30deg)}}
@keyframes cloud_m{ 0%{ transform:translate(60px,120px) rotate(-1deg)} 25%{ transform:translate(110px,90px) rotate(-1deg)} 50%{ transform:translate(160px,120px) rotate(-1deg)} 75%{ transform:translate(110px,90px) rotate(-1deg)} 100%{ transform:translate(60px,120px) rotate(-1deg)}}
@keyframes cloud_m_bg{ 0%{ transform:translate(40px,120px) rotate(-1deg) scale(1,1)} 25%{ transform:translate(110px,90px) rotate(-1deg) scale(0.9,0.9)} 50%{ transform:translate(180px,120px) rotate(-1deg) scale(1,1)} 75%{ transform:translate(110px,90px) rotate(-1deg) scale(0.9,0.9)} 100%{ transform:translate(40px,120px) rotate(-1deg) scale(1,1)}}

@-webkit-keyframes car_m_1{ 0%{ -webkit-transform:translate(93px,400px) rotate(-5deg)} 100%{ -webkit-transform:translate(53px,-30px) rotate(-5deg)}}
@-webkit-keyframes car_m_2{ 0%{ -webkit-transform:translate(183px,-30px) rotate(-5deg)} 100%{ -webkit-transform:translate(223px,400px) rotate(-5deg)}}
@-webkit-keyframes car_m_3{ 0%{ -webkit-transform:translate(338px,400px) rotate(-5deg)} 100%{ -webkit-transform:translate(298px,-30px) rotate(-5deg)}}
@-webkit-keyframes car_m_4{ 0%{ -webkit-transform:translate(-30px,350px) rotate(-30deg)} 100%{ -webkit-transform:translate(460px,48px) rotate(-30deg)}}
@-webkit-keyframes car_m_5{ 0%{ -webkit-transform:translate(460px,38px) rotate(-30deg)} 100%{ -webkit-transform:translate(-30px,340px) rotate(-30deg)}}
@-webkit-keyframes cloud_m{ 0%{ -webkit-transform:translate(60px,120px) rotate(-1deg)} 25%{ -webkit-transform:translate(110px,90px) rotate(-1deg)} 50%{ -webkit-transform:translate(160px,120px) rotate(-1deg)} 75%{ -webkit-transform:translate(110px,90px) rotate(-1deg)} 100%{ -webkit-transform:translate(60px,120px) rotate(-1deg)}}
@-webkit-keyframes cloud_m_bg{ 0%{ -webkit-transform:translate(40px,120px) rotate(-1deg) scale(1,1)} 25%{ -webkit-transform:translate(110px,90px) rotate(-1deg) scale(0.9,0.9)} 50%{ -webkit-transform:translate(180px,120px) rotate(-1deg) scale(1,1)} 75%{ -webkit-transform:translate(110px,90px) rotate(-1deg) scale(0.9,0.9)} 100%{ -webkit-transform:translate(40px,120px) rotate(-1deg) scale(1,1)}}

.hqMini_9{ width:100%; float:left; position:relative; overflow:hidden; padding-top:110px}
.hqMini_9 .titBox{ width:100%; float:left; overflow:hidden; position:relative}
.hqMini_9 .t_1{ font-size:50px; line-height:66px; padding-bottom:30px}
.hqMini_9 .t_2{ font-size:32px; line-height:50px; color:#666; padding-bottom:15px}
.hqMini_9 .t_3{ font-size:32px; line-height:50px; color:#10a570; margin-bottom:90px; display:block}
.hqMini_9 .box{ width:860px; position:relative; overflow:hidden; left:50%; margin:0 0 0 -430px}
.hqMini_9 .img{ width:350px; height:682px; float:left; margin-left:255px; transition:transform 1s ease-out,opacity 1s ease-out; transform:translate3d(0,80px,0) rotate(0.001deg); -webkit-transition:-webkit-transform 1s ease-out,opacity 1s ease-out; -webkit-transform:translate3d(0,80px,0) rotate(0.001deg)}

.hqMini_app{ width:100%; height:1262px; float:left; position:relative; overflow:hidden; background:url(https://images.iyunmai.com/home/m/static/images/hero/haoqingMini/hero_haoqingMini_app_bg.jpg) no-repeat center 0}
.hqMini_app .titBox{ width:100%; float:left; overflow:hidden; position:relative; padding-top:104px}
.hqMini_app .t_1{ width:100%; position:relative; height:66px; overflow:hidden; font-size:50px; line-height:66px; margin-bottom:33px; color:#000}
.hqMini_app .t_2{ width:100%; position:relative; overflow:hidden; font-size:32px; line-height:50px; color:#666; padding-bottom:17px}
.hqMini_app .t_3{ font-size:32px; line-height:50px; color:#10a570; display:block}

.hqMini_buy{ width:100%; float:left; text-align:center}
.hqMini_buy img{ max-width: 100%; margin-bottom:10px}

@media only screen and (max-width : 600px){
	.color_bg{ background-size:210px 2500px}
	
	.hqMini_1 .t_1{ width:134px; height:31px; margin:231px 0 0 148px}
	.hqMini_1 .t_1 img{ width:134px; height:31px}
	
	.hqMini_1 .t_2{ width:110px; height:40px; border:1px solid #25C998; margin:283px 0 0 160px; border-radius:3px; line-height:40px; font-size:17px}
	
	.hqMini_1 .t_3{ margin:348px 0 0 0; font-size:16px; line-height:24px}
	.hqMini_1 .box{ width:430px; margin:0 0 0 -215px}
	.hqMini_1 .img_1{ width:398px; height:149px; margin-left:15px}
	.hqMini_1 .img_2{ width:195px; height:274px; margin-top:25px}
	.hqMini_1 .img_3{ width:204px; height:299px; margin:13px 0 0 226px}
	
	.hqMini_2{ padding-top:88px}
	.hqMini_2 .box{ width:430px; height:200px; margin:0 0 0 -215px}
	.hqMini_2 .img_1{ width:340px; height:131px; margin-left:45px}
	
	.hqMini_3{ padding-bottom:55px}
	.hqMini_3 .t_1{ font-size:25px; line-height:33px; padding:12px 0}
	.hqMini_3 .t_2{ font-size:16px; line-height:25px}
	.hqMini_3 ul{ width:360px; margin:25px 0 0 -180px}
	.hqMini_3 li{ width:120px; height:20px; padding-top:65px; margin-bottom:41px; font-size:14px; line-height:20px; background-size:50px 1700px; background-position:center 0}
	.hqMini_3 .icon_2{ background-position:center -100px}
	.hqMini_3 .icon_3{ background-position:center -200px}
	.hqMini_3 .icon_4{ background-position:center -300px}
	.hqMini_3 .icon_5{ background-position:center -400px}
	.hqMini_3 .icon_6{ background-position:center -500px}
	.hqMini_3 .icon_7{ background-position:center -600px}
	.hqMini_3 .icon_8{ background-position:center -700px}
	.hqMini_3 .icon_9{ background-position:center -800px}
	.hqMini_3 .icon_10{ background-position:center -900px}
	.hqMini_3 .icon_11{ background-position:center -1000px}
	.hqMini_3 .icon_12{ background-position:center -1100px}
	.hqMini_3 .icon_13{ background-position:center -1200px}
	.hqMini_3 .icon_14{ background-position:center -1300px}
	.hqMini_3 .icon_15{ background-position:center -1400px}
	.hqMini_3 .icon_16{ background-position:center -1500px}
	.hqMini_3 .icon_17{ background-position:center -1600px}
	
	.hqMini_4{ padding-bottom:80px}
	.hqMini_4 .titBox{ padding-bottom:60px}
	.hqMini_4 .t_1{ font-size:25px; line-height:33px; padding-bottom:12px}
	.hqMini_4 .t_2{ font-size:16px; line-height:25px; padding-bottom:10px}
	.hqMini_4 .t_4{ font-size:10px; line-height:10px; padding:25px 0 5px}
	.hqMini_4 .t_5{ font-size:22px; line-height:30px}
	.hqMini_4 .t_5 img{ width:210px; height:24px}
	.hqMini_4 .box{ width:430px; margin:60px 0 0 -215px}
	.hqMini_4 .imgBox{ width:260px; height:550px; margin:0 0 0 85px}
	.hqMini_4 .imgBox img{ width:260px; height:550px}
	.hqMini_4 ul{ width:272px; margin:0 0 0 79px}
	.hqMini_4 li{ width:42px; height:42px; margin:0 12px}
	.hqMini_4 li a{ width:32px; height:32px; margin:5px}
	.hqMini_4 li .co_1{ background-position:-100px 0}
	.hqMini_4 li .co_2{ background-position:-100px -50px}
	.hqMini_4 li .co_3{ background-position:-100px -100px}
	.hqMini_4 li .co_4{ background-position:-100px -150px}
	
	.hqMini_5{ padding:55px 0}
	.hqMini_5 .titBox, .hqMini_5 .titBox_2, .hqMini_5 .titBox_3{ padding-bottom:35px}
	.hqMini_5 .titBox_2{ padding-top:25px}
	.hqMini_5 .titBox_3{ padding:25px 0 0 0}
	.hqMini_5 .t_1{ font-size:25px; line-height:33px; padding-bottom:12px}
	.hqMini_5 .t_2{ font-size:16px; line-height:25px; padding-bottom:10px}
	.hqMini_5 .t_3{ font-size:16px; line-height:25px; margin-bottom:45px}
	.hqMini_5 .t_4{ font-size:18px; line-height:25px; padding-bottom:10px}
	.hqMini_5 .box, .hqMini_5 .box_2{ width:430px; margin:0 0 0 -215px}
	.hqMini_5 .box_2{ height:146px}
	.hqMini_5 .img{ width:367px; height:232px}
	.hqMini_5 .tag_1, .hqMini_5 .tag_2, .hqMini_5 .tag_3, .hqMini_5 .tag_4{ width:125px; height:125px; background-size:295px 265px; margin-left:68px}
	.hqMini_5 .tag_2{ background-position:-170px 0; margin-left:236px}
	.hqMini_5 .tag_3{ background-position:0 -140px}
	.hqMini_5 .tag_4{ background-position:-170px -140px; margin-left:236px}
	
	.hqMini_6{ padding-top:55px}
	.hqMini_6 .t_1{ font-size:25px; line-height:33px; padding-bottom:12px}
	.hqMini_6 .t_2{ font-size:16px; line-height:25px; padding-bottom:10px}
	.hqMini_6 .t_3{ font-size:16px; line-height:25px; margin-bottom:30px}
	.hqMini_6 .box{ width:430px; margin:0 0 0 -215px}
	.hqMini_6 .img{ width:381px; height:439px; margin-left:-10px}
	
	.hqMini_7{ padding-top:55px}
	.hqMini_7 .t_1{ font-size:25px; line-height:33px; padding-bottom:15px}
	.hqMini_7 .t_2{ font-size:16px; line-height:25px; padding-bottom:8px}
	.hqMini_7 .t_3{ font-size:16px; line-height:25px; margin-bottom:35px}
	.hqMini_7 .box{ width:430px; margin:0 0 0 -215px}
	.hqMini_7 .img{ width:376px; height:310px; margin-left:-15px}
	
	.hqMini_8{ height:498px; background-size:430px 552px; padding-top:55px}
	.hqMini_8 .t_1{ font-size:20px; height:33px; line-height:33px; margin-bottom:15px}
	.hqMini_8 .t_2{ font-size:16px; height:125px; line-height:25px}
	.hqMini_8 .box{ width:430px; height:370px; margin:0 0 0 -215px}
	.hqMini_8 ul{ width:296px; margin:35px 0 0 67px}
	.hqMini_8 li{ width:47px}
	.hqMini_8 .li_2{ margin-left:63px}
	.hqMini_8 .li_3{ margin-left:126px}
	.hqMini_8 .li_4{ margin-left:189px}
	.hqMini_8 .li_5{ margin-left:248px}
	.hqMini_8 li .name{ width:44px; line-height:24px; font-size:14px}
	.hqMini_8 li .imgBox{ width:44px; height:44px; border-radius:9px; border:2px solid rgba(16,165,112,0)}
	.hqMini_8 li .img{ width:44px; height:44px}
	.hqMini_8 li img{ width:44px; height:44px; border-radius:8px}
	.hqMini_8 .cur .imgBox{ border:2px solid rgba(16,165,112,1)}
	
	.meter{ width:90px; height:29px; margin:179px 0 0 180px; background-size:67px 554px; background-position:51px -524px}
	.meter .num_1, .meter .num_2, .meter .num_3, .meter .num_4{ width:19px; height:29px; float:left; background-size:67px 554px}
	.meter .num_2{ margin-left:-1px}
	.meter .num_3{ margin-left:-1px}
	.meter .num_4{ width:17px; height:26px; margin:3px 0 0 0; background-position:-50px 0}
	
	.town .tit_1{ font-size:24px; line-height:32px; padding-bottom:7px}
	.town .tit_2{ font-size:16px; line-height:22px}
	.town_img_m{ display:block}
	.town_img{ display:none}
	
	.hqMini_9{ padding-top:55px}
	.hqMini_9 .t_1{ font-size:25px; line-height:33px; padding-bottom:15px}
	.hqMini_9 .t_2{ font-size:16px; line-height:25px; padding-bottom:8px}
	.hqMini_9 .t_3{ font-size:16px; line-height:25px; margin-bottom:45px}
	.hqMini_9 .box{ width:430px; margin:0 0 0 -215px}
	.hqMini_9 .img{ width:175px; height:341px; margin-left:128px}
	
	.hqMini_app{ height:631px; background-size:430px 631px}
	.hqMini_app .titBox{ padding-top:52px}
	.hqMini_app .t_1{ height:33px; font-size:25px; line-height:33px; margin-bottom:17px}
	.hqMini_app .t_2{ font-size:16px; line-height:25px; padding-bottom:9px}
	.hqMini_app .t_3{ font-size:16px; line-height:25px}
}


@media only screen and (max-width : 320px){
	.hqMini_2 .img_1{ width:300px; height:115px; margin-left:65px}
	
	.hqMini_5 .tag_1, .hqMini_5 .tag_2, .hqMini_5 .tag_3, .hqMini_5 .tag_4{ margin-left:78px}
	.hqMini_5 .tag_2{ margin-left:226px}
	.hqMini_5 .tag_4{ margin-left:226px}
	
	.hqMini_6 .img{ margin-left:-30px}
}