/*================================================================================
	Item Name: Cupcake
	Description: User-Friendly Admin Template
	Author: Egemen Kapusuz
	Author URL: http://www.themeforest.net/user/egemem
	License: http://www.gnu.org/licenses/gpl-3.0.html
================================================================================*/

/* ================= Body Styles ================= */
body {
	background: #eff1f3;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #444;
}

a {
	color: #7d7d7d;
}

a:hover {
	color: #333;
}

/* ================= General ================= */
.wrapper {
	width: 100%;
	min-width: 1280px;
	margin: 0px auto;
}

#main {
	/* padding-bottom: 20px; */
	background: #fff /* url(/images/withsystem/main-bg.png) repeat-y */;
	border-bottom: 1px solid #ddd;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	/* box-shadow: 0px 1px 0px #DFDFDF; */
}

#sidebar {
	width: 350px;
	float: left;
	padding-left: 1px;
	padding-right: 1px;
	background: #dfe6ec;
	overflow: hidden;
}

#page {
	width: calc(100% - 350px);
	float: right;
	position: relative;
}

.center980 {
	margin: 0px auto;
	width: 980px;
}

.content {
	padding:20px;
	line-height: 17px;
}

/* ================= Header ================= */
#header {
	height: 70px;
	background:#4c5a61;
	display: flex;
	justify-content: space-between;
}

#header .h_r {
	width: calc(100% - 200px);
	display: flex;
	justify-content: space-between;
}

#header .h_r .h_r_flex {
	display: flex;
	justify-content: flex-end;
	margin-left: auto;
}

#header h1 {
	background:#4c5a61;
	width: 330px;
	text-align: center;
	align-items: center;
	padding-left: 23px;
	display: flex;
}

#header h1 img {
	margin-left:-5px;
}

#header h1 img:hover {
	opacity: 0.8;
}

#notifications {
	width: 492px;
	float: left;
	padding-left: 16px;
	padding-top: 18px;
}

#quickmenu {
	float: left;
	text-align: right;
	padding: 16px 0 0 310px;
	display: flex;
	flex-direction: row-reverse;
	max-width: 570px;
	margin-right: 6px;
}

#quickmenu01 {
	width: 380px;
}

#quickmenu a:not(.qbutton01) {
	display: block;
	width: 50px;
	height: 40px;
	box-sizing: border-box;
	float: right;
	text-align: center;
	position: relative;
	padding-top: 5px;
	background:#58646b;
	border: solid 1px #4e585f;
	transition: 0.2s;
}

#quickmenu a:not(.qbutton01) {
	margin-left: -1px;
}

#quickmenu a:not(.qbutton01):hover {
	background: linear-gradient(#5d686f, #4b555b);
}

#quickmenu a:not(.qbutton01):first-of-type {
	border-radius: 0 4px 4px 0;
}

#quickmenu a:not(.qbutton01):last-of-type {
	border-radius: 4px 0 0 4px;
}

.qbutton01 {
	display: block;
	width: 50px;
	height: 40px;
	float: right;
	text-align: center;
	position: relative;
}

.qballon {
	background: url(/images/withsystem/qballon.png) no-repeat;
	width: 19px;
	height: 21px;
	display: block;
	text-align: center;
	color: #FDEDEC;
	font-size: 10px;
	position: absolute;
	top: -12px;
	padding-top: 4px;
	right: 2px;
}

/*�߰�_start2 2013.03.28*/
.qballon_project {
	background: url(/images/withsystem/qballon03.png) no-repeat;
	background-size: contain;
	width: 22px;
	height: 22px;
	display: block;
	text-align: center;
	color: #fff;
	font-weight: 500;
	font-size: 12px;
	position: absolute;
	z-index: 100;
	margin: -40px 0 0 85px;
	padding-top: 3px;
}

.qbutton-left01 {
	display: block;
	width: 109px;
	height: 30px;
	float: left;
	background: url(/images/withsystem/qbutton01.png) no-repeat 0px 0px;
	text-align: center;
	position: relative;
	padding-top: 10px;
}

.qbutton-left01:hover {
	background: url(/images/withsystem/qbutton01.png) no-repeat 0px -40px;
}

.qbutton-normal01 {
	display: block;
	width: 81px;
	height: 30px;
	float: left;
	background: url(/images/withsystem/qbutton01.png) no-repeat -109px 0px;
	text-align: center;
	position: relative;
	padding-top: 10px;
}

.qbutton-normal01:hover {
	background: url(/images/withsystem/qbutton01.png) no-repeat -109px -40px;
}

.qbutton-right01 {
	display: block;
	width: 90px;
	height: 30px;
	float: left;
	background: url(/images/withsystem/qbutton01.png) no-repeat -190px 0px;
	text-align: center;
	position: relative;
	padding-top: 10px;
}

.qbutton-right01:hover {
	background: url(/images/withsystem/qbutton01.png) no-repeat -190px -40px;
}

.qbutton-right02 {
	display: block;
	width: 100px;
	height: 30px;
	float: left;
	background: url(/images/withsystem/qbutton01.png) no-repeat -280px 0px;
	text-align: center;
	position: relative;
	padding-top: 10px;
}

.qbutton-right02:hover {
	background: url(/images/withsystem/qbutton01.png) no-repeat -280px -40px;
}

/* ================= Profilebox ================= */
#profilebox {
	height: 51px;
	float: right;
	margin: 10px 14px 0 0;
	position: relative;
	display: inline-block;
    min-width: 110px;
    width: auto;
    vertical-align: middle;
}

#profilebox .display {
	display: block;
	padding: 5px 6px;
	font-size: 14px;
	color: #D2E6E9;
	line-height: 15px;
	white-space: nowrap;
}

#profilebox .display:hover {
	text-decoration: none;
}

#profilebox .display img {
	border: 1px solid #333;
	float: left;
	margin-right: 7px;
}

#profilebox .display b {
	font-size: 14px;
	padding: 5px 0 3px 0;
	display: block;
	color: #fff;
}

#profilebox .display span {
	color: #9ba8b1;
	background: url(/images/withsystem/arrow-down.png) no-repeat right;
	padding-right: 11px;
}

#profilebox .display:hover, #profilebox:hover {
	/* 	background:url(/images/withsystem/profileboxbg-hover.png) no-repeat;}
	background: url(/images/withsystem/profileboxbg.png) no-repeat; */
}

#profilebox:hover .profilemenu, .profilemenu:hover {
	display: block;
}

.profilemenu {
	display: none;
	background: #535d64;
	border: 1px solid #445056;
	border-top: none;
	padding-top: 3px;
	margin-top: 2px;
	position: relative;
	z-index: 1000;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

.profilemenu a {
	display: block;
	font-size: 11px;
	color: #D2E6E9;
	padding: 10px 7px;
}

.profilemenu a:hover {
	text-decoration: none;
	font-size: 11px;
	color: #fff;
	background: #364047;
}

/* ================= Searchbox ================= */
#searchbox {
	display: block;
	background: url(/images/withsystem/searchbox-bg.png) repeat-x bottom;
	overflow: hidden;
}

#searchbox .in {
	padding: 5px 9px;
}

#searchbox .input {
	background-color: #fff;
	background-image: url(/images/withsystem/icon-search.svg);
	background-size: 11px 11px;
	background-repeat: no-repeat;
	background-position: 10px center;
	border: 1px solid #D2D4D4;
	width: 100%;
	font-size: 14px;
	color: #999;
	padding: 9px 0 10px 30px;
	box-sizing: border-box;
	border-radius: 4px;
	border-top-color: #A5A6A6;
	box-shadow: inset 0 1px 2px 0 rgba(153, 190, 191, 0.5);
	margin-bottom: 5px;
}

select.search {
	width: calc(100% - 20px);
	margin: 0 10px;
	background: #fff;
	border: 1px solid #D2D4D4;
	border-top: 1px solid #A5A6A6;
	border-radius: 2px;
	color: #333;
	font-size: 14px;
	padding: 4px 4px;
	box-sizing: border-box;
}

div.search_dd {
	width: calc(100% - 20px);
	margin: 5px 0 0 10px;
	border: 3px solid #6c8ea9;
	background: #fff;
	overflow: hidden;
	box-sizing: border-box;
}

div.search_dd .s_left {
	float: left
}

div.search_dd .s_left input {
	width: 150px;
	border: none;
}

div.search_dd .s_right {
	padding: 4px 4px 0 0;
	float: right
}

/* ================= Sidemenu ================= */
#sidemenu {
	padding: 10px 0;
}

#sidemenu ul.sm01 {
	font-size: 12px;
	line-height: 14px;
}

#sidemenu ul.sm02 {
	margin: 10px 0 0 0;
	font-size: 12px;
	line-height: 14px;
}


#sidemenu li {
	position: relative;
}

#sidemenu ul.sm01 a {
	display: block;
	color: #596677;
	padding: 7px 26px 7px 10px;
}

#sidemenu ul.sm02 a {
	display: block;
	color: #596677;
	padding: 12px 26px 12px 10px;
	border-top: 1px solid #c9d2d8;
	border-bottom: 1px solid #c9d2d8;
}

#sidemenu ul.sm03 a {
	display: block;
	color: #596677;
	font-size: 15px;
	padding: 9px 15px;
	border: none;
}

#sidemenu a img {
	margin-bottom: -4px;
	margin-right: 6px;
}

#sidemenu ul.sm03 a img {
	margin: 0 2px 0 0;
	vertical-align: top;
}

#sidemenu ul.sm03 a img.btn_fav_on, #sidemenu ul.sm03 a img.btn_fav_off{
    width: 15px;
    margin-right: 5px;
}
#sidemenu ul.sm03 a img.basics-icon{
	margin: 4px 4px 0 0;
}
#sidemenu ul.sm01 a:hover {
	padding: 6px 26px 6px 10px;
	text-decoration: none;
	background: #fff;
	color: #3F4C59;
	border-top: 1px solid #c9d2d8;
	border-bottom: 1px solid #c9d2d8;
}

#sidemenu ul.sm02 a:hover {
	/* padding: 12px 26px 12px 15px; */
	text-decoration: none;
	background: #fff;
	color: #3F4C59;
	border-top: 1px solid #c9d2d8;
	border-bottom: 1px solid #c9d2d8;
}

#sidemenu ul.sm03 a:hover {
	/* padding: 6px 26px 6px 15px; */
	text-decoration: none;
	background: #fff;
	color: #3F4C59;
	border: none
}

#sidemenu .ballon {
	background: #abc0d1;
	margin-left: 6px;
	border-radius: 19px;
	font-size: 10px;
	font-weight: bold;
	line-height: normal;
	color: #fff;
	position: absolute;
	border: 1px solid #97afc3;
	box-shadow: 0px 1px 0px #fff;
	right: 12px;
	top: 7px;
	padding: 1px 5px;
}

#sidemenu li a:hover .ballon {
	background: #b9d1e5;
	color: #fff;
	border: 1px solid #a8c0d4;
}

#sidemenu .ballon01 {
	background: #abc0d1;
	margin-left: 6px;
	border-radius: 19px;
	font-size: 10px;
	font-weight: bold;
	line-height: normal;
	color: #fff;
	position: absolute;
	border: 1px solid #97afc3;
	box-shadow: 0px 1px 0px #fff;
	right: 12px;
	top: 12px;
	padding: 1px 5px;
}

#sidemenu li a:hover .ballon01 {
	background: #b9d1e5;
	color: #fff;
	border: 1px solid #a8c0d4;
}

#sidemenu .active a {
	background: #fff;
	zoom: 1;
	border-top: 1px solid #DFDFDF;
	margin-right: -1px;
	position: relative;
	border-bottom: 1px solid #DFDFDF;
	color: #468E90;
}

#sidemenu .active a .ballon {
	top: 10px;
	right: 10px;
}

/* Submenu */
.submenu {
	padding: 0px;
	border-bottom: 1px solid #D6D6D6;
	padding: 5px 0 0 0;
	display: none;
	background: #eff3f6;
	margin: 0 1px 0 0;
}
#sidemenu .submenu a {
	padding: 3px 12px 3px 40px;
	font-size: 11px;
	font-family: dotum, gulim
}
#sidemenu .submenu img {
	margin-right: 8px;
}
#sidemenu .submenu .ballon {
	top: 7px;
}

#sidemenu #projectListSpace ul li:last-child{
	border-bottom: 1px solid #c9d2d8;
}

.submenu .action {
	position: relative;
}

.subtitle .action .arrow {
	position: absolute;
	right: 38px;
	top: 18px;
}

.qballon_new {
	width: 19px;
	height: 21px;
	display: block;
	text-align: center;
	color: #FDEDEC;
	font-size: 10px;
	position: absolute;
	top: 4px;
	padding: 2px 0 0 0;
	right: 12px;
}

.qballon_new img {
	margin: -2px 0 0 0
}

/* ================= Stats ================= */
#stats {
	display: none;
	height: 65px;
	padding-left: 20px;
	background: #FFFADF url(/images/withsystem/stats-bg.png) repeat-x bottom;
}

#stats .column {
	width: 150px;
	text-align: center;
	float: left;
	color: #9B936A;
	font-size: 11px;
	margin-top: 9px;
	padding: 2px 0px;
	border-right: 1px solid #F0E5BC;
}

#stats .column b {
	font-size: 22px;
	display: block;
	color: #474643;
	letter-spacing: -0.1px;
	padding-bottom: 5px;
}

#stats .last {
	border-right: none;
}

#stats .column .up {
	color: #488D46;
}

#stats .column .down {
	color: #D73535;
}

