



/* Subcontent */
#Subcontent{width:100%;overflow:hidden;background:#fff; min-height:1000px; font-size:18px; position:relative  }
#Subcontent > h2{font-size:48px; font-weight:700;  text-align:center }
#Subcontent h3{font-size:36px; font-weight:700;  text-align:center; margin-bottom:30px }
#Subcontent > div.SubTOP{background:#f2f2f2;padding:40px;position:relative !important;  margin-bottom:0}
#Subcontent > div.SubTOP > div{ max-width:1800px; width:100%; margin:0 auto;font-size:16px; position:relative;}
#Subcontent > div.SubTOP > div.TopBtn{overflow:hidden;  }
#Subcontent > div.SubTOP > div.TopBtn > ul{display:flex; float:right }
#Subcontent > div.SubTOP > div.TopBtn > ul > li{margin-right:5px;}
#Subcontent > div.SubTOP > div.TopBtn > ul > li:last-child{margin-right:0px;}
#Subcontent > div.SubTOP > div.TopBtn > ul > li > a{display:block; padding:10px 20px 10px 50px; }
#Subcontent > div.SubTOP > div.TopBtn > ul > li > a.excell{ background:#ccc url('/images/ico_download.png') no-repeat 20px 10px; color:#0c2a58 }
#Subcontent > div.SubTOP > div.TopBtn > ul > li > a.print{ background:#0c2a58 url('/images/ico_print.png') no-repeat 20px 10px; color:#fff }
#Subcontent > div.SubTOP > div.TopBtn > ul > li > a.regist{ background:#f4bd34 url('/images/sendMail.png') no-repeat 10px 10px; color:#000 }
#Subcontent > div.SubTOP > div.Calendar{}
#Subcontent > div.SubTOP > div.Calendar > dl{display:flex; justify-content:center; font-size:18px}
#Subcontent > div.SubTOP > div.Calendar > dl > dt{color:#fff; background:#333; font-weight:500;padding:15px 20px}
#Subcontent > div.SubTOP > div.Calendar > dl > dd{background:#fff; border:1px solid #ccc}
#Subcontent > div.SubTOP > div.Calendar > dl > dd > ul{display:flex; height:100%}
#Subcontent > div.SubTOP > div.Calendar > dl > dd > ul > li{ padding:10px;height:100%}
#Subcontent > div.SubTOP > div.Calendar > dl > dd > ul > li:first-child {border-right:1px solid #ccc}
#Subcontent > div.SubTOP > div.Calendar > dl > dd > ul select{border:0; width:200px; height:30px; text-align:center; font-size:16px}
#Subcontent > div.SubTOP > div.unitMonth{padding-bottom:10px;font-size:20px; font-weight:500; text-align:left; position:absolute; bottom:0; left:50px; }

#Subcontent > div.SubIn_01{ max-width:1800px;margin:0 auto;font-size:16px; padding-bottom:40px  }

