body{font-family: "微软雅黑";} .ratio-img{ width: 100%;} .main { max-width: 1260px; width: 100%; margin: 0 auto; position: relative; z-index: 1000; } .main02{ margin-top:20px; margin-bottom: 50px;z-index: 99;} .hnt_01{ overflow: hidden; margin-bottom: 50px;} .hnt_01 .left{ float: left; width: 330px;} .hnt_01 .left h1{ height: 42px; line-height: 42px; padding: 0 36px; border: 2px solid #000; font-size: 18px; margin-bottom: 4px;} .hnt_01 .left ul li {padding: 0 36px;background: #8c8c91; margin-bottom: 4px; } .hnt_01 .left ul li a{ display: block; width: 100%; height: 45px; line-height: 45px; font-size: 18px; color: #fff;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .hnt_01 .left ul li.on{ background: #aace39;} .hnt_01 .left ul li.on a{ color: #383842;} .hnt_01 .left ul li:hover{ background: #aace39;} .hnt_01 .left ul li:hover a{ color: #383842;} .hnt_01 .right{ float:right; width: 905px; background: #f4f4f4;} .hnt_01 .right h1{ font-size: 36px; color: #383842; margin-bottom: 30px;} .hnt_01 .right .le{ width: 47%; float: left;} .hnt_01 .right .re{ width: 47%; float: left; margin-left: 4%; padding-top: 4%} .hnt_01 .right .re a.col_more001{background:url(../images/nav_active_bg1.png) no-repeat right center #aace3b; color: #fff; display: block; height: auto; width:85px; height:28px; line-height: 28px; margin: 11px 0 20px; padding: 0 28px;} .hnt_01 .right .re a.col_more001:hover{color: #fff;} .hnt_02 ul{overflow: hidden; margin: 0 -4px; margin-bottom: 20px; } .hnt_02 h1{ font-size: 24px; color: #383842; display: block; margin-bottom: 20px;} .hnt_02 li{ float: left; width: 24%; height: 35px; text-align: center; line-height: 35px; border: 1px solid #3e3e48; margin:0 4px; margin-bottom: 10px; position:relative;} .hnt_02 li em{ display:block; width:72px;height:20px; position:static; left:5px; top:7px; background:url(../images/hnt_02_dot01.png) no-repeat;} .hnt_02 li i{display:block;width:22px;height:30px; position:static; right:5px; top:3px;background:url(../images/hnt_02_dot02.png) no-repeat;} .hnt_02 li a{ margin: 0 30px 0 75px; color: #383842; display: block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .hnt_02 li:hover{ background: #aace39; border:1px solid #aace39;} .hnt_02 li:hover a{ font-weight: bold;} .hnt_03 h1{ margin-bottom: 30px;} .hnt_03 h1 span{ font-size: 18px; display: inline-block; height: 30px; line-height: 30px; border: 2px solid #383842; border-right:0; padding-right: 14px; padding-left: 25px;} .hnt_03 .left{ width: 518px; float: left;} .hnt_03 .right{ width:660px; float: right; padding: 50px 36px; border: 2px solid #000;} .hnt_03 .right p{ color: #626670; line-height:24px;} .hnt_03 .right .p_con{ height: 100%; overflow: hidden;} #recon_0{ height: 130px; line-height:24px; margin-bottom: 30px;} .htbock_02{ margin-bottom: 54px;} .htbock_02 ul{ overflow: hidden;} .htbock_02 .ht_hd{ background: url(../images/hbg_01.png) no-repeat 0 center; position: relative} .htbock_02 .ht_hd li{ float: left; height: 32px; line-height: 32px; font-size: 18px; color: #383842; width: 110px; padding-left: 24px; cursor: pointer;color: #383842;} .htbock_02 .ht_hd li:first-child + li{ padding-left: 10px; color: #fff;} .htbock_02 .ht_hd.on02{ background: url(../images/hbg_02.png) no-repeat 0 center;} .htbock_02 .ht_hd.on02 li{ color: #fff;} .htbock_02 .ht_hd.on02 li:first-child + li{ color: #383842;} .ht_bd li{ margin-bottom: 25px;} .ht_bd{ border: 2px solid #000; padding: 26px; margin-top: -2px; } .ht_bd .htb01.show{ display: block;} .ht_bd .htb01{ display: none;} .ht_bd h1{ font-size: 18px; margin-bottom: 15px;} .ht_bd p{ font-size: 14px; color: #626670; line-height: 24px;} .htbock_03{ margin-bottom: 50px;} .htbock_03 h1{ margin-bottom: 30px;} .htbock_03 h1 span{ font-size: 18px; display: inline-block; height: 30px; line-height: 30px; border: 2px solid #383842; border-right:0; padding-right: 14px; padding-left: 25px;} .htbock_03 ul{ overflow: hidden;} .htbock_03 li{ float: left; width: 20%; *margin-left: -1px; line-height:24px;} .htbock_03 li a{ color: #626670; display: block;} .htbock_03 li a p{text-decoration: underline;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; float: left; max-width: 100%;} .htbock_03 li a span{ margin-left: 10px;} .htbock_03 ul.hnt_ul li p{ max-width: 80%;} .htbock_04 ul{ margin: 0 -10px;} .htbock_04 li{ width: 25%;} .htbock_04 li a{ margin:0 10px; display: block; position: relative;} .htbock_04 p{ background: url(../images/lv.png) repeat; position: static; bottom: 0; left: 0; height: 40px; line-height: 40px; font-weight: bold; width:96%; color: #fff; padding: 0 2%; text-align: center;text-decoration: none !important;} .htbock_01{ overflow: hidden; background: #f4f4f4; margin-bottom: 60px;} .htbock_01 .left{ float: left; width: 50%;} .htbock_01 .right{ float: right; width: 46%; padding: 4% 2%; } .htbock_01 .right h1{ font-size: 36px; color: #383842; margin-bottom: 36px;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .htbock_01 .right .right_pcon{ font-size: 18px; color: #383842;} .right_pcon p{ margin-bottom: 20px;} .htbock_01 .right .fw a{ display: inline-block; width: 124px; height: 29px; line-height: 29px; background: url(../images/t_bg.png) no-repeat; color: #fff; margin-right: 20px;} .htbock_01 .right .fw span{float:left; padding: 0 10px;} .htbock_01 .right .fw i{ font-family: "宋体"; font-weight: bold; float: right; margin-right: 20px;} @media only screen and (max-width: 1366px) { .main02{ width: 1135px !important; margin:20px auto !important} .hnt_01 .left{ width: 20%;} .hnt_01 .right{ width: 78%} .hnt_03 .left{ width: 40%;} .hnt_03 .right{ width: 45%; padding: 50px 5%;} .hnt_01 .right .le{ width: 47%;} .hnt_01 .right .re{ width: 47%;} .hnt_01 .right h1{ margin-bottom: 20px; font-size: 30px;} .htbock_01 .left{ width: 47%;} .htbock_01 .right{ width:47%; padding:5% 2%;} .htbock_01 .right h1{ font-size: 30px; margin-bottom: 20px;} .hnt_02 li{width:32%;} } @media only screen and (max-width: 1280px) { .main02{ width:1049px !important; margin:20px auto !important} } @media only screen and (max-width: 1060px) { .main02{ width:96% !important; margin:20px auto !important} } @media only screen and (max-width:1024px) { .hnt_01 .left h1{ padding:0 10px; margin-bottom:14px; display: inline-block; height: 40px; line-height: 40px; font-size: 16px;} .hnt_01 .left{ width: 100%;} .hnt_01 .left ul{ overflow: hidden; margin: 0 -4px; margin-bottom: 20px;} .hnt_01 .left ul li{ width: 20%; float: left; padding: 0; background: none;} .hnt_01 .left ul li.on{ background: none} .hnt_01 .left ul li a{ padding:0 10px; width: auto;background: #8c8c91; margin: 0 4px;} .hnt_01 .left ul li.on a{background: #aace39;} .hnt_01 .left ul li:hover a{background: #aace39;} .hnt_01 .right{ width: 100%;} .hnt_01 .right .le{ width: 47%;} .hnt_01 .right .re{ width: 47%; margin: 0; *margin-left: -1px; padding: 1%;} .hnt_01 .right h1{ font-size: 24px;} .hnt_02 li{ width: 32%;} .hnt_01 .left ul li:hover{ background: none;} .htbock_03 ul.hnt_ul li{ width: 33.333%} .htbock_01 .right h1{ font-size: 18px; margin-bottom: 20px;} .htbock_01 .right .right_pcon{ font-size: 16px;} } @media only screen and (max-width:768px) { .hnt_02 li{ width:48.5%;} } @media only screen and (max-width:767px) { .hnt_01 .left ul li{ width: 33.333%;} .hnt_01 .left ul li a{ height: 40px; line-height: 40px; font-size: 14px;} .hnt_02 h1{ font-size: 16px; margin-bottom: 10px;} .hnt_02 li{ width:97%;} .hnt_03 h1 span{ font-size: 16px;} .htbock_04 li{ width: 50%; margin-bottom: 14px;} .ht_bd h1{ font-size: 14px; margin-bottom: 4px;} .htbock_02 .ht_hd li{ font-size: 16px;} .htbock_03 ul.hnt_ul li{ width: 50%} .ht_bd{ padding: 20px 10px;} .htbock_01 .left{ width: 100%;} .htbock_01 .right{ width: 96%; padding: 2%; padding-bottom: 20px;} } @media only screen and (max-width:640px) { .hnt_01 .left ul li{ width: 50%} .hnt_01 .right .le{ width: 100%;} .hnt_01 .right .re{ width: 96%; padding-top:16px; padding-bottom: 20px;} #recon_0{ height: auto;} .hnt_01 .right h1{ font-size: 16px; margin-bottom: 4px;} .hnt_03 .left{ width: 100%;} .hnt_03 .right{ width: 96%; padding: 2%;height: auto !important; border: none;} .htbock_03 h1 span{ font-size: 16px;} } @media only screen and (max-width:520px) { .htbock_03 li{ width: 100%} .htbock_04 ul{ margin: 0;} .htbock_04 li a{ margin: 0} .htbock_03 ul.hnt_ul li{ width: 100%} }