.scrollpic {
    width: 100%;
    /*margin:40px auto 0 auto;*/

}
#myscroll {
    display: block;
    width:80% ;
    position: relative;
    /*height: 257px;*/
    overflow: hidden;

    margin: 0 auto;

    /*padding-right: 2.8%;*/
}
#myscroll #myscrollbox {
    display: block;
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    width: 1000000px;
}
#myscroll ul {
    display: block;
    float: left;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
#myscroll ul li {
    display: block;
    float: left;

    /*width:335px;*/
    margin-right: 15px;
    background: #ffffff;

}


#myscroll ul li a {
    display: block;
    float: left;
    /*width: 260px;*/
    padding: 0;
    position: relative;
    /*height: 257px;*/
    color: #333;
	border: 3px solid #c8c8c8;


}
#myscroll a .intro {
    position: absolute;
    left: 0;
    z-index: 10;
    background-color: #0057c4;
    filter: alpha(opacity=70);
    /*width: 335px;*/
    color: #fff;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    text-align: center;
	

	

}
#myscroll a .intro h5 {
    padding: 0;
    margin: 0;
    font-size: 20px;
    /*height: 257px;*/
    /*width: 335px;*/
    /*line-height: 257px;*/
    border-bottom: 1px solid #347fdc;
    font-weight:100;
    font-family: Arial;


}
#myscroll a .intro p {
    font-size: 16px;
    line-height: 20px;
    overflow: hidden;
	margin-top:10px;
}
#myscroll a .intro {
    bottom: -550px;

}
#myscroll a:hover .intro {
    bottom: 0px;
}

#myscroll a:hover  {
	/*border-color:#0057c4;*/
    /*width: 335px;*/
    color: #fff;
 }



#mybtns {
    margin: 10px 0;
    width: 100%;
    display: block;
    height: 42px;
}
#mybtns a {
    width: 60px;
    height: 102px;
    display: block;
    float: right;
    /*background-color: #c1c1c1;*/
    margin-left:10px;
}
#mybtns a:hover {
    /*background-color: #347fdc;*/
}
#mybtns a:hover, #myscroll, #mybtns a, #myscroll a:hover .intro, #myscroll a .intro, #myscroll #myscrollbox {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
#mybtns #left {
    background: url(../images/jt_l.png) no-repeat;
    float: left;
    position: relative;
    top: 220px;
}
#mybtns #right {
    background: url(../images/jt_r.png) no-repeat;
    position: relative;
    top: 220px;
}

#kinMaxShow {
    visibility: hidden;
    width: 100%;
    height: 500px;
    overflow: hidden;
}



@media screen and (min-width: 1200px) and (max-width: 1700px) {
	.scrollpic {
    width: 100%;
    /*margin:40px auto 0 auto;*/

}
#myscroll {
    display: block;
    width:1060px;
    position: relative;
    height: 424px;
    overflow: hidden;
    margin: 0 auto;
    /*padding-right: 2.8%;*/
}
#myscroll #myscrollbox {
    display: block;
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    width: 1000000px;
}
#myscroll ul {
    display: block;
    float: left;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
#myscroll ul li {
    display: block;
    float: left;
    width:340px;
    margin-right: 15px;
    background: #ffffff;

}


#myscroll ul li a {
    display: block;
    float: left;
    width: 340px;
    padding: 0;
    position: relative;
    height: 418px;
    color: #333;
	border: 3px solid #c8c8c8;


}
#myscroll a .intro {
    position: absolute;
    left: 0;
    z-index: 10;
    background-color: #0057c4;
    filter: alpha(opacity=70);
    width: 340px;
    color: #fff;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    text-align: center;
	padding:3px;
	left:-3px;
	
	
}
#myscroll a .intro h5 {
    padding: 0;
    margin: 0;
    font-size: 20px;
    /*height: 257px;
    /*width: 335px;*/
    /*line-height: 257px;*/
    border-bottom: 1px solid #347fdc;
    font-weight:100;
    font-family: Arial;


}
#myscroll a .intro p {
    font-size: 16px;
    line-height: 20px;
    overflow: hidden;
	margin-top:10px;
}
#myscroll a .intro {
    bottom: -460px;

}
#myscroll a:hover .intro {
    bottom: -3px;


}

#myscroll a:hover  {
	/*border-color:#0057c4;*/
    width: 340px;
    color: #fff;
 }