#Subcontent > div.SubIn_01 ul > li > dl{display:flex; margin-bottom:10px; width:100%; overflow-x: scroll;}
#Subcontent > div.SubIn_01 ul > li > dl > dt{background:#eee; border:1px solid #3462a9; display:flex; width:150px; justify-content:center; align-items:center; font-size:20px; color:#003366; font-weight:500; text-align:center; }
#Subcontent > div.SubIn_01 ul > li > dl > dd{background:#fff; border:1px solid #ccc; width:calc(100% - 150px); padding:5px 20px }
#Subcontent > div.SubIn_01 ul > li > dl > dd > ul{display:flex; width:100%; text-align:center;}
#Subcontent > div.SubIn_01 ul > li > dl > dd > ul > li{padding:10px}
#Subcontent > div.SubIn_01 ul > li > dl > dd > ul > li > p.att_tilte{font-weight:500; margin-bottom:5px; color:#0c2a58;font-size:18px; }
#Subcontent > div.SubIn_01 ul > li > dl > dd > ul > li input[type=text]{width:60px; height:35px; border:1px solid #ccc; text-align:center; font-size:18px; font-weight:500; margin-right:5px}
#Subcontent > div.SubIn_01 ul > li > dl > dd > ul > li input[type=text].price{width:115px; }
#Subcontent > div.SubIn_02{ width:100%; background:#f2f2f2;font-size:16px; padding-bottom:40px  }
#Subcontent > div.SubIn_02 div.spec{ width:1300px; background:#fff; border:1px solid #ccc; padding:70px 30px; margin:0 auto;box-shadow : 2px 2px 2px #ccc;  }
#Subcontent > div.SubIn_02 div.spec > ul{ width:100%;display:flex; flex-wrap:wrap  }
#Subcontent > div.SubIn_02 div.spec > ul > li{margin:10px 5px; width:calc(16.6% - 10px);border:1px solid #283b82 }
#Subcontent > div.SubIn_02 div.spec > ul > li > div{width:100%; height:200px; background:#dce5f6; text-align:center; font-weight:700; color:#283b82; font-size:25px; display:flex; align-items:center; justify-content:center }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul{ width:100%;display:flex;  }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul > li{  text-align:center;   }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul > li:nth-child(1){ display:flex; align-items:center; justify-content:center; width:30%; }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul > li:nth-child(2){  width:70%; }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul > li > a{ display:block; color:#fff;background:#283b82 url('/images/ico_spec.png') no-repeat 15px 5px;  padding:10px 0px 10px 30px; }
#Subcontent > div.SubIn_02 div.spec > ul > li > ul > li input{margin-right:5px }
div.spec h4 {font-size:24px;font-weight:500; margin-bottom:10px}
div.spec table {width:100%; font-size:18px; margin-bottom:50px}
div.spec table td{padding:20px; border:1px solid #ccc; }
div.spec table th{padding:20px; border:1px solid #ccc; font-weight:normal}
div.spec table th.thTop{background:#999 !important}
div.spec table.spec_01 th{background:#fce8e8}
div.spec table.spec_02 th{background:#e8f4fc}
div.spec table.spec_03 th{background:#eeeeee}
div.spec table.spec_03 td.auto_calc{background:#f1f1f1}
div.spec table.spec_03 td.auto_calc > input {background:#dddddd;}
div.spec table.spec_03 span.example_text{font-size: 16px; padding-left:15px; font-weight:300;}
div.spec table.spec_03 th span.example_text{font-size: 16px; padding-left:0px;}

div.spec table th.th_02{background:#999; font-weight:500; color:#fff}
div.spec table input[type=text]{width:100%; padding:10px; border:1px solid #ccc; height:40px; font-size:16px}
div.spec table input[type=password]{width:100%; padding:10px; border:1px solid #ccc; height:40px; font-size:16px}
div.spec input[type=submit] {background: #333333 url(/images/selectAll.png) no-repeat 40px 25px;    margin-right: 5px; color:#fff; display: inline-block;    padding: 20px 40px 20px 70px;    color: #fff;font-family: 'Noto Sans KR', sans-serif; font-size:18px;}

div.spec table input{margin:0 5px}
.searchPost{ display:inline-block; color:#fff;background:#283b82 url('/images/ico_spec.png') no-repeat 15px 5px;  padding:10px 10px 10px 50px; }
div.payroll table {width:100%; font-size:16px; margin-bottom:50px}
div.payroll table td{padding:10px; border:1px solid #ccc; }
div.payroll table th{padding:10px; border:1px solid #ccc; font-weight:normal}
div.payroll table th.thTop{background:#999 !important}
div.payroll table.spec_01 th{background:#fce8e8}
div.payroll table.spec_02 th{background:#e8f4fc}
div.payroll table.spec_03 th{background:#eeeeee}
div.payroll table th.th_02{background:#999; font-weight:500; color:#fff}

div.employee table {width:100%; font-size:16px; }
div.employee table td{padding:10px; border:1px solid #ccc; text-align:center}
div.employee table th{padding:10px; border:1px solid #ccc; font-weight:normal; background:#4e7abc; color:#fff}





#Subcontent > div.SubIn_03 > div.payroll{ width:100%; background:#fff; padding:70px 30px; box-shadow : 2px 2px 2px #ccc; margin:0 auto; }
div.payroll table {width:100%; font-size:16px; }
#Subcontent > div.SubIn_03 > div.employee{ width:100%; background:#fff; padding:70px 30px; box-shadow : 2px 2px 2px #ccc; margin:0 auto;}
div.payroll table {width:100%; font-size:16px; }
a.detail {display:inline-block; border:1px solid #4e7abc; padding:5px 20px; color:#4e7abc }
#Subcontent > div.SubIn_03{ width:100%; background:#f2f2f2;font-size:16px; padding:0 40px 40px 40px }

#Subcontent > div.SubIn_04{ width:1600px; /*background:#f2f2f2;*/font-size:16px; padding:40px 40px 40px 40px; margin:0 auto;}
#Subcontent > div.SubIn_04 dl{margin-bottom:10px; width:100% }
#Subcontent > div.SubIn_04 dt{font-size:18px; padding-top:10px;}

#Subcontent > div.SubIn_04 dl > dd > ul{display:flex; width:100%; text-align:left;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
	padding-left:10px;	
}
#Subcontent > div.SubIn_04 dl > dd > ul > li{padding-bottom:10px;  text-indent: -1em;
        margin-left: 1em;}



div.topBtn{ width:auto; margin:0px auto;font-size:18px; text-align:center; position:absolute; right:0; top:0;}
div.topBtn > a{display:inline-block; padding:15px 20px 15px 50px; color:#fff}
div.topBtn > a.input_ok{ background:#4e7abc url('/images/ico_inputok.png') no-repeat 20px 17px;  }
div.topBtn > a.input_gn{ background:#ffa500 url('/images/ico_gn.png') no-repeat 20px 17px;  }
div.topBtn > a.selectAll{ background:#333333 url('/images/selectAll.png') no-repeat 20px 17px; margin-right:5px }
div.topBtn > a.sendMail{ background:#f4bd34 url('/images/sendMail.png') no-repeat 20px 17px; color:#000  }
div.topBtn > a.concel{ background:#333333 url('/images/selectAll.png') no-repeat 20px 17px; margin-right:5px }
div.topBtn > a.excell{ background:#ccc url('/images/ico_download.png') no-repeat 20px 17px; color:#0c2a58 }
div.topBtn > a.print{ background:#0c2a58 url('/images/ico_print.png') no-repeat 20px 17px; color:#fff }
div.topBtn > a.regist{ background:#fff url('/images/ico_regist.png') no-repeat 10px 17px; color:#000 }
/*
@media(max-width:1600px){
	div.topBtn{position:relative; display:block; text-align:center;}
}
*/
div.footBtn{ width:1300px; margin:40px auto;font-size:18px; text-align:center  }
div.footBtn > a{display:inline-block; padding:20px 40px 20px 70px; color:#fff}
div.footBtn > a.input_ok{ background:#4e7abc url('/images/ico_inputok.png') no-repeat 40px 25px;  }
div.footBtn > a.input_gn{background:#ffa500 url('/images/ico_gn.png') no-repeat 40px 25px;  }
div.footBtn > a.selectAll{ background:#333333 url('/images/selectAll.png') no-repeat 40px 25px; margin-right:5px }
div.footBtn > a.sendMail{ background:#f4bd34 url('/images/sendMail.png') no-repeat 40px 25px; color:#000  }
div.footBtn > a.concel{ background:#333333 url('/images/selectAll.png') no-repeat 40px 25px; margin-right:5px }
#Footer{width:100%; background:#333; color:#999;padding:70px 33px 70px 33px;  font-size:16px; overflow:hidden}
#Footer > div.footer_ci{width:100%; text-align:center}

#Footer > div.footer_policy{ 
display:block; margin:20px auto;
text-align: center;

    font-size: 16px;
}
#Footer > div.footer_policy ul li{ display:inline-block; margin: 0 20px;}
#Footer > div.footer_policy ul li a{color: #999;}


#Footer > div.footer_sns{text-align:center}
#Footer > div.footer_sns > div{ }
#Footer > div.footer_sns > div.copy{padding-top:25px; }

#Footer > div.footer_sns > div > ul{margin-left:20px; margin-bottom:5px}
#Footer > div.footer_sns > div > ul > li{display:inline-block}
#Footer > div.footer_sns > div > ul > li > a{display:block; width:60px; height:60px; border-radius:50%; background:#999; text-align:center; padding-top:10px}



.printonly{ display:none; width:100%; height: auto; width: 100%; margin-right:2cm;}
.chkstamp {width:100%; margin-bottom:20px; }
.chkstamp:after{clear:both; display:block; content:'';}
.chkstamp > div {float:right;}

.chkstamp table {}
.chkstamp table th, .chkstamp table td{border: 1px solid #000; background:#fff;}
.chkstamp table th {width:2cm; height:1cm}
.chkstamp table td {width:2cm; height:2cm}

/*
.printonly{  width: 210mm; display:block; width:100%; height: auto; }
.chkstamp {width:100%; display:block;     }
.chkstamp:after{clear:both; display:block; content:'';}
.chkstamp > div {display:block; text-align:right;}
*/

/*출력시 보이는 내용*/
@media print {
.printonly{  *width: 210mm; display:block; width:100%; height: auto; }
.chkstamp {width:100%; display:block;     }
.chkstamp:after{clear:both; display:block; content:'';}
.chkstamp > div {display:block; text-align:right;}

.chkstamp table {}
.chkstamp table th, .chkstamp table td{border: 1px solid #000; background:#fff;}
.chkstamp table th {width:2cm; height:1cm}
.chkstamp table td {width:2cm; height:2cm}
	
	.payroll h3 {font-size:10mm;}
	#Subcontent h3 {font-size:10mm; padding:10mm;}
    html, body {

        min-width: 297mm;

        min-height: 210mm;

        background: #fff;

		font-size:10mm; 
		padding:0;
		margin: 0;
    }

    #printarea {

        margin: 0;

        border: initial;

        border-radius: initial;

        width: initial;

        min-height: initial;

        box-shadow: initial;

        background: initial;

        page-break-after: always;

    }
	#printarea.printing_set table th{font-size:10mm; padding:3mm;}
	#printarea.printing_set table td{font-size:10mm; padding:3mm;}


}
/*
@page {margin:0}
*/





/* 깜빡임 표시 - 급여대장*/
/* for MS계열 브라우저 */
@keyframes blink {
 0% {background-color: red;}
 50% {background-color: yellow;}
}
 
/* for Chrome, Safari */
@-webkit-keyframes blink {
 0% {background-color: red;}
 50% {background-color: yellow;}
}
 
/* blink CSS 브라우저 별로 각각 애니메이션을 지정해 주어야 동작한다. */
.blinkcss {
 font-weight:bold;
 animation: blink 1s step-end infinite;
 -webkit-animation: blink 1s step-end infinite;
}






#fix_bg{
	position:absolute;
	background: rgba(0,0,0, 0.4);
	top:0; bottom:0;
	width:100%; height:100%;
	z-index:99;
	display:none;
}

#fix_bg.abs_bg{position:absolute;}

.altconfirm{
	width:500px; height:350px;
	background: #fff;
	border: 5px solid #4b76b7; border-radius: 5px; 
	margin: 0 auto;
    transform: translateY(100%);
	padding:10px;
	text-align:center;
	position:relative;
}
.altconfirm h4{
	font-size:25px;color:#4b76b7;
}

.altconfirm > div {    margin: 0 auto;
    text-align: center;
    display: block;

    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;}


/*.btn_area {text-align:center; display:block; position:absolute; bottom:30px; width:100%; }*/
.btn_area {margin: 30px 0 0 0;}
.btn_area button{ font-size: 18px; padding: 10px 20px; background: #fff; border-radius:3px; border: 1px solid #333; background:#4e7abc; color:#fff;}
.btn_area button:hover{background:#333666; color:#fff;}
