@CHARSET "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
/* 로그인 */
body {
	font-family: 'Noto Sans Khmer UI', 'sans-serif';
}



#radioWrap {
	height: 30px;
	text-align: center;
}

#radioWrap span {
	margin: 0 6px;
}

#radioWrap span input {
	margin-left: 3px;
}

li{
	list-style: none;
}


body {
	padding-top: 50px;
}

.sub-header {
	padding-bottom: 10px;
	font-size:20px !important;
}

.navbar-brand {
	color: #fff !important;
}

.navbar {
	background: #e65e31
}

.navbar ul li a {
	color: #fff !important;
}

.navbar-fixed-top {
	border: 0;
}


.sidebar {
	display: none;
}

@media ( min-width : 768px) {
	.sidebar {
		position: fixed;
		top: 51px;
		bottom: 0;
		left: 0;
		z-index: 1000;
		display: block;
		padding: 20px;
		overflow-x: hidden;
		overflow-y: auto;
		/* Scrollable contents if viewport is shorter than content. */
		background-color: #f5f5f5;
		border-right: 1px solid #eee;
	}
}

/* Sidebar navigation */
.nav-sidebar {
	margin-right: -21px; /* 20px padding + 1px border */
	margin-bottom: 20px;
	margin-left: -20px;
}

.nav-sidebar>li>a {
	padding-right: 20px;
	padding-left: 20px;
	color: #e65e31;
}

.nav-sidebar>.active>a, .nav-sidebar>.active>a:hover, .nav-sidebar>.active>a:focus
	{
	color: #fff;
	background-color: #e65e31;
}

/*
 * Main content
 */
.main {
	padding: 20px;
}

@media ( min-width : 768px) {
	.main {
		padding-right: 40px;
		padding-left: 40px;
	}
}

.main .page-header {
	margin-top: 0;
}

/*
 * Placeholder dashboard ideas
 */
.placeholders {
	margin-bottom: 30px;
	text-align: center;
}

.placeholders h4 {
	margin-bottom: 0;
}

.placeholder {
	margin-bottom: 20px;
}

.placeholder img {
	display: inline-block;
	border-radius: 50%;
}

.arpayoBtn {
	background: #e65e31;
	border: 0;
	margin-left: 15px;
	cursor: pointer;
}

.arpayoBtn:hover {
	background: #fe6836;
}

.arpayoBtn:focus {
	background: #e65e31;
}

.arpayoBtn:active {
	background: #e65e31 !important;
}

#pickerWrap {
	width: 100%;
	margin-top: -50px;
	margin-bottom: 40px;
}

#pickerWrap span {
	margin: 0 15px;
	float: right;
}

#pickerWrap:after {
	content: '';
	display: block;
	clear: both;
}

.depositBox {
	background: #ccc;
	color: #fff;
	font-size: 11px;
	border-radius: 3px;
	display: inline-block;
	width: 35px;
	padding: 5px 0;
	vertical-align: middle;
	text-align: center;
}

.depositBox.accept {
	background: #2e2eff;
}

.depositBox.refund {
	background: #e01010;
}

#sortList {
	float: right;
}

#sortList li {
	float: left;
	list-style: none;
	padding: 0 10px;
}

#sortList li label {
	margin-right: 5px;
}

#datepicker1 {
	width: 100px;
}

#datepicker2 {
	width: 100px;
}

#allPay,#paymentPay {
	
	font-size: 16px;
	font-weight: bold;
	margin-right: 15px;
}
#payList{

	text-align:right;
}

#ui-datepicker-div{
	top: 70px !important;
	
}

.sub-header {
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}

.navbar-brand {
	color: #fff !important;
}

.navbar {
	background: #e65e31
}

.navbar ul li a {
	color: #fff !important;
}
/*
 * Top navigation
 * Hide default border to remove 1px line.
 */
.navbar-fixed-top {
	border: 0;
}

/*
 * Sidebar
 */

/* Hide for mobile, show later */
.sidebar {
	display: none;
}

@media ( min-width : 768px) {
	.sidebar {
		position: fixed;
		top: 51px;
		bottom: 0;
		left: 0;
		z-index: 1000;
		display: block;
		padding: 20px;
		overflow-x: hidden;
		overflow-y: auto;
		/* Scrollable contents if viewport is shorter than content. */
		background-color: #f5f5f5;
		border-right: 1px solid #eee;
	}
}