#mybtns {
    margin: 10px 0;
    width: 100%;
    display: block;
    height: 42px;
}
#mybtns a {
    width: 60px;
    height: 102px;
    display: block;
    float: right;
    /*background-color: #c1c1c1;*/
    margin-left:10px;
}
#mybtns a:hover {
    background-color: #347fdc;
}
#mybtns a:hover, #myscroll, #mybtns a, #myscroll a:hover .intro, #myscroll a .intro, #myscroll #myscrollbox {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
#mybtns #left {
    background: url(../images/jt_l.png) no-repeat;
    float: left;
    position: relative;
    top: 220px;
}
#mybtns #right {
    background: url(../images/jt_r.png) no-repeat;
    position: relative;
    top: 220px;
}

#kinMaxShow {
    visibility: hidden;
    width: 100%;
    height: 500px;
    overflow: hidden;
}

.simg{
    width: 340px;
    height: 418px;
    border: 0;
}


.divp{
	padding-top:150px;
}

.divp2{
	padding-bottom:150px;
}

	
	
	
}







@media screen and (min-width: 1700px) and (max-width: 1920px) {
	.scrollpic {
    width: 100%;
    /*margin:40px auto 0 auto;*/

}
#myscroll {
    display: block;
    width:1414px;
    position: relative;
    height: 424px;
    overflow: hidden;
	

    margin: 0 auto;

    /*padding-right: 2.8%;*/
}
#myscroll #myscrollbox {
    display: block;
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    width: 1000000px;
}
#myscroll ul {
    display: block;
    float: left;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
#myscroll ul li {
    display: block;
    float: left;
    width:340px;
    margin-right: 15px;
    background: #ffffff;

}


#myscroll ul li a {
    display: block;
    float: left;
    width: 340px;
    padding: 0;
    position: relative;
    height: 418px;
    color: #333;
	border: 3px solid #c8c8c8;


}
#myscroll a .intro {
    position: absolute;
    left: 0;
    z-index: 10;
    background-color: #0057c4;
    filter: alpha(opacity=70);
    width: 340px;
    color: #fff;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    text-align: center;
	padding:3px;
	left:-3px;
	

}
#myscroll a .intro h5 {
    padding: 0;
    margin: 0;
    font-size: 20px;
    /*height: 257px;
    /*width: 335px;*/
    /*line-height: 257px;*/
    border-bottom: 1px solid #347fdc;
    font-weight:100;
    font-family: Arial;


}
#myscroll a .intro p {
    font-size: 16px;
    line-height: 20px;
    overflow: hidden;
	margin-top:10px;
}
#myscroll a .intro {
    bottom: -460px;

}
#myscroll a:hover .intro {
       bottom: -3px;
}

#myscroll a:hover  {
	/*border-color:#0057c4;*/
    width: 340px;
    color: #fff;
 }



#mybtns {
    margin: 10px 0;
    width: 100%;
    display: block;
    height: 42px;
}
#mybtns a {
    width: 60px;
    height: 102px;
    display: block;
    float: right;
    /*background-color: #c1c1c1;*/
    margin-left:10px;
}
#mybtns a:hover {
    background-color: #347fdc;
}
#mybtns a:hover, #myscroll, #mybtns a, #myscroll a:hover .intro, #myscroll a .intro, #myscroll #myscrollbox {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
#mybtns #left {
    background: url(../images/jt_l.png) no-repeat;
    float: left;
    position: relative;
    top: 220px;
}
#mybtns #right {
    background: url(../images/jt_r.png) no-repeat;
    position: relative;
    top: 220px;
}

#kinMaxShow {
    visibility: hidden;
    width: 100%;
    height: 500px;
    overflow: hidden;
}

.simg{
    width: 340px;
    height: 418px;
    border: 0;
}


.divp{
	padding-top:150px;
}

.divp2{
	padding-bottom:150px;
}

	
	
}















.hrdiv1{
	height:50px;width:98%;border:3px solid #c8c8c8;border-bottom:0px;
}

.hrdiv2{
	height:50px;width:98%;border:3px solid #c8c8c8;border-top:0px;
}

.simg{
    width: 100%;

}


.img2 ul li{
    width: 25%;
    float: left;
}

.img2 ul li img{
    width: 100%;
    height: auto;
}
.hrover{
    height: 40px;
    line-height: 40px;
    position: relative;
    z-index: 999;
    margin-top: -40px;
    color: #ffffff;
    background-color:rgba(0,78,106,0.5) ;
    text-indent: 35px;
    opacity: 0;
}

@keyframes fadeIn{
    from{
        opacity:0
    }to{
         opacity:1
     }
}

