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: 20px;}
.hnt_01 .left{ float: left; width: 285px;}
.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: #0066af;}
.hnt_01 .left ul li.on a{ color: #fff;}
.hnt_01 .left ul li:hover{ background: #0066af;}
.hnt_01 .left ul li:hover a{ color: #fff;}

.hnt_01 .right{ float:right; width: 955px; background: #f4f4f4;}
.hnt_01 .right h1{ font-size: 36px; color: #383842; margin-bottom: 16px;}
.hnt_01 .right .le{ width: 47%; float: left;}
.hnt_01 .right .re{ width: 47%; float: left; margin-left: 4%; padding-top: 2%;}




.hnt_01 .right .re a.col_more001{background:url(../images/nav_active_bg1.png) no-repeat right center #e60012;    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{ float: left; width: 98%; padding: 15px 0 10px 2%;}
.hnt_02 ul{overflow: hidden; margin: 0 0;   }
.hnt_02 h1{ font-size: 24px; color: #383842; display: block; margin-bottom: 20px;}
.hnt_02 li{ float: left; width: 23%; height: 35px; text-align: center; line-height: 35px; border: 1px solid #3e3e48; margin:0 0.8%; 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{   color: #383842; display: block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.hnt_02 li:hover{ background: #0066af; border:1px solid #0066af;}
.hnt_02 li:hover a{ font-weight: bold; color: #fff;}

.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: 33.33%; *margin-left: -1px; margin-top: 15px;  line-height:24px;}
.htbock_03 li img{ width:100%;}
.htbock_03 li a{ color: #626670; margin: 0 15px;  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%;}
/*产品二级页面下面产品 列表*/
.cpList li{ float: left; width: 22%; margin: 10px 1.5%; text-align: center;}

.cpList li img{ width: 100%; height: auto;}
.cpList li h3{ font-size: 16px; height: 32px; line-height: 32px; color: #333;}

.cpList li h5{ color:#686868; font-size:14px; height:24px; line-height:24px; font-weight:100; }
/* 产品切换css */
	.cpImg{ position: relative;   overflow: hidden; width: 600px; float: left; }
	.cpImg .bigImg{ height:400px; position: relative;width: 600px;}
	.cpImg .bigImg li img{ vertical-align:middle; width:600px; height:400px;   }
	.cpImg .bigImg  h4{ font-size: 14px; font-weight: bold; line-height: 33px; height: 33px; padding-right: 30px; overflow: hidden; text-align: left; }

	.cpImg .smallScroll{ height: 77px; margin-top: 6px;}
	.cpImg .sPrev,.cpImg .sNext{ float: left; display: block; width: 35px; height:100px; margin:5px 0; text-indent: -9999px; background: url(../images/fu_next.gif) no-repeat 0 0; }
	.cpImg .sNext{ background-position:-35px 0 ;}
	.cpImg .sPrev:hover{ background-position:0 -100px;}
	.cpImg .sNext:hover{ background-position: -35px -100px;}

	.cpImg .smallImg{ float:left;  margin: 10px 6px 0; display:inline; width: 518px; overflow: hidden;}
	.cpImg .smallImg ul{ height:87px;  width: 9999px; overflow: hidden; }
	.cpImg .smallImg li{ float: left; padding: 0 7px 0; width:115px; cursor:pointer;  display: inline;  }
	.cpImg .smallImg img{ border: 1px solid #dcdddd; width:113px; height:85px;  }
	.cpImg .smallImg .on img{ border-color: #1e50a2;}

	.cpImg .pageState{ position: absolute; top: 235px; right: 5px; font-family: "Times New Roman", serif; letter-spacing: 1px;}
	.cpImg .pageState span{ color: #f00; font-size: 16px;}





.htbock_01 .right{ float: right; width: 46%; padding: 2% 2%; }
.htbock_01 .right h1{ font-size: 36px; color: #383842; border-bottom: 1px solid #ccc; padding-bottom: 24px; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.htbock_01 .right .right_pcon .edit_con_original{ font-size: 15px; color: #888;}
.cp_ge { padding: 10px 0; border-bottom: 1px solid #ccc; }
.cp_ge li{ height: 38px; font-size:18px; line-height:38px;}
.cp_ge li span{ margin: 0 5px; border: 1px solid #ccc; padding: 2px 6px; background-color: #fff; font-size: 14px;}
.cp_ge li b{ color: #eb3c00;}
/*.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;}
.htbock_01 .create_box { background-size:100% auto; height: auto; margin: 0;}*/
.fw{ width: 100%; text-align: center; margin-top: 20px;}
.fw a{ background: url(../images/kfIcon.png) #eb3c00 6% center no-repeat; width: 330px; height: 58px; line-height: 58px; font-size: 20px; color: #fff; display: inline-block; border-radius: 8px; }


.caption{height:50px;overflow:hidden; margin-bottom: 25px; /*text-align: center;*/ border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.caption li{ width: 150px; font-size:16px; font-weight: 100; height:50px; line-height:50px; text-align:center;  color:#333; display:inline-block;}
.caption a { color: #333;}
.caption a:hover{ text-decoration:none;}
.caption .active{ background-color: #eb3c00; color: #DD0600;  font-weight:bold}
.caption .active a{ color: #fff;}
.fixedTop {  position: fixed;   top: 82px; text-align: center;  width: 100%;  background-color: #000; left: 0;}
.fixedTop a{ color: #fff;}
.bline{ border: 1px solid #dedede;}
.cpbox {padding:0px 20px 20px 20px; font-size:15px; line-height:30px; clear: both;}
.title-name{ width: 40%; margin:0 auto 20px; text-align: center;   height: 42px; line-height: 42px; clear: both; }
.title-name h4{ color: #242424;  font-size: 18px; font-weight: 100; background-color: #0066af; padding: 0 30px 0 10px;   color: #fff;  }
.title-name1{  margin:20px 0; float: left;} 
.title-name1 h4{background-color: #ea3c00; width: 270px;}
.cpbox table{border-top:1px solid #dedede ;border-left:1px solid #dedede ; line-height: 22px; text-align: center; margin: 0 auto; width: 90%;}
.cpbox tr td{ border-bottom:1px solid #dedede ;border-right:1px solid #dedede ; padding: 2px 5px;}
 
.cpbox .hnt_ul li{ width: 33.333%; float: left;}

.cpbox .hnt_ul li a{ padding:8px 15px; display: inline-block;}



/*回+书店&开放图书馆*/
.book_box_top {  width:100%; border-radius:0 0 20px 0; background:#009819; margin-bottom:20px; position:relative;}
.book_main_wrap {  width:100%; background:#fff; margin:0 auto; }
.book_main { width:100%; overflow:hidden; position:relative; }
.book_main img {  width:100%; height:auto;}
.book_box { width:100%; margin:0 auto 0px; position:relative; }
.book_box a.book_left_menu { height:50px; position:absolute; left:38px; width:50px; top:50%; margin-top:-25px; background:url(../images/fu_prev.png) no-repeat left center; z-index:200; display: none !important; }
.book_box a.book_right_menu { height:50px; position:absolute; right:38px; width:50px; top:50%; margin-top:-25px; background:url(../images/fu_next.png) no-repeat right center; z-index:200; display: none !important;}

.book_box_bottom .book_bottom_l { display:block; width:19px; height:100px; background:url(../images/fu_prev.png) no-repeat left center; position:absolute; left:0px; top:50%; margin-top:-50px; z-index:200; }
.book_box_bottom .book_bottom_r { display:block; width:19px; height:100px; background:url(../images/fu_next.png) no-repeat left center; position:absolute; right:0px; top:50%; margin-top:-50px; z-index:200; }

.htbock_01 .book_box_bottom { width:100%; position:relative; overflow:hidden;}
.htbock_01 .book_box_bottom ul {  width:8000%; position:relative;}
.htbock_01 .book_box_bottom li{ float:left; margin-right:20px; cursor:pointer; position:relative; height: auto; margin-bottom: 0 }
.htbock_01 .book_box_bottom li.active span { display:none; }



.book_main { position:relative; overflow:hidden; }
.book_main_box {  width:8000%; position:relative;}
.book_main_box img { float:left; }
.htbock_01 .book_bottom_main span { position:absolute; left:0; top:0; width:100%; height:100%; display:block; background:url(../images/fu_1px.png) repeat; }
.book_bottom_main img {  width:100% !important; height:100% !important;}




/*边距*/




@media only screen and (max-width: 767px) {



.book_box a.book_left_menu { width:36px; height:36px; background-size:100% 100%; margin-top:-18px; left:2%; }
.book_box a.book_right_menu { width:36px; height:36px; background-size:100% 100%; margin-top:-18px; right:2%; }
.book_box_bottom .book_bottom_l { width:26px; height:46px; background-size:100% 100%; margin-top:-23px; left:0%; }
.book_box_bottom .book_bottom_r { width:26px; height:46px; background-size:100% 100%; margin-top:-23px; right:0%; }


        

}


@media only screen and (max-width: 1366px) {
.cpList li{ width:47%; margin:5px 1.5%;}

.cpList li h3{ font-size:13px;  line-height: 24px; font-weight:100; color: #333;}

.main02{ width: 1135px !important; margin:20px auto !important}

.caption{ height:42px;}
.caption li{ width:24%; height:42px; line-height:42px;}

.cpbox{ padding:10px 0 0; font-size:13px; line-height:170%;}



.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: #0066af;}
.hnt_01 .left ul li:hover a{background: #0066af;}

.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;}




.cpImg{ width: 100%;}
.cpImg .bigImg li img{ width: 100%; height: 270px;}
.title-name{ width: 100%; margin:0 auto;}
.title-name h4{ padding: 0 2%; font-size:14px;}
.cpbox table img{ max-width:95%; height:auto;}


.fixedTop{ top: 0; z-index:888;}
.cpImg .bigImg{ width: 100%;}
.cpImg .smallImg{ width: 78%; overflow: hidden;}
}

@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%}


}