/* WebFont */
@font-face{
	font-family:"Noto Sans KR";
	src:url('../font/noto-sans-kr-regular.eot');
	src:url('../font/noto-sans-kr-regular.eot?#iefix') format('embedded-opentype'),
		url('../font/noto-sans-kr-regular.woff2') format('woff2'),
		url('../font/noto-sans-kr-regular.woff') format('woff'),
		url('../font/noto-sans-kr-regular.svg#noto-sans-kr-regular') format('svg');
	font-weight: 400;
}
@font-face{
	font-family:"Noto Sans KR";
	src:url('../font/noto-sans-kr-500.eot');
	src:url('../font/noto-sans-kr-500.eot?#iefix') format('embedded-opentype'),
		url('../font/noto-sans-kr-500.woff2') format('woff2'),
		url('../font/noto-sans-kr-500.woff') format('woff'),
		url('../font/noto-sans-kr-500.svg#noto-sans-kr-500') format('svg');
	font-weight: 500;
}
@font-face{
	font-family:"Noto Sans KR";
	src:url('../font/noto-sans-kr-700.eot');
	src:url('../font/noto-sans-kr-700.eot?#iefix') format('embedded-opentype'),
		url('../font/noto-sans-kr-700.woff2') format('woff2'),
		url('../font/noto-sans-kr-700.woff') format('woff'),
		url('../font/noto-sans-kr-700.svg#noto-sans-kr-700') format('svg');
	font-weight: 700;
}

@import url(../font/pretendard.css);

*.front{
	position: relative;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	border: 0;  
	line-height: 1em;
	outline: none;
}

body.front{
	font-size: 11px;
	font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
	font-weight: 400;
	color: #000;
	background: #FFF;
	min-width: 900px;
	overflow-y: hidden;
	position: static;
}

.blind {
	position: absolute;
	clip: rect(0 0 0 0);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	color: transparent;
}

ul.front,
li.front{
	list-style: none;
}

a.front{
	text-decoration: none;
	color: inherit;
}

button.front{
	cursor: pointer;
	background: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	font-weight: inherit;
}

button.front.btn-common-submit{
	background: #00A5E5;
	text-align: center;
	min-width: 64px;
	color: #fff;
	height: 24px;
	padding: 0 12px;
	border-radius: 4px;
	display: flex;
	justify-content: center;
	align-items: center;
}

input.front,
textarea.front
{
	font-size: 1em;
	color: inherit;
	background: #fff;
	border: 1px solid #778898;
	border-radius: 4px;
	padding: 0.4em 8px;
}

input.front:focus,
textarea.front:focus
{
	border-color: #00A5E5;
}

input.front.input-checkbox{
	font-size: inherit;
	border-radius: 0;
	padding: 0;
	border: 1px solid rgba(0,0,0,0.54);
}

select.front{
	font-size: 1em;
	color: inherit;
	background: #fff;
	border: 1px solid #CFDEE5;
	border-radius: 4px;
	padding: 0.4em 8px;
}

select.front:focus{
	border-color: #00A5E5;
}

select.front.inline{
	width: auto;
	min-width: 144px;
	display: flex;
	align-self: center;
}

textarea.front{
	resize: vertical;
}

header.header{
	position: fixed;
	min-width: 900px;
	width: 100%;
	height: 55px;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;	
	padding: 0 20px;
	padding-right: 0;
	z-index: 91;
	background-color: #005689;
}

.header-h1{
	display: flex;
	align-items: center;	
	font-size: 18px;
	color: #fff;
	font-weight: 500;
	cursor: pointer;
}

.header-h1 .logo{
	height: 28px;
	margin-right: 18px;
}

.header-h1 .user-type{
	color: #0ed9ff;
	margin-left: 7px;
}

.header-userinfo-div{
	display: flex;
	align-items: center;
	margin-left: auto;
}

.header-username{
	color: #fff;
	text-align: right;
	font-size: 14px;
}

button.front.btn-userinfo{
	width: 24px;
	height: 24px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 12px;
	background: #36c6ff;
	font-size: 14px;
	color: #000;
	font-weight: 500;
	margin-right: 9px;
}

button.front.btn-userinfo.on{
	background: #fff;
	color: #00A5E5;
}

.header-userinfo-pop{
	display: none;
	position: absolute;
	width: max-content;
	top: calc(100% + 5px);
	right: 98px;
	border-radius: 4px;
	padding: 8px;
	background: #fff;
	box-shadow: 2px 2px 2px rgba(0,0,0,0.25);
	z-index: 91;
}

.header-userinfo-pop.on{
	display: block;
}

.header-userinfo-pop::before{
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	bottom: 100%;
	right: 10px;
	border-style: solid;
	border-width: 0 6px 10px 6px;
	border-color: transparent transparent #ffffff transparent;
}

.header-userinfo-pop span{
	display: block;
	font-size: 0.833em;
}

.userinfo-name{
	font-weight: 500;
	padding-bottom: 0.8em;
}

.userinfo-loginTime-01{
	padding-bottom: 0.4em;
}

.userinfo-loginTime-02{
	color: #4D4D4D;
}

button.front.btn-logout{
	height: 16px;
	display: flex;
	align-items: center;
	margin-top: 0.8em;
	padding-left: 18px;
	font-size: 0.833em;
	background-image: url('../image/icon-btn-logout.svg');
	background-repeat: no-repeat;
	background-size: 16px 16px;
	background-position: 0 center;
}

nav.nav{
	position: fixed;
	width: 250px;
	height: calc(100vh - 55px);
	top: 55px;
	left: 0;
	background: #fff;
	border-right: 1px solid #B2BAD2;	
	overflow-y: auto;
	z-index: 90;
	transition: left 0.2s;	
}

.left-menu-off nav.nav{
	left: -250px;
	
}

.nav-dl{
	border-bottom: solid 1px #E6EEF2;
}

.nav-dt{
	display: flex;
	align-items: center;
	gap: 7px;
	height: 36px;
	padding: 0px 16px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
	color: #000;
	font-size: 14px;
}

.nav-dt .left-menu-icons{
	flex-shrink: 0;
	width: 24px;
	height: 24px;
}

.nav-dt .left-menu-icons img{
	width: 100%;
}

.nav-dl.active .nav-dt .left-menu-icons img{
	filter: brightness(0) invert(1);
}

.nav-dt::after{
	content: '';
	position: absolute;
	width: 12px;
	height: 12px;
	top: 50%;
	right: 16px;
	background-image: url('../image/icon-expand-menu.png');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	z-index: 2;
	transform: translate(0,-50%);
}

.nav-dl.open .nav-dt::after{
	background-image: url('../image/icon-less-menu.png');
}

.nav-dl.active .nav-dt{
	background: #00A5E5;
	color: #fff;
}

.nav-dl.active .nav-dt::after{
	background-image: url('../image/icon-active-expand-menu.png');
}

.nav-dl.open.active .nav-dt{
	background: #00A5E5;
	color: #fff;
}

.nav-dl.open.active .nav-dt::after{
	background-image: url('../image/icon-active-less-menu.png');
}

.nav-dd-wrap{
	display: none;
}

.nav-dd a{
	display: flex;
	align-items: center;
	width: 100%;
	height: 30px;
	font-weight: 500;
	font-size: 13px;
	color: #5c5c5c;
	gap: 9px;
	padding-left: 33px;
}

.nav-dd a::before{
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 2px;
	background-color: #999999;
}

.nav-dd a.active{
	background-color: #ededed;	
	color: #005386;
	font-weight: 700;
}

.nav-dd .btn-left-bookmark{
	position: absolute;
	width: 36px;
	height: 36px;
	top: 0;
	right: 4px;
	z-index: 2;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	float: none;
    display: block;
    filter: none;
}

.nav-dd .btn-left-bookmark.unfill{
	background-image: url(../image/nav-bookmark-unfill.svg);
}

.nav-dd .btn-left-bookmark.fill{
	background-image: url(../image/nav-bookmark-fill.svg);
}

.top-nav{
	position: fixed;
	width: calc(100% - 250px);
	min-width: calc( 900px - 250px);
	height: 37px;
	top: 55px;
	left: 250px;
	display: flex;
	align-items: flex-end;	
	transition: all 0.2s;
	z-index: 90;
	padding-left: 24px;	
	padding-right: 19px;
}

.top-nav #tab-list{
	display: flex;
	width: 100%;
	height: 32px;
	align-items: flex-end;
	gap: 2px;
	border-bottom: 1px solid #B2BAD2;
	margin-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}

.top-nav #tab-list .tab-item{
	display: inline-flex;
	align-items: flex-end;
	min-width: 152px;
	height: 32px;
}

.top-nav #tab-list .tab-item a{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 30px;
	border-radius: 4px 4px 0px 0px;
    color: #5c5c5c;
    padding: 0 15px;
    background: #FFF;
    margin-right: 0px;
	border: 1px solid #B2BAD2;
	border-bottom: 0;
	font-size: 14px;
	font-weight: 500;
}

.top-nav #tab-list .tab-item a.active{
	height: 32px;
	background-color: #005689;
	border-color: #005689;
	color: #FFF;
	font-weight: 600;
	font-size: 15px;
}

.left-menu-off .top-nav{
	width: 100%;
	left: 0px;
}

.btn-left-menu{
	position: absolute;
	top: calc(50% + 58px);
	left: 249px;
	transform: translate(0,-50%);
	width: 14px;
	height: 64px;	
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	z-index: 90;
	transition: left 0.2s;
}

#btn-left-menu-img .btn-left-menu-img-arrow{
	fill: #FFF;
}

#btn-left-menu-img .btn-left-menu-img-arrow-more{
	display: none;
	fill: #FFF;
}

/* .btn-left-menu.less{
	background-image: url('../image/btn-left-menu-less.png');
} */

.btn-left-menu.expand{
	/* background-image: url('../image/btn-left-menu-expand.png'); */
	left: 0;
}

.btn-left-menu.expand #btn-left-menu-img .btn-left-menu-img-arrow{
	display: none;
}

.btn-left-menu.expand #btn-left-menu-img .btn-left-menu-img-arrow-more{
	display: block;
}

.btn-left-bookmark{
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;	
	float:right;
	display: flex;
	filter: invert(12%) sepia(99%) saturate(3451%) hue-rotate(189deg) brightness(93%) contrast(96%);
}

.btn-left-bookmark:hover{
	opacity: 0.5;
}

.btn-left-bookmark.unfill{
	background-repeat: no-repeat;
	background-image: url('../image/icon-left-bookmark-unfill.svg');
}

.btn-left-bookmark.fill{
	background-repeat: no-repeat;
	background-image: url('../image/icon-left-bookmark-fill.svg');	
}

.top-nav-li{
	padding-right: 20px;
	margin-right: 4px;
	cursor: default;
}

.top-nav-li.current{
	color: #000;
}

.top-nav-li:before{
	content: '';
	position: absolute;
	width: 16px;
	height: 16px;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	background-image: url('../image/icon-arrow-right.svg');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
}

.top-nav-li.current:before{
	display: none;
}

.content-sort-wrap{
	width: calc(100% - 253px);
	margin-left: 253px;
	margin-top: 69px;
	margin-bottom: 10px;
	/* background-color: #FFF;
	border: 1px solid #B2BAD2; */
	transition: width 0.2s, margin-left 0.2s;	
}

.content-sort-wrap.sort-less{
	border-bottom: 1px solid #B2BAD2;	
}

.content-sort-input-area{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
    align-items: center;
    gap: 4px 35px;
	padding: 8px;
	border-radius: 4px;
	border: 1px solid #B2BAD2;
}

.content-sort-wrap form{
	margin: 0;
	padding: 0;
}

.content-sort-wrap.pinned{
	position: fixed;
	top: 80px;
	margin-top: 0;
	z-index: 90;
}

.left-menu-off .content-sort-wrap{
	width: calc(100% - 3px);
	margin-left: 3px;
}

.content-sort{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 4px 35px;	
}

.input-col{
	display: flex;
	align-items: center;
	gap: 2px;
	width: calc(25% - 26.25px);
	height: 26px;
}

/* 2024-07-22 분기 	운송사가 아닌 경우 검색영역 디자인 */
body.user-type-B div.input-col label.front{
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 0 8px;
	width: 120px;
	height: 100%;
	font-size: 13px;
	font-weight: 500;
	color: black;
	background-color: #CCECFF;
	border-radius: 4px;
	border-style: solid;
	border-width: 1px;
	border-color: skyblue
}

/* 2024-07-22 분기 	운송사 검색영역 디자인 */
body.user-type-E div.input-col label.front{
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 0 8px;
	width: 120px;
	height: 100%;
	font-size: 13px;
	font-weight: 500;
	color: black;
	background-color: #E2EFDA;
	border-radius: 4px;
	border-style: solid;
	border-width: 1px;
	border-color: #C6E0B6;
}

/*************************************************/

.input-col input.front, .input-col select.front{	
	width: 100%;
	height: 26px;
}

.input-col div.front.common-sort-search-box{
	display: flex;
	align-items: center;
	width: 70%;
	margin: 1px;
	font-size: 1em;
    color: inherit;
    background: #fff;
    border: 1px solid #CFDEE5;
    border-radius: 4px;    
}

.input-col div.front.common-sort-search-box.focus{
	border-color: #00A5E5;
}

.input-col div.front.common-sort-search-box input.front.common-sort-search{
	width: calc(100%);
	margin: 0;
	border: 1;
	padding-right: 10px;
}

