@charset "utf-8";
@media (max-width: 1186px) {
	
}
@media (max-width: 1127px) {
	
}
@media (max-width: 1090px) {
	
}
@media (max-width: 1070px) {
	BODY, HTML{
		
	}
	.desktop{
		display:none !important;
	}
	.mobile{
		display:block !important;	
	}
	table{
		float:left;
		width:100% !important;
	}
	table img{
		width:40% !important;
		margin-left:10px !important;
		margin-right:10px !important;
	}
	
	
	/*bodyContainer start*/
	#bodyContainer{
		width:100%;
		float:left;
		margin-top:108px;
		background-color:#FFFFFF;
	}
	#bodyContainer .bodyWrapper{
		margin:0 auto;
		max-width:100%;
	}
	#bodyContainer .headTitleWrapper h1{
		margin-right:0;
		width:100%;
		padding-bottom:10px;
		font-size:50px;
	}
	#bodyContainer .headTitleWrapper span{
		font-size:14px;
	}

	#bodyContainer .headTitleWrapper div{
		width:100%;
		font-size:12px;
	}
	/*bodyContainer end*/

	/*headContainer start*/
	#headContainer .headLogo img{
		height:40px;
	}
	#headContainer .headMenu{
		top:20px;
		right:20px;
	}
	#headContainer .headMenu img{
	width:20px;
}
	#headContainer .headLine{
		width:calc(100% - 40px);
		margin-left:20px;
		margin-right:20px;
		z-index: 10;
    	position: absolute;
	}
	#headContainer .headText{
		width:100%;
		padding-left:0;
		padding-right:0;	
	}
	/*headContainer end*/
	
	
	

	
	/*homeContainer start*/
	#homeContainer .slideWrapper{
		width:100%;
		float:left;
		
	}
	#homeContainer .slideWrapper .slideImg{
		float:left;
		width:calc(100% - 80px);
		background-size: cover;
		padding: 380px 40px 40px 40px;
		border-radius:20px;
		background-position: center center;
		background-repeat: no-repeat;
		background-attachment: inherit;
		
	}
	#homeContainer .slideWrapper .slideText{
		overflow-wrap: break-word;	
	}	
	#homeContainer .slideWrapper .slideText h2{
		font-size:40px;
		line-height: 50px;
	}
	#homeContainer .slideWrapper .slideText h2 span{
		font-size:25px;	
	}
	#homeContainer .aboutWrapper{
		width:calc(100% - 0px);
		padding-left:0px;
		padding-right:0px;
	}
	#homeContainer .aboutWrapper .img{
		flex: 0 0 calc(100% - 0px);
		padding-bottom:40px;
	}
	#homeContainer .aboutWrapper .text{
		flex: 0 0 calc(100% - 0px);
	}
	#homeContainer .projectWrapper{
		padding-bottom:0;	
	}
	#homeContainer .projectWrapper .grid{
		flex: 0 0 calc(100% - 0px);
		position:relative;
		text-align:center;
		padding-bottom:40px;
	}
	#homeContainer .projectWrapper  a{
		bottom:80px;
	}
	/*homeContainer end*/

	
	
	
	
	
	
	
	
	
	
	/*serviceContainer start*/
	#serviceContainer .serviceImgText h1{
		font-size:40px;
	}
	#serviceContainer .serviceImgWrapper{
		background-attachment: inherit;	
	}
	#serviceContainer .serviceTextWrapper h1{
		font-size:40px;
	}
	/*serviceContainer end*/
	
	
	
	/*projectContainer start*/	
	#projectContainer{
		border-top:2px solid #000000;
	}
	#projectContainer .projectGrid{
		flex: 0 0 calc(100% - 0px);
		display:none;
	}
	#projectContainer .projectGridMobile{
		display:block;
		width:calc(100% - 20px);
		float:left;
		padding-top:15px;
		padding-bottom:15px;
		border-bottom:1px solid #000000;
		padding-left:10px;
		padding-right:10px;
		font-weight:lighter;
		font-size:20px;
		font-family: "Times New Roman";
	}
	#projectContainer .projectGridMobile font{
		font-family:'Arial', "微軟正黑體";
		font-size:17px;
	}
	#projectContainer .projectGridMobile:hover{
		background-color:#f9f5eb;
	}
	
	/*projectContainer end*/

	
	
	
	/*collaborationContainer start*/
	#collaborationContainer .collaborationTextWrapper span{
		font-size:20px;	
	}
	#collaborationContainer .grid{
		flex: 0 0 calc(100% - 0px);
		padding-bottom:40px;
	}
	/*collaborationContainer end*/
	
	
	
	/*aboutContainer start*/
	#aboutContainer .aboutTextWrapper ul li{
		background-position:left 5px;
	}
	/*aboutContainer end*/
	
	
	
	/*clientContainer start*/
	#clientContainer .clientDesktop{
		display:none;
	}
	#clientContainer .clientMobile{
		display:block;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#clientContainer .clientGrid{
		flex: 0 0 calc(25% - 10px);
		padding-bottom:20px;
		position:relative;
		text-align:center;
	
	}
	/*clientContainer end*/

	
	
	
	/*tailContainer start*/
	#tailContainer{
		padding-top:50px;
		padding-bottom:50px;
	}
	#tailContainer .tailWrapper{
		margin:0 auto;
		width:calc(100% - 80px);
		max-width:100%;
		padding-left:40px;
		padding-right:40px;
	}
	#tailContainer .tailGrid{
		width:100%;
		padding-left:0;
		padding-right:0;
		margin-bottom:50px;
		float:left;
	}
	#tailContainer .tailCopyright{
		float:left;
		width:100%;
		padding-top:0;
		padding-left:0;
		padding-right:0;
		text-align:center;
	}
	/*tailContainer end*/

	
	
}