@charset "utf-8";
/*
 * ProjectName	:	HGP
 * fileName		:	style.css
 * author		:	mhhan
 * Copyright ASPN Corp. All rights reserved.
 */

/* common use */
.hiddenTxt{color:transparent;font-size:0;text-indent:-9999;}
.bold{font-weight:bold;}

/* 로그인 화면 */
.index .header{width:100%;height:115px;border-bottom:4px solid #a1d215;background:#fff url('../img/indexLogo.png') center center no-repeat;}
.index .container{position:relative;width:100%;padding:0;}
.index .container img{width:100%;height:auto;}
.index .footer{width:100%;height:93px;background:url('../img/indexFooter.png') no-repeat center center;}

/* 로그인 박스 */
.loginArea{float:left;position:absolute;top:50%;left:50%;margin:-60px 0 0 -220px;width:440px;height:223px;background:url('../img/loginBg.png') no-repeat;}
.inputArea{float:left;padding:48px 0 24px 0;margin:0 44px 0 40px;width:356px;height:72px;border-bottom:1px solid #e5e5e5;}
.checkArea{float:left;padding:22px 44px 41px 46px;width:350px;height:15px;}

.inputWrap{float:left;width:265px;height:72px;padding-right:19px;}
.inputWrap dl:first-child{margin-bottom:8px;}
.inputWrap dl:after{content:"";clear:both;display:block;}
.inputWrap dt{float:left;width:103px;height:32px;line-height:32px;font-weight:bold;font-size:14px;}
.inputWrap dd{float:left;width:162px;height:32px;line-height:32px;}
.inputBx{position:relative;display:block;width:140px;padding:10px;border:1px solid #c6d28f;background:#f4f7eb;}
.inputBx label{position:absolute;left:0;top:0;bottom:0;right:0;}
.inputBx .input{width:100%;line-height:12px;outline:none;background:transparent;color:#5e6f4e !important;}
.checkArea > ul > li{float:left;display:inline-block;width:50%;height:15px;}
.checkBx{position:relative;display:inline-block;width:100%;height:15px;line-height:15px;background:url('../img/checkIcon.png') no-repeat 0 -30px;background-size:15px auto;}
.checkBx.on{background-position:0 0;}
.checkBx label{position:absolute;left:0;top:0;bottom:0;right:0;padding-left:20px;}
.checkBx .check{display:inline-block;width:15px;height:15px;opacity:0;}
.loginBtn{float:left;display:block;width:72px;height:72px;background:url('../img/loginBtn.png') no-repeat;}

/* layout */
.header{float:left;position:relative;width:100%;height:70px;background-color:#3a523c;}
.wrap{width:100%;}
.container{padding:5px;}
.container.type02{padding:30px 50px;margin-bottom:50px;}
.inline{display:inline-block;margin-right:10px;}

/* inner header */
.sideMenuBtn{position:absolute;top:0;left:0;display:block;width:54px;height:54px;background:#9ac914 url('../img/sideMenuBtn.png') no-repeat center center;}
.hdLogo{width:375px;height:37px;margin:19px auto 0;background:transparent url('../img/headerLogo2.png') no-repeat 0 0;}
.userWrap {position:relative;}
.userWrap:after {content:'';display:block;clear:both;}
.userInfo{overflow:hidden;float:left;display:block;width:auto;height:42px;padding-right:15px;padding-left:55px;font-size:16px;color:#fff !important;font-weight:bold;line-height:42px;text-align:left;background:url('../img/userInfoDft.png') no-repeat 0 0;box-sizing:border-box;}
.userInfo:after {content:'';display:block;position:absolute;top:50%;right:0;width:4px;height:16px;margin-top:-8px;background:url('../img/btn_top_arrow.png') no-repeat 0 0;}
.ModifyBtn{float:right;display:block;margin:16px 13px 0 0;width:97px;height:26px;background:url('../img/modifyBtn.png') no-repeat;}
.logoutBtn{float:right;display:block;margin:16px 30px 0 0;width:97px;height:26px;background:url('../img/logoutBtn.png') no-repeat;color:#fff;}
.userDetail {display:none;float:left;margin-top:8px;}
.infoList:after {content:'';display:block;clear:both;}
.infoList > li {float:left;margin-left:2px;}
.infoList > li > a {display:block;padding:0 10px;font-size:12px;font-weight:bold;color:#3b513c;line-height:26px;border:1px solid #ccc;background-color:#fff;text-align:center;border-radius:3px;}
.infoList > li > a:hover {background-color:#405842;color:#fff;}
.userWrap.open {padding-right:30px;}
.userWrap.open .userDetail {display:block;}



/* form style */
.formArea{width:100%;}
.formHeader{position:relative;width:100%;height:36px;background:#888888;}
.formHeader.type02{background:#fff;color:#333;text-align:center;font-weight:bold;}
.gridArea{position:relative;width:100%;}
.titleArea.type01{/*position:absolute; 2020-10-06*/width:85%;overflow:hidden;}
.titleArea.type02{position:relative;width:100%;overflow:hidden;}
.gridWrap{width:100%;}

.formTit{position:absolute;display:inline-block;left:10px;top:0;line-height:40px;font-size:14px;color:#fff;font-weight:bold;}
.formTit.type02{position:static;line-height:40px;font-size:20px;color:#333;font-weight:bold;}
.innerTit{display:inline-block;margin:10px 20px 10px 5px;padding-left:5px;border-left:3px solid #888;color:#333;font-size:12px;font-weight:bold;}
.innerTit.type02{border:none;}

.btnArea{position:absolute;display:inline-block;height:25px;}
.btnArea.typeRight{right:5px;top:50%;margin-top:-12px;}
.btnArea.typeLeft{left:5px;top:50%;margin-top:-12px;}
.btnArea02{display:inline-block;}

/* 버튼 스타일 공통 */
.btnType{display:inline-block;width:70px;height:23px;line-height:23px;text-align:center;cursor:pointer;border:none;}
.btnType02{display:inline-block;width:85px;height:23px;line-height:23px;text-align:center;cursor:pointer;}
.btnType1{display:inline-block;width:85px;height:23px;line-height:23px;text-align:center;cursor:pointer;}
/* 기본 버튼 - 화이트 */
.btnType.form01{background:url('../img/btn06.png') no-repeat;background-size:70px 23px;color:#333;}
.btnType.form0102{width:110px;background:url('../img/modifyBtn.png') no-repeat;background-size:110px 23px;color:#333;}
/* 기본 버튼 - 그린 */
.btnType.form02{background:url('../img/btn05.png') no-repeat;background-size:70px 23px;color:#fff;}
/* 기본 버튼 - blue */
.btnType.form03{background:url('../img/btn03.png') no-repeat;background-size:70px 23px;color:#fff;border:none;vertical-align:middle;line-height:20px;}
.btnType.form03:hover{background:url('../img/btn03_on.png') no-repeat;background-size:70px 23px;color:#fff;}
.btnType02.form03{background:url('../img/btn03.png') no-repeat;background-size:85px 23px;color:#fff;border:none;vertical-align:middle;line-height:20px;}
.btnType02.form03:hover{background:url('../img/btn03_on.png') no-repeat;background-size:85px 23px;color:#fff;}
/* 기본 버튼 - green */
.btnType.form04{background:url('../img/btn04.png') no-repeat;background-size:70px 23px;color:#fff;border:none;vertical-align:middle;line-height:20px;}
.btnType.form04:hover{background:url('../img/btn04_on.png') no-repeat;background-size:70px 23px;color:#fff;}
.btnType1.form03{background:url('../img/logoutBtn.png') no-repeat;background-size:85px 23px;color:#fff;}

.formCont{padding:5px;}
.tbStyle{width:100%;border-left:1px solid #e0e0ff;border-top:2px solid #e0e0e0;border-bottom:2px solid #e0e0e0;}
.tbStyle th{text-align:left;font-weight:bold;background:#efefef;}
.tbStyle.type02 th,
.tbStyle.type02 td{text-align:center;}
.tbStyle th,
.tbStyle td{padding:10px;border-top:1px dashed #e0e0ff;border-bottom:1px dashed #e0e0ff;border-right:1px solid #e0e0ff;}

.tbStyle02{width:100%;border-left:1px solid #666;border-top:2px solid #666;border-bottom:2px solid #666;}
.tbStyle02 th{text-align:center;font-weight:bold;vertical-align:middle;line-height:1.5em}
.tbStyle02 th,
.tbStyle02 td{padding:10px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-right:1px solid #666;}
.tbStyle02 .div th,
.tbStyle02 .div td{border-top:2px solid #ccc}

.innerTb{width:500px;margin:10px auto;border-left:1px solid #e0e0ff;border-top:2px solid #e0e0e0;border-bottom:2px solid #e0e0e0;}
.innerTb th{text-align:center;font-weight:bold;}
.innerTb th,
.innerTb td{padding:0 5px;border-top:1px dashed #e0e0ff;border-bottom:1px dashed #e0e0ff;border-right:1px solid #e0e0ff;}
.innerTb .align02{text-align:center;}

.tdEx01{height:70px;}
.tdEx02 th,
.tdEx02 td{border-bottom:2px solid #666;}

.eventInputWrap{position:relative;padding-right:25px;height:25px;}
.dateIcon.type02,
.searchIcon.type02{position:absolute;right:0;top:2px;}
.dateIcon.type03{width:17px;}
.inputPs{color:red;margin-top:3px;}

/* input style */
.inputTextWrap label{position:absolute;left:10px;top:10px;}
.inputText{width:100%;height:23px;line-height:23px;border:1px solid #e0e0e0;}
.inputText90{width:90%;height:23px;line-height:23px;border:1px solid #e0e0e0;}
.select{width:100%;height:23px;background-color:transparent;border:1px solid #e0e0e0;}
.textarea{width:100%;border:1px solid #e0e0e0;}

.inputText[readonly=readonly],
.textarea[readonly=readonly]{background:#f1f1f1;border:none;}

.inputText::-webkit-input-placeholder{color:#131212;}
.inputText:-moz-placeholder{/* Firefox 18- */color:#131212;}
.inputText::-moz-placeholder{/* Firefox 19+ */color:#131212;}
.inputText:-ms-input-placeholder{color:#131212;}
.inputText:-moz-placeholder{color:#131212;}

.input:-webkit-autofill{-webkit-box-shadow: 0 0 0px 1000px #fff inset;}

/* word style */
.wrap.memo{min-width:750px;}
.memoTit{width:100%;line-height:26px;padding:50px 0 30px 0;font-size:26px;font-weight:bold;color:#333;text-align:center;}
.memoCont{padding:22px;color:#333;font-size:16px;overflow:hidden;}
.memoCont p{line-height:2em;}
.tncList{margin-bottom:30px;}
.tncList > li{line-height:2em;padding-bottom:20px;}
.tncList .listTit{font-weight:bold;margin-right:10px;}
.tncDesc{line-height:1.5em;text-align:left;}
.tncDate{padding-top:80px;text-align:center;}
.tncDate > span{padding:0 20px;}
.contractor{width:500px;padding-top:50px;margin:0 auto;clear:both;overflow:hidden;}
/* .contractor dt{width:130px;height:200px;line-height:1.5em;padding-right:20px;float:left;text-align:right;letter-spacing:15px;font-weight:bold;} */
/* .contractor dd{position:relative;width:350px;min-height:30px;line-height:1.5em;float:left;} */
.contractor dt{display:inline-block;margin-bottom:10px;line-height:1.5em;letter-spacing:15px;font-weight:bold;}
.contractor dd{position:relative;line-height:1.5em;min-height:30px;}
.contractor dd .contDesc{position:absolute;left:0;top:3px;font-weight:bold;}
.contractor dd .contDesc.type02{letter-spacing:7px;}
.contractor dd .innerBx{padding-left:75px;}

.memoTo{width:100%;line-height:20px;padding:30px 0;font-size:20px;font-weight:bold;color:#333;text-align:center;}
.agreement{text-align:center;font-size:13px;}
.agreement input{margin-left:10px;}

.contractNum{padding-right:5px;text-align:center;font-size:16px;color:#333;}
.contractNum span{font-weight:bold;padding-right:10px;}
.depth02{padding-left:24px;}
.depth02.type02{padding-left:50px;}
.numSt > li{position:relative;padding-left:20px;line-height:2em;}
.numSt > li .num{position:absolute;left:0;top:0;}
.sdDetail{float:left;display:block;width:100%;padding:70px 0;margin-left:40px;line-height:1.8em;}
.sdDetail.type02{margin:0 auto;}
.part{float:left;display:block;width:50%;}
.coTitle{border-bottom:1px solid #666;padding:0 5px;}

.boxSt01{padding-bottom:30px;}
.boxSt02{overflow:hidden;padding:0 30px;}
.boxSt03{margin-top:10px;margin-bottom:50px;}
.textSt01{text-indent:10px;}
.textSt02{position:relative;}
.textSt03{text-align:center;}
.textSt02 > span{position:absolute;right:0;}
.sdDetail dd{/* height:28px; */}

.hdWrap{width:100%;text-align:center;}
.hdDeco{display:inline-block;height:30px;line-height:30px;width:200px;border-radius:10px;text-align:center;padding:10px 0;color:#333;font-weight:bold;font-size:30px;border:1px solid #666;}

/*  kej 추가*/
/*  layout */
.header {text-align:center;}
.logoWrap {display:inline-block;}
.topMenu {position:absolute;top:13px;right:65px;z-index:9999;}
.copyright {background-color:#3a523c;font-size:12px;color:#fff;line-height:44px;text-align:center;}
.newContents {padding:0 1%;}
.contTop {position:absolute;top:0;right:1%;left:1%;}
.gridSection {position:absolute;right:1%;bottom:1%;left:1%;}
.gridPop {position:relative;padding-top:20px;}
.gridPop .gridTopBtn {position:absolute;top:10px;left:0;right:0;width:calc(100% - 220px);}
.gridPop .gridTopBtnOnly {position:absolute;top:10px;left:0;right:0;width:calc(100% - 60px);text-align:right;}
.gridPop .CQHeaderText {color:#fff !important;}
.gridPop.noIcon {padding-top:0;}
.gridPop.noIcon .gridTopBtn {position:static;margin-bottom:6px;}

/* title */
.titleWrap {position:relative;height:54px;margin-bottom:10px;}
.titleWrap .btnArea {position:absolute;bottom:0;right:0;height:auto !important}
.titleWrap .titleType01 {display:inline-block;margin-bottom:0}
.titleWrap .btnPrimary {padding-left:30px !important;padding-right:30px !important;}
.titleType01 {margin-bottom:25px;padding-top:15px;font-size:24px;font-weight:700;color:#464646;line-height:1;letter-spacing:-0.1em;}
.titleType02 {position:relative; z-index:4; display:inline-block; height:30px; padding-left:16px; padding-right:9px; font-size:16px; font-weight:700; line-height:1; letter-spacing:-0.05em; background-color:#ddeae1;}
.titleType02:before {content:''; display:block; position:absolute; top:4px; left:0; width:10px; height:10px;border-radius:50%; background-color:#7cb04b;}
.stitleWrap {position:relative;}
.stitleWrap:after {content: ''; display: block; position: absolute; left: 16px; top:8px; right:0; height:2px; background-image:linear-gradient(to right, #7cb04b 40%, rgba(255, 255, 255, 0) 20%);background-position: right top; background-size: 6px 2px;background-repeat: repeat-x;}

/*  search*/
.searchDate {margin-bottom:8px;}
.searchDate .textBox {padding-left:10px;padding-right:30px;text-align:left;}
.searchDate * {vertical-align:top;}
.searchDate .dateIcon.type03 {position:relative;top:4px;margin-left:-25px;margin-right:5px;width:20px;height:20px;}
.searchDate .btnType.form03 {width:120px;height:40px;background-image:none;background-color:#405842;border-radius:9px;box-sizing:border-box;}

/*  login  */
/*.loginWrap {background:url('../img/bg_login.png') no-repeat center top;}*/
.loginWrap {background:url('../img/bg_login.png') no-repeat center top; background-size: 100% 100%;}
.loginWrap * {box-sizing:border-box;overflow:hidden;}
.loginWrap .container {position:static;padding-top:207px;}
.loginWrap .loginArea {float:none;position:static;width:500px; height:533px;margin:0 auto;padding:75px 70px 0;background-image:none;background-color:#fff;}
.loginWrap .loginLogo {text-align:center;}
.loginWrap .loginLogo img {width:auto;}
.loginWrap .inputArea {float:none;width:100%;height:auto;margin:0 0 10px;padding:0;border-bottom:0;}
.loginWrap .inputWrap {float:none;width:100%;height:auto;padding-right:0;}
.loginWrap .inputWrap dl {height:56px;margin-bottom:12px;border:1px solid #ccc;border-radius:28px;}
.loginWrap .inputWrap dl:after {content:'';display:block;clear:both;}
.loginWrap .inputWrap dt {float:left;width:80px;height:54px;background:url('../img/ico_pass.gif') no-repeat center center;font-size:0;}
.loginWrap .inputWrap dl:first-child {margin-bottom:14px;}
.loginWrap .inputWrap dl:first-child dt {background:url('../img/ico_id.gif') no-repeat center center;}
.loginWrap .inputWrap dd {float:left;width:250px;height:54px;}
.loginWrap .inputBx {width:250px;height:54px;padding:0;border:0;background:#fff;}
.loginWrap .inputBx .input {height:54px;font-size:16px;background:#fff;}
.loginWrap .loginBtn {float:none;width:100%;height:56px;font-size:18px;font-weight:bold;color:#fff;border:0;border-radius:28px;background-color:#009944;background-image:none;text-align:center;outline:0;}
.loginWrap .loginBottom {padding-top:10px;font-size:14px;color:#fff;text-align:center;}
.loginWrap .findTxt {padding:7px 22px 0 0;font-size:14px;font-weight:700;color:#666;text-align:right;letter-spacing:-0.05em;}

.checkArea01 {padding:36px 0 30px;}
.checkArea01 .checkBx {display:block;position:relative;width:156px;height:40px;margin:0 auto;background:none;vertical-align:top;}
.checkArea01 .checkBx input {position:absolute;top:0;left:0;opacity:0;filter:alpha(opacity=0);}
.checkArea01 .checkBx label {display:inline-block;position:relative;width:100%;height:40px;padding-left:47px;font-size:12px;font-weight:700;color:#fff;line-height:40px;letter-spacing:-0.1em;border-radius:20px;background-color:#c2e2a6;}
.checkArea01 .checkBx label:before {content:'';display:block;position:absolute;left:2px;top:2px;width:36px;height:36px;background-color:#fff;border-radius:50%;}
.checkArea01 .checkBx input:checked + label {padding-left:20px;border-radius:20px;background-color:#7cb04b;}
.checkArea01 .checkBx input:checked + label:before {content:'';display:block;position:absolute;left:auto;right:2px;top:2px;width:36px;height:36px;background-color:#fff;border-radius:50%;}

.checkArea02 {padding:0 0 20px 38px;}
.checkArea02 .checkBx {display:inline-block;position:relative;vertical-align:top;background:none;height:19px;}
.checkArea02 .checkBx input {position:absolute;top:0;left:0;opacity:0;filter:alpha(opacity=0);}
.checkArea02 .checkBx label {position:relative;padding-left:26px;font-size:14px;font-weight:700;color:#666;}
.checkArea02 .checkBx label:before {content:'';display:block;position:absolute;left:0;top:auto;width:15px;height:15px;border:1px solid #7d7d7d;}
.checkArea02 .checkBx input:checked + label:after {content:'';display:block;position:absolute;top:4px;left:3px;width:10px;height:5px;border-left:2px solid #405842;border-bottom:2px solid #405842;transform:rotate(-45deg);}

/* Change the color to your own background color */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: #999 !important;
    font-size:inherit;
}

/*  table */
.dataWrite {width:100%;border-left:1px solid #e0e0ff;border-top:2px solid #e0e0e0;border-bottom:2px solid #e0e0e0;}
.dataWrite tbody th {padding:4px 10px; font-size:12px;font-weight:bold;color:#606060; text-align:right;border-right:1px solid #e0e0ff;border-top:1px dashed #e0e0ff;background-color:#f2f2f2;vertical-align:middle;}
.dataWrite tbody td {height:32px; padding:4px 7px;border-right:1px solid #e0e0ff;border-top:1px dashed #e0e0ff;background-color:#fff;vertical-align:middle;}
.dataWrite .inputText {height:32px;padding-left:5px;line-height:30px;border:1px solid #d6d6d6; background-color:#fff;box-sizing:border-box;}
.dataWrite .select {height:32px;box-sizing:border-box;}

/* button */
.btnCenter {padding:30px 0;text-align:center;}