@charset "UTF-8";

/*=========================================================
	Footer
=========================================================*/
.site-footer{
	background: linear-gradient(180deg, #070F2F 0%, #000 100%);
	position:relative;
}

.footer-container{
	max-width:75rem;
	margin:0 auto;
}

.FooterInfo{
	padding:5rem 0 2.5rem;
}

.FooterLogo{
	line-height:0;
	width:15.625rem;
	margin-right:4rem;
	margin:0 auto 2.5rem;
}

.FooterInfoList{
	text-align:center;
	font-size:0;
	line-height:0;
}

.FooterInfoList-item + .FooterInfoList-item{
	margin-top:0.75rem;
}

.FooterInfoList-item:after{
	content:"";
	display:table;
	clear:both;
}

.FooterInfoList-title{
	font-size:0.875rem;
	line-height:1.5em;
	color:rgba(255,255,255,0.3);
	display:block;
	margin-bottom:0.125rem;
}

.FooterInfoList-text{
	font-size:0.875rem;
	line-height:1.5em;
	color:rgba(255,255,255,0.6);
	display:block;
}


.FooterCopy{
	border-top:solid 1px rgba(255,255,255,0.1);
	padding:2.5rem 0;
	font-size:0.875rem;
	font-weight:400;
	line-height:1.4em;
	color:rgba(255,255,255,0.3);
	text-align:center;
}

.none-Tablet{
	display:none;
}

@media screen and (max-width:1199px) and (min-width:500px){
	.FooterInfo{
		padding:3rem 0 1.5rem;
	}

	.FooterInfoFlex{
		display:block;
	}

	.FooterInfoList-item + .FooterInfoList-item{
		margin-top:0.25rem;
	}
	
	.footer-container{
		max-width:22.5rem;
	}
	
	.FooterCopy{
		padding:1.5rem 0;
		font-size:0.875rem;
	}
	
	.none-Tablet{
		display:block;
	}
}

@media screen and (max-width:499px) and (min-width:1px){
	.FooterInfo{
		padding:3rem 0 1.5rem;
	}

	.footer-container{
		padding:0 1rem;
	}
	
	.FooterCopy{
		padding:1.5rem 0;
	}
	
	.none-Tablet{
		display:block;
	}
}

/*=========================================================
	Site Top Button
=========================================================*/
body .TopButton{
	width:4rem;
	height:5.25rem;
	position:fixed;
	bottom:1.25rem;
	transition-property:opacity, visibility;
	transition-duration: 0.2s;
	z-index:100;
	opacity:0;
	visibility:hidden;
	background-image:url(../../images/icon/ico_top.png);
	background-size:100% 100%;
}

.TopButtonAb{
	width:4rem;
	height:5.25rem;
	position:absolute;
	bottom:auto;
	top:-6.5rem;
	right:1.25rem;
}

body .TopButton.is-Open{
	opacity:1;
	visibility:visible;
}

body .TopButton.is-Hide{
	opacity:0;
	visibility:hidden;
}

@media screen and (max-width:1199px) and (min-width:500px){
	.TopButtonAb{
		right:10px;
	}
}

@media screen and (max-width:499px) and (min-width:1px){
	.TopButtonAb{
		right:0.625rem;
	}
}

/*=========================================================
	LangPopup
=========================================================*/
.LangPopup{
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:21.25rem;
	max-width:calc(100% - 32px);
	opacity:0;
	visibility:hidden;
	z-index:2000;
}

.LangPopup.is-View{
	opacity:1;
	visibility:visible;
}

.LangPopup-close{
	width:2.5rem;
	height:2.5rem;
	background-image:url(../../images/icon/ico_popup_close.svg);
	background-size:100% 100%;
	position:absolute;
	top:-3rem;
	right:0;
}

.LangPopupBox{
	border:solid 4px #ddd;
	border-radius:2rem;
	padding:1.5rem 1.25rem 1.25rem;
	text-align:center;
	background-color:#fff;
}

.LangPopupBox-text{
	font-size:1rem;
	line-height:1.5em;
	color:#333;
	font-weight:400;
	position:relative;
	padding-top:2.25rem;
}

.LangPopupBox-text:after{
	content:"";
	width:2rem;
	height:2rem;
	background-image:url(../../images/icon/ico_popup_check.svg);
	background-size:100% 100%;
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
}

.LangPopupBox-btn{
	border-radius:0.75rem;
	padding:0.75rem 0.75rem;
	background-color:#FF7800;
	font-size:1rem;
	line-height:1.4em;
	color:#fff;
	font-weight:700;
	text-align:center;
	display:block;
	width:100%;
	margin-top:1.25rem;
}

/*다국어*/
html[lang="ja"] .LangPopupBox-text{
	font-family:'Noto Sans JP';
	font-weight:500;
}

html[lang="zh-Hant"] .LangPopupBox-text{
	font-family:'Noto Sans TC';
	font-weight:500;
}

html[lang="th"] .LangPopupBox-text{
	font-family:'Noto Sans TH';
	font-weight:500;
}

/*=========================================================
	PageError 
=========================================================*/
body.error404{
	font-family: 'CookieRun', 'Noto Sans JP', 'Noto Sans TC', 'Noto Sans TH', Helvetica, "Apple SD Gothic Neo", Dotum, 돋움, sans-serif !important;
}

body.error404 .site-header{
	display:none !important;
}

body.error404 .site-footer{
	display:none !important;
}

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:#fff;
	font-size:2.75rem;
	font-weight:bold;
	line-height:1.4em;
}
.PageError-text{
	margin-top:0.938rem;
	color:#fff;
	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:#fff;
	font-size:1rem;
	font-weight:600;
	border: 2px solid #fff;
}

/*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;
	}
}