#stats .close {
	background: url(/images/withsystem/icons/mini/close-stats.png) no-repeat
		center;
	width: 35px;
	height: 35px;
	display: block;
	text-indent: -9999px;
	position: absolute;
	right: 0px;
	top: 0px;
}

#stats .close:hover {
	background: url(/images/withsystem/icons/mini/close-stats-hover.png)
		no-repeat center;
}

#stats .arrow {
	position: absolute;
	right: 186px;
	top: -9px;
}

/* ================= Page Title ================= */
.page-title {
	background: url(/images/withsystem/page-title-minidot.png) repeat-x
		bottom;
	border-bottom: 1px solid #D1D3D3;
	height: 63px;
}

.page-title .in {
	padding: 0px 24px;
}

.page-title .titlebar {
	color: #aaa;
	font-size: 11px;
	width: 480px;
	float: left;
	padding-top: 14px;
}

.page-title .titlebar h2 {
	color: #364656;
	font-size: 16px;
	height: 24px;
}

.page-title .shortcuts-icons {
	width: 250px;
	float: right;
	padding-top: 19px;
}

/* ================= Shortcut ================= */
.shortcut {
	background: url(/images/withsystem/shortcut-normal.png) no-repeat top
		left;
	width: 25px;
	display: block;
	height: 26px;
	float: left;
	margin-left: 5px;
}

.shortcut:hover {
	background: url(/images/withsystem/shortcut-hover.png) no-repeat top
		left;
}

.shortcuts-icons a {
	float: right;
}

/* ================= Simple Tip ================= */
.simple-tips {
	background: #FFFFCA url(/images/withsystem/simple-tips-bg.png) repeat-x
		top;
	border: 1px solid #E0DBC2;
	border-radius: 3px;
	padding: 12px 17px;
	color: #A79955;
	font-size: 11px;
	line-height: 20px;
	margin: 0 0 20px 0;
	position: relative;
	box-shadow: 0px 1px 1px #F0F0F0;
}

.simple-tips h2 {
	display: block;
	color: #6D612E;
	font-size: 12px;
}

.simple-tips .close {
	background: url(/images/withsystem/icons/mini/close-stats.png) no-repeat
		center;
	width: 35px;
	height: 35px;
	display: block;
	text-indent: -9999px;
	position: absolute;
	right: 0px;
	top: 0px;
}

/* ================= Dashbutton ================= */
.dashbutton-div {
	padding: 12px 0px;
}

.dashbutton {
	display: block;
	text-align: center;
	width: 147px;
	float: left;
	margin-left: -1px;
	margin-bottom: -1px;
	border-radius: 1px;
	height: 99px;
	font-size: 11px;
	color: #ABABAB;
	padding-top: 26px;
	border: 1px solid #E4E4E4;
	overflow: hidden;
	background: url(/images/withsystem/dashbutton-normal.png) repeat-x
		bottom;
}

.dashbutton img {
	margin-bottom: 19px;
}

.dashbutton b {
	color: #666;
	display: block;
	font-size: 12px;
}

.dashbutton:hover {
	background: url(/images/withsystem/dashbutton-hover.png) repeat-x bottom;
	color: #999;
	border: 1px solid #D6D6D6;
	position: relative;
}

.dashbutton:hover b {
	color: #333;
}

.dashbutton:active {
	background: url(/images/withsystem/dashbutton-active.png) repeat-x top;
}

/* ================= Simple Box ================= */
.simplebox {margin: 0 auto;}

.simplebox .titleh {
	border-top: 1px solid #e4e4e4;
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x
		bottom;
	height: 40px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
}

.simplebox .padding-in {
	padding: 10px;
	line-height: 18px;
}

.simplebox .titleh h3 {
	font-size: 15px;
	color: #333;
	padding: 13px 0 0 15px;
}

.titleh_gray {
	background:#95a0a6;
	height: 40px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
	z-index: revert !important;
}

.titleh_gray h3 {
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	padding: 12px 0 0 15px;
}
.project_s_tab {
	width: 100%;
	border-left: 1px solid #dadada;
	border-bottom: 1px solid #aaa;
}

.project_s_tab td {
	padding: 8px 0 8px 0;
	text-align: center;
	cursor: pointer;
	border-top: 1px solid #dadada;
	border-right: 1px solid #dadada;
}

.project_s_tab td a {
	color: #999
}

.project_s_tab td a:hover {
	color: #333;
}

.project_s_tab td.on {
	background: #eee;
	font-weight: bold;
	border-top: 1px solid #ccc;
}

ul.project_s_tab_menu {
	width: 100%;
	background: #f9f9f9;
	overflow: hidden;
	border-bottom: 1px solid #eaeaea
}

ul.project_s_tab_menu li {
	float: left;
	font-size: 11px;
	padding: 10px 20px 10px 20px;
	background: url(/images/withsystem/project_s_tab_menu_line.gif)
		no-repeat 100% 50%;
}

ul.project_s_tab_menu li a {
	color: #aaa;
}

ul.project_s_tab_menu li a:hover {
	color: #666;
}

ul.project_s_tab_menu li.on {
	
}

ul.project_s_tab_menu li.on a {
	color: #666;
}

ul.stats_total_tab {
	width: 880px;
	overflow: hidden;
	margin: 25px 0 0 0;
}

ul.stats_total_tab li {
	border-top: 1px solid #dadada;
	border-left: 1px solid #dadada;
	border-right: 1px solid #dadada;
	text-align: center;
	cursor: pointer;
	float: left;
	width: 150px;
	padding: 11px 0 11px 0;
	background: #f5f5f5;
	letter-spacing: -0.5pt
}

ul.stats_total_tab li a {
	color: #999
}

ul.stats_total_tab li a:hover {
	color: #333;
}

