@charset "utf-8";

:root {
	--gnb-ft-color: #444; /*탑메뉴 폰트 컬러*/
	--gnb-bg-color: #fff;/*탑메뉴 배경색*/
	--lnb-ft-color: #fff; /*메뉴 폰트 컬러*/
	/* lamp7 custom start */
	--lnb-bg-color: linear-gradient(0deg, rgba(65,88,166,1) 0%, rgba(100,182,230,1) 40%,  rgba(100,182,230,1) 80%,  rgba(0,193,161,1) 100%);/* 메뉴배경색 */
	--sub-bg-color: #5aa3cf;/* 서브메뉴 배경색 */
	/* lamp7 custom end */
	--menu-ov-color: rgba(0,0,0,0.12);/*hover 배경색*/
	--menu-bd-color: rgba(255,255,255,0.2);/*메뉴 구분선*/
	--fold-width: 50px;	/* 접혔을 때 width */
}


/* 레이아웃 구조 */
.layout.container-fluid {
	padding: 0;
	overflow: hidden;
}

.layout-frame {
}


.layout-header {border-bottom: 1px solid #dedede;}
/* .layout-left {border-right: 1px solid #dedede;}
.layout-footer {border-top: 1px solid #dedede;} */


/*flex 기본*/
/* #wrap {
	display:flex;
	flex-wrap:wrap;
	width:100%;
	height:100vh;
} */
.layout-header {
	/* display:none; */
	width:100%;
}
.layout-container {
/* 	display:flex; */
	flex-direction:row;
	width:100%;
}
.layout-left {
	/* display:none; */
	height: 100%;
  	background: var(--lnb-bg-color);
}
.layout-contents {
/* 	display:flex; */
}
.layout-footer {
	/* display:none; */
	width:100%;
	background-color: #f7f7f7;
}

/*all*/
.layout-header {
	display:flex;
	height:70px
}
.layout-container {
	height:calc(100vh - 120px);
}
.layout-left {
	display:flex;
	width:255px;
	height:100%;
	/*overflow-y: auto*/
}
.layout-left .menu-container {
	width: 255px;
}

.layout-contents {
	display:flex;
	width:calc(100% - 225px);
	height:100%;
}
.layout-footer {
	display:flex;
	/* height:80px; */
	height:50px;
}

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


.nav-header {
  	height: 60px;
  	display: flex;
  	align-items: center;
  	position: relative;
}

.nav-header .logo {
  	opacity: 1;
	margin-left:50px;
	height: 60px;
	padding-top:13px;
}

.layout-left.fold, .layout-left.fold > .layout-content {
	width: var(--fold-width);	/* 접혔을 때 width */
}
.layout-left.fold + .layout-contents {
	width: calc(100% - var(--fold-width)) !important;	/* 접혔을 때 width */
}
.layout-left.fold .nav-header .logo {
  	opacity: 0;
}

.layout-left.fold .nav-header .logo .prj-name {
	opacity: 0;
}

.layout-left .nav-header .logo .prj-name {
	opacity: 1;
	vertical-align:bottom;
	font-size:13px;
	letter-spacing:-0.05em;
	margin-left:3px;
	color:#fff;
}
.nav-header .logo img {
	opacity: 1;
	width:88px;/*로고이미지 사이즈 조절*/
}

.nav-header .btn-menu {
  	position: absolute;
  	color: #fff;
  	top: 50%;
  	left: 15px;
  	transform: translateY(-50%);
  	width:22px;
	height:22px;
  	cursor: pointer;
}

.layout-left .nav-header .btn-menu {
  	
}

.nav-header .btn-menu i {
	font-size:22px;
	color:var(--lnb-ft-color);
}
/* TODO: 메뉴줄임아이콘이 없어졌나? */

.ico-menuall {
	background:url("../../img/ico_menuall.png") no-repeat center 50%/20px 20px;
}

.ico-menuall-fold {
	background:url("../../img/ico_menuall_fold.png") no-repeat center 50%/20px 20px;
}

.nav-links {
	border-top:1px solid var(--menu-bd-color);
}

.layout-left.fold .nav-links {
	height:100%;
	overflow-y: hidden;
}
.layout-left.fold .nav-links > li > ul {
	display: none !important;
}
.layout-left.fold .nav-links li a {
	opacity: 1;
}

.layout-left .nav-links {
	overflow-y: auto;
 	/* height:calc(100% - 40px); */
 	height: 100%; 
}
/*스크롤 스타일*/
.layout-left .nav-links::-webkit-scrollbar, .mnb.nav-links::-webkit-scrollbar {
	width: 6px;
}
.layout-left .nav-links::-webkit-scrollbar-thumb, .mnb.nav-links::-webkit-scrollbar-thumb {
	background-color:rgba(0,0,0,0.3);
	border-radius: 10px;
}
.layout-left .nav-links::-webkit-scrollbar-track, .mnb.nav-links::-webkit-scrollbar-track {
	background-color:rgba(0,0,0,0.1);
	border-radius: 10px;
}

.nav-links li {
	list-style: none;
	border-bottom:1px solid var(--menu-bd-color);
}

.nav-links li a {
	display: flex;
  	height: 100%;
  	width: 100%;
  	align-items: center;
	text-decoration: none;
	color: var(--lnb-ft-color);
	padding:10px 0;
}

.nav-links li a .title {
  	font-size: 15px;
  	font-weight: 400;
	width:66%;
	height:18px;
	line-height:1.2;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
  	display: block;
}

.nav-links li a span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.layout-left .nav-links li a .icon {
	min-width: 47px;
	min-height:22px;
	text-align: center;
	font-size:18px;
	color:var(--lnb-ft-color);
	/* TODO: ??? */
}
.layout-left .nav-links > li > a .icon {
	line-height:1.5;
}
.layout-left .nav-links li a:hover {
	background-color:var(--sub-bg-color);
}
.layout-left .nav-links li a .icon {
	position: relative;
    margin-right: 4px;
/*     font-size: 20px; */
    vertical-align: middle;
}
/*.layout-left .nav-links li a .title {
  	display: block;
}*/
.layout-left.fold .nav-links li a .title {
  	display: none;
}

.layout-left .nav-links li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li.menu-sub a {
	background:none;
}
.layout-left .nav-links li.menu-sub a:hover, .layout-left .nav-links li.menu-sub a:active {
	background-color:var(--sub-bg-color);
}
/*.layout-left.fold .nav-links li.menu-sub a:hover, .layout-left .nav-links li.menu-sub a:active {
	background-color:none;
} TODO: ?? */

.layout-left .nav-links li.menu-sub a.on {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
	/*opacity:1;*/
}
.layout-left.fold .nav-links li.menu-sub a.on {
	background:none;
}
.layout-left .nav-links li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
	/*opacity:1;*/
}
.layout-left .nav-links li a.on {
	/*opacity:1;*/
}
.layout-left.fold .nav-links li.menu-sub a.sub-active {
	background:none;
}