.img2 ul li a:hover .hrover{
    animation-name: fadeIn;
    -webkit-animation-name: fadeIn;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.fenlei li{
    width: 133px;
    height: 36px;
    text-align: center;
    list-style-type: none;
    float: left;
    color: #ffffff;
    border: 2px solid #ffffff;
    line-height: 36px;
    border-radius:22px;
    margin-right: 30px;

}

.fenlei{
    width: 670px;
    margin:  0 auto;
}

.fenlei li a{
    display: block;
    width: 133px;
    height: 36px;
    color: #ffffff;
}

.fenlei li:hover{
	background-color:#004ea0;
}

#fancybox-loading { position: fixed; top: 50%; left: 50%; width: 40px; height: 40px; margin-top: -20px; margin-left: -20px; cursor: pointer; overflow: hidden; z-index: 1104; display: none; }
#fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url(../images/fancybox.png); }
#fancybox-overlay { position: absolute; top: 0; left: 0; width: 100%; z-index: 1100; display: none; }
#fancybox-tmp { padding: 0; margin: 0; border: 0; overflow: auto; display: none; }
#fancybox-wrap { position: absolute; top: 0; left: 0; padding: 20px; z-index: 1101; outline: none; display: none; }
#fancybox-outer { position: relative; width: 98%; height: 100%; background: #fff; }
#fancybox-content { width: 0; height: 0; padding: 0; outline: none; position: relative; overflow: hidden; z-index: 1102; }
#fancybox-hide-sel-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; z-index: 1101; }
#fancybox-close { position: absolute; top: -15px; right: -15px; width: 30px; height: 30px; background: transparent url(../images/fancybox.png) -40px 0px; cursor: pointer; z-index: 1103; display: none; }
#fancybox-error { color: #444; font: normal 12px/20px Arial; padding: 14px; margin: 0; }
#fancybox-img { width: 100%; height: 100%; padding: 0; margin: 0; border: none; outline: none; line-height: 0; vertical-align: top; }
#fancybox-frame { width: 100%; height: 100%; border: none; display: block; }
#fancybox-left, #fancybox-right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; outline: none;z-index: 1102; display: none; }
#fancybox-left { left: 0px; }
#fancybox-right { right: 0px; }
#fancybox-left-ico, #fancybox-right-ico { position: absolute; top: 50%; left: -9999px; width: 30px; height: 30px; margin-top: -15px; cursor: pointer; z-index: 1102; display: block; }
#fancybox-left-ico { background-image: url(../images/fancybox.png); background-position: -40px -30px; }
#fancybox-right-ico { background-image: url(../images/fancybox.png); background-position: -40px -60px; }
#fancybox-left:hover, #fancybox-right:hover { visibility: visible; /* IE6 */ }
#fancybox-left:hover span { left: 20px; }
#fancybox-right:hover span { left: auto; right: 20px; }
.fancybox-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }
#fancybox-bg-n { top: -20px; left: 0; width: 100%; background-image: url(../images/fancybox-x.png); }
#fancybox-bg-ne { top: -20px; right: -20px;
    background-position: -40px -162px; }
#fancybox-bg-e { top: 0; right: -20px; height: 100%; background-image: url(../images/fancybox-y.png); background-position: -20px 0px; }
#fancybox-bg-e { top: 0; right: -20px; height: 100%; background-image: url(../images/fancybox-y.png); background-position: -20px 0px; }
#fancybox-bg-se { bottom: -20px; right: -20px; background-image: url(../images/fancybox.png); background-position: -40px -182px; }
#fancybox-bg-s { bottom: -20px; left: 0; width: 100%; background-image: url(../images/fancybox-x.png); background-position: 0px -20px; }
#fancybox-bg-sw { bottom: -20px; left: -20px;
    background-position: -40px -142px; }
#fancybox-bg-w { top: 0; left: -20px; height: 100%; background-image: url(../images/fancybox-y.png); }
#fancybox-bg-nw { top: -20px; left: -20px;
    background-position: -40px -122px; }