.input-col div.front.common-sort-search-box button.front.btn-common-sort-search{
	width: 20px;
	height: 16px;
	background-image: url('../image/icon-search.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: center;
}

/* .input-col input.front.common-sort-search{
	background-image: url('../image/icon-search.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
} */

.input-col input.front:focus{
	border-color: #000;
}

.input-col input.front.common-sort-date{
	background-image: url('../image/icon-date.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
}

.popup-input-col input.front.common-sort-date{
	background-image: url('../image/icon-date.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
}

/* .input-col input.front.common-sort-date:hover{
	cursor: pointer;
} */

.input-col input[type='radio'] + label{
    margin-bottom: 0;
    white-space: nowrap;
    margin-left: 2px;
    font-size: 12px;
    cursor: pointer;
    font-weight: bold;
}

.input-col label + input[type='radio']{
    margin-left: 12px;
}

.popup-input.front.date{
    z-index: 0;
}

.sort-btn-col{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 4px;
	width: 100%;
	padding: 4px 0px;
	padding-right: 8px;
}

.new-breadcrumb{	
	display: flex;
	align-items: center;	
	margin-right: auto;
	font-size: 13px;
	padding-left: 4px;
}

#new-breadcrumb-icon{
	height: 10px;
	margin-right: 4px;
	fill: #000;
}

.new-breadcrumb div + div::before{
	content: '>';
	margin: 0 4px;
}

.content-sort .btn-common-submit{
	margin-left: 4px;
}

.content-sort-bottom-btn-container{
	position: absolute;	
	top: 100%;
	left: 50%;
	font-size: 0;
	cursor: default;
	transform: translate(-50%, 0);	
	z-index: 80;
}

button.front.btn-sort-section{
    display: block;
    width: 60px;
    height: 15px;
	overflow: hidden;
}

button.front.btn-sort-section .arrow,
button.front.btn-sort-section .arrow02{
	fill: #FFF;
}

/* .btn-sort-section.less{
	background-image: url('../image/icon-btn-sort-section-less.svg');
}

.btn-sort-section.less.expand{
	background-image: url('../image/icon-btn-sort-section-expand.svg');
} */

button.front.btn-sort-section.less .arrow{
	display: block;
}

button.front.btn-sort-section.less .arrow02{
	display: none;
}

.btn-sort-section.less.expand .arrow{
	display: none !important;
}

.btn-sort-section.less.expand .arrow02{
	display: block !important;
}

button.front.btn-dual-grid-popup-move{
	width: 40px;
	height: 30px;
	background-color: #757575;
	border-radius: 5px;
	background-repeat: no-repeat;
	background-size: 24px;
	background-position: center;
}

button.front.btn-dual-grid-popup-move.to-left{
	background-image: url('../image/icon-btn-dual-grid-popup-move-to-left.svg');
}

button.front.btn-dual-grid-popup-move.to-right{
	background-image: url('../image/icon-btn-dual-grid-popup-move-to-right.svg');
}

button.front.btn-dual-grid-popup-move:hover{
	background-color: #637E99;
}

.content-wrap{
	display: flex;
	width: calc(100% - 253px);
	margin-left: 253px;
	padding: 10px 0px;
	transition: width 0.2s, margin-left 0.2s;
	background-color: #FFF;
	margin-top: 4px;
	border: 0;
}

.content-wrap-main {
	display: flex;
	width: calc(100% - 240px);
	height: calc(100vh - 80px - 44px);
	margin-left: 240px;
	margin-top: 80px;
	padding: 16px;
	transition: width 0.2s, margin-left 0.2s;
	box-sizing: border-box;
}

/* .content-col{
	width: 100%;
	padding: 16px;
}

.col-half{
	width: 50%;
} */

.left-menu-off .content-wrap{
	width: calc(100% - 3px);
	margin-left: 3px;
}

.res-header-row{
	display: flex;
	align-items: center;
	width: 100%;
	height: 24px;
	margin-bottom: 4px;
}

.res-header-row::before{
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	background-color: #000;
	margin-right: 3px;
}

.non-res-header-row::before{
 content: none;
}

.res-summary{	
	font-size: 13px;
	color: #171717;
	font-weight: 600;	
}

.res-summary span{
	color: #ed4739;
}

.sbgrid_subtitle span{
	color: #ed4739;
}

.res-btn-col{
	display: flex;
	justify-content: flex-end;
	gap: 4px;
	align-items: center;
	margin-left: auto;
}

button.front.btn-res-header{
	display: flex;
	align-items: center;	
	min-width: 48px;
	height: 24px;
	margin-left: 4px;
	padding: 0 12px;
	background: #fff;
	border: 1px solid #808080;
	border-radius: 4px;
	text-align: center;
	color: #004D99;	
}

button.front.btn-res-header.btn-excel{
	font-size: 0;
	background-image: url('../image/icon-excel.svg');
	background-repeat: no-repeat;
	background-size: 24px;
	background-position: center;
}

.res{
	margin-top: 8px;	
}

.res-table{
	width: 100%;	
	border-collapse: collapse;
}

.res-table .align-center{
	text-align: center;
}

.res-table th, .res-table td{
	vertical-align: middle;
	padding: 10px 8px;
	text-align: left;
}

.res-table th{
	background: #00A5E5;
	color: #fff;
	font-weight: 400;
	border-radius: 0px 4px 0px 0px;
	white-space: nowrap;
}

.res-table th:not(:last-child){
	border-radius: 0px 0px 0px 0px;
}

.res-table th:nth-child(1){
	border-radius: 4px 0px 0px 0px;
}

.res-table .text-bold{
	font-weight: 500;
}

.res-table tr{
	background: #fff;	
}

.res-table tr:nth-child(even){
	background: #F7FCFF;
}

.res-table tr:last-child td{
	border-radius: 0px 0px 4px 0px;
}

.res-table tr:last-child td:not(:last-child){
	border-radius: 0px 0px 0px 0px;
}

.res-table tr:last-child td:first-child{
	border-radius: 0px 0px 0px 4px;
}

.res-checkbox{
	padding: 0;
	width: 30px;
	text-align: center;
}

.res-pagenation{
	display: flex;
	justify-content: center;
	align-items: center;	
	padding: 16px 0px;
}

.res-pagenation-a{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 32px;
	background: #fff;
	color: #4D4D4D;
	border-radius: 0px 4px 4px 0px;
}

.res-pagenation-a:not(:last-child){
	border-radius: 0px;
}

.res-pagenation-a:first-child{
	border-radius: 4px 0px 0px 4px;
}

.res-pagenation-a.current{
	background: #00A5E5;
	color: #fff;
}

.res-pagenation-a:hover{
	background: #F7FCFF;
	color: #000;
}

.res-pagenation-a.current:hover{
	background: #00A5E5;
	color: #fff;
}

.front.popup{
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 92;
}

.front.popup.content-add-pop{
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99999;
}

.popup-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	padding: 12px;
	z-index: 92;
	background-color: rgba(0,0,0,0.7);
	overflow: auto;	
}

/* 20230904 captcha 추가 */
.captcha-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	padding: 12px;
	z-index: 92;
	background-color: rgba(0,0,0,0.7);
	overflow: auto;	
}

.popup-container{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 640px;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	max-height: calc(105% - 24px);
	overflow-y: auto;
}

.bill-container{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 925px !important;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	max-height: calc(105% - 24px);
	overflow-y: auto;
}

.notice-container, .faq-container, .termsConditions-container, .manual-container, .mainManage-container {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 1100px !important;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	max-height: calc(105% - 24px);
	overflow-y: auto;
	height:82%;
}

.circle{
	width: 10px;
	height: 10px;
	border-radius: 8px;
	background-color: black;
}

.popup-title{
	padding: 16px;
	padding-bottom: 13px;
	font-size: 17px;
	font-weight: 700;
	border-bottom: 1px solid #00A5E5;
}

.popup-title:before{
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	background-color: #000;
	margin-right: 3px;
}

.popup-body{
	padding: 2px 16px;
}

.popup-btn-row{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: auto;	
 	padding: 10px 16px;
}

.fixed-button .popup-btn-row{	
	flex-basis: 60px;	
	background: #fff;
	padding: 16px;
	border-top: 1px solid #E5E5E5;
}

.fixed-button .popup-body{	
	overflow-y: auto;
}

button.front.btn-popup{
	display: flex;
	justify-content: center;
	align-items: center;
	background: #00A5E5;
	text-align: center;
	min-width: 64px;
	color: #fff;
	height: 28px;
	margin: 0 2px;
	padding: 0 12px;
	border-radius: 4px;
}

.popup-input-row{
	display: flex;
	justify-content: space-between;
	align-items: center;	
 	border-top: 1px solid #E5E5E5;
 	border-bottom: 1px solid #E5E5E5;
}

/* �뿬�윭紐⑤줈 �뵒�옄�씤 �뙆愿닿� �엳�뼱 �씪�떒 二쇱꽍! */
/* .popup-input-row:not(:first-child){
	border-top: 0;
} */

.popup-input-row.stretch-contents{
	align-items: stretch;
}

.popup-input-col{
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	align-items: stretch;
	justify-self: flex-start;
	width: 100%;
}

.popup-input-col2{
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	align-items: stretch;
	justify-self: flex-start;
	width: 33.3%;
}

.popup-input-colspan{
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	align-items: stretch;
	justify-self: flex-start;
	width: 66.6%;
}

.col-inner-col{
	padding: 8px;
	flex-direction: column;
	border: 1px solid #E5E5E5;
	margin: 4px 0;
	align-self: stretch;
}

.col-inner-col:not(:last-child){
	margin-right: 4px;
}

.col-inner-h3{
	margin-right: auto;
	font-weight: 500;
	font-size: 1.2em;
	display: block;
	margin-bottom: 4px;
}

.col-inner-col-row{
	display: flex;
	flex-wrap: wrap;
}

.col-inner-col-row:not(:last-child){
	margin-bottom: 4px;
}

.col-inner-col-row label{
	white-space: nowrap;
	margin-right: 6px;
	min-width: 48px;
	padding: 0.4em 0;
}

.col-inner-col-row input{
	width: calc(100% - 54px);
}

.col-inner-col-data{
	width: 100%;
	padding: 0 0.5em;	
}

.popup-chbox-wrap{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;	
}

.popup-input.front{
	width: 100%;
	height: 24px;
	margin: 4px 8px;	
}

.popup-select.front{
	width: 100%;
	height: 24px;
	margin: 4px 8px;
	padding: 0 12px;
}

.popup-input.front.small{
	width: 48px;
}

.text-align-right{
	text-align: right;
}

.front.popup-input-multiline-box{
	display: flex;
	flex-wrap: wrap;	
}


.popup-input-label{
	display: flex;
	align-items: center;
	white-space: nowrap;
	min-width: 124px;
	padding: 0 12px;
	background: #F2FAFF;	
	border-right: 1px solid #d7effe;	
}

.popup-input-label.wraps{
	white-space: normal;
}

.popup-input:required + label::before,
.popup-select:required + label::before,
.popup-input-col .required_label::before{
	content: '*';
	color: #ebeb34;
	font-size: 1.5em;
}

.pop-text{
	display: flex;	
	align-items: center;
}

button.front.btn-popup-input{
	display: flex;
	align-items: center;
	align-self: center;
	padding: 0 12px;
	white-space: nowrap;
	height: 24px;
	background: #004D99;
	color: #fff;
	border-radius: 4px;
	margin-right: 8px;
}

.popup-input.front.email-text{
	height: 200px;
}

.popup-input-search-box{
	display: flex;
	align-items: center;
	width: 100%;
	height: 24px;
	margin: 4px 8px;
	font-size: 1em;
    color: inherit;
    background: #fff;
    border: 1px solid #CFDEE5;
    border-radius: 4px;
}

.popup-input-search-box.focus{
	border-color: #00A5E5;
}

.popup-input-search-box .popup-input-search{
	width: calc(100% - 20px);
	background: none;
	border: 0;
	padding-right: 0;
}

.popup-input-search-box .btn-popup-input-search{
	width: 20px;
	height: 16px;
	background-image: url('../image/icon-search.svg');
	background-repeat: no-repeat;
	background-size: 16px;
}

