﻿
ul.case-nav {
    max-width: 898px;
    height: 100%;
    margin: 0 auto;
    background: #DEDBDB;
}
.case-nav li {
    float: left;
    font-size: 23px;
    width: 33.3%;
    height: 100%;
    text-align: center;
    line-height: 100%;
    cursor: pointer;
    color: #0A3151;
    background: #DEDBDB;
}
.case-nav li a{
    text-decoration:none;
    color: #0A3151;
    display: block;
    height: 100%;
    width: 100%;
    line-height: 100px;
}
/*.case-nav .current {*/
    /*background-color: #D40101;*/
    /*color: #FFFFFF;*/
    /*height: 100%;*/
    /*width: 33.3%;*/
    /*text-align: center;*/
    /*line-height: 100px;*/
/*}*/
.case-nav .current a{
    display: block;
    background-color: #D40101;
    color: #FFFFFF;
    height: 100%;
    width: 100%;
    text-align: center;
    line-height: 100px;
}
.case-list{
    max-width: 898px;
    margin: 0 auto;
    height: auto;
    margin-top: 5%;
    display: block;
}
.case-img{
    width: 32.3%;
    height: 239px;
    float: left;
    display: inline;
    position: relative;
    margin-bottom: 16px;
    margin-right: 1%;
    text-align: center;
    overflow: hidden;
    zoom: 1;
}
.case-img #div1 {
    width: 100%;
    height: 50px;
    float: left;
    display: block;
    position: absolute;
    z-indent: 2;
    margin: 0px;
    background-color: rgba(0, 0, 0, 0.5);
    top: 189px;
}

.case-img #div1 .p1 {
    text-align: center;
    color: #fff;
    font-size: 18px;
    line-height: 50px;
    font-family: '宋体';
}

.case-show{
    max-width: 875px;
    margin: 0 auto;
    height: auto;
    position: relative;
}
.case-top{
    margin-top: 4%;
    height: 50px;
}
.crumb{
    float: left;
    color: #D40101;
}
.crumbs{
    display:block;
    float: right;
}
.crumbs a{
    color: #000000;
}

.case_list{
    width: 18%;
    height: 150px;
    float: left;
    margin-top: 3%;
    border-style: solid;
    border-width: 1px;
}
.case_list li{
    padding-top: 14px;
    height: 32px;
    text-align: center;
}
.case_list li a{
    color: #000000;
}
.case_list p{
    padding:  10px 0 10px;
}
.case_content{
    max-width: 80%;
    float: right;
}

.case_title{
    margin-top: 2%;
    height: 57px;
    text-align: center;
    font: 25px/40px "Microsoft Yahei";
}

.case_img{
    width:70%;
    margin:0 auto;
}
.summary{
    margin-top: 3%;
}
.commend{
    margin-top: 3%;
    height: auto;
    overflow: hidden;
    position: relative;
}

.commend-img{
    width: 40%;
    height: 250px;
    float: left;
    display: inline;
    position: relative;
    text-align: center;
    overflow: hidden;
    zoom: 1;

}
.commend #img1{
    float: left;
}
.commend #img2{
    float: right;
}
.commend-img #div1 {
    width: 100%;
    height: 50px;
    float: left;
    display: block;
    position: absolute;
    z-indent: 2;
    margin: 0px;
    background: #000000;
    opacity: 0.6;
    top: 200px;
}
#Article{
    width: 100%;
    overflow: hidden;
}
.commend-img .p1{
    color: #fff;
    height: 100%;
    line-height: 50px;
    text-align: center;
    font-family: '宋体';
}


@media screen and (max-width:1024px){
    .case-show{width: 90%!important;}
}
@media screen and (max-width:940px){
    .case-list{width: 90%!important;}
}
@media screen and (max-width:640px){
    .case_list{font-size: 13px;}
    .commend-img{height: 200px;}
    .commend-img #div1{top: 155px;height: 45px;font-size: 14px;}
    .case-list{width: 96%!important;}
}
@media screen and (max-width: 481px){
    .case_list{font-size: 10px;}
    .case-nav li {  font-size: 18px!important;  }
    .commend-img{height: 180px;}
    .commend-img #div1{top:135px;font-size: 13px;}
    .commend-img #div1 .p1{font-size: 14px;}
    .case-img{width: 48%;  margin: 1% 1%;height: 189px!important;}
    .case-img #div1{height: 40px!important;top: 149px!important;}
    .case-img #div1 .p1{line-height: 40px!important;font-size: 16px!important;}
}
@media screen and (max-width: 375px){
    .commend-img {    height: 150px!important;}
    .commend-img #div1{  top:115px!important;height: 35px}
    .commend-img #div1 .p1{font-size: 12px;line-height: 35px;}
    .case_list{font-size: 8px;}
    .case-nav li {  font-size: 16px!important;  }
    .case-img #div1 .p1{font-size: 12px;}
}