@import url("base.css")/*tpa=http://www.haozhuangji.com/statics/front/css/base.css*/;.bg-ico, .b1-txt .item4 a, .pic-box .pic-1 em, .pic-box .pic-2 em, .pic-box .pic-3 em, .col-title .more, .col-right .text-list li, .col-right .news-ico, .step h3, .download .btn-load a{background-image: url("../images/ico.png")/*tpa=http://www.haozhuangji.com/statics/front/images/ico.png*/;background-repeat: no-repeat;}
.page-ico, .news-list li .img-faq, .news-list li .time a em, .add-pos, .pic-box2 .pic-1 em, .pic-box2 .pic-2 em, .pic-box2 .pic-3 em, .pic-box2 .pic-4 em, .qq-box .btn-qq a{background-image: url("../images/page-ico.png")/*tpa=http://www.haozhuangji.com/statics/front/images/page-ico.png*/;background-repeat: no-repeat;}
.box-s, .news-box .vod img, .step .step-img img, .vod2 img{box-shadow: 0px 2px 2px #7f7f7f;*border: 1px solid #eae9e8;}
.head-box{height: 100px;}
.head-box .logo{float: left;width: 400px;height: 100px;background: url("../images/logo.jpg")/*tpa=http://www.haozhuangji.com/statics/front/images/logo.jpg*/ no-repeat;}
.head-box .nav{float: right;font-size: 16px;}
.head-box .nav li{float: left;padding: 0 2px;}
.head-box .nav li a{display: block;padding: 35px 18px 22px;border-top: 5px #fff solid;}
.head-box .nav li a:hover, .head-box .nav li a.cur{border-top: 5px #16a2eb solid;color: #16a2eb;}
.banner-index{height: 550px;background: #16a2eb;}
.b1-img{float: left;padding: 86px 100px 0 30px;}
.b1-img img{width: 520px;height: 360px;box-shadow: 0px 2px 2px #7f7f7f;}
.b1-txt{color: #fff;padding-top: 86px;float: left;}
.b1-txt .item1{font-size: 30px;}
.b1-txt .item2{font-size: 52px;padding: 25px 0;font-weight: bold;}
.b1-txt .item3{font-size: 25px;}
.b1-txt .item4{width: 272px;height: 124px;float: left;padding-top: 40px;}
.b1-txt .item4 a{display: block;width: 272px;height: 60px;background-position: 0 0;color: #2d6400;padding: 70px 0 0 30px;}
.b1-txt .item4 a:hover{background-position: -337px 0px;}
.bg-gray{background: #f7f7f1;}
.pic-box{padding: 45px 0 30px 28px;text-align: center;}
.pic-box .pic-1, .pic-box .pic-2, .pic-box .pic-3{display: inline-block;float: left;width: 276px;text-align: center;padding: 0 36px;}
.pic-box .pic-1 em, .pic-box .pic-2 em, .pic-box .pic-3 em{display: inline-block;width: 170px;height: 200px;}
.pic-box .pic-1 p, .pic-box .pic-2 p, .pic-box .pic-3 p{text-align: left;line-height: 26px;}
.pic-box .pic-1 em{background-position: 0 -156px;}
.pic-box .pic-2 em{background-position: -170px -156px;}
.pic-box .pic-3 em{background-position: -340px -156px;}
.news-box{padding: 30px 0;}
.news-box .text-list li{line-height: 28px;height: 28px;overflow: hidden;}
.news-box .col-left{width: 740px;height: 365px;padding: 10px 0;border-right: 1px solid #eae9e8;}
.news-box .col-left .text-list li{padding: 0px 25px 0 30px;}
.news-box .vod{width: 420px;}
.news-box .vod img{width: 420px;}
.col-title{padding-bottom: 20px;line-height: 30px;width: 100%;height: 30px;}
.col-title h3{font-size: 22px;font-weight: bold;float: left;}
.col-title .more{float: left;width: 30px;height: 30px;overflow: hidden;line-height: 50px;background-position: -646px 5px;text-indent: -999em;}
.col-right{width: 330px;padding: 10px 0;}
.col-right .pad{border-bottom: 1px solid #eae9e8;margin-bottom: 20px;height: 124px;}
.col-right .text-list{width: 210px;padding-bottom: 10px;}
.col-right .text-list li{padding-left: 12px;background-position: -646px -19px;font-size: 12px;line-height: 28px;height: 28px;overflow: hidden;}
.col-right .news-ico{width: 100px;height: 100px;background-position: -536px -156px;}
.col-right .news-ico.ico2{background-position: -536px -278px;}
.page-bg{height: 130px;overflow: hidden;text-align: center;background: #16a2eb url("../images/page-bg.jpg")/*tpa=http://www.haozhuangji.com/statics/front/images/page-bg.jpg*/ repeat;color: #fff;}
.page-bg h4, .page-bg em{display: inline-block;}
.page-bg h4{font-size: 92px;font-weight: bold;line-height: 130px;}
.page-bg em{padding-left: 5px;}
.step{padding: 64px 0;}
.step h3{width: 220px;height: 60px;background-position: 0 -380px;text-indent: -10em;overflow: hidden;}
.step .step-text{width: 550px;padding-top: 55px;}
.step .step-text p{font-size: 18px;line-height: 32px;padding-top: 24px;}
.step .step-img{width: 440px;}
.step .step-img img{width: 440px;}
.step-2 h3{background-position: 0 -440px;}
.step-3 h3{background-position: 0 -500px;}
.download{text-align: center;padding: 60px 0;font-size: 24px;color: #999;}
.download .btn-load{padding-top: 20px;}
.download .btn-load a{display: inline-block;width: 272px;height: 88px;text-indent: -99em;background-position: -270px -396px;}
.download .btn-load a:hover{background-position: -270px -492px;}
.foot-box{background: #444546;padding: 25px 0;font-size: 13px;overflow: hidden;}
.foot-box h5{color: #c1c1c1;font-size: 18px;padding-bottom: 15px;}
.foot-box .yq-link{width: 620px;}
.foot-box .yq-link .list a{float: left;padding-right: 20px;color: #999;line-height: 24px;}
.foot-box .yq-link .list a:hover{color: #2abf1d;}
.foot-box .share-box{width: 330px;}
.foot-box .yq-b{border-bottom: 1px #4d4e4f solid;padding-bottom: 20px;margin-bottom: 15px;}
.foot-box .add{text-align: center;color: #999;font-size: 12px;line-height: 24px;}
.foot-box .add a{padding: 0 5px;color: #999;line-height: 24px;}
.foot-box .add a:hover{color: #2abf1d;}
#scrollUp{padding: 30px 30px;background: url("../images/backtop.png")/*tpa=http://www.haozhuangji.com/statics/front/images/backtop.png*/ 0px -1px no-repeat;display: block;position: absolute;cursor: pointer;bottom: 30px;right: 25px;}
#scrollUp:hover{background: url("../images/backtop.png")/*tpa=http://www.haozhuangji.com/statics/front/images/backtop.png*/ 0px -72px no-repeat;}
.sub-nav{height: 35px;padding: 20px 0 10px;}
.sub-nav a{text-align: center;float: left;padding: 0 20px;line-height: 35px;margin-right: 10px;background: #f7f7f1;}
.sub-nav a.cur, .sub-nav a:hover{background: #2abf1d;color: #fff;}
.news-list{width: 100%;overflow: hidden;}
.news-list li{padding: 20px 0;border-bottom: 1px solid #eae9e8;height: 92px;transition: all 0.6s;}
.news-list li .img-div{float: left;width: 140px;height: 92px;margin-right: 20px;overflow: hidden;}
.news-list li .img-div img{width: 100%;min-height: 92px;}
.news-list li .img-faq{float: left;width: 40px;height: 32px;overflow: hidden;background-position: -173px 2px;}
.news-list li .txt{float: left;overflow: hidden;width: 750px;transition: all 0.6s;}
.news-list li .txt .name{font-size: 20px;height: 30px;line-height: 30px;overflow: hidden;width: 100%;display: block;}
.news-list li .txt p{color: #777;line-height: 24px;height: 48px;overflow: hidden;padding-top: 10px;}
.news-list li .time{float: right;width: 100px;text-align: center;color: #9e9e9e;display: block;padding: 7px 0;font-family: arial;padding-top: 20px;}
.news-list li .time a{display: inline-block;width: 50px;height: 50px;}
.news-list li .time a em{display: block;width: 50px;height: 50px;background-position: -78px 10px;transition: all 0.4s;}
.news-list li .time a:hover em{background-position: 6px 10px;}
.news-list li:hover{background: #f7f7f1;box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.08);}
.news-list li:hover .img-faq{background-position: -256px 2px;}
.news-list li:hover .txt{padding-left: 20px;}
.news-list li:hover .time a em{background-position: 6px 10px;}
.faq-list{padding-bottom: 20px;}
.faq-list li .txt{width: 850px;}
.page{margin-top: 10px;height: 34px;padding: 20px 0 30px;text-align: center;}
.page a{display: inline-block;margin-right: 5px;padding: 0 14px;height: 34px;background: #f7f7f1;color: #666;border-radius: 2px;line-height: 34px;}
.page a:hover, .page a.cur{background-color: #2abf1d;color: #fff;}
.page a.cur{color: #fff;}
.dt-box{padding: 20px 0;}
.dt-box .col-right{width: 270px;}
.dt-box .col-right .text-list{width: 100%;}
.col-left2{width: 760px;border-right: 1px solid #eae9e8;padding-right: 30px;}
.add-pos{line-height: 40px;height: 40px;border-bottom: 1px solid #eae9e8;font-size: 12px;color: #666;background-position: 0px -49px;padding-left: 15px;}
.add-pos a{color: #16a2eb;padding: 0 5px;}
.add-pos a:hover{text-decoration: underline;}
.article{padding: 20px 0;line-height: 28px;}
.article h1{font-size: 28px;color: #222;line-height: 60px;text-align: center;}
.article .time{color: #999;text-align: center;padding-bottom: 20px;}
.article .txt{min-height: 400px;color: #666;}
.mfzm{line-height: 40px;height: 40px;border-bottom: 1px solid #eae9e8;font-size: 24px;color: #222;}
.peo-num{font-size: 30px;text-align: center;padding-bottom: 30px;}
.peo-num em{color: #2abf1d;font-size: 45px;font-weight: bold;display: inline-block;border-bottom: 1px #2abf1d solid;padding: 0 5px;}
.pic-box2{padding: 45px 0 30px 50px;text-align: center;}
.pic-box2 .pad{padding: 20px 0;}
.pic-box2 .pic-1, .pic-box2 .pic-2, .pic-box2 .pic-3, .pic-box2 .pic-4{float: left;width: 190px;text-align: center;padding: 0 30px;}
.pic-box2 .pic-1 em, .pic-box2 .pic-2 em, .pic-box2 .pic-3 em, .pic-box2 .pic-4 em{display: inline-block;width: 130px;height: 130px;}
.pic-box2 .pic-1 h4, .pic-box2 .pic-2 h4, .pic-box2 .pic-3 h4, .pic-box2 .pic-4 h4{font-size: 24px;line-height: 60px;padding-top: 5px;}
.pic-box2 .pic-1 p, .pic-box2 .pic-2 p, .pic-box2 .pic-3 p, .pic-box2 .pic-4 p{text-align: left;line-height: 24px;color: #999;}
.pic-box2 .pic-1 em{background-position: 0 -90px;}
.pic-box2 .pic-2 em{background-position: -130px -90px;}
.pic-box2 .pic-3 em{background-position: -0px -220px;}
.pic-box2 .pic-4 em{background-position: -130px -220px;}
.pic-box2 .tip{color: #f00;text-align: center;padding-top: 10px;font-size: 13px;line-height: 24px;}
.vod2{padding-bottom: 30px;}
.vod2 img{width: 800px;}
.qq-box{text-align: center;font-size: 24px;color: #999;}
.qq-box .btn-qq{padding-top: 10px;}
.qq-box .btn-qq a{display: inline-block;width: 285px;height: 120px;text-indent: -99em;background-position: 0px -362px;}
.qq-box .btn-qq a:hover{background-position: 0px -495px;}
.faq{padding: 20px 0;}
/*404*/
.error-404{margin: 0 auto;width: 700px;padding-top: 180px;}
.error-404 .box{background: url("../images/404-bg.jpg")/*tpa=http://www.haozhuangji.com/statics/front/images/404-bg.jpg*/ no-repeat;width: 680px;height: 220px;}
.error-404 .btn{padding: 175px 0 0 268px;}
.error-404 .btn a{float: left;width: 115px;height: 34px;text-align: center;line-height: 34px;margin-right: 10px;color: #fff;border-radius: 18px;}
.error-404 .btn .gre{background: #5dbc0f;}
.error-404 .btn .gre:hover{background: #56ad0e;}
.error-404 .btn .org{background: #f86c21;}
.error-404 .btn .org:hover{background: #e7651f;}
/*# sourceMappingURL=css.css.map*/
.qr-qq{position: fixed;right:15px; bottom:50%;margin-bottom: -100px; z-index: 99; width:71px; height: 97px;background:  url("../images/qq.jpg")/*tpa=http://www.haozhuangji.com/statics/front/images/qq.jpg*/  no-repeat;}
.qr-qq a{display: block;width: 100%;height: 100%}
.qr-qq a:hover{box-shadow: 0px 1px 5px #888888}
/*2020-12-16-首页增加教程数据*/
.jc-box{padding: 20px 0;}
.jc-box .left-box{float: left;width: 730px;}
.jc-box .right-box{float: right;width: 320px;}
.dot-list2{overflow: hidden;padding-bottom: 20px; }
.dot-list2 ul{width: 110%;}
.dot-list2 li{  height:22px; line-height:22px; padding-bottom: 14px; overflow:hidden;float: left;width: 350px;padding-right: 30px;}
.dot-list2 li a{color:#333; font-size:14px;  overflow:hidden; display:inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 300px;
}
.dot-list2 li span{color:#999; font-size:13px; float:right;}
.dot-list2 li:before{content: " ";float:left; background:#bbbbbb;  width:3px; height:3px; margin:10px 10px 0 0;}

.r-list2{	width: 100%;overflow: hidden;}
.r-list2 em{float: left;width: 22px;height: 22px;font-family: arial;line-height: 20px;text-align: center;font-size: 14px;     color: #fff;margin-right: 10px;background:#c7c7c7;border-radius: 2px;}
.r-list2 em.nb1{background: #ff6b66;}
.r-list2 em.nb2{background: #ff8652;}
.r-list2 em.nb3{background: #ffa742;}

.r-list2 .link-name{height: 22px;line-height: 22px;overflow: hidden;display: block;display: block;overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;padding-right: 10px;*display:inline;*zoom:1;}
.r-list2 .inf{height: 64px;padding-right: 20px;}
.r-list2 .inf p{color: #999;line-height: 20px;overflow: hidden; height: 20px;}

.r-list2 li{padding: 0px 0 14px; }

.head-box .w{width: 1200px;}
.error-404 .btn a{float: left;width: 115px;height: 34px;text-align: center;line-height: 34px;margin-right: 10px;color: #fff;border-radius: 18px;background: #16a2eb;margin-bottom: 10px;}
.error-404 .btn a:hover{background: #2abf1d;}