/* Sidebar navigation */
.nav-sidebar {
	margin-right: -21px; /* 20px padding + 1px border */
	margin-bottom: 20px;
	margin-left: -20px;
}

.nav-sidebar>li>a {
	padding-right: 20px;
	padding-left: 20px;
	color: #e65e31;
}

.nav-sidebar>.active>a, .nav-sidebar>.active>a:hover, .nav-sidebar>.active>a:focus
	{
	color: #fff;
	background-color: #e65e31;
}

/*
 * Main content
 */
.main {
	padding: 20px;
}

@media ( min-width : 768px) {
	.main {
		padding-right: 40px;
		padding-left: 40px;
	}
}

.main .page-header {
	margin-top: 0;
}

/*
 * Placeholder dashboard ideas
 */
.placeholders {
	margin-bottom: 30px;
	text-align: center;
}

.placeholders h4 {
	margin-bottom: 0;
}

.placeholder {
	margin-bottom: 20px;
}

.placeholder img {
	display: inline-block;
	border-radius: 50%;
}

.arpayoBtn {
	background: #e65e31;
	border: 0;
	margin-left: 15px;
	cursor: pointer;
}

.arpayoBtn:hover {
	background: #fe6836;
}

.arpayoBtn:focus {
	background: #e65e31;
}

.arpayoBtn:active {
	background: #e65e31 !important;
}

.table-responsive form {
	margin: 0 auto;
}

.form-control {
	position: relative;
	width: 300px;
	height: 35px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px;
	padding: 5px;
	font-size: 16px;
}

.form-signin .form-control:focus {
	z-index: 2;
}

.infoContent {
	width: 50%;
	min-width: 450px;
	margin: 0 auto;
	text-align: center;
}

 #modifyTable {
	margin: 0 auto;
	margin-top: 30px;
	text-align:left;
}

.infoContent table tr td {
	padding: 15px 0;
	height: 50px;
}

.phone-control {
	float: left;
	width: 79px !important;
}

#phoneTd span {
	float: left;
	margin: 0 12px;
	margin-top: 6px;
}

.nickName {
	width: 200px;
	float: left;
}

.checkNickName  {
	margin-top: 2px;
	color: #fff;
	float: right;
}
.checkId,.newMber{
	margin-top: 2px;
	color: #fff;
	float: right;
}

.modifyBtn {
	margin-top: 30px;
	width: 150px;
	height: 50px;
	color: #fff;
	font-size: 16px;
}


.sub-header {
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}

.navbar-brand {
	color: #fff !important;
}

.navbar {
	background: #e65e31
}

.navbar ul li a {
	color: #fff !important;
}
/*
 * Top navigation
 * Hide default border to remove 1px line.
 */
.navbar-fixed-top {
	border: 0;
}

/*
 * Sidebar
 */

/* Hide for mobile, show later */
.sidebar {
	display: none;
}

@media ( min-width : 768px) {
	.sidebar {
		position: fixed;
		top: 51px;
		bottom: 0;
		left: 0;
		z-index: 1000;
		display: block;
		padding: 20px;
		overflow-x: hidden;
		overflow-y: auto;
		/* Scrollable contents if viewport is shorter than content. */
		background-color: #f5f5f5;
		border-right: 1px solid #eee;
	}
}

/* Sidebar navigation */
.nav-sidebar {
	margin-right: -21px; /* 20px padding + 1px border */
	margin-bottom: 20px;
	margin-left: -20px;
}

.nav-sidebar>li>a {
	padding-right: 20px;
	padding-left: 20px;
	color: #e65e31;
}

.nav-sidebar>.active>a, .nav-sidebar>.active>a:hover, .nav-sidebar>.active>a:focus
	{
	color: #fff;
	background-color: #e65e31;
}

/*
 * Main content
 */
.main {
	padding: 20px;
}

@media ( min-width : 768px) {
	.main {
		padding-right: 40px;
		padding-left: 40px;
	}
}

.main .page-header {
	margin-top: 0;
}

/*
 * Placeholder dashboard ideas
 */
.placeholders {
	margin-bottom: 30px;
	text-align: center;
}

.placeholders h4 {
	margin-bottom: 0;
}

.placeholder {
	margin-bottom: 20px;
}