#fancybox-title { font-family: Helvetica; font-size: 12px; z-index: 1102; }
.fancybox-title-inside { padding-bottom: 10px; text-align: center; color: #333; background: #fff; position: relative; }
.fancybox-title-outside { padding-top: 10px; color: #fff; }
.fancybox-title-over { position: absolute; bottom: 0; left: 0; color: #FFF; text-align: left; }
#fancybox-title-over { padding: 10px;  display: block; width:96%}
.fancybox-title-float { position: absolute; left: 0; bottom: -20px; height: 32px; }
#fancybox-title-float-wrap { border: none; border-collapse: collapse; width: auto; }
#fancybox-title-float-wrap td { border: none; white-space: nowrap; }
#fancybox-title-float-left { padding: 0 0 0 15px;
}
#fancybox-title-float-main { color: #FFF; line-height: 29px; font-weight: bold; padding: 0 0 3px 0; background: url(../images/fancybox-x.png) 0px -40px;  }
#fancybox-title-float-right { padding: 0 0 0 15px;
}

#preview { float:left; margin:0px auto;width: 100%;}
.jqzoom { width:83%;height: auto;  margin-bottom: 10px; overflow: hidden; position: relative; overflow: hidden; text-align:center; margin:0; padding:0;background:#ffffff;margin:0 auto}
.jqzoom img{ width: 100%; height:auto; overflow:hidden; text-align:center; background-position:center center;}
.zoomdiv { width: 100%; height:auto; left:859px; z-index: 100;position: absolute; text-align: center;  display: none;
    background: url(../images/loading.gif) #fff no-repeat center center; overflow: hidden; top: 1px; left: 0px ;}
#spec {
    position: relative;
    width:37%;
    height:105px;
    overflow: hidden;
    top: 10px;
	margin-left:25%;
}
.jqzoom img{max-width: none !important;max-height: none}

.specLeftT { position: absolute; width:5px; background: url(../images/proddetlicon.gif) no-repeat -157px 0px; float: left; height:9px; top:30px; cursor: pointer; left: 0px }
.specRightT { position: absolute; width: 5px; background: url(../images/proddetlicon.gif) no-repeat -164px 0px; float: left; height:9px; top:30px; cursor: pointer; right: -15px }
.specLeftF { position: absolute; width: 5px; background: url(../images/proddetlicon.gif) no-repeat -145px 0px; float: left; height:9px; top:30px; cursor: pointer; left: 0px }
.specRightF { position: absolute; width: 5px; background: url(../images/proddetlicon.gif) no-repeat -151px 0px; float: left; height:9px; top:30px; cursor: pointer;right: 0px; }
#specList { display: inline; float: left; margin-left: 2px }
#specList { position:absolute; text-align:left; width:600px; height:101px; overflow:hidden; top:0px; left:13px; float:left;}
#specList ul{ position:absolute; width: 600px; left:0px }
#specList ul li { float:left; width:100px; height:67px; display:inline; margin-right:5px; }
#specList ul li img {/* border:#ccc 1px solid;*/ padding-bottom:2px; padding-left:2px; width:100%; height:100%; padding-right:2px; margin-bottom:1px; padding-top:2px }
.bigimg { width:1000px; height:667px }
.jqZoomPup { z-index:10; position: absolute; filter: alpha(opacity=50);  width:50px;
    height:50px; background:#666 no-repeat 50% top; visibility:hidden; top:0px; cursor:move;
    left:0; opacity:0.5; -moz-opacity:0.5; -khtml-opacity:0.5}


	
.spro{
    /*width:600px;*/
    /*float: right;*/
    margin-top: 35px;

}

.name{
    font-size: 24px;
    text-align: center;
	margin:20px 0;
    color: #004ea0;
}
.cs{
    padding: 0 15px;
}

.cs h1{
    margin-top: 0px;
}

.cs p{
    text-align: left;
    padding-bottom: 0px;
    margin-bottom: 0px;
    color: #666666;
    font-size: 14px;
}


.lydgtop {
    line-height: 36px;
    height: 36px;
    border-bottom: 1px solid #004ea0;
    margin-bottom: 20px;
    margin-top: 20px;

}

.lydgtopIN {
    width: 95px;
    height: 36px;
    color: #FFF;
    background: #004ea0;
    text-align: center;
    line-height: 36px;
    font-size: 14px;
}

.cpcstext p{
    margin-bottom: 0;
    text-align: left;
    color: #666666;
    font-size: 14px;
}

.ddcontact{
	margin-top:-355px;margin-left:350px;
}

.myp p {
	line-height:27px;
	color:#666666;
}

.myp p img{
	margin-right:10px;
	
}

.hrt{
	padding-right: 50px;
}

@media screen and (max-width: 768px){
	.ddcontact{
	margin-top:0px;margin-left:0px;
}

.header .logo img{
	width:216px;
	height:39px;
}

.header .logo2 img{
	width:216px;
	height:39px;
}

.header .logo3 img{
	width:216px;
	height:39px;
}


.fenlei{
    width: 380px;
    margin:  0 auto;
	
}

.fenlei li{
	margin-top:20px;
}


.hrcase h1{
	font-size:32px;
}

.img2 ul li{
	width:50%;
}


.hrt{
	padding-right: 0px;
}


	
}