ul.stats_total_tab li.on {
	font-weight: bold;
	background: #525d63;
	background: -webkit-gradient(linear, left top, left bottom, from(#77848c),
		to(#525d63));
	background: -moz-linear-gradient(top, #77848c, #525d63);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#77848c',
		endColorstr='#525d63');
	border-top: 1px solid #525d63;
	border-left: 1px solid #525d63;
	border-right: 1px solid #525d63;
}

ul.stats_total_tab li.on a {
	color: #fff
}

ul.stats_total_tab02 {
	width: 878px;
	overflow: hidden;
	border-left: 1px solid #dadada;
	background: #f8f8f8;
	border-right: 1px solid #dadada;
}

ul.stats_total_tab02 li {
	border-right: 1px solid #dadada;
	text-align: center;
	cursor: pointer;
	float: left;
	width: 130px;
	padding: 11px 0 11px 0;
	letter-spacing: -0.5pt
}

ul.stats_total_tab02 li a {
	color: #999
}

ul.stats_total_tab02 li a:hover {
	color: #777;
}

ul.stats_total_tab02 li.on {
	background: #eee;
	font-weight: bold;
}

ul.stats_total_tab02 li.on a {
	color: #777;
}

.graph_img_chart {
	width: 878px;
	overflow: hidden;
	border: 1px solid #ddd;
}

.graph_img_chart .img {
	float: left;
	padding: 10px;
}

.graph_img_chart .graph_chart {
	float: left;
	overflow-y: scroll;
}

.graph_img_chart .graph_chart table {
	width: 340px;
}

.graph_img_chart .graph_chart table th {
	background: #eee;
	font-size: 12px;
	color: #444;
	font-weight: bold;
	padding: 7px 0 7px 0;
	border-left: 1px solid #ddd;
}

.graph_img_chart .graph_chart table td {
	font-size: 12px;
	color: #777;
	border-left: 1px solid #e5e5e5;
	border-bottom: 1px solid #eee;
	text-align: center;
	padding: 7px 0 7px 0;
}

.graph_img_chart .graph_chart table td span {
	font-weight: bold;
}

.pop_project .titleh {
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #d0d0d0;
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x
		bottom;
	height: 40px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
}

.pop_project .titleh h3 {
	font-size: 12px;
	color: #333;
	padding: 13px 0 0 15px;
}

.pop_project .shortcuts-icons {
	position: absolute;
	display: block;
	text-align: right;
	right: 10px;
	top: 8px;
}

.pop_project .shortcuts-icons a {
	opacity: 0.8;
}

.simplebox .shortcuts-icons {
	position: absolute;
	display: block;
	text-align: right;
	right: 10px;
	top: 6px;
	border-radius:2px;
	overflow:hidden;
	z-index:0 !important;
	/*background: #fff;
    border: 1px solid #D2D4D4;*/
}
.simplebox .shortcuts-icons select{
	padding: 4px 6px;
	border: none;
}
.simplebox .shortcuts-icons a {
	opacity: 0.8;
}
.simplebox .shortcuts-icons a img{
	transition:0.2s;
}
.simplebox .shortcuts-icons a img.on{
	transform:rotate(180deg)
}
.simplebox .body {
	border: 1px solid #E4E4E4;
	color: #666;
	background: #fff url(/images/withsystem/simplebox-dot.png) repeat-x top;
}

.simplebox .button-box {
	text-align: center;
	/* border-top: 1px solid #E4E4E4; */
	background: #FDFDFD;
	/*padding: 15px 0;*/
	padding: 12px 0 0;
}
.simplebox .button-box .st-button{
	font-size: 15px;
}
.simplebox .button-box input{
	margin-left: -4px;	
}
.simplebox .button-box input:first-child{
	margin-left: 0;
}
.simplebox .button-box input:last-child{
	margin-right: 0;
}

/* ================= Simple Title ================= */
.simpletitle {
	font-size: 14px;
	color: #444;
	padding: 15px 10px;
	border-bottom: 1px solid #e6e6e6;
	position: relative;
}

.simpletitle .shortcuts-icons {
	position: absolute;
	z-index:0 !important;
	display: block;
	text-align: right;
	right: 10px;
	top: 10px;
}

p.simple_text {
	background: #f5f5f5;
	padding: 15px 15px 10px 15px;
	font: normal 12px/14px dotum, gulim, Arial;
	color: #555;
	border-bottom: 1px solid #ebebeb;
}

/* ================= Gallery ================= */
.get-photo {
	margin: 16px 10px 0 0;
	float: left;
	width: 175px;
	font-size: 11px;
	font-weight: bold;
	color: #999;
	position: relative;
	height: 140px;
}

.get-photo img {
	border-radius: 1px;
}

.get-photo:hover .buttons {
	display: block;
}

.get-photo:hover p {
	color: #333;
}

.get-photo p {
	padding-top: 10px;
}

.get-photo .buttons {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	padding: 5px 4px;
}

.mini-delete {
	display: block;
	width: 19px;
	height: 19px;
	text-indent: -9999px;
	float: right;
	margin-left: 3px;
	background: url(/images/withsystem/icons/mini/gallery-icon.png)
		no-repeat 0px 0px;
}

.mini-delete:hover {
	background: url(/images/withsystem/icons/mini/gallery-icon.png)
		no-repeat 0px -40px;
}

.mini-edit {
	display: block;
	width: 19px;
	height: 19px;
	text-indent: -9999px;
	float: right;
	margin-left: 3px;
	background: url(/images/withsystem/icons/mini/gallery-icon.png)
		no-repeat 0px -20px;
}

.mini-edit:hover {
	background: url(/images/withsystem/icons/mini/gallery-icon.png)
		no-repeat 0px -60px;
}

/* ================= Error Pages ================= */
.error-page {
	text-align: center;
	margin: 10px 0;
}

.error-page h2 {
	font-size: 21px;
	line-height: 28px;
	padding: 14px 0px;
}

.error-page .red {
	color: #E76463;
}

.error-page .blue {
	color: #76A6D3;
}

.error-page .green {
	color: #99C584;
}

.error-page p {
	font-size: 12px;
	color: #858585;
	line-height: 22px;
	padding: 24px 0px;
	border-top: 1px solid #EDEDED;
	border-bottom: 1px solid #EDEDED;
}

.error-page .button {
	font-size: 14px;
	color: #808080;
	font-weight: bold;
	padding: 8px 14px;
	border-radius: 3px;
	border: 1px solid #C5C5C5;
	border-bottom: 1px solid #9D9D9D;
	background: #fff url(/images/withsystem/error-page-buttonbg.png)
		repeat-x bottom;
}

.error-page .button:hover {
	color: #333;
	box-shadow: 0px 0px 1px #c6c6c6;
	border: 1px solid #BCBCBC;
	border-bottom: 1px solid #999;
}

/* ================= Form Elements ================= */
input, select, textarea {
	background: #fff;
	border: 1px solid #cdcdcd;
	border-radius: 2px;
	color: #333;
	padding: 6px 6px;
}

.st-form-line {
	display: block;
	border-bottom: 1px solid #E5E5E5;
	padding: 8px 15px;
	color: #858585;
	vertical-align: middle;
}

.st-form-line02 {
	display: block;
	border-bottom: 1px solid #E5E5E5;
	padding: 10px 20px;
	color: #858585;
}

.st-form-line01 {
	display: block;
	border-bottom: 1px solid #E5E5E5;
	padding: 9px 20px 5px 20px;
	color: #858585;
	overflow:hidden;
}

.st-form-line span.blue {
	color: #34b4e1;
	font-size: 11px;
	letter-spacing: -0.03em;
}

.st-form-line03 {
	display: block;
	border: 1px solid #E5E5E5;
	padding: 10px;
	color: #858585;
}

.st-labeltext {
	display: block;
	color: #555;
	float: left;
	width: 106px;
	line-height: 20px;
	font-size: 15px;
	font-weight:500;
	padding-top: 7px;
	padding-right: 12px;
}
.st-form-line.flex-r{
	display: flex;
    align-items: center;
    padding: 12px 15px;
}
.st-form-line.flex-r .st-labeltext{
	padding-top: 0;
}
.st-form-line02.flex-r{
	display: flex;
    align-items: center;
    padding: 14px 20px;
}
.st-form-line02.flex-r .st-labeltext{
	padding-top: 0;
}

.st-forminput {
	/*background: #fff url(/images/withsystem/st-forminput-bg.png) repeat-x top;
	border-top: 1px solid #A5A6A6;*/
	border: 1px solid #D2D4D4;
	border-radius: 2px;
	color: #A5A5A5;
	padding: 6px;
	/*box-sizing: border-box;*/
}

.st-disable {
	background: #fafafa;
}

.st-forminput-active {
	border-radius: 2px;
	color: #666666;
	padding: 6px;
	/*width: 100%;*/
}

.datepicker-input.w100{
	width: 108px;
}
.datepicker-input {
	background: #fff url(/images/withsystem/datepicker-bg.png) repeat-x top right;
	border-radius: 2px;
	color: #666;
	padding: 6px 9px;
	border: 1px solid #cdcdcd;
	/* border-top: 1px solid #A5A6A6; */
	font-size: 15px;
	width: 108px !important;
}

.st-button {
	background: #4a585f;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	border: 1px solid #777;
	/*border-bottom: 1px solid #666;*/
	border-radius: 2px;
	padding: 6px 10px;
	margin-right: 10px;
	cursor: pointer;
	/* text-shadow: 0px -1px #777; */
}

.st-button01 {
	background: #4a585f;
	font-size: 15px;
	font-weight: 500;
	color: #fff;
	border: 1px solid #777;
	/*border-bottom: 1px solid #666;8*/
	border-radius: 2px;
	padding: 6px 10px;
	margin-right: 10px;
	/* text-shadow: 0px -1px #777; */
	vertical-align: middle;
}

.st-button01:hover {
	color: #fff;
	border: 1px solid #333;
	border-bottom: 1px solid #000;
}

.st-button:hover {
	border: 1px solid #333;
	border-bottom: 1px solid #000;
}

.st-button:active {
	box-shadow: inset 0 0 0.5em #333;
}

.st-clear {
	background: #f2f2f2;
	font-size: 15px;
	font-weight: 500;
	color: #444;
	border: 1px solid #C5C5C5;
	/* border-bottom: 1px solid #969696; */
	border-radius: 2px;
	padding: 6px 10px;
	margin-right: 10px;
}

.st-clear:hover {
	border: 1px solid #B1B1B1;
	/* border-bottom: 1px solid #878787; */
}

.st-clear:active {
	box-shadow: inset 0 0 0.5em #ccc;
}

.st-success-input {
	background: #EAF2EC url(/images/withsystem/st-forminput-bg.png) repeat-x
		top;
	border: 1px solid #A9CFB0;
	border-top: 1px solid #85A38B;
	border-radius: 2px;
	color: #55A163;
	font: 12px Arial, Helvetica, sans-serif;
	padding: 8px 6px;
}

.st-form-success {
	color: #437E4C;
	font-size: 12px;
	margin-left: 10px;
}

.st-error-input {
	background: #FBF4F5 url(/images/withsystem/st-forminput-bg.png) repeat-x
		top;
	border: 1px solid #E2B5BE;
	border-top: 1px solid #B28F96;
	border-radius: 2px;
	color: #99626B;
	font: 12px Arial, Helvetica, sans-serif;
	padding: 8px 6px;
}

.st-form-error {
	color: #99616B;
	font-size: 12px;
	margin-left: 10px;
}

/* ================= Chart ================= */
.chart {
	background: #f8f8f8;
	padding-bottom: 14px;
}

/* ================= Tiny Title ================= */
.st-tinytitle {
	padding: 7px 0 13px 0;
	border-bottom: 1px solid #f2f2f2;
	margin-bottom: 20px;
}

.st-tinytitle h3 {
	color: #666;
	padding-bottom: 5px;
	font-size: 14px;
}

.st-tinytitle p {
	color: #999;
	font-size: 11px;
	line-height: 15px;
}

/* ================= Alert Boxes ================= */
.albox {
	font-size: 15px;
	line-height: 1.5;
	/*box-shadow: 0px 1px 0px #F7F7F7;*/
	border-bottom: 1px dashed #e4e4e4;
	position: relative;
	margin: 5px 0px;
	padding: 14px 42px;
	border-radius: 3px;
	zoom: 1;
}

.albox a {
	color: #858585;
}

.albox a:hover {
	color: #34b4e1;
}

.albox .close {
	display: block;
	position: absolute;
	width: 30px;
	height: 30px;
	text-indent: -9999px;
	right: 0;
	top: 0;
	background: url(/images/withsystem/icons/mini/close-opacity-21.png)
		no-repeat center;
}

.albox .close:hover {
	background: url(/images/withsystem/icons/mini/close-opacity-42.png)
		no-repeat center;
}

.albox .icon {
	position: absolute;
	left: 14px;
	top: 14px;
}

.albox01* {
	margin: 0;
	padding: 0;
	vertical-align: top;
}

.albox01 {
	font-size: 12px;
	box-shadow: 0px 1px 0px #F7F7F7;
	position: relative;
	margin: 5px 0px;
	padding: 10px;
	border-radius: 3px;
	zoom: 1;
}

.albox01 .icon {
	position: absolute;
	left: 14px;
	top: 14px;
}

.st-form-line03 {
	display: block;
	border: 1px solid #E5E5E5;
	padding: 10px;
	color: #858585;
}

.warningbox {
	background: #FFF8D8 url(/images/withsystem/icons/error/error.png)
		no-repeat 14px 14px;
	border: 1px solid #F3D97E;
	color: #A68510;
}

.succesbox {
	background: #EBF9E2 url(/images/withsystem/icons/error/accept.png)
		no-repeat 14px 14px;
	border: 1px solid #BEE4A5;
	color: #658C2C;
}

.informationbox {
	background: #E9F3F8 url(/images/withsystem/icons/error/help.png) no-repeat 16px 20px;
	border: 1px solid #BBD7E4;
	color: #3876C6;
}

.errorbox {
	background: #F8E9E9 url(/images/withsystem/icons/error/cross.png)
		no-repeat 16px 20px;
	border: 1px solid #E4BBBC;
	color: #BF2C11;
}

/* ================= Dialog Boxes ================= */
.dialogbox {
	background: #F8F8F8;
	border: 1px solid #DEDEDE;
	color: #666;
}

/* ================= Icon Buttons ================= */
.icon-button {
	border-radius: 4px;
	margin: 2px;
	padding: 8px 10px;
	border: 1px solid #DBDFE0;
	border-bottom: 1px solid #D1D5D6;
	background: #fff url(/images/withsystem/iconbutton-bg.png) repeat-x
		bottom;
}

.icon-button:hover {
	border: 1px solid #BFC7C9;
	border-bottom: 1px solid #AEB5B7;
}

.icon-button img {
	margin-bottom: -5px;
}

.icon-button:active {
	background: #fff url(/images/withsystem/icon-button-bg-active.png)
		repeat-x top;
}

.icon-button span {
	padding-left: 8px;
	color: #999;
}

.icon-button a:hover span {
	color: #888;
}

/* ================= Button Styles ================= */
.button-blue {
	background:var(--darkBlue);
	color: #fff;
	border-radius: 2px;
	padding: 6px 10px;
	margin: 0px 3px;
	font-size: 15px;
	text-wrap: nowrap;
}


.button-blue:hover {
	/*border: 1px solid #67737b;
	 border-bottom: 1px solid #0F3049; */
	background:var(--darkBlueOn);
	font-size: 15px;
	color: #fff;
	/* opacity: 0.95; */
}

.button-blue:active {
	box-shadow: inset 0 0 0.5em #174B73;
}

.button-aqua {
	background: #519EAC url(/images/withsystem/button-aqua.png) repeat-x bottom;
	font-weight: bold; font-size: 14px;
	color: #fff;
	border: 1px solid #27676E;
	border-bottom: 1px solid #173C40;
	border-radius: 2px;
	padding: 7px 10px;
	margin: 0px 3px;
	text-shadow: 0px -1px #27676E;
	text-wrap: nowrap;
}

.button-aqua:hover {
	border: 1px solid #173C40;
	color: #fff;
	border-bottom: 1px solid #173C40;
	opacity: 0.95;
}

.button-aqua:active {
	box-shadow: inset 0 0 0.5em #174B73;
}

.button-green {
	background: #51AC53;
	color: #fff;
	border-radius: 2px;
	padding: 5px 10px;
	margin: 0px 3px;
	line-height: 18px;
	font-size: 14px;
	text-wrap: nowrap;
}

.button-green:hover {
	background:#2c652d ;
	color: #fff;
	font-size: 14px;
}

.button-green:active {
	box-shadow: inset 0 0 0.5em #174017;
}

.button-gray {
	background:#999;
	font-size: 15px;
	color: #fff;
	border-radius: 2px;
	padding: 5px 10px;
	text-wrap: nowrap;
}

.button-gray:hover {
	background:#222;
	color: #fff;
	transition: background .1s;
}

.button-gray:active {
	box-shadow: inset 0 0 0.5em #ccc;
}

.button-red {
	background: #A2665B url(/images/withsystem/button-red.png) repeat-x
		bottom;
	font-weight: bold; font-size: 14px;
	color: #fff;
	border: 1px solid #67352E;
	border-bottom: 1px solid #3C1F1B;
	border-radius: 2px;
	padding: 7px 10px;
	margin: 0px 3px;
	text-shadow: 0px -1px #67352E;
	text-wrap: nowrap;
}

.button-red:hover {
	border: 1px solid #3C1F1B;
	color: #666;
	border-bottom: 1px solid #3C1F1B;
	opacity: 0.95;
}

.button-red:active {
	box-shadow: inset 0 0 0.5em #3C1F1B;
}

.button-blue:hover, .button-aqua:hover, .button-green:hover, .button-red:hover
	{
	color: #fff;
}

.button-orange {
	background: #ff6600;
	color: #fff;
	border-radius: 2px;
	padding: 5px 10px;
	margin: 0px 3px;
	text-wrap: nowrap;
}

.button-orange:hover {
	/* border: 1px solid #df611c; */
	color: #fff;
	opacity: 0.90;
	background:#c94a04;
}

.button-red:active {
	box-shadow: inset 0 0 0.5em #3C1F1B;
}

/* ================= Pagination ================= */
.pagination {
	text-align: center;
	padding: 20px 0px;
}

.pagination li {
	display: inline;
	text-align: center;
	font-size: 12px;
	color: #3E7CAC;
	padding-right: 3px;
	font-weight: bold;
}

.pagination li a {
	color: #666;
	border: 1px solid #D6D6D6;
	border-radius: 3px;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x
		bottom;
	padding: 8px 12px;
	box-shadow: 0px 1px 1px #EDEDED;
}

.pagination li a:hover {
	border: 1px solid #C5C5C5;
	color: #333;
}

.pagination li a:active {
	box-shadow: inset 0 0 0.5em #D6D6D6;
}

/* ================= Page Wrap ================= */
.pagewrap {
	background: url(/images/withsystem/pagewrapbg.png) repeat-x bottom;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-size: 12px;
	color: #859099;
	padding-left: 5px;
	height: 38px;
}

.pagewrap li {
	display: inline;
	background: url(/images/withsystem/page-wrap-libg.png) no-repeat right;
	line-height: 38px;
	padding: 12px 20px 12px 8px;
}

.pagewrap a {
	color: #898989;
}

.pagewrap a:hover {
	color: #333;
}

/* ================= Statistics ================= */
.statistics {
	padding: 0;
}

.statistics li {
	border-bottom: 1px solid #E3EBF3;
	padding: 12px 14px;
	display: block;
	position: relative;
}

.statistics li p {
	display: block;
	position: absolute;
	text-align: right;
	right: 14px;
	top: 12px;
}

.statistics .green {
	color: #308359;
}

.statistics .blue {
	color: #4B789A;
}

.statistics .red {
	color: #CD6557;
}

/* ================= Toggle Message ================= */
.toggle-message {
	background: #f9f9f9 url(/images/withsystem/toogle-message-bg.png)
		repeat-x top;
	border: 1px solid #ccc;
	cursor: pointer;
	border-radius: 2px;
	position: relative;
	line-height: 21px;
}

.toggle-message .title {
	color: #40515E;
	padding: 10px 15px;
}

.toggle-message:hover {
	border: 1px solid #b1b1b1;
}

.toggle-message .title:hover {
	color: #344654;
}

.toggle-message .hide-message {
	color: #586873;
	padding: 15px;
	display: none;
	padding-top: 0;
}

.toggle-message .d-icon {
	position: absolute;
	right: 15px;
	top: 19px;
}

/* ================= Tabs ================= */
#tabs {
	border: 1px solid #fff;
}

/* ================= Sliders ================= */
#slider-range-max, #slider-range, #slider {
	border: 1px solid #D2D4D4;
	background: #F4F5F4;
	height: 10px;
	border-top: 2px solid #ccc;
	border-radius: 20px;
}

/* ================= Accordion ================= */
#accordion {
	border-radius: 0px;
}

#accordion h3 a {
	color: #333;
	border-radius: 0px;
	font: bold 12px Arial, Helvetica, sans-serif;
	background: none;
}

/* ================= Imagebox ================= */
.imagebox {
	padding: 15px;
}

.imagebox img {
	float: left;
	margin: 2px;
	border: 2px solid #fff;
}

.imagebox img:hover {
	border: 2px solid #333;
}

