@charset "utf-8";

.list-main, .list-main .list-L, .list-main .list-R{
	height: 530px;
	box-sizing:border-box;}
@media screen and (max-width: 1280px) {
.list-main, .list-main .list-L, .list-main .list-R{
	height: 460px;
  	}
}
@media screen and (max-width: 1200px) {
.list-main, .list-main .list-L, .list-main .list-R{
	height: 400px;
  	}
}
@media screen and (max-width: 990px) {
.list-main, .list-main .list-L, .list-main .list-R{
	height: 285px;
  	}
}
@media screen and (max-width: 790px) {
.list-main, .list-main .list-L, .list-main .list-R{
	height: 235px;
  	}
}
.list-main .list-L{ 
	float:left;}

.list-main .list-R{
	float:right}
	
	
.list-main .list-L{
	width:42%;
	background-color:#a2c402;/*預設顏色*/
	color:#fff;
	padding:5% 
	}

.list-main .list-L h2{
	font-size:2em;
	margin-bottom:10px;
	font-weight:normal
 }

.list-main .list-L h3{
	font-size:4em;
	line-height:1.3;
	font-weight:normal;
	display:block
 }
@media screen and (max-width: 990px) {
.list-main .list-L h3{
	font-size:3em;
  }	
}

@media screen and (max-width: 790px) {
	
.list-main .list-L h2{
	font-size:1.6em;
  }		
.list-main .list-L h3{
	font-size:2.5em;
  }	
}


@media screen and (max-width: 420px) {
	
.list-main .list-L h2{
	font-size:1.3em;
  }		
.list-main .list-L h3{
	font-size:1.8em;
  }	
}

@media screen and (max-width: 340px) {
	
.list-main .list-L h2{
	font-size:1.3em;
  }		
.list-main .list-L h3{
	font-size:1.6em;
  }
  
	
}

.list-main .list-R{
	width:58%;
	}
 
	
.list-body{ clear:both}

.list-body .list-tit{
	padding:5%;
	/*box-sizing:border-box;*/
	background-color:#ebebeb;
	}	
@media screen and (max-width: 1200px) {
.list-body .list-tit{
	padding:4%;
 	}
	
.list-main .list-L{
	padding:4% 
	}		
}
@media screen and (max-width: 990px) {
.list-body .list-tit{
	padding:3.5%
 	}
	
.list-main .list-L{
	padding:3.5%
	}		
}

@media screen and (max-width: 790px) {
.list-body .list-tit{
	padding:20PX 3%
 	}
	
.list-main .list-L{
	padding:20PX 3%
	}			
}	

 
.list-main .list-L .more{
	font-size:2em;
	color:#fff;
	padding-right:34px;
	background:url(../images/icon/icon-ar-w.png) right center no-repeat;
	background-size:17.2px auto;
	margin-top:25px;
	display:block;
	float:left}
	
