@charset "utf-8";
/* CSS Document */

.footer{
	color: #FFF;
}
.footer .groupLinks{
	background: #fe000c;
	border-radius:50px 0 0 0;
	-moz-border-radius:50px 0 0 0;
	clear: both; 
}
.footer .groupLinks .slideToggleButton{
	cursor: pointer;
}
.scrollTop{
	width: 50px;
	height: 50px;
	background: url(../images/all/whiteArrowTop.svg) no-repeat center #fe000c;
	background-size: 26px 26px;
	float: right;
	margin-right: 5vw;
	cursor: pointer;
	border-radius: 5px 5px 0 0;
	transition: all .3s;
}
.scrollTop:hover{
	background: url(../images/all/whiteArrowTop.svg) no-repeat 50% 30% #fe000c;
	background-size: 26px 26px;
	transition: all .3s;
}

/*footer紅色區域slideToggle內容*/
	.footer .groupLinks #centerContent01{
		font-size: 0;
	}
	.footer .groupLinks #centerContent01 li{
		float: left;
	}
	.footer .groupLinks #centerContent01 li.logo{
		width: 13%;
	}
	.footer .groupLinks #centerContent01 li.companyList{
		float: right;
		display: none;
	}
	.footer .groupLinks #centerContent01 li.logo img,
	.footer .groupLinks #centerContent01 li.companyList img{
		width: 100%;
	}
	.footer .groupLinks #centerContent01 li.item,
	.footer .groupLinks #centerContent02 ul{
		width: 83%;
		float: right;
	}
	.footer .groupLinks #centerContent01 li.item div{
		cursor: pointer;
	}

	.footer .groupLinks #centerContent02{
		display: none;
		padding: 0 20px 20px 20px;
		width: 100%;
		max-width: 1240px;
		margin: 0 auto;
		box-sizing: border-box;
		overflow: hidden;
		font-size: 0;
	}
	.footer .groupLinks #centerContent01 li.item div,
	.footer .groupLinks #centerContent02 li{
		display: inline-block;
		vertical-align: top;
		box-sizing: border-box;

		width: 11%;
		/***
			width若更改，
			也需更改.footer .groupLinks #centerContent02 li.li_2的寬度
		***/
	}
	.footer .groupLinks #centerContent01 li.item div{
		font-size: 14px;
		margin-top: 5px;
	}
	.footer .groupLinks #centerContent02 li div{
		margin-bottom: 5px;
		box-sizing: border-box;
		padding-right: 7px;
	}
	.footer .groupLinks #centerContent02 li.li_2{
		width: 22%;
		/***
		此寬度是
		.footer .groupLinks #centerContent01 li.item div,
		.footer .groupLinks #centerContent02 li
		css---->>>> width的2倍
		***/
	}
	.footer .groupLinks #centerContent02 li.li_2 div{
		width: 50%;
		float: left;
	}
	.footer .groupLinks #centerContent02 div.pcNone a{
		font-size: 14px;
		line-height: inherit;
		display: none;
		font-weight: 500;
	}
	.footer .groupLinks #centerContent02 div a{
		display: block;
		font-size: 14px;
		line-height: 1.5;
		font-size: 13px;
		margin-bottom: 5px;
	}
	.footer .groupLinks #centerContent02 div a:hover{
		text-decoration: underline;
	}
	.footer .groupLinks #centerContent02 div a.noLink:hover{
		text-decoration: none;
	}
	.footer .groupLinks #centerContent02 div a span{
		color: #FFCCCF;
	}
	.footer .groupLinks #centerContent02 div p{
		color: #FFCF5E;
		font-size: 14px;
		line-height: 1.5;
	}
	.footer .groupLinks #centerContent02 div h4{
		width: 100%;
		padding: 0;
		display: none;
	}


.footer .footerInfo{
	background: #333333;
	overflow: hidden;
}
.footer .footerInfo .centerContent,
.footer .groupLinks .centerContent{
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 30px 20px;
	box-sizing: border-box;
	overflow: hidden;
	font-size: 0;
}
.footer a{
	color: #FFF;
	text-decoration: none;
}
.footer .footerInfo .left{
	float: left;
	width: 50%;
}
.footer .footerInfo .left p{
	font-size: 14px;
}
.footer .footerInfo .left div{
	font-size: 36px;
	color: #FFB700;
}
.footer .footerInfo .left img{
	width: 33px;
	display: inline-block;
	vertical-align: middle;
}
.footer .footerInfo .left span{
	display: inline-block;
	vertical-align: middle;
}

