.works{padding:0;background:#fff}
.works ul{display:block}
.works ul li{overflow:hidden;float:left;position:relative;cursor:pointer; height:auto;}
.works ul li img.ratio{display:block;width:100%;height:auto;opacity:0;*filter:Alpha(opacity=0)}
.works ul li .image img{display:block;/*position:absolute;*/left:0;top:0;width:100%;height:100%;z-index:1}
.works ul li .describe{opacity:0;position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}
.works ul li .describe .hover{background:#000;opacity:.7;display:block;position:absolute;left:0;top:0;width:100%;height:100%; color:#fff;}
.works ul li .describe .hover img{visibility:hidden}
.works ul li .describe{font-size:15px;color:#fff}
.works ul li .describe span.block{display:block;position:absolute;left:50px;top:50px;right:50px}
.works ul li .describe span.title a{text-decoration:none;font-size:18px; line-height:30px; letter-spacing:1px; color:#fff;}
.works ul li .describe span.bottom{top:auto;bottom:50px}
.works ul li .describe span.block{line-height:150%; color:#fff;}
.works ul li .describe span.block a{ color:#fff;}
.works ul li .describe span.block span.h4{display:block;font-size:18px;margin-bottom:10px; line-height:30px;}
.works ul li .describe span.block hr{width:10px;margin:10px 0; border-bottom:1px solid #fff}
.works ul li:hover .describe{opacity:1}
.works ul li:hover .image img{transform:scale(1.05)}
.works .more{background:#fff}
.works_detailed{}.works_detailed .describe{background:#999}
.works_detailed .describe .div{color:#fff}
.works_detailed .describe .div span{display:block}
.works_detailed .describe .title{font-size:40px;line-height:100%;margin-bottom:20px}

.works_detailed .describe .subtitle{font-size:18px;margin-bottom:30px}
.works_detailed .describe .content{font-size:15px}
.works_detailed .describe .left{}.works_detailed .describe .right{}.works_detailed .describe .right hr{width:50px;margin:20px 0;border-bottom:5px solid #fff}
.works_detailed .content img{display:block;width:100%}


.max_width{max-width:1920px!important;*width:expression(this.offsetWidth<1920?'auto':'1920px')}
img{border:0}
img.ratio{display:block;width:100%;height:auto;opacity:0;*filter:Alpha(opacity=0)}
img.gray{cursor:pointer;filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:url(../js/desaturate.svg#greyscale);filter:gray}
.ke-pagebreak{display:none}
i.vertical_middle{width:0;display:inline-block;height:100%;vertical-align:middle}
.ease_in_out,.ease_in_out:hover{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
.ease_in_out_fast,.ease_in_out_fast:hover{-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out}
#ShowLayer ul, li, ol {
    list-style-type: none;
    list-style-position: outside;
}

hr {
    clear: both;
    border: 0;
    margin: 20px 0;
    padding: 0;
    height: 1px;
    line-height: 1px;
    font-size: 0;
    border-bottom: 1px solid #ccc;
}

.page_width_max{padding-left:50px;padding-right:50px;max-width:1750px!important;    margin: 0 auto;*width:expression(this.offsetWidth<1750?'auto':'1750px')}


@media screen and (max-width:680px){
	.works ul li .describe{font-size:12px;color:#fff}
	.works ul li{width:100%; /*height:7rem;*/}
	.works ul li .describe span.block{left:20px;right:20px}
	.page_width_max{padding-left:00px;padding-right:00px;max-width:1750px!important; height:1.5rem;   margin: 0 auto;*width:expression(this.offsetWidth<1750?'auto':'1750px')}
	.works_detailed .describe .subtitle{font-size:14px;margin-bottom:20px}
.works_detailed .describe .content{font-size:14px}
.works ul li .describe span.title a{text-decoration:none;font-size:14px; line-height:25px; letter-spacing:1px; color:#fff;}
.works ul li .describe span.block span.h4{display:block;font-size:14px;margin-bottom:3px; line-height:20px;}
.home_modules div{font-size:12px}
.works ul li .describe span.block{line-height:150%; color:#fff; font-size:12px;}
}

@media (min-width: 992px) {
.works ul li {
    width:49%;
    
}
}
@media (min-width: 1100px) {
.works ul li {
   width:49%;
}
}

/*
@media (min-width: 440px) {
.works ul li {
    width:100%;
    height: 2.8rem;
}
}
@media (min-width: 680px) {
.works ul li {
    width:100%;
    height: 2.8rem;
}
}*/
@media (min-width: 800px) {
.works ul li {
    width:49%;
}
}
@media (min-width: 900px) {
.works ul li {
    width:49%;
}
}
/*@media (min-width: 1050px) {
.works ul li {
    width:450px;    height: 333px;
}
}
@media (min-width: 1100px) {
.works ul li {
    width:510px;
    height: 425px;
}
}
*/
@media (min-width: 1200px) {
.works ul li {
   width:33.33%;
}
}
@media (min-width: 1250px) {
.works ul li {
   width:33.33%;
}
}
@media (min-width: 1300px) {
.works ul li {
      width:33.33%;
}
}
@media (min-width: 1400px) {
.works ul li {
 
   width:33.33%;
}
}
@media (min-width: 1500px) {
.works ul li {
  width:33.33%;
}
｝