/* CSS Document */



.toolbar{ width:100%; background:#444444; padding:5px 0; margin:5px 0 20px 0} 

.grid-icon {  background: rgba(0, 0, 0, 0) url("../images/grid.png") no-repeat scroll 0 0;     height: 22px;   width: 30px; margin-left:10px}

.list-icon {   background: rgba(0, 0, 0, 0) url("../images/list.png") no-repeat scroll 0 0;     height: 22px;   width: 30px; }



.product_procon .tag { }

.product_procon .tag .tagList{ background: #cccccc;background:#444444; padding:10px 0; margin:5px 0 20px 0;width:100%;}

.product_procon .tag .tagList li { float: left; width:40px; text-transform: capitalize; text-align: center;  font-weight: bold;cursor: pointer; }

/*.product_procon .tag .tagList li:first-child { border-left: 0px none; }

.product_procon .tag .tagList li.selected { background: #428bca; color: #fff; }

.product_procon .tag .tagBox { padding: 10px; border: 1px solid #ccc; margin-top: -3px; background:#FFF; border-radius:5px }*/



.product{ width:100%}

.proinfo{ color:#5F5E5E; font-size:13px; margin-bottom:30px; padding-top:10px;}

.product .box, .product .line { width:30%; }

.product .box { margin-bottom: 25px; background:#428bca; border:1px solid #ccc7c6 }

.product .box a:first-child { margin-bottom: 12px;  overflow:hidden; padding:0px;}

.product .box:hover a:first-child{ border-color:#df3b3b;}

.product .box a:first-letter{ text-transform: capitalize;}

.product .box .info{  line-height:20px; padding:10px 40px 10px 10px; position:relative;  }

.product .box .info:before{font-family: 'icomoon';content: '\e642'; color:#FFF; position:absolute; right:15px; top:25px; font-size:40px}

.product .box a { font-size: 21px; font-weight: bold;color:#FFF; }

.product .box .tit{ font-size: 21px; font-weight: bold;  color:#FFF;}

.product .box a img{  overflow:hidden; width:100%; display:block;}

.product .box:hover a { color: #fff; }

.product .box p { color: #fff; font-size: 12px; margin-top: 2px;  overflow: hidden; color:#FFF  }

.product2{ width:100%;}

.product2 .box, .product2 .line { width:100%; }

.product2 .box { margin-bottom: 25px; border:1px solid #ccc7c6; background:#fff;position:relative }

.product2 .box .tit2{ color:#fff; background:#428bca; display:block; text-align:left; font-size:19px; padding-left:10px}

.product2 .box a:first-child {  overflow:hidden; }

.product2 .box:hover a:first-child{ border-color:#df3b3b;}

.product2 .box a:first-letter{ text-transform: capitalize;}

.product2 .box .info{width: 75%; text-indent:15px; line-height:20px; padding:30px 0;  float:right;   }

.product2 .box .img{ width:15%;float:left; margin:10px}

.product2 .box a img{  width:100%;  }

.product2 .box:hover a {  }

.product2 .box p { color: #606060;  overflow: hidden; font-size:15px }

.product2 .box .info .more { position: absolute;  font-size: 12px; display: inline-block; color: #fff; background: #428bca;  padding: 5px 15px; border-radius: 4px; right:30px; bottom:20px; text-indent:0 }

.product2 .box .info .more:hover{ background:#ff7900 }



@media screen and (max-width: 640px) { .product .box, .product .line { width: 47%; } }

@media screen and (max-width: 480px) { .product .box, .product .line { width: 100%; } }



.procon .mtip { font-size: 20px; color: #fff; background: #428bca; padding: 6px 15px; margin-bottom: 15px; }

.procon .tag .tagList{ border-bottom:0; padding-top:1px;}

@media screen and (max-width: 640px) { .procon .mtip { font-size: 16px; } }

.procon .one { position: relative; }

.procon .one .slideHot { width: 48.8764%; }

.procon .one .slideHot .slideList { width: 100%; display: block; margin-top: 10px; }

.procon .one .slideHot .slideList li { width: 23%;}

@media screen and (max-width: 640px) { .procon .one .slideHot { width: 100%; text-align: center; }}

.procon .one .right { width: 46.61798%; color:#428bca; font-size:21PX }

.procon .one .right .vd { width: 86%; position: relative; margin-top: 30px; overflow: hidden; min-height:400px }

.procon .one .right .vd a { display: block; }

.procon .one .right .vd a img{ width: 100%; }

.procon .one .right .vd > img { width: 100%; position: absolute; left: 0; top:200px; z-index: -1; max-width:236px }

@media screen and (max-width: 640px) { .procon .one .right { width: 100%; text-align: center; }

  .procon .one .right .vd { width: 80%; margin-left: 10%; } }

.procon .one .right .addthis_sharing_toolbox{ display: inline-block; margin-top: 67px;}

.procon .one .con { position: absolute; bottom: 0; right: 0; font-size: 20px; color: #fff; padding: 16px 20px 14px 38px; background: #428bca; vertical-align: middle; line-height: 1; display: inline-block; }

@media screen and (max-width: 1200px) { .procon .one .con { padding: 12px 16px 10px; font-size: 16px; position: relative; margin-top: 10px; }

 .procon .one .right .addthis_sharing_toolbox{ margin-top: 20px;}}

@media screen and (max-width: 640px) { .procon .one .con { position: relative; margin-top: 15px; } }

.procon .one .con:after { font-family: 'icomoon'; content: '\e63c'; font-size: 24px; margin-left: 15px; vertical-align: middle; position: relative; top: -2px; }

.procon .tag { margin: 30px 0; padding-top:0px; color:#333  }

.procon .tag .tagList li { float: left; width: 25%; border-left: 1px solid #fff; margin-bottom: 1px; text-transform: capitalize; background: #cccccc; text-align: center; color: #606060; font-size: 15px; font-weight: bold; line-height: 1.5; padding: 8px 0; cursor: pointer; }

.procon .tag .tagList li:first-child { border-left: 0px none; }

.procon .tag .tagList li.selected { background: #428bca; color: #fff; }

.procon .tag .tagBox { padding: 10px; border: 1px solid #ccc; margin-top: -3px; background:#FFF; border-radius:5px }

@media screen and (max-width: 760px) { .procon .tag .tagList li { width: 100%; } }

.procon .hotpro { margin-top: 50px; }

.procon .hotpro .tit { font-size: 19px; font-weight: bold; color: #fff; display: inline-block; background: #428bca; padding: 3px 30px; text-transform: capitalize; border-radius:5px }

.procon .hotpro .box, .procon .hotpro .line { width: 22.5%; }

.procon .hotpro .box {  text-align: center; }

.procon .hotpro .box a { color: #363636; display: block;  }

.procon .hotpro .box a img{margin-bottom: 10px; }

@media screen and (max-width: 840px) { .procon .hotpro .box, .procon .hotpro .line { width: 47%; } }

@media screen and (max-width: 460px) { .procon .hotpro .box, .procon .hotpro .line { width: 100%; } }



.hotpro { margin-top: 30px; }

.hotpro .justify { padding: 20px 20px; border: 1px solid #ccc; }



.hotpro .box, .hotpro .line { width: 22.5%; }





@media screen and (max-width: 840px) { .hotpro .box, .hotpro .line { width: 47%; } }

@media screen and (max-width: 460px) { .hotpro .box, .hotpro .line { width: 100%; } }





.message .title .tl { width: 20%; display: inline-block; float: left; background: #428bca; text-align: center; border-right: 1px solid #fff; color: #fff; font-size: 19px; height: 40px; line-height: 40px; }

.message .title .tr { width: 80%; background: #EDEDED; color: #828282; text-align: left; font-size: 17px; float: right; height: 40px; line-height: 40px; font-weight: normal; text-indent:20px }

@media screen and (max-width: 740px) { .message .title .tl { width: 100%; }

.message .title .tr { display: none; } }

.message form { border: 1px solid #DBDBDB; border-top: 0px none; display: block; }

.message ul { padding: 30px; padding-bottom: 5px; }

@media screen and (max-width: 630px) { .message ul { padding: 10px; } }

.message ul li { width: 48%; position: relative; margin-bottom: 15px; color: #919191; }

.message ul li span.must { position: absolute; right: 4px; top: 1px; z-index: 12; color: #FF0000; }

.message ul li input[type=text] { border: 1px solid #DBDBDB; padding: 13px 6px 13px 6px; width: 100%; font-size: 14px; position: relative; z-index: 2; line-height: 1; color: #333; }

.message ul li label { position: absolute; top: 5px; left: 0; padding-left: 7px; color: #919191; font-size: 14px; text-transform: capitalize; z-index: 1; width: 100%; }

.message ul li input[type=text]:focus { padding: 4px 6px 22px 6px; border-color: #428bca; }

.message ul li input[type=text]:focus + label, .message ul li textarea:focus + label { top: 100%; font-size: 12px; color: #fff; margin-top: -16px; background: #428bca; z-index: 15; }

@media screen and (max-width: 630px) { .message ul li { width: 100%; } }

.message ul li input[name=verifycode] { width: 89px; padding: 0; height: 32px; line-height: 32px; padding-left: 5px; vertical-align: middle; }

.message ul li input[name=verifycode]:focus { padding: 0; padding-left: 5px; }

.message ul li span.code { position: relative; display: inline-block; vertical-align: middle; margin-left: 5px; }

.message .box.none { margin-bottom: 0; }

.message .block { display: block; width: 100%; position: relative; text-align: center; }

.message .block label { text-align: left; }

.message .block textarea { width: 100%; border: 1px solid #DBDBDB; padding: 6px; height: 132px; min-height: 100px; min-width: 100%; position: relative; z-index: 2; }

.message .block textarea:focus { border-color: #428bca; }

.message input[type=submit], .message input[type=reset] { width: 95px; text-align: center; border: 1px solid #ddd; line-height: 1; font-size: 14px; padding: 8px 20px; color: #aaa; margin: 0 10px; }

.message input[type=submit]:hover, .message input[type=reset]:hover { background: #428bca; color: #fff; }

input[type="text"]:focus, input.focusOn[type="text"], textarea:focus, textarea.focusOn{ background:#eef3f9}



.suppory{ margin-top:120px;}



.suppory .box { margin-bottom: 25px;width:44%; background:#aac7e0; min-height:215px; float:left;font-size:32px;  }

.suppory .box:hover{background:#ffaa5e; }

.suppory .box .img{ max-width:100%; margin-top:20px }

.suppory .box .img img{ max-width:100%; width:auto  }

.suppory .box .info{ text-align:center;  }

.suppory .box .info a{color:#355372}

.suppory .box2{ margin-left:20px}

@media screen and (max-width: 840px) { .suppory{ margin-top:20px;font-size:27px;} }

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

	 .suppory .box { width:100%; }

	 .suppory .box2{ margin-left:0px}

	 }