.popup-input.front.search{
	background-image: url('../image/icon-search.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
}

.popup-input.front.date{
	background-image: url('../image/icon-date.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
	
	z-index:1050;
}

.input.front.date{
	background-image: url('../image/icon-date.svg');
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right 4px center;
}

.popup-section-title{
	display: flex;
	align-items: center;
	padding: 8px;
	padding-right: 0;
	font-size: 1.1em;
	font-weight: 700;
}

.popup-section-title + .popup-input-row{
	border-top: 1px solid #E5E5E5;
}

.popup-section-title.less{
	border-bottom: 1px solid #E5E5E5;
}

.popup-input.front:disabled{
	background-color: #EEEEEE;
}

.popup-input.front.tm_list_pop_etc{	
	height: calc(100% - 8px);	
	resize: none;
}

.tm_list_pop_preview_image{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 96px;
	border: 1px solid #CFDEE5;
	border-radius: 4px;
    padding: 0.4em 8px;
	margin: 4px 8px;	
}

.tm_list_pop_preview_image img{
	max-width:100%;
	max-height: 100%
}

.tm_list_pop_preview_image_label_button_box{
	position: absolute;
	bottom: 4px;
	left: 0;
	display: flex;	
	width: 100%;
	padding: 4px 12px;
}

button.front.btn_tm_list_pop_preview_image_label{
	background-color: #637E99;
	color: #fff;
	width: 100%;	
	padding: 6px 0px;
	border-radius: 3px;
}

button.front.btn_tm_list_pop_preview_image_label:not(:last-child){
	margin-right: 4px;
}

.popup-section-wrap{
	margin-bottom: 8px;
}

button.front.btn-popup-section-title{
	margin-left: auto;
	width: 24px;
	height: 24px;
	background-image: url('../image/icon-popup-section-title-expand.svg');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
}

button.front.btn-popup-section-title.less{
	background-image: url('../image/icon-popup-section-title-less.svg');
}

button.front.btn-popup-section-title-inline{	
	padding: 6px 8px;
	border-radius: 4px;
	font-weight: 400;
	margin-left: 4px;
}

button.front.btn-popup-section-title-inline.del{
	background: #ff0000;
	color: #FFF;
}

button.front.btn-popup-section-title-inline.common{
	background: #637E99;
	color: #fff;
}

button.front.btn-popup-section-title-inline.common.download-all{
	margin: 8px;
}

button.front.btn-popup-section-title-inline.common.acci-num-link{
	background: #00A5E5;
	margin-left: auto;
}

input.front.tm_list_file{
	visibility: hidden;
	position: absolute;
	width: 0;
	height: 0;
	top: 0;
	left: 0;
	z-index: -1;
}

button.front.btn_tm_list_file{
	margin: 8px;
	background-color: #637E99;
	border-radius: 4px;
	color: #fff;
	padding: 8px 16px;
	font-weight: 400;
	cursor: pointer;
	margin-right: 0;
}

.tm_list_file_list, .tm_list_file_list2{
	width: 100%;
	padding: 8px;
	margin-bottom: 8px;	
}

.tm_list_file_list_row{
	border-bottom: 1px solid #E5E5E5;	
}

.tm_list_file_list_row:nth-child(1){
	border-top: 1px solid #E5E5E5;
}

.tm_list_file_list_category{
	display: flex;
	align-items: center;
	padding: 8px;
	font-size: 1.2em;
	border-bottom: 1px solid #FFF;
}

.tm_list_file_list_row.opened .tm_list_file_list_category{
	border-bottom: 1px solid #E5E5E5;
}

button.front.btn_tm_list_file_list_category{
	width: 24px;
	height: 24px;
	margin-right: 16px;
	background-image: url('../image/icon-popup-section-title-expand.svg');
	background-repeat: no-repeat;
	background-size: 24px;
	background-position: center;
	transition: transform 0.2s;
}

.tm_list_file_list_row.opened button.front.btn_tm_list_file_list_category{
	transform: rotate(180deg);
	transition: transform 0.2s;
}

.tm_list_file_list_wrap, .tm_list_file_list_wrap2{
	display: none;
}

.tm_list_file_list_list, .tm_list_file_list_list2{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 12px 16px;
	background-color: #FAFAFA;		
}

.tm_list_file_list_list, .tm_list_file_list_list3{
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 12px 16px;
	background-color: #FAFAFA;		
}

.file-list-col{
	display: flex;
	align-items: center;
	width: 50%;
	cursor: default;
}

.file-list-col:not(:last-child){
	margin-bottom: 16px;
}

.file-list-thumb{
	flex-basis: 32px;
	margin-right: 24px;
}

.file-list-info p:not(:last-child){
	margin-bottom: 3px;
}

.file-list-info-name{
	font-weight: bold;
}

.file-list-info-date span,
.file-list-info-author span{
	color: #4B5151;
}

.popup-input-col.wraps{
	flex-wrap: wrap;
}

.file-list{
	display: flex;
	align-items: center;
	padding: 4px 0;
}

button.front.btn-file-list-delete{
	width: 16px;
	height: 16px;
	border: 1px solid #E5E5E5;
	border-radius: 4px;
	margin-left: 4px;
	background-image: url('../image/icon-file-list-delete.svg');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
}

.popup-input-data{
	display: flex;
	align-items: center;
	width: 100%;
	height: 24px;
	margin: 4px 8px;
	padding: 0 12px;	
}


.popup-input-data.tm_list_pop_etc{
	height: 72px;
	overflow-y: auto;
}



input.front.common-checkbox{
	visibility: hidden;
	position: absolute;
	width: 0px;
	height: 0px;
	top: 0;
	left: 0;
	z-index: -1;
}

input.front.common-checkbox + label.common-checkbox-label{
	display: flex;
	align-items: center;
	height: 24px;
	margin: 4px 8px;
	cursor: pointer;	
	padding-left: 24px;
	background-image: url('../image/icon-common-checkbox.svg');
	background-repeat: no-repeat;
	background-size: 24px 24px;
	background-position: 0 center;
}

input.front.common-checkbox:checked + label.common-checkbox-label{	
	background-image: url('../image/icon-common-checkbox-checked.svg');
}

.front.margin-top_0{
	margin-top: 0;
}

.front.margin-right_0{
	margin-right: 0;
}

.login-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;
	height: 100vh;
	padding: 16px;
	background-image: url('../image/bg-login.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.login-container{
	width: 100%;
	max-width: 384px;
	height: fit-content;
	padding: 56px 32px;
	padding-top: 72px;
	background-color: rgba(255,255,255,0.5);
	border-radius: 12px;
}

.system-name{
	text-align: center;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -0.05em;
	margin-bottom: 24px;
}

.login-input-row{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-direction: row-reverse;
	margin-bottom: 4px;
}

input.front.login-input{
	width: 100%;
	height: 48px;
	padding: 0 12px;
	border: 0;
	border-radius: 0px 4px 4px 0px;
	background-color: rgba(255,255,255,0.7);
	font-size: 14px;
}

input.front.login-input::placeholder{
	color: #666666;
}

input.front.login-input:focus{
	border: 0;
}

.img-login-input{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 48px;
	height: 48px;
	background: #4B5151;
	border-radius: 4px 0px 0px 4px;
	transition: background 0.3s;
}

input.front.login-input:focus + .img-login-input{
	background-color: #004D99;
}

input.front.login-input.remember{
	visibility: hidden;
	position: absolute;
	width: 0px;
	height: 0px;
	top: 0;
	left: 0;
	z-index: -1;
}

input.front.login-input.remember + label{
	display: flex;
	align-items: center;	
	cursor: pointer;
}

input.front.login-input.remember + label::before{
	content: '';
	display: inline-block;
	width: 20px;
	height: 19px;
	background: url('../image/icon-login-checkbox-unchecked.svg') no-repeat 100% center;
}

input.front.login-input.remember:checked + label::before{
	background: url('../image/icon-login-checkbox-checked.svg') no-repeat 100% center;
}

button.front.btn-login{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 48px;
	margin-top: 12px;
	border-radius: 4px;
	background: #05508C;
	font-size: 18px;
	font-weight: 400;
	color: #fff;
	transition: background 0.3s;
}

button.front.btn-login:hover{
	background: #00A5E5;
}

.login-confirm-row{
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-top: 16px;
}

.login-confirm-col{
	display: flex;
	justify-content: flex-end;	
	align-items: center;
	height: 40px;
}

.login-confirm-label{
	font-size: 16px;
	letter-spacing: -0.05em;
	font-weight: 700;
	margin-right: auto;
}

.login-confirm-radio-box{	
	display: flex;
	width: 86px;
	margin-left: 4px;
}

.radio-login-confirm-type{
	visibility: hidden;
	position: absolute;
	width: 0;
	height: 0;
	z-index: -1;
}

.radio-login-confirm-type + label{
	display: flex;
	align-items: center;
	padding-left: 30px;	
	font-size: 14px;
	font-weight: 700;
	color: #4B5151;
	width: 100%;
	height: 32px;
	cursor: pointer;
	background-image: url(../image/icon-radio-login-confirm-type.svg);
	background-repeat: no-repeat;
	background-size: 24px;
	background-position: 4px center;
	border: 2px solid transparent;
	border-radius: 18px;	
}

.radio-login-confirm-type:checked + label{
	background-image: url(../image/icon-radio-login-confirm-type-checked.svg);
	border: 2px solid #00A5E5;
	border-radius: 18px;
	color: #00A5E5;
	background-color: #FFF;
}

.login-confirm-input-box{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 36px;
	padding: 0 12px;
	background-color: #FFF;
	border: 1px solid #CCC;
	border-radius: 4px;
}

.login-confirm-input-box.active{
	border-color: #00A5E5;
}

input.front.input-login-confirm-request{
	width: 100%;
	height: 100%;
	border: 0;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.05em;
	color: #000;
}

input.front.input-login-confirm-request::placeholder{
	color: #4B5151;
}

button.front.btn-login-confirm-request{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: 128px;
	height: 36px;
	background-color: #4B5151;
	color: #FFF;
	border-radius: 4px;
	margin-left: 4px;
}

button.front.btn-login-confirm-request:hover{
	background-color: #00A5E5;
}

.login-confirm-request-time{
	font-size: 14px;
	font-weight: 700;
	color: #00A5E5;
}

.login-confirm-col{
	margin-bottom: 4px;
}

.change-password-row{
	display: block;
	text-align: center;
	padding-top: 8px;
}

.system-name-p{
	font-size: 14px;
	margin-top: 8px;
	font-weight: 400;
}

.user-common-input-info{
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 18px;
	height: 18px;
	top: 50%;
	right: 12px;
	transform: translate(0,-50%);
	border-radius: 12px;
	background-color: #637E99;
	color: #FFF;
	font-size: 12px;
	font-weight: 700;
	cursor: default;
}

input.front.user-common-input{
	width: 100%;
	height: 48px;
	font-size: 16px;
}

input.front.user-common-input::placeholder{
	font-size: 16px;
}

.btn-password-reset-row{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 8px;
}

button.front.btn-password-reset{
	width: calc(50% - 3px);
	height: 48px;
	background-color: #4B5151;
	border-radius: 4px;
	color: #FFF;
	font-size: 18px;
	transition: background-color 0.3s;
}

button.front.btn-password-reset:hover{
	background-color: #343838;
}

button.front.btn-password-reset.confirm{
	background-color: #05507D;
}

button.front.btn-password-reset.confirm:hover{
	background-color: #00A5E5;
}

.popup-res-row{
	padding-top: 8px;
}

.multi-check-select{
	width: 100%;
	padding: 4px 8px;
}

.multi-check-select-combobox{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	min-height: 24px;	
	border-radius: 4px;
	border: 1px solid #CFDEE5;
	padding-left: 12px;
	padding-right: 24px;
}

.multi-check-select.show .multi-check-select-combobox{
	border-color: #00A5E5;
}

.front.btn-multi-check-select{
	position: absolute;
	width: 24px;
	height: 24px;
	top: 0;
	right: 0;
	z-index: 2;
	background-image: url('../image/icon-multi-check-select.svg');
	background-repeat: no-repeat;
	background-size: 10px auto;
	background-position: center top 2px;
}

.multi-check-select.show .front.btn-multi-check-select{
	background-color: #637E99;
	background-image: url('../image/icon-multi-check-select-wh.svg');
}

.multi-check-select-value-box{
	display: flex;
    align-items: center;
	margin-right: 3px;
	width: fit-content;
	height: 20px;
	padding: 3px 8px;
	border-radius: 6px;
	background-color: #d7effe;
	margin-top: 1px;
	margin-bottom: 1px;
}

button.front.multi-check-select-value-del{
	width:14px;
	height: 14px;
	margin-left: 2px;
	border-radius: 7px;
	background-color: #637E99;
	background-image: url('../image/icon-file-list-delete-wh.svg');
	background-repeat: no-repeat;
	background-size: 14px;
	background-position: center;
}

input.front.multi-check-select-input{
	width: 72px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	font-size: 1em;	
}

.multi-check-select-ul{
	visibility: hidden;	
	position: absolute;
	width: calc(100% - 16px);
	height: 205px;
	overflow-y: auto;
	top: calc(100% - 4px);
	left: 8px;
	background: #fff;	
	border: 1px solid #666;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
	z-index: -1;
}

.multi-check-select.show .multi-check-select-ul{
	visibility: visible;
	z-index: 90;
}

.multi-check-select-li{
	display: flex;
	align-items: center;
	padding: 8px 12px;	
}

.multi-check-select-li:not(:last-child){
	border-bottom: 1px solid #CFDEE5;
}

.multi-check-select-li:hover{
	background-color: #F7FCFF;
}

.multi-check-select-li-checkbox{
	position: absolute;
	visibility: hidden;
	width: 0px;
	height: 0px;
	top: 0;
	left: 0;
	z-index: -1;
}

.multi-check-select-li-checkbox-label{
	display: flex;
	align-items: center;
	height: 24px;
	padding-left: 24px;
	background-image:url('../image/icon-common-checkbox.svg');
	background-repeat: no-repeat;
	background-size: 24px;
	background-position: 0px center;
	cursor: pointer;	
}

.multi-check-select-li-checkbox:checked + .multi-check-select-li-checkbox-label{
	background-image: url('../image/icon-common-checkbox-checked.svg');
}

.error-wrap{
	display: flex;
	flex-direction: column;
	align-items: center;	
	width: 100%;
	height: 100vh;
	padding: 16px;
	padding-top: 144px;
}

.error-img{
	width: 100%;
	max-width: 480px;
}

.error-h1{
	font-size: 8em;
	font-weight: bold;
	margin: 24px 16px;
}

.error-message{
	font-size: 1.5em;
	line-height: 1.5em;
	color: #BDBDBA;
}

.content-sort.type-wrap {
    display: block;
}
.chart-wrap {
	display: flex;
	width: 100%;
}
.chart-wrap * {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.chart-wrap .chart-box {
	flex: 1;
	margin-left: 3%;
}
.chart-wrap .chart-box h3 {
	font-size: 12px;
}
.chart-wrap .chart-box:first-child {
	margin-left: 0;
}
.chart-wrap .chart-box .chart-area{
	position: relative;
	display: flex;
	min-height: 114px;
	margin-top: 8px;
}
.chart-wrap .chart-box .chart-area canvas{
	width: 100% !important;
	height: 100% !important;
}
.chart-wrap .chart-box .chart-area.type-legend canvas {
	max-width: 50%;
	flex: 1;
}
.chart-wrap .chart-box .chart-area.type-legend .legend {
	width: 50%;
	padding-left: 16px;
}
.chart-wrap .chart-box .chart-area.type-legend .legend ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	width: 100%;
	height: 100%;
}
.chart-wrap .chart-box .chart-area.type-legend .legend li {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
}
.chart-wrap .chart-box .chart-area.type-legend .legend li * {
	line-height: 1.5;
}
.chart-wrap .chart-box .chart-area.type-legend .legend li .square {
	margin-right: 4px;
	width: 12px;
	height: 12px;
}
.chart-wrap .chart-box .chart-area.type-legend .legend li .label {
	overflow: hidden;
	width: 60%;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.chart-wrap .chart-box .chart-area.type-legend .legend li .value {
	margin-left: auto;
}
.hide-calendar .ui-datepicker-calendar{
	display: none;
}
.hide-month .ui-datepicker-month{
	display: none;
}

.popup-title.notice{
	font-size: 16px;
}

.notice-popup-row{
	display: flex;	
	margin-bottom: 16px;
}

.notice-popup-row.wrap{
	flex-direction: column;	
}

.notice-popup-label{
	font-size: 16px;
	line-height: 1.3em;
	font-weight: 500;
	padding-left: 10px;
}

.notice-popup-label::before{
	content: '';
	position: absolute;
	width: 6px; height: 6px;
	top: 8px; left: 0px;
	border-radius: 3px;
	background-color: #00A5E5;
}

.notice-popup-text{
	font-size: 16px;
	margin-left: 8px;
	line-height: 1.3em;
	word-break: keep-all;
}

.notice-popup-row.wrap .notice-popup-text{
	margin-left: 12px; margin-top: 8px;
}

body.notice-page{
	min-width: 0px;
	overflow-y: auto;
}

.notice-page-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 100vh;
	padding: 48px;
	background-image: url('../image/bg-login.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.notice-page-container{
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
	max-width: 640px;
	max-height: 100%;
	overflow-y: auto;
	padding: 36px;
	background: #FFF;
	box-shadow: 0px 4px 4px rgba(0,0,0,0.25);
}

.notice-page-title{
	display: flex;
	justify-content: center;
	align-items: center;
	background: #05507D;
	color: #FFF;	
	font-size: 24px;
	font-weight: 700;
	border-radius: 8px;
	padding: 12px;
}

.notice-page-row{
	display: flex;
	gap: 12px;
	padding: 0 24px;	
}

.notice-page-row.wrap{
	flex-direction: column;
	gap: 4px;
}

.notice-page-label{
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3em;
	padding-left: 12px;
}

.notice-page-label::before{
	content: '';
	position: absolute;
	width: 6px; height: 6px;
	top: 10px; left: 0px;
	border-radius: 3px;
	background-color: #00A5E5;
}

.notice-page-text{
	font-size: 20px;
	line-height: 1.3em;
	word-break: keep-all;
}

.notice-page-row.wrap .notice-page-text{
	padding-left: 12px;
}

.notice-page-end{
	display: flex;
	justify-content: center;
	margin-top: 36px;
	font-size: 16px;
}

@media (max-width: 740px){
	.notice-page-wrap{
		padding: 18px;
	}

	.notice-page-container{
		padding: 18px;
		gap: 12px;
	}

	.notice-page-title{
		font-size: 16px;
	}

	.notice-page-row{
		gap: 6px;
		padding: 0px 12px;
	}

	.notice-page-label,
	.notice-page-text,
	.notice-page-end{
		font-size: 12px;
	}

	.notice-page-label{
		padding-left: 8px;
	}

	.notice-page-label::before{
		width: 3px;
		height: 3px;
		top: 7px;
	}

	.notice-page-row.wrap .notice-page-text{
		padding-left: 8px;
	}

	.notice-page-end{
		margin-top: 18px;
	}

}

button.btn-header{
	display: flex; justify-content: center; align-items: center;	
	width: 55px;
	height: 55px;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
}

button.btn-header.bookmark{
	background-color: #0b4178;
	background-image: url(../image/header-bookmark.svg);
}

button.btn-header.bookmark.active{
	background-image: url(../image/header-bookmark-active.svg);
}

button.btn-header.changepw{
	background-image: url(../image/header-changepw.svg);
}

button.btn-header.changepw.active{
	background-image: url(../image/header-changepw-active.svg);
}



button.btn-header .new-num{
	position: absolute;
	top: 2px; right: 2px;
	width: 16px; height: 16px;	
	border-radius: 8px;
	background-color: #FF2B00;
	color: #FFF;
	font-size: 12px;
	font-weight: 500;
	text-align: center;
	padding-top: 1.5px;
	box-sizing: border-box;
	overflow: hidden;
}

button.btn-header[data-num='0'] .new-num{
	display: none;
}

.dashboard-wrap{
	display: flex; gap: 16px; align-items: stretch;
	width: 100%; height: 100%;
}

.dashboard-wrap *{
	box-sizing: border-box;
}

.dashboard-wrap .left,
.dashboard-wrap .right{
	width: 100%; height: 100%;
}

.dashboard-wrap .left{
	display: flex; flex-direction: column; gap: 16px;	
}

.dashboard-wrap .col{
	display: flex; flex-direction: column;
	width: 100%; height: 100%;
	background-color: #FFF;
	border-radius: 8px;
	overflow: hidden;
}

.dashboard-wrap .col .title-row{
	position: relative;
	display: flex; align-items: center; flex-shrink: 0;
	width: 100%; height: 56px;
	padding: 0 28px;
	border-bottom: 1px solid #2E7199;
	background-color: #FAFEFF;
}

.dashboard-wrap .col .title-row .title{
	display: flex; align-items: center; gap: 4px;
	font-size: 16px;
	font-weight: 700;
	color: #000;
}

.dashboard-wrap .col .title-row .more{
	display: flex; align-items: center;
	height: 16px;
	margin-left: auto;
	text-decoration: none;
	font-size: 12px; font-weight: 700;
	color: #2E7199;
	padding-right: 16px;
	background-image: url(../image/icon-dashboard-title-more.svg);
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: right center;
}

.dashboard-wrap .col .content-row{	
	width: 100%; height: 100%;
/* 	padding: 16px 32px; */
	overflow-y: auto;
	margin-top: 5px;
}

.dashboard-wrap .col .title-row::before{
	content: '';
	position: absolute;
	width: calc(100% - 64px); 
/* 	height: 16px; */
	bottom: -17px;	
	left: 32px;
	background: #FFF;
	z-index: 2;
}

.dashboard-table{	
	width: 100%;
	table-layout: fixed;	
	border-spacing: 0;
	padding: 0 25px;
}

.dashboard-table th{
	background-color: #FAFCFF;
	border: 0;
	border-bottom: 1px solid #C2D2F2;
	text-align: center;
	vertical-align: middle;
	height: 48px;
	font-size: 12px; font-weight: 700;
	color: #000;
	padding: 0 8px;
	position: sticky;
	top: 0;
}

.dashboard-table td{
	border: 0;
	border-bottom: 1px solid #D9D9D9;
	text-align: center;
	vertical-align: middle;
	height: 48px;
	font-size: 12px;
	color: #666;
	padding: 0 8px;
}

.dashboard-table td.text-align-left{
	text-align: left;
}

.dashboard-table td a{
	text-decoration: none;
	color: inherit;
}

.dashboard-table td a:hover{
	color: #00A5E5;
}

.dashboard-table tr:hover td{
	background-color: #fafafa;
	
}

.bottom-copyright{
	position: fixed;
    width: calc(100% - 240px);
    min-width: calc( 900px - 240px);
    height: 44px;
    bottom: 0px;
    left: 240px;
    display: flex;
	justify-content: center;
    align-items: center;
    background: #EBEBEB;
    color: #2E7199;
    transition: all 0.2s;
    z-index: 90;
	font-size: 12px;	
}

.left-menu-off .bottom-copyright{
	width: 100%;
	left: 0;
}

.bottom-copyright-privacy-policy{
	position: absolute;
	top: 50%; right: 36px;
	transform: translate(0, -50%);
	text-decoration: none;
	font-size: 12px;
	color: #000;
}

.layer-wrap{
	position: fixed;
	top: 59px; right: -300px;
	z-index: 91;
	width: 300px;
	height: calc(100vh - 55px - 12px);
	background-color: #FFF;
	border: solid 1px #d1d1d1;	
	border-right: 0;
	transition: right 0.3s ease;
	border-radius: 8px 0px 0px 8px;
	display: flex;
	flex-direction: column;		
}

.layer-wrap.on{
	right: 0;
}

.layer-wrap *{
	font-size: 12px;
	box-sizing: border-box;
	position: relative;
}

.layer-wrap .title-row{
	width: 100%;
	height: 48px;
	flex-shrink: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0px 16px;
	font-size: 15px;
	font-weight: 700;
	color: #003f66;
	background-color: #e4edf3;
	border-bottom: 1px solid #d1d1d1;
	border-radius: 8px 0px 0px 0px;
}

.layer-wrap .content-row{
	width: 100%;
	margin-top: 8px;
}

.layer-wrap .tab-top-bar{
	display: flex; justify-content: space-between;
	border-bottom: 1px solid #8FB5CC;
	padding: 0 12px;
}

.tab-top-bar .tab-col,
.tab-top-bar .sort-col{
	display: flex; align-items: center;
}

.tab-top-bar button.btn-layer-tab{
	display: flex; height: 36px; align-items: center;
	padding: 0 12px;
	color: #666666;
}

.tab-top-bar button.btn-layer-tab.current{
	font-weight: 700;
	color: #00A5E5;
}

.tab-top-bar button.btn-layer-tab.current::before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #00A5E5;
}

.tab-top-bar .sort-col{
	display: flex; gap: 12px;
}

.tab-top-bar .sort-col button.btn-layer-sort{
	color: #666;
}

.tab-top-bar .sort-col button.btn-layer-sort.current{
	font-weight: 700;
	color: #000;
}

.layer-wrap .tab-content{
	width: 100%;
}

.tab-content#bookmarkTab .li{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	height: 42px;
	padding: 0 16px;
	border-bottom: 1px solid #e5e5e5;
}

.tab-content#bookmarkTab .li a{
	font-size: 14px;
	font-weight: 600;
	color: #000;
	padding-left: 16px;
}

