@charset "UTF-8";

/*=========================================================
	Footer
=========================================================*/
.site-footer{
	background-color:#063171;
	position:relative;
	margin-top:10rem;
}

.site-footer .site-container{
	max-width:100%;
}

.FooterFlex{
	padding:2.5rem 0;
	display:flex;
	justify-content:space-between;
}

.FooterLogo{
	margin-right:1.25rem;
	flex-shrink:0
}

.FooterLogo-link{
	width:17.5rem;
	height:4.188rem;
	display:block;
	background-image:url(../../images/logo/f_logo.svg);
	background-size:100% 100%;
}

.FooterInfo{
	flex:1;
	min-width:0;
	display:flex;
	justify-content:end;
}

.FooterInfoMeta-item{
	font-size:1rem;
	line-height:1.4;
	color:#fff;
}

.FooterInfoMeta-item + .FooterInfoMeta-item{
	margin-top:0.5rem;
}

.FooterInfoMeta-text{
	display:inline-block;
	color:#fff;
	position:relative;
}

.FooterInfoMeta-text:first-child{
	margin-right:calc(1.625rem + 1px);
}

.FooterInfoMeta-text:first-child:after{
	content:"";
	width:1px;
	height:0.75rem;
	background-color:#fff;
	position:absolute;
	top:50%;
	right:calc(-0.813rem - 1px);
	transform:translateY(-50%);
}

.FooterInfo-copy{
	font-size:1rem;
	line-height:1.4;
	color:rgba(255,255,255,0.6);
	margin-top:3.75rem;
}

/*responsive*/
@media screen and (max-width: 1024px) and (min-width: 768px){
	.site-footer{
		margin-top:8rem;
	}
	
	.FooterLogo-link{
		width:14rem;
		height:3.35rem;
	}
	
	.FooterInfoMeta-item{
		font-size:0.938rem;
	}
	
	.FooterInfo-copy{
		font-size:0.938rem;
	}
}

@media screen and (max-width: 767px) and (min-width: 1px){
	.site-footer{
		margin-top:6rem;
	}
	
	.FooterFlex{
		display:block;
	}
	
	.FooterInfoMeta-item{
		font-size:0.875rem;
	}
	
	.FooterInfo-copy{
		font-size:0.75rem;
		margin-top: 1.4rem;
	}
	
	.FooterInfoMeta-text:first-child:after{
		height:0.65rem;
	}
	
	.FooterLogo{
		margin-right:0;
		margin-bottom:1.4rem;
	}
	
	.FooterLogo-link{
		width:11.5rem;
		height:2.75rem;
	}
	
	.FooterInfo{
		display:block;
	}
}

/*=========================================================
	Footer TopButton
=========================================================*/
body .TopButton{
	width:2.75rem;
	height:2.75rem;
	position:fixed;
	border:solid 2px #000;
	bottom:1.25rem;
	right:2rem;
	transition-property:opacity, visibility;
	transition-duration: 0.2s;
	z-index:100;
	opacity:0;
	visibility:hidden;
	border-radius:0.45rem 0.45rem;
	background-image:url(../../images/icon/ico_scrollTop.svg);
	background-size:1rem 1.125rem;
	background-repeat:no-repeat;
	background-position:center center;
	background-color:rgba(255,255,255,0.1);
}

body.post-template-single-games .TopButton{
	background-color:rgba(255,255,255,0.8);
}

body .TopButton.is-Open{
	opacity:1;
	visibility:visible;
}

body .TopButton.is-Stop{
	position:absolute;
	bottom:auto;
	top:-4.5rem;
	right:2rem;
}

/*responsive*/
@media screen and (max-width: 1024px) and (min-width: 768px){
	body .TopButton{
		width:2.6rem;
		height:2.6rem;
		bottom:2rem;
		right:2.5rem;
	}
	
	body .TopButton.is-Stop{
		top:-4rem;
		right:2rem;
	}
}

@media screen and (max-width:767px) and (min-width:1px){
	body .TopButton{
		width:2.4rem;
		height:2.4rem;
		bottom:1rem;
		right:1rem;
	}
	
	body .TopButton.is-Stop{
		top:-3.5rem;
		right:1rem;
	}
}

/*=========================================================
	PageError 
=========================================================*/
body.error404 .site-footer{
	display:none;
}

body.error404 .site-content{
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top:0;
}

.PageError{
	text-align: center;
	width:100%;
}

.PageError-ico{
	width:25rem;
	max-width:100%;
	line-height:0;
	margin:0 auto 2rem;
}

.PageError-title{
	color:#000;
	font-size:2.75rem;
	font-weight:bold;
	line-height:1.4em;
}
.PageError-text{
	margin-top:0.938rem;
	color:#000;
	font-size:1.063rem;
	line-height:1.4em;
}
.PageErrorBtn{
	margin-top:5.625rem;
	font-size:0;
	line-height:0;
}
.PageErrorBtn-link{
	display:inline-block;
	padding:1rem 2.75rem;
	line-height:1.2em;
	color:#000;
	font-size:1rem;
	font-weight:600;
	border: 2px solid #000;
}

/*responsive*/
@media screen and (max-width: 1024px) and (min-width: 768px){
	.PageErrorBtn{
		margin-top: 3.625rem;
	}
}

@media screen and (max-width:767px) and (min-width:1px){
	.PageError-title{
		font-size: 2rem;
	}
	
	.PageErrorBtn{
		margin-top: 3.25rem;
	}
}