@charset "utf-8";
/* SIR 지운아빠 */

/* ### 기본 스타일 커스터마이징 시작 ### */

/* 버튼 */
.mbskin .contents{padding: 0 1em}
.mbskin a.btn01 {}
.mbskin a.btn01:focus, .mbskin .btn01:hover {}
.mbskin a.btn02 {}
.mbskin a.btn02:focus, .mbskin .btn02:hover {}
.mbskin .btn_confirm {} /* 서식단계 진행 */
.mbskin .btn_submit {  padding: 0 3em; font-size: larger; }
.mbskin button.btn_submit {}
.mbskin fieldset .btn_submit {}
.mbskin .btn_cancel {}
.mbskin button.btn_cancel {}
.mbskin .btn_cancel:focus, .mbskin .btn_cancel:hover {}
.mbskin a.btn_frmline, .mbskin button.btn_frmline {} /* 우편번호검색버튼 등 */
.mbskin button.btn_frmline {}
.mbskin .win_btn {margin-top: 2em} /* 새창용 */
.mbskin .win_btn button {padding: 0.5em 1em; border-radius: 0.6em;}
.mbskin .win_btn input {}
.mbskin .win_btn a {}
.mbskin .win_btn a:focus, .mbskin .win_btn a:hover {}
/* 게시판용 버튼 */
.mbskin a.btn_b01 {}
.mbskin a.btn_b01:focus, .mbskin .btn_b01:hover {}
.mbskin a.btn_b02 {}
.mbskin a.btn_b02:focus, .mbskin .btn_b02:hover {}
.mbskin a.btn_admin {} /* 관리자 전용 버튼 */
.mbskin a.btn_admin:focus, .mbskin a.btn_admin:hover {}

/* 기본테이블 */
.mbskin .tbl_head01 {;}
.mbskin .tbl_head01 caption {}
.mbskin .tbl_head01 thead th {}
.mbskin .tbl_head01 thead a {}
.mbskin .tbl_head01 thead th input {} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.mbskin .tbl_head01 tfoot th {}
.mbskin .tbl_head01 tfoot td {}
.mbskin .tbl_head01 tbody th {}
.mbskin .tbl_head01 td {}
.mbskin .tbl_head01 a {}
.mbskin td.empty_table {}

/* 폼 테이블 */
.mbskin table {}
.mbskin caption {}
.mbskin .frm_info {}
.mbskin .frm_file {}

.mbskin .tbl_frm01 {}
.mbskin .tbl_frm01 th {}
.mbskin .tbl_frm01 td {}
.mbskin .tbl_frm01 textarea, .mb_skin tbl_frm01 .frm_input {}
.mbskin .tbl_frm01 textarea {}
/*
.mbskin .tbl_frm01 #captcha {}
.mbskin .tbl_frm01 #captcha input {}
*/
.mbskin .tbl_frm01 a {}

/* 필수입력 */
.mbskin .required, .mbskin textarea.required {}

/* 테이블 항목별 정의 */
.mbskin .td_board {}
.mbskin .td_chk {}
.mbskin .td_date {}
.mbskin .td_datetime {}
.mbskin .td_group {}
.mbskin .td_mb_id {}
.mbskin .td_mng {}
.mbskin .td_name {}
.mbskin .td_nick {}
.mbskin .td_num {}
.mbskin .td_numbig {}

.mbskin .txt_active {}
.mbskin .txt_expired {}

/* ### 기본 스타일 커스터마이징 끝 ### */

/* 회원가입 약관 */
#fregister textarea {display:block; margin-bottom: 20px; padding: 1rem; width:100%; border:1px solid #ebebeb; background:#fff; resize: none; border-radius: 0.25rem; font-size: 0.9rem; text-align: justify; border-radius: 10px; line-height: 1.3; word-break: break-all; text-align: justify;}
#fregister .fregister_agree {padding:10px 0 0;text-align:right}
#fregister .fregister_agree label {display:inline-block;margin-right:5px}
#fregister_term p {line-height: 1.8em;  margin-bottom: 1em; font-weight: 400}

