.sub_class {border-top:1px solid #ccc;text-align:center;padding:50px 0px;}
.sub_class li {color:#999;display:inline-block;*display:inline;*zoom:1;border:1px solid #cccccc;margin:0px 15px;}
.sub_class li a {text-decoration:none;display:block;font-size:16px;padding:3px 15px;}
.sub_class li:hover, .sub_class li.on {color:#666;border-color:#FFF418;background:#FFF418;}

.works .list_image {margin:0px 0px 0px 0px;width:100%;background-color:#fff;}
.works ul {width:100%;}
.works ul li {width:25%;margin-right:0%;margin-bottom:0%;display:inline-block;*display:inline;*zoom:1;vertical-align:top;position:relative;}
.works ul {width:101%;}
.works ul li {width:32.33%;margin-right:1%;margin-bottom:1%;}
.works ul li .div {width:100%;padding-bottom:92%;overflow:hidden;position:relative;}
.works ul li a, .works ul li img {display:block;position:absolute;left:0px;top:0px;width:100%;height:100%;text-decoration:none;}
.works ul li .hover, .works ul li .describe {opacity:0;*filter:Alpha(opacity=0);z-index:2;}
.works ul li .hover {background-color:#000;}
.works ul li .hover hr {display:none;}
.works ul li .hover span {opacity:0;*filter:Alpha(opacity=0);z-index:1;}
.works ul li .describe {z-index:3;font-size:15px;left:10%;top:auto;right:auto;bottom:0%;width:auto;height:auto;max-width:80%;line-height:180%;color:#fff;}
.works ul li .describe b {display:block;font-weight:normal;font-size:20px;}
.works ul li .describe b br {display:none;}
.works ul li .describe b hr {display:inline-block;*display:inline;*zoom:1;width:0px;height:0px;margin:10px 0px 3px 0px;border-bottom:3px solid #fff;}

.works ul li:hover .hover {opacity:0.8;*filter:Alpha(opacity=80);}
.works ul li:hover .describe {opacity:1;*filter:Alpha(opacity=100);bottom:15%;}
.works ul li:hover .describe hr {width:100%;width:80px;}

.works ul.max {width:101%;}
.works ul.max li {width:32.33%;margin-right:1%;margin-bottom:1%;background:#fff;}
.works ul.max li .image {z-index:3;}
.works ul.max li .hover {background-color:transparent !important;z-index:4;}
.works ul.max li .hover hr {display:inline-block;*display:inline;*zoom:1;width:0px;height:0px;margin:10px 0px 3px 0px;border-bottom:3px solid #fff;}
.works ul.max li .hover span {color:#fff;font-size:15px;text-decoration:none;position:absolute;top:0px;bottom:0px;left:0px;right:0px;padding:10%;padding-top:0px;}
.works ul.max li .hover div {background-color:#000;position:absolute;top:0px;bottom:0px;left:0px;right:0px;opacity:0;*filter:Alpha(opacity=0);}
.works ul.max li .hover span a {display:inline !important;position:static !important;}
.works ul.max li .describe {bottom:0%;position:relative;opacity:1;*filter:Alpha(opacity=100);padding:20px 0px 30px 0px;left:0%;right:0%;max-width:100%;color:#999 !important;z-index:5;background:#fff;}
.works ul.max li .describe b {color:#000 !important;}
.works ul.max li .describe hr {display:none !important;}
.works ul.max li:hover .image img {transform:scale(1.05);}
.works ul.max li:hover .hover {display_:none;opacity:1;*filter:Alpha(opacity=100);}
.works ul.max li:hover .hover hr {width:80px;}
.works ul.max li:hover .hover span {opacity:1;*filter:Alpha(opacity=100);padding-top:10%;}
.works ul.max li:hover .hover div {opacity:0.8;*filter:Alpha(opacity=80);}
.works ul.max li:hover .describe b {color:#000 !important;}

.works .list_logo {background-color:#000;}
.works ul.logo {width:100%;background-color:#000;}
.works ul.logo li {width:25%;margin-right:0%;margin-bottom:0%;background-color:#000;}
.works ul.logo li .image {opacity:0;*filter:Alpha(opacity=0);z-index:3;}
.works ul.logo li .hover {opacity:1;*filter:Alpha(opacity=100);}
.works ul.logo li .hover img {visibility:visible !important;}
.works ul.logo li .describe {display:none;}
.works ul.logo li:hover .image {opacity:1;*filter:Alpha(opacity=100);}

.works ul.name {width:100%;}
.works ul.name li{FONT-WEIGHT: 100;width:24%;margin-right:0%;margin-bottom: 4;}
@media screen and (max-width: 720px) {
.works ul.name li {width:97%;margin-right:0%;margin-bottom:0%;}
}
.works ul.video li {background-color:#000;}
.works ul.video li .hover {background:url(../images/videoplay.png) center center no-repeat;background-size:auto 100%;}
.works ul.video li .describe {right:10%;text-align:center;}
.works ul.video li .describe hr {display:none;}
.works ul.video li:hover .hover {opacity:1;*filter:Alpha(opacity=100);background-color:rgba(0,0,0,0.8);}
.works ul.video li:hover .describe {bottom:12%;}

/**
.works_title {position:absolute;left:0px;width:100%;height:100%;}
.works_title.banner_none {position:relative;left:0px;width:100%;height:400px;background:#666;}
.works_title .banner_mask {position:absolute;left:0px;width:100%;height:100%;z-index:1;background-color:rgba(0,0,0,0.5);}
.works_title .page_title {padding:0px;background:inherit;top:20%;position:relative;z-index:2;}
.works_title h1, .works_title h3, .works_title h4 {text-align:left;color:#fff;line-height:150%;text-shadow:2px 2px 5px rgba(0,0,0,0.3);}
.works_title .page_title h3 {margin-top:30px;font-size:18px;}

.works_title h4 {line-height:200%;font-size:15px;position:absolute;left:0px;bottom:10%;z-index:2;}

.works_title .page_share {display:none;}
.works_title .page_share div {line-height:330%;}
**/

.works_title {width:49%;float:left;}
.works_title span {display:block;}
.works_title .title {font-size:40px;line-height:100%;margin-bottom:20px;}
.works_title .subtitle {font-size:18px;margin-bottom:30px;}
.works_describe {width:49%;float:right;font-size:15px;}
.works_describe span {display:block;}
.works_describe hr {width:50px;margin:20px 0px;border-bottom:5px solid #fff;}

.works_detailed.content .brand {clear:both;text-align:center;position:relative;padding:100px 50px;background:url(../images/works_brand_bg.gif) center center no-repeat;background-size:100% 100%;}
.works_detailed.content .brand h1 {clear:both;padding:20px;font-size:70px;font-weight:bold;color:#A0A2A1;}
.works_detailed.content .brand .seal {display:block;position:absolute;right:10%;bottom:15%;width:168px;height:168px;background:url(../images/works_brand_seal.gif) center center no-repeat;background-size:100% 100%;}
.works_detailed.content .brand hr {position:absolute; left:50%; top:32%; bottom:15%; width:0px; height:auto; border:1px solid #A0A2A1;}
.works_detailed.content .brand div {display:inline-block;*display:inline;*zoom:1; width:47%;padding-left:1%;padding-right:1%;}
.works_detailed.content .brand div img {margin:auto; padding:0px; border:0px; display:block; width:auto; max-width:100%;}

.works_detailed.content {padding:80px 0px;}
/**
.works_detailed.content h1, .works_detailed.content h2, .works_detailed.content h3, .works_detailed.content p {margin-left:auto;margin-right:auto;padding-left:50px; padding-right:50px; max-width:720px ! important; *width:expression(this.offsetWidth < 720 ? 'auto' : '720px');}
**/
.works_detailed.content img {margin-left:auto;margin-right:auto;display:block;}
.works_detailed.content h1, .works_detailed.content h2, .works_detailed.content h3, .works_detailed.content p, .works_detailed.content div {color:#000;font-size:16px;}
.works_detailed.content h1 {font-size:60px;}
.works_detailed.content h2 {font-size:48px;font-weight:bold;}
.works_detailed.content h3 {font-size:40px;}

.works_detailed.content div img {width:50%;height:auto;display:inline-block;*display:inline;*zoom:1;}
.works_detailed.content div img {border-left:8px solid #fff;border-right:8px solid #fff;margin-left:-8px;margin-right:-8px;}





.works_extend {padding:30px 40px 10px 40px;background:#f2f2f2;}
.works_extend li {width:30%;line-height:200%;color:#666;}
.works_extend li h4 {font-weight:bold;margin-bottom:10px;color:#000;}

.content_nav {text-align:center;}
.content_nav li {display:inline-block;*display:inline;*zoom:1;margin:0px 10px;}
.content_nav a {text-decoration:none;font-size:20px;line-height:100%;background:#f2f2f2;color:#000;padding:20px;}
.content_nav a:hover {background:#666;color:#fff;}