.placeholder img {
	display: inline-block;
	border-radius: 50%;
}

.arpayoBtn {
	background: #e65e31;
	border: 0;
	margin-left: 15px;
	cursor: pointer;
}

.arpayoBtn:hover {
	background: #fe6836;
}

.arpayoBtn:focus {
	background: #e65e31;
}

.arpayoBtn:active {
	background: #e65e31 !important;
}

.table-responsive form {
	margin: 0 auto;
}

.form-control {
	position: relative;
	width: 300px;
	height: 35px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px;
	padding: 5px;
	font-size: 16px;
}

.form-signin .form-control:focus {
	z-index: 2;
}

.infoContent {
	width: 50%;
	min-width: 450px;
	margin: 0 auto;
	text-align: center;
}

.infoContent #modifyTable {
	margin: 0 auto;
	margin-top: 30px;
}

.infoContent table tr td {
	padding: 15px 0;
	height: 50px;
}

#phoneTd .phone-control {
	float: left;
	width: 80px;
}

#phoneTd span {
	float: left;
	margin: 0 12px;
	margin-top: 6px;
}

.nickName {
	width: 200px;
	float: left;
}

.checkNickName {
	margin-top: 2px;
	color: #fff;
	float: right;
}

.modifyBtn {
	margin-top: 30px;
	width: 150px;
	height: 50px;
	color: #fff;
	font-size: 16px;
}

textarea {
	width: 300px;
	height: 150px;
}


.sub-header {
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}

.navbar-brand {
	color: #fff !important;
}

.navbar {
	background: #e65e31
}

.navbar ul li a {
	color: #fff !important;
}
/*
 * Top navigation
 * Hide default border to remove 1px line.
 */
.navbar-fixed-top {
	border: 0;
}

/*
 * Sidebar
 */

/* Hide for mobile, show later */
.sidebar {
	display: none;
}

@media ( min-width : 768px) {
	.sidebar {
		position: fixed;
		top: 51px;
		bottom: 0;
		left: 0;
		z-index: 1000;
		display: block;
		padding: 20px;
		overflow-x: hidden;
		overflow-y: auto;
		/* Scrollable contents if viewport is shorter than content. */
		background-color: #f5f5f5;
		border-right: 1px solid #eee;
	}
}

/* Sidebar navigation */
.nav-sidebar {
	margin-right: -21px; /* 20px padding + 1px border */
	margin-bottom: 20px;
	margin-left: -20px;
}

.nav-sidebar>li>a {
	padding-right: 20px;
	padding-left: 20px;
	color: #e65e31;
}

.nav-sidebar>.active>a, .nav-sidebar>.active>a:hover, .nav-sidebar>.active>a:focus
	{
	color: #fff;
	background-color: #e65e31;
}

/*
 * Main content
 */
.main {
	padding: 20px;
}

@media ( min-width : 768px) {
	.main {
		padding-right: 40px;
		padding-left: 40px;
	}
}

.main .page-header {
	margin-top: 0;
}

/*
 * Placeholder dashboard ideas
 */
.placeholders {
	margin-bottom: 30px;
	text-align: center;
}

.placeholders h4 {
	margin-bottom: 0;
}

.placeholder {
	margin-bottom: 20px;
}

.placeholder img {
	display: inline-block;
	border-radius: 50%;
}

.arpayoBtn {
	background: #e65e31;
	border: 0;
	margin-left: 15px;
	cursor: pointer;
}

.arpayoBtn:hover {
	background: #fe6836;
}

.arpayoBtn:focus {
	background: #e65e31;
}

.arpayoBtn:active {
	background: #e65e31 !important;
}

.delBtn {
	color: #fff;
	font-size: 13px;
}

a {
	color: #000;
}

#cover{
   display:none;
}

#cover2{
   	display:block;
}
#cover2 h1{
	text-align:center;
}
@media only screen and (min-width: 700px) {
	
  #cover{
    display: block;
  }
  #cover2{
  	display : none;
  }
}
 @media only screen and (max-width: 700px)
 {
 	.infoContent #modifyTable
	{
		margin-left:-5px;
		
	}
 	
 }