.menu-sub > ul {display: none} 

/*2depth*/
.sub-2depth {
	display:none;
	background:var(--sub-bg-color);
	border-top:1px solid var(--menu-bd-color);
}
.layout-left .nav-links li ul.sub-2depth {
	padding:9px 0;
}
.layout-left .nav-links li ul.sub-2depth li {
	border-bottom:0 none;
	font-size:14px;
} 
.layout-left .nav-links li ul.sub-2depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:5px 30px 5px 50px;
	color: #fff;
	background:none;
	/*opacity:0.8;*/
}
.layout-left .nav-links li ul.sub-2depth li a:hover {
	background:var(--menu-ov-color);
	/*opacity:1;*/
}
.layout-left .nav-links li ul.sub-2depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 35px 50%/13px 13px;
	/*opacity:1;*/
}
.layout-left .nav-links li ul.sub-2depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left .nav-links li ul.sub-2depth li.menu-sub a:hover {
	background-color:var(--menu-ov-color);
}
.layout-left .nav-links li ul.sub-2depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
	/*opacity:1;*/
}

/*3depth*/
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li {
	font-size:13px;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:5px 30px 5px 68px;
	color: #fff;
	background:none;
	/*opacity:0.8;*/
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li a:hover,
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a:hover{
	background-color:var(--menu-ov-color);
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 53px 50% / 13px 13px;
	/*opacity:1;*/
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
	/*opacity:1;*/
}

/*4depth*/
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li {
	font-size:12px;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 80px;
	color: #fff;
	background:none;
	/*opacity:0.8;*/
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a:hover,
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a:hover{
	background-color:var(--menu-ov-color);
	/*opacity:1;*/
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 66px 50% / 13px 13px;
	/*color: #fff;
	opacity:1;*/
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}

/*5depth*/
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li {
	font-size:12px;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 90px;
	color: #fff;
	background:none;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a:hover,
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a:hover {
	background-color:var(--menu-ov-color);
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a.on {
	color: #fff;
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 76px 50% / 13px 13px;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*6depth*/
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li {
	font-size:12px;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 100px;
	color: #fff;
	background:none;
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a:hover {
	background-color:var(--menu-ov-color)
}
.layout-left .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a.on {
	color: #fff;
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 86px 50% / 13px 13px;
}

/*gnb*/
.header-wrap {
	display:inherit;
	width:100%;
}
.gnb.nav-links {
	display:flex;
	justify-content:center;
	min-width:400px;
	margin:0 auto;
}
.gnb.nav-links li {
	display:flex;
	border-bottom:0 none;
	list-style:none;
	margin-right:26px;
	position:relative;
}
.gnb.nav-links li:last-child {
	margin-right:0;
}
.gnb.nav-links li a {
	display:inline-flex;
	color:#444;
	text-decoration:none;
	max-width:175px;
	/*opacity:0.7;*/
	text-align:center;
	padding:10px 0 8px 0;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gnb.nav-links li a:hover {
	color:var(--lnb-bg-color);
	/*opacity:1;*/
}
.gnb.nav-links li a .icon {
	min-width: 38px;
	min-height:22px;
	text-align: center;
	font-size:18px;
	color:var(--gnb-ft-color-);
	line-height:1.5;
}
.gnb.nav-links li a .title {
  	font-size: 15px;
	width:100%;
	height:18px;
  	font-weight: 400;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display:block;
	line-height:1.3;
}
.gnb.nav-links li > ul {
	display:none;
}
.gnb.nav-links > li.menu-sub:hover > ul {
	display:block;
	position:absolute;
	min-width:156px;
	top:100%;
	left:0;
	z-index:99;
	background-color:var(--lnb-bg-color);
	padding:12px 0;
}
.gnb.nav-links > li.menu-sub:hover > ul:after {
	border-top: 6px solid transparent;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid var(--lnb-bg-color);
	content: "";
	position: absolute;
	top: -12px;
	left: 25px;
}
.gnb.nav-links li ul.sub-2depth li {
	display:block;
	margin:0;
}
.gnb.nav-links li ul.sub-2depth li a {
	display:block;
	color:#fff;
	font-size:13px;
	padding:5px 12px 5px 25px;
	text-align:left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gnb.nav-links li ul.sub-2depth li a:hover {
	background-color:var(--menu-ov-color);
}
.gnb.nav-links li ul.sub-2depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 11px 50%/13px 13px;
}
.gnb.nav-links li ul.sub-2depth li.menu-sub a {
	background:url("../../img/ico_spread_gray.png") no-repeat 50% 50%;
}
.gnb.nav-links li ul.sub-2depth li.menu-sub a:hover {
	background:var(--menu-ov-color) url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.gnb.nav-links li ul.sub-2depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*gnb 3depth*/
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li {
	display:block;
	margin:0;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a {
	display:block;
	color:#fff;
	font-size:13px;
	padding:5px 25px 5px 36px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a:hover,
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a:hover{
	background-color:var(--menu-ov-color);
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a.on {
	opacity:1;
	background:rgba(255,255,255,0.1) url(../../img/ico_check.png) no-repeat 20px 50%;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 23px 50%/13px 13px;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a:hover {
	background:var(--menu-ov-color) url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*gnb 4depth*/
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li {
	display:block;
	margin:0;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a {
	display:block;
	color:#fff;
	font-size:13px;
	padding:5px 12px 5px 48px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a:hover {
	background-color:var(--menu-ov-color);
	background-image:none;
}
.gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 34px 50%/13px 13px;
}
/*gnb 5depth*/
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li {
	font-size:12px;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 90px;
	color: #fff;
	background:none;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a:hover,
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a:hover {
	background-color:var(--menu-ov-color);
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a.on {
	color: #fff;
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 76px 50% / 13px 13px;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*gnb 6depth*/
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li {
	font-size:12px;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 100px;
	color: #fff;
	background:none;
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a:hover,
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li.menu-sub a:hover {
	background-color:var(--menu-ov-color)
}
.gnb .nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a.on {
	color: #fff;
	background:var(--menu-ov-color) url(../../img/icon-current.svg) no-repeat 86px 50% / 13px 13px;
}



/*사용자 정보*/
.layout-left.fold .user-wrap {
	display:none
}
.layout-left .user-wrap {
	display:block;
	position:absolute;
	bottom:12px;
	left:12px;
	vertical-align:bottom;
}
.layout-left .user-wrap a.icon-setting {
	display:inline-block;
	width:22px;
	height:22px;
	vertical-align:bottom;
	text-decoration:none;
}
.layout-left .user-wrap a.icon-setting > i {
	font-size:22px;
	color:var(--lnb-ft-color);
}
.user-info {
	display:inline-block;
	width:196px;
	min-height:88px;
	border-radius:5px;
	background-color:#fff;
	
}
.user-info ul {
	display:inline-block;
	width:100%;
	padding:10px;
}
.user-info ul li {
	display:inline-block;
	width:100%;
	font-size:13px;
}
.user-info ul li:last-child {
	margin-top:8px;
}
.user-name {
	height:22px;
}
.prj-type select {
	width:100%;
	height:28px;
}
.user-logout {
	text-align:right;
}
.user-logout a {
	display:inline-block;
	text-align:right;
	background:url("../../img/ico_logout.png") no-repeat right 50%/16px 15px;
	padding-right:22px;
	text-decoration:none;
	color:#212121;
	line-height:1.1;
	height:16px;
}

.layout-left .nav-links li ul.sub-2depth a .icon {
	font-size: 18px;
}
.layout-left .nav-links li ul.sub-2depth ul.sub-3depth a .icon {
	font-size: 17px;
}
.layout-left .nav-links li ul.sub-2depth ul.sub-3depth ul.sub-4depth li a .icon {
	font-size: 16px;
}

/* 본문 프레임 */
.iframe-container.layout-content {border:none;margin-left:0;}

/* layout 탭 */
ul.layout-tabs::-webkit-scrollbar {display: none;}
ul.layout-tabs li{display: inline-block;padding: 10px 15px;cursor: pointer;font-size: 13px;line-height: 13px;}
ul.layout-tabs li:hover{border-bottom: 3px solid #efefef;}
ul.layout-tabs li.current{border-bottom: 3px solid #419df9;color: #000;font-weight: bold;}
ul.layout-tabs li .tab-close {font-size: 10px;position:relative;right: -5px;color: #666;}
ul.layout-tabs li .tab-close:hover {color: #419df9}

.layout-contents .layout-tab-container {
	height: 100%;
    overflow: hidden;
}

.layout-contents .layout-tab-content {
/*	border-top: 1px solid var(--container-bd-color2); */
	border-top: 1px solid #ddd;
	height: calc(100% - 36px);
}

.layout-contents .layout-tab-content .tab-content {
	display:none;
	height: 100%;
}

.layout-contents .layout-tab-content .tab-content.current {
	display: inherit;
}

.iframe-contents {
    width: 100%;
    height: 100%;
}

/* lamp7 custom start */
/* LAMP Account Admin*/
.layout-left .account-wrap {
	display:block;
	width:100%;
	margin-top:14px;
	height:27px;
}
.layout-left.fold .account-wrap  {
	display:none;
}
.layout-left.fold .ico-tab {
	display:block;
	width:50px;
	padding-top:14px;
	height:41px;
	text-align:center;
}
.layout-left.fold .ico-tab img {
	width:26px;
	height:16px;
}
.layout-left .ico-tab {
	display:none;
}
.layout-left .account-tab {
	display:flex;
	flex-wrap: wrap;
	width:100%;
}
.layout-left .account-tab li {
	display:inline-flex;
	width:33.333333333333%;
	flex-grow: 1;
}
.layout-left .account-tab li a {
	width:100%;
	border-bottom:2px solid var(--menu-bd-color);
	color:rgba(255,255,255,0.7);
	text-align:center;
	padding-bottom:10px;
	font-size:15px;
	text-decoration:none;
}
.layout-left .account-tab li a.on {
	border-bottom:2px solid rgba(255,255,255,1);
	color:rgba(255,255,255,1);
}

.layout-left .folding_project {
	display:none;
}
.layout-left.fold .folding_project {
	display:block;
	width:34px;
	height:40px;
	background-color:rgba(255,255,255,0.16);
	color:#fff;
	font-size:15px;
	text-align:center;
	border:0 none;
	padding:11px 0;
	margin:12px 8px;
}
.layout-left.fold .folding_project[data-tabid="SETTING"],
.layout-left.fold .folding_project[data-tabid="PUBLISH"] {
	display:none;
}
.list-account {
	display:none;
}
.layout-left.fold .project-dropbox {
	display:none;
}
.layout-left .project-dropbox {
	display:block;
	box-sizing:border-box;
	width:calc(100% - 28px);
	height:40px;
	margin:12px 14px;
	background-color:rgba(255,255,255,0.16);
	/* background-color: var(--lnb-bg-color);
	border: 1px solid var(--menu-bd-color); */
	z-index:999;
	position:relative;
}
.layout-left .project-dropbox.open {
	background-color:rgba(255,255,255,1);
	border:none;
}
.layout-left .project-dropbox button {
	width:100%;
	height:40px;
	font-size:15px;
	color:#fff;
	font-weight:600;
	letter-spacing:-0.05rem;
	background:none;
	border:0 none;
	padding:11px 15px;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	text-align:left;
}

.layout-left .project-dropbox.open button {
	color:var(--lnb-bg-color);
}
.project-dropbox button .icon {
	position:absolute;
	font-size:15px;
	top:12px;
	right:15px;
	color:#fff;
}
.project-lists {
	width:100%;
	background-color:#fff;
	overflow-y: auto;
	overscroll-behavior-y: contain;
}
.project-lists li  {
	list-style:none;
}
.project-lists li a {
	display:block;
	width:100%;
	height:40px;
	border-top:1px solid #dedede;
	text-decoration:none;
	padding:11px 15px;
	color:var(--lnb-bg-color);
	font-size:15px;
	letter-spacing:-0.05rem;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

.layout-left .project-dropbox > .project-lists {
	display:none;
}
.layout-left .project-dropbox.open > .project-lists {
	display:block;
}

.project-lists::-webkit-scrollbar {
    width: 8px;
}
.project-lists::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.16);    
    border-radius: 10px;
}
.project-lists::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.07);    
    border-radius: 10px;
}

/* lamp7 custom end */


/* folding.css */
.layout-left .folding-account > ul {
	display:none;
}
.layout-left .folding-account:hover {
	background-color:var(--sub-bg-color);
}
.layout-left .folding-account:hover > ul {
	display:block;
	position:absolute;
	top:60px;
	left:var(--fold-width);
	min-width:220px;
	background-color:var(--sub-bg-color);
	padding:8px 0;
	font-size: 16px;
}
.layout-left .folding-account:hover > ul > li {
	list-style: none;
}
.layout-left .folding-account:hover > ul > li > a {
	display: flex;
  	height: 100%;
  	width: 100%;
  	align-items: center;
	text-decoration: none;
	color: var(--lnb-ft-color);
	padding:8px 10px;
}

.layout-left .nav-links li .folding-over, .layout-left .nav-links li .folding-over, .layout-left .nav-links li:hover .folding-over {
	display:none;
}
.layout-left .nav-links li:hover {
	background-color:var(--sub-bg-color);
}
.layout-left.fold .nav-links li:hover .folding-over {
	display:block;
	position:absolute;
	width:180px;
	min-height:47px;
	background-color:var(--sub-bg-color);
	z-index:999;
	padding-top:4px;
}
.layout-left.fold .nav-links li .folding-over .title {
  	display: block;
	padding-left:8px;
}
.layout-left.fold .nav-links li.menu-sub .folding-over a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
/*2depth*/
.layout-left.fold .nav-links li .folding-over ul.sub-2depth {
	display:none;
	border-top:0 none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth {
	padding:0 0 12px 0;
}
.layout-left.fold .nav-links li > .folding-over ul.sub-2depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:5px 30px 5px 22px;
	color: #fff;
	background:none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li {
	border-bottom:0 none;
	font-size:14px;
} 

.layout-left.fold .nav-links li .folding-over ul.sub-2depth li a:hover {
	background:var(--menu-ov-color);
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 6px 50%/13px 13px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li.menu-sub a:hover {
	background:var(--menu-ov-color) url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*3depth*/
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li {
	font-size:13px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:5px 30px 5px 36px;
	color: #fff;
	background:none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li a:hover {
	background:var(--menu-ov-color);
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 21px 50%/13px 13px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}

/*4depth*/
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li {
	font-size:12px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 50px;
	color: #fff;
	background:none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a:hover {
	background:var(--menu-ov-color);
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 35px 50%/13px 13px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}

/*5depth*/
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li {
	font-size:12px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 60px;
	color: #fff;
	background:none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a:hover {
	background:var(--menu-ov-color);
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 45px 50%/13px 13px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a {
	background:url("../../img/ico_spread.png") no-repeat 92% 50%;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold.png") no-repeat 92% 50%;
}
/*6depth*/
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li {
	font-size:12px;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a {
	display:block;
  	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:4px 30px 4px 70px;
	color: #fff;
	background:none;
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a:hover {
	background:var(--menu-ov-color);
}
.layout-left.fold .nav-links li .folding-over ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current.svg") no-repeat 45px 50%/13px 13px;
}

/*hover시 위치*/
.layout-left.fold .nav-links li > .folding-over {
	left:var(--fold-width);
}
.layout-left.fold .nav-links li:nth-of-type(1) > .folding-over {
	top:166px;
}
.layout-left.fold .nav-links li:nth-of-type(2) > .folding-over {
	top:214px;
}
.layout-left.fold .nav-links li:nth-of-type(3) > .folding-over {
	top:262px;
}
.layout-left.fold .nav-links li:nth-of-type(4) > .folding-over {
	top:309px;
}
.layout-left.fold .nav-links li:nth-of-type(5) > .folding-over {
	top:357px;
}
.layout-left.fold .nav-links li:nth-of-type(6) > .folding-over {
	top:404px;
}
.layout-left.fold .nav-links li:nth-of-type(7) > .folding-over {
	top:452px;
}
.layout-left.fold .nav-links li:nth-of-type(8) > .folding-over {
	top:500px;
	/*bottom:500px;*/
}


/*top+left+contents, all hover시 위치*/
.top-left .layout-left.fold .nav-links li:nth-of-type(1) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(1) > .folding-over {
	top:106px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(2) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(2) > .folding-over {
	top:154px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(3) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(3) > .folding-over {
	top:202px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(4) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(4) > .folding-over {
	top:249px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(5) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(5) > .folding-over {
	top:297px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(6) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(6) > .folding-over {
	top:344px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(7) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(7) > .folding-over {
	top:392px;
	left:50px;
}
.top-left .layout-left.fold .nav-links li:nth-of-type(8) > .folding-over, .all .layout-left.fold .nav-links li:nth-of-type(8) > .folding-over {
	top:440px;
	left:50px;
}

/* top 메뉴 */
.layout-header .menu-container {
	width: calc(100vw - 300px);
}
.layout-header {
	background:var(--lnb-bg-color);
}
.layout-header .gnb.nav-links {
	display:flex;
	justify-content:center;
	min-width:400px;
	margin:0 auto;
	border-top:0 none;
	height: 100%;
}
.layout-header .gnb.nav-links li {
	display:flex;
	border-bottom:0 none;
	list-style:none;
	margin-right:26px;
	position:relative;
	/* flex: 1; */
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width:0;
}
.layout-header .gnb.nav-links li:last-child {
	margin-right:0;
}
.layout-header .gnb.nav-links li a {
	display:inline-flex;
	color:var(--lnb-ft-color);
	text-decoration:none;
	max-width:175px;
	text-align:center;
	padding:10px 0 8px 0;
}
.layout-header .gnb.nav-links li a:hover {
	color:var(--lnb-ft-color);
}
.layout-header .gnb.nav-links li a .icon {
	min-width: 35px;
	min-height:22px;
	text-align: center;
	font-size:18px;
	color:var(--lnb-ft-color);
	line-height:1;
	vertical-align: middle;
	margin-right: 3px;
}
.layout-header .gnb.nav-links li a .title {
    font-size: 15px;
    width: 100%;
    height: 18px;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    line-height: 1;
}
.layout-header .gnb.nav-links li > ul {
	display:none;
}
.layout-header .gnb.nav-links > li.menu-sub:hover > ul {
	display:block;
	position:absolute;
	min-width:176px;
	top:88%;
	left:0;
	z-index:99;
	background-color:#f1f1f1;
	border-radius:5px;
	padding:12px 0;
	box-shadow:-1px 2px 4px rgba(0,0,0,0.2);
}
.layout-header .gnb.nav-links > li.menu-sub:hover > ul:after {
	border-top: 6px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #f1f1f1;
    content: "";
    position: absolute;
    top: -12px;
    left: 25px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li {
    display: block;
    margin: 0;
}
.layout-header .gnb.nav-links li ul.sub-2depth li a {
	display:block;
	color:var(--gnb-ft-color);
	font-size:13px;
	padding:5px 25px 5px 15px;
	text-align:left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

}
.layout-header .gnb.nav-links li ul.sub-2depth li a:hover {
	background-color:var(--menu-ov-color);
}
.layout-header .gnb.nav-links li ul.sub-2depth li a.on {
	background:var(--menu-ov-color) url("../../img/icon-current-b.svg") no-repeat 11px 50%/13px 13px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li.menu-sub a {
	background:url("../../img/ico_spread_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li{
	display:block;
	margin:0;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a {
	display:block;
	color:var(--gnb-ft-color);
	font-size:13px;
	padding:5px 25px 5px 25px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a:hover {
	background-color:var(--menu-ov-color);
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current-b.svg) no-repeat 22px 50%/13px 13px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a {
	background:url("../../img/ico_spread_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li {
	display:block;
	margin:0;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a {
	display:block;
	color:var(--gnb-ft-color);
	font-size:13px;
	padding:5px 25px 5px 35px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a:hover {
	background-color:var(--menu-ov-color);
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current-b.svg) no-repeat 34px 50%/13px 13px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a {
	background:url("../../img/ico_spread_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold_b.png") no-repeat 92% 50%;
}

.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li {
	display:block;
	margin:0;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a {
	display:block;
	color:var(--gnb-ft-color);
	font-size:13px;
	padding:5px 25px 5px 45px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li a:hover {
	background-color:var(--menu-ov-color);
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth ul.sub-5depth li li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current-b.svg) no-repeat 34px 50%/13px 13px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a {
	background:url("../../img/ico_spread_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold_b.png") no-repeat 92% 50%;
}

.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li {
	display:block;
	margin:0;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a {
	display:block;
	color:var(--gnb-ft-color);
	font-size:13px;
	padding:5px 25px 5px 55px;
	text-align:left;
	background:none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a:hover {
	background-color:var(--menu-ov-color);
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a.on {
	background:var(--menu-ov-color) url(../../img/icon-current-b.svg) no-repeat 34px 50%/13px 13px;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li.menu-sub a {
	background:url("../../img/ico_spread_b.png") no-repeat 92% 50%;
}
.layout-header .gnb.nav-links li ul.sub-2depth li ul.sub-3depth li ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li.menu-sub a.sub-active {
	background:url("../../img/ico_fold_b.png") no-repeat 92% 50%;
}


.layout-header .gnb.nav-links li ul.sub-2depth a .icon {
	font-size: 18px;
	color: var(--gnb-ft-color);
}
.layout-header .nav-links li ul.sub-2depth ul.sub-3depth a .icon {
	font-size: 17px;
	color: var(--gnb-ft-color);
}
.layout-header .nav-links li ul.sub-2depth ul.sub-3depth ul.sub-4depth li a .icon {
	font-size: 16px;
	color: var(--gnb-ft-color);
}
.layout-header .nav-links li ul.sub-2depth ul.sub-3depth ul.sub-4depth li ul.sub-5depth li a .icon,
.layout-header .nav-links li ul.sub-2depth ul.sub-3depth ul.sub-4depth li ul.sub-5depth li ul.sub-6depth li a .icon {
	font-size: 15px;
	color: var(--gnb-ft-color);
}


.layout-header #userInfoWrap {
	box-shadow: -1px 2px 4px rgba(0,0,0,0.2);
}
.layout-header #userInfoWrap:after {
	border-top: 6px solid transparent;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #fff;
	content: "";
	position: absolute;
	top: -12px;
	right:12px;
}