﻿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:absolute; left:5px; top:7px; background:url(../images/hnt_02_dot01.png) no-repeat;}
.hnt_02 li i{display:block;width:22px;height:30px; position:absolute; 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: absolute; 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%}


}






































