.case-main{ width:1200px; margin:0 auto;}



.case-title{ width:1200px; text-align:center; padding-top:80px; padding-bottom:40px;}

.case-title .title{ font-size:70px; color:#444; line-height:50px; padding-bottom:30px; font-family:acidregular;}

.case-title .xian{ width:100px; height:2px; background:#444; margin:0 auto;}





.morecase{ height:50px;  text-align:center;}



.case-story{ width:1200px; margin:0 auto; padding-bottom:100px;}

.case-story:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-storylist{ width:580px; float:left; margin-top:50px; }

.case-storylist.margin{ margin-right:25px;}

.case-storylist .img{width:210px; height:210px;float:left; overflow:hidden;}

.case-storylist .img img{width:210px; height:210px;  transition-duration: .5s;-ms-transition-duration: .5s;-moz-transition-duration: .5s; -webkit-transition-duration: .5s;}

.case-storylist .img:hover img{ transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-o-transform:scale(1.1);-webkit-transform:scale(1.1);}

.case-storylist .nav{ width:345px; height:209px; float:right; position:relative; border-bottom:1px #eee solid;}

.case-storylist .nav .title{ line-height:20px;}

.case-storylist .nav .title a{font-size:14px; color:#444; font-family:"微软雅黑";}

.case-storylist .nav .title a:hover{color:#000;}

.case-storylist .nav .date{ font-size:12px; color:#999; line-height:20px;}

.case-storylist .nav .contact{ font-size:12px; color:#7f7f7f; line-height:22px; position:absolute; left:0;top:60px;font-family:"微软雅黑";}

.case-storylist .nav .read{ font-size:12px; line-height:24px; position:absolute; left:0; bottom:0;}

.case-storylist .nav .read a{color:#444;}

.case-storylist .nav .read a:hover{color:#000;}







.case-class{ width:1200px; margin:auto; text-align:center; padding-bottom:50px;}

.case-class:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-class dl{ line-height:43px; display:inline-block;*display:inline;*zoom:1;  position:relative;}

.case-class dl.all{width:178px; height:43px; border:1px #b9b9b9 solid; color:#666;}

.case-class dl.all.hover{ background:#bb894e; border:1px #bb894e solid;}

.case-class dl.all:hover{background:#bb894e;  border:1px #bb894e solid; }

.case-class dl.all a{color:#666;}

.case-class dl.all:hover a{color:#fff;}

.case-class dl.all.hover a{color:#fff;}



.case-class dl.class{ width:190px; }

.case-class dl dt{ width:148px;height:43px; padding:0 15px; border:1px #b9b9b9 solid; text-align:center; background-image: url(../images/Under.png);

background-position: 148px center;background-repeat: no-repeat;color:#666;}

.case-class .on{background: #e7e7e7;}

.case-class dl dt a{ color:#666;}

.case-class dl dd.classlist{ border-bottom:1px #b9b9b9 solid;text-align:left; border-left:1px #b9b9b9 solid; border-right:1px #b9b9b9 solid;position:absolute; left:0; top:45px; z-index:3; display:none; background:#FFF;}

.case-class dl dd.in{ display: block;}

.case-class dl dd.classlist a{ width:148px;padding:0 15px; color:#666; display:block;}

.case-class dl dd.classlist a:hover{ background:#e7e7e7;}



.case-class dl dt.video1{ background:none;}

.case-class dl dt.video1.hover{ background:#333; border:1px #333 solid; color:#fff;}

.case-class dl dt.video1:hover{background:#333;  border:1px #333 solid; color:#fff;}

.case-class dl dt.video1 a{color:#666;}

.case-class dl dt.video1:hover a{color:#fff;}

.case-class dl dt.avideo1.hover a{color:#fff;}







.casenav{ width:1200px; margin:0 auto; padding-bottom:50px;}

.casenav:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.casenav ul{ width:1200px;}

.casenav ul li{float:left; margin-bottom:30px;}

.casenav ul li.margin{ margin-right:26.6px;}

.casenav ul li .pic{ width:280px; height:400px; overflow:hidden;}

.casenav ul li .pic img{width:280px; height:400px; transition-duration: .5s;-ms-transition-duration: .5s;-moz-transition-duration: .5s; -webkit-transition-duration: .5s; }

.casenav ul li .pic:hover img{ transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-o-transform:scale(1.1);-webkit-transform:scale(1.1);}

.casenav ul li .contact{ width:280px; line-height:24px; padding-top:10px; text-align:center; color:#323232; font-size:16px;    height: 36px;}

.casenav ul li .contact:hover{color:#000;}







@media (max-width: 639px) {

.case-main{ width:90%; margin:30px auto;}



.case-title{ width:100%; text-align:center; padding-top:20px; padding-bottom:20px;}

.case-title .title{ font-size:50px; color:#444; line-height:50px; padding-bottom:15px; font-family:acidregular;}

.case-title .xian{ width:80px; height:2px; background:#444; margin:0 auto;}





.case-story{ width:100%; margin:20px auto; padding-bottom:20px;}

.case-storylist{ width:100%; float:none; margin-top:30px;}

.case-storylist:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-storylist.margin{ margin-right:0;}

.case-storylist .img{width:35%; height:120px;float:left; overflow:hidden;}

.case-storylist .img img{width:100%; height:100%;}

.case-storylist .nav{ width:63%; height:120px; float:right; position:relative; border-bottom:1px #eee solid;}

.case-storylist .nav .title{ height:20px; line-height:20px; overflow:hidden;}

.case-storylist .nav .date{ display:none;}

.case-storylist .nav .contact{ height:60px; font-size:12px; color:#7f7f7f; line-height:20px; position:absolute; left:0;top:20px; overflow:hidden;}







.case-class{ width:90%; margin:auto; text-align:center; padding-bottom:20px;}

.case-class:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-class dl{line-height:43px; display:inline-block;*display:inline;*zoom:1;  position:relative; margin-bottom:15px;}

.case-class dl.all{width:120px; height:43px; border:1px #b9b9b9 solid; color:#666;}

.case-class dl.all.hover{ background:#bb894e; border:1px #bb894e solid;}

.case-class dl.all:hover{background:#bb894e;  border:1px #bb894e solid; }

.case-class dl.all a{color:#666;}

.case-class dl.all:hover a{color:#fff;}

.case-class dl.all.hover a{color:#fff;}



.case-class dl.class{ width:128px;}

.case-class dl dt{ width:112px;height:43px; padding:0 4px; border:1px #b9b9b9 solid; background: url(../images/Under.png) no-repeat 80% center; background-size:10px 10px;color:#666;}

.case-class dl dt a{ color:#666;}

.case-class dl dd.classlist{ border-bottom:1px #b9b9b9 solid;text-align:left; border-left:1px #b9b9b9 solid; border-right:1px #b9b9b9 solid;position:absolute; left:0; top:45px; z-index:3; display:none; background:#FFF;width: 94%;}

.case-class dl dd.in{ display: block;}

.case-class dl dd.classlist a{ width:96%;padding:0 ; color:#666; display:block;padding:0 2%;}

.case-class dl dd.classlist a:hover{ background:#e7e7e7;}



/*.case-class dl dt.video1{width:112px; height:43px; border:1px #b9b9b9 solid; color:#666; background:none;}*/

.case-class dl dt.video.hover{ background:#333; border:1px #333 solid; color:#fff;}

.case-class dl dt.video:hover{background:#333;  border:1px #333 solid; color:#fff;}

.case-class dl dt.video a{color:#666;}

.case-class dl dt.video:hover a{color:#fff;}

.case-class dl dt.avideo.hover a{color:#fff;}







.casenav{ width:90%; margin:0 auto; padding-bottom:20px;}

.casenav:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.casenav ul{ width:100%;}

.casenav ul li{ width:48%; float:left; margin-bottom:20px;}

.casenav ul li.margin{ margin-right:2%;}

.casenav ul li .pic{ width:100%; height:auto; overflow:hidden;}

.casenav ul li .pic img{width:100%; height:auto;  }



.casenav ul li .contact{ width:100%; line-height:24px; padding-top:5px; text-align:center; color:#323232; font-size:14px; font-family:"微软雅黑";}

.casenav ul li .contact:hover{color:#000;}

}



@media (min-width: 640px) and (max-width:1023px ) {

.case-main{ width:90%; margin:30px auto;}



.case-title{ width:100%; text-align:center; padding-top:20px; padding-bottom:20px;}

.case-title .title{ font-size:50px; color:#444; line-height:50px; padding-bottom:15px; font-family:acidregular;}

.case-title .xian{ width:80px; height:2px; background:#444; margin:0 auto;}





.case-story{ width:100%; margin:20px auto; padding-bottom:30px;}

.case-story:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-storylist{ width:47%; float:left; margin-top:20px;}

.case-storylist.margin{ margin-right:4%;}

.case-storylist .img{width:40%; height:150px;float:left; overflow:hidden;}

.case-storylist .img img{width:100%; height:100%;}



.case-storylist .nav{ width:58%; height:150px; float:right; position:relative; border-bottom:1px #eee solid; font-family:"微软雅黑";}

.case-storylist .nav .title{  overflow:hidden; line-height:24px; height:24px;}

.case-storylist .nav .title a{font-size:16px; color:#444;}

.case-storylist .nav .title a:hover{color:#000;}

.case-storylist .nav .date{ height:23px; font-size:12px; color:#999; line-height:24px;}

.case-storylist .nav .contact{ font-size:12px; height:60px; color:#7f7f7f; line-height:20px; position:absolute; left:0;top:55px; overflow:hidden;  font-family:"微软雅黑";}







.case-class{ width:90%; margin:auto; text-align:center; padding-bottom:20px;}

.case-class:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-class dl{line-height:43px; display:inline-block;*display:inline;*zoom:1;  position:relative; margin-bottom:15px;}

.case-class dl.all{width:150px; height:43px; border:1px #b9b9b9 solid; color:#666;}

.case-class dl.all.hover{ background:#bb894e; border:1px #bb894e solid;}

.case-class dl.all:hover{background:#bb894e;  border:1px #bb894e solid; }

.case-class dl.all a{color:#666;}

.case-class dl.all:hover a{color:#fff;}

.case-class dl.all.hover a{color:#fff;}



.case-class dl.class{ width:150px;}

.case-class dl dt{ width:77%;height:43px; padding-right:0 2%; border:1px #b9b9b9 solid; text-align:center; background: url(../images/Under.png) no-repeat 80% center; background-size:10px 10px;color:#666;}

.case-class dl dt a{ color:#666;}

.case-class dl dd.classlist{ border-bottom:1px #b9b9b9 solid;text-align:left; border-left:1px #b9b9b9 solid; border-right:1px #b9b9b9 solid;position:absolute; left:0; top:45px; z-index:3; display:none; background:#FFF;}

.case-class dl dd.in{ display: block;}

.case-class dl dd.classlist a{ width:114px;padding:0 15px; color:#666; display:block;}

.case-class dl dd.classlist a:hover{ background:#e7e7e7;}



.case-class dl dt.video{width:130px; height:43px !important; border:1px #b9b9b9 solid; color:#666; background:none;}

.case-class dl dt.video.hover{ background:#333; border:1px #333 solid; color:#fff;}

.case-class dl dt.video:hover{background:#333;  border:1px #333 solid; color:#fff;}

.case-class dl dt.video a{color:#666;}

.case-class dl dt.video:hover a{color:#fff;}

.case-class dl dt.avideo.hover a{color:#fff;}







.casenav{ width:90%; margin:0 auto; padding-bottom:20px;}

.casenav:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.casenav ul{ width:100%;}

.casenav ul li{ width:48%; float:left; margin-bottom:20px;}

.casenav ul li.margin{ margin-right:2%;}

.casenav ul li .pic{ width:100%; height:auto; overflow:hidden;}

.casenav ul li .pic img{width:100%; height:auto;  }



.casenav ul li .contact{ width:100%; line-height:24px; padding-top:5px; text-align:center; color:#323232; font-size:14px; font-family:"微软雅黑";}

.casenav ul li .contact:hover{color:#000;}

}



@media (min-width: 1024px) and (max-width:1440px ) {

.case-main{ width:80%; margin:0 auto;}



.case-title{ width:100%; text-align:center; padding-top:40px; padding-bottom:20px;}

.case-title .title{ font-size:68px; color:#444; line-height:68px; padding-bottom:15px; font-family:acidregular;}

.case-title .xian{ width:80px; height:2px; background:#444; margin:0 auto;}





.case-story{ width:100%; margin:30px auto; padding-bottom:40px;}

.case-story:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-storylist{ width:48%; float:left; margin-top:20px;}

.case-storylist.margin{ margin-right:3%;}

.case-storylist .img{width:40%; height:150px;float:left; overflow:hidden;}

.case-storylist .img img{width:100%; height:100%;}



.case-storylist .nav{ width:58%; height:150px; float:right; position:relative; border-bottom:1px #eee solid;}

.case-storylist .nav .title{  overflow:hidden; line-height:24px; height:24px;}

.case-storylist .nav .title a{font-size:16px; color:#444;}

.case-storylist .nav .title a:hover{color:#000;}

.case-storylist .nav .date{ height:23px; font-size:12px; color:#999; line-height:24px;}

.case-storylist .nav .contact{ font-size:12px; height:60px; color:#7f7f7f; line-height:20px; position:absolute; left:0;top:55px; overflow:hidden;}







.case-class{ width:80%; margin:auto; text-align:center; padding-bottom:20px;}

.case-class:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.case-class dl{line-height:43px; display:inline-block;*display:inline;*zoom:1;  position:relative; margin-bottom:15px;}

.case-class dl.all{width:150px; height:43px; border:1px #b9b9b9 solid; color:#666;}

.case-class dl.all.hover{ background:#bb894e; border:1px #bb894e solid;}

.case-class dl.all:hover{background:#bb894e;  border:1px #bb894e solid; }

.case-class dl.all a{color:#666;}

.case-class dl.all:hover a{color:#fff;}

.case-class dl.all.hover a{color:#fff;}



.case-class dl.class{ width:150px;}

.case-class dl dt{ width:77%;height:43px; padding-right:0 2%; border:1px #b9b9b9 solid; text-align:center; background: url(../images/Under.png) no-repeat 80% center; background-size:10px 10px;color:#666;}

.case-class dl dt a{ color:#666;}

.case-class dl dd.classlist{ border-bottom:1px #b9b9b9 solid;text-align:left; border-left:1px #b9b9b9 solid; border-right:1px #b9b9b9 solid;position:absolute; left:0; top:45px; z-index:3; display:none; background:#FFF;}

.case-class dl dd.in{ display: block;}

.case-class dl dd.classlist a{ width:114px;padding:0 15px; color:#666; display:block;}

.case-class dl dd.classlist a:hover{ background:#e7e7e7;}



.case-class dl dt.video{width:100px; height:43px !important; border:1px #b9b9b9 solid; color:#666; background:none;}

.case-class dl dt.video.hover{ background:#333; border:1px #333 solid; color:#fff;}

.case-class dl dt.video:hover{background:#333;  border:1px #333 solid; color:#fff;}

.case-class dl dt.video a{color:#666;}

.case-class dl dt.video:hover a{color:#fff;}

.case-class dl dt.avideo.hover a{color:#fff;}







.casenav{ width:80%; margin:0 auto; padding-bottom:20px;}

.casenav:after{content: "020"; display: block; height: 0; clear: both;visibility:hidden;}

.casenav ul{ width:100%;}

.casenav ul li{ width:23%; float:left; margin-bottom:20px;}

.casenav ul li.margin{ margin-right:2%;}

.casenav ul li .pic{ width:100%; height:auto; overflow:hidden;}

.casenav ul li .pic img{width:100%; height:auto;  }



.casenav ul li .contact{ width:100%; line-height:24px; padding-top:5px; text-align:center; color:#323232; font-size:14px; font-family:"微软雅黑";} 

.casenav ul li .contact:hover{color:#000;}

}

@media (min-width: 1441px) and (max-width:1920px ) {

}