.tab-content#bookmarkTab .li a::before{
	content:'';
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 2px;
	background-color: #999999;
	top: 50%;
	left: 4px;
	transform: translate(0,-50%);
}

.tab-content#bookmarkTab .li button{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: 42px;
	height: 23px;
	min-width: 0;
	border-radius: 2px;
	background-color: #FFF;
	border: 1px solid #c4c4c4;
	font-size: 12px;
	color: #838383;
	padding: 0;
	font-weight: 500;
}

.tab-content .li{
	display: flex; flex-direction: column; gap: 8px;
	padding: 16px 20px;
	border-bottom: 1px solid #8FB5CC;
	color: #666;
}

.tab-content .li .subject{
	text-decoration: none;
	color: inherit;
	font-weight: 700;
	line-height: 16px;
	word-break: break-all;
}

.tab-content .li .date{
	display: flex;
	gap: 36px;
}

.tab-content .li[data-checked='1'] .subject{
	color: #000;
}

.tab-content .li[data-checked='1'] .subject::after{
	content: '[NEW]';
	color: #FF2B00;
}

.mail-popup-container{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 900px;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	max-height: calc(100% - 20px);
	overflow-y: hidden;
}

.mail-popup-input-col{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
	justify-self: flex-start;
	width: 100%;
}

.dual-grid-popup-container{
	display: table;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 1000px;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	height : 300px;
	max-height: calc(100% - 24px);
	overflow-y: auto;
}

.dual-grid-popup-content{
	float: left; 
	display: table-cell; 
	width: 48%;
	height: 100%; 
	padding:0 10px;
	vertical-align: top; 
	box-sizing: border-box;
}

.dual-grid-popup-button{
	width: 4%;
	float: left;
	padding-top: 120px;
	vertical-align: top;
}

.dual-grid-popup-button input{
	margin-bottom: 10px;
}

.dual-grid-popup-move-button{
	height: 30px;
	padding: 3px 15px;
	background: #757575;
	line-height: 21px;
	border-radius: 5px;
	border: 0;
	color: #fff;
	cursor: pointer;
}

@media only all and (min-width:1025px) {
.bbs_view_cont{ width:100%; float: left;padding: 150px 8px; box-sizing: border-box;line-height: 15px;letter-spacing: 1px;}
}

.popup-editor{
	display : block;
	min-width: 124px;
	padding: 50px 20px;
	margin-bottom: 5px;
}

.term-popup-container{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 900px;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
	max-height: auto;
	overflow-y: hidden;
}

.layer-wrap .title-row{
	flex-shrink: 0;
}

.layer-wrap .content-row{
	display: flex;
	flex-direction: column;
	height: calc(100% - 56px - 8px);
	margin-top: 0px;
}

.layer-wrap .tab-top-bar{
	flex-shrink: 0;
}

.layer-wrap .tab-content{
	height: 100%;
	overflow-y: auto;
}

input.front.tm_list_file{
	visibility: hidden;
	position: absolute;
	width: 0;
	height: 0;
	top: 0;
	left: 0;
	z-index: -1;
}

label.front.btn_tm_list_file{
	margin: 8px;
	background-color: #637E99;
	border-radius: 4px;
	color: #fff;
	padding: 8px 16px;
	font-weight: 400;
	cursor: pointer;
	margin-right: 0;
}


#toast {
    position: fixed;
    bottom: 30px;
    left: 90%;
    padding: 15px 20px;
    transform: translate(-50%, 10px);
    border-radius: 30px;
    overflow: hidden;
    font-size: .8rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s, visibility .5s, transform .5s;
    background: #ffe46a;
    color: #595959;
    z-index: 10000;
    width: 250px;
    font-weight:bold;
    text-align:center;
    line-height:1.1em;
}

#toast.reveal {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0)
}