@media only screen and (min-device-width: 320px) and (orientation: landscape) {
  #cover{
    display: block;
  }
  #cover2{
    display: none;
  }
}
.modalList{width:100%; margin-left:30%;}
.modalList li{font-size:16px; padding:5px 0;}
.sidebar{display:none;}
.clearFix:after{ content:''; clear:both; display:block;}
#selectWrap{overflow: hidden;width:100%; margin-bottom: 50px}
#selectWrap ul {display:table;width:fit-content;margin:0 auto;}
#selectWrap ul li {padding:0 5px;display:inline-block;vertical-align:middle}

/* 2021년 4월 알파요 리뉴얼 css */

/* css초기화 */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;	
	font-family: 'Noto Sans KR', sans-serif;
	vertical-align: baseline;	
	
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, hgroup, menu, nav, section {
	display: block;
}
body {
	position:relative;
	width:100%;
	height:100%;
	line-height: 1;	
	-ms-overflow-style: none; /* IE 스크롤 안 보이게*/
}

body::-webkit-scrollbar { 
    display: none !important; 
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a {text-decoration:none!important}

nav {display:none}

strong {font-weight:700}

.homeFrame {position:relative;min-height: calc(100vh - 458px);padding-top:30px}

/* 엑셀다운로드 출퇴근시간수정 */
.webtoon {width:1200px;height:auto;margin:0 auto;padding:66px 0;border-bottom:none;background:url('../../../../images/wooriyo/com/frame/1/1/bg_subtitle.png') right top no-repeat;}
.webtoon_box {border-bottom:none!important;background-color:#FFE51E}
.webtoon ul {padding-top:0}
.webtoon .engTitle {font-size:17px;color:#000}
.webtoon .korTitle {margin-bottom:5px;font-weight:600;font-size:38px;color:#000}
.webtoon .pageInfo {font-size:21px;color:#000}

table.dataTable {border-top:2px solid #ccc}
#payList {width:1200px;margin-top:20px;border-top:none;border-bottom: 1px solid #BEBEBE}
.btn_lookUp {width:137px;padding: 9px 16px 9.5px 16px;border:none;color:#fff;background: #FA6900;
  /* Old browsers */
  background: -moz-linear-gradient(left, #FC7300 0%, #F24300 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #FC7300 0%, #F24300 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to left, #F24300 0%, #FC7300 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FC7300', endColorstr='#F24300', GradientType=1);
  /* IE6-9 */
}

_:-ms-fullscreen, :root .btn_lookUp {padding:15px 16px}

#modBtn {border-radius:50px;padding:6px 15px 8px;border:none;}
#excelMenuWrap ul {margin-bottom:45px;}
#selectmod {display:block;width:fit-content;height:38px;margin:0 auto 28px;}
#selectmod ul {display:flex;width:fit-content}
_:-ms-fullscreen, :root #selectmod {width: 340px;}
_:-ms-fullscreen, :root #selectmod ul {display: flex; width: 340px;}

#selectmod label {font-size:22px;font-weight:400;}
#selectmod ul li {padding:0 20px 0 0}
#selectmod ul li select, #selectWrap ul li select {min-width:100px;height:auto;padding: 12px 30px 14px 15px;border-radius:6px;border:1px solid #ccc;background-color:#fff;-webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; background: url('../../../../images/wooriyo/com/frame/1/1/btn_select.svg') no-repeat 89% 50%; /* 화살표 모양의 이미지 */}  
#selectmod ul li input[type='radio'] {display:none}
#selectmod ul li input[type='radio'] + label {
    display: inline-block; vertical-align: middle; background-size: cover;
	background:url('../../../../images/wooriyo/com/frame/1/1/btn_radio.svg') no-repeat left top;
	cursor:pointer;	width:156px;	height:28px;padding-left:40px}

#selectmod ul li input[type='radio']:checked + label {
	background:url('../../../../images/wooriyo/com/frame/1/1/btn_radio_checked.svg') no-repeat;}    
#selectWrap ul li select::-ms-expand {display:none}  
#payList_wrapper {position:relative;margin-top:-10px}

#selectWrap ul li select#storeSelect{width:176px}
#selectWrap ul li select#yearSelect{width:176px}
#selectWrap ul li select#monthSelect{width:176px}
#selectWrap ul li select#empSelect{width:176px}
#selectWrap ul li:last-child { padding: 0; padding-left: 8px;}
.btn-group, .btn-group-vertical {display: block !important; margin-bottom: 60px}

#excelWrap{width:1200px; margin:0 auto;}
#excelMenuWrap{width:100%; padding-top:90px;}
#excelMenuWrap ul{width:100%;display:flex}
#excelMenuWrap ul li{display:inline-block;width:50%;list-style:none;margin:0;}
#excelMenuWrap ul li a {display:block;width:100%;font-size:22px;padding:28px 0;background-color:#F9F7F4;text-align:center;font-weight:500;}
#excelMenuWrap ul li a:hover {background:#FFE51E}
#excelMenuWrap ul li a.check {color:#fff!important;background:#FA6900;}

#payList {margin-top:10px;}
#payList th{height:69px; vertical-align: middle; background:#F4F0EA; text-align: center !important;font-weight:400;font-size:18px}
#payList th:first-child {border-top-left-radius: 14px;}
#payList th:last-child{border-top-right-radius: 14px;}
#payList tr td{height:74px; vertical-align: middle; text-align: center; border-bottom: 1px dashed #DFDFDF;font-size:18px}
#payList td:last-child{border-right:0;}
#payList td.title{background:#F8F8F8; text-align: left;}
#payList tr:last-child td {border-bottom:0}

#payList_filter {display:none !important;}
div.dataTables_wrapper div.dataTables_paginate { margin: 0; white-space: nowrap; text-align: center!important;}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
	color: #515151;cursor: pointer;border:1px solid #FFE92D; background-color: #FFE92D;}
	
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {    
    border-color:1px solid #FFE92D;}
    
@media (max-width: 1000px) {
	.buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited{
		position:absolute!important;
		top:-97.5px;
		width:224px;
		background-color:#55A666!important;
	}
	_:-ms-fullscreen, :root .buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited {
		top:-106.5px;
		padding:14.5px 0 14.5px 15px!important;
		border:none!important;
		background-color:#55A666;
	}
}
@media (min-width: 1001px) {
	.buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited{position:absolute!important;top:-97.5px;width:224px;background:url('../../../../images/wooriyo/com/frame/1/1/icon_excel.svg')35px 10px no-repeat ,#55A666!important;}
	_:-ms-fullscreen, :root .buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited {top:-106.5px;padding:14.5px 0 14.5px 15px!important;border:none!important;background:url('../../../../images/wooriyo/com/frame/1/1/icon_excel.svg')35px 16px no-repeat ,#55A666;}
}

/* .buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited{position:absolute!important;top:-97.5px;width:224px;background:url('../../../../images/wooriyo/com/frame/1/1/icon_excel.svg')35px 10px no-repeat ,#55A666!important} */
/* _:-ms-fullscreen, :root .buttons-excel, .buttons-excel:hover, .buttons-excel:active, .buttons-excel:visited {top:-106.5px;padding:14.5px 0 14.5px 15px!important;border:none!important;background:url('../../../../images/wooriyo/com/frame/1/1/icon_excel.svg')35px 16px no-repeat ,#55A666} */

div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin: 70px 0 0!important;}
table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting {
    padding-right: 0!important;}
    
table.dataTable thead .sorting_asc:after {content: ""!important;}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    position: absolute; bottom: 8px; right: 8px; display: block; font-family: 'Glyphicons Halflings';
    opacity: 0.5;}  
table.dataTable thead .sorting:after {content: ""!important;} 
table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled {
    cursor: default!important;} 
table.dataTable thead .sorting_desc:after {content: ""!important;}   
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {    
    border-color: #DFDFDF;}  
.pagination > li:first-child > a, .pagination > li:first-child > span, .pagination > li:last-child > a, .pagination > li:last-child > span {
	width:35px;
	height:36px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;    
    font-size: 0!important;    
}  
_:-ms-fullscreen, :root .pagination > li:first-child > a,_:-ms-fullscreen, :root .pagination > li:first-child > span,_:-ms-fullscreen, :root .pagination > li:last-child > a,_:-ms-fullscreen, :root .pagination > li:last-child > span {
	width:35px;
	height:38px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;    
    font-size: 0!important;    
} 
.pagination > li:first-child > a {background:url('../../../../images/wooriyo/com/frame/1/1/btn_paging_left.svg') 11px 11.5px no-repeat;}
.pagination > li:last-child > a {background:url('../../../../images/wooriyo/com/frame/1/1/btn_paging_right.svg') 13px 11.5px no-repeat;}