@charset "UTF-8";


/** ------------------------------------------------------
----------------------------------------------------------
CSS ORDER
1. LOGIN
2. ERROR
3.  
4. 
5. 
---------------------------------------------------------
------------------------------------------------------ */


#contents .contents_txt {margin: 4.375rem 0; font-size: 1.5rem; line-height: 2.5rem; letter-spacing: -0.08rem; font-weight: 400; word-break:keep-all;}
#contents .desc {font-size: 1.125rem; color: #666; text-align: left; width: fit-content; margin: 0 auto; word-break:keep-all;}

@media (max-width: 768px) {
	#contents .contents_txt {font-size: 1.4rem;}
} 


/* ------------------------------------------------------
1. 안내 Q&A
------------------------------------------------------ */
.qna_group {text-align:left;}
.qna_group li {position: relative; border: 1px solid #e9e9e9; border-radius: 1.25rem; letter-spacing: -0.063rem; margin-bottom: 0.625rem; cursor: pointer; }
.qna_group .qna_q {display: flex; align-items: center; justify-content: space-between; padding: 0.938rem 1.875rem 0.938rem 2.5rem; font-size: 1.25rem; font-weight: 500; word-break:keep-all;}
.qna_group .qna_q p {display: flex; align-items: center; }
.qna_group .qna_a {display:none; border-top: 1px solid #e9e9e9; padding: 0.938rem 1.875rem 0.938rem 2.5rem; font-size: 1.125rem; font-weight: 300; line-height: 1.8rem; word-break:keep-all;}
.qna_group .qna_a .qna_a_group {display: flex; align-items: flex-start; }
.qna_group .qna_a .qna_a_group .qna_a_txt {margin-top: 0.375rem; display: flex; flex-direction: column; font-weight: 400;}
.qna_group li .icon {width: 2.5rem; margin-right: 0.938rem;}
.qna_group .qna_q button {width: 2.5rem; height: 2.5rem; text-indent: -9999em; background: url("../images/btn_open.png") no-repeat 50% 50%; background-size: 100% auto;}
.qna_group li.on .qna_q button {width: 2.5rem; height: 2.5rem; text-indent: -9999em; background: url("../images/btn_close.png") no-repeat 50% 50%; background-size: 100% auto;}
.qna_group li.on .qna_a {display:block;}
.qna_group .qna_a .btn_group {margin-bottom: 0.5rem;}
.qna_group .qna_a .btn_group button {font-size: 1rem; line-height: 2.875rem; height: 2.875rem; letter-spacing: -1px; padding: 0 0.625rem 0 3.5rem; margin-right: 0.375rem; margin-top: 0.625rem;}
.qna_group .qna_a .btn_group button.btn_blue {border: 1px solid #003b95; background: url("../images/icon_down.png") no-repeat 0 50%; background-size: 2.875rem auto;}
.qna_group .qna_a .btn_group button.btn_cyan {border: 1px solid #006464; background: url("../images/icon_info.png") no-repeat 0 50%; background-size: 2.875rem auto;}

.qna_group .qna_a .tbl_group {border:1px solid #e9e9e9; margin-top: 1rem; margin-bottom: 0.625rem; text-align:center; border-radius: 0.625rem; font-size: 1rem;}
.qna_group .qna_a .tbl_group th {background-color: #f9f9f9; padding: 0.375rem 0; border-bottom: 1px solid #e9e9e9; }
.qna_group .qna_a .tbl_group td {padding: 0.375rem 0; border-bottom: 1px solid #e9e9e9; }

@media (max-width: 768px) {
	.qna_group .qna_q {padding: 1rem 1rem 1rem 1.5rem;}
	.qna_group .qna_q p {max-width: 85%;}
	.qna_group .qna_a {padding: 1rem 1rem 1rem 1.5rem;}
	.qna_group .qna_a p span {display:block; margin-top:0.5rem;}
	.qna_group li .icon {width: 3rem; margin-right: 0.75rem;}
	.qna_group .qna_q button {width: 3rem; height: 3rem; text-indent: -9999em; background: url("../images/btn_open.png") no-repeat 50% 50%; background-size: 100% auto;}
	.qna_group li.on .qna_q button {width: 3rem; height: 3rem; text-indent: -9999em; background: url("../images/btn_close.png") no-repeat 50% 50%; background-size: 100% auto;}
	.qna_group li.on .qna_a {display:block;}
	.qna_group .qna_a .btn_group button {display:block; font-size: 1rem; line-height: 3rem; height: 3rem; letter-spacing: -0.1rem; padding: 0 1.25rem 0 4.25rem; margin-right: 6px; margin-top: 0.5rem;}
	.qna_group .qna_a .btn_group button.btn_blue {border: 0.125rem solid #003b95; background: url("../images/icon_down.png") no-repeat 0 50%; background-size: 3rem auto;}
	.qna_group .qna_a .btn_group button.btn_cyan {border: 0.125rem solid #006464; background: url("../images/icon_info.png") no-repeat 0 50%; background-size: 3rem auto;}
} 


/* ------------------------------------------------------
2. 약관동의
------------------------------------------------------ */
.agree_group {text-align:left; }
.agree_group li {display: flex; align-items: center; justify-content: space-between; border: 1px solid #e9e9e9; border-radius: 1.25rem; letter-spacing: -0.063rem; margin-bottom: 0.625rem; padding: 1rem 2.5rem;}
.agree_group button {font-size: 1.125rem; text-decoration: underline; font-family: "Noto Sans KR"; font-weight: 100;}
.agree_group.all {border: 1px solid #fff; padding: 0.75rem 2.5rem 0 2.5rem;}
.agree_group.all label {display: inline-block; position:relative; font-size: 1.125rem; line-height: 2.25rem; color:#000; font-weight: 400; cursor: pointer; padding-left: 3.2rem; }
.txt_important {font-weight: 100; color: #ff5151; margin-top: 0.625rem; font-weight: 400;}



/* ------------------------------------------------------
3. 본인인증
------------------------------------------------------ */
.confirm_group {width: 43.75rem; border:1px solid #e9e9e9; border-radius: 1.25rem; margin:0 auto; text-align:left;}
.confirm_group li {display: flex; align-items: center; padding: 1rem 2.5rem; border-bottom: 1px solid #e9e9e9; font-size: 1.25rem; letter-spacing: -0.125rem}
.confirm_group li:last-child { border-bottom: 0;}
.confirm_group li span {flex-basis: 10rem; font-weight: 400;}
.confirm_group li div {display: flex; align-items: center; justify-content: space-between; width:100%;}
.confirm_group li div.confirm_check {display: flex; align-items: flex-start; flex-direction: column;}
.confirm_group li div.confirm_check p {font-size: 1rem; letter-spacing: -0.04rem; margin-top: 0.625rem; word-break:keep-all; }
.confirm_btn {margin-bottom: 5rem;}
.confirm_btn li {display: inline-block; font-size:0 }
.confirm_btn li + li {margin-left: 1.875rem;}
.confirm_btn .btn_phone {display: inline-block; width: 12.5rem; height: 12.5rem; background: url("../images/btn_confirm_phone.png") no-repeat 50% 50%; text-indent: -9999px; background-size: 12.5rem auto;}
.confirm_btn .btn_ipin {display: inline-block; width: 12.5rem; height: 12.5rem; background: url("../images/btn_confirm_ipin.png") no-repeat 50% 50%; text-indent: -9999px; background-size: 12.5rem auto;}
.confirm_group.mail li div {position: relative;}
.confirm_group.mail li span {flex-basis: 6rem;}
.confirm_group.mail button {flex-basis: 15rem; letter-spacing: -0.1rem; margin-left: 0.4rem; margin-top:0; font-size: 1rem;}
.confirm_group.mail .time {position: absolute; top:0; right:1.5rem; color: #ff5151; font-weight: 400; line-height: 3.125rem; letter-spacing: -0.05rem;}

.confirm_errer {font-size: 1rem; letter-spacing: -0.06rem; margin-top: 0.8rem; word-break:keep-all; color:#006464; font-weight: 400;}


@media (max-width: 768px) {
	.confirm_group {width: 100%; }
	.confirm_group li {padding: 1rem 1.5rem; }
	.confirm_group li span {flex-basis: 12rem}
} 

@media (max-width: 480px) {
	.confirm_btn li + li {margin-left: 2%;}
	.confirm_group.mail button {font-size: 1rem;}

} 

@media (max-width: 396px) {
	.confirm_btn .btn_phone {width: 11rem; height: 11rem; background-size: 11rem auto;}
	.confirm_btn .btn_ipin {width: 11rem; height: 11rem; background-size: 11rem auto;}
	.confirm_group.mail button {font-size: 0.6rem;}
}



/* ------------------------------------------------------
4. Popup
------------------------------------------------------ */
.popup_wrap {display:none;}
.popup_wrap.on {display:block;}
/*
.popup_wrap .popup_group {display:flex; justify-content: center; align-items: center; width: 100%; height: 100%; position: fixed; top:0; left:0; background-color:rgb(0,0,0,0.5); z-index: 100;}
*/
.popup_wrap .popup_group {display:flex; justify-content: center; align-items: center; width: 100%; height: 100vh; height: calc(var(--vh, 1vh) * 100); position: fixed; top:0; left:0; background-color:rgb(0,0,0,0.5); z-index: 100;}
.popup_wrap .popup_group .popup_box {width: 62.5rem; height: 50rem; border-radius: 1.875rem; background-color: #fff; overflow:hidden;}
.popup_wrap .popup_group .popup_box .popup_title {position:relative; width:100%; height:4.375rem; background-color: #000; font-size: 1.375rem; text-align: center; color:#fff; font-weight: 400; line-height: 4.375rem;}
.popup_wrap .popup_group .popup_box .popup_title .popup_close {position:absolute; top:0; right:0; width:4.375rem; height:4.375rem; background: url("../images/btn_m_x_w.png") no-repeat 50% 50%; background-size: 30% auto; text-indent: -9999em;}
.popup_wrap .popup_group .popup_box .popup_cont {width:100%; height: 690px; padding: 1.875rem; padding-bottom: 0; overflow:hidden; overflow-y: scroll; word-break:keep-all; font-size: 1rem; font-weight: 100;}
.popup_wrap .popup_group .popup_box .popup_cont p {margin-bottom: 1rem; font-weight: 400;}
.popup_wrap .popup_group .popup_box .popup_cont p span {display:block; font-weight: 600;}

@media (max-width: 1024px) {
	.popup_wrap .popup_group .popup_box {width: 100%; height: 100vh; border-radius: 0; background-color: #fff; overflow:hidden; padding-bottom: 1.875rem; }
	.popup_wrap .popup_group .popup_box .popup_cont {height: 100%; padding-bottom: 5rem; }

} 



/* ------------------------------------------------------
5. 정보입력
------------------------------------------------------ */
.info_group {text-align:left; margin-top: 3.125rem;}
.info_group ul {position: relative; border: 1px solid #e9e9e9; border-radius: 1.25rem; letter-spacing: -0.04rem;}
.info_group li {display: flex; align-items: center; padding: 0.625rem 2.5rem; border-top: 1px solid #e9e9e9; font-size: 1.25rem; letter-spacing: -0.1rem; word-break:keep-all; min-height: 3.125rem;}
.info_group li:first-child { border-top: 0;}
.info_group li span {flex-basis: 20rem; font-weight: 400;}
.info_group li div {display: flex; align-items: center; width:100%;}
.info_group ul.comp_radio {border:0;}
.info_group ul.comp_radio li {border:0; padding:0; margin-right: 1.5rem;}
.info_group ul.comp_radio li:last-child {margin-right: 0;}
.info_group .info_address {display: flex; align-items: flex-start; flex-direction: column;}
.info_group .info_address .address_num {width: 50%; margin-bottom: 0.625rem;}
.info_group .info_address div + div {margin-bottom: 0.625rem;}
.info_group .info_address p {font-size: 1rem; letter-spacing: -0.04rem;}
.info_group .info_address div:last-child {margin-bottom: 0;}
.info_group .info_address button {flex-basis: 12rem; letter-spacing: -0.1rem; margin-left: 0.4rem; margin-top:0; font-size: 1rem;}
.info_group .info_address div input + input {margin-left: 0.5rem;}
.info_group .info_pay {display: flex; align-items: flex-start; flex-direction: column; position:relative;}
.info_group .info_pay button {position: absolute; top: 0; right: 0; font-weight: 100; font-size: 1.125rem; letter-spacing: -0.1rem; line-height: 3.125rem; text-decoration: underline; }
.info_group .info_pay p {font-size: 1rem; }
.info_group .info_tel {display: flex; align-items: flex-start; flex-direction: column;}
.info_group .info_tel div input:first-child { width: 30%;}
.info_group .info_tel div input + input {margin-left: 0.5rem;}

.info_group .info_payment {display: flex; align-items: flex-start; flex-direction: column;}
.info_group .info_payment p {font-size: 1rem; margin-top: 0.4rem;}
.info_group .info_check {justify-content: space-between;}
.info_group .info_check button {font-size: 1.2rem; text-decoration: underline; letter-spacing: -0.1rem;}
.info_group .comp_radio li {font-size: 1.125rem;}
.info_group .info_file {display: flex; align-items: flex-start; flex-direction: column;}
.info_group .info_file p {font-size: 1rem; margin-bottom: 0.4rem; letter-spacing: -0.04rem;}
.info_group .info_file p.txt_important {margin-bottom: 0;}
.info_group .info_file .file_attach {display: flex; }
.info_group .info_file .file_attach .txt_important {margin-top:0;}
.info_group .info_file .file_attach button {letter-spacing: -0.1rem; margin-right: 0.4rem; margin-top:0; font-size: 1rem;}
.info_group .info_file .file_attach .attachments {display: block; position:relative; width: 100%; flex-basis: auto; height: 3.125rem; padding: 0 1.5rem; line-height: 3.125rem; background-color: #f5f5f5; border-radius: 1.563rem; font-size: 1rem; font-family: "Roboto", "Noto Sans KR"; letter-spacing: -0.04rem; color: #666;}
.info_group .info_file div {margin-bottom: 0.625rem;}
.info_group .info_type {display: flex; align-items: flex-start; flex-direction: column;}
.info_group .info_type p {font-size: 1rem; }
.info_group .info_file .file_attach button.btn_remove {position: absolute; right: 0.6rem; top: 30%; border-radius: 100px; width: 1.25rem; height: 1.25rem; background: url(/static/admin/images/common/btn_remove.jpg) no-repeat 50% 50%; text-indent: -999em; background-size: 100% auto;}

.info_group .txt_desc {font-weight: 100; color: #006464; font-weight: 400;}
.info_group .mail div {position: relative;}
.info_group .mail button {flex-basis: 15rem; letter-spacing: -0.1rem; margin-left: 0.4rem; margin-top:0; font-size: 1rem;}
.info_group .mail .time {position: absolute; top:0; right:1.5rem; color: #ff5151; font-weight: 400; line-height: 3.125rem; letter-spacing: -0.05rem;}


@media (max-width: 1024px) {
	.info_group .info_address .address_num {width: 70%; }
} 
@media (max-width: 768px) {
	.info_group li {padding: 1rem 1.5rem; font-size: 1.125rem; }
	.info_group li span {flex-basis: 10rem; margin-right: 0.625rem}
	.info_group .info_address .address_num {width: 100%; }
	.info_group .info_address span {margin-right: 0;}
	.info_group .info_payment div {flex-direction: column; align-items: flex-start;}
	.info_group .info_payment div select {margin: 0 0 0.625rem;}
	.info_group .info_payment input[class^=comp_input] {width: 80%;}
	.info_group .info_check button {font-size: 1rem;}
	.info_group ul.comp_radio li {margin-right: 0.8rem;}
	

} 
@media (max-width: 680px) {
	.info_group .info_address .address_num {width: 100%; }
	.info_group input[class^=comp_input] {padding:0 1rem;}
	.info_group select[class^=comp_select] {padding:0 1rem;}
	.info_group textarea[class^=comp_textarea] {padding:1rem 1rem;}
} 



/* ------------------------------------------------------
6. 전적신청
------------------------------------------------------ */
.transfer_btn {width: 640px; margin: 0 auto; margin-bottom: 5rem; }
.transfer_btn ul {display: flex; justify-content: space-between;}
.transfer_btn li span {font-size:0 }
.transfer_group li span {flex-basis: 12rem; font-weight: 400;}
.transfer_group .transfer_nation .comp_select {width: 50%}
.transfer_phone .txt_desc {font-size: 1rem; color:#000;}


@media (max-width: 768px) {
	.transfer_btn {width: 100%;}
	.transfer_btn li {flex-grow: 1;}
	.transfer_btn li img {width: 97%}
	.transfer_group .transfer_nation .comp_select {width: 100%}
}




/* ------------------------------------------------------
당원 정보
------------------------------------------------------ */
*[class^=comp_tab].member_tab {position: relative; }
*[class^=comp_tab].member_tab ul {border-radius: 1.25rem; width: 100%; font-size: 0; overflow: hidden; border: 0; background-color: #fff; display: flex; justify-content: center; align-items: center; }
*[class^=comp_tab].member_tab ul:after {display:block; clear:both; content:""}
*[class^=comp_tab].member_tab li {flex-grow: 1; box-sizing: border-box; font-size: 1.5rem; letter-spacing: -0.08rem; color: #003b95; line-height: 4.375rem; font-weight: 500; text-align:center; clip-path: none; border: 1px solid #003b95; }
*[class^=comp_tab].member_tab li.on {color: none; background-color: none;}
*[class^=comp_tab].member_tab li+li {margin-left:-1px;}
*[class^=comp_tab].member_tab li:first-child {clip-path: none; border-radius: 1.25rem 0 0 1.25rem; }
*[class^=comp_tab].member_tab li:last-child {clip-path: none; border-radius: 0 1.25rem 1.25rem 0;}
*[class^=comp_tab].member_tab li a {display: block; position: relative; text-align: center; border: 0; border-bottom: 0; line-height: 4.375rem; color: #003b95; background-color: rgba(0, 0, 0, 0); font-weight: 500;  }
*[class^=comp_tab].member_tab a[aria-selected=true] {font-weight: 500; color:#fff; z-index: 1; background-color: #003b95; border:0;}
*[class^=comp_tab].member_tab a[aria-selected=true]:before {display: block; content: ""; position: absolute; left: 50%; margin-left: -8px; bottom: -1px; width: 0px; height: 0px; border-bottom: 8px solid #fff; border-left: 8px solid transparent; border-right: 8px solid transparent;}

.info_group .payment_summary {font-size : 1.25rem; color: #000; text-align:center; font-weight: 200; margin-bottom: 3.125rem;}
.info_group .payment_summary .year {font-weight:400; }
.info_group .payment_summary .amount {font-size: 1.8rem; line-height: 4rem; font-weight:700;}
.info_group .payment_summary .history {font-size: 1.6rem; line-height: 4rem; font-weight:700;}
.info_group .payment_summary ul {border: 0;  text-align:center; width: max-contents; width: max-content; margin: 0 auto; margin-top: 0.6rem; }
.info_group .payment_summary ul li {display: block; border: 0; min-height: auto; text-align: left; font-size: 1.125rem; letter-spacing: -0.04rem; padding:0}
.payment_summary_btm {text-align: right; padding-top:20px; margin-bottom: 50px;}
.payment_summary_btm .btnReceiptYear {font-size: 1rem; width: 10rem; height: 3rem; line-height: 3rem;}


*[class^=comp_board] tbody tr.refund td {color: #006464;}
*[class^=comp_board] tbody tr.refund td:nth-child(3) {color: #000;}
*[class^=comp_board] tbody tr.refund td:nth-child(4) {text-decoration: line-through; }
*[class^=comp_board] tbody *[class^=comp_btn] {margin-top: 0;}
*[class^=comp_board].list thead tr th {height: 3.125rem; border-top: 1px solid #e9e9e9; background-color: #f9f9f9;  border-bottom: 1px solid #e9e9e9;}
*[class^=comp_board].list tbody tr td:nth-child(3) {font-size: 1rem;}


.popup_wrap .popup_group .popup_box .popup_cont .payment_summary {margin-top: 1rem; font-size : 1.25rem; color: #000; text-align:center; font-weight: 200; margin-bottom: 3.125rem;}
.popup_wrap .popup_group .popup_box .popup_cont .payment_summary p {margin-bottom: 0.2rem; font-size: 1.125rem; font-weight:300;}
.popup_wrap .popup_group .popup_box .popup_cont .payment_summary p:first-child {margin-bottom: 0.6rem; font-size: 1.25rem; font-weight: 500;}
.popup_wrap .popup_group .popup_box .popup_cont .payment_summary p span {display: inline-block; font-size: 1.4rem; font-weight: 500; margin-left: 1rem;}
.popup_wrap .popup_group .popup_box .popup_cont .payment_btn {width: 100%; text-align: center;}

.popup_cont *[class^=comp_board] {max-width: 45rem; margin: 0 auto;}
.popup_cont *[class^=comp_board] tbody th {text-align: left;}
.popup_cont *[class^=comp_board] tbody td {text-align: right; font-size: 1.2rem;}


@media (max-width: 768px) {
	*[class^=comp_tab].member_tab li {font-size: 1.3rem;}

} 

@media (max-width: 520px) {
	*[class^=comp_tab].member_tab li {font-size: 1.2rem;}

}

@media (max-width: 538px) {
	*[class^=comp_board].list tbody tr td:nth-child(3) {font-size: 1rem;}


}

@media (max-width: 480px) {
	*[class^=comp_tab].member_tab li {font-size: 1rem;}

}



/* ------------------------------------------------------
복당 신청
------------------------------------------------------ */
.rejoin_desc {max-width: fit-content; margin: 0 auto; margin-top: -2rem; font-size: 1.25rem; font-weight: 300; text-align: left; word-break: keep-all; border: 1px solid #003b95; border-radius: 1.25rem; overflow: hidden;}
.rejoin_desc .rejoin_desc_h {display: inline-block; width: 100%; font-weight: 500; padding: 0 2rem; background-color: #003b95; line-height: 4rem; color: #fff;}
.rejoin_desc .rejoin_desc_c {padding: 1.5rem 2rem; font-weight: 400; }
.rejoin_desc .rejoin_desc_sub{margin-left: 1rem; font-size: 1.125rem; }
.rejoin_desc .btn_group {margin: 0.5rem 0;}
.rejoin_desc .btn_group button {font-size: 1rem; line-height: 2.875rem; height: 2.875rem; letter-spacing: -1px; padding: 0 0.625rem 0 3.5rem; margin-right: 0.375rem; margin-top: 0.625rem;}
.rejoin_desc .btn_group button.btn_blue {border: 1px solid #003b95; background: url("../images/icon_down.png") no-repeat 0 50%; background-size: 2.875rem auto;}
.rejoin_desc .btn_group button.btn_cyan {border: 1px solid #006464; background: url("../images/icon_info.png") no-repeat 0 50%; background-size: 2.875rem auto;}

@media (max-width: 768px) {
	.rejoin_desc {font-size: 1.125rem;}
	.rejoin_desc .btn_group {margin: 1rem 0;}
	.rejoin_desc .btn_group button {display:block; font-size: 1rem; line-height: 3rem; height: 3rem; letter-spacing: -0.1rem; padding: 0 1.25rem 0 4.25rem; margin-right: 6px; margin-top: 0.5rem;}
	.rejoin_desc .btn_group button.btn_blue {border: 0.125rem solid #003b95; background: url("../images/icon_down.png") no-repeat 0 50%; background-size: 3rem auto;}
	.rejoin_desc .btn_group button.btn_cyan {border: 0.125rem solid #006464; background: url("../images/icon_info.png") no-repeat 0 50%; background-size: 3rem auto;}


} 




/* ------------------------------------------------------
LOGIN PAGE
------------------------------------------------------ */
.login_wrap {position: relative; display:flex; justify-content: center; align-items: center; width: 100%; height: 100vh; background: linear-gradient(to right, #8ac452, #00aa7d, #008ccd, #003b95); }
.login_wrap .login_bg_wh {position: absolute; bottom: 0; width: 100%; height: 44%; background-color: #fff;}
.box_login {width:600px; height: 448px; background: #fff; border-radius: 30px; box-shadow: 4px 4px 6px rgb(0,0,0,0.2); z-index:1; padding: 0 70px;}
	/*#container.login {width:100%; height: 100vh; padding:0; background: #F2F2F2}*/
	.admin_txt {font-size:30vw; color:#f9f9f9; line-height: 1; font-weight: bold;}
	.box_login .subtitle {font-size:17px; color:rgba(0, 0, 0, 0.6); line-height: 1; font-weight: bold;}
	.box_login .comp_input {height: 50px; width: 100%; padding: 0 16px; color: #666; font-weight: 200; font-size: 16px; box-sizing: border-box; line-height: 50px; background-color: #f6f6f6; border:0;}
	.box_login *[class*=comp_check] { position: relative; }
	.box_login *[class*=comp_check] input {position: absolute; opacity: 0; left: 0; top: 0; }
	.box_login *[class*=comp_check] label {display: block; position: relative; padding-left: 26px; line-height: 20px; font-size: 16px; color: #000; cursor: pointer; }
	.box_login *[class*=comp_check] label:before { display: inline-block; position: absolute; left: 0; top: 50%; width: 20px; height: 20px; margin-top: -10px; content: ""; border: 1px solid #cacaca; box-sizing: border-box; }
	.box_login .logo {width: 258px; padding: 60px 0 50px; margin:0 auto;}
	.box_login .form .comp_input {height: 50px; line-height: 50px; max-width: 460px; margin: 0 auto; float: left;}
	.box_login .form .comp_input + .comp_input {margin-top: 10px;}
	.box_login .btn_submit {width: 100%; height: 60px; margin-top: 20px; color:#fff; background:#00a6ac; font-size: 20px; font-weight: 300; text-align: center;}
	.box_login .comp_check {float: left;}
	.box_login .comp_check label {font-size: 14px; line-height: 20px;}
	.box_login .btn_signup {float: right; margin-top:23px;}
	.box_login .btn_signup a {font-size:14px;}
	.box_login .pw_search {float: right; line-height: 20px; text-decoration: underline;}
	.box_login .check_group {margin-top: 15px}
	.box_login p {line-height: 14px; color :#ff5151; margin-bottom: 15px;}
	.box_login .number {width: 370px; }
	.box_login .number_time {display: inline-block; float: left; width: 90px; height: 50px; line-height: 50px; text-align: center; border:2px solid #f6f6f6; color:#ff5151; font-size: 16px; font-weight: 500; box-sizing: border-box;}
	.box_login .re_number {text-align: center; margin-top: 27px; font-size: 16px; color: #666;}
	.box_login .re_number .number_txt {margin-right: 15px; line-height: 40px;}



/* ------------------------------------------------------
DASHBOARD
------------------------------------------------------ */
.dashboard_wrap {position: relative; min-width: 1440px; display: flex; justify-content: center; padding-top: 30px; background: linear-gradient(to right, #8ac452, #00aa7d, #008ccd, #003b95); margin: 0 auto; }
	.dashboard_wrap .dashboard_bg_wh {position: absolute; bottom: 0; width: 100%; height: 410px; background-color: #fff;}
	.dashboard_wrap .dashboard_contents {display: flex; justify-content: center; flex-direction: column; max-width: 1264px; }
	.dashboard_wrap .dashboard_contents .menu_group {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: flex-start;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box {display: flex; justify-content: center; flex-direction: row; flex-wrap: wrap; align-items: flex-start; width: 300px; height: 320px; margin: 0 8px; background-color: #fff; border-radius: 30px; margin-bottom: 16px; box-shadow: 4px 4px 6px rgb(0,0,0,0.2); z-index:1; box-sizing: border-box; border:5px solid #fff; cursor: pointer;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box:hover {border: 5px solid #00a6ac; transition: border 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box a {width: 100%; text-align: center;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box a .menu_icon {margin: 43px 0 16px;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box p {width: 100%; text-align:center; line-height: 22px; font-size: 16px; color: #666;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box p.menu_title {font-size: 24px; line-height: 42px; color: #000; font-weight: 700; transition: color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box:hover p.menu_title {font-size: 24px; line-height: 42px; color: #00a6ac; font-weight: 700; transition: color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box .menu_btn {margin: 18px 0 35px; width: 100%; height: 36px; text-align: center;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box .menu_btn div {width: 36px; height: 36px; border-radius: 18px; background-color: #e5e5e5; margin: 0 auto;  transition: background-color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_group .menu_box:hover .menu_btn div {background-color: #00a6ac; transition: background-color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_members {display: flex; justify-content: center; flex-direction: row; align-items: center; position: relative; z-index: 1; width: 1248px; height: 140px; border:1px solid #e5e5e5; box-sizing: border-box; border-radius: 20px; margin: 50px 8px 60px 8px;}
	.dashboard_wrap .dashboard_contents .menu_members img {margin: 0 30px 0 113px; }
	.dashboard_wrap .dashboard_contents .menu_members .menu_txt {width: 733px;}
	.dashboard_wrap .dashboard_contents .menu_members .menu_txt p {width: 100%; font-size: 16px; line-height: 16px; color: #666;}
	.dashboard_wrap .dashboard_contents .menu_members .menu_txt p.menu_title {font-size: 24px; line-height: 24px; margin-bottom: 10px; color: #000; font-weight: 700; transition: color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_members a {display: flex; justify-content: flex-start; align-items: center; width: 315px; height: 138px; border-left: 1px solid #e5e5e5; }
	.dashboard_wrap .dashboard_contents .menu_members a .menu_btn {margin-left: 80px; width: 150px; height: 18px; background: url("../images/common/btn_arrow_gray.png") no-repeat right 50%; transition: background 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_members a .menu_btn p {font-size: 16px; line-height: 18px; color: #666; margin-top: 2px; transition: color 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_members a:hover .menu_btn {margin-left: 80px; width: 150px; height: 18px; background: url("../images/common/btn_arrow_black.png") no-repeat right 50%; transition: background 0.2s ease;}
	.dashboard_wrap .dashboard_contents .menu_members a:hover .menu_btn p {color: #000; text-decoration: underline; transition: color 0.2s ease;}



/* ------------------------------------------------------
ERROR PAGE
------------------------------------------------------ */
#container.error { padding: 250px 0 120px; }
	#container.error .error_inner { width: 760px; height: 480px; padding: 50px 80px 0; margin: 0 auto; background: #f9f9f9; }
	#container.error .error_inner .url_zone {border-bottom: 2px solid #111; padding-bottom:20px; }
	#container.error .error_inner .url_zone p { height: 80px; background: url("../images/common/img_logo_wh.png") no-repeat 0% 50%; background-size: auto 100%; text-indent: -9999px;}
	#container.error .error_inner .tit { font-size: 40px; font-weight: 500; margin-top: 65px; }
	#container.error .error_inner .desc { font-size: 20px; color: #666; font-weight: 100; margin-top: 30px; }
	#container.error .error_inner .btn-gohome { margin-top: 40px; }
	#container.error .error_inner .btn-gohome a { font-size: 22px; font-weight: 300; border-bottom: 1px solid #111; line-height: 1; }

/* ------------------------------------------------------
CATEGORY PAGE
------------------------------------------------------ */
.category_zone {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex;}
.category_zone .category_box {-webkit-flex:1; flex:1;  margin-left: 30px; }
.category_zone .category_box:first-of-type {margin-left: 0}
.category_zone .category_tit {font-size: 17px; font-weight: 500; padding: 20px 0 10px 0; border-bottom: 1px solid; line-height: 30px;}
.category_zone .category_tit .category_top_utile {display: inline-block; float: right; font-size: 14px;}
.categories {overflow-y: auto;  }
.categories ul {}
.categories li {position: relative; padding: 5px 0; text-align: left; line-height: 40px; border-bottom: 1px solid #e4e4e4;}
.categories li:last-child {border-bottom :1px solid;}
.categories li .code {padding: 0 10px;}
.category_name {font-size: 16px; color:#333;}
button.category_name:hover {font-weight: 500; color:#111;}
a.category_name:hover {font-weight: 500; color:#111;}
.category_name[aria-selected=true] {font-weight: 500; color:#111;}
.category_zone .btn_category_remove {position: absolute; right: 45px; width:40px; height: 40px; border:1px solid #e4e4e4; background: #fff; }
.category_zone .btn_category_setting {position: absolute; right: 0px; width:40px; height: 40px; border:1px solid #e4e4e4; background: #fff; }


/* ------------------------------------------------------
OPTION PAGE
------------------------------------------------------ */
.option_size {vertical-align: middle; margin-right: 10px}



/* ------------------------------------------------------
CMS 요청
------------------------------------------------------ */
.top_cms_zone {position: relative;	overflow: hidden; line-height: 40px; text-align:center;}
.top_cms_zone .current_month {display: inline-block; vertical-align: top; font-size: 20px; font-weight:400; margin-right: 10px;}

.target_zone {margin:40px auto 0;}
.target_zone #paymentDate {width:180px; padding-right: 35px; background:#fff url("../images/common/btn_calendar.png") no-repeat 100% 50%; margin-left: 10px;}
/*.target_zone *[class*=comp_btn_type1] {width: 100%; border-radius: 4px;}*/

.progress_zone {padding:25px 50px 20px; border-radius:10px; background: #3f4b5ca1; color:#fff; -webkit-box-shadow: 2px 5px 5px rgba(0,0,0,0.1); box-shadow: 2px 5px 5px rgba(0,0,0,0.1);}
.progress_bar {display: block; position: relative; overflow: hidden; padding:4px; border:2px solid #fff; border-radius:100px; height: 20px; opacity: 0.8;  }
.progress_bar .bar {display: block; width:100%; height: 100%; background:#fff; border-radius: 100px; -ms-transition: 0.4s ease; -webkit-transition: 0.4s ease; -moz-transition: 0.4s ease; transition: 0.4s ease; opacity: 0.8;}
.top_bar {position: relative; padding-right: 50px;}
.top_bar .txt {position: absolute; display: block; text-align: center; font-size: 16px; right: 0; top:0; line-height: 20px; font-weight: 500;}
.progress_zone .result {margin-top: 10px; font-weight: 100; font-size:15px}
.progress_zone .result:after {display:block; clear:both; content:""}
.progress_zone .result li {float: left; margin-right: 10px;}
.progress_zone .result em {font-weight: 300;}
.progress_zone + ul[class*='comp_list'] {margin-top: 10px;}



/* ------------------------------------------------------
상단 노출관리
------------------------------------------------------ */
.comp_top_type:after {display:block; clear:both; content:""}
.comp_top_type li {float: left; position: relative; margin-right: 40px; padding-left: 25px; margin-bottom: 25px}
.comp_top_type li .comp_radio_none {position: absolute; left:0; top:0;}
.comp_top_type li input[type=radio] {position: absolute;left:0; top:0; opacity: 0}
.comp_top_type li label {margin: 0; }
.comp_top_type li label:before {display:block; position: absolute; left:0; top:0; width:13px; height:13px;  content: ""; background: url('/static/frontend/images/common/form_radio.png') no-repeat 50% 50%;}
.comp_top_type li input:checked ~ label:before {background: url("../images/common/form_radio_on.png") no-repeat 50% 50%;}
.comp_top_type li input:checked ~ label .box:after {display: block; content: ""; position: absolute; left:0; top:0; width: 100%; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border:1px solid #000;}
.comp_top_type input[type=radio][disabled] ~ label {opacity: 0.5}

.comp_top_type .layout .box {float: left; overflow: hidden; position: relative; height: 100px; padding-top: 30px; background: #c4c4c4; text-align: center; font-weight: 100}
.comp_top_type .layout .box img {position: absolute; left:0; top:0; width: 100%; height: 100%;}
/*.comp_top_type .layout .box:hover:after {display: block; content: ""; position: absolute; left:0; top:0; width: 100%; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border:1px solid #000;}*/
.comp_top_type .layout .box + .box {margin-left: 1px;}
.comp_top_type .layout .box .size {color:#fff; font-size: 18px;}
.comp_top_type .layout .box em {display: block; font-size: 12px;}

.comp_top_type .layout[data-type=A] .box:nth-child(1) {width: 180px; }
.comp_top_type .layout[data-type=A] .box:nth-child(2) {width: 61px; }

.comp_top_type .layout[data-type=B] .box:nth-child(1) {width: 61px; }
.comp_top_type .layout[data-type=B] .box:nth-child(2) {width: 180px; }

.comp_top_type .layout[data-type=C] .box:nth-child(1) {width: 62px; }
.comp_top_type .layout[data-type=C] .box:nth-child(2) {width: 120px; }
.comp_top_type .layout[data-type=C] .box:nth-child(3) {width: 62px; }

.comp_top_type .layout[data-type=D] .box {width: 120px; }
.comp_top_type .layout[data-type=E] .box {width: 60px; }
.comp_top_type .layout[data-type=F] .box {width: 240PX; }

.pc_uploader .comp_file_upload button[class^=comp_btn_type3] {width: 140px}
.mobile_uploader .comp_file_upload button[class^=comp_btn_type3] {width: 140px}


.contents_search_zone {position: relative; padding-right: 140px;}
.contents_search_zone > *[class*=comp_btn_type2] {position: absolute; right: 0; top:0;}
.contents_search_zone .contents_popup {display: none; position: absolute; left:0; top:40px; width: 100%; max-height: 400px; padding:20px 10px; overflow-y:auto; background: #fff; border:1px solid #cacaca; z-index: 2; margin-top: -1px}
.contents_search_zone .contents_popup label {display: block;}
.contents_search_zone .contents_popup .tit {display: inline-block; line-height: 50px; vertical-align: top;}
.contents_search_zone .contents_popup .thumb {width:auto; height: 50px; margin-right: 10px; border:1px solid #cacaca;}
.contents_search_zone .contents_popup li + li {border-top: 1px dashed #cacaca; padding-top:10px;}
.contents_search_zone .selected_content {display: inline-block; position: relative; margin-top: 10px; border-radius: 100px; background: #cacaca; color:#fff; text-align: left; padding:0 5px 0 10px; line-height: 25px; vertical-align: top;}
.contents_search_zone .selected_content .btn_remove_content {overflow: hidden; margin-left: 5px;  width: 20px; height: 25px; background: url("../images/common/btn_remove.jpg") no-repeat 50% 50%; text-indent: -9999px;}

.comp_file_upload  + ul[class^=comp_radio] {margin:0;}
.files_upload div[class*=type] {display: none;}
*[class*=sm_layout] {display: block; position: relative; overflow: hidden; width: 80px; height: 40px; margin:0 auto; }
*[class*=sm_layout] span {display: block; position: relative; z-index: 1; line-height: 40px;}
*[class*=sm_layoutA]:before {display: block; position: absolute; left:0; top:0; width:75%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutA]:after {display: block; position: absolute; right: -1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px; }
*[class*=sm_layoutB]:before {display: block; position: absolute; left: -1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px; }
*[class*=sm_layoutB]:after {display: block; position: absolute; right:0; top:0; width:75%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutC]:before {display: block; position: absolute; left:-1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutC]:after {display: block; position: absolute; right: -1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px; }
*[class*=sm_layoutC] span {width: 50%; background: #c4c4c4;margin: 0 auto}
*[class*=sm_layoutD]:before {display: block; position: absolute; left:0; top:0; width:50%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutD]:after {display: block; position: absolute; right:-1px; top:0; width:50%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutE]:before {display: block; position: absolute; left:-1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px;}
*[class*=sm_layoutE]:after {display: block; position: absolute; right: -1px; top:0; width:25%; background: #c4c4c4; content: ""; height: 40px; }
*[class*=sm_layoutE] span {overflow: hidden; width: 50%; margin: 0 auto}
*[class*=sm_layoutE] span:before {display: block; position: absolute; left:0; top:0; width:50%; background: #c4c4c4; content: ""; height: 40px; z-index: -1;}
*[class*=sm_layoutE] span:after {display: block; position: absolute; right:-1px; top:0; width:50%; background: #c4c4c4; content: ""; height: 40px;z-index: -1; }
*[class*=sm_layoutF] {background: #c4c4c4}



/* ------------------------------------------------------
상단 노출관리 > 게시물 등록
------------------------------------------------------ */
#newContentPopup {width: 1000px; max-height: 700px; overflow-y:auto;}
#newContentPopup .ly_contents {padding:50px 30px 100px;}
#newContentPopup .comp_file_upload .txt_help {font-size: 14px;}
#newContentPopup .comp_url + p[class^=txt_] {font-size: 14px; text-align: left;}
#newContentPopup .txt_error {font-size: 	12px; text-align: left;	}
#newContentPopup td {text-align: left;}
#newContentPopup .note-toolbar-wrapper.panel-default {height: inherit !important}




.grade_menu_list {padding:10px 0;}
.grade_menu_list > li + li {margin-top: 20px}
.grade_menu_list > li > p.comp_check label {font-weight: 500; font-size: 16px; line-height: 24px; margin: 0}
.grade_menu_list ul.comp_check {overflow: visible; margin-left: 20px; margin-top: 5px}
.grade_menu_list ul.comp_check:after {display:block; clear:both; content:""}
.grade_menu_list ul.comp_check:before {display: block; content: ""; border-top: 1px dashed #666; width: 13px; height: 0; position: absolute; left:-20px; top:50%; margin-top: -2px}
.grade_menu_list .dpeth_name {font-weight: 500; font-size: 16px; line-height: 24px; margin: 0}



/* ------------------------------------------------------
납부내역 > 개별 등록
------------------------------------------------------ */
.member_search_zone {position: relative; width:450px;}
.member_search_zone .comp_input {width:100%; max-width: inherit; }
#memberPop {position: absolute; left:0; top:40px; width:100%; max-height: 200px; overflow-y:auto; margin-top: -1px; background: #fff; border:1px solid #cacaca; z-index: 10;}
#memberPop .comp_radio_row {padding:10px 10px;}
.member_search_zone .selected_content {display: inline-block; position: relative; margin-top: 10px; border-radius: 100px; background: #cacaca; color:#fff; text-align: left; padding:0 10px 0 10px; line-height: 25px; vertical-align: top; }
.member_search_zone .selected_content .btn_remove_content {overflow: hidden; margin-left: 5px;  width: 20px; height: 25px; background: url("../images/common/btn_remove.jpg") no-repeat 50% 50%; text-indent: -9999px;}




/* ------------------------------------------------------
FORM UI
------------------------------------------------------ */
.comp_product_info .input_box + .input_box {margin-top: 10px;}
.comp_product_info .input_box:first-of-type .comp_input {width:650px; max-width:inherit;}
.comp_product_info .txt_help {margin-top: 5px;}

.product_info_data {display: inline-block; position: relative; margin-top: 10px; background: #cacaca; color:#fff; text-align: left; padding:10px 5px 10px 10px; line-height: 25px; vertical-align: top;min-width:670px;}
.product_info_data span{display:inline-block; min-width:286px; margin-right:10px;}
.product_info_data .btn_remove {position:absolute; right:10px;overflow: hidden; margin-left: 5px;  width: 20px; height: 25px; background: url("/static/frontend/images/common/btn_remove.png") no-repeat 50% 50%; text-indent: -9999px;}                        

.answer {color:#0a2d75; font-weight: 200;}
.answer.has {color:#6dc7ca;}



.mb50 {margin-bottom: 3.125rem;}
.mt0 {margin-top: 0;}
.mt10 {margin-top: 0.625rem;}
.mb0 {margin-bottom: 0 !important;}





.search_layout {margin-top:1.875rem; background-color: #f9f9f9; padding: 1.25rem 0; border-radius: 0.625rem; margin-bottom: 1rem;}
.search_layout .comp_period {display: flex; justify-content: center; align-items: center;}
.search_layout .comp_period span {font-weight: 400;}
.search_layout .comp_period .title {font-weight: 500; font-size: 1.125rem; margin-right: 1rem;}
.search_layout .comp_period input[class*=comp_input] {font-size: 1.125rem; color: #000; border: 1px solid #e9e9e9;}

.view_pc {display: revert;}
.view_mo {display: none;}






@media (max-width: 1024px) {
	.search_layout .comp_period input[class*=comp_input] {width:8.25rem; }
	*[class^=comp_board] .view_pc th {font-size: 1rem;}
} 

@media (max-width: 768px) {
	.search_layout .comp_period {flex-direction: column;}
	.search_layout .comp_period *[class^=comp_btn][class*=_type9] {margin-left: 0; margin-top: 1rem;}
	.view_pc {display: none;}
	.view_mo {display: revert;}
}

@media (max-width: 580px) {
	.search_layout .comp_period input[class*=comp_input] {width:6rem; }
	.search_layout .comp_period .title {margin-right: 0.5rem;}
} 

@media (max-width: 480px) {
	.search_layout .comp_period input[class*=comp_input] {padding: 0 1.5rem 0 1rem;}
} 
