@charset "UTF-8";

@font-face {font-family: Title; src: url("/fonts/NanumSquareB.woff");}
@font-face {font-family: Subtitle; src: url("/fonts/NanumSquareR.woff");}
@font-face {font-family: Content; src: url("/fonts/NanumBarunGothic.woff");}

*{margin: 0; padding: 0;}
#wrap{width: 1280px; margin: auto; height: 950px;}
#wrap2{width: 1280px; height: 852px;}
ul{list-style: none; margin: 0; padding: 0;}
caption{display: none;}
select::-ms-expand{display: none;}
select{-webkit-appearance: none; -moz-appearance: none; appearance: none;  padding-left: 14px; border: solid 1px #cccccc; font-family: Content; font-size: 14px; color: #999999;}
#container{display: flex; border-left: solid 1px #cccccc; border-right: solid 1px #cccccc;}
a:hover{text-decoration: none;}
label{margin: 0; padding: 0;}
input{font-family: Content; font-size: 14px; color: #121212;}
input[type="text"]{border: solid 1px #cccccc; padding-left: 14px; -webkit-box-shadow: 0 0 0 1000px white inset;}
input.date, input.time_input, input.date_long, input#copyNum{-webkit-box-shadow: none;}

input::placeholder{color: #999999;}
input::-ms-input-placeholder{color: #999999;}
input::-webkit-input-placeholder{color: #999999;}
input::-moz-input-placeholder{color: #999999;}
input[type="text"]::-ms-clear{display: none;}

input:read-only{border: none;}
.readOnly{border: none !important;}
input.addr, input.addr_input, input.file_name{border: solid 1px #cccccc;}

textarea{font-family: Content; font-size: 14px; color: #121212; line-height: 2; resize: none;}

textarea::placeholder{font-family: Content; font-size: 14px; color: #999999;}
textarea::-ms-input-placeholder{font-family: Content; font-size: 14px; color: #999999;}
textarea::-webkit-input-placeholder{font-family: Content; font-size: 14px; color: #999999;}
textarea::-moz-input-placeholder{font-family: Content; font-size: 14px; color: #999999;}

input.id_name::placeholder, input.id_input::placeholder, input.name_input::placeholder, input.addr_input::placeholder, input.pass_input::placeholder, input.email_name::placeholder, input.email_cite::placeholder, input.preview::placeholder, input.addr::placeholder, input.etc_input::placeholder, input.bankAccount::placeholder, input.authorInfo::placeholder, input.ex_long::placeholder, input.bookInfo::placeholder
{font-family: Content; font-size: 14px; color: #999999;}

textarea:focus, input:focus, select:focus, button:focus
{outline: none;}

button{border: none; overflow: visible; white-space: nowrap; vertical-align: middle; font-family: Content; font-size: 14px;}

#pwdNotice{font-family: Content; font-size: 13px;}

.txt{font-family: Content; font-size: 14px;}
.txt_right{text-align: right;}
span.txt{display: inline-block; width: 20px; font-family: Content; font-size: 14px; text-align: center;}
span.txt2{display: inline-block; width: 25px; font-family: Content; font-size: 14px; text-align: center;}

.float_L{float: left;}
.float_R{float: right;}

.mR_10{margin-right: 10px !important;}
.mL_5{margin-left: 5px !important;}
.mL_10{margin-left: 10px !important;}
.mL_20{margin-left: 20px !important;}
.mL_30{margin-left: 30px !important;}
.mL_M30{margin-left: -30px !important;}
.mT_0{margin-top: 0 !important;}
.mT_10{margin-top: 10px !important;}
.mT_20{margin-top: 20px !important;}
.mT_30{margin-top: 30px !important;}
.mT_50{margin-top: 50px !important;}
.mB_30{margin-bottom: 30px !important;}
.mR_74{margin-right: 74px !important;}
.mR_85{margin-right: 85px !important;}

.center{text-align: center !important;}
.left{text-align: left !important;}
td.left{text-align: left !important; padding: 0 0 0 20px;}

table.list_content td .noticeTitle
{width: 280px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left;}
table.list_content td .mailTitle, table.list_content td .pushTitle
{width: 310px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left;}
table.list_content td .noticeTitle2
{width: 490px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left;}
table.list_content td .reportTitle
{width: 480px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left;}
table.list_content td .FAQtitle
{width: 620px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left;}

.border-T{border-top: solid 1px #cccccc !important;}
.border-B{border-bottom: solid 1px #cccccc !important;}
.border-R{border-right: solid 1px #cccccc !important;}

.whiteBack{background-color: #ffffff;}


/* 로그인 페이지 HOME001 */
.fullArea{width: 1120px; height: 600px; position: absolute; left: 50%; top: 50%; margin: -300px 0 0 -560px;}
.bgArea{width: 560px; height: 600px; float: left; background-color: #26c6da; display: inline-block;}
aside.bgArea img{margin-top: 150px;}
.sideTxt{font-family: Subtitle; font-size: 16px; text-align: center; margin-top: 11px; color: #ffffff;}

form.loginForm{width: 560px; height: 600px; border: solid 1px #cccccc; background-color: #ffffff; float: right;}
h1.h_logo{margin-top: 103px; text-align: center;}
.h_logo_txt{font-family: Title; font-size: 36px; color: #121212; text-align: center; margin-top: 16px;}

.login_content{width: 360px; margin: 55px auto 0;}
input.h_id_input{width: 360px; height: 48px; border: none; border-bottom: solid 1px #cccccc; padding-left: 44px;}
input.h_pass_input{width: 360px; height: 48px; border: none; border-bottom: solid 1px #cccccc; padding-left: 44px; margin-top: 14px;}
.h_id_icon{width: 24px; height: 24px; background: url(../images/icon_user.png) no-repeat; position: absolute; margin: 12px 0 0 8px;}
.h_pwd_icon{width: 24px; height: 24px; background: url(../images/icon_lock.png) no-repeat; position: absolute; margin: 26px 0 0 8px;}

input.loginBtn{width: 360px; height: 50px; border: none; background-color: #0095a8; color: #ffffff; margin-top: 30px; font-family: Content; font-size:14px;}
input.loginBtn:hover{background-color: #027c8b;}
input.loginBtn:disabled{background-color: #72bdc6;}
.find_info{font-family: Content; font-size:14px; text-align: center; color: #999999; margin-top: 20px;}


.screen_out{display: none;}




/* 상단 로고 & 로그인아웃 영역 */
.top{width: 100%; height: 80px; border: solid 1px #cccccc;}
.logo_area{width:160px; height: 100%; float:left;}
.logo img{margin: 0 0 18px 26px;}
.Login_area{width: 91px; height: 100%; float: right; padding: 14px 0;}
.Login{font-family: Title;   font-size: 14px; color: #555555;}
.Login_info{float: right; font-family: Content;   font-size: 14px; color: #555555; padding: 17px 80px 0 0;}
.access{color: #0095a8; margin-right: 10px; font-size: 15px;}


/* 상단 nav 영역 */
nav{width: 1060px; height: 70px; margin-left: 220px; border-right: solid 1px #cccccc;}
ul.gnb_list{margin: 0; padding:0;}
ul.gnb_list li{height: 70px; padding: 22px 30px; float: left;}
ul.gnb_list li a{font-family: Content; font-size: 14px; color: #555555;}
ul.gnb_list li:hover{border-bottom: solid 2px #0095a8;}
ul.gnb_list li a:hover{color: #0095a8; cursor:pointer;}
.nav_focus{border-bottom: solid 2px #0095a8;}
ul.gnb_list li.nav_focus a{color: #0095a8;}


/* 좌측 LNB 영역 */
aside{width: 220px; float: left;}
h2.care_title{font-family: Title; width: 100%; height: 70px; background-color: #0095a8; font-size: 18px; color: #ffffff; margin-top: -70px; margin-bottom: 0; padding: 25px 0 0 30px; outline: solid 1px #cccccc;}

.care_list{font-family: Content; width: 100%; height: 50px; padding: 17px 0 0 30px; font-size: 14px;}
/*ul.care_list_sub{display: none;}*/
ul.care_list_sub li{font-family: Content; width: 100%; height: 40px; padding: 14px 0 0 50px; font-size:12px; background-color: #f7f8f9; color: #555555;}
ul.care_list_sub li:hover{background-color: #e0f7fa; cursor:pointer;}
ul.care_list_sub li a.menu_focus:hover{color: #0095a8;}
ul.care_list_sub li a{display: block;}
/*
ul.care_list_sub li a{width: 100%; height: 40px;}*/
.LNB_focus{color: #0095a8;}


/* LNB 열기 닫기 버튼 */
.menu_open{float: right; margin-top: -3px; margin-right: 15px;}
.menu_opened{float: right; margin-top: -3px; margin-right: 15px; display: none; z-index: -1;}
.menu_close{float: right; margin-top: -3px; margin-right: 15px; display: none; z-index: -1;}
.menu_closed{float: right; margin-top: -3px; margin-right: 15px;}
.menu_open:hover, .menu_opened:hover, .menu_close:hover, .menu_closed:hover{cursor: pointer;}
.menu_focus{color: #0095a8;}
/*
a.menu_focus li{color: #0095a8;}
*/



.content{width: 1060px; padding: 50px 40px;  float:right; background-color: #f1f1f1; box-shadow: 0 3px 10px #dddddd inset;}
.content2{width: 1280px; padding: 50px 40px;  float:right; background-color: #f1f1f1; box-shadow: 0 3px 10px #dddddd inset;}

h3.care_subtitle{font-family: Title; font-size: 20px; color: #121212; margin: 0;}
h4.care_subtitle{font-family: Title; font-size: 18px; color: #121212; margin-top: 50px; padding-left: 14px; border-left: solid 2px #0095a8; line-height: 1;}

.user{color: #0095a8; margin-right: 10px;}

/* content 내 검색 폼 박스 */
.formNoMargin{margin-top: 0 !important; border-top: none !important;}
.FormBox{width: 100%; border: solid 1px #cccccc; background-color: #ffffff; padding: 25px 30px; margin-top: 20px;}
.Form_title{width: 100%; height: 50px; border: solid 1px #cccccc; border-bottom: none; background-color: #f7f8f9; margin: 20px 0 -20px; font-family: Title; font-size: 16px; text-align: center; padding-top: 16px;}
.Form_titleLeft{width: 100%; height: 50px; border: solid 1px #cccccc; border-bottom: none; background-color: #f7f8f9; margin: 20px 0 -20px; font-family: Title; font-size: 16px; padding: 16px 0 0 30px;}
.Form_titleLeft_s{width: 100%; height: 50px; border: solid 1px #cccccc; border-bottom: none; background-color: #f7f8f9; margin: 20px 0 -20px; font-family: Title; font-size: 14px; padding: 16px 0 0 18px;}



/* 검색 버튼 */
.searchBtn{width: 97px; height: 38px; background-color: #555555; border: none; color: #ffffff; font-family: Content; font-size: 14px;}
.searchBtn:hover{background-color: #333333;}



/* 등록 취소 버튼 */
.Btn_group{width: 252px; height: 46px; margin: 40px auto 0;}
.modify_Btn{width: 116px; height: 46px; background-color: #0095a8; border: none; color: #ffffff;}
.modify_Btn:hover{background-color: #027c8b;}
.reset_Btn{width: 116px; height: 46px; background-color: transparent; border: solid 1px #0095a8; color: #027c8b; margin-left: 10px;}
.reset_Btn:hover{background-color: #c3dadd;}





/* 달력 */
input.date{width: 175px; height: 38px; border: solid 1px #cccccc; background: url(../images/icon_calendar.png) 145px 6px no-repeat; padding-left: 14px;}
input.date_long{width: 370px; height: 38px; border: solid 1px #cccccc; background: url(../images/icon_calendar.png) 340px 6px no-repeat; padding-left: 14px;}
input.date:hover, input.date_long:hover{cursor: pointer;}
.date_bar{font-family: Content; font-size: 14px; color: #999999; text-align: center; margin: 0;}




/* 시간 */
input.time_input{width: 175px; height: 38px; border: solid 1px #cccccc; background: url(../images/icon_clock.png) 145px 6px no-repeat; padding-left: 14px;}
input.time_input:hover{cursor: pointer;}




/* 내부 팝업창 */
.popBox_max, .popBox, .popBox_min{display: none;}
.popBox_max{width: 500px; height: 338px; background-color: #ffffff; position: absolute; left: 50%; top: 50%; margin: -169px 0 0 -250px; border: solid 1px #cccccc;}
.popBox{width: 500px; height: 243px; background-color: #ffffff; position: absolute; left: 50%; top: 50%; margin: -122px 0 0 -250px; border: solid 1px #cccccc;}
.popBox_min{width: 500px; height: 193px; background-color: #ffffff; position: absolute; left: 50%; top: 50%; margin: -97px 0 0 -250px; border: solid 1px #cccccc;}
.popTitle{width: 100%; height: 70px; background-color: #f7f8f9; font-family: Title; font-size: 20px; padding: 24px 0 0 30px; color: #121212;}
.popTxt{width: 100%; text-align: center; font-family: Content; font-size: 16px; margin-top: 40px;}
.popTxt_solo{width: 100%; text-align: center; font-family: Content; font-size: 16px; margin-top: 60px;}


/* 확인 최소 버튼 */
.confirmBtn{width: 116px; height: 46px; color: #ffffff; background-color: #0095a8; border: none; font-family: Content; font-size: 14px;}
.confirmBtn:hover{background-color: #027c8b;}
.cancelBtn{width: 116px; height: 46px; color: #0095a8; border: solid 1px #0095a8; background-color: #ffffff; margin-left: 10px; font-family: Content; font-size: 14px;}
.cancelBtn:hover{background-color: #c3dadd;}

/* 확인버튼 단독 */
.checkBtn_solo{width: 116px; height: 46px; border: none; color: #ffffff; background-color: #0095a8; margin-top: 30px; font-family: Content; font-size: 14px;}



.selectArea{width: 440px; height: 38px; margin: 48px auto 0;}



/* main001.css 셀렉트박스 크기 */
.ex_short{width: 175px; height: 38px;}
.short{width: 380px; height: 38px;}
.series{width: 120px; height: 38px; margin-left: 21px; text-align: left;}
.long{width: 788px; height: 38px;}
/* main002.css 셀렉트 박스 크기 */
.choice, .bank_name{width: 175px; height: 38px;}
.dayPick{width: 135px; height: 38px; margin-left: 10px;}
.orgPick{width: 380px; height: 38px;}
.w120{width: 120px; height: 38px;}
.w300{width: 300px; height: 38px;}
select.choice:disabled{background-color: #fafafa;}
/* 내부팝업 섹렉트박스 크기 */
.popSelect{width: 210px; height: 38px;}




/* 셀렉트박스 기본속성 제거, 커스텀 */
/*the container must be positioned relative:*/
.make_select {
	position: relative; border: solid 1px #cccccc; font-family: Content; font-size: 14px; padding-right: 6px;
}

/*hide original SELECT element:*/
.make_select select {
	display: none; 
}

.select-selected {
  background-color: #ffffff;
  background: url(../images/icon_sortdown.png) right 9px no-repeat;
}
.result_view .select-selected{background: url(../images/icon_sortdown.png) right 6px no-repeat;}
/*style the arrow inside the select element:
.select-selected:after {
	position: absolute;
	content: "";
	top: 14px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #fff transparent transparent transparent;
}*/

/*point the arrow upwards when the select box is open (active):
.select-selected.select-arrow-active:after {
	border-color: transparent transparent #fff transparent;
	top: 7px;
}*/

/*style the items (options), including the selected item:*/
.select-items div, .select-selected {
	color: #999999;
	height: 38px;
	padding: 9px 14px;/*
	border: 1px solid transparent;
	border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;*/
	cursor: pointer;
	user-select: none;
}

/*style items (options):*/
.select-items {
	position: absolute;
	background-color: #ffffff;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 99;
	outline: solid 1px #cccccc;
	margin-top: 1px;
	overflow: auto;
}

/* 셀렉트박스 높이 제한 */
.h_limit .select-items{height: 190px;}
.inlineDisplay{display: inline-block;}

/*hide the items when the select box is closed:*/
.select-hide {
	display: none;
}

.select-items div:hover, .same-as-selected {
	background-color: rgba(0, 0, 0, 0.1);
}






/* 기관 색상 */
.colorWrite{width: 161px; height: 38px;}
.colorWrite::placeholder{font-size: 13px;}
.colorView{width: 72px; height: 38px; border: solid 3px #cccccc; vertical-align: middle; -webkit-appearance: none; margin-left: 10px;}
.colorView:hover{border: none; cursor: pointer;}
.inputC_info{font-family: Content; font-size: 13px; padding-left: 15px; color: #999999;}








/* 독서인증서 팝업 */
.template_wrap{width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.5); position: absolute; left: 0; top: 0; display: none;}

.tempOriginal_frame{width: 626px; height: 860px; background-color: #ffffff; position: absolute; left: 50%; margin: 30px 0 0 -313px; border: solid 1px #cccccc;}
#certImage{width: 546px; height: 722px; position: absolute; left: 40px; top: 35px;}
#certImage img{width: 546px; height: 722px;}

.certText_Area div{font-family: Content; z-index: 100; position: absolute;}
.certNum{left: 140px; top: 120px; font-size: 14px;}
.certTxt_ko{width: 100%; text-align: center; font-size: 35px; top: 180px;}
.certTxt_enB{width: 100%; text-align: center; font-size: 30px; top: 225px;}
.certTxt_enS{width: 100%; text-align: center; font-size: 25px; top: 260px;}
.certID{font-size: 16px; left: 370px; top: 320px;}
.certName{font-size: 16px; left: 370px; top: 345px;}
.certWording{width: 380px; text-align: justify; font-size: 18px; text-indent: 12px; line-height: 2; left: 123px; top: 400px;}
.certDate{width: 100%; text-align: center; font-size: 18px; top: 580px;}
.orgSign{width: 100%; height: 60px; line-height: 60px; text-align: center; font-size: 25px; top: 620px;}
.preview_check{position: absolute; left: 255px; top: 750px;}
.tempOriginal_frame .Btn_group{position: absolute; left: 187px; top: 750px; width: 252px; margin-top: 30px !important;}
span.trans{color: transparent;}







#footer{width: 1280px;}
.footer_L{width: 221px; height: 138px; padding: 30px 38px 50px 38px; float: left; border-bottom: solid 1px #cccccc; border-left: solid 1px #cccccc; line-height: 1.7;}
.footer_R{width: 1059px; height: 138px; padding: 30px 38px 50px 38px; float: right; background-color: #e6e6e6; border-bottom: solid 1px #cccccc; border-right: solid 1px #cccccc; line-height: 1.7; box-shadow: 0 3px 6px #dddddd inset;}
.footer_R a:hover{color: #000000;}
.footTitle{color: #999999; font-family: Content; font-size: 13px; margin-right: 10px;}
.footTxt{color: #555555; font-family: Content; font-size: 13px; margin-right: 40px;}












/* HOME 화면 */
.color1{background-color: #80dae5;}/*민트*/
.color2{background-color: #ff867d;}/*다홍*/

.status_item{display: inline-block; width: 16px; height: 16px; margin-right: 8px; vertical-align: middle;}



.status_table{font-family: Content; width: 100%; text-align: center; font-size: 13px; color: #666666; margin-top: 8px;}
.status_table th:first-child, .status_table td:first-child{border: none; text-align: left;}
.status_table td{height: 25px; border-top: solid 1.5px #cccccc; border-bottom: solid 1.5px #cccccc; line-height: 25px;}

.ticks td{border-top: none;}





.whole_status{font-family: Content; width: 100%; text-align: center; color: #666666;}
.whole_status th{height: 30px; font-size: 14px; font-weight: normal; border-bottom: solid 1px #cccccc; background-color: #0095a8; color: #ffffff;}
.whole_status td{height: 30px; font-size: 14px; border-bottom: solid 1px #cccccc;}

.whole_status2{font-family: Content; width: 100%; text-align: center; color: #666666;}
.whole_status2 th{height: 30px; font-size: 14px; font-weight: normal; border-bottom: solid 1px #cccccc; background-color: #0095a8; color: #ffffff;}
.whole_status2 td{height: 30px; font-size: 14px; }



.book_badge{width: 25px; float: left;}