.in_titiel{ margin-top:-50px; margin-bottom:0px;}



/*--------作品內容----------------------------------------------------*/
.works_content_box{ text-align:left; width:100%; margin-bottom:20px;}
.works_content_box_titiel{  margin-top:45px;  }
.works_content_box_titiel .works_list_title{font-size:20px; line-height:30px; color:#333333; overflow:hidden; padding:0px ; margin:0; font-weight:500;display:inline-block; width:100%;  }

.works_list_title span.time{ font-size:11px; line-height:20px;  margin-top:6px; display:inline-block; float:right; margin-left:20px; font-weight:100; }
/*--文字區--*/
.works_content_main_img{ text-align:center;}
.works_content_main_img img{ width: auto; height:auto; margin:15px 0;}
.works_content_text{text-align:center; margin-bottom:20px;}
.works_content_text p{ text-align:left; font-size: 15px; line-height:30px;    color: #666; margin: 25px 0;}
.works_content_text img{ width: auto; height:auto; margin:15px 0;}





/*-----作品--------------------------------------------------------*/
.works_content{ color:#2f2f2f; padding: 0; margin:0}
.works_content hr{ margin:15px 0;}

.woeks_top_text{ font-size:14px; line-height:30px; color:#666; text-align:left; margin-top:80px;}
.woeks_bottom_text{ font-size:18px; line-height:30px; color:#EEE; text-align:left; margin:15px 0 20px 0;background-color: #333;padding-top:3px;padding-bottom:3px;padding-left:10px;}


/*-----------*/
.woeks_box{}

.woeks_box .tab-content{ margin:50px 0;}

.woeks_box .nav-tabs{ text-align:center;border-bottom: none; margin-top:30px;}
.woeks_box .nav-tabs li{ float:none; display:inline-block;}

.woeks_box .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: #555;
    cursor: default;
    background-color: inherit;
    border: none;
    border-bottom-color: transparent;
}
.woeks_box .nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius:  0;
	color:#333;
}

.woeks_box .nav>li>a {
    position: relative;
    display: block;
    padding: 5px 15px;
}
.woeks_box .nav-tabs>li.active a{  background-color:#5ba978; color:#FFF; }
.woeks_box .nav-tabs>li.line{ width:1px; height:15px; border-left:1px solid #666;}
.woeks_box .nav>li>a:hover{ background-color:#5ba978; color:#FFF;}


/*----------------*/
.works_list{ position:relative; overflow:hidden;
	 margin-bottom:30px;
	transition-duration: 0.5s;		/* 不支援IE瀏覽器 */
	-moz-transition-duration: 0.5s;		/* Firefox 使用的語法 */
	-webkit-transition-duration: 0.5s;	/* Chrome、Safari 使用的語法 */
	-o-transition-duration: 0.5s;		/* Opera 使用的語法 */}
.works_list a:hover{ text-decoration:none;}
.works_img{ overflow:hidden; position:relative; text-align:center; height: 150px;}
.works_img img.works_img_under{ width:100%; height:auto; 
transition-duration: 0.5s;		/* 不支援IE瀏覽器 */
	-moz-transition-duration: 0.5s;		/* Firefox 使用的語法 */
	-webkit-transition-duration: 0.5s;	/* Chrome、Safari 使用的語法 */
	-o-transition-duration: 0.5s;		/* Opera 使用的語法 */} 
.works_img_top { position:absolute; top:1.2%; left:50%; margin-left:-49%; padding:5px; border:1px solid #FFF; width:98%; height:auto; z-index:10;}
.works_text{ position:absolute; left:0; bottom:-100px; width:100%; padding:5px 10px;   margin-top:1px;   text-align:left; background-color:rgba(51,51,51,0.6); opacity:0;
	transition-duration: 0.5s;		/* 不支援IE瀏覽器 */
	-moz-transition-duration: 0.5s;		/* Firefox 使用的語法 */
	-webkit-transition-duration: 0.5s;	/* Chrome、Safari 使用的語法 */
	-o-transition-duration: 0.5s;		/* Opera 使用的語法 */}
.works_list a:hover{ text-decoration:none;}
.works_text .works_title{ font-size:16px; line-height:28px; color:#FFF; height:28px; font-weight:600; overflow: hidden; text-overflow : ellipsis;  white-space : nowrap; margin:5px 0 0 0 ; clear:both; opacity:0;
-moz-transition-duration: 0.8s;		/* Firefox 使用的語法 */
	-webkit-transition-duration: 0.8s;	/* Chrome、Safari 使用的語法 */
	-o-transition-duration: 0.8s;		/* Opera 使用的語法 */}
.works_text .works_tt{ font-size:14px; line-height:32px; color:#FFF; height:95px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical; text-align:justify;  }
.works_text .time{ font-size:12px; line-height:20px; color:#FFF; float: right;}
.works_text .icon_see{ font-size:12px; line-height:20px; color:#FFF; float:left;}
.works_text .icon_see i{ font-size:15px; line-height:20px; margin:0 5px;}

/*--HOVER--*/
.works_img:hover img.works_img_under{ -webkit-transform: scale(1.1);  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);}
.works_list:hover .works_text{ position:absolute; left:0; bottom:0px; opacity:1;}
.works_list:hover .works_title{ opacity:1;}



/*===================================================================*/
@media (min-width: 992px){

	
}
@media (max-width: 1200px){

}

@media (max-width: 991px){
.in_titiel{ margin-top:0px;}
	
/*--文字區--*/
.works_content_main_img img{ width: 100%; height:auto; margin:15px 0;}
.works_content_text img{ width: 100%; height:auto; margin:15px 0;}
.works_img {
	height: 220px;
}
}
@media (max-width: 768px){
	
	

}