button.front.btn-login-confirm-request-block {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 128px;
    height: 36px;
    background-color: red;
    color: #FFF;
    border-radius: 4px;
    margin-left: 4px;
}

.guide_area {
    display: block;
    margin-top: 10px;
}

.err_txt {
    color: #f07e2e;
}

.guide_txt {
    display: block;
    font-size: 0.85rem;
    font-weight: bold;
}

.err_txt:before {
    display: inline-block;
    content: '';
    margin-right: 4px;
    width: 18px;
    height: 18px;
    background: url(../image/icon.png) no-repeat -382px 0;
    vertical-align: text-bottom;
}

.not-entered {
	background-color : #c8c8c8 !important;
}


.docAddTitle {
	color: #e36f50;
    font-weight: bold;
    font-size: 10px;
    margin: auto 0;
    width: 100%;
    text-align: end;
}

.new-login-wrap{
	display: flex;
	flex-direction: column;	
	width: 100vw;
	height: 100vh;
	background-color: #FFF;
	padding: 0 36px;	
}

.new-login-header{
	flex-shrink: 0;
	display: flex;
	align-items: center;
	height: 89px;
}

.new-login-header img{
	height: 40px;
}

.new-login-footer{
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 12px;
	height: 89px;	
}

.new-login-footer .row{
	display: flex;
	align-items: center;
	gap: 10px;
}

.new-login-footer .row a{
	font-family: inherit;
	font-weight: 800;
	font-size: 16px;
	color: #666666;
	text-decoration: none;
}

.new-login-footer .row .dot{
	width: 4px;
	height: 4px;
	border-radius: 2px;
	background-color: #aaaaaa;
}

.new-login-footer .text{
	font-size: 14px;
	color: #575757;
	font-weight: 500;
}

.new-login-footer .text span{
	color: #8f8f8f; 	
}