.list-main .list-L .more:hover, .list-main .list-L .more:focus{
	color:#FC0}
	
		
@media screen and (max-width: 420px) {

.list-main .list-L .more{
	font-size:1.4em;
	background-size: auto 13px;
	padding-right:22px;
  }
  
 .list-main .list-L{
	width:100%;
	height:auto
	}
.list-main .list-R{
	width:100%;
 	} 	 
}

 
.tit-social h2{
	font-size:5em;
	color:#000;
	float:left
}

@media screen and (max-width: 990px) {
.tit-social h2{
	font-size:3.5em;
 }		
}

@media screen and (max-width: 768px) {
.tit-social h2{
	font-size:3em;
 }		
}

@media screen and (max-width: 380px) {
.tit-social h2{
	font-size:2em;
 }		
}

.search-bar{
	background-color:#001e2c;
	padding:38px 4%;
	box-sizing:border-box;
	text-align:right}
  
.search-bar select{
	width:165px;
	max-width:45%;
	height:47px;
	padding:0 15px;
	line-height:45px;
	font-size:1.6em;
	color:#000;
	font-family:"微軟正黑體", Arial ;
	margin:0 8px;
	-webkit-appearance: nomal  !important}
@media screen and (max-width: 480px) {
.search-bar select{
	padding:0 10px;
	margin:0 3px;
	}	
}	
@media screen and (min-width: 769px) {
 .search-bar select:focus,
.search-bar select:hover{
	background-color:#f5f5f5;
	box-shadow:0 0 8px #F60;
	border:1px solid #F60;
	outline:1px solid #F60}
}

@media screen and (max-width: 768px) {
 .search-bar select:focus,
.search-bar select:hover{
	border:0px solid #000;
	outline:0px solid #333}
}
		
.list-wp{ margin-top:8px}/*列表區*/	

.list-wp .block-part{
	width:50%;
	float: left}

.list-wp .block-part > a{
	display:block;
	width:100%;
	height:350px;
	padding:10px;
	box-sizing:border-box}

@media screen and (max-width: 1280px) {
.list-wp .block-part > a{
 	height:290px;
 }	
}
@media screen and (max-width: 1200px) {
.list-wp .block-part > a{
 	height:270px;
 }	
}
@media screen and (max-width: 990px) {
.list-wp .block-part > a{
 	height:260px;
 }	
}
@media screen and (max-width: 860px) {
.list-wp .block-part > a{
 	height:230px;
 }	
}

@media screen and (max-width: 700px) {
.list-wp .block-part > a{
 	height:250px;
 }	
 
.list-wp .block-part{
	width:100%;
	float: none} 
}
@media screen and (max-width:500px) {
.list-wp .block-part > a{
 	height:220px;
 }	
 
}

@media screen and (max-width:480px) {
.list-wp .block-part > a{
 	height:160px;
	padding:0
 }	
.list-wp {
    margin-top: 0px;
} 
}
@media screen and (max-width:360px) {
.list-wp .block-part > a{
 	height:140px;
 }
}
.box-L > a {
	padding-left:0 !important}
	
.box-R > a {
	padding-right:0 !important}
	

@media screen and (max-width: 700px) {
.box-L > a {
	padding-right:0 !important}
	
.box-R > a {
	padding-left:0 !important}
}	

	
.block-part a .picbox{
	width:60%;
	height:100%;
	float:left}

.block-part a .txtbox{
	background-color:#f5f5f5;
	padding: 8% 5%;
	box-sizing:border-box;
	float:left;
	width:40%;
	height:100%;
	position:relative}



	
.block-part a:nth-child(odd) .picbox{/*方向修正*/
 	float: left}
.block-part a:nth-child(even) .picbox{/*方向修正*/
 	float: right}	

.block-part a .txtbox{
	background-color:#f5f5f5;
	padding: 8% 5%;
	box-sizing:border-box;
	float:left;
	width:40%;
	height:100%;
	position:relative}
		
.block-part a:nth-child(odd) .txtbox{/*方向修正*/
	float: right}	
.block-part a:nth-child(even) .txtbox{/*方向修正*/
	float: left}	


.block-part a:hover .txtbox, .block-part a:focus .txtbox{ 
	background-color:#a2c402;
	color:#fff !important}
	
.block-part .txtbox h3{
	font-size:1.6em;
	margin-bottom:15px;
	color:#000
	 }	
	 
.block-part .txtbox h4{
	font-size:2.2em;
 	color:#000;
	line-height:1.5;
	font-weight:normal
	 }	
@media screen and (max-width: 1500px) {
.block-part .txtbox h4{
	font-size:2em;
 }		
	}	 
@media screen and (max-width: 990px) {
	 
.block-part .txtbox h4{
	font-size:1.8em;
 }		
}	 
@media screen and (max-width: 480px) {
	 
.block-part .txtbox h4{
	font-size:1.5em;
 }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 		
}	 
	 
	 
.block-part a:hover .txtbox h3,
.block-part a:focus .txtbox h3, 
.block-part a:hover .txtbox h4,
.block-part a:focus .txtbox h4{
	color:#fff;}
		 
/*三角形*/

.block-part a .txtbox:before {
    content: "";
    position: absolute;
    z-index: 5;
    margin: auto 0;height: 0;
	border-style: solid;
 }	  


.block-part a:nth-child(odd):hover .txtbox:before,
.block-part a:nth-child(odd):focus .txtbox:before { /*三角形變色預設*//*ID套程式 可改顏色*/
	border-color: transparent #a2c402 transparent transparent;
	left: -19px; top: 0;bottom: 0;
    border-width: 20px 25px 20px 0;
	}
	
.block-part a:nth-child(even) .txtbox:before{
	top: 0;
    bottom: 0;
    right: -19px;
    border-style: solid;
    border-width: 20px 0px 20px 25px;
    border-color: transparent transparent transparent #f5f5f5;
	}
 	
.block-part a:nth-child(odd) .txtbox:before{ /*文字區變色預設*/ 
	border-color: transparent #f5f5f5 transparent transparent;
	left: -19px; top: 0;bottom: 0;
    border-width: 20px 25px 20px 0;
	}	
.block-part a:nth-child(even):hover .txtbox:before,/*ID套程式 可改顏色*/
.block-part a:nth-child(even):focus .txtbox:before{
	top: 0;
    bottom: 0;
    right: -19px;
    border-style: solid;
    border-width: 20px 0px 20px 25px;
    border-color: transparent transparent transparent #a2c402;
	}
	
@media screen and (max-width: 380px) {
 
.block-part a .picbox{
	width:50%;
}

.block-part a .txtbox{

	width:50%;
}




}