/*fb.line.youtube*/
	.footer div.followLinks{
		float: right;
		width: 50%;
		text-align: right;
		margin-bottom: 10px;

	}
	.footer div.followLinks a{
		width: 46px;
	    height: 46px;
	    margin: 5px;
	    text-align: center;
	    font-size: 100px;
	    line-height: 420px;
	    border-radius: 100em;
	    background-size: cover;
	    display: inline-block;
	    vertical-align: middle;
	}
	.footer div.followLinks a.facebook{
	    background-image: url("../images/footer/facebook.svg");   
	}
	.footer div.followLinks a.facebook:hover{
	    background-image:linear-gradient(#4267b2, #4267b2),url("../images/footer/facebook.svg");
	}
	.footer div.followLinks a.line{
	    background-image: url("../images/footer/line.svg");
	}
	.footer div.followLinks a.line:hover{
	    background-image:linear-gradient(#03C302, #03C302),url("../images/footer/line.svg");
	}
	.footer div.followLinks a.youtube{
	    background-image: url("../images/footer/youtube.svg");
	}
	.footer div.followLinks a.youtube:hover{
	    background:linear-gradient(#fe000c, #fe000c),url("../images/footer/youtube.svg");
	}
	.footer div.followLinks a:hover{
		background-blend-mode: screen;
	}

.footer .footerInfo .right{
	float: right;
	text-align: right;
	line-height: 1.8;
	/*width: 50%;*/
}
.footer .footerInfo .right p{
	font-size: 14px;
	color: #A6A6A6;
	margin-bottom: 10px;
}
.footer .footerInfo .right a{
	display: inline-block;
	vertical-align: top;
	font-size: 14px;
	margin-left: 15px;
	background: url("../images/all/redDot.svg") left center no-repeat;
	padding-left: 17px;
	background-size: 13px 13px;
	transition: all .3s;
}
.footer .footerInfo .right a:hover{
	color: #fe000c;
	transition: all .3s;
}

/*隱私權*/
	.footer .cookies{
		position: fixed;
		z-index: 102;
		background: rgba(237, 237, 237, .9);
		width: 100%;
		left: 0;
		bottom: 0;
		padding: 30px;
		box-sizing: border-box;
		text-align: center;
		color: #333333;
	}
	.footer .cookies div{
		font-size: 28px;
		line-height: 1.2;
		margin-bottom: 15px;
	}
	.footer .cookies p{
		font-size: 16px;
		line-height: 1.8;
	}
	.footer .cookies p a{
		color: #FE000C;
		text-decoration: underline;
	}
	.footer .cookies a.closeCookies{
		width: 40px;
		height: 40px;
		text-indent: -9999px;
		float: right;
		display: block;
		border: 1px solid #333333;
		background: url(../images/all/blackClose.svg) no-repeat center;
		background-size: 30px 30px;
		transform:scale(1.0);
		transition: all .3s;
	}
	.footer .cookies a.closeCookies:hover{
		transform:scale(1.2);
		transition: all .3s;
	}

@media screen and (max-width: 1366px){
	
}
@media screen and (max-width: 1024px){
	.footer .groupLinks #centerContent01 li.item div{
		display: none;
	}
	.footer .groupLinks #centerContent01 li.logo{
		width: 50%;
	}
	.footer .groupLinks #centerContent01 li.companyList{
		display: block;
		width: 40%;
		padding-top: 5px;
	}
	.footer .groupLinks #centerContent01 li.logo img{
		width: 147px;
	}
	.footer .groupLinks #centerContent01 li.companyList img{
		width: 130px;
		float: right;
	}
	.footer .groupLinks #centerContent02 div{
		background: url(../images/all/whiteDot.svg) no-repeat 0 5px;
		padding-left: 17px;
		background-size: 10px 10px;
	}
	.footer .groupLinks #centerContent02 div.pcNone{
		display: inline-block;
	}
	.footer .groupLinks #centerContent02 div.pcNone a{
		display: block;
	}
	.footer .groupLinks #centerContent02 div h4{
		display: block;
		font-size: 14px;
	}
	.footer .groupLinks #centerContent02 ul{
		width: 100%;
		float: none;
	}
	.footer .groupLinks #centerContent02 li,
	.footer .groupLinks #centerContent02 li.li_2{
		width: 50%;
	}
	.footer .groupLinks #centerContent02 li.li_2 div{
		width: 100%;
	}
	.footer .groupLinks #centerContent02 div a,
	.footer .groupLinks #centerContent02 div.pcNone a{
		font-size: 14px;
	}
}
@media screen and (max-width: 800px){
	.footer .footerInfo .left,
	.footer div.followLinks,
	.footer .footerInfo .right{
		float: none;
		width: 100%;
		text-align: center;
	}
	.footer div.followLinks,
	.footer .footerInfo .left{
		margin-bottom: 30px;
	}
}
@media screen and (max-width: 600px){
	.footer .footerInfo .left,
	.footer div.followLinks,
	.footer .footerInfo .right{
		text-align: left;
	}
	.footer div.followLinks{
		text-align: center;
	}
	.footer .footerInfo .right a{
		margin: 0 15px 0 0;
	}
	/*隱私權*/
		.footer .cookies p{
			text-align: left;
		}
}
@media screen and (max-width: 550px){
	.footer .footerInfo .right span{
		display: block;
	}
}