/* ================= Loading Box ================= */
.loadingbox {
	text-align: center;
	padding: 35px 10px;
	border: 1px solid #ccc;
	color: #9BA4AB;
	font-size: 11px;
	line-height: 19px;
}

.loadingbox h3 {
	font-size: 20px;
	color: #344654;
	padding: 20px 0px;
}

/* ================= Footer ================= */
#footer {
	color: #bbb;
	font-size: 11px;
	line-height: 13px;
	padding: 10px 15px 30px 15px;
}

#footer .left-column {
	float: left;
	width: 400px;
}

#footer .right-column {
	float: right;
	width: 440px;
	color: #999;
	letter-spacing: -0.03em;
	text-align: right;
}

/* ================= Login Form ================= */
.loginform {
	width: 360px;
	margin: 0px auto;
	margin-top: 140px;
	box-shadow: 0px 4px 90px #EEEEEE;
}

.loginform .title {
	background: url(/images/withsystem/login-title.png) no-repeat;
	text-align: center;
	height: 50px;
	padding-top: 20px;
}

.loginform .body {
	padding: 23px 29px 40px 29px;
	background: url(/images/withsystem/login-form-body-bg.png) repeat-x
		bottom;
}

.login-input-pass {
	border: none;
	font: 19px Arial, Helvetica, sans-serif;
	color: #ccc;
	width: 220px;
	border: 1px solid #CED3D8;
	border-radius: 3px;
	border-top: 1px solid #A0A4A9;
	padding: 10px;
	padding-left: 40px;
	margin-bottom: 0px;
	background: url(/images/withsystem/password-input.png) no-repeat 0 0;
}

.login-input-pass-active {
	border: none;
	font: 19px Arial, Helvetica, sans-serif;
	color: #999;
	width: 220px;
	border: 1px solid #CED3D8;
	border-radius: 3px;
	border-top: 1px solid #A0A4A9;
	padding: 10px;
	padding-left: 40px;
	margin-bottom: 0px;
	background: url(/images/withsystem/password-input.png) no-repeat 0 0;
}

.login-input-user {
	border: none;
	font: 19px Arial, Helvetica, sans-serif;
	color: #ccc;
	width: 220px;
	border: 1px solid #CED3D8;
	border-radius: 3px;
	border-top: 1px solid #A0A4A9;
	padding: 10px;
	padding-left: 40px;
	margin-bottom: 7px;
	background: url(/images/withsystem/username-input.png) no-repeat 0 0;
}

.login-input-user-active {
	border: none;
	font: 19px Arial, Helvetica, sans-serif;
	color: #999;
	width: 220px;
	border: 1px solid #CED3D8;
	border-radius: 3px;
	border-top: 1px solid #A0A4A9;
	padding: 10px;
	padding-left: 40px;
	margin-bottom: 7px;
	background: url(/images/withsystem/username-input.png) no-repeat 0 0;
}

.loginform .log-lab {
	color: #A4AAB2;
	font-size: 14px;
	font-weight: bold;
	display: block;
	padding-bottom: 11px;
}

.loginform .button {
	width: 300px;
	height: 49px;
	font: bold 16px Arial, Helvetica, sans-serif;
	color: #fff;
	background: url(/images/withsystem/login-button.png) no-repeat 0px 0px;
	border: none;
}

.loginform .button:hover {
	background: url(/images/withsystem/login-button.png) no-repeat 0px -50px;
}

.loginform .button:active {
	background: url(/images/withsystem/login-button.png) no-repeat 0px
		-100px;
}

.projectstylecnt, .projectstylecntplus		{padding: 4px 0;}

ul.project {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr))
}

ul.project li {
	padding: 0px 0 0 8px;
	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 0 7px;
}

ul.project li a {
	color: #777; 
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: 90%;
}

ul.project li a:hover {
	color: #1391bd;
	text-decoration: underline
}

ul.project li span.ab {
	position: absolute;
}

ul.project li span.ab img {
	margin: -2px 0 0 0;
}

p.moreview {
	border: 1px solid #E4E4E4;
	border-top: none;
	color: #666;
	box-shadow: 0px 1px 0px #eee;
	padding: 9px 15px 8px 0;
	text-align: right;
	background: #FDFDFD url(/images/withsystem/simplebox-dot.png) repeat-x
		top;
}

h4.update {
	padding: 11px 0 10px 20px;
	background: #f5f5f5;
	border-bottom: 1px solid #e4e4e4;
}

h4.update * {
	vertical-align: middle;
}

h4.border_top {
	border-top: 1px solid #e4e4e4;
}

ul.update {
	width: 735px;
	margin: 7px auto 3px auto;
	overflow: hidden
}

ul.update li {
	width: 337px;
	height: 22px;
	padding: 3px 0 0 18px;
	float: left;
	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 10px
		9px;
}

ul.update li a {
	color: #777
}

ul.update li a:hover {
	color: #1391bd;
	text-decoration: underline
}

ul.update li span.time {
	position: absolute;
	font: normal 11px/14px dotum, gulim, Arial;
	color: #6c8ea9;
}

ul.update_reply {
	width: 735px;
	margin: 7px auto 3px auto;
}

ul.update_reply li {
	height: 22px;
	padding: 3px 0 0 18px;
	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 10px 9px;
}

ul.update_reply li a {
	color: #777
}

ul.update_reply li a:hover {
	color: #1391bd;
	text-decoration: underline
}

ul.update_reply li span.time {
	position: absolute;
	font: normal 11px/14px dotum, gulim, Arial;
	color: #6c8ea9;
}

h2.news {
	margin: 10px 0 0 0;
	font-weight: normal;
	padding: 15px 0 10px 30px;
	border-top: 1px solid #c9d2d8;
	border-bottom: 1px solid #d5dce3;
	background: url(/images/withsystem/icons/16x16/news_icon.png) no-repeat 10px 10px;
}

ul.news {
	width: 198px;
	background: #eff3f6;
	padding: 15px 0 12px 0;
}

ul.news li {
	height: 20px;
	padding: 3px 0 0 18px;
	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 10px 8px;
}

ul.news li a {
	color: #777
}

ul.news li a:hover {
	color: #1391bd;
	text-decoration: underline
}

.button-dark_gray {
	background: #949ea4 url(/images/withsystem/button-dark_gray.png) repeat-x bottom;
	font-size: 15px;
	font-weight: 400;
	line-height: 18px;
	color: #fff;
	border: 1px solid #939ca2;
	border-bottom: 1px solid #747d84;
	border-radius: 2px;
	padding: 4px 10px;
	margin: 0px 3px;
	/*text-shadow: 0px -1px #174B73;*/
	letter-spacing: -0.03em;
	transition: background .1s;
	text-wrap: nowrap;
}

.button-dark_gray:hover {
	color: #fff;
	border: 1px solid #939ca2;
	border-bottom: 1px solid #555;
	opacity: 0.95;
	font-size: 15px;
	font-weight: 400;
}

.button-dark_gray:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-dark_gray img {
	margin: 0 1px -3px 0;
}

.button-dark_gray03 {
	background: #949ea4 url(/images/withsystem/button-dark_gray.png) repeat-x bottom;
	font: normal 11px Arial, Helvetica, sans-serif;
	color: #fff;
	border: 1px solid #939ca2;
	border-bottom: 1px solid #747d84;
	border-radius: 2px;
	padding: 6px 6px;
	margin: 0px 0;
	text-shadow: 0px -1px #174B73;
	letter-spacing: -0.03em;
	transition: background .1s;
	text-wrap: nowrap;
}

.button-dark_gray03:hover {
	color: #fff;
	border: 1px solid #939ca2;
	border-bottom: 1px solid #555;
	opacity: 0.95;
}

.button-dark_gray03:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-dark_gray02 {
	/* background: #949ea4 url(/images/withsystem/button-dark_gray01.png) repeat-x bottom; */
	background: #8d8d8d;
	font-size: 15px;
	font-weight: 400;
	color: #fff;
	border: 1px solid #939ca2;
	/*border-bottom: 1px solid #747d84;*/
	border-radius: 2px;
	padding: 4px 10px 4px 8px;
	margin: 0px 2px;
	/*text-shadow: 0px -1px #174B73;*/
	letter-spacing: -0.03em;
	transition: background .1s;
	text-wrap: nowrap;
}

.button-dark_gray02:hover {
	color: #fff;
	border: 1px solid #939ca2;
	/* border-bottom: 1px solid #555; */
	opacity: 0.9;
	font-size: 15px;
	font-weight: 400;
}

.button-dark_gray02:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-dark-gray01 {
	background: #4a585f;
	font-weight: 500; 
	font-size: 14px;
	color: #fff;
	border-radius: 2px;
	padding: 6px 12px;
	transition: background .1s;
	text-wrap: nowrap;
}

.button-dark-gray01:hover {
	/* 
	border: 1px solid #777;
	border-bottom: 1px solid #666;
	font-weight: bold; */
	border: none;
	font-size: 14px;
	color: #fff;
	opacity: 0.9;
}

.button-dark-gray01:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-dark-gray01 img {
	margin: 0 5px 0 0;
}

.button-white01 {
	background: #f2f2f2 /* url(/images/withsystem/button-white01.png) repeat-x bottom */;
	color: #222;
	border: 1px solid #c5c5c5;
	/* border-bottom: 1px solid #969696; */
	border-radius: 2px;
	padding: 4px 10px;
	/* text-shadow: 0px -1px #174B73; */
	letter-spacing: -0.03em;
	transition: .1s;
	text-wrap: nowrap;
}

.button-white01:hover {
	color: #fff;
	background:#374248;
	border: 1px solid #374248;
}

.button-white01:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-white01 img {
	margin: 0 5px -4px 0;
}

.button-white02 {
	background: #f2f2f2;
	color: #222;
	font-size: 15px;
	font-weight: 400;
	border: 1px solid #c5c5c5;
	/*border-bottom: 1px solid #969696;*/
	border-radius: 2px;
	padding: 4px 10px 4px 8px;
	/*text-shadow: 0px -1px #174B73;*/
	letter-spacing: -0.03em;
	transition: .1s;
	text-wrap: nowrap;
}

.button-white02:hover {
	color: #666;
	border: 1px solid #c5c5c5;
	/* border-bottom: 1px solid #969696; */
	opacity: 0.9;
	font-size: 15px;
	font-weight: 400;
}

.button-white02:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-white02 img {
	margin: 0 5px -4px 0;
}

.button-blue01 {
	background: #0c7ca5/*  url(/images/withsystem/button-blue01.png) repeat-x bottom */;
	color: #fff;
	border-radius: 2px;
	padding: 5px 10px;
	border: 0;
	font-size: 15px;
	transition: background .1s;
	text-wrap: nowrap;
}

.button-blue01:hover {
	color:#fff;
	background:#174B73;
	font-size: 15px;
}

.button-blue01:active {
	/* box-shadow: inset 0 0 0.5em #777; */
}

.button-blue01 img {
	margin: 0 3px -4px 0;
}

.simplebox .titleh h3.view {
	color: #333;
	padding: 14px 0 0 15px;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: -0.03em;
}

table.view_chart {
	width: 100%;
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
}

table.view_chart th	* {
	vertical-align: bottom;
}

table.view_chart th {
	background: #f4f4f4;
	border-bottom: 1px solid #e4e4e4;
	text-align: left;
	padding: 12px 0 9px 15px;
	font-weight: 500;
	color: #666;
}

table.view_chart td {
	padding: 5px 10px 5px 10px;
	color: #777;
	border-bottom: 1px solid #E4E4E4;
}

table.view_chart td ul li.left {
	float: left;
}

table.view_chart td ul li.right {
	float: right;
}

div.name_card {
	width: 200px;
	height: 125px;
	margin: 20px 0 0 0;
	position: absolute;
	background: #4c565d;
	border: 1px solid #191b1d;
	border-radius: 4px;
}

div.name_card .tit_card {
	padding: 11px 11px 0 12px;
	overflow: hidden;
}

div.name_card .tit_card .pic {
	float: left
}

div.name_card .tit_card .name_text {
	float: left;
	color: #9ba8b1;
	font: normal 11px/18px Dotum, Gulim, Arial, Helvetica, sans-serif;
	padding: 4px 0 0 10px;
}

div.name_card .tit_card .name_text span {
	color: #fff;
	font: bold 12px/18px Dotum, Gulim, Arial, Helvetica, sans-serif;
}

div.name_card .tit_card .close {
	float: right
}

div.name_card .card_mail {
	padding: 8px 0 0 32px;
	color: #9ba8b1;
	font-weight: bold;
	background: url("/images/withsystem/icons/16x16/004.png") no-repeat 13px
		8px
}

div.name_card .phonenumber {
	overflow: hidden;
	padding: 0 10px 0 12px
}

div.name_card .phonenumber .number {
	float: left
}

div.name_card .phonenumber .number .phone01 {
	padding: 3px 0 0 20px;
	color: #9ba8b1;
	background: url("/images/withsystem/icons/16x16/161.png") no-repeat 1px
		2px
}

div.name_card .phonenumber .number .phone02 {
	padding: 1px 0 0 20px;
	color: #9ba8b1;
	background: url("/images/withsystem/icons/16x16/mobile.png") no-repeat
		1px 0
}

div.name_card .phonenumber .phone_btn {
	float: right;
	padding: 7px 0 0 0;
}

select.view {
	height: 30px;
	margin: 0;
	background: #fff;
	border: 1px solid #D2D4D4;
	/* border-top: 1px solid #A5A6A6; */
	border-radius: 2px;
	color: #333;
	font-size: 14px;
	padding: 4px 4px;
}