.new-login-body{	
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.new-login-body-bgimg{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	z-index: 1;
}

.new-login-body-bgimg-container{
	width: 100%;
	height: 100%;
}

.new-login-body-bgimg-container div{
	width: 100%;
	height: 100%;
	min-width: 100%;
	min-height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	transition: opacity 0.3s ease;
}

.new-login-body-bgimg-container .bg-01{
	background-image: url(../image/new-login-bg-01.png);
}

.new-login-body-bgimg-container .bg-02{
	background-image: url(../image/new-login-bg-02.png);
}

.new-login-body-bgimg-container .bg-03{
	background-image: url(../image/new-login-bg-03.png);
}

.new-login-body-bgimg-container .bg-04{
	background-image: url(../image/new-login-bg-04.png);
}

.new-login-body-contents{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	z-index: 2;
}

.new-login-body-contents *{
	position: relative;
	box-sizing: border-box;
	line-height: 1em;
	font-family: inherit;
	color: inherit;
}

.new-login-body-contents .inner{
	width: 100%;
	max-width: 1440px;
	padding: 48px;	
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 48px;
}

.new-login-body-contents .left{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.new-login-body-contents .left .text-01{
	font-size: 48px;
	font-weight: 700;
	color: #FFF;
	line-height: 1.0833333333333333em;
	word-break: keep-all;
}

.new-login-body-contents .left .text-02{
	margin-top: 24px;
	font-size: 18px;
	font-weight: 600;
	color: #FFF;
	line-height: 1.4444444444444444em;
}

.new-login-body-contents .left .btns{
	display: flex;
	gap: 7px;
	margin-top: 55px;
}

.new-login-body-contents .left .btns button{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	height: 62px;
	padding: 0 24px;
	border-radius: 31px;
	background-color: rgba(6,13,22,0.7);
	border: 0;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	color: #FFF;
	cursor: pointer;
	white-space: nowrap;
}

.new-login-body-contents .left .btns button.faq::before{
	content: url(../image/new-login-message-text.svg);
	display: block;
	width: 28px;
	height: 28px;
}

.new-login-body-contents .left .btns button.manual::before{
	content: url(../image/new-login-books.svg);
	display: block;
	width: 28px;
	height: 28px;
}

.new-login-body-contents .right{
	display: flex;
	gap: 8px;
	width: 100%;
	max-width: 770px;	
}

.new-login-body-contents .right .col{
	width: 100%;
	max-width: 381px;	
}

.new-login-body-contents .right .col.login-box{	
	background-color: #FFF;
	padding: 36px;
	flex-shrink: 1;
}

.new-login-body-contents .right .col.login-box form{
	display: flex;
	flex-direction: column;	
	width: 100%;
	height: 100%;
}

.new-login-body-contents .right .col.login-box .text-01{
	font-size: 20px;
	font-weight: 700;
	color: #353535;
	margin-bottom: 15px;
}

.new-login-body-contents .right .col.login-box input[type='text'],
.new-login-body-contents .right .col.login-box input[type='password']{
	width: 100%;
	height: 40px;
	background-color: #eeeeee;
	border: 1px solid #bcbcbc;
	padding: 0 24px 0px 48px;
	font-size: 14px;
	font-weight: 500;
	color: #575757;
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: 15px center;
}

.new-login-body-contents .right .col.login-box input[type='text']:focus,
.new-login-body-contents .right .col.login-box input[type='password']:focus{
	border-color: #1f2934;
	background-color: #FFF;
	color: #000;
	outline: none;
}

.new-login-body-contents .right .col.login-box .new-login-code{
	margin-bottom: 4px;
	background-image: url(../image/new-login-code.png);
}

.new-login-body-contents .right .col.login-box .new-login-id{
	margin-bottom: 4px;
	background-image: url(../image/new-login-id.png);
}

.new-login-body-contents .right .col.login-box .new-login-pw{
	margin-bottom: 8px;
	background-image: url(../image/new-login-pw.png);
}

.new-login-body-contents .right .col.login-box .new-login-submit{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 44px;
	background-color: #005386;
	font-size: 16px;
	font-weight: 600;
	color: #FFF;
	border: 0;
	cursor: pointer;
	padding: 0;
}

.new-login-body-contents .right .col.login-box .new-login-row-01{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 8px;
	width: 100%;
	height: 16px;
}

.new-login-row-01 .id-remember{
	display: flex;
	align-items: center;
	gap: 7px;
}

.new-login-row-01 .id-remember .new-login-id-remember{
	width: 16px;
	height: 16px;
	background-color: #FFF;
	border: 1px solid #575757;
	border-radius: 0;
	margin: 0;
	padding: 0;
}

.new-login-row-01 .id-remember label{
	font-size: 13px;
	color: #000;
	cursor: pointer;
	font-weight: 500;
}

.new-login-row-01 button.new-login-find-pw{
	font-size: 13px;
	color: #7f7f7f;
	background: none;
	border: 0;
	cursor: pointer;
}

.new-login-bottom-join{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: 31px;
}

.new-login-bottom-join-text-01{
	font-size: 14px;
	font-weight: 600;
	color: #102837;
}

.new-login-bottom-join button{
	font-size: 14px;
	font-weight: 600;
	color: #1996df;
	background: none;
	border: 0;
	margin: 0;
	padding: 0;
	padding-right: 12px;
	background-image: url(../image/new-login-bottom-join.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 6px;
	cursor: pointer;
}

.new-login-body-contents .right .notice-box{
	background-color: #1d3852;
	padding: 36px 30px;	
}

.new-login-notice-box-header{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 16.5px;
}

.new-login-notice-box-header .text img{
	height: 16.5px;
}

.new-login-notice-box-header button{
	background: none;
	border: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;
	font-size: 14px;
	color: #a2adb8;
	padding-right: 18px;
	background-image: url(../image/new-login-notice-box-header-button.png);
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: right center;
}

.new-login-notice-ul{
	width: 100%;
	overflow: hidden;
	margin-top: 14px;
}

.new-login-notice-li{
	width: 100%;
	border-top: 1px solid #344c64;
	padding: 15px 0px;
	overflow: hidden;
}

.new-login-notice-ul .new-login-notice-li:nth-child(1){
	border-top: 0;
}

.new-login-notice-li .date{
	font-size: 13px;
	font-weight: 500;
	color: #778898;
}

.new-login-notice-li .subject::before{
	content: ' ';
	display: block;
	width: 100%;
	visibility: hidden;
	font-size: 16px;
	font-weight: 400;
	margin-top: 10px;
}

.new-login-notice-li .subject a{
	position: absolute;
	top: 0px;
	left: 0px;
	display: block;
	width: 100%;		
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 16px;
	font-weight: 400;
	color: #FFF;
	text-decoration: none;
	height: 19px;
}

@media (max-width: 1477px){
	.new-login-body-contents .left .text-01{
		font-size: 36px;
	}
}

@media (max-width: 1280px){
	.new-login-body-contents .left .btns{
		flex-direction: column;
		margin-top: 24px;
	}
}

@media (max-width: 1080px){
	.new-login-bottom-join{
		flex-direction: column;
	}
}

@media (max-height: 630px){
	.new-login-wrap{
		display: block;
		overflow-y: auto;
	}
}

@media (min-width: 1580px){
	.new-login-body-contents .inner{
		padding: 0;
	}
}

.new-login-popup{
	display: none;
}

.new-login-popup *{
	box-sizing: border-box;
	/* line-height: 1em; */ 
	position: relative;
}

.new-login-popup-container{
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 90;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba(0,0,0,0.6);
}

.new-login-popup-box.terms{
	position: relative;
	width: 100%;
	max-width: 600px;
	background-color: #FFF;
	padding: 36px 32px;
}

.new-login-popup-box{
	position: relative;
	width: 100%;
	max-width: 404px;	
	background-color: #FFF;
	padding: 36px 32px;
}

.btn-new-login-popup-close{
	position: absolute;
	width: 15px;
	height: 15px;
	top: 20px;
	right: 18px;
	background: none;
	background-image: url(../image/new-popup-colse.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	margin: 0;
	padding: 0;
	border: 0;
	cursor: pointer;
}

.new-popup-title .title{
	font-size: 24px;
	font-weight: 700;
	color: #353535;
	text-align: center;
}

.new-popup-title .title.blue{
	color: #09b4d4;
}

.new-popup-title .text{
	margin-top: 12px;
	font-size: 14px;
	color: #575757;
	text-align: center;
}

.new-popup-contents{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	width: 100%;
	margin-top: 20px;
}

.new-popup-contents form{	
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	width: 100%;
}

.user-certification-type{
	display: flex;
	width: 100%;		
}

#user-certification .user-certification-type{
	margin-top: 28px;
}

#user-find-password .user-certification-type{
	margin-top: 14px;
}

.user-certification-type .radio-box{
	width: 100%;
}

.user-certification-type .radio-box input[type='radio']{
	position: absolute;
	width: 0px;
	height: 0px;
	top: 0;
	left: 0;
	visibility: hidden;
	z-index: -1;
}

.user-certification-type .radio-box label{
	margin: 0;
	padding: 0;		
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	width: 100%;
	height: 40px;
	background-color: #FFF;
	border: 1px solid #dcdcdc;
	font-size: 13px;
	font-weight: 600;
	color: #171717;
	cursor: pointer;
}

.user-certification-type .radio-box .phone img{
	width: 16px;
}

.user-certification-type .radio-box .email img{
	width: 20.5px;
}

.user-certification-type .radio-box input[type='radio']:checked + label{
	background-color: #1996df;
	color: #FFF;
	font-size: 12px;
	border: 0;
}

.user-certification-type .radio-box input[type='radio']:checked + label img{
	filter: brightness(0) invert(1);
}

.user-certification-number{	
	display: flex;
	align-items: center;
	gap: 4px;
	width: 100%;
	height: 48px;
	border: 1px solid #d7d7d7;
	padding: 3px;
}

.user-certification-number-input-box{
	width: 100%;
	height: 100%;
}

.user-certification-number-input-box input{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 15px;
	border: 0;
	background-color: #FFF;
	font-family: inherit;
}

.user-certification-number-input-box input:focus{
	outline: none;
	font-size: 14px;
}

.user-certification-number-confirm-time{
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translate(0, -50%);
	font-size: 14px;
}

.user-certification-number-button{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: 75px;
	height: 100%;
	background-color: #1996df;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: #FFF;
	border: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;
}

.popup-form-message-area{
	display: block;
	margin: 10px 0px;
	font-size: 13px;
	color: #ed4739;
	text-align: center;
}

.popup-form-message-area:empty{
	display: none;
}

.new-popup-submit-button{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 48px;
	background-color: #005689;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	color: #FFF;
	border: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;	
}

.new-popup-submit-button:hover{
	background-color: #004872;
}

.new-popup-submit-button.disable{
	background-color: #d7d7d7;
	cursor: not-allowed;
}

input.new-popup-input-text{
	width: 100%;
	height: 48px;
	padding: 0 13px;
	background-color: #f1f1f1;
	border: 1px solid #d7d7d7;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: #000;
}

input.new-popup-input-text::placeholder{
	color: #969696;
}

input.new-popup-input-text:focus{
	background-color: #FFF;
	border-color: #000;
	color: #000;
	outline: none;
}

.new-popup-submit-button-row{
	display: flex;
	width: 100%;
	gap: 4px;
}

.new-popup-cancel-button{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 48px;
	background-color: #a8a8a8;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	color: #FFF;
	border: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;	
}

.new-popup-cancel-button:hover{
	background-color: #8f8f8f;
}

.front.btn-new-common{
	display: flex;
	align-items: center;	
	height: 33px;
	border-radius: 4px;
	padding: 0 15px;
	font-size: 13px;
	font-weight: 600;
}

.sort-btn-col .front.btn-new-common{
	font-size: 13px;
	height: 28px;
	padding: 0 15px;
}

.front.btn-new-common.small{
	height: 24px;
	font-weight: 500;
}

.front.btn-new-common.search{
	padding-left: 34px;
	background-image: url(../image/btn-new-common-search.svg);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: 6px center;
	background-color: #3d9cd7; color: #FFF;
}

.front.btn-new-common.excel{
	padding-left: 32px;
	background-image: url(../image/btn-new-common-excel.svg);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: 6px center;
}

.front.btn-new-common.white-bg{
	background-color: #FFF;
	border: 1px solid #838383;
	color: #171717;
}

.front.btn-new-common.white-bg:hover{
	background-color: #F7F7F7;
}

.sbgrid_fixed_cell_st{
	/*border-bottom: 0;*/
}

body.user-type-B .sbgrid_fixed_table_st{
	background-color: #2361a1;
}

body.user-type-E .sbgrid_fixed_table_st{
	background-color: #237d45;
}

tr.sbgrid_common td{
	border-left: 1px solid #afafaf;
}

.res-list-select{
	position: absolute;
	top: 50%;
	right: 0;	
	transform: translate(0, -50%);
}

.res-list-select select{
	font-size: 14px;
	border: 1px solid #838383;
	height: 24px;
}

.grid-bottom-pagenation{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2px;
	padding: 4px;
	margin-top: 4px;	
}

.grid-bottom-pagenation a{
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
	line-height: 1em;
	width: 24px;
	height: 24px;
	font-size: 13px;
	font-weight: 600;
	color: #000;
	border: 1px solid #B2BAD2;
}

.grid-bottom-pagenation a.first,
.grid-bottom-pagenation a.prev,
.grid-bottom-pagenation a.next,
.grid-bottom-pagenation a.last{
	border: 0;
}

.grid-bottom-pagenation a.first:hover,
.grid-bottom-pagenation a.prev:hover,
.grid-bottom-pagenation a.next:hover,
.grid-bottom-pagenation a.last:hover{
	background-color: #FFF;
}

.grid-bottom-pagenation a.first path,
.grid-bottom-pagenation a.prev path,
.grid-bottom-pagenation a.next path,
.grid-bottom-pagenation a.last path{
	fill: #676767;
}

.grid-bottom-pagenation a.current{
	color: #FFF;
	border: 0;
}

.grid-bottom-pagenation a:hover{
	background-color: #B2BAD2;
	color: #FFF;
	text-decoration: none;
}

.grid-bottom-pagenation a.disable{
	opacity: 0.3;
}

.grid-bottom-pagenation a.disable:hover,
.grid-bottom-pagenation a.current:hover
{
	cursor: default;
	text-decoration: none;
	background-color: #FFF;
}


#new-join .new-login-popup-box{
	border-radius: 16px;
	max-width: 780px;
	height: 90vh;
	max-height: 90vh;
	padding: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.new-join-title-bar{
	flex-shrink: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 62px;
	padding: 0 24px;
	background-color: #dee5ee;
}

.new-join-title-bar img{
	width: 180px;	
}

.new-join-title-bar .btn-new-login-popup-close{
	position: relative;
	top: auto;
	right: auto;
}

.new-join-visual{
	width: 100%;
	height: 90px;
	flex-shrink: 0;
	background-image: url(../image/new-join-visual.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.new-join-contents{
	height: 100%;
	padding: 36px;
	padding-top: 0;
	overflow-y: scroll;
}

.new-join-contents .new-join-contents-row:nth-child(1) .new-join-contents-category,
.new-join-contents .new-join-contents-row:nth-child(1) .new-join-contents-contents{
	border-top: 0;
}

.new-join-contents-row{
	display: flex;
	width: 100%;
}

.new-join-contents-category.terms{
	width: 100%;
	flex-shrink: 0;
	padding: 24px;
	padding-left: 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.05em;
	color: #191919;
	border-top: 1px solid #767676;
}

.new-join-contents-category{
	width: 172px;
	flex-shrink: 0;
	padding: 24px;
	padding-left: 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.05em;
	color: #191919;
	border-top: 1px solid #767676;
}

.new-join-contents-category.single-line{
	display: flex;
	align-items: center;
}

.new-join-contents-category .sub-text{
	font-size: 13px;
	font-weight: 500;
	color: #575757;
	line-height: 1.3846153846153846em;;
	margin-top: 16px;
}

.new-join-contents-category .sub-text span{
	color: #1996df;
}

.new-join-contents-contents{
	width: 100%;
	padding: 24px 15px;
	padding-right: 0;
	border-top: 1px solid #e5e5e5;
}

select.new-join-form{
	width: 100%;
	height: 42px;
	background-color: #FFF;
	border: 1px solid #bfbfbf;
	border-radius: 4px;
	padding: 0 16px;
	padding-right: 28px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	background-image: url(../image/new-join-form-select-dn.png);
	background-repeat: no-repeat;
	background-size: 14.5px;
	background-position: right 16px center;
	color: #171717;
	-webkit-appearance:none;/*select 내부 스타일 제거 (화살표 제거)*/ 
	-moz-appearance:none; 
	-o-appearance:none; 
	appearance:none; 
}

select.new-join-form:focus-visible{
	background-image: url(../image/new-join-form-select-up.png);
}

select.new-join-form::-ms-expand { 
	display: none; /*익플 10,11이상. 화살표 감추기*/ 
}

input.new-join-form{
	width: 100%;
	height: 42px;
	background-color: #FFF;
	border: 1px solid #bfbfbf;
	border-radius: 4px;
	padding: 0 16px;	
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;	
	color: #171717;	
}

input.new-join-form:disabled{
	background-color: #f1f1f1;
}

.new-join-form-button{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: 84px;
	height: 42px;
	border-radius: 4px;
	background-color: #46505d;
	font-size: 14px;
	font-weight: 600;
	color: #FFF;
	border: 0;
	cursor: pointer;
}

.new-join-form-button.off{
	background-color: #868686;
	cursor: default;
}

.new-join-form-button:hover{
	background-color: #005689;
}

.new-join-form-button.off:hover{
	background-color: #868686;
}

.new-join-form-box .label{
	font-size: 14px;
	font-weight: 700;
	color: #575757;
}

.new-join-form-row{
	display: flex;
	gap: 4px;
}

.new-join-form-box .label + .new-join-form-row{
	margin-top: 8px;
}
	
.new-join-form-box + .new-join-form-box{
	margin-top: 16px;
}

.new-join-form-row .input-wrap{
	position: relative;
	width: 100%;
}

.new-join-form-row + .new-join-form-row{
	margin-top: 6px;
}

.company-name-kr::before{
	content: '(한글)';
	display: block;
	position: absolute;
	top: 50%;
	left: 16px;
	transform: translate(0, -50%);
	z-index: 2;
	font-size: 14px;
	font-weight: 600;
	color: #171717;
}

.company-name-kr input{
	padding-left: 54px;
}

.company-name-en::before{
	content: '(영문)';
	display: block;
	position: absolute;
	top: 50%;
	left: 16px;
	transform: translate(0, -50%);
	z-index: 2;
	font-size: 14px;
	font-weight: 600;
	color: #171717;
}

.company-name-en input{
	padding-left: 54px;
}

input[type='radio'].new-join-form{
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	visibility: hidden;
	z-index: -1;
}

input[type='radio'].new-join-form + label.new-join-form{
	display: inline-flex;
	align-items: center;
	width: auto;
	height: 36px;
	padding-right: 18px;
	padding-left: 40px;
	background-color: #FFF;
	border: 1px solid #bfbfbf;
	border-radius: 4px;
	background-image: url(../image/new-join-form-radio.png);
	background-repeat: no-repeat;
	background-size: 18px;
	background-position: left 10px center;
	font-size: 14px;
	font-weight: 600;
	color: #575757;
	cursor: pointer;
}

input[type='radio'].new-join-form:checked + label.new-join-form{
	border-color: #1996df;
	background-image: url(../image/new-join-form-radio-checked.png);
	font-weight: 700;
	color: #1996df;
}

.new-join-form-box span.red{
	font-size: 14px;
	color: #ed4739;
}

input[type='file'].new-join-form{
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	visibility: hidden;
	z-index: -1;
}

.new-join-agreed-box{
	border-bottom: 1px solid #e5e5e5;
}

.new-join-agreed-box.all{
	border-bottom: 1px solid #a6a6a6;
}

.new-join-agreed-row{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	height: 42px;
}

.new-join-agreed-checkbox .new-join-agreed-checkbox-all{
	width: 18px;
	height: 18px;
	padding: 0;
	margin: 0;
}

.new-join-agreed-label{
	font-size: 14px;
	font-weight: 600;
	color: #171717;
	cursor: pointer;
}

.new-join-agreed-label.all{
	color: #1996df;
}

.new-join-agreed-checkbox:required + label::after{
	content: '(필수)';
	display: inline-block;
	font-size: inherit;
	font-weight: inherit;
	color: #ed4739;
	margin-left: 3px;
}

.new-join-agreed-checkbox:optional + label::after{
	content: '(선택)';
	display: inline-block;
	font-size: inherit;
	font-weight: inherit;
	color: #1996df;
	margin-left: 3px;
}

.new-join-agreed-label.all::after{
	display: none !important;
}

.new-join-agreed-button{
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	margin-left: auto;
	font-size: 13px;
	font-weight: 600;
	color: #767676;
	letter-spacing: -0.05em;
	padding-right: 26px;
	background-image: url(../image/new-join-agreed-button.png);
	background-repeat: no-repeat;
	background-size: 8px;
	background-position: right 10px center;
	cursor: pointer;
}

.new-join-agreed-button.on{
	background-image: url(../image/new-join-agreed-button-on.png);
}

.new-join-agreed-text{
	display: none;
	width: 100%;
	height: 173px;
	overflow-y: scroll;
	padding: 15px 20px;
	background-color: #f1f1f1;
	font-size: 12px;
	color: #575757;
	line-height: 1.5em;
	margin-bottom: 8px;
}

.new-join-agreed-bottom{
	margin-top: 15px;
}

.new-join-agreed-bottom-row{
	font-size: 10px;
	line-height: 1.5em;
	color: #575757;
	letter-spacing: -0.05em;
	word-break: keep-all;
	padding-left: 6px;
	text-indent: -6px;
}

.new-join-agreed-bottom-row::before{
	content: '※';
	display: inline-block;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}

.new-join-agreed-bottom-row + .new-join-agreed-bottom-row{
	margin-top: 4px;
}

.new-join-info-box{
	display: flex;
	gap: 4px;
}

.new-join-info-box + .new-join-info-box{
	margin-top: 16px;
}

.new-join-info-box .col{
	width: 100%;
}

.new-join-info-box .label{
	font-size: 14px;
    font-weight: 700;
    color: #575757;
	margin-bottom: 8px;
}

.new-join-info-id{
	position: absolute;
	top: 50%;
	right: 5px;
	transform: translate(0,-50%);
	z-index: 2;
	width: 57px;
	height: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #dee5ee;
	border: 1px solid #b8c7da;
	font-size: 12px;
	font-weight: 600;
	color: #005689;
	letter-spacing: -0.05em;
	margin: 0;
	padding: 0;
	border-radius: 4px;
	cursor: pointer;
}

.new-join-form.user-id{
	padding-right: 72px;
}

.new-join-info-box .error-msg{
	font-size: 13px;
	font-weight: 500;
	color: #ed4739;
	margin-top: 10px;
}

.new-join-form-box .error-msg{
	font-size: 13px;
	font-weight: 500;
	color: #ed4739;
	margin-top: 10px;
}

.new-join-form.user-phone{
	padding-right: 50px;
}

.new-join-info-phone{
	position: absolute;
	top: 0;
	right: 0;
	width: 78px;
	height: 42px;
	padding: 0;
	border: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #46505d;
	border-radius: 0px 4px 4px 0px;
	font-size: 14px;
	font-weight: 700;
	color: #FFF;
	cursor: pointer;
	z-index: 2;
}

.new-join-info-phone.off{
	background-color: #868686;
}

.new-join-info-phone:hover{
	background-color: #005689;
}

.new-join-info-phone.off:hover{
	background-color: #868686;
}

.new-join-info-phone-time {
	width: 100%;
	height: 42px;
	padding: 0 16px;
	border-radius: 4px;
	background-color: #FFF;
	border: 1px solid #bfbfbf;
	font-size: 14px;
	font-weight: 500;
}

.time-text {
	position: absolute;
	right: 35%;
	top: 50%;
	transform: translateY(-50%);
	font-size: 14px;
	font-weight: 500;
	color: #ed4739;
}

.new-join-info-box .col.phone-time{
	max-width: 250px;
}

.new-join-info-box.user-email{
	flex-direction: column;
	gap: 0;
}

.new-join-info-box.user-email .row{
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 14px;
}

.btn-new-join-submit{
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	margin: 0;
	margin-top: 0;
	padding: 0;
	border: 0;
	background-color: #005689;
	font-size: 16px;
	font-weight: 700;
	color: #FFF;
	letter-spacing: -0.05em;
	cursor: pointer;
}

.btn-new-join-submit:hover{
	background-color: #1996df;
}

.res-btn-col .front.btn-new-common.white-bg:hover{
	background-color: #dee6eb;
}

#new-notice-pop .new-login-popup-box{
	border-radius: 16px;
    max-width: 780px;
    height: auto;
    max-height: 90vh;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* .new-join-title-bar-text{ */
/* 	font-size: 24px; */
/* 	font-weight: 800; */
/* 	color: #005386; */
/* 	letter-spacing: -0.05em; */
/* } */

.new-join-title-bar-text{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 24px;
	font-weight: 800;
	color: #005386;
	letter-spacing: -0.05em;
}

.new-join-title-bar-text img{
	width: 100px;
}


#new-notice-pop .new-join-contents{
	padding-top: 36px;
}

#new-notice-pop .new-join-visual{
	background-image: url(../image/new-join-visual-notice.png);
}

.new-notice-pop-list{
	border-top: 2px solid #005689;
	border-bottom: 1px solid #c8cdd2;
}

.new-notice-pop-list .row{
	padding: 0px 16px;
}

.new-notice-pop-list .row.open .arrow{
	transform: rotate(180deg);
}

.new-notice-pop-list .row + .row{
	border-top: 1px solid #c8cdd2;
}

.new-notice-pop-list .subject-row{
	display: flex;
	align-items: center;
	height: 48px;	
	font-size: 14px;
	cursor: pointer;
}

.new-notice-pop-list .subject-row .subject{
	width: 100%;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	height:17px;
}

.new-notice-pop-list .subject-row .date{
	flex-shrink: 0;
	margin-left: 16px;
	height:17px;
}

.new-notice-pop-list .subject-row .arrow{
	width: 36px;
	height: 36px;
	background-image: url(../image/icon-expand-menu.svg);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	flex-shrink: 0;
	margin-left: 16px;
}

.new-notice-pop-list .contents-row{
	display: none;
	width: 100%;
	padding: 16px;
	background-color: #F5F5F5;
	font-size: 14px;
	line-height: 1.3em;	
	margin-bottom: 16px;
}

.new-notice-pop-list .contents-row .subject{
	font-weight: 700;
	margin-bottom: 12px;
	line-height: 1.3em;
}

.new-notice-pop-pagenation{
	display: flex;
	justify-content: center;
	align-items: center;	
	margin-top: 18px;
}

.new-notice-pop-pagenation a{
	font-size: 14px;
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 24px;
	color: #000;
}

.new-notice-pop-pagenation a + a::before{
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0,-50%);
	display: block;
	width: 1px;
	height: 16px;
	background-color:#c8cdd2;
}

.new-notice-pop-pagenation .prev + a::before{
	display: none;
}

.new-notice-pop-pagenation .next::before{
	display: none;
}

.new-notice-pop-pagenation a.current{
	font-weight: 700;
	color: #005386;
}

.new-notice-pop-pagenation a:hover{
	text-decoration: underline;
}

.new-notice-pop-pagenation .prev{
	background-image: url(../image/new-notice-pop-pagenation-prev.svg);
	background-size: 24px;
	background-position: center;
	opacity: 0.5;
}

.new-notice-pop-pagenation .prev:hover{
	opacity: 1;
}

.new-notice-pop-pagenation .next{
	background-image: url(../image/new-notice-pop-pagenation-next.svg);
	background-size: 24px;
	background-position: center;
	opacity: 0.5;
}

.new-notice-pop-pagenation .next:hover{
	opacity: 1;
}


#new-FAQ-pop .new-login-popup-box , #new-MANUAL-pop .new-login-popup-box { 	
	border-radius: 16px;
    max-width: 780px;
    height: auto;
	min-height: 50vh;
    max-height: 90vh;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#new-TERMSCONDITIONS-pop-PP .new-login-popup-box, #new-TERMSCONDITIONS-pop-ToS .new-login-popup-box {
	border-radius: 16px;
    max-width: 850px;
    height: auto;
	min-height: 50vh;
    max-height: 90vh;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#new-FAQ-pop .new-join-contents, #new-MANUAL-pop .new-join-contents
, #new-TERMSCONDITIONS-pop-ToS .new-join-contents, #new-TERMSCONDITIONS-pop-PP .new-join-contents{ 
	padding-top: 36px;
}

#new-FAQ-pop .new-join-visual, #new-MANUAL-pop .new-join-visual
, #new-TERMSCONDITIONS-pop-ToS .new-join-visual, #new-TERMSCONDITIONS-pop-PP .new-join-visual{ 
	background-image: url(../image/new-join-visual-faq.png);
}

