* {padding: 0;margin: 0;}
body {background: #f3f3f3;}
.Box {position: relative;margin-top: 80px}
.Box .content {width: 1085px;margin: 0 auto;}
.Box .Box_con {position: relative;}
.Box .Box_con .btnl {position: absolute;}
.Box .Box_con .btn {display: block;width: 41px;height: 41px;position: absolute;top: 175px;cursor: pointer;z-index: 300;}
.Box .Box_con .btnl {background: url(../image/jtl02.png) no-repeat center;left: -75px;}
.Box .Box_con .btnr {background: url(../image/jtr02.png) no-repeat center;right: -75px;}
.Box .Box_con .btnl:hover {background: url(../image/jtl03.png) no-repeat center;}
.Box .Box_con .btnr:hover {background: url(../image/jtr03.png) no-repeat center;}
.Box .Box_con .conbox {position: relative;overflow: hidden;}
.Box .Box_con .conbox ul {position: relative;list-style: none;}
.Box .Box_con .conbox ul li {float: left;width: 260px;height: 400px;margin-left: 15px;overflow: hidden;background: rgba(255,255,255,.2);transition: background .5s;}
.Box .Box_con .conbox ul li:first-child {margin-left: 0;}
.Box .Box_con .conbox ul li img {display: block;width: 100%;height: 180px;transition: background 0.5s;}
.Box .Box_con .conbox ul li h3{font-family: Arial, "微软雅黑";font-size: 16px;margin:0;padding: 15px 10px 0;font-weight:normal;color: #222;overflow: hidden;height: 32px; }
.Box .Box_con .conbox ul li .curbox{padding: 5px 10px;box-sizing: border-box;max-height: 180px;overflow: hidden;}
.Box .Box_con .conbox ul li .curbox span{display: block;list-style-type:disc;color: #999;font-size: 12px;line-height: 24px;overflow: hidden;height: 24px;transition: color .5s;}
.Box .Box_con .conbox ul li:hover {background: rgba(255,255,255,.4);cursor: pointer;}
.Box .Box_con .conbox ul li .imgBox{position: relative;}
.Box .Box_con .conbox ul li .imgBox .img-shade{position: absolute;top: 0;left: 0;width: 100%;height: 180px;z-index: 99;transition: background .5s;}
.Box .Box_con .conbox ul li:hover .imgBox .img-shade {background: rgba(0,0,0,.5);transition: background .5s;}
.Box .Box_con .conbox ul li:hover h3 {color: #54c3f1;text-decoration: underline;}
.Box .Box_con .conbox ul li:hover .curbox span {color: #666;transition: color .5s;}
.Box .BoxSwitch {margin-top: 30px;text-align: center;}
.Box .BoxSwitch span {display: inline-block;*display: inline;*zoom: 1;vertical-align: middle;width: 30px;height: 3px;background: #ccc;margin: 0 5px;cursor: pointer;}
.Box .BoxSwitch span.cur {background: #54c3f1;}

@media(max-width:1350px){
    .Box {margin-top: 30px}
    .Box .content{width: 695px;}
    .Box .Box_con .btn{top: 135px;}
    .Box .Box_con .conbox ul li{width: 225px;margin-left: 10px;height: 300px;}
    .Box .Box_con .conbox ul li img{height:155px;}
    .Box .Box_con .conbox ul li .imgBox .img-shade{height:155px;}
    .Box .Box_con .conbox ul li .curbox{max-height: 105px;}
}
@media(max-width:992px){
    .Box .content{width: 460px;}
}
@media(max-width:520px){
    .Box .content{width: 225px;}
    .Box .BoxSwitch span{width: 7px;height: 7px;border-radius: 7px;}
    .Box .Box_con .conbox ul li{margin-left: 5px;}
}
@media (orientation:portrait) and (max-width:420px) and (max-height: 820px){
    .Box .Box_con .btn{width: 20px;height: 20px;padding: 0;}
    .Box .Box_con .btnr{background: none;border: 2px solid;border-color:#fff #fff transparent transparent;transform: rotate(45deg);right: -45px;}
    .Box .Box_con .btnl{background: none;border: 2px solid;border-color:#fff #fff transparent transparent;transform: rotate(-135deg);left: -45px;}
    .Box .Box_con .btnr:hover {background: none;}
    .Box .Box_con .btnl:hover {background: none;}
    .Box .Box_con .conbox ul li {height: 200px;}
    .Box .Box_con .conbox ul li .curbox{display: none;}
}
@media(orientation:landscape) and (max-width:820px) and (max-height:420px){
    .Box {margin-top: 0;}
    .business .box{height: 280px;}
    .business .box .caption{margin-top:10px;}
    .cases .box{height: 280px;}
    .cases .box .caption{margin-top:10px;}
    .Box .Box_con .conbox ul li {height: 190px;}
    .Box .Box_con .conbox ul li .curbox{display: none;}
    .Box .Box_con .btn{width: 20px;height: 20px;padding: 0;}
    .Box .Box_con .btnr{background: none;border: 2px solid;border-color:#fff #fff transparent transparent;transform: rotate(45deg);right: -45px;top:75px;}
    .Box .Box_con .btnl{background: none;border: 2px solid;border-color:#fff #fff transparent transparent;transform: rotate(-135deg);left: -45px;top:75px;}
    .BoxSwitch{display: none;}
}