@charset "utf-8";
/* 
	scpr_skpub 
	원정인 폰트 적용
*/

@font-face {
	font-family:'NotoKrL';
	font-style:normal;
	font-weight:100;
	
	src:local('Noto Sans Light'), local('NotoSans-Light'), url(../font/notosans/NotoSans-Light.eot);
	src:url(../font/notosans/NotoSans-Light.eot?#iefix) format('embedded-opentype'),
	url(../font/notosans/NotoSans-Light.woff2) format('woff2'),
	url(../font/notosans/NotoSans-Light.woff) format('woff');

}
@font-face {
	font-family:'NotoKrR';
	font-style:normal;
	font-weight:300;
	
	src:local('Noto Sans Regular'), local('NotoSans-Regular'), url(../font/notosans/NotoSans-Regular.eot);
	src:url(../font/notosans/NotoSans-Regular.eot?#iefix) format('embedded-opentype'),
	url(../font/notosans/NotoSans-Regular.woff2) format('woff2'),
	url(../font/notosans/NotoSans-Regular.woff) format('woff');

}
@font-face {
	font-family:'NotoKrM';
	font-style:normal;
	font-weight:500;
	
	src:local('Noto Sans Medium'), local('NotoSans-Medium'), url(../font/notosans/NotoSans-Medium.eot);
	src:url(../font/notosans/NotoSans-Medium.eot?#iefix) format('embedded-opentype'),
	url(../font/notosans/NotoSans-Medium.woff2) format('woff2'),
	url(../font/notosans/NotoSans-Medium.woff) format('woff');
	
}
@font-face {
	font-family:'NotoKrB';
	font-style:normal;
	font-weight:700;
	
	src:local('Noto Sans Bold'), local('NotoSans-Bold'), url(../font/notosans/NotoSans-Bold.eot);
	src:url(../font/notosans/NotoSans-Bold.eot?#iefix) format('embedded-opentype'),
	url(../font/notosans/NotoSans-Bold.woff2) format('woff2'),
	url(../font/notosans/NotoSans-Bold.woff) format('woff');

}

/** 조주현 폰트 cjk 지원 적용 - 20250825 용량문제로 사용안함
@font-face {
	font-family:'NotoCJKL';
	font-style:normal;
	font-weight:100;
	
	src:url(../font/notosans/NotoSansCJKkr-Light.otf) format('opentype'),
	url(../font/notosans/NotoSansCJKkr-Light.woff2) format('woff2'),
	url(../font/notosans/NotoSansCJKkr-Light.woff) format('woff');

}

@font-face {
	font-family:'NotoCJKR';
	font-style:normal;
	font-weight:300;

	src:url(../font/notosans/NotoSansCJKkr-Regular.otf) format('opentype'),
	url(../font/notosans/NotoSansCJKkr-Regular.woff2) format('woff2'),
	url(../font/notosans/NotoSansCJKkr-Regular.woff) format('woff');

}

@font-face {
	font-family:'NotoCJKM';
	font-style:normal;
	font-weight:500;
	
	src:url(../font/notosans/NotoSansCJKkr-Medium.otf) format('opentype'),
	url(../font/notosans/NotoSansCJKkr-Medium.woff2) format('woff2'),
	url(../font/notosans/NotoSansCJKkr-Medium.woff) format('woff');

}

@font-face {
	font-family:'NotoCJKB';
	font-style:normal;
	font-weight:700;
	
	src:url(../font/notosans/NotoSansCJKkr-Bold.otf) format('opentype'),
	url(../font/notosans/NotoSansCJKkr-Bold.woff2) format('woff2'),
	url(../font/notosans/NotoSansCJKkr-Bold.woff) format('woff');

}

*/

html,body,div,h1,h2,h3,h4,h5,h6,p,ul,li,dl,dd,dt,table,td,th,a,span,strong,button,fieldset,legend,tspan{padding:0;margin:0;font-family:'NotoKrR','NotoKrR','sans-serif';letter-spacing:-0.5px;background:transparent;border:0;}
*{outline:none;}
.box{display:none;}
ul,dl,ol{list-style-type:none;}
html,body{ height:100%;}
img{vertical-align:middle;}
a{text-decoration:none;color:#fff;}
fieldset{border:0;}
legend{border:0;display:none}
button{cursor:pointer;}
html,body{ overflow:hidden; }
table{border-spacing:0;padding:0;margin:0;}
.box{opacity:0;}
.loading{text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.close-button{cursor:pointer;}
.box{position:relative;background-color:#f8f8f8;min-height:100%;display:block;}
.essential{color:#e60014;font-size:20px;float:left;margin:-2px 0 0 6px}
.essential-title{color:#e60014;font-size:12px;position:absolute;right:-10px;top:-5px;}
.center-wrap{min-width:1000px;height: -moz-calc(100% - 80px);height: -webkit-calc(100% - 80px);height: -o-calc(100% - 80px);height: calc(100% - 80px);}
.secufy-box{margin:0 -10px;/* height: -moz-calc(100% - 120px);height: -webkit-calc(100% - 120px);height: -o-calc(100% - 120px);height: calc(100% - 120px);*/ }
.h100box{height:100%}
.title strong{position:relative;}
select{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:url(../images/select-drop.png) right 5px center no-repeat;background-size:15px 15px;height: 32px;border-radius: 4px;border: solid 1px #eeeeee;width: -moz-calc(100% - 20px);width: -webkit-calc(100% - 20px);width: -o-calc(100% - 20px);width: calc(100% - 20px);padding:0 10px;display:block;}
select::-ms-expand {display:none}
textarea{font-family:'NotoKrR' !important;padding:0 !important;}

input{ height: 30px;border-radius: 4px;border: solid 1px #eeeeee;width: -moz-calc(100% - 20px);width: -webkit-calc(100% - 20px);width: -o-calc(100% - 20px);width: calc(100% - 20px);padding:0 10px;}
.NamoSE_shadow_box input{height:auto;width:auto;}

/*왼쪽 센터 오른쪽 설정 height:auto !important;height:100%;min-height:100%;*/
.left{height:100%;z-index:10;width:225px;height:100%;min-height:100%;border-radius:0 10px 0px 0px;position:absolute;box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);}

.center{height:100%;z-index:1;width:100%;position:absolute;left:225px;width: -moz-calc(100% - 500px);width: -webkit-calc(100%- 500px);width: -o-calc(100% - 500px);width: calc(100% - 500px);}
.center-box{height:100%;/*overflow:hidden;overflow-y:auto;padding:10px 10px 0 10px !important;*/}
.right{height:100%;z-index:10;width:260px;position:absolute;top:0;right:0;border-radius:10px 0 0px 10px;box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);background-color: #fff}
.right-box{height:100%;/*overflow:hidden;overflow-y:auto;*/}

/*왼쪽 상단메뉴하단 설정*/
.left .header{position:fixed;width:225px;min-height: 250px;margin-top:-2px;}
.left .menu{position:absolute;top:220px;width:235px;}
.left .menu .legal_admin{position:absolute;top:230px;width:235px;}
.left .menu .legal_admin .menu-wrap{height: 100%; margin-top: 20px;}
.left .menu-box{overflow:hidden  !important;width:235px;overflow-y:auto;overflow-x:hidden;}
.left .menu-box li{position:relative;}
.left .menu-box li .main-menu.bg-color2{left:10px;border-radius:10px 0 0 10px}
.left .copyright{color:#fff;font-size:10px;text-align:center;background:rgba(255,255,255,0.03);line-height:16px;height:60px;letter-spacing:0px;}

/*왼쪽 로고, 개인정보*/
.left h1{position:relative;padding:15px 0 20px 15px;height:45px;background-color:#fff;border-radius:0 10px 0 0}
.left h1 a.btn-left-close{position:absolute;opacity:0.38;font-weight:100;top:28px;right:10px;display:block;color:#000;}
.left h1 span{ -ms-transform: rotate(180deg);-webkit-transform: rotate(180deg);transform: rotate(180deg);display:block;}
.left .info{position:relative;}
.left .w80_line{display:none}/*줄어들었을때 생기는 라인*/
.info .my-info{background-color:rgba(0,0,0,0.3);}
.info .my {padding:20px;font-size:14px;color:#fff;height:100px;}
.info .my.legal_admin{height:125px;}
.info .my strong{font-weight:normal;float:left;margin-right:3px;}
.info .my span{font-weight:normal;float:left;font-size:11px;}
.info .my .uid{font-size:12px;font-weight:normal;margin-top:2px;}
.info .my p{font-weight:normal;clear:both;font-size:11px;padding-top:1px;line-height:20px;padding-left:5px;padding-bottom:2px;display:inline-block;width: 190px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.info .my span.line1{font-size:0;height:10px;border-left:1px solid #fff;opacity:0.2;margin:7px 9px 0 9px;}
.info a{color: #fff;display: inline-block;padding:  0 2.5px;}
.info a img{vertical-align:top;margin-top: 3px;}
.info a.logout{}
.info .my {padding:20px 20px;font-size:13px;color:#fff;line-height:22px;}
.info .my span.line3{font-size:0;height:10px;border-left:1px solid #fff;opacity:0.2;margin:6px 9px 0 9px;}
.info .my span.date{margin-left:5px;}

/*왼쪽 메뉴*/
.menu .menus{padding-top:10px;}
.menu ul{margin-top:0;}
.main-menu{display:block;/* color:#fff; */opacity:1.0;padding:17px 0;width:100%;position:relative;font-size:14px;}
.main-menu span{top:16px;left:15px;position:absolute;}
.main-menu span:last-child{right:20px;left:inherit;top:18px;font-size:20px;}
.left .menu-box li .main-menu.bg-color2 span{left:16px;}
.left .menu-box li .main-menu.bg-color2 span:last-child{left:185px;}
.main-menu strong{margin-top:0px;padding-left:45px;padding-right:35px;display:block;font-weight:normal;word-break: break-all;}
.menu ul.submenu{display:none;}
.menu ul.submenu{margin-top:0px;margin-right:10px;}
.menu ul.minmenu{margin-top:0px;}
.main-menu.active{opacity:1;}
.sub-menu{display:block;width:100%;opacity:0.8;background-color:rgba(0,0,0,0.1);font-size:13px;padding:15px 0;position:relative;}
.sub-menu.active{opacity:1;}
.sub-menu span{position:absolute;left:45px;top:13px;}
.sub-menu strong{font-weight:normal;padding-left:55px;display:block;padding-right:35px;word-break: break-all;}
.sub-menu span:last-child{position:absolute;left:190px;font-size:20px;top:13px;}

.menu ul.minmenu{display:none}
.min-menu{display:block;width:100%;background-color:rgba(0,0,0,0.15);font-size:13px;opacity:0.6;padding:15px 0;position:relative;}
.min-menu span{position:absolute;left:55px;top:13px;}
.min-menu strong{font-weight:normal;padding-left:70px;display:block;padding-right:35px;word-break: break-all;}

.scpr_login_tools_wrapper{position: absolute;right: 15px;top: 20px;width: 100px;text-align: right;height: 20px;}


/*메뉴 상단일 경우*/
.box.menu-top{min-width:1280px;}
.menu-top .left{}
.menu-top .center{top:100px;left:0px;width: -moz-calc(100% - 260px);width: -webkit-calc(100%- 260px);width: -o-calc(100% - 260px);width: calc(100% - 260px);}
.menu-top .center.width10{width: -moz-calc(100% - 10px);width: -webkit-calc(100%- 10px);width: -o-calc(100% - 10px);width: calc(100% - 10px);}
.menu-top .top-info{height:50px;}
.menu-top .top-info h1{margin-left:20px;}
.menu-top .top-info h1 img{vertical-align:top;margin-top:9px;}
.menu-top .top-info .info{position:absolute;right:0;top:15px;}
.menu-top .top-info .info strong{float:left;font-size:14px;margin-right:10px;}
.menu-top .top-info .info strong.name{font-weight:900;margin-right:5px;}
.menu-top .top-info .info span{float:left;font-size:12px;margin-top:1px;}
.menu-top .top-info .info span.line1{font-size:0;border-left:1px solid #bbb;height:8px;margin:5px 10px;}
.menu-top .top-info .info a{float:left;position:relative;right:0;top:-3px;margin:0 3px}
.menu-top .top-info .info a.logout{margin-left:15px}
.menu-top .top-info .info a.setting{margin-right:20px}
.menu-top .top-menu{height:50px;}
.menu-top .top-menu .menus{text-align:center;}
.menu-top .top-menu .menus li{display:inline-block;margin:0 -2px;}
.menu-top .top-menu .menus li a{}
.menu-top .top-menu .menus ul{display:none;position:absolute;z-index:99;}
.menu-top .top-menu .main-menu{width:auto;height:36px;padding:0;padding-top:14px;}
.menu-top .top-menu .main-menu strong{padding:0;font-size:14px;border-left:1px solid rgba(255,255,255,0.15);display:inline-block;padding:0 30px;}
.menu-top .top-menu .menus li:first-child .main-menu strong{border-left:0;}
.menu-top .top-menu .menus .submenu{opacity:1;background-color:#fff;  box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);}
.menu-top .top-menu .menus .submenu li{display:block;}
.menu-top .top-menu .menus .submenu a{display:inline-block;}
.menu-top .top-menu .menus .sub-menu {background:transparent;opacity:1;}
.menu-top .top-menu .menus .sub-menu strong{color:#555;font-size:14px;font-weight:normal;padding: 0 50px 0 15px;}
.menu-top .top-menu .menus .sub-menu span:last-child{color:#777;top:15px;}
.menu-top .top-menu .menus .minmenu{opacity:1;background-color:#fff;  box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);width:100%;margin-top:-48px;}
.menu-top .top-menu .menus .minmenu li{display:block;}
.menu-top .top-menu .menus .minmenu a{display:inline-block;text-align:left;}
.menu-top .top-menu .menus .min-menu{background:transparent;opacity:1;}
.menu-top .top-menu .menus .min-menu strong{color:#555;font-size:13px;font-weight:normal;padding: 0 24px 0 15px;}



/*오른쪽*/
.btn-right-close{z-index:9;position:fixed;top:185px;right:255px;width:30px;height:60px;border-radius:10px 0 0px 10px;box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);outline:none;}
.btn-right-close img{margin-top:-5px;    margin-left: -3px;}
.right .pay{font-size:14px;color:#fff;padding:20px;position:relative;height:145px;border-radius:10px 0 0px 0;}
.right .pay h1{font-size:16px;color:#fff;padding:10px 0 0 0px;}
.right .pay div{display: black;margin:0 auto;position:absolute;left:50%;transform:translate(-50%,-50%);top:90px;}
.right .pay div strong{font-size:47px;color:#fff;float:left;}
.right .pay div span{font-size:18px;color:#fff;float:left;margin:28px 0 0 5px}
.right .pay p{position:absolute;bottom:28px;}
.right .pay label{color:#fff;font-size:13px;float:left;}
.right .pay strong{color:#fff;font-size:13px;margin-left:1px;float:left;}
.right .pay strong.count{margin-left:10px;margin-top:-1px;font-size:14px;}
.right .pay .line{font-size:0;height:9px;border-left:1px solid #bbb;float:left;margin:6px 15px 0 15px}
.right .todo{background-color:#fff;}
.right .todo h1{font-size:14px;color:#222;padding:30px 0 0 20px;}
.right ul{margin-top:10px;}
.right li{padding:20px;position:relative;border-bottom:1px solid #eee;}
.right li a{position:absolute;right:20px;top:20px;clear:both;}
.right .icon{border-radius:5px;background-color:rgba(100,91,76,0.1);width:50px;height:37px;text-align:center;padding-top:13px;}
.right .todo h2{font-size:13px;color:#444;margin-bottom:4px;padding-bottom:10px;}
.right .memo{position:absolute;left:85px;top:20px;}
.right .memo div{float:left;width:65px;margin-top:34px;}
.right .memo div:first-child{margin-right:15px;border-right:1px solid #eee;}
.right .memo div h3{font-size:12px;color:#444;}
.right .memo div.warning strong{color:#f04e5c}
.right .memo h2{font-size:13px;color:#444;margin-bottom:4px;padding-bottom:0px;}
.right .memo strong{font-size:20px;color:#222;float:left;}
.right .memo span{font-size:1px;color:#444;margin-left: -3px;float:left;margin:9px 0 0 1px}

/*메뉴 닫었을때 */
.left.width80 h1 a{right:27px;}
.left.width80 h1 span{transform: rotate(0deg);}
.left.width80 .header{width:80px;}
.left.width80 .header h1{height:45px;}
.left.width80 .header h1 img{display:none}
.left.width80 .info{height: 140px; background-color:rgba(0,0,0,0.3);}
.left.width80 .info a.logout{right:26px;top:85px;}
.left.width80 .info a.setting{right:27px;top:30px;}
.left.width80 .w80_line{display:block;font-size:0;width:19px;height:1px;position:absolute;right:30px;top:70px;opacity:0.2;border-top:1px solid #fff}
.left.width80 .my-info{display:none;}
.left.width80 .menu{width:80px;}
.left.width80 .menu li{position:relative;}
.left.width80 .menu .main{width:60px;border-radius:10px;left:10px;}
.left.width80 .menu .main strong{display:none;}
.left.width80 .menu .main span{float:unset}
.left.width80 .main-menu{width: 60px;height: 22.8px;margin-left: 10px;border-radius:10px;}
.left.width80 .menu-box{width:87px;}
.left.width80 .menu-box li .main-menu.bg-color2{left:0;border-radius:10px;}
.left.width80 .menu ul.submenu{position:absolute ;width:180px;;left:80px;top:0px;z-index: 9;}
.left.width80 .menu ul.submenu span{display:none;}
.left.width80 .menu ul.submenu span.material-icons{display:block;transform: rotate(270deg);top:17px;right:15px;font-size:14px;color:#fff;opacity:0.4}
.left.width80 .menu ul.submenu strong{padding-left:15px;padding-right:40px;}
.left.width80 .menu ul.submenu li{background-color:rgba(0,0,0,0.1);}
.left.width80 .menu ul.submenu li a{color:#fff;font-size:13px;}
.left.width80 .menu ul.submenu .sub-menu.active{opacity:1;}
.left.width80 .menu ul.submenu .sub-menu.active span.material-icons{color:#fff;opacity:1;}
.left.width80 .menu ul.minmenu{position:absolute;width:150px;left:180px;top:0px;z-index: 9;}
.left.width80 .menu ul.minmenu span{display:none;}
.left.width80 .menu ul.minmenu span.material-icons{display:block;transform: rotate(270deg);top:17px;right:15px;font-size:14px;color:#fff;opacity:0.4}
.left.width80 .menu ul.minmenu strong{padding-left:15px;padding-right:15px;}
.left.width80 .menu ul.minmenu li{background-color:rgba(0,0,0,0.1);}
.left.width80 .menu ul.minmenu li  a{color:#fff;font-size:13px;opacity:0.4}
.left.width80 .main-menu strong{display:none;}
.left.width80 .main-menu span{left:18px;}
.left.width80 .main-menu span:last-child{display:none ;}
.left.width80 .menu-box li .main-menu.bg-color2 span{left:18px;}
.left.width80 .copyright{display:none;}
.right.width10 {right:-250px;}
.btn-right-close.width10 {right:5px;}
.center.width10{width: -moz-calc(100% - 250px);width: -webkit-calc(100%- 250px);width: -o-calc(100% - 250px);width: calc(100% - 250px);}
.center.width80{left:80px;width: -moz-calc(100% - 340px);width: -webkit-calc(100%- 340px);width: -o-calc(100% - 340px);width: calc(100% - 340px);}
.center.width10.width80{width: -moz-calc(100% - 90px);width: -webkit-calc(100%- 90px);width: -o-calc(100% - 90px);width: calc(100% - 90px);}
.center .graph{  border-radius: 10px;box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05); background-color: #ffffff;float:left;padding:20px ;margin-bottom:20px;}

/*메뉴 스크롤*/
.scrollbar-inner-menu > .scroll-element,.scrollbar-inner-menu > .scroll-element div{background: none;border: none;margin: 0;padding: 0;position: absolute;z-index: 10;}
.scrollbar-inner-menu > .scroll-element div {display: block;height: 100%;left: 0;top: 0;width: 100%;}
.scrollbar-inner-menu > .scroll-element .scroll-element_track { display: none; }
.scrollbar-inner-menu > .scroll-element .scroll-bar {background-color: #6C6E71;display: block;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.scrollbar-inner-menu:hover > .scroll-element .scroll-bar,.scrollbar-inner-menu > .scroll-element.scroll-draggable .scroll-bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity: 0.7;}
.scrollbar-inner-menu > .scroll-element.scroll-x {bottom: 0px;height: 0px;left: 0;min-width: 100%;overflow: visible;width: 100%;display:none;}
.scrollbar-inner-menu > .scroll-element.scroll-y {height: 100%;min-height: 100%;left: 6px;top: 0;width: 0px;}
.scrollbar-inner-menu > .scroll-element.scroll-x .scroll-bar { height: 6px; min-width: 10px; top: -6px; display:none;}
.scrollbar-inner-menu > .scroll-element.scroll-y .scroll-bar { left: -6px; min-height: 10px; width: 6px; }
.scrollbar-inner-menu > .scroll-element.scroll-x .scroll-element_outer { left: 2px; display:none;}
.scrollbar-inner-menu > .scroll-element.scroll-x .scroll-element_size { left: -4px; display:none;}
.scrollbar-inner-menu > .scroll-element.scroll-y .scroll-element_outer { top: 2px; }
.scrollbar-inner-menu > .scroll-element.scroll-y .scroll-element_size { top: -4px; }
.scrollbar-inner-menu > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -11px; }
.scrollbar-inner-menu > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -11px; }

/*메인 가운데*/
.scrollbar-inner-center{min-height:100%;}
.scrollbar-inner-center > .scroll-element,.scrollbar-inner-center > .scroll-element div{background: none;border: none;margin: 0;padding: 0;position: absolute;z-index: 10;}
.scrollbar-inner-center > .scroll-element div {display: block;height: 100%;left: 0;top: 0;width: 100%;}
.scrollbar-inner-center > .scroll-element .scroll-element_track { display: none; }
.scrollbar-inner-center > .scroll-element .scroll-bar {background-color: #6C6E71;display: block;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);opacity: 0;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;-webkit-transition: opacity 0.2s linear;-moz-transition: opacity 0.2s linear;-o-transition: opacity 0.2s linear;-ms-transition: opacity 0.2s linear;transition: opacity 0.2s linear;}
.scrollbar-inner-center:hover > .scroll-element .scroll-bar,.scrollbar-inner-center > .scroll-element.scroll-draggable .scroll-bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity: 0.7;}
.scrollbar-inner-center > .scroll-element.scroll-x {bottom: 0px;height: 0px;left: 0;min-width: 100%;overflow: visible;width: 100%;}
.scrollbar-inner-center > .scroll-element.scroll-y {height: 100%;min-height: 100%;right: 0px;top: 0;width: 0px;}
.scrollbar-inner-center > .scroll-element.scroll-x .scroll-bar { height: 6px; min-width: 10px; top: -6px; }
.scrollbar-inner-center > .scroll-element.scroll-y .scroll-bar { left: -6px; min-height: 10px; width: 6px; }
.scrollbar-inner-center > .scroll-element.scroll-x .scroll-element_outer { left: 2px; }
.scrollbar-inner-center > .scroll-element.scroll-x .scroll-element_size { left: -4px; }
.scrollbar-inner-center > .scroll-element.scroll-y .scroll-element_outer { top: 2px; }
.scrollbar-inner-center > .scroll-element.scroll-y .scroll-element_size { top: -4px; }
.scrollbar-inner-center > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -11px; }
.scrollbar-inner-center > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -11px; }

.error-box{height:100%;background-color:white;min-height:555px;}
.error {text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.error span{font-size:14px;color:#333;}
.error div{margin:41px auto;border-radius:180px;background-color:white;width:180px;height:156px;text-align:center;padding-top:24px;line-height:30px;}
.error .session{padding-top:40px;height:140px;}
.error strong{display:block;color:#e60014;font-size:32px;}
.error h1{font-size:24px;color:#333;margin-top: 80px;}
.error p{font-size:17px;color:#555;margin-top:16px}
.error a{display:block;width:240px;height:43px;background-color: #4747B3;border-radius: 3px;color:#fff;font-size:17px;padding-top:17px;margin:0 auto;margin-top:74px}

.popup{display:none;}
.popup .bg{width:100%;height:100%;background-color:#000;opacity:0.5;position:absolute;top:0;left:0;z-index:10104;}
.popup-box{padding-bottom:30px;position:absolute;margin:0 auto;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10105;border-radius: 10px;background-color: #fff;}
.popup-box h1{position:relative;border-radius: 10px 10px 0 0 ;color:#fff;font-size:18px;padding:15px 0 0 30px;font-weight:bold;height:40px;}
.btn-popup-close{background:url(../resources/images/popup_close.png) right center no-repeat;background-size:15px 15px;position:absolute;top:15px;right:20px;padding-right:20px;}

/*해야할일 팝업*/
.popup-box dl{margin:25px 0 0 30px;}
.popup-box .th{ width: 720px;border-radius: 5px 5px 0 0;background-color: rgba(100, 91, 76, 0.15);height: 45px;}
.popup-box .td{margin-top:0;overflow:hidden;height:405px;}
.popup-box dt{float:left;text-align:center;font-size:12px;color:#222;padding-top:15px;height: 29px;font-weight:bold}
.popup-box dd{float:left;text-align:center;font-size:12px;color:#4d4d4d;padding-top:15px;height: 29px;border-bottom:1px solid #f2f2f2;}
.popup-box .w150{width:150px;}
.popup-box .w270{width:270px;}
.popup-box .w75{width:75px;}
.popup-box .w149{width:144px;}
.popup-box dd.w150{text-align:left;padding-left:5px;}
.popup-box dd span{font-size:10px;}
.popup-box dd.w270{text-align:left;}
.popup-box dd span.opacity {position:relative;margin-left:0px;padding-left:5px;}
.popup-box dd span.opacity span{opacity:0.25;position:absolute;width: -moz-calc(100% + 10px);width: -webkit-calc(100% + 10px);width: -o-calc(100% + 10px);width: calc(100% + 10px);margin:-2px -5px;height:21px;border-radius: 4px;}
.popup-box .td-scroll{padding:0 30px;}

.popup-box.w100{width:100px;}
.popup-box.w200{width:200px;}
.popup-box.w300{width:300px;}
.popup-box.w400{width:400px;}
.popup-box.w500{width:500px;}
.popup-box.w600{width:600px;}
.popup-box.w700{width:700px;}
.popup-box.w780{width:780px;}
.popup-box.w800{width:800px;}
.popup-box.w900{width:900px;}
.popup-box.w1000{width:1000px;}
.popup-box.w1100{width:1100px;}
.popup-box.w1200{width:1200px;}

.popup-box.wp10{width:10%;}
.popup-box.wp20{width:20%;}
.popup-box.wp30{width:30%;}
.popup-box.wp40{width:40%;}
.popup-box.wp50{width:50%;}
.popup-box.wp60{width:60%;}
.popup-box.wp70{width:70%;}
.popup-box.wp80{width:80%;}
.popup-box.wp90{width:90%;}
.popup-box.wp100{width:100%;}

/*얼럿*/
.alert div{text-align:center;position:relative;}
.alert .alert-img{margin-top:40px;}
.alert a{position:absolute;right:15px;top:15px;}
.alert p{color:#222;font-size:15px;padding:20px 0 26px 0}
.alert p.alert-text{padding-top:40px;}
.alert .alert-btn button{color:#fff;width: 120px;height: 40px;border-radius: 4px;margin:0 3px;font-size:14px;}
.alert .alert-btn button:last-child{color:#666;background-color:#eee;}
.alert .alert-btn button.bg-color1{color:#fff;background-color:#4747B3;}
.alert .alert-btn button.bg-color1:hover{background-color:#d92b71}
.popup-box.alert{padding-bottom:15px;}

/*기번 스크롤*/
.scrollbar-inner,.scrollbar-inner-menu,.scrollbar-inner-center,.scrollbar-inner-secufy{max-height: 100%;overflow: auto;}
.scrollbar-inner-center{padding: 20px 15px 10px 15px !important;}
.scroll-wrapper {overflow: hidden !important;padding: 0 !important;position: relative;}
.scroll-wrapper > .scroll-content {border: none !important;box-sizing: content-box !important;height: auto;left: 0;margin: 0;max-height: none;max-width: none !important;overflow: scroll !important;padding: 0;position: relative !important;top: 0;width: auto !important;}
.scroll-wrapper > .scroll-content::-webkit-scrollbar {height: 0;width: 0;}
.scroll-element {display: none;}
.scroll-element, .scroll-element div {box-sizing: content-box;}
.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {display: block;}
.scroll-element .scroll-bar,.scroll-element .scroll-arrow {cursor: default;}
.scroll-textarea {border: 1px solid #cccccc;border-top-color: #999999;}
.scroll-textarea > .scroll-content {overflow: hidden !important;}
.scroll-textarea > .scroll-content > textarea {border: none !important;box-sizing: border-box;height: 100% !important;margin: 0;max-height: none !important;max-width: none !important;overflow: scroll !important;outline: none;padding: 2px;position: relative !important;top: 0;width: 100% !important;}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {height: 0;width: 0;}
.scrollbar-inner > .scroll-element,.scrollbar-inner > .scroll-element div{background: none;border: none;margin: 0;padding: 0;position: absolute;z-index: 10;}
.scrollbar-inner > .scroll-element div {display: block;height: 100%;eft: 0;top: 0;width: 100%;}
.scrollbar-inner > .scroll-element .scroll-element_track { display: none; }
.scrollbar-inner > .scroll-element .scroll-bar {background-color: #6C6E71;display: block;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);opacity: 0;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;-webkit-transition: opacity 0.2s linear;-moz-transition: opacity 0.2s linear;-o-transition: opacity 0.2s linear;-ms-transition: opacity 0.2s linear;transition: opacity 0.2s linear;}
.scrollbar-inner:hover > .scroll-element .scroll-bar,.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);opacity: 0.7;}
.scrollbar-inner > .scroll-element.scroll-x {bottom: 0px;height: 0px;left: 0;min-width: 100%;overflow: visible;width: 100%;}
.scrollbar-inner > .scroll-element.scroll-y {height: 100%;min-height: 100%;right: 0px;top: 0;width: 0px;}
.scrollbar-inner > .scroll-element.scroll-x .scroll-bar { height: 6px; min-width: 10px; top: -6px; }
.scrollbar-inner > .scroll-element.scroll-y .scroll-bar { left: -6px; min-height: 10px; width: 6px; }
.scrollbar-inner > .scroll-element.scroll-x .scroll-element_outer { left: 2px; }
.scrollbar-inner > .scroll-element.scroll-x .scroll-element_size { left: -4px; }
.scrollbar-inner > .scroll-element.scroll-y .scroll-element_outer { top: 2px; }
.scrollbar-inner > .scroll-element.scroll-y .scroll-element_size { top: -4px; }
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -11px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -11px; }

.modal{padding:0;}
.modal.w180{width:180px;}
.modal.w500{width:500px;}
.modal.w680{width:680px;}
.modal.w840{width:840px;}
.modal.w940{width:940px;}

/*웹킷스크롤*/
/* 
.grid .k-auto-scrollable::-webkit-scrollbar  {width: 6px; height: 6px; border: 3px solid #fff;}
.grid .k-auto-scrollable::-webkit-scrollbar-track{background: #efefef; }
.grid .k-auto-scrollable::-webkit-scrollbar-thumb {background: rgba(0,0,0,.2); }

 */
/* 안맞음 ie버젼 스크롤 안됨.
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.grid {position:relative;overflow:hidden;}
	.grid .k-grid-content.k-auto-scrollable{position:relative;right:-10px;scrollbar-base-color: #bcbcbc;scrollbar-face-color: #bcbcbc;scrollbar-3dlight-color: #efefef;scrollbar-highlight-color: #efefef;scrollbar-track-color: #efefef;scrollbar-arrow-color: #efefef;scrollbar-shadow-color: #efefef;scrollbar-dark-shadow-color: #efefef;}
}
@supports (-ms-accelerator:true) {
	.grid {position:relative;overflow:hidden}
	.grid .k-grid-content.k-auto-scrollable{position:relative;right:-10px;-ms-scrollbar-base-color: #bcbcbc;-ms-scrollbar-face-color: #bcbcbc;-ms-scrollbar-3dlight-color: red;-ms-scrollbar-highlight-color: #efefef;-ms-scrollbar-track-color: #efefef;-ms-scrollbar-arrow-color: #efefef;-ms-scrollbar-shadow-color: #efefef;-ms-scrollbar-dark-shadow-color: #efefef;}
} 
@supports (-ms-ime-align:auto) {
	.grid {position:relative;overflow:hidden}
	.grid .k-grid-content.k-auto-scrollable{position:relative;right:-10px;-ms-scrollbar-base-color: #bcbcbc;-ms-scrollbar-face-color: #bcbcbc;-ms-scrollbar-3dlight-color: red;-ms-scrollbar-highlight-color: #efefef;-ms-scrollbar-track-color: #efefef;-ms-scrollbar-arrow-color: #efefef;-ms-scrollbar-shadow-color: #efefef;-ms-scrollbar-dark-shadow-color: #efefef;}
}
*/
/* templeate */
.resize-box{clear:both;}
.round{border-radius: 10px;box-shadow: 4px 4px 12px 0 rgba(0, 0, 0, 0.05), -4px -4px 12px 0 rgba(0, 0, 0, 0.05);background-color: #ffffff;margin:10px}
.grid-box{padding:20px}
.grid-box.no-header .k-grid-content{border-top:1px solid #eee}
.grid-box.no-header .k-grid-header{display:none;height:0;}
/*빨간색 숫자 표시*/
.count{color: #f04e5c;font-size:15px;margin-left:5px;}

/*폰트크기 강제적용*/
.font14 {font-size:14px !important;}
.font13 {font-size:13px !important;}
.font12 {font-size:12px !important;}
.font11 {font-size:11px !important;}
.font14 *{font-size:14px !important;}
.font13 *{font-size:13px !important;}
.font12 *{font-size:12px !important;}
.font11 *{font-size:11px !important;}

/*input,textarea,select*/
.text-wrap{padding:8px 0 8px 0 !important;}
.text-box{width:100%;height:35px; border: solid 1px #eeeeee;color:#444;font-size:13px !important}

/*정렬*/
.text-align-top{vertical-align:top}
.text-center{text-align:center}
.text-left{text-align:left !important; }
.text-right{text-align:right !important; }
.text-center{text-align:center !important;}

/* 그리드의 순서 변경 */
.change-btn {padding:5px 0 !important;}
.change-btn div{margin:0 auto;width:240px}
.change-btn strong{float:none;display:inline;margin-right:2px;font-weight:bold;}
.change-btn button{ width: 60px;height: 30px;border-radius: 4px;background-color: #eeeeee;font-size:12px !important;color:#aaa;float:left;margin:0 5px;}
.change-btn button.bg-color2{color:#444;}
.change-btn span{border-left:1px solid #ddd;font-size:0 !important;float:left;height:10px;width:1px;margin:10px 10px;}
.change-btn button.colr333{color:#444;}

/*박스 밖 버튼*/
.info-btn{clear:both;height:100px;text-align:center;padding-top:10px;}
.info-btn button{min-width:100px;height:40px;border-radius:4px;color:#645b4c;margin:0 3px}
.info-btn button.bg-color2{color:#444; font-weight : bold;}
.info-btn button.bg-color1{color:#fff; font-weight : bold;}
.info-btn.scpr_skpub_inmodal{height:40px;}
.info-btn.scpr_skpub_inmodal.scpr_tightSmall{padding-top:0px;}

/*기본 버튼 사이즈 w,h px 사용*/
.basic-btn{clear:both;height:100px;text-align:center;padding-top:10px;}
.basic-btn button{width:100px;height:40px;border-radius:4px;background-color:#eee;color:#645b4c;margin:0 3px}
.basic-btn button.bg-color2{color:#444;}
.basic-btn button.bg-color1{color:#fff}

/*모달 버튼*/
.modal-btn button{width:100px;border-radius:4px;background-color:#eee;color:#645b4c;margin:0 3px;font-size:12px}
.modal-btn button.bg-color2{color:#444;}
.modal-btn button.bg-color1{color:#fff}


/*그리드 안에 버튼*/
.list-btn button{color:#fff;  height: 30px;border-radius: 4px;font-size:12px;margin:3px 4px;}
.list-btn .bg-color1{color:#fff;}
.list-btn .bg-color2{color:#444;}
.list-btn .disable{opacity:0;}


/*버튼 컬럭*/
button.btn-bg-fff{color:#444;border: solid 1px #eeeeee;background-color: #ffffff;}
button.btn-bg-eee{color:#444; background-color: #eeeeee;}

/* dl 이전글 다음글에 사용했음 */
.dl-list {;}
.dl-list dt{background-color:#fafafa;color:#222;}
.dl-list dt div{border-left:1px solid #eee;border-bottom:1px solid #eee;height:40px;line-height:40px;}
.dl-list dt strong{margin-left:15px;}
.dl-list dd{color:#444444;}
.dl-list dd div{border-right:1px solid #eee;border-left:1px solid #eee;border-bottom:1px solid #eee;height:40px;line-height:40px;}
.dl-list dd a{color:#444444;margin-left:15px;}
.dl-list dd a.no-list{color:#aaaaaa}

/*table 버튼 사이즈 w,h px 사용*/
.table-btn{clear:both;text-align:center;padding-top:0;}
.table-btn button{min-width:100px;border-radius:4px;background-color:#eee;color:#645b4c;margin:0 3px}
.table-btn button.bg-color2{color:#444;}
.table-btn button.bg-color1{color:#fff}

/*공간값*/
.mar-0px{margin:0px !important;}
.mar-t-0px{margin-top:0px !important;}
.mar-b-0px{margin-bottom:0px !important;}
.mar-r-0px{margin-right:0px !important;}
.mar-l-0px{margin-left:0px !important;}
.mar-5px{margin:5px !important;}
.mar-10px{margin:10px !important;}
.mar-15px{margin:15px !important;}
.mar-20px{margin:20px !important;}
.mar-tb-5px{margin:5px 0 !important;}
.mar-rl-5px{margin:0 5px !important;}
.mar-tb-10px{margin:10px 0 !important;}
.mar-rl-10px{margin:0 10px !important;}
.mar-tb-15px{margin:15px 0 !important;}
.mar-rl-15px{margin:0 15px !important;}
.mar-tb-20px{margin:20px 0 !important;}
.mar-rl-20px{margin:0 20px !important;}
.mar-t-0px{margin-top:0 !important;}
.mar-b-0px{margin-bottom:0 !important;}
.mar-r-0px{margin-right:0 !important;}
.mar-l-0px{margin-left:0 !important;}
.mar-t-10px{margin-top:10px !important;}
.mar-b-10px{margin-bottom:10px !important;}
.mar-l-10px{margin-left:10px !important;}
.mar-r-10px{margin-right:10px !important;}
.mar-t-15px{margin-top:15px !important;}
.mar-b-15px{margin-bottom:15px !important;}
.mar-l-15px{margin-left:15px !important;}
.mar-r-15px{margin-right:15px !important;}
.mar-t-20px{margin-top:20px !important;}
.mar-b-20px{margin-bottom:20px !important;}
.mar-l-20px{margin-left:20px !important;}
.mar-r-20px{margin-right:20px !important;}

.pad-0px{padding:0px !important;}
.pad-t-0px{padding-top:0px !important;}
.pad-b-0px{padding-bottom:0px !important;}
.pad-r-0px{padding-right:0px !important;}
.pad-l-0px{padding-left:0px !important;}
.pad-5px{padding:5px !important;}
.pad-10px{padding:10px !important;}
.pad-15px{padding:15px !important;}
.pad-20px{padding:20px !important;}
.pad-tb-5px{padding:5px 0 !important;}
.pad-rl-5px{padding:0 5px !important;}
.pad-tb-10px{padding:10px 0 !important;}
.pad-rl-10px{padding:0 10px !important;}
.pad-tb-15px{padding:15px 0 !important;}
.pad-rl-15px{padding:0 15px !important;}
.pad-tb-20px{padding:20px 0 !important;}
.pad-rl-20px{padding:0 20px !important;}
.pad-t-0px{padding-top:0 !important;}
.pad-b-0px{padding-bottom:0 !important;}
.pad-r-0px{padding-right:0 !important;}
.pad-l-0px{padding-left:0 !important;}
.pad-t-10px{padding-top:10px !important;}
.pad-b-10px{padding-bottom:10px !important;}
.pad-l-10px{padding-left:10px !important;}
.pad-r-10px{padding-right:10px !important;}
.pad-t-15px{padding-top:15px !important;}
.pad-b-15px{padding-bottom:15px !important;}
.pad-l-15px{padding-left:15px !important;}
.pad-r-15px{padding-right:15px !important;}
.pad-t-20px{padding-top:20px !important;}
.pad-b-20px{padding-bottom:20px !important;}
.pad-l-20px{padding-left:20px !important;}
.pad-r-20px{padding-right:20px !important;}

/* table class */
.table-box{margin:0 20px;padding:20px 0;}
.table {width:100%;margin-bottom:20px;border-left:1px solid #e1e1e1;border-top:1px solid #e1e1e1;}
.table th{width:10%;background-color:#f3f3f3;padding:8px 15px;text-align:left;border-bottom:1px solid #e1e1e1;border-right:1px solid #e1e1e1;font-size:14px;color:#222;word-break:keep-all;}
.table td{width:90%;padding:8px 15px;border-bottom:1px solid #e1e1e1;border-right:1px solid #e1e1e1;font-size:14px;color:#444;}
.table-col{width:100%;margin-bottom:20px;}
.table-col th{background-color:#f3f3f3;padding:10px 0;text-align:center;border-bottom:1px solid #e1e1e1;font-size:14px;color:#222}
.table-col td{padding:10px 0;border-bottom:1px solid #e1e1e1;text-align:center;font-size:14px;color:#444;}

.table .w10per{width:10%;float:none}
.table .w15per{width:15%;float:none}
.table .w20per{width:20%;float:none}
.table .w25per{width:25%;float:none}
.table .w30per{width:30%;float:none}
.table .w35per{width:35%;float:none}
.table .w40per{width:40%;float:none}
.table .w45per{width:45%;float:none}
.table .w50per{width:50%;float:none}
.table .w55per{width:55%;float:none}
.table .w60per{width:60%;float:none}
.table .w65per{width:65%;float:none}
.table .w70per{width:70%;float:none}
.table .w75per{width:75%;float:none}
.table .w80per{width:80%;float:none}
.table .w85per{width:85%;float:none}
.table .w90per{width:90%;float:none}
.table .w95per{width:95%;float:none}
.table .w100per{width:100%;float:none}
.table .w23_33per{width:23.33%;float:none}
.bgcolor_eee{background-color:#eee !important;}


.table-form{width:100%;}
.table-form th{font-size:14px;color:#222;width:100px;text-align:left;vertical-align:top;padding-top:18px;}
.table-form th strong{float:left;font-size:14px;}
.table-form td{padding:8px 0;}
.table-form td input{float:left;height: 38px;border-radius: 4px;border: solid 1px #eeeeee;padding:0 15px;font-size:14px;width: -moz-calc(100% - 32px);width: -webkit-calc(100% - 32px);width: -o-calc(100% - 32px);width: calc(100% - 32px);}
.table-form td select{float:left;height: 40px;border-radius: 4px;border: solid 1px #eeeeee;padding:0 15px;font-size:14px;width:100%;}
.table-form td textarea{float:left;height: 135px;border-radius: 4px;border: solid 1px #eeeeee;padding: 15px;font-size:14px;width: -moz-calc(100% - 32px);width: -webkit-calc(100% - 32px);width: -o-calc(100% - 32px);width: calc(100% - 32px);}
.table-form td input.read{float:left; background-color: #f8f8f8;}
.table-form td button{color:#fff;font-size:12px;width:80px;height:40px;border-radius: 4px;padding-left:17px;margin-left:10px}
.table-form td.button input{width: -moz-calc(100% - 122px);width: -webkit-calc(100% - 122px);width: -o-calc(100% - 122px);width: calc(100% - 122px);}
.table-form td.date input{width: -moz-calc(50% - 83px);width: -webkit-calc(50% - 83px);width: -o-calc(50% - 83px);width: calc(50% - 83px);border-radius:4px 0 0 4px}
.table-form td.date button{float:left;width: 40px;height: 40px;border-radius:0 4px 4px 0;border: solid 1px #eeeeee;border-left:0;margin-left:0;padding:0;}
.table-form td.date span,.table-form td.phone span{float:left;font-size:12px;color:#444;text-align:center;width:21px;margin-top:12px;}
.table-form td.phone select{width: -moz-calc(33.33% - 19px);width: -webkit-calc(33.33% - 19px);width: -o-calc(33.33% - 19px);width: calc(33.33% - 19px);}
.table-form td.phone input{width: -moz-calc(33.33% - 44px);width: -webkit-calc(33.33% - 44px);width: -o-calc(33.33% - 44px);width: calc(33.33% - 44px);}
.table-form td.etc input{margin-left:0px;margin-top:15px;}

/* width class */
.w10per{width:10%;float:left;}
.w20per{width:20%;float:left;}
.w30per{width:30%;float:left;}
.w40per{width:40%;float:left;}
.w50per{width:50%;float:left;}
.w60per{width:60%;float:left;}
.w70per{width:70%;float:left;}
.w80per{width:80%;float:left;}
.w90per{width:90%;float:left;}
.w100per{width:100%;float:left;}
.w15per{width:15%;float:left;}
.w25per{width:25%;float:left;}
.w35per{width:35%;float:left;}
.w45per{width:45%;float:left;}
.w55per{width:55%;float:left;}
.w65per{width:65%;float:left;}
.w75per{width:75%;float:left;}
.w85per{width:85%;float:left;}
.w95per{width:95%;float:left;}

.w10px{width:10px}
.w20px{width:20px}
.w30px{width:30px}
.w40px{width:40px}
.w50px{width:50px}
.w60px{width:60px}
.w70px{width:70px}
.w80px{width:80px}
.w90px{width:90px}
.w100px{width:100px}
.w150px{width:150px}
.w200px{width:200px}
.w250px{width:250px}
.w300px{width:300px}
.w350px{width:350px}
.w400px{width:400px}
.w450px{width:450px}
.w500px{width:500px}
.w550px{width:550px}
.w600px{width:600px}
.w650px{width:650px}
.w700px{width:700px}
.w750px{width:750px}
.w800px{width:800px}
.w850px{width:850px}
.w900px{width:900px}
.w950px{width:950px}

/* height class */
.h10per{height:10%}
.h20per{height:20%}
.h30per{height:30%}
.h40per{height:40%}
.h50per{height:50%}
.h60per{height:60%}
.h70per{height:70%}
.h80per{height:80%}
.h90per{height:90%}
.h100per{/* height:100% */}
.h15per{height:15%}
.h25per{height:25%}
.h35per{height:35%}
.h45per{height:45%}
.h55per{height:55%}
.h65per{height:65%}
.h75per{height:75%}
.h85per{height:85%}
.h95per{height:95%}

.h10px{height:10px}
.h20px{height:20px}
.h30px{height:30px}
.h40px{height:40px}
.h50px{height:50px}
.h60px{height:60px}
.h70px{height:70px}
.h80px{height:80px}
.h90px{height:90px}
.h100px{height:100px}
.h110px{height:110px}
.h120px{height:120px}
.h130px{height:130px}
.h140px{height:140px}
.h150px{height:150px}
.h160px{height:160px}
.h170px{height:170px}
.h180px{height:180px}
.h190px{height:190px}
.h200px{height:200px}
.h250px{height:250px}
.h300px{height:300px}
.h350px{height:350px}
.h400px{height:400px}
.h450px{height:450px}
.h500px{height:500px}
.h550px{height:550px}
.h600px{height:600px}
.h650px{height:650px}
.h700px{height:700px}
.h750px{height:750px}
.h800px{height:800px}
.h850px{height:850px}
.h900px{height:900px}
.h950px{height:950px}

.manage_list{margin:0 0 30px;overflow:hidden;}
.manage_list table{margin-left:-1px;border-top:2px solid #545454;}
.manage_list table .tunnel {border-left:none;}
.manage_list thead th{padding:8px 8px;color:#333;font-size:14px;text-align:center;letter-spacing:-1px;background:#E7E6FF;border-bottom:1px solid #D5D2FF;border-left:1px solid #D5D2FF;font-weight:normal;line-height:18px;}
.manage_list thead .line1{border-bottom:1px solid #e1e1e1;}
.manage_list tbody th{text-align:left; font-size:14px; padding:10px 6px;color:#333;font-weight:normal;border-bottom:1px solid #e1e1e1; border-left:1px solid #e1e1e1;line-height:18px;}
.manage_list tbody td{font-size:14px; padding:8px 6px;color:#666;text-align:left;border-bottom:1px solid #e1e1e1; border-left:1px solid #e1e1e1;line-height:24px; }
.manage_list td.num{text-align:right;}
.manage_list .cen{text-align:center;}
.manage_list .right{text-align:right;}
.manage_list .font1{font-size:14px;}
.manage_list .filebg{background-color:#fff;}
.manage_list .filebg td, .manage_list .filebg th{ padding:6px 5px 6px 3px; text-align:center;}
.manage_list td.top{padding-top:10px;vertical-align:top;text-align:center; }
.manage_list tfoot th{ padding:8px 10px 4px 8px;color:#333;font-size:1.12em;font-weight:normal;border-bottom:1px solid #e1e1e1;text-align:left;}
.manage_list tfoot td{font-size:1.12em; padding:8px 10px 4px 8px;color:#333;text-align:left;border-bottom:1px solid #e1e1e1; border-left:1px solid #e1e1e1; }
.manage_list .icon{padding-right:0;}
.manage_list .iconwon{padding-left:0px; text-align:center; border-left:0;}
.manage_list.in_tooltip .tooltip .help{background-position:right 50%;}
.manage_list tbody th .help{color:#333;}
.manage_list thead th .help{color:#333;}
.manage_list.in_tooltip{overflow:visible;}
.manage_list.in_tooltip:after{display:inline-block;clear:both;content:"";}
.manage_list.in_tooltip .bl0{border-left:0;}
.manage_list tbody .help:hover{color:#666;}

.manage_list table, th, td {
    word-break: normal;
    font-size: 14px;
}


.manage_list th {
    display: table-cell;
    vertical-align: inherit;
    font-weight: bold;
    text-align: -internal-center;
}
.manage_list table {
    width: 100%;
    border-collapse: collapse;
    table-layout:fixed;
}

.list_typeA {
    margin: 0 0 15px;
    padding: 0px;
    color: #092a87;
    font-size: 1.300em;
    font-weight: bold;
}

/* highcharts credits 숨김처리 */
.highcharts-credits {
display: none !important;
}


/* 
	scpr 원정인 
	진행상태 표시 -- 프로세스 스텝 page 
	
	현재 스텝이 '마' 일경우
	ex) 가 나 다 라 '마' 바 사
	가~라는 지난것이 되고 
	마는 현재것이 된다.
	바~사는 기본값.
	
    지난것 stepped
	현재것 stepActive
	
	<div class="contract_wrap edgedArrowVersion">
		<div class="contract_conBox">
			<div class="contract_step">
				<div class="step_item step1 stepped"><span>점검입력</span></div>
				<div class="step_item step2 stepped"><span>점검승인</span></div>
				<div class="step_item step3 stepped"><span>개선계획입력</span></div>
				<div class="step_item step4 stepped"><span>개선계획승인</span></div>
				<div class="step_item step5 stepped"><span>개선결과입력</span></div>
				<div class="step_item step6 stepped"><span>개선결과승인</span></div>
				<div class="step_item step7 stepActive"><span>완료</span></div>					
			</div>
		</div>
	</div>
	
*/
.contract_wrap{padding: 10px 5px 10px 5px;}
.contract_wrap .contract_conBox{}
.contract_wrap .contract_conBox .contract_step { display: flex; justify-content: space-around; padding:0 0%; position: relative;}
.contract_wrap .contract_conBox .contract_step .step_item {flex:1 1; display:flex; flex-direction:column;  margin:0 0%;position:relative; }
.contract_wrap .contract_conBox .contract_step .step_item * { align-self: center; }
.contract_wrap .contract_conBox .contract_step .step_item > span { border:1px solid #aea9f1;width:calc(100% - 20px);background: white;display:block;margin:3px 0 4px 0; padding:8px 7px 9px 6px; color:#fff; border-radius:0px;font-size:14px;color:#222;}
.contract_wrap .contract_conBox .contract_step .step_item > ul li { margin: 0; padding:0;} 
.contract_wrap .contract_conBox .contract_step .step_item span{width:100%;text-align:center;font-family: "NotoKrR";}
.contract_wrap .contract_conBox .contract_step .step_item.stepped span{background-color:#aea9f1;color:white;}
.contract_wrap .contract_conBox .contract_step .step_item.stepActive span{background-color:#d92b71;color:white;border:1px solid #d92b71;}
.contract_wrap .contract_conBox .contract_step .step1{z-index:10;}
.contract_wrap .contract_conBox .contract_step .step2{z-index:9;}
.contract_wrap .contract_conBox .contract_step .step3{z-index:8;}
.contract_wrap .contract_conBox .contract_step .step4{z-index:7;}
.contract_wrap .contract_conBox .contract_step .step5{z-index:6;}
.contract_wrap .contract_conBox .contract_step .step6{z-index:5;}
.contract_wrap .contract_conBox .contract_step .step7{z-index:4;}
.contract_wrap .contract_conBox .contract_step .step8{z-index:3;}
.contract_wrap .contract_conBox .contract_step .step9{z-index:2;}
.contract_wrap .contract_conBox .contract_step .step10{z-index:1;}
.contract_wrap .contract_conBox .contract_step .step_item > span{border-right: 0px;text-indent:30px;}
.contract_wrap .contract_conBox .contract_step .step_item.step1 > span{border-radius: 10px 0 0 10px;}
.contract_wrap .contract_conBox .contract_step .step_item.step10 > span{border-right:1px solid #aea9f1;border-radius: 0 10px 10px 0;}
.contract_wrap .contract_conBox .contract_step .step_item:after{position:absolute;right:-21px;top:8px;content:'';width:26px;height:28px;background-color:#fff;transform:rotate(45deg);border-top:1px solid #aea9f1;border-right:1px solid #aea9f1;border-radius:0 1px 0 0}
.contract_wrap .contract_conBox .contract_step .step_item.step1.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step2.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step3.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step4.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step5.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step6.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step7.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step8.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step9.stepped:after,
.contract_wrap .contract_conBox .contract_step .step_item.step10.stepped:after
{background-color:#aea9f1;border-top:1px solid #d5d2ff;border-right:1px solid #d5d2ff;}
.contract_wrap .contract_conBox .contract_step .step_item.step1.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step2.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step3.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step4.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step5.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step6.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step7.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step8.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step9.stepActive:after,
.contract_wrap .contract_conBox .contract_step .step_item.step10.stepActive:after{background-color:#d92b71;}
.contract_wrap .contract_conBox .contract_step .step_item.step10:after{display:none;}

.contract_wrap.multirow .contract_conBox .contract_step .step_item:after {
  position: absolute;
  right: -18px;
  top: 20px;
  content: "";
  width: 20px;
  height: 20px;
  background-color: #fff;
  transform: rotate(45deg);
  border-top: 1px solid #aea9f1;
  border-right: 1px solid #aea9f1;
  border-radius: 0 1px 0 0;
}
.contract_wrap.multirow .contract_conBox .contract_step .step_item span {
  display: inline-block;
  height: 40px;
  border-right: 1px solid #d5d2ff;
}
.contract_wrap.multirow .contract_conBox .contract_step .step_item > span {
  text-indent: 10px;
  text-align: center;
  font-size: 14px;
  /* padding: 0px 10px; */
  margin: 0 10px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;  
}

/* scpr_skpub 원정인  파일 첨부 아이콘 변경*/
.secufy-list .material-icons.fileattach{font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; display: inline-block; position: relative; width: 24px; height: 24px; font-size: 24px;right:auto;top:auto;left:auto;bottom:auto; opacity:.9}
.secufy-list .material-icons.fileattach:last-child { right: auto; }
.secufy-list .material-icons.fileattach:first-child { right: auto; }

/* 20250724 step 신규 start */
.process_wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  width: 100%;
  padding: 10px 5px 10px 5px;
  /* gap: 2px; */
}
.process_item {
  flex: 1 1;
  text-align: center;
  padding: 10px 15px 12px 10px;
  font-size: 14px;
  color: #000000;
  border-radius: 5px;
  background: #e1e1e1 url("../images/processbg.png") no-repeat right center;
} 
.process_item.done {
  /* background-color: #aea9f1; */
  border: none;
  color: #ffffff;
  background: #aea9f1 url("../images/processDonebg.png") no-repeat right center;
}
.process_item.active {
  border: none;
  color: #ffffff;
  background: #d92b71 url("../images/processActbg.png") no-repeat right center;
}
.process_item.end {
  background-image: none;
}
/* 20250724 step 신규 end */