#fregister .btn_confirm {text-align: center;}
#fregister_private .tbl_head01 th{text-align:center;border:1px solid #ebebeb; width:33%}
#fregister_private .tbl_head01 td {border:1px solid #ebebeb; text-align: center;}
#fregister_private .tbl_head01 caption{font-size:0;line-height:0;overflow:hidden}
textarea::-webkit-scrollbar-thumb{border-radius: 10px; background: #ccc;}
textarea::-webkit-scrollbar{width: 5px; background: transparent;}

/* 회원가입 입력 */
#fregisterform textarea {height:50px}

#fregisterform #msg_certify {margin:5px 0 0;padding:5px;border:1px solid #dbecff;background:#eaf4ff;text-align:center}
#fregisterform #mb_addr3 {display:inline-block;margin:5px 0 0;vertical-align:middle}
#fregisterform #mb_addr_jibeon {display:block;margin:5px 0 0}

/* 회원가입 완료 */
#reg_result {padding:50px 0 0}
#reg_result #result_email {margin:20px 0;padding:10px 50px;border-top:1px solid #e9e9e9;border-bottom:1px solid #dde4e9;background:#fff;line-height:2em}
#reg_result #result_email span {display:inline-block;width:150px}
#reg_result #result_email strong {color:#e8180c;font-size:1.2em}
#reg_result p {line-height:1.8em}
#reg_result .btn_confirm {margin:50px 0}

/* 아이디/비밀번호 찾기 */
#find_info #mb_hp_label {display:inline-block;margin-left:10px}
#info_fs{margin-bottom: 0.5em;}
#find_info #info_fs .frm_input {width: calc(100% - 100px); background-color: #fff; border: 1px solid #ebebeb; padding: 0.5em; border-radius: 0.6em;}
#find_info #info_fs .email_txt{display: inline-block; vertical-align: middle; font-weight: 600; width: 95px; }
#find_info p {margin: 2em 0;line-height:1.8em; font-size: 16px; text-align: center;}
#find_info #captcha #captcha_key{background-color: #fff;}

/* 로그인 */
#mb_login {margin:0 auto;padding:100px 0;width:500px}
#mb_login h1 {margin:0 0 20px;font-size:1.3em}
#mb_login h2 {margin:0}
#mb_login p {padding:10px 0;line-height:1.5em}
#mb_login #login_fs {position:relative;margin:0;padding:20px 20px 20px 95px;border:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_login #login_fs legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#mb_login #login_fs label {letter-spacing:-0.1em}
#mb_login #login_fs .login_id {position:absolute;top:26px;left:95px}
#mb_login #login_fs .login_pw {position:absolute;top:52px;left:95px}
#mb_login #login_fs .frm_input {display:block;margin:0 0 5px 80px;width:162px}
#mb_login #login_fs .btn_submit {position:absolute;top:20px;right:95px;width:60px;height:53px}
#mb_login #login_info {margin:0 0 30px;padding:20px;border:1px solid #cfded8;background:#f5f6fa}
#mb_login #login_info div {text-align:right}

/* 쪽지 */
#memo_view_contents {margin:0 auto 20px;width:90%}
#memo_view_contents h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#memo_view_ul {margin:0;padding:0 0 10px;border-bottom:1px solid #ebebeb;list-style:none}
.memo_view_li {position:relative;padding:5px 0}
.memo_view_subj {display:inline-block;width:65px}
#memo_view p {padding:10px 0;min-height:150px;height:auto !important;height:150px;background:#fff;line-height:1.8em}

#memo_write textarea {height:100px}

/* 스크랩 */
#scrap_do table {margin:0 0 10px;width:100%}
#scrap_do textarea {height:100px}

/* 회원 비밀번호 확인 */
#mb_confirm {margin:0 auto;padding:100px 0;max-width:500px;width:100%}
#mb_confirm h1 {font-size: 2em; text-align: center; font-weight: 600; letter-spacing: -0.02em;}
#mb_confirm p {margin: 1em auto; color: #999; text-align: center;}
#mb_confirm p strong {text-align: center; display: block; font-size: 1.1em; font-weight: 500; color: #333;}
#mb_confirm dl {margin:0 0 3em; padding:2em; border:1px solid #ebebeb; background:#fbfbfb; }
#mb_confirm dl dt, #mb_confirm dl dd{float: left;}
#mb_confirm dl dt{font-weight: 600; width: 80px; line-height: 2.5em;}
#mb_confirm dl dd{width: calc(100% - 80px);}
#mb_confirm dl .frm_input{float: left; display: block; width: calc(100% - 5.5em)}
#mb_confirm dl .btn{float: left; display: block; width: 5.25em; margin-left: 0.25em; padding: 0.25em}
#mb_confirm_id{font-weight: 700;}
#mb_confirm fieldset{padding: 2em; border: 1px solid #ebebeb; background-color: #f7f7f7; border-radius: 1em;}
.div_id {margin-bottom: 0.5em;}
.div_id > span:first-child{width: 85px; display: inline-block;}
.div_pw > label{vertical-align: middle; width: 85px; display: inline-block;}
.div_pw input{display:inline-block; background-color: #fff; border: 1px solid #ebebeb; width: calc(100% - 91px); padding: 0.5em; border-radius: 0.6em;}

/* 비밀글 비밀번호 확인 */
#pw_confirm{margin: 5em auto;}
#pw_confirm h3{font-size: 2em; text-align: center; letter-spacing: -0.04em; font-weight: 600; margin: 1em auto 0.5em auto;}
#pw_confirm .cont_title p{font-size: 1.1em; text-align: center; word-break: keep-all;}
#pw_confirm .cont_title strong{display: block; }
#pw_confirm .btn_confirm{text-align: center; display: flex; gap: 0.25em; justify-content: center;}
#pw_confirm .btn_confirm *{margin: 0;}
.cont_login{padding: 2em; background-color: #f7f7f7; border: 1px solid #ebebeb; border-radius: 1em; max-width: 500px; margin: auto;}
.cont_login h4{font-size: 1.2em; font-weight: 500; padding-bottom: 0.25em; border-bottom: 1px dashed #ebebeb; margin-bottom: 0.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.login_box label{display: inline-block; width: 4.5em;}
.login_box input{display: inline-block; width: calc(100% - 4.5em - 5px); padding: 0.5em; border: 1px solid #ebebeb; border-radius: 0.6em;}
/* 폼메일 */
#formmail #subject {width:386px}
#formmail textarea {height:100px}

/* 자기소개 */
#profile table {margin-bottom:0}
#profile section {margin:0 auto 20px;padding:20px;width:86%}
#profile h2 {margin:0}


@media screen and (max-width: 850px){
	.new_win{width: 95%; margin: 5% auto; max-width: 400px;}
	#find_info.new_win{max-width: none;}
	
}

/* ========== k-news 변경 ========== */
#body{background-color: #f4f6f8;}
#footer{background-color: #fff;}

/* 회원가입 변경 */
input{-webkit-appearance: none; -moz-appearance: none; appearance: none;}
button:focus {outline: none;}
.re_btn{display: block; width: 100%; padding: 0.5rem 2rem; line-height: 2; text-align: center; border: 1px solid #ebebeb; background-color: #fff; border-radius: 0.6em}

.register_box{position: relative; width: 90%; padding: 5em 0;max-width: 500px; margin: 0 auto; min-height: 100vh;}
.register_box #hlogo {margin-bottom: 2em;}
.register_box #hlogo a{display: block; text-align: center; width: 50%; max-width: 200px; margin: 0 auto;}
.register_box #hlogo a img{display: block; width: 100%;}
.register_box .cancle{position: absolute; top: 5vh; left: 0;}
.register_box .cancle a{color: #bbb}
.register_box .btn_confirm{text-align: center; display: flex; gap: 0.25em; justify-content: center;}
.register_box .btn_confirm .btn_big{margin: 0;}
.register_box .center{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%;}


#register div.text{margin: 2rem auto; }
#register h2{font-size: 1.6rem; line-height: 1.4; font-weight: 500; letter-spacing: -0.04em;}
#register div.text label{margin: 20px 0 10px 0; box-shadow: 0 1px 6px 0 rgba(0,0,0,.1);}
#register .btn_big{width: 100%; line-height: 2; max-width: none; box-shadow: 0 1px 6px 0 rgba(0,0,0,.1); padding: 0.5rem;}
label.all_agree{position: relative;}
label.all_agree:hover{cursor: pointer;}
label.all_agree i{position: absolute; top: 50%; left: 1rem; transform: translateY(-50%); color: #333;}
#register > div > span{color: #777; font-weight: 400; font-size: 0.9rem;}
#fregister > section{position: relative;}
#fregister > section label{font-size: 1.1rem; vertical-align: middle;}
#fregister > section label:hover{cursor: pointer;}


#fregister input[type=checkbox]{width: 1.5rem; height: 1.5rem; margin-right: 0.5rem; border: 1px solid #ddd; border-radius: 50%; vertical-align: middle;}

#fregister_private{margin-top: 20px}
.btn_confirm{margin-top: 2em;}
.btn_confirm .re_btn{background-color: #333; color: #fff;}

.detail{position: absolute; top: 50%; right: 0; transform: translateY(-50%); color: #333}
.agree_con{display: none; margin-top: 1em;}
.all_agree.on{border: 1px solid #1a1a1a; background-color: #fefefe; color: #1a1a1a; transition-duration: 100ms;}
.all_agree.on span{font-weight: 500;}
.all_agree.on i{color: #1a1a1a; transition-duration: 100ms;}

#agree_all{position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1;}
#agree_con_2 td{text-align: center; font-size: 0.9rem; padding: 1rem 0.5rem; border-bottom: 1px solid #ebebeb; line-height: 1.3; vertical-align: middle;}
#agree_con_2 th{padding: 1rem 0.5rem; border: 1px solid #ebebeb; border-style: solid none; font-weight: 500; background-color: #fff; font-size: 0.95rem;}
#agree_con_2 caption{padding: 0; font-size: 0; line-height: 0; overflow: hidden;}
#agree_all:hover{cursor: pointer;}


.re_form1 li {position: relative;}
.re_form1 li > div{position: relative;}
.re_form1 li i{position: absolute; top: 50%; left: 0.75em; transform: translateY(-50%); color: #ccc}
.re_form1 li input{background-color: #fff; border: 1px solid #ebebeb; padding: 0.5rem; padding-left: 2.5rem; line-height: 2; font-size: 0.9rem; border-radius: 10px; box-shadow: 0 1px 6px 0 rgba(0,0,0,.08);}
.re_form1 label{font-size: 0.9rem; display: block; margin: 0.25em;}
.mbskin button.btn_frmline{display: block; width: 100%; padding: 0.5em; margin: 0.5rem 0; font-size: 0.9rem; line-height: 2;}
#reg_mb_zip, #reg_mb_addr1, #reg_mb_addr2, #reg_mb_addr3{padding-left: 0.5em;}

#register_form p.text{font-size: 1.2em; margin: 2em 0 1em 0; color: #000}
.re_form1 input{width: 100%;}
.re_form1 li + li{margin-top: 10px;}
.re_form1 li > p{margin-top: 10px; color: #888; font-size: 0.8rem; line-height: 1.3;}
#id_box > div{position: relative;}
.re_form1 li > div .btn{position: absolute; top: 50%; transform: translateY(-50%); right: 10px;padding: 0.6rem; border-radius: 0.5rem; font-size: 0.8rem;}

#register_form input[type=checkbox]{width: 1.1rem; height: 1.1rem; margin-right: 5px; border: 1px solid #ddd; border-radius: 50%;}
#register_form input[type=checkbox]:checked{content: ""; background: #1a1a1a url("./img/check.png") no-repeat center; background-size: 70%; border: 1px solid #333;}
.re_form2 li{margin-top: 10px;}
.re_form2 label{vertical-align: middle; font-size: 0.9rem;}

#reg_result {position: relative;}
#reg_result > div{position: absolute; top: 50%; transform: translateY(-50%)}

#login_box h1{font-size: 3em; margin-bottom: 0.5em; font-weight: 700; text-align: center; color: #1a1a1a;}

#captcha.m_captcha #captcha_key{max-width: none}

/* 추가 */

#login_input li {position: relative; margin-bottom: 0.5em;}
#login_input li i{position: absolute; left: 1.25em; top: 50%; transform: translateY(-50%); color: #ccc}
#login_input input{width: 100%; border: 1px solid #ebebeb; border-radius: 2rem; padding: 0.5rem 0.5rem 0.5rem 3rem ; line-height: 2rem; background-color: #fff; box-shadow: 0 1px 6px 0 rgba(0,0,0,.1);}
#login_input input:focus{box-shadow: 0 1px 6px 0 rgba(0,0,0,.3);}
#login_input li.login_btn input{padding: 0.5rem; font-weight: 500;  text-align: center;}

#login_btn{display: block; width: 100%; font-weight: 600; color: #fff; background: #1a1a1a !important; padding: 0.5em; line-height: 2em; border-radius: 2em;} 

.login_box > ul{/* display: none;  */margin: 1.5em auto 0 auto;}
.login_box > ul li{float: left; width: 50%; text-align: center;}
.login_box > ul li + li::before{content:"｜"; display: inline-block; clear: both; float: left; color: #ddd}

.btn_submit{background-color: #333;}
.btn_submit:hover{background-color: #fbfbfb; border: 1px solid #ddd; color: #666; font-weight: 500; transition-duration: 100ms;}
.register_box a.btn{display: block;}

.btn_bottom{display: flex; justify-content: center; gap: 0.25em; margin: 2em auto 0 auto;}
.big_1{border: 1px solid #ccc; background-color: transparent; color: #666;}
.big_2{border: 1px solid #1a1a1a; background-color: #1a1a1a; color: #fff;}
.btn_bottom input{font-size: 1em;}

#mb_confirm .btn_big{margin: 0;}

/* 비회원 비밀글 테스트 */
.pass_check .bo_title {font-size: 2em; font-weight: 600; text-align: center; letter-spacing: -0.04em;margin: 1em 0;}
#secret {max-width: 640px; margin: auto;}
#secret h3{font-size: 1.3em; line-height: 1.4; font-weight: 500; letter-spacing: -0.04em; padding: 0.5em 0.25em; border: 1px solid #ebebeb; border-style: solid none; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
#secret > div{margin-top: 1em;}
#secret .login_box{display: flex; width: fit-content; gap: 0.25em;}
#secret .login_box > div{position: relative;}
#secret .login_box > div input{padding: 0.5em 0.5em 0.5em 2em; border: 1px solid #ebebeb; border-radius: 4px;}
#secret .login_box > div label{position: absolute; top: 50%; left: 1em; transform: translateY(-50%)}
#secret .btn_big{width: fit-content;}
#secret p{margin: 1em 0; text-align: center; word-break: keep-all;}
#secret p > strong{display: block;}

@media screen and (max-width: 1280px) {
	#pw_confirm h3{font-size: 1.8em;}
	#pw_confirm .cont_title p{font-size: 1em;}
}
@media screen and (max-width: 1080px) {
	.pass_check .bo_title {font-size: 1.8em;}
	.btn_big{font-size: 15px;}
}
@media screen and (max-width: 768px) {
	.pass_check .bo_title {font-size: 1.6em;}
	#secret h3{font-size: 1.1em;}
	.btn_big{font-size: 14px;}
}
@media screen and (max-width: 475px) {
	.btn_big{font-size: 13px;}
}
@media screen and (max-width: 450px) {
	#register h2{font-size: 1.6em;}
	#fregister > section{font-size: 1.2em}
	.mbskin button.btn_frmline{}
	#fregister > section label{font-size: 14px;}
	.join_complete > p{font-size: 1.2em;}
}
@media screen and (max-width: 425px) {
	#pw_confirm h3{font-size: 1.8em;}
	.cont_login{padding: 1.5em}
}