File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
@import url(/pb/css/style.css);
html{width: 100%;min-width:1480px;box-sizing: border-box;}
body{font-family: 'Noto Sans KR', sans-serif;width: 100%;max-width: 1920px;min-width:1480px;height: 100%;box-sizing: border-box;background-color:#F2F2F2;}
.inline li{float: left;}
#wrap {position:relative;padding:70px 0 0;}
/* header */
header{width: 100%;height: 70px;vertical-align: middle;box-shadow: 0 1px 4px 2px rgba(0,0,0,0.1);position: absolute;top: 0;left: 0;z-index: 2;background-color:#fff;}
header h1,.topRight{float: left;vertical-align: top;}
header h1{background-color: #fff;display:flex;max-width: 240px; width: 100%; height: 100%; text-align: center;justify-content:center;align-items:center;}
header h1 img{margin: 10px;}
header input[type="button"]{background-repeat: no-repeat;border: none;background-color: transparent;}
header .topRight{width: 79%;height: 100%; background-color: #fff;position: relative;}
header .topRight ul,header .topRight .pfWrap{float: left}
header .allMenu{background-image: url(/pb/img/common/topMenuIcon.png);width: 24px;height: 24px;margin: 24px 0px;position: absolute;left: 2%;}
.topRight>ul:nth-child(2){position: absolute;top: 50%;transform: translateY(-50%);left: 5%}
.topRight>ul:nth-child(2) li{background-color: #f2f2f2;width: 40px;height: 40px;margin: 0 7.5px;border-radius: 100%;text-align: center;position: relative;cursor: pointer;}
.topRight>ul:nth-child(2) li input[type="button"]{width: 40px;height: 40px;text-align: center;position: absolute;}
.alramBtn{background-image: url(/pb/img/common/topAlram.png);top: 20%;left: 26%;}
.alramBtn:hover,.alramBtn:active{background-image: url(/pb/img/common/topAlramColor.png)}
.mailBtn{background-image: url(/pb/img/common/topMail.png);top: 28%;left: 20%;}
.mailBtn:hover,.mailBtn:active{background-image: url(/pb/img/common/topMailColor.png)}
.quickSiteBtn{background-image: url(/pb/img/common/topPc.png);top: 27%;left: 20%}
.quickSiteBtn:hover,.quickSiteBtn:active{background-image: url(/pb/img/common/topPcColor.png);}
.favoriteBtn{background-image: url(/pb/img/common/topFavorite.png);top: 20%;left: 21%;}
.favoriteBtn:hover,.favoriteBtn:active{background-image: url(/pb/img/common/topFavoriteColor.png)}
header .infoWrap{position: absolute;right: 0;}
.infoWrap>ul{background-color: #f3f4f7;box-shadow: inset 0.5px 0.9px 3px 0 rgba(0,0,0,0.1);border-radius: 17px;width: 275px;margin: 15px 30px 15px 0;padding: 9px 0;text-align: center;}
.infoWrap>ul>li{margin-left: 15px;}
.infoWrap>ul>li:first-child{margin-left: 25px;}
.infoWrap>ul>li>*{vertical-align: middle;display: inline-block;font-size: 0.8125em;color: #666;}
.infoWrap>ul>li>img{margin-right: 5px;}
.pfWrap{position: relative;}
.pfImg{width: 42px;height: 42px;border-radius: 100%;overflow: hidden;position: relative;float: left;margin-top: 14px;vertical-align: middle;margin-right: 10px;}
.pfImg img{width: auto;height: 100%;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.pfImg+ul{float: left;margin-top: 18px;}
.pfName{font-size: 16px;font-weight: 500;color: #222;}
.pfPosi{font-size: 14px;font-weight: 400;color: #999;margin-top: 3px;}
.downBtn{background-image: url(/pb/img/common/downIcon.png);position: absolute;top: 50%;right: -35px;width: 24px;cursor:pointer;}
/* //header */
/* leftMenu */
.leftMenu{max-width: 240px;width: 100%;/*height: 100vh;*/min-height: 986px; background-color: #0D488B;display: inline-block;position: absolute;top: 70px;left: 0;z-index:1;}
.leftMenu>ul>li{color: #BFC0C6;display: table;height: 50px;line-height: 50px;padding:0 0 0 20px; position: relative;width: 100%;font-size: 15px;border-bottom: 1px solid #405C9E;cursor:pointer;position:relative;}
.leftMenu>ul>li:hover,.leftMenu ul li.menuOn{background:#043E7F;}
.leftMenu>ul>li:hover p{color: #66B8D5;}
.leftMenu>ul .menu_title{display:flex;padding:0 15px 0 0;justify-content:space-between;align-items:center;}
.leftMenu>ul .menu_title i{display:inline-block;width:24px;height:24px;background:url(/pb/img/common/leftMenuGo.png) no-repeat center;}
.leftMenu ul li.menuOn p{color: #66B8D5;}
.leftMenu>ul li.menuOn .menu_title i{background:url(/pb/img/common/leftMenuDown.png) no-repeat center;}
.leftMenu .subMenu{display: none;padding: 0 0 10px 0;width: 100%;margin-left: -10px;}
.leftMenu ul li.menuOn .subMenu{display: block;}
.leftMenu .subMenu li{display: block;width:100%;padding-left: 10px;height: auto;height: 32px;line-height: 31px;}
.leftMenu .subMenu li:hover{background-color: #04356C;}
.leftMenu .subMenu li a{font-size: 14px;}
.leftMenu .subMenu li:hover a{color: #66B8D5;}
.leftMenu .btnWrap{margin: 25px 0 0 10px;}
.leftMenu .btnWrap ul li{margin-bottom: 8px;}
.leftMenu .btnWrap button{background-color: #fff;border: none;width: 210px;height: 50px;text-align: left;border-radius: 5px;padding-left: 15px;cursor: pointer;}
.leftMenu .btnWrap button *{font-size: 1em;font-weight: 600;color: #474a56; vertical-align: middle;display: contents;letter-spacing: -0.5px;line-height: 50px;}
.leftMenu .btnWrap button span{font-weight: 600;color: #426ae6;}
.leftMenu .btnWrap img{display: inline-block;float: right;margin-top: 10px;padding-right: 10px;}
.leftBtm{color: #fff;position: absolute;bottom: 3%;left: 5%;}
/* //leftMenu */
/* cont */
input[type="text"],input[type="number"],input[type="password"],select{height: 40px;border: 1px solid #dbdcdf;vertical-align: middle;min-width: 120px;font-size: 1em;color: #555;font-weight: 500;padding: 0 40px 0 15px;border-radius: 3px;}
select{background-image: url(/pb/img/common/selectIcon.png);background-repeat: no-repeat;background-position: 93% center;}
input[type="radio"]{display: none;}
input[type="radio"]+label{width: 18px;height: 18px;display: inline-block;border: 1px solid #999;border-radius: 100%;vertical-align: middle;margin-right: 0px;}
input[type="radio"]+label+label{vertical-align: middle;margin-right: 15px;}
input[type="radio"]:checked+label{border: 1px solid var(--primary-color);position: relative;}
input[type="radio"]:checked+label::after{position: absolute;content: "";width: 10px;height: 10px;background-color: var(--primary-color);border-radius: 100%;top: 50%;left: 50%;transform: translate(-50%,-50%);}
input[type="checkbox"]{display: none;}
input[type="checkbox"]+label{width: 18px;height: 18px;display: inline-block;border: 1px solid #999;border-radius: 3px;vertical-align: middle;margin-top: -2px;}
input[type="checkbox"]:checked+label{border: 1px solid var(--primary-color);background-color: var(--primary-color);position: relative;}
input[type="checkbox"]:checked+label::after{background-image: url(/pb/img/common/check.png);background-repeat: no-repeat;background-position: center;position: absolute;content: " ";display: inline-block;width: 12px;height: 10px;top: 50%;left: 50%;transform: translate(-50%,-50%)}
.btnType1{font-size: 1em;height: 40px;vertical-align: middle;color: #fff;background-color: #aaa;border: none;border-radius: 3px;cursor: pointer;padding: 0 10px}
.btnType1:hover{background-color:#555;}
.btnType2{font-size: 1em;height: 40px;vertical-align: middle;color: #aaa;background-color: #fff;border: 1px solid #aaa;border-radius: 3px;cursor: pointer;padding: 0 10px}
/* 로딩바 */
.loading_layer {display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1000000;}
.loading_layer.active {display:block;}
.loading_layer:after {content:'';display:block;width:100%;height:100%;background:#000;opacity:0.5;filter:opacity(50);}
.loading_layer .loading_container {position:absolute;left:50%;top:50%;width:110px;height:110px;transform:translate(-50%,-50%);z-index:1;}
.loading_layer .loading_container .bar {position:absolute;left:0;top:0;width:100%;height:100%;border:6px solid #fff;border-top-color:transparent;border-bottom-color:transparent;border-radius:60px;box-sizing:border-box;animation:rotate-loading 1.5s linear infinite;}
.loading_layer .loading_container .text {font-size:15px;line-height:108px;text-align:center;color:#fff;animation:text-loading 1s ease-in infinite;}
/* //cont */
/* 달력 */
.calendar_wrap {display:inline-block;}
.calendar_wrap .calendar_box {position:relative;display:inline-block;}
.calendar_wrap .calendar_box input[type=text] {curosr:pointer;}
.calendar_wrap .calendar_box .calBtn{position:absolute;right:5px;top:7px;width:25px;height:25px;margin:0;border:none;background-color:transparent !important;background-image:url(/pb/img/common/calendarIcon.png);background-repeat:no-repeat;vertical-align:middle;cursor:pointer;}
.calendar_wrap .line {display:inline-block;letter-spacing:0;}
/* @media screen and (max-width:1400px){
header h1{max-width: 200px;}
header .topRight{width: 78%;}
.leftMenu{max-width: 200px;}
div.contWrap{left: 200px;}
.leftMenu .btnWrap{margin: 25px 0 0 8px;}
.leftMenu .btnWrap button{width: 180px;padding-left: 9px}
.leftMenu .btnWrap button *{letter-spacing: -1px;}
.leftMenu .btnWrap button img{padding-right: 3px}
}
@media screen and (max-width:1280px){
header .infoWrap{right:-8%;}
}
@media screen and (max-width:1100px){
header{background-color: var(--primary-color);}
header h1,header .topRight{background-color: transparent;}
header h1{max-width: 10%;}
header .topRight{width: 87%;}
header .allMenu.mMenuClose{background-image: url(/pb/img/common/leftMenuClose.png);margin: 21px 0;}
header .topRight ul:nth-child(2) li:first-child,header .topRight ul:nth-child(2) li:nth-child(2),header .topRight .infoWrap ul:first-child{display: none;}
header .allMenu{background-image: url(/pb/img/common/mTopMenuIcon.png);width: 38px;height: 27px;right: 0;left: auto}
.topRight>ul:nth-child(2){left: auto;right: 11%;}
.topRight>ul:nth-child(2) li{background-color: #6a8af1;}
.topRight>ul:nth-child(2) li input[type="button"]{width: 22px;height:
22px;background-size: 22px;left: 21%;}
.quickSiteBtn{background-image: url(/pb/img/common/topPcWhite.png);}
.favoriteBtn{background-image: url(/pb/img/common/topFavoriteWhite.png);}
header .infoWrap{right: 4%;}
.pfImg{position: absolute;right: 5%;float: none;}
.leftMenu{display: none;}
.leftMenu.mMenuOn{display: block;right: 0;left: auto;z-index: 1;max-width: 243px;}
}
@media screen and (max-width: 787px){
header{z-index: 2;}
header h1{max-width: 17%;}
header .topRight{width: 78%;}
.topRight>ul:nth-child(2){left: auto;right: 12%}
header .infoWrap{right: 7%;}
.topRight>ul:nth-child(2){left: auto;right: 19.5%;}
.leftMenu .btnWrap button{width: 96%;height: 70px;}
.leftMenu .btnWrap button *{font-size: 1.125em;}
.leftMenu>ul{overflow-y: scroll;height: 66%;overflow-x: hidden;}
.leftMenu>ul>li{height: 70px;line-height: 70px;}
.leftMenu>ul>li *{font-size: 1.250em;letter-spacing: -0.5px;}
.leftMenu ul>li>input[type="button"]{background-image: url(/pb/img/common/tLeftMenuGo.png);margin: 25px 10px 0 0}
.leftMenu .subMenu>li{height: 60px;line-height: 55px;}
.leftMenu .subMenu>li>a{font-size: 0.768em;}
input[type="text"],input[type="number"],input[type="password"],select{height: 60px;border: 1px solid #dbdcdf;vertical-align: middle;min-width: 160px;font-size: 1.375em;color: #555;font-weight: 500;padding: 0 0 0 20px;border-radius: 3px;}
select{background-image: url(/pb/img/common/selectIcon.png);background-repeat: no-repeat;background-position: 93% center;}
input[type="radio"]{display: none;}
input[type="radio"]+label{width: 25px;height: 25px;display: inline-block;border: 1px solid #999;border-radius: 100%;vertical-align: middle;margin-right: 0px;}
input[type="radio"]+label+label{vertical-align: middle;margin-right: 15px;font-size: 1.250em}
input[type="radio"]:checked+label{border: 1px solid var(--primary-color);position: relative;}
input[type="radio"]:checked+label::after{position: absolute;content: "";width: 16px;height: 16px;background-color: var(--primary-color);border-radius: 100%;top: 50%;left: 50%;transform: translate(-48%,-52%);}
input[type="checkbox"]+label{width: 25px;height: 25px;display: inline-block;border: 1px solid #999;border-radius: 3px;vertical-align: middle;}
input[type="checkbox"]+label+label{font-size: 1.250em}
input[type="checkbox"]:checked+label::after{background-image: url(/pb/img/common/tCheck.png);background-repeat: no-repeat;background-position: center;position: absolute;content: " ";display: inline-block;width: 28px;height: 20px;top: 50%;left: 50%;transform: translate(-50%,-50%)}
}
@media screen and (max-width:640px){
input[type="radio"]:checked+label::after{position: absolute;content: "";width: 16px;height: 16px;background-color: var(--primary-color);border-radius: 100%;top: 50%;left: 50%;transform: translate(-53%,-53%);}
header{height: 90px;}
header h1{margin-top: 11px;}
header .allMenu{top: 5%}
header .allMenu.mMenuClose{margin: 30px 0;}
.topRight>ul:nth-child(2){right: 20%;}
.leftMenu{display: block;top: 90px;right: 0;left: auto;}
div.contWrap{padding: 20px 13px;}
.rightWrap select{min-width: 120px;}
.pfImg{margin-top: 24px;}
}
@media screen and (max-width:500px){
.topRight>ul:nth-child(2){right:25%;}
}
@media screen and (max-width:400px){
header h1{width: 15%}
header h1 img{width: 220%}
header .allMenu{top: 10%;right: -2%;}
.topRight>ul:nth-child(2){right: 31%}
.topRight>ul:nth-child(2) li{margin: 0 3px;}
} */
/*개인정보 레이어팝업*/
.setDiv {padding-top: 100px;text-align: center;}
.mask {position:absolute;left:0;top:0;z-index:9999;background-color:#000;display:none;}
.window {display: none;background-color: #ffffff;width:410px; height:210px;z-index:99999; border-radius:10px}
.id_check1{width:410px;height:84px; background:#6c99f1; color:#ffffff; text-align:center; border-top-left-radius:10px;border-top-right-radius:10px;}
.id_check1 input{border:none;width:16px; height:24px; color:#ffffff;background:url("/img/post/X.png") no-repeat; font-size:18px; position:absolute; right:0px; margin:10px}
.id_check1 span{padding-left:30px;background:url(/img/post/id_check_img1.png)no-repeat 1px;position:relative; font-size:20px; top:30px}
.id_check1 img {}
.id_check2{width:410px;height:70px; font-size:16px; line-height:70px}
.id_check2 input {width:188px; height:33px; border:1px solid #dedede; margin:17px}
.id_check3{width:410px;height:56px; background:#f0f0f0; color:#646464; font-size:14px;border-bottom-left-radius:10px; border-bottom-right-radius:10px}
.id_check3 span{line-height:56px}
.id_check3 button{background:url(/img/post/check_id.png);border:none;width:133px; height:34px;margin:13px;padding-right:10px;color:#ffffff; border-radius:10px}
/*환경관리 이전글 다음글 댓글*/
.setListTitle_wrap table tr th{width: 29%;border-right: 1px solid #dde6e9;}
.setListTitle_wrap table tr th input[type="button"].beforeListBtn{background-image: url(../img/setUpBtn.png);background-repeat: no-repeat;background-position: center center;background-color: transparent;border: none;vertical-align: middle;}
.setListTitle_wrap table tr th input[type="button"].nextListBtn{background-image: url(../img/setDownBtn.png);background-repeat: no-repeat;background-position: center center;background-color: transparent;border: none;vertical-align: middle;}
.setListTitle_wrap table tr td{padding: 10px;}