#new-FAQ-pop .new-notice-pop-list .subject-row .subject::before
, #new-MANUAL-pop .new-notice-pop-list .subject-row .subject::before 
, #new-TERMSCONDITIONS-pop-ToS .new-notice-pop-list .subject-row .subject::before 
, #new-TERMSCONDITIONS-pop-PP .new-notice-pop-list .subject-row .subject::before{ 
	content: 'Q.';
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	color: #005689;
	margin-right: 4px;
}

#new-FAQ-pop .new-notice-pop-list .contents-row::before
, #new-MANUAL-pop .new-notice-pop-list .contents-row::before
, #new-TERMSCONDITIONS-pop-ToS .new-notice-pop-list .contents-row::before 
, #new-TERMSCONDITIONS-pop-PP .new-notice-pop-list .contents-row::before{ 
	/* content: '[A]'; */
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	color: #00A5E5;
	margin-right: 4px;
}

.new-login-popup-tab-button{
	display: flex;
	align-items: flex-end;
	gap: 4px;
	border-bottom: 1px solid #005689;
	margin-bottom: 16px;
}

.new-login-popup-tab-button button{
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 120px;
	height: 34px;
	border-radius: 4px 4px 0px 0px;
	border: 1px solid #c7cacf;
	border-bottom: 0;
	background-color: #dedede;
	margin: 0;
	padding: 0 16px;
	font-family: inherit;	
	font-size: 14px;
	font-weight: 500;
	line-height: 1em;
	color: #171717;
	cursor: pointer;
}

.new-login-popup-tab-button button.on{
	height: 40px;
	background-color: #005689;
	font-size: 15px;
	font-weight: 700;
	color: #FFF;
	border: 0;
}

.new-login-popup-tab-content{
	display: none;
}

.header-userinfo-pop{
	right: auto;
	left: auto;
}

.header-userinfo-pop::before{
	right: auto;
	left: 6px;
}

button.front.btn-userinfo.on{
	color: #FFF;
}

.top-nav.disabled::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
}
.top-nav.disabled::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.1);
}

.popup-input-row + .popup-input-row{
	border-top: 0;
}

.popup-input-label{
	color: #FFF;
	border: 0;
}

.new-join-contents#join-ok{
	padding: 36px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow-y: auto;
}

.new-join-ok-img{
	display: block;
	width: 100%;
	max-width: 160px;
	margin: 0 auto;
}

.new-join-ok-text01{
	font-size: 24px;
	font-weight: 800;
	color: #005689;
	margin-top: 30px;
	text-align: center;
}

.new-join-ok-text02{
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3333333333333333em;
	color: #575757;
	margin-top: 16px;
	text-align: center;
}

.new-join-ok-text02 span{
	color: #488ff7;
}

.new-join-ok-button{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width:233px;
	height: 48px;
	border-radius: 4px;
	background-color: #005689;
	font-size: 16px;
	font-weight: 700;
	color: #FFF;
	border: 0;
	padding: 0;
	margin: 0 auto;
	margin-top: 44px;
	cursor: pointer;
	flex-shrink: 0;
}

.new-join-ok-button:hover{
	background-color: #1996df;
}

.popup-title{
	display: flex;
	/*justify-content: space-between;*/
	align-items: center;
	/*padding: 8px 16px;*/
}

.popup-title-btn{
	display: flex;
	gap: 4px;
}

.popup-title-btn button.front{
	margin: 0;
}

.sbgrid-in-tab-box{
	position: relative;
	width: 100%;
	height: 26px;
	overflow: hidden;
	padding-right: 52px;
	border-bottom: solid 1px #005689;
}

.sbgrid-in-tab-row{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	gap: 2px;
	width: 100%;
	height: 26px;
}

button.front.sbgrid-in-tab{
	display: inline-flex;
	align-items: center;
	height: 26px;
	padding: 0 16px;
	background-color: #FFF;
	font-size: 13px;
	font-weight: 500;
	border: solid 1px #778898;
	border-bottom: 0;
}

button.front.sbgrid-in-tab.on{
	color: #FFF;
	border: 0;
}

.sbgrid-in-tab-content-box{
	margin-top: 8px;
}

.sbgrid-in-tab-content-box .sbgrid-area{ padding-bottom: 80px; }

.sbgrid-no-paging .sbgrid-area{ padding-bottom: 45px; }

.sbgrid-no-paging-row .sbgrid-area{ padding-bottom: 22.5px; }

.sbgrid-in-tab-content{
	display: none;
}

.sbgrid-in-tab-content.on{
	display: block;
}