.view_result {
	border: 1px solid #e4e4e4;
	border-top: none;
	word-wrap: break-word;
	word-break: break-all;
	overflow: auto;
	padding: 30px 15px;
	font-size: 15px;
	line-height: 1.5;
	color: #515151;
}

.pop_view_result {
	overflow-y: auto;
	max-height: 400px;
	height: 400px;
}

ul.file_tit {
	overflow: hidden;
	background: #f4f4f4;
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4
}

ul.file_tit li {
	float: left;
	font-weight: 400;
	font-size: 13px;
	color: #7d7d7d;
	padding: 12px 12px 11px 12px
}

ul.file_tit li.tit_b {
	font-weight: 600;
	font-size: 14px;
	color: #777;
	letter-spacing: -0.03em;
	font-weight: bold;
}

ul.file_tit li.info {
	font-weight: 400;
	font-size: 12px;
	color: #34b4e1;
	letter-spacing: -0.03em;
}

ul.file_tit li.right {
	float: right;
}

ul.file_tit li span {
	color: #34b4e1;
}

ul.file_tit li a * {
	color: #7d7d7d;
}

ul.file_tit li a {
	font-weight: 400;
	font-size: 12px;
	letter-spacing: -0.03em;
	text-decoration: underline;
}

ul.file_list {
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4
}

ul.file_list li {
	padding: 0 12px 0 12px;
	border-bottom: 1px solid #e4e4e4;
}

ul.file_list li ul {
	overflow: hidden;
}

ul.file_list li ul li {
	float: left;
	font-weight: 400;
	font-size: 12px;
	color: #777;
	padding: 12px 0 11px 0;
	border: none;
}

ul.file_list li ul li * {
	vertical-align: top
}

ul.file_list li ul li a {
	
}

ul.file_list li ul li a:hover {
	text-decoration: underline;
}

ul.file_list li ul li img {
	margin: -2px 5px 0 0;
}

ul.file_list li ul li.file_size {
	font-weight: 400;
	font-size: 13px;
	color: #aaa;
	margin: 0 0 0 20px;
}

ul.file_list li ul li.right {
	float: right;
	font-weight: 400;
	font-size: 12px;
	color: #7d7d7d;
	letter-spacing: -0.03em;
}

.btn_wrap {
	overflow: hidden;
	padding: 23px 13px;
	border: 1px solid #e4e4e4;
	border-bottom: 2px solid #e4e4e4;
	text-align: center;
}

.btn_wrap .left {
	float: left;
}

.btn_wrap .right {
	float: right;
}


/* 리플내용 */
.reply_wrap {
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
}

.reply_normal {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
}

