@charset "UTF-8";

:root{
	--sepoa-header-height: 56px;
	--sepoa-header-line-height: 56px;
	--sepoa-header-item-default-font-color: #444444;
	--sepoa-header-text-font-size: 16px;
	--sepoa-header-icon-size: 24px;
	--sepoa-header-icon-text-font-size: 14px;
	--sepoa-header-navigator-background-color: #ffffff;
}

.sepoa-header-parent{
	height: 56px;
}

.MAINFRAME .sepoa-header-base{
	display: flex;
	width: 100%;
	height: var(--sepoa-header-height);
	position: fixed;
}

.sepoa-header-base{
	display: flex;
	width: 100%;
	height: var(--sepoa-header-height);
	position: fixed;
	z-index: 1;
}

.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-box{
	height: 100%;
	margin-left: 0px;
	display: inline-flex;
	flex: 1;
}

.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item{
	height:100%;
	display: flex;
	justify-content: center;
    align-items: center;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item > img{
	max-height: 34px;
	object-fit: contain;
	width: fit-content;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-hidden{
	display: none;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-box-left .sepoa-header-item{
	margin-right:0px;
	padding-left: 15px;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-box-right .sepoa-header-item{
	margin-left:0px;
	padding-right: 15px;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-box-center{
	justify-content: center;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-box-right{
	margin-right:0px;
	justify-content: flex-end;
}
/* .sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item{ */
/* 	color: var(--sepoa-header-item-default-font-color); */
/* } */
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-text{
	font-size: var(--sepoa-header-text-font-size);
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-icon{
	font-size: var(--sepoa-header-icon-size);
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-logo{
	margin-right: 0px;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-logo .sepoa-header-logo{
	display: flex;
}

/* mobile custom - button */
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-button{
	padding-right: 5px;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-button .sepoa-button-item{
	margin-top: 0px;
	height: 30px;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-button .sepoa-button-item .sepoa-button-item-label{
	line-height: 30px;
}

/* mobile custom - icon */
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-icon > div{
	display: flex;
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-icon > div > .xi-sepoa-dummy-after{
	line-height: var(--sepoa-header-line-height);
}
.sepoa-header-mobile-default.sepoa-header-base .sepoa-header-item.sepoa-header-item-icon > div > span{
	font-size: var(--sepoa-header-icon-text-font-size);
	align-content: center;
}

/* mobile custom - navigator */
.sepoa-header-mobile-navigator{
	background-color: var(--sepoa-header-navigator-background-color);
	z-index: 1;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-box{
	height: 100%;
	margin-left: 0px;
	display: inline-flex;
	flex: 1;
}

.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-item{
	height:100%;
	display: flex;
	justify-content: center;
    align-items: center;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-item > img{
	max-height: 34px;
	object-fit: contain;
	width: fit-content;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-item.sepoa-header-hidden{
	display: none;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-box-left .sepoa-header-item{
	margin-right:0px;
	padding-left: 15px;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-box-right .sepoa-header-item{
	margin-left:0px;
	padding-right: 15px;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-box-center{
	justify-content: center;
}
.sepoa-header-mobile-navigator.sepoa-header-base .sepoa-header-box-right{
	margin-right:0px;
	justify-content: flex-end;
}