/*  20240526 원부연 작성 */
/* 저장 버튼의 스타일 */
.btn-save {
	background-color: #2f5597; /* 어두운 파란색 배경색 */
	border: 1px solid #2f5597; /* 어두운 파란색테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-save:hover {
	background-color: #234172; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #234172; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-save:active {
	background-color: #234172; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #234172; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 수정 버튼의 스타일 */
.btn-edit {
	background-color: #007bff; /* 어두운 파란색 배경색 */
	border: 1px solid #007bff; /* 어두운 파란색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-edit:hover {
	background-color: #0056b3; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #004386; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-edit:active {
	background-color: #004080; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #003366; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 삭제 버튼의 스타일 */
.btn-delete {
	background-color: #a50021; /* 어두운 빨간색 배경색 */
	border: 1px solid #a50021; /* 어두운 빨간색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-delete:hover {
	background-color: #80001a; /* 더 어두운 빨간색으로 배경색 변경 */
	border-color: #80001a; /* 더 어두운 빨간색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-delete:active {
	background-color: #80001a; /* 더 어두운 빨간색으로 배경색 변경 */
	border-color: #80001a; /* 더 어두운 빨간색으로 테두리 색상 변경 */
}

/* 엑셀 버튼의 스타일 */
.btn-excel {
	background-color: #385723; /* 어두운 초록색 배경색 */
	border: 1px solid #385723; /* 어두운 초록색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-excel:hover {
	background-color: #273d18; /* 더 어두운 초록색으로 배경색 변경 */
	border-color: #273d18; /* 더 어두운 초록색으로 테두리 색상 변경 */
}
/* 클릭 시 스타일 */
.btn-excel:active {
	background-color: #273d18; /* 더 어두운 초록색으로 배경색 변경 */
	border-color: #273d18; /* 더 어두운 초록색으로 테두리 색상 변경 */
}

/* 행 추가 버튼의 스타일 */
.btn-add-row {
	background-color: #203864; /* 짙은 파란색 배경색 */
	border: 1px solid #203864; /* 짙은 파란색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-add-row:hover {
	background-color: #142441; /* 더 짙은 파란색으로 배경색 변경 */
	border-color: #142441; /* 더 짙은 파란색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-add-row:active {
	background-color: #142441; /* 더 짙은 파란색으로 배경색 변경 */
	border-color: #142441; /* 더 짙은 파란색으로 테두리 색상 변경 */
}

/* 조회 버튼의 스타일 */
.btn-search {
	background-color: #3d9cd7; /* 주어진 파란색 배경색 */
	border: 1px solid #3d9cd7; /* 주어진 파란색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 6px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-search:hover {
	background-color: #3583ba; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #3583ba; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-search:active {
	background-color: #2f749f; /* 더 어두운 파란색으로 배경색 변경 */
	border-color: #2f749f; /* 더 어두운 파란색으로 테두리 색상 변경 */
}



/* 업로드 버튼 스타일 */
.btn-upload {
	background-color: #49798d; /* 청록색 배경색 */
	border: 1px solid #dddddd; /* 밝은 회색 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 6px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-upload:hover {
	background-color: #365a69; /* 좀 더 어두운 청록색 변경 */
	border-color: #cccccc; /* 좀 더 어두운 회색으로 테두리 색상 변경 */
	color: #ffffff; /* 흰색 텍스트 색상 */
}

/* 클릭 시 스타일 */
.btn-upload:active {
	background-color: #294652; /* 좀 더 어두운 청록색 변경 */
	border-color: #b3b3b3; /* 좀 더 어두운 회색으로 테두리 색상 변경 */
	color: #ffffff; /* 흰색 텍스트 색상 */
}

/* 부수적인 흰색 버튼의 스타일 */
.btn-etc {
	background-color: #ffffff; /* 흰색 배경색 */
	border: 1px solid #dddddd; /* 밝은 회색 테두리 */
	color: #333333; /* 어두운 회색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 6px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-etc:hover {
	background-color: #f2f2f2; /* 밝은 회색으로 배경색 변경 */
	border-color: #cccccc; /* 좀 더 어두운 회색으로 테두리 색상 변경 */
	color: #333333; /* 어두운 회색 텍스트 색상 */
}

/* 클릭 시 스타일 */
.btn-etc:active {
	background-color: #e6e6e6; /* 좀 더 어두운 흰색으로 배경색 변경 */
	border-color: #b3b3b3; /* 좀 더 어두운 회색으로 테두리 색상 변경 */
	color: #333333; /* 어두운 회색 텍스트 색상 */
}

/* etc2 버튼의 스타일 */
.btn-orange {
	background-color: #FFB124; /* 어두운 배경색 */
	border: 1px solid #FFA500; /* 어두운 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-orange:hover {
	background-color: #FF8C00; /* 더 어두운 배경색 변경 */
	border-color: #FF6700; /* 더 어두운 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-orange:active {
	background-color: #FF8C00; /* 더 어두운 배경색 변경 */
	border-color: #FF6700; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 양식, 청구마감 */
.btn-dark-green {
	background-color: #385723; /* 어두운 배경색 */
	border: 1px solid #385723; /* 어두운 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-dark-green:hover {
	background-color: #273d18; /* 더 어두운 배경색 변경 */
	border-color: #273d18; /* 더 어두운 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-dark-green:active {
	background-color: #273d18; /* 더 어두운 배경색 변경 */
	border-color: #273d18; /* 더 어두운 파란색으로 테두리 색상 변경 */
}

/* 청구마감 취소*/
.btn-green {
	background-color: #548235; /* 어두운 배경색 */
	border: 1px solid #548235; /* 어두운 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

/* 마우스 호버 시 스타일 */
.btn-green:hover {
	background-color: #44692c; /* 더 어두운 배경색 변경 */
	border-color: #44692c; /* 더 어두운 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-green:active {
	background-color: #44692c; /* 더 어두운 배경색 변경 */
	border-color: #44692c; /* 더 어두운 파란색으로 테두리 색상 변경 */
}


.btn-light-red {
	background-color: #FF8172; /* 어두운 배경색 */
	border: 1px solid #FF6E5D; /* 어두운 테두리 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
}

.btn-inner-search{
	position: absolute;
	top: 6px;
	right: 1;
	border: none;
	background-color: white;
	cursor: pointer;
}

.front .disabled{
	background-color: lightgrey;
}

/* 저장 버튼의 스타일 */
.btn-popup-new {
	background-color: #00A5E5; /* 주어진 색상으로 배경색 설정 */
	border: 1px solid #00A5E5; /* 주어진 색상으로 테두리 설정 */
	color: #ffffff; /* 흰색 텍스트 색상 */
	align-items: center;
	border-radius: 4px;
	padding: 5px 15px; /* 위아래 6px, 좌우 15px */
	font-size: 13px;
	font-weight: 600;
	margin-left: 3px;
}

/* 마우스 호버 시 스타일 */
.btn-popup-new:hover {
	background-color: #0078b9; /* 더 어두운 색으로 배경색 변경 */
	border-color: #0078b9; /* 더 어두운 색으로 테두리 색상 변경 */
}

/* 클릭 시 스타일 */
.btn-popup-new:active {
	background-color: #005d8b; /* 더 어두운 색으로 배경색 변경 */
	border-color: #005d8b; /* 더 어두운 색으로 테두리 색상 변경 */
}

/** 원부연 작성 end **/

/* Spinner */
#loading{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999999999999;
	width: 100vw;
	height: 100vh;
	background-color: rgba(255,255,255,0.5);
	backdrop-filter: blur(2px);
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 16px;
}
#loading > .loading-icon{
	width: 72px;
	height: 72px;
	border-radius: 46px;
	border: solid 9px;
	border-color: #dbdccf;
	border-right-color: #005689;
	animation: spinner 1s infinite linear;
}

#loading > .loading-msg{
	font-size: 13px;
	font-weight: 600;
}

@keyframes spinner {
	to {
		transform: rotate(1turn);
	}
}

.content-wrap.type-col .grid-column__row{
	display: flex;
	flex-direction: column;
	width: calc(50% - 8px);
	height: 50%;
/* 	gap: 16px; */
}

.grid-column__row .sbgrid-wrap{
	display: flex;
	flex-direction: column;
	height: 100%;
}

.grid-column__row .sbgrid-wrap .res-header-row,
.grid-column__row .sbgrid-wrap .grid-bottom-pagenation{
	flex-shrink: 0;
}

/*user type color*/
body.user-type-A header.header{ background-color: #005689; }
body.user-type-B header.header{ background-color: #2361a1; }
body.user-type-C header.header{ background-color: #203f59; }
body.user-type-D header.header{ background-color: #028ca9; }
body.user-type-E header.header{ background-color: #237d45; }

body.user-type-A .header-h1 .user-type{ color: #0ed9ff; }
body.user-type-B .header-h1 .user-type{ color: #0ed9ff; }
body.user-type-C .header-h1 .user-type{ color: #0ed9ff; }
body.user-type-D .header-h1 .user-type{ color: #fff6a5; }
body.user-type-E .header-h1 .user-type{ color: #fff6a5; }

body.user-type-A button.front.btn-userinfo{ background-color: #36c6ff; }
body.user-type-B button.front.btn-userinfo{ background-color: #36c6ff; }
body.user-type-C button.front.btn-userinfo{ background-color: #36c6ff; }
body.user-type-D button.front.btn-userinfo{ background-color: #fff6a5; }
body.user-type-E button.front.btn-userinfo{ background-color: #fff6a5; }

body.user-type-A button.btn-header.changepw.active{ background-image: url(../image/header-changepw-active.svg); }
body.user-type-B button.btn-header.changepw.active{ background-image: url(../image/header-changepw-active.svg); }
body.user-type-C button.btn-header.changepw.active{ background-image: url(../image/header-changepw-active.svg); }
body.user-type-D button.btn-header.changepw.active{ background-image: url(../image/header-changepw-active-yellow.svg); }
body.user-type-E button.btn-header.changepw.active{ background-image: url(../image/header-changepw-active-yellow.svg); }

body.user-type-A button.btn-header.bookmark{ background-color: #0b4178; }
body.user-type-B button.btn-header.bookmark{ background-color: #0b4178; }
body.user-type-C button.btn-header.bookmark{ background-color: #173751; }
body.user-type-D button.btn-header.bookmark{ background-color: #00738b; }
body.user-type-E button.btn-header.bookmark{ background-color: #1a6838; }

body.user-type-A .nav-dl.active .nav-dt{ background-color: #09b4d4; }
body.user-type-B .nav-dl.active .nav-dt{ background-color: #0abddf; }
body.user-type-C .nav-dl.active .nav-dt{ background-color: #3d9cd7; }
body.user-type-D .nav-dl.active .nav-dt{ background-color: #0abddf; }
body.user-type-E .nav-dl.active .nav-dt{ background-color: #0fb24c; }

body.user-type-A .nav-dl.open.active .nav-dt{ background-color: #09b4d4; }
body.user-type-B .nav-dl.open.active .nav-dt{ background-color: #0abddf; }
body.user-type-C .nav-dl.open.active .nav-dt{ background-color: #3d9cd7; }
body.user-type-D .nav-dl.open.active .nav-dt{ background-color: #0abddf; }
body.user-type-E .nav-dl.open.active .nav-dt{ background-color: #0fb24c; }

body.user-type-A .top-nav #tab-list .tab-item a.active{ background-color: #005689; border-color: #005689; }
body.user-type-B .top-nav #tab-list .tab-item a.active{ background-color: #2361a1; border-color: #2361a1; }
body.user-type-C .top-nav #tab-list .tab-item a.active{ background-color: #203f59; border-color: #203f59; }
body.user-type-D .top-nav #tab-list .tab-item a.active{ background-color: #028ca9; border-color: #028ca9; }
body.user-type-E .top-nav #tab-list .tab-item a.active{ background-color: #237d45; border-color: #237d45; }

/* body.user-type-A .top-nav #tab-list{ border-bottom: 1px solid #005689; }
body.user-type-B .top-nav #tab-list{ border-bottom: 1px solid #2361a1; }
body.user-type-C .top-nav #tab-list{ border-bottom: 1px solid #203f59; }
body.user-type-D .top-nav #tab-list{ border-bottom: 1px solid #028ca9; }
body.user-type-E .top-nav #tab-list{ border-bottom: 1px solid #237d45; } */

body.front .second-bg{ background-color: #3d9cd7; color: #FFF; }

body.user-type-A .front.btn-new-common.primary-bg{ background-color: #005689; color: #FFF; }
body.user-type-B .front.btn-new-common.primary-bg{ background-color: #2361a1; color: #FFF; }
body.user-type-C .front.btn-new-common.primary-bg{ background-color: #203f59; color: #FFF; }
body.user-type-D .front.btn-new-common.primary-bg{ background-color: #028ca9; color: #FFF; }
body.user-type-E .front.btn-new-common.primary-bg{ background-color: #237d45; color: #FFF; }

body.user-type-A .front.btn-new-common.primary-bg:hover{ background-color: #203f59; }
body.user-type-B .front.btn-new-common.primary-bg:hover{ background-color: #0b4178; }
body.user-type-C .front.btn-new-common.primary-bg:hover{ background-color: #03588c; }
body.user-type-D .front.btn-new-common.primary-bg:hover{ background-color: #00738b; }
body.user-type-E .front.btn-new-common.primary-bg:hover{ background-color: #1a6838; }

/* body.user-type-A .content-sort-wrap{ background-color: #dee6eb; border: 1px solid #ced7dc; }
body.user-type-B .content-sort-wrap{ background-color: #dee6eb; border: 1px solid #ced7dc; }
body.user-type-C .content-sort-wrap{ background-color: #dee6eb; border: 1px solid #ced7dc; }
body.user-type-D .content-sort-wrap{ background-color: #dee6eb; border: 1px solid #ced7dc; }
body.user-type-E .content-sort-wrap{ background-color: #dbe6dd; border: 1px solid #ced7dc; } */

body.user-type-A #new-breadcrumb-icon{ fill: #005689; }
body.user-type-B #new-breadcrumb-icon{ fill: #2361a1; }
body.user-type-C #new-breadcrumb-icon{ fill: #203f59; }
body.user-type-D #new-breadcrumb-icon{ fill: #028ca9; }
body.user-type-E #new-breadcrumb-icon{ fill: #237d45; }

body.user-type-A .layer-wrap .title-row{ background-color: #005689; color: #FFF; }
body.user-type-B .layer-wrap .title-row{ background-color: #2361a1; color: #FFF; }
body.user-type-C .layer-wrap .title-row{ background-color: #203f59; color: #FFF; }
body.user-type-D .layer-wrap .title-row{ background-color: #028ca9; color: #FFF; }
body.user-type-E .layer-wrap .title-row{ background-color: #237d45; color: #FFF; }

/* body.user-type-A button.front.btn-sort-section{ background-color: #005689; }
body.user-type-B button.front.btn-sort-section{ background-color: #2361a1; }
body.user-type-C button.front.btn-sort-section{ background-color: #203f59; }
body.user-type-D button.front.btn-sort-section{ background-color: #028ca9; }
body.user-type-E button.front.btn-sort-section{ background-color: #237d45; } */

body.user-type-A #btn-left-menu-img .btn-left-menu-img-bg{ fill: #005689; }
body.user-type-B #btn-left-menu-img .btn-left-menu-img-bg{ fill: #2361a1; }
body.user-type-C #btn-left-menu-img .btn-left-menu-img-bg{ fill: #203f59; }
body.user-type-D #btn-left-menu-img .btn-left-menu-img-bg{ fill: #028ca9; }
body.user-type-E #btn-left-menu-img .btn-left-menu-img-bg{ fill: #237d45; }

body.user-type-A .nav-dd .btn-left-bookmark.fill{ background-image: url(../image/nav-bookmark-fill-user-type-A.svg); }
body.user-type-B .nav-dd .btn-left-bookmark.fill{ background-image: url(../image/nav-bookmark-fill-user-type-B.svg); }
body.user-type-C .nav-dd .btn-left-bookmark.fill{ background-image: url(../image/nav-bookmark-fill-user-type-C.svg); }
body.user-type-D .nav-dd .btn-left-bookmark.fill{ background-image: url(../image/nav-bookmark-fill-user-type-D.svg); }
body.user-type-E .nav-dd .btn-left-bookmark.fill{ background-image: url(../image/nav-bookmark-fill-user-type-E.svg); }

body.user-type-A .btn-sort-section .bg{ fill: #005689; }
body.user-type-B .btn-sort-section .bg{ fill: #2361a1; }
body.user-type-C .btn-sort-section .bg{ fill: #203f59; }
body.user-type-D .btn-sort-section .bg{ fill: #028ca9; }
body.user-type-E .btn-sort-section .bg{ fill: #237d45; }

body.user-type-A .res-header-row::before{ background-color: #005689; }
body.user-type-B .res-header-row::before{ background-color: #2361a1; }
body.user-type-C .res-header-row::before{ background-color: #203f59; }
body.user-type-D .res-header-row::before{ background-color: #028ca9; }
body.user-type-E .res-header-row::before{ background-color: #237d45; }

body.user-type-A .grid-bottom-pagenation a.current{ background-color: #005689; }
body.user-type-B .grid-bottom-pagenation a.current{ background-color: #2361a1; }
body.user-type-C .grid-bottom-pagenation a.current{ background-color: #203f59; }
body.user-type-D .grid-bottom-pagenation a.current{ background-color: #028ca9; }
body.user-type-E .grid-bottom-pagenation a.current{ background-color: #237d45; }

body.user-type-A .grid-bottom-pagenation a:hover path{ fill: #005689; }
body.user-type-B .grid-bottom-pagenation a:hover path{ fill: #2361a1; }
body.user-type-C .grid-bottom-pagenation a:hover path{ fill: #203f59; }
body.user-type-D .grid-bottom-pagenation a:hover path{ fill: #028ca9; }
body.user-type-E .grid-bottom-pagenation a:hover path{ fill: #237d45; }

body .popup-input-label{ background-color: #2361a1; border-radius: 4px;}

body.user-type-A button.front.btn-popup{ background: #005689; }
body.user-type-B button.front.btn-popup{ background: #2361a1; }
body.user-type-C button.front.btn-popup{ background: #203f59; }
body.user-type-D button.front.btn-popup{ background: #028ca9; }
body.user-type-E button.front.btn-popup{ background: #237d45; }

body.user-type-A .sbgrid-in-tab-box{ border-bottom: solid 1px #005689; }
body.user-type-B .sbgrid-in-tab-box{ border-bottom: solid 1px #2361a1; }
body.user-type-C .sbgrid-in-tab-box{ border-bottom: solid 1px #203f59; }
body.user-type-D .sbgrid-in-tab-box{ border-bottom: solid 1px #028ca9; }
body.user-type-E .sbgrid-in-tab-box{ border-bottom: solid 1px #237d45; }

body.user-type-A button.front.sbgrid-in-tab.on{ background-color: #005689; }
body.user-type-B button.front.sbgrid-in-tab.on{ background-color: #2361a1; }
body.user-type-C button.front.sbgrid-in-tab.on{ background-color: #203f59; }
body.user-type-D button.front.sbgrid-in-tab.on{ background-color: #028ca9; }
body.user-type-E button.front.sbgrid-in-tab.on{ background-color: #237d45; }

.popup-select.front.small{
        width: 150px;
}