.reply_normal .re_name {
	width: 90px;
	float: left;
	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_normal .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_normal ul {
	width: calc(100% - 90px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_normal ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_normal ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_normal ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_normal ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_normal ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_normal .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_normal .re_date * {
	vertical-align: middle
}

.reply_normal .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_normal .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.reply_reply {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px
}

.reply_reply .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_reply .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply ul {
	width: calc(100% - 110px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply ul * {
	vertical-align: middle
}

.reply_reply ul li {
   font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply .re_date * {
	vertical-align: middle
}

.reply_reply .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.reply_reply1 {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px
}

.reply_reply1 .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_reply1 .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply1 ul {
	width: calc(100% - 110px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply1 ul * {
	vertical-align: middle
}

.reply_reply1 ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply1 ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply1 ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply1 ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply1 ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply1 ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply1 .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply1 .re_date * {
	vertical-align: middle
}

.reply_reply1 .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply1 .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.reply_reply2 {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px;
	margin: 0 0 0 7px;
}

.reply_reply2 .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_reply2 .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply2 ul {
	width: calc(100% - 120px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply2 ul * {
	vertical-align: middle
}

.reply_reply2 ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply2 ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply2 ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply2 ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply2 ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply2 ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply2 .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply2 .re_date * {
	vertical-align: middle
}

.reply_reply2 .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply2 .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.reply_reply3 {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px;
	margin: 0 0 0 14px;
}

.reply_reply3 .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_reply3 .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply3 ul {
	width: calc(100% - 130px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply3 ul * {
	vertical-align: middle
}

.reply_reply3 ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply3 ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply3 ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply3 ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply3 ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply3 ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply3 .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply3 .re_date * {
	vertical-align: middle
}

.reply_reply3 .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply3 .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}


.reply_reply4 {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px;
	margin: 0 0 0 21px;
}

.reply_reply4 .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
  	padding-bottom: 10px;
}

.reply_reply4 .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply4 ul {
	width: calc(100% - 130px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply4 ul * {
	vertical-align: middle
}

.reply_reply4 ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply4 ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply4 ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply4 ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply4 ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply4 ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply4 .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply4 .re_date * {
	vertical-align: middle
}

.reply_reply4 .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply4 .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.reply_reply5 {
	overflow: hidden;
	padding: 15px;
	border-bottom: 1px solid #e4e4e4;
	background: url("/images/withsystem/sub/reply.png") no-repeat 18px 13px;
	margin: 0 0 0 28px;
}

.reply_reply5 .re_name {
	width: 90px;
	padding: 0 0 0 20px;
	float: left;
   	font-weight: bold; 
	font-size: 15px;;
	color: #767676;
	letter-spacing: -0.03em;
   	padding-bottom: 10px;
}

.reply_reply5 .re_name img {
	margin: 0 0 -2px 5px;
}

.reply_reply5 ul {
	width: calc(100% - 140px);
	float: left;
   	padding-right: 70px;
   	box-sizing: border-box;
}

.reply_reply5 ul * {
	vertical-align: middle
}

.reply_reply5 ul li {
	font-weight: normal; 
	font-size: 15px;;
	line-height: 1.5;
	color: #777;
}

.reply_reply5 ul li.subject {
	font-weight: bold;
	padding: 0 0 6px 0;
	color: #555
}

.reply_reply5 ul li.subject span {
	color: #23a4d2;
	font-size: 12px;
	letter-spacing: -0.03em;
}

.reply_reply5 ul li.re_file {
	vertical-align: top;
	padding: 10px 0 0 0;
}

.reply_reply5 ul li.re_file img {
	margin: 0 0 -4px 0;
}

.reply_reply5 ul li.re_file .re_file_list {
	font-weight: normal; 
	font-size: 15px;
	color: #777;
	padding: 0 15px 0 5px;
	text-decoration: underline;
}

.reply_reply5 .re_date {
	width: 132px;
	float: right;
	position: absolute;
	right: 25px;
	font-weight: normal; 
	font-size: 13px;
	color: #767676;
	text-align: right;
}

.reply_reply5 .re_date * {
	vertical-align: middle
}

.reply_reply5 .re_date a{
	margin-top: 10px;
	display: inline-block;
}

.reply_reply5 .re_date img {
	width: 16px;
	margin: -3px 0 0 0
}

.re_yellow {
	background-color: #fffacc;
}

.re_blue {
	background-color: #e3f3f5;
}

.reply_maile {
	overflow: hidden;
	background: #f4f4f4;
	border: 1px solid #e4e4e4;
	border-top: none;
}

.reply_maile .reply_maile_tit {
	float: left;
	font: bold 12px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	letter-spacing: -1pt;
	padding: 12px 5px 7px 15px;
	font-weight: bold;
}

.reply_maile .choice_all {
	float: right;
	font: normal 11px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	letter-spacing: -1pt;
	padding: 10px 7px 5px 5px;
}

.reply_mail_list {
	overflow: hidden;
	border: 1px solid #e4e4e4;
	border-top: none;
	padding: 15px;
}

.reply_mail_list .mail_left {
	float: left;
	font: bold 12px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	letter-spacing: -1pt;
}

.reply_mail_list .mail_right {
	float: left;
	padding: 0 0 0 40px;
	font: normal 11px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	letter-spacing: -1pt;
}

.re_w_tit {
	font-weight: bold; 
	font-size: 15px;
	color: #777;
	letter-spacing: -0.03em;
	padding: 0px 15px 10px 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

div.mail_sms {
	background: #f4f4f4;
	border-top: 1px solid #bebebe;
	border-bottom: 1px solid #e4e4e4;
	padding: 6px 0 8px;
}

div.mail_sms ul {
	padding: 10px 0 8px 13px;
	display: flex;
	flex-wrap: wrap;
	gap: 5px
}

div.mail_sms ul li {
	padding: 5px 8px 4px;
	cursor: pointer;
	font-weight: normal; 
	font-size: 14px;
	letter-spacing: -0.03em;
	text-align: center;
	color: #9c9c9c;
}
div.mail_sms ul li.chk{
	background: #fff;
	border: 1px solid #bbb;
	border-bottom-color: #aaa;
	border-radius: 3px;	
}
div.mail_sms ul li.on {
	background: #eee;
	border-color: #999;
	color: #2d2d2d
}

div.mail_sms .reply_write_check01 * {
	vertical-align: middle;
}

div.mail_sms .reply_write_check01 {
	width: 625px;
	overflow: hidden;
	font-weight: normal; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
	padding: 0px 0 0px 112px;
}

div.mail_sms .reply_write_check01 span {
	font-weight: bold; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
}

div.mail_sms .reply_write_check01 .ch_all {
	width: 70px;
	float: left;
}

div.mail_sms .reply_write_check01 ul.check_wrap * {
	padding: 0;
	margin: 0;
	vertical-align: middle;
}

div.mail_sms .reply_write_check01 ul.check_wrap {
	width: 555px;
	overflow: hidden;
	float: left;
	padding: 0;
}

div.mail_sms .reply_write_check01 ul.check_wrap li {
	text-align: left;
	float: left;
	width: 79px;
	letter-spacing: -0.8pt;
	font-weight: normal; font-size: 14px;
	color: #777;
	background: none;
	padding: 0 0 5px 0;
}

div.mail_sms01 {
	background: #f4f4f4;
}

div.mail_sms01 ul {
	padding: 5px 0 5px 0px;
}

div.mail_sms01 p.ch {
	float: right;
	padding: 7px 0 0 0;
	font-weight: normal; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
}

div.mail_sms01 div.ch {
	float: right;
	padding: 7px 0 0 0;
	font-weight: normal; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
}

div.mail_sms01 .reply_write_textarea {
	padding: 10px 0 0 0;
}

div.mail_sms01 .btn {
	float: right;
	padding: 0 15px 0 0;
}

div.mail_sms01 .reply_write_file * {
	vertical-align: middle;
}

div.mail_sms01 .reply_write_file {
	padding: 15px 0 20px 0;
}

div.mail_sms01 .reply_write_file p {
	float: left;
	margin-top: 10px;
}

div.mail_sms01 .reply_write_check * {
	vertical-align: middle;
}

div.mail_sms01 .reply_write_check {
	width: 625px;
	overflow: hidden;
	font-weight: normal; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
	padding: 5px 0 0 0
}

div.mail_sms01 .reply_write_check span {
	font-weight: bold; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
}

div.mail_sms01 .reply_write_check .ch_all {
	width: 80px;
	float: left;
}

div.mail_sms01 .reply_write_check ul.check_wrap * {
	padding: 0;
	margin: 0;
	vertical-align: middle;
}

div.mail_sms01 .reply_write_check ul.check_wrap {
	width: 625px; overflow : hidden; float : left;
	padding: 0;
	overflow: hidden;
	float: left;
}

div.mail_sms01 .reply_write_check ul.check_wrap li {
	text-align: left;
	float: left;
	width: 79px;
	letter-spacing: -0.8pt;
	font-weight: normal; font-size: 14px;
	color: #777;
	background: none;
	padding: 0 0 5px 0;
}

div.tabline_box {
	width: 625px;
	overflow: hidden;
}

div.reply_write_check_wrap {
	width: 625px;
	overflow: hidden;
}

div.reply_write_write01 .reply_write_file * {
	vertical-align: middle;
}

div.reply_write_write01 .reply_write_file {
	padding: 15px 0 20px 13px;
}

div.reply_write_write01 .reply_write_file p {
	float: left;
}

div.reply_write_write01 .reply_write_check * {
	vertical-align: middle;
}

div.reply_write_write01 .reply_write_check {
	width: 100%;
	box-sizing: border-box;
	overflow: hidden;
	font-weight: normal; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
	padding: 5px 13px 0px;
}

div.reply_write_write01 .reply_write_check span {
	font-weight: bold; font-size: 14px;
	color: #777;
	letter-spacing: -1pt;
}

div.reply_write_write01 .ch_all {
	width: 80px;
	float: left;
}

div.reply_write_write01 ul.check_wrap * {
	padding: 0;
	vertical-align: middle;
}

div.reply_write_write01 ul.check_wrap {
	width: 100%;
	padding: 0;
}

div.reply_write_write01 ul.check_wrap li {
	text-align: left;
	min-width: 80px;
	width:auto;
	letter-spacing: -0.03em;
	font-weight: normal; 
	font-size: 14px;
	color: #777;
	background: none;
	padding: 2px 0 7px 0;
}

div.reply_write_write01 .btn {
	float: right;
	padding: 0 15px 0 0;
}

div.reply_write_write01 p.ch {
	float: right;
	padding: 7px 0 0 0;
	font-weight: normal; 
	font-size: 14px;
	color: #777;
	letter-spacing: -0.03em;
}

div.reply_write_write01 div.ch {
	padding: 7px 13px;
	font-size: 14px;
	font-weight: 600;
	color: #777;
	letter-spacing: -0.03em;
}
/* div.reply_write_write01 .reply_write_textarea	{padding:2px 0 0 0; margin:10px 0 0 13px;} */
div.reply_write_write01 .reply_write_textarea {
	padding: 0px 15px 0 15px;
	margin: 0;
}

div.reply_write_write01 .reply_write_textarea textarea {
	box-sizing: border-box;
	width: 100%;
	line-height: 1.5;
}

div.reply_write_write01 .reply_write_textarea.set_time {
	padding: 10px 15px 0 15px;
}

.reply_write_write {
	background: #f5f5f5;
	padding: 14px 0 25px 115px;
	border-bottom: 1px solid #e4e4e4;
}

.reply_write_write .reply_write_write_tit span {
	font: bold 12px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #858585;
	letter-spacing: -1pt;
}

.reply_write_write01 {
	background: #f5f5f5;
	padding: 14px 0 25px 0px;
	border-bottom: 1px solid #e4e4e4;
}

.reply_write_write01 .workname {
	width: calc(100% - 95px);
}

.width_al {
	padding: 4px 5px 0 0px;
}

.reply_write {
	border: 1px solid #e4e4e4;
	border-top: none;
}

.reply_write .reply_write_w {
	padding: 10px 0 15px 15px;
}

.reply_write .re_w_text {
	overflow: hidden;
}

.reply_write .re_w_text .re_textarea {
	width: 640px;
	float: left;
}

.reply_write .re_w_text .re_btn {
	float: left;
	font: normal 12px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	padding: 0 0 0 23px;
}

.re_file_plus {
	margin: 7px 0 0 0;
	overflow: hidden;
}

.re_file_plus .re_file_plus_btn {
	float: left;
	padding: 10px 0 10px 0;
}

.re_file_plus ul {
	float: left;
	overflow: hidden;
	padding: 8px 0 0 0;
}

.re_file_plus ul li {
	float: left;
	font: normal 12px/14px Dotum, Gulim, Arial, Helvetica, sans-serif;
	color: #777;
	padding: 0 0 0 20px;
}

.re_file_plus ul li img {
	margin: 0 4px -3px 4px;
}

div.pro_search01 {
	width: calc(100% - 22px);
	height: 42px;
	padding: 10px 10px 0 10px;
	border: 1px solid #ccc;
	border-top: none;
	background: linear-gradient(to right, #FCFCFC, #F3F3F3);
}

div.pro_search01 * {
	vertical-align: middle
}

div.pro_search01 ul {
	width: 100%;
	overflow: hidden;
	display: flex;
	justify-content: space-between;
  	flex-wrap: nowrap;
}

div.pro_search01 ul li {
	flex-shrink: 0;
}

div.pro_search01 ul li select {
	font-weight: normal; font-size: 14px;
	color: #555;
}

div.pro_search01 ul li.right {
	flex-shrink: 0;
	padding: 0 0 0 20px;
}

div.pro_search01 ul li span {
	font-weight: bold;
}

div.pro_search01 ul li.right {
	float: right;
}

div.pro_search01 ul li.right1 {
	float: right;
}

div.pop_header {
	width: auto;
	padding: 0 0 0 0;
	overflow: hidden;
}

div.pop_header h3 {
	float: left;
	padding: 14px 0 0 7px;
}

div.pop_header .quickmenu01 {
	float: right
}

p.pop_close {
	position: absolute;
	z-index: 1000;
	margin: 4px 0 0 930px;
	cursor: pointer
}

p.pop_close01 {
	position: absolute;
	z-index: 1000;
	margin: 4px 0 0 710px;
	cursor: pointer
}

div.pop_bg {
	margin: 0px auto;
	background:#fff;
	padding: 50px;
	border-radius: 6px;
}

div.pop_bg01 {
	position: relative;
	margin: 0px auto;
	padding: 0 0 0 20px;
	border: 1px solid #555;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	background: #fff;
}

.modal_close.btn a.cbtn		{position:absolute; top:10px; right:10px; display:block; font-size:0; width:26px; height:26px;  background:#444 url('/images/withsystem/pop_cbtn.png')no-repeat 50% 50% / 15px; border-radius: 2px;}

.wrapper_pop {
	border-radius: 6px;
    overflow: hidden;
}
.wrapper_pop.mini .st-forminput, .wrapper_pop.mini table.project_w td select{
	padding: 4px 6px;
}
.wrapper_pop.mini .st-forminput-active{
	padding: 4px 6px;
}


.wrapper_pop01 {
	width: 100%;
	padding: 0 0 20px 0;
}

.pop_project {
	width: 100%;
	padding: 0;
}

.pop_project .titleh {
	border: 1px solid #E4E4E4;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x
		bottom;
	height: 40px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
	margin: 20px 0 0 0;
}

.pop_projec .padding-in {
	padding: 10px;
	line-height: 18px;
}

.pop_project01 {
	width: 100%;
	padding: 0 0 20px 0;
}

.pop_project01 .titleh {
	border: 1px solid #E4E4E4;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x
		bottom;
	height: 40px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
	margin: 20px 0 0 0;
}

div.pro_search02 {
	height: 42px;
	padding: 10px 10px 0 10px;
	background: #f5f5f5;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	text-align: right;
}

div.pro_search02 * {
	vertical-align: middle
}

.new_bold * {
	font-weight: 500!important;
	color: #333 !important
}

.notice * {
	background: #ffffe1;
	color: #555 !important
}

.notice tr:hover * {
	background: #ffffe1;
}

.notice td:hover * {
	background: #ffffe1;
}

.notice table tr:hover * {
	background: #ffffe1;
}

.titleh h3 {
	font-size: 15px;
	color: #333;
	padding: 13px 0 0 15px;
}

.simplebox01 .body {
	border-left: 1px solid #E4E4E4;
	border-right: 1px solid #E4E4E4;
	color: #666;
	box-shadow: 0px 1px 0px #eee;
	background: #fff url(/images/withsystem/simplebox-dot.png) repeat-x top;
}

.simplebox01 .titleh {
	border-top: 1px solid #E4E4E4;
	border-bottom: 1px solid #E4E4E4;
	background: url(/images/withsystem/simplebox-title-bg.png) repeat-x bottom;
	height: 42px;
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	position: relative;
	margin: 20px 0 0 0;
}

h3			{font-size:15px;}

h3.sub_tit {
	width: 100%;
	box-sizing: border-box;
	font-size:24px;
	font-weight:600;
	color: #222;
	padding:30px 0 0px 20px;
	margin: 0 0 0 -1px;
	/* background: #eee; */
}

h3.sub_tit img.fav {
	width: 23px;
    vertical-align: top;
}

#join_main {
	padding-bottom: 20px;
	background: #fff url(/images/withsystem/join-bg.png) repeat-y;
	border-bottom: 1px solid #D6D8D8;
	border-left: 1px solid #D6D8D8;
	border-right: 1px solid #D6D8D8;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	box-shadow: 0px 1px 0px #DFDFDF;
}

#header .join_tit {
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	padding: 26px 30px 0 200px;
	margin: 0 0 0 20px;
}

.st-labeltext01 {
	display: block;
	color: #8a8a8a;
	float: left;
	line-height: 20px;
	font-size: 12px;
	font-weight: normal;
	padding-top: 3px;
	padding-right: 10px;
}

div#shim {
	visibility: hidden;
	width: 99%;
	height: 50%;
	margin-top: -300px;
	float: left;
}

div#login_wrapper {
	width: 700px;
	height: 600px;
	clear: both;
	position: relative;
	top: -50px;
	margin: 0 auto;
	position: static;
}

#login_main .login_box {
	width: 700px;
	background: url(/images/withsystem/login_bg.png) repeat-y 0 0;
	padding: 60px 0 0 0;
}

table.login_ta {
	width: 460px;
	margin: 0 auto;
}

table.login_ta th {
	font: bold 14px/18px dotum, gulim, Arial;
	color: #8a8a8a;
	text-align: left;
	height: 44px;
}

table.login_ta td.lo_bt {
	vertical-align: top;
	width: 109px;
	height: 36px;
}

.login_ta td .button {
	width: 109px;
	height: 97px;
	font: bold 12px Arial, Helvetica, sans-serif;
	color: #fff;
	background: url(/images/withsystem/login_btn.png) no-repeat 0px 0px;
	border: none;
	padding: 43px 0 40px 0;
	text-align: center;
	box-sizing: border-box;
}

.id_remember {
	width: 300px;
	margin: 10px 0 0 190px;
}

.id_remember * {
	vertical-align: middle;
}

.login_box .btn_bottom {
	width: 700px;
	text-align: center;
	margin: 40px 0 0 0;
	border-top: 1px #eeeeee solid;
	padding: 30px 0 0 0;
	font-weight: 400;
	font-size: 14px;
}

.login_box .btn_bottom .q_text {
	width: 700px;
	padding: 20px 0 5px 0;
	text-align: center;
	font-weight: 400;
	font-size: 14px;
	color: #599cbe;
}

.login_box .btn_bottom .q_text span {
	font-weight: 600;
	font-size: 14px;
	color: #599cbe;
}

div.pop_bg700 {
	width: 700px;
	margin: 0px auto;
	background: url(/images/withsystem/pop_bg700.png) repeat-y 0 0;
	padding: 0 0 0 20px;
}

div.pop_header700 {
	width: 660px;
	padding: 0 0 0 0;
	overflow: hidden;
}

div.pop_header700 h3 * {
	vertical-align: middle;
}

div.pop_header700 h3 {
	width: 640px;
	font: bold 12px/18px dotum, gulim, Arial;
	color: #444;
	margin: 0px 0 0 0;
	padding: 10px 0 0 0;
}

.pop_project700 {
	width: 660px;
	padding: 0 0 10px 0
}

.albox700 {
	font: bold 16px/18px NanumGothic, dotum, gulim, Arial;
	color: #333;
	line-height: 17px;
	/* box-shadow: 0px 1px 0px #F7F7F7; */
	position: relative;
	margin: 5px 0px;
	padding: 14px 14px;
	border-radius: 3px;
	zoom: 1;
}

.today_date {
	text-align: center;
	margin: 10px 0 15px 0;
}

.today_date * {
	vertical-align: middle
}

.today_date a {
	padding: 0 15px 0 15px;
}

table.month_date {
	margin: 0 0 10px 0;width: 100%;
}

table.month_date td {
	cursor: pointer;
	width: 33px;
	height: 24px;
	padding: 3px 0 0 0;
	background: url(/images/withsystem/sub/attend_date_bg.gif) repeat-x 0 0;
	font: bold 12px dotum, Arial, Helvetica, sans-serif;
	color: #bbb;
	letter-spacing: -0.5pt;
	border: 1px solid #e8e8e8;
	text-align: center;
	vertical-align: middle;
}

table.month_date td.today {
	background: #6c8ea9;
	border: 1px solid #5f819c;
	font: bold 12px dotum, Arial, Helvetica, sans-serif;
	color: #fff;
}

table.month_date td.no_date {
	background: #f7f7f7;
}


div.attend_wrap 	{display: flex; justify-content: space-between; gap: 15px;}

div.attend_w {width: 50%;}

ul.attend {padding: 20px;}

ul.attend li {padding:3px 0 6px 8px;	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 0 10px; line-height: 20px; color: #777;}

ul.attend01 li {
	width: 320px;
	padding: 3px 0 10px 8px;
	background: url(/images/withsystem/icons/mini/dot01.gif) no-repeat 0 7px;
	margin: 0 0 0 10px;
	line-height: 14px;
	color: #777
}

.my_work_list {
	background: url(/images/withsystem/sub/my_work_list_bg.gif) repeat 0 0;
	border-top: 1px solid #c8cfd5;
	border-left: 1px solid #c8cfd5;
	border-bottom: 1px solid #dfe6ec;
	border-right: 1px solid #dfe6ec;
	padding: 12px 12px 10px 12px;
	margin: 10px 0 10px 0;
	font-size: 15px;
	line-height: 1.5;
	color: #3f5669;
}

.button-blue02 {
	background: #1596c4;
	color: #fff;
	border-radius: 2px;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
	width: 100%;
	display: block;
}

.button-blue02:hover {
	color: #fff;background:#176581;
}

.button-blue02:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-blue02 img {
	margin: 0 3px -4px 0;
}

.button-blue03 {
	background: #496e8b;
	color: #fff;
	border-radius: 2px;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
	width: 100%;
	display: block;
}

.button-blue03:hover {
	color: #fff;background: #4c5a61;
}

.button-blue03:active {
	box-shadow: inset 0 0 0.5em #777;
}

.button-blue03 img {
	margin: 0 3px -4px 0;
}

.button-orange03 {
	background:#ff8c00;
	color: #fff;
	border-radius: 2px;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
	width: 100%;
	display: block;
}

.button-orange03:hover {
	color: #fff;background:#794d19;
}

.button-orange03:active {
	box-shadow: inset 0 0 0.5em #aa7700;
}

.button-orange03 img {
	margin: 0 3px -4px 0;
}

.attend_list_w, .attend_late_list_w {
	border: 1px solid #e4e4e4;
	margin: 10px 0 0 0;
}

.attend_list_w .attend_list_nd, .attend_late_list_w .attend_list_nd{
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #e4e4e4;
	background: #f8f8f8;
	overflow: hidden;
	padding: 8px 11px;
}

.attend_list_w .attend_list_name, .attend_late_list_w .attend_list_name{
	color: #333;font-weight: 500;
}

.attend_list_w .attend_list_name span, .attend_late_list_w .attend_list_name span{
	color: #848484;
}

.attend_list_w .attend_list_date, .attend_late_list_w .attend_list_date{
	color: #848484;
}

.attend_list_w .attend_list_date span, .attend_late_list_w .attend_list_date span{
	font-weight: bold;
	color: #666;
}

.attend_list_w .attend_list_work, .attend_late_list_w .attend_list_work{
	padding: 11px;
	color: #555;
	line-height: 1.5;
}

.attend_list_w .attend_list_info, .attend_late_list_w .attend_list_info{
	display: flex;
	align-items: center;
}

.attend_list_w .attend_list_info p, .attend_late_list_w .attend_list_info p{
	display: inline-block;
}

.attend_list_w .attend_list_info p.day, .attend_late_list_w .attend_list_info p.day{
	background: #efefef;
	padding: 2px 5px 0;
	border-radius: 2px;
	margin-right: 5px;
}

.attend_list_w .attend_list_info a.space, .attend_late_list_w .attend_list_info a.space{
	margin-left: 6px;
	margin-top: -4px;
}

.late_line {
	border-top: 3px solid #1497c5;
	height: 5px;
	margin: 15px 0 0 0;
}

/*.attend_late_list_w {
	border: 1px solid #d5dce3;
	margin: 10px 0 0 0;
}

.attend_late_list_w .attend_list_nd {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #e4e4e4;
	background: #f8f8f8;
	overflow: hidden;
	padding: 8px 11px;
}

.attend_late_list_w .attend_list_name {
	float: left;
	font: bold 12px dotum, Arial, Helvetica, sans-serif;
	color: #3a5265;
}

.attend_late_list_w .attend_list_name span {
	font: normal 11px dotum, Arial, Helvetica, sans-serif;
	color: #8b959c;
	letter-spacing: -1pt;
}

.attend_late_list_w .attend_list_date {
	float: right;
	font: normal 11px dotum, Arial, Helvetica, sans-serif;
	color: #8b959c;
}

.attend_late_list_w .attend_list_date span {
	font-weight: bold;
	color: #636b72;
}

.attend_late_list_w .attend_list_work {
	padding: 11px;
	font: normal 12px/18px dotum, Arial, Helvetica, sans-serif;
	color: #555;
}

.attend_late_list_w .attend_list_info {
	display: flex;
	align-items: center;
}

.attend_late_list_w .attend_list_info p {
	display: inline-block;
}

.attend_late_list_w .attend_list_info p.day {
	background: #efefef;
	padding: 2px 5px 0;
	border-radius: 2px;
	margin-right: 5px;
}

.attend_late_list_w .attend_list_info a.space {
	margin-left: 6px;
	margin-top: -4px;
}*/

/*담당자*/
ul[class^="person_charge"] {
	width: 100%;
}

ul[class^="person_charge"] li {
	width: 100%;
	height: 51px;
	margin: 2px 0 2px 0;
	background: #fff;
	overflow: hidden;
	display: inline-table;
	border: solid 1px #DBDBDB;
}

ul[class^="person_charge"] li.edit {
	background: #fff
}

ul[class^="person_charge"] li .person_img {
	width: 40px;
	height: 40px;
	padding: 4px 0 0 5px;
	margin-top: 1px;
	float: left;
	background: url(/images/withsystem/sub/person_img.gif) no-repeat 5px 4px
}

ul[class^="person_charge"] li .person_name {
	width: 145px;
	float: left;
	padding: 6px 0 0 10px;
}

ul[class^="person_charge"] li .person_name .name {
	font-weight: bold;
	color: #444
}

ul[class^="person_charge"] li .person_date {
	width: 280px;
	float: left;
	padding: 0 0 0 15px;
}

ul[class^="person_charge"] li .person_date span.b {
	font-weight: bold;
	color: #444;
	margin-left: 8px;
}

ul[class^="person_charge"] li .person_date .ing01 {
	height: 18px;
	padding: 7px 0 0 0;
	font-weight: bold;
	background: url("/images/withsystem/sub/icon01.png") no-repeat 74px 7px
}

ul[class^="person_charge"] li .person_date .ing02 {
	height: 18px;
	padding: 7px 0 0 0;
	font-weight: bold;
	background: url("/images/withsystem/sub/icon02.png") no-repeat 74px 7px
}

ul[class^="person_charge"] li .person_date .ing03 {
	height: 18px;
	padding: 9px 0 0 0;
	font-weight: bold;
	background: url("/images/withsystem/sub/icon03.png") no-repeat 74px 7px
}

ul[class^="person_charge"] li .person_date .ing04 {
	height: 18px;
	padding: 10px 0 0 0;
	font-weight: normal;
	color: #aaa
}

ul[class^="person_charge"] li .person_date span {
	font-weight: normal;
	margin-right: 8px;
}

ul[class^="person_charge"] li .person_etc {
	/* width: 186px; */
	overflow: hidden;
	padding-top: 10px;
}

ul[class^="person_charge"] li .person_etc .state {
	width: 80px;
	height: 21px;
	padding: 7px 0 0 0;
	text-align: center;
	border: 1px solid #dcdde2;
	float: left;
	background: url("/images/withsystem/sub/state_bg.gif") repeat 0 0
}

ul[class^="person_charge"] li .person_etc .icon {
	width: auto;
	float: left;
	text-align: left;
	padding: 7px 0 0 4px;
	height: 30px;
}

/*책임자*/
ul.person_charge2 li {
	background: #FFFFDC;
}

}
div.pop_id {
	padding: 40px 10px 20px 10px;
	border-top: 1px solid #ccc;
	text-align: center;
	border: 1px solid #ccc;
	background: url("/images/withsystem/pop_search_bg.png") repeat-x 0 100%;
}

div.pop_id * {
	vertical-align: middle
}

div.pop_search01 {
	height: 80px;
	padding: 10px 10px 0 10px;
	border: 1px solid #ccc;
	background: url("/images/withsystem/pop_search_bg.png") repeat-x 0 100%;
}

div.pop_search01 * {
	vertical-align: middle
}

div.pop_search01 ul {
	overflow: hidden;
}

div.pop_search01 ul li {
	padding: 0 0 5px 0;
}

div.pop_search01 ul li select {
	font-weight: 400;
	font-size: 15px;
	color: #555;
}

/*write_title*/
div.st-form-line02 .ch_mr {
	margin: 10px 0 10px 118px;
	display:flex;
	flex-wrap:wrap;
	gap:15px;
}
div.st-form-line02 span.bold {
	font-weight: bold;
	color: #777;
	margin-left: 4px;
}

.ch_all {
	width: 70px;
	float: left;
}

ul.check_wrap {
	width: 555px;
	overflow: hidden;
	float: left;
}

ul.check_wrap li {
	float: left;
	width: 79px;
	letter-spacing: -0.8pt;
	padding: 0;
	margin: 0;
}

h3.pop_tit01 {
	padding: 10px 0 0 0;
	font: bold 18px/18px dotum, gulim, Arial;
}

ul.project_step_list {
	border: 1px solid #ccc;
}

ul.project_step_list li {
	padding: 10px 0 0 10px;
	font: normal 12px dotum, Arial, Helvetica, sans-serif;
	color: #555;
}

/*add_star 2013.04.05*/
div.s_write {
	width: 350px;
	padding: 18px 25px;
	position: relative;
	border: 1px solid #bbb;
	background: #fff;
	box-shadow: 0 1px 3px #ccc;
}

div.s_write .tit_write {
	overflow: hidden;
}

div.s_write .tit_write .tit {
	float: left;
	font: bold 14px dotum, Arial, Helvetica, sans-serif;
	color: #333;
}

div.s_write .tit_write .close {
	float: right
}

div.s_write ul {
	padding: 15px 0 0 0
}

div.s_write ul li {
	padding: 5px 0 0 0;
	font: normal 12px dotum, Arial, Helvetica, sans-serif;
	color: #555;
}

div.s_write ul li span {
	font-weight: bold
}

div.s_write .font_o {
	padding: 5px 0 0 40px;
	font: normal 11px dotum, Arial, Helvetica, sans-serif;
	color: #ef6d0b;
}

div.s_write .button-box {
	text-align: center;
	padding: 10px 0 0 0;
}

div.static_tit {
	padding: 10px;
	overflow: hidden;
	border-bottom: 1px solid #ccc;
	background: #f5f5f5;
	display:flex;
	justify-content: space-between;
    align-items: center;
}

div.static_tit * {
	vertical-align: middle
}

div.static_tit .tab_btn {
	display:flex;
	z-index:revert !important;
}
div.static_tit ul li select {
	font: normal 12px/14px dotum, gulim, Arial;
	color: #555;
}

/*추가_start 2013.05.02*/
input .input_name {
	background: url(/images/withsystem/sub/input_name.gif) no-repeat 0 0;
}

.input_email {
	background: url(/images/withsystem/sub/input_email.gif) no-repeat 0 0;
}
/*추가_end 2013.05.02*/

/*추가_start 2013.05.03*/
ul.project_tab_blue {
	width: 100%;
	overflow: hidden;
}

ul.project_tab_blue li:not(.on):first-child {
	border-left: 1px solid #e8e8e8;
}
ul.project_tab_blue li {
	height: 25px;
	padding: 14px 0 0 0;
	float: left;
	color: #bbb;
	text-align: center;
	cursor: pointer;
	border-right: 1px solid #e8e8e8;
	border-top: 1px solid #e8e8e8;
	background: #fff;
}

ul.project_tab_blue li.on {
	height: 26px;
	background: #1fa0cd;
	padding: 13px 0 0 0;
	font-weight: 600;
	color: #fff;
	border-top: 1px solid #0e8ab7;
	border-right: 1px solid #0e8ab7;
	border-left: 1px solid #0e8ab7;
}

ul.project_tab_blue li.over {
	height: 25px;
	padding: 14px 0 0 0;
	float: left;
	color: #acacac;
	text-align: center;
	cursor: pointer;
	border-right: 1px solid #e8e8e8;
	background: #f7f7f7;
}

ul.project_tab_blue li.first {
	height: 26px;
	padding: 14px 0 0 0;
	float: left;
	font-weight: bold;
	letter-spacing: -0.03em;
	color: #bbb;
	text-align: center;
	cursor: pointer;
	border-left: 1px solid #e8e8e8;
	border-right: 0px;
	background: url("/images/withsystem/tab_bg.png") repeat-x 0 0;
}

ul.project_tab_blue li.first_over {
	height: 26px;
	padding: 14px 0 0 0;
	float: left;
	font-weight: bold;
	letter-spacing: -0.03em;
	color: #bbb;
	text-align: center;
	cursor: pointer;
	border-left: 1px solid #e8e8e8;
	border-right: 0px;
	background: url("/images/withsystem/tab_bg_over.png") repeat-x 0 0;
}

.titleh_blue {
	border-top: 1px solid #0e8ab7;
	border-bottom: 1px solid #0e8ab7;
	border-left: 1px solid #0e8ab7;
	border-right: 1px solid #0e8ab7;
	background:#1fa0cd;
	height: 40px;
	border-top-right-radius: 3px;
	position: relative;
}

.titleh_blue h3 {
	font-size: 15px;
	color: #fff;
	padding: 13px 0 0 15px;
}

.shortcuts-icons_blue {
	position: absolute;
	text-align: right;
	right: 10px;
	top: 8px;
}
.shortcuts-icons_blue a{
	transition: .1s;
}
.shortcuts-icons_blue a:hover {
    filter: brightness(.95);
}
.titleh_blue + div .tablesorter_blue{
	border-top:0;
}
span.secret {
	width: 45px;
	display: block;
	margin: 0 auto;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-align: center;
	color: #fff !important;
	background: #f44c11;
	border: 1px solid #d13600;
	border-radius: 19px;
}

span.inside {
	width: 45px;
	display: block;
	margin: 0 auto;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-align: center;
	color: #fff !important;
	background: #3abbe9 !important;
	border: 1px solid #1c9cca;
	border-radius: 19px;
}

span.se_in {
	width: 45px;
	margin: 0 auto;
	display: block;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-align: center;
	color: #fff !important;
	background: #57bd2a;
	border: 1px solid #38980e;
	border-radius: 19px;
}

.business_area {
	width: 100%;
	height: 250px;
	border: 1px solid #e4e4e4;
	text-align: center;
	background: #f9f9f9;
	font-family: gulim, Arial;
	font-size: 14px;
	color: #787775;
	font-weight: bold;
}

.business_area .no_business {
	width: 151px;
	height: 121px;
	background: url(/images/withsystem/project_no.gif) #f9f9f9 no-repeat 50%
		0;
	padding: 50px 0 0 0;
	margin: 55px auto 0 auto;
}

.business_area2 {
	width: 100%;
	height: 550px;
	border: 1px solid #e4e4e4;
	text-align: center;
	background: #f9f9f9;
	font-family: gulim, Arial;
	font-size: 14px;
	color: #787775;
	font-weight: bold;
}

.business_area2 .no_business2 {
	width: 151px;
	height: 121px;
	background: url(/images/withsystem/project_no.gif) #f9f9f9 no-repeat 50%
		0;
	padding: 50px 0 0 0;
	margin: 165px auto 0 auto;
}

.new_blur {
	color: #ccc !important;
}

.ell {display: block; width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1;  -webkit-box-orient: vertical;}

/*	2015-02-03	크롬 페이징 버튼 */
div.dataTables_wrapper {
	/*z-index: 600;*/
}

/* 프로젝트 - 회원초대 */
.invite_flex				{display:flex; gap:30px; margin-top:10px;}
.invite_flex .simplebox 	{width:100%; z-index:revert !important}
.invite_flex .w450			{width:450px; min-width:450px;}








/* 260327 pms개편 */

/* 공통 */
:root{
	--black : #222;
	--navy : #013b80;
	--sky : #00acd7;
	--redLight : #d55763;
	--darkBlue : #374248;
	--darkBlueOn : #67737b
}

.btnLine						{border:1px solid #969696; border-radius: 4px; padding:6px 8px 6px 28px; font: 400 12px Arial, Helvetica, sans-serif; color:#222;}
.btnLine:disabled {background-color: #eaeaea !important; cursor: not-allowed;}
.top_list .btn_write	{background:#fff url(/images/withsystem/work.svg) no-repeat 10% 50% / 17px;}
.top_list .btn_send	{background:#fff url(/images/withsystem/send.svg) no-repeat 10% 50% / 20px;}
.top_list .btn_note	{background:#fff url(/images/withsystem/write.svg) no-repeat 10% 50% / 17px;}
.top_list .btn_download	{background:#fff url(/images/withsystem/download.svg) no-repeat 8% 50% / 18px;}

.ml10									{margin-left:10px;}
.mr5									{margin-right:5px;}

/* p a.search_btn							{display:inline-block;cursor:pointer;font-size:0;border: 1px solid #ddd;width: 28px;height: 28px;background:url('/images/withsystem/icons/search_btn.svg')no-repeat 50% 50% / 20px;vertical-align:middle;} */

p.no_data								{text-align: center; padding: 50px 0; border-bottom: 1px solid #ddd;}

.btn_center									{text-align:center; margin-top:30px;}
.pro_search.new li						{display: flex; align-items: center; justify-content: space-between;}
/* .button-blue, .button-green				{line-height: 26px;} */

.sel_cont								{display:flex; justify-content: flex-end; gap: 7px; margin-bottom: 15px;}
li.list_box								{display: flex; justify-content: space-between; gap: 10px; align-items: center; border:1px solid #ddd; padding:20px;}
li.list_box:nth-child(2n)				{background: #f9f9f9;}
li.list_box:nth-child(n+2)				{border-top:0;}
li.list_box .data_wrap					{display: flex; gap: 10px;}
li.list_box .data						{display: flex; flex-direction: row; align-items: center; gap: 10px;}
li.list_box .team						{display: flex; gap: 5px; align-items: center;}
li.list_box .data .work_data			{font-weight:500;}
li.list_box .data .week_data			{color: #999;}
li.list_box p span						{padding: 5px;}

/* 팝업 */
div.layer				{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999 !important;}
div.layer .bg			{position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.6; filter:alpha(opacity=30);}
div.layer .pop-layer	{position:absolute; top: 50%; left: 50%; width:100%; max-width:1000px; background:#fff; z-index: 500 !important; padding:30px; border-radius: 10px;}
.pop_title				{width:100%; position:relative; font-size:20px; font-weight:600; color:#444; padding-bottom: 20px;}
.pop_title a.cbtn		{position:absolute; top:-5px; right:0px; display:block; font-size:0; width:26px; height:26px;  background:#444 url('/images/withsystem/pop_cbtn.png')no-repeat 50% 50% / 15px; border-radius: 2px;}

table.pop_tb								{font-family:arial;background-color: #fff;margin:0px 0pt 0px;font-size: 12px;width: 100%;text-align: left; }
table.pop_tb th								{background: #f8f8f8;}	
table.pop_tb th, table.pop_tb td			{padding:10px 8px 9px 8px;  font-size:15px; border:1px solid #E4E4E4; word-break: break-all;}

input[type="date"]							{padding: 6px 6px 6px 8px; border-radius:3px; height:32px; background:#fff; border:solid 1px #ddd;}




/* 260331 사이드바 최소높이값 설정 */
#main {
	display: flex;
}
#sidebar{
	min-height: calc(100vh - 71px);
    box-sizing: border-box;
}

/* 260327 주간업무보고 페이지 */
.content.pr{
	position: relative;
}
.fixed_tit_area{
	width: 100%;
    position: sticky;
    left: 0;
    top: 0;
    padding : 30px 20px 20px;
    display : flex;
    align-items: center;
    background: #f1f1f1;
    box-sizing: border-box;
    z-index: 10;
}
.fixed_tit_area > a{
	align-self: flex-start;
    margin: 2px 12px 0 0;
}
.fixed_tit_area .tit_box h2{  
    font-size: 22px;
    font-weight: 600;
    color: #222;
}
.fixed_tit_area .tit_box p{
	margin-top: 12px;
	font-weight: 400;
	font-size: 15px;
	color: #888;
}
.fixed_tit_area .button_area{
	display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 14px;
    margin-left: auto;
}
.fixed_tit_area .button_area > div{
	display : flex;
	justify-content: flex-end;
	gap : 7px;
}
.fixed_tit_area button{
	margin: 0;
	cursor: pointer;
	transition: .1s;
	font-size: 15px;
	font-weight: 400;
}
.fixed_tit_area .top_list button:hover{
	filter: brightness(.94);
}
.fixed_tit_area .button_area .bottom_list{
	display : flex;
	justify-content: flex-end;
	gap : 0;
	background: #fff;
	border-radius: 4px;
    overflow: hidden;
}
.fixed_tit_area .bottom_list button{
	padding: 6px 12px;
	font-size: 14px;
    font-weight: 600;
    border: none;
    color: #888;
    background: none;
}
.fixed_tit_area .bottom_list button:hover{
	background: #f4f4f4;
}
.fixed_tit_area .bottom_list button.on{
	background: #d55763;
	color: #fff;
	border-color: #d55763;
}
.fixed_tit_area .bottom_list button.black.on{
	background: var(--black);
	border-color: var(--black);
}
.fixed_tit_area .bottom_list button.sky.on{
	background: var(--sky);
	border-color: var(--sky);
}
.fixed_tit_area .bottom_list button.navy.on{
	background: var(--navy);
	border-color: var(--navy);
}
button.toggle_key{
    position: absolute;
    top: 20px;
    right: 20px;
    background:#fff url(/images/withsystem/icon-plus.svg) no-repeat 90% 50% / 11px;
	border: 1px solid #969696;
    border-radius: 4px;
    padding: 6px 28px 6px 8px;
    font-size: 14px;
	font-weight: 400;
    color: #222;
    cursor: pointer;
    transition: .1s;
}
button.toggle_key.open {
    background: #fff url(/images/withsystem/icon-minus.svg) no-repeat 90% 50% / 11px;
}
button.toggle_key:hover{
	filter: brightness(.94);
}
h2.tit_16{
	margin-top: 28px;
	font-size: 18px;
	line-height: 30px;
	font-weight: 600;
    color: #3c3c3c;
    padding: 0 0 12px;
}
h2.tit_16.magin-top0{
	margin-top: 0;
}
h2.tit_16 span{
	font-weight: inherit;
}
.titleh_gray_toggle{
    position: relative;
    height: 46px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 13px;
    background: #95a0a6;
    border: 1px solid #95a2aa;
    border-bottom: 1px solid #7b878f;
    /* background: linear-gradient(#aab3b9, #95a0a6); */
    z-index: revert !important;
    box-sizing: border-box;
    cursor: pointer;
}
.project-section .titleh_gray_toggle:first-of-type{
	border-radius: 3px 3px 0 0;
}
.titleh_gray_toggle h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 600;
}
.titleh_gray_toggle img{
    width: 17px;
    object-fit: contain;
    transform: rotate(180deg);
    user-select: none;
}
.titleh_gray_toggle.close img {
    transform: rotate(0deg);
}


/*260330 주간업무 작성 페이지*/
.fixed_tit_area.nofixed{
    position: relative;
}
.fixed_tit_area.nofixed{
	padding: 30px 20px 20px;
	background: #f1f1f1;
}
.fixed_tit_area.nofixed .tit_box h2 {
    font-size: 22px;
    line-height: inherit;
    font-weight: 600;
}
.fixed_tit_area.nofixed button{
	font-size: 16px;
	padding: 6px 12px;
	font-weight: 500;
}
.fixed_tit_area.nofixed .button-blue01:hover {
	font-size: 16px;
}
.project_select {
    width: 100%;
    display: flex;
    padding: 10px;
    background: #e7e7e7;
    border: 1px solid #d4d4d4;
    box-sizing: border-box;
    border-radius: 3px;
}
.project_select b{
	font-size: 15px;
	width: 120px;
	display: flex;
	justify-content: center;
    align-items: center;
    color: #333;
}
.project_select .input_wrap{
	position: relative;
    width: 850px;
}
.project_select .input_wrap::after {
    content: '';
    width: 14px; 
    height: 14px;
    background: url('/images/withsystem/icons/button/icon_toggle_down.svg') no-repeat center center;
    background-size: contain;
    position: absolute;
    top: 50%;
    right: 10px; 
    transform: translateY(-50%);
    pointer-events: none;
}
.project_select .input_wrap.open::after {
    transform: translateY(-50%) rotate(180deg);
}
.project_select input {
    width: 100%;
    font-size: 15px;
    padding: 8px 10px;
    box-sizing: border-box;
    border: 1px solid #cecece;
    cursor: pointer;
    background:#fff;
}
.project_select .input_wrap:has(.is-locked)::after {
    opacity: 0.4;
}
.project_select input.is-locked {
	background: #f5f5f5;
    color: #a0a0a0;
    cursor: default;
}
.project_list {
    position: absolute;
    top: 30px;
    left: 0;
    width: 100%;
    max-height: 300px;
    border: 1px solid #D2D4D4;
    border-radius: 0 0 3px 3px;
    background: #fff;
    padding: 14px 8px 4px;
    display: none;
    z-index: 10;
    box-sizing: border-box;
    overflow-y: auto;
	overscroll-behavior: none;
}
.project_list > div {
	margin-top: 15px;
	border-bottom: 1px dashed #e4e4e4;
}
.project_list > div:first-child {
	margin-top: 0;
}
.project_list > div:last-child {
	border-bottom: 0;
}
.project_list strong{
	font-size: 15px;
}
.project_list ul {
	margin: 4px 0 10px;
}
.project_list ul li {
    padding: 7px 4px;
    cursor: pointer;
    font-size: 15px;
    color: #999;
    transition: .1s;
}
.project_list li:hover {
    background-color: #e4f4fb;
    color: #444;
}

/*컨텐츠 내용 작성*/
.project-content{
	width: 100%;
}
.not-choice{
	margin-top: 15px;
	width: 100%;
	height: 150px;
	background: #f8f8f8;
	text-align: center;
	line-height: 150px;
    border-radius: 4px;
    font-size: 15px;
    color: #777;
    display: none;
}
.flexbox_row{
	margin-top: 20px;
	display: flex;
	align-items: center;
	gap: 5px;
}
.flexbox_row h2.tit_16 {
    margin-top: 0;
}
.help{
	position: relative;
	width: 16px;
	height: 16px;
	padding-bottom: 12px;
}
.help b{
	display: block;
	width: 16px;
	height: 16px;
	font-weight: 600;
	font-size: 14px;
	color: #999;
	background: #fdfdfd;
	border-radius: 50%;
	border: 1.5px solid #999;
	text-align: center;
	line-height: 16px;
	cursor: pointer;
}
.help .tooltip{
	position: absolute;
	top: 0;
	left: 100%;
	margin-left: 5px;
	width: max-content;
	background: #fff;
	border: 1px solid #bcbcbc;
	border-radius: 4px;
	padding: 14px 14px 12px;
	opacity: 0;
	transition: .2s;
	visibility: hidden;
	pointer-events: none;
	color: #454545;
	z-index: 2;
	line-height: 1.3;
}
.help b:hover + .tooltip {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.help .tooltip strong{
	margin: 10px 0 2px;
	display: block;
	font-weight: 600;
}
.help .tooltip strong:first-child{
	margin-top: 0;	
}


/*회의록 팝업 작성*/
.wrapper_pop1{
	position: relative;
	width: 1285px;
	padding: 10px 20px;
	box-sizing: border-box;
}
.wrapper_pop1 .button-blue01{
  	margin: 20px 0 0 auto;
	display: block;
	border: none;
	font-size: 12px;
	font-weight: bold;
	cursor: pointer;
}

/*회의록 팝업 작성 > 회의록 작성*/
.wrapper_pop2{
	position: relative;
	width: 1000px;
	padding: 10px 20px;
	box-sizing: border-box;
}


/* 260420 팝업 스타일 수정 */
/*#modal_project, #modal_etc{
	position: fixed !important;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
    align-items: center;
}*/
 .sms-popup-st div.pop_bg{
    width: max-content;
    
 }
.sms-popup-st .pop_project{
	 width: max-content;
	 max-width: 1100px;
	 padding: 0;
}
.blockUI.blockMsg.blockPage{
	margin: 0 !important;
	left: 0 !important;
	width: 100% !important;
	display: flex;
    justify-content: center;
}


/* 260424 프로젝트 보드 최소폰트 크기 */
.view_result p, .view_result span {
    font-size: clamp(15px, 1em, 100px) !important;
}

.flex-r-c{
	display: flex;
	align-items: center;
}



/* left dotlist  */

#sidemenu ul.dot_list > li				{position: relative;}
#sidemenu ul.dot_list > li::before		{position:absolute; content:''; width:3px; height:3px; border-radius:50%; background:#777; top:12px; left:10px; color:#555} 
#sidemenu ul.dot_list > li a			{padding: 7px 26px 7px 20px;}
#sidemenu ul.dot_list > li a:hover		{padding: 6px 26px 6px 20px;}
#sidemenu ul.dot_list.v02 > li::before	{top:17px;}
#sidemenu ul.dot_list.v02 > li a	{padding: 10px 20px 10px 20px;}
#sidemenu ul.dot_list.v02 .tips-right {padding: 12px 20px 12px 20px;}