@charset "utf-8";

@media screen and (max-width: 768px) {
	:root {
		--PageTop_position: fixed;
		--PageTop_bottom: 0px;
		--PageTop_left: 0;
		--PageTop_height: auto;
		--PageTop_Div_position: sticky;
		--PageTop_Div_bottom: 0;
		--PageTop_Div_left: 0;
		--PageTop_Div_width: 100%;
		--PageTop_Div_height: 90px;
		--PageTop_Div_A_width: 90px;
		--PageTop_Div_A_opacity: 1;
		--PageTop_TeppenDash_position: sticky;
		--PageTop_TeppenDash_bottom: 0px;
		--PageTop_TeppenDash_left: 100%;
		--PageTop_TeppenDash_height: auto;
		--PageTop_TeppenDash_Div_position: sticky;
		--PageTop_TeppenDash_Div_bottom: 0;
		--PageTop_TeppenDash_Div_left: 100%;
		--PageTop_TeppenDash_Div_width: 120px;
		--PageTop_TeppenDash_Div_height: 90px;
		--PageTop_TeppenDash_background: var(--Color_R000);
		--PageTop_TeppenJapan_height: 90px;
		--PageTop_TeppenJapan_background: var(--Color_R100);
	}
}

@media screen and (min-width:769px) and ( max-width:1160px) {
	:root {
		--PageTop_position: sticky;
		--PageTop_bottom: 24px;
		--PageTop_left: 100%;
		--PageTop_height: 10px;
		--PageTop_Div_position: sticky;
		--PageTop_Div_bottom: 24px;
		--PageTop_Div_left: 100%;
		--PageTop_Div_width: 120px;
		--PageTop_Div_height: auto;
		--PageTop_Div_A_width: 120px;
		--PageTop_Div_A_opacity: .2;
		--PageTop_TeppenDash_position: sticky;
		--PageTop_TeppenDash_bottom: 24px;
		--PageTop_TeppenDash_left: 100%;
		--PageTop_TeppenDash_height: 10px;
		--PageTop_TeppenDash_Div_position: sticky;
		--PageTop_TeppenDash_Div_bottom: 24px;
		--PageTop_TeppenDash_Div_left: 100%;
		--PageTop_TeppenDash_Div_width: 120px;
		--PageTop_TeppenDash_Div_height: auto;
		--PageTop_TeppenDash_background: var(--Color_R000);
		--PageTop_TeppenJapan_left: calc( 100% - 140px );
		--PageTop_TeppenJapan_height: 100%;
		--PageTop_TeppenJapan_background: var(--Color_R000);
	}
}

@media screen and (min-width:1161px) {
	:root {
		--PageTop_position: sticky;
		--PageTop_bottom: 24px;
		--PageTop_left: calc( calc( 100% - calc( calc( 100% - 1160px ) / 2 ) ) + var(--Gap_L) );
		--PageTop_height: 10px;
		--PageTop_Div_position: sticky;
		--PageTop_Div_bottom: 24px;
		--PageTop_Div_left: 100%;
		--PageTop_Div_width: 120px;
		--PageTop_Div_height: auto;
		--PageTop_Div_A_width: 120px;
		--PageTop_Div_A_opacity: 1;
		--PageTop_TeppenDash_position: sticky;
		--PageTop_TeppenDash_bottom: 24px;
		--PageTop_TeppenDash_left: calc( calc( 100% - calc( calc( 100% - 1160px ) / 2 ) ) + var(--Gap_L) );
		--PageTop_TeppenDash_height: 10px;
		--PageTop_TeppenDash_Div_position: sticky;
		--PageTop_TeppenDash_Div_bottom: 24px;
		--PageTop_TeppenDash_Div_left: 100%;
		--PageTop_TeppenDash_Div_width: 120px;
		--PageTop_TeppenDash_Div_height: auto;
		--PageTop_TeppenDash_background: var(--Color_R000);
		--PageTop_TeppenJapan_left: calc( 100% - 140px );
		--PageTop_TeppenJapan_height: 100%;
		--PageTop_TeppenJapan_background: var(--Color_R000);
		
	}
}

#PageTop {
	position: var(--PageTop_position);
	bottom: var(--PageTop_bottom);
	left: var(--PageTop_left);
	display: flex;
	align-items: flex-end;
	width: var(--PageTop_Div_width);
	height: var(--PageTop_height);
	z-index: 9999;
	& div {
		position: var(--PageTop_Div_position);
		bottom: var(--PageTop_Div_bottom);
		left: var(--PageTop_Div_left);
		display: inline-flex;
		flex-direction: var(--Flex-direction_RCC);
		justify-content: center;
		width: var(--PageTop_Div_width);
		height: var(--PageTop_Div_height);
		background: var(--PageTop_TeppenJapan_background);
		opacity: 1;
		& a {
			display: flex;
			justify-content: center;
			align-items: center;
			width: var(--PageTop_width);
			height: var(--PageTop_width);
			scale: 1;
			transition: var(--Transition);
			-o-transition: var(--Transition);
			-moz-transition: var(--Transition);
			-webkit-transition: var(--Transition);
			opacity: var(--PageTop_Div_A_opacity);
			& img {
				width: var(--PageTop_Div_A_width);
			}
			& svg {
				width: calc( var(--PageTop_Div_A_width) * .7 );
			}
		}
		& a:hover {
			opacity: 1;
			scale: 1.04;
		}
	}
}

body#Teppen_Dash_Company.Page {
	& #PageTop {
		position: var(--PageTop_TeppenDash_position);
		bottom: var(--PageTop_bottom);
		left: var(--PageTop_TeppenDash_left);
		display: flex;
		align-items: flex-end;
		width: var(--PageTop_Div_width);
		height: var(--PageTop_TeppenDash_height);
		& div {
			position: var(--PageTop_TeppenDash_Div_position);
			bottom: var(--PageTop_TeppenDash_Div_bottom);
			left: var(--PageTop_TeppenDash_Div_left);
			display: inline-flex;
			flex-direction: column;
			justify-content: center;
			width: var(--PageTop_TeppenDash_Div_width);
			height: var(--PageTop_TeppenDash_Div_height);
			background: var(--PageTop_TeppenDash_background);
			& a {
				& svg {
					& .st0 {
						fill: #000000 !important;
					}
					& .st1 {
						fill: var(--Color_FF) !important;
					}
				}
			}
		}
	}
}

body#Teppen_Dash_Company.Top {
	#PageTop {
		position: var(--PageTop_TeppenDash_position);
		bottom: var(--PageTop_bottom);
		left: var(--PageTop_TeppenDash_left);
		display: flex;
		align-items: flex-end;
		width: var(--PageTop_Div_width);
		height: var(--PageTop_TeppenDash_height);
		& div {
			position: var(--PageTop_TeppenDash_Div_position);
			bottom: var(--PageTop_TeppenDash_Div_bottom);
			left: var(--PageTop_TeppenDash_Div_left);
			display: inline-flex;
			flex-direction: column;
			justify-content: center;
			width: var(--PageTop_TeppenDash_Div_width);
			height: var(--PageTop_TeppenDash_Div_height);
			background: var(--PageTop_TeppenDash_background);
			& a {
				& svg {
					& .st0 {
						fill: #FFFFFF !important;
					}
					& .st1 {
						fill: var(--Color_1D) !important;
					}
				}
			}
		}
	}
}

body#Teppen_Japan.Page {
	& #PageTop {
		& div {
			& a {
				& svg {
					& .st0 {
						fill: var(--Color_R) !important;
					}
					& .st1 {
						fill: var(--Color_FF) !important;
					}
				}
			}
		}
	}
}

body#Teppen_Japan.Factory {
	& #PageTop {
  		position: fixed;
  		bottom: 0;
		left: var(--PageTop_TeppenJapan_left);
		align-items: center;
		height: var(--PageTop_TeppenJapan_height);
		& div {
			
			& a {
				& svg {
					& .st0 {
						fill: var(--Color_R) !important;
					}
					& .st1 {
						fill: var(--Color_FF) !important;
					}
				}
			}
		}
	}
}