@charset "UTF-8";

/* =================================================================== */
/* Import Section
====================================================================== */


/*###################초기화 시키기 RESET###################*/
body,h1, h2, h3,h4,h5,h6,div, p, ul, ul li, dl, dt, dd,table, tr, th, td, caption,form, fieldset, input, select, textarea,address, blockquote {margin:0; padding:0;}
table {border-collapse:collapse; border-spacing:0;}
address, em {font-style:normal;}
h1, h2, h3,h4,h5,h6 {font-size:100%;}
ul li {list-style:none;}
img, fieldset {border:0 none;}




/*###################기본 설정 BASE###################*/
body, html {height: 100%;}

body {background:#fff; color:#222; font-size:12px; font-family:"Noto Sans KR", sans-serif;}
html {overflow-y:scroll;}
a, a:link, a:active, a:visited {color:#222; text-decoration:none;}
a:hover, a:focus {color:#545454; text-decoration:none;}
legend, caption, .hide {position:absolute; top:-5000px;	visibility:hidden;	width:0; height:0;	font-size:0;	line-height:0;}
hr, .hidden {display:none;}
.sound_only {visibility:hidden;width:0; height:0; line-height:0; padding:0; font-size:0;	background-color:none;}

.input-style {border:1px solid #ddd; width: 100%; padding:9px 12px; border-radius: 8px; font-size: 18px;}
.btns {font-size:16px; cursor: pointer; padding:8px 10px; border-radius: 8px; line-height: 100%; font-weight: 500; letter-spacing: -.48px;}
.btn {font-size:12px; cursor: pointer; padding:8px 16px; border-radius: 3px; line-height: 100%;;}
.btn02 {border: 1px solid #405D89; background: #fff; color: #405D89; }
.btn03 {border: 1px solid #405D89; background-color: #405D89; color: #fff;}

.payprint-table {font-size:18px;  line-height: 100%;}
.payprint-table thead { background: #F1F5FD; font-weight: 500; color:#506182}
.payprint-table thead tr th {padding:14px 12px}

.payprint-table tbody tr {border-top:1px solid #ddd;}
.payprint-table tbody tr:last-child {border-bottom:1px solid #ddd;}
.payprint-table tbody tr td {padding:10px 16px; border-right:1px solid #dbdbdb;}
.payprint-table tbody tr td:last-child {border-right:0;}


.blind {
    display: block;
    overflow: hidden;
    left: 0;
    top: -1000em;
    position: absolute;
}

body {
    font-size: 12px;
    color: #3d3a39;
}

.wrappage{width: 730px; margin: 0 auto; padding-top: 20px}
/* reset */

#Donation { padding: 20px; }

#Donation .donation_ex {margin: 5px 0 0;}

#Donation .donation_st {margin: 5px 0 10px;}

#Donation .donation_titbox{
    overflow: hidden;
    width: 100%;
}
#Donation .donation_titbox .tit_left{
    float: left;
    margin-top: 6px;
}
#Donation .donation_titbox .tit_center{
    margin: 0 auto;
    width: 200px;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    letter-spacing: 4px;
}
#Donation .donation_titbox .tit_left div{
    border: 1px solid #bbb8b8;
    line-height: 25px;
    height: 25px;
    text-align: center;
    display:table-cell ;
}
#Donation .donation_titbox .tit_left div:first-child{
    border-right:0 ;
}



#Donation table{
     width: 100%;
     border-bottom: 1px solid #333;
     text-align: left;
     border-collapse: collapse;
}
#Donation table caption{
    text-align: left;
    border-top: 2px solid #333;
    font-size: 17px;
    line-height: 30px;
}
#Donation table th, #Donation table td{
    border-top: 1px solid #bbb8b8;
    height: 40px;
    padding-left: 6px;
}
#Donation table th{
    border-left: 1px solid #bbb8b8;
    width: 17%;
}
#Donation table th:first-child{border-left: 0;border-left: 1px solid #bbb8b8;}

#Donation .table_alot{
    text-align: center;
}

#Donation .table_alot th,#Donation .table_alot td{padding: 0;}
#Donation .table_alot th{
    width: 12%;
	border-left: 1px solid #bbb8b8;
}

#Donation .table_alot td{
    border-left: 1px solid #bbb8b8;

}
#Donation .table_alot td:first-child{border-left: 0;}

#Donation .signature{
    border-top: 1px solid #bbb8b8;
    overflow: hidden;
    padding: 14px;
    font-size: 14px;
}
#Donation .signature:last-child{
    border-bottom: 2px solid #333;
    margin-bottom: 30px;
}

#Donation .signature .left{
    float: left;
    width: 100%;
}
#Donation .signature .right{
    float: right;
    width: 100%;
    display: block;
    text-align: right;
}
#Donation .signature .date{letter-spacing: 2px;}
#Donation .signature .signer{width: 200px;display: inline-block;}
#Donation .signature .sign{font-size: 12px;}

/* ���� �̹��� */
#Donation .porel{
    position: relative;
}  
#Donation .signature .jin{
    position: absolute;
    z-index: 999;

}
#Donation .signature .sign_img2{
    position: absolute;
    z-index: -1;
    right: 28px;
    bottom: 8px;
    width: 60px;height: 60px;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

#Donation .donation_st {
    margin: 5px 0 10px;}
#Donation table th, #Donation table td{
        height: 37px;
        width: 240px;
        word-break:break-all;
    }
#Donation table th{
        width: 170px;
    }    

#Donation .table_alot th,#Donation .table_alot td{
        height: 30px;
    }
#Donation .signature .date{margin-bottom: 27px;}    
#Donation .signature .sign_img2{ bottom: 27px;}

.border-left{border-left:1px solid #bbb8b8;}

.border-top{border-top: 1px dotted #bbb8b8 !important;}





.ui-widget-header { border: 0px solid #dddddd; background: #fff; } 
.ui-datepicker-calendar>thead>tr>th { font-size: 14px !important; } 
.ui-datepicker .ui-datepicker-header { position: relative; padding: 10px 0; } 
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active { border: 0px solid #c5c5c5; background-color: transparent; font-weight: normal; color: #454545; text-align: center; } 
.ui-datepicker .ui-datepicker-title { margin: 0 0em; line-height: 16px; text-align: center; font-size: 14px; padding: 0px; font-weight: bold; } 
.ui-datepicker { display: none; background-color: #fff; border-radius: 4px; margin-top: 10px; margin-left: 0px; margin-right: 0px; padding: 20px; padding-bottom: 10px; width: 300px; box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.1); } 
.ui-widget.ui-widget-content { border: 1px solid #eee; } 
#datepicker:focus>.ui-datepicker { display: block; } 
.ui-datepicker-prev,
.ui-datepicker-next { cursor: pointer; } 
.ui-datepicker-next { float: right; } 
.ui-state-disabled { cursor: auto; color: hsla(0, 0%, 80%, 1); } 
.ui-datepicker-title { text-align: center; padding: 10px; font-weight: 100; font-size: 20px; } 
.ui-datepicker-calendar { width: 100%; } 
.ui-datepicker-calendar>thead>tr>th { padding: 5px; font-size: 20px; font-weight: 400; } 
.ui-datepicker-calendar>tbody>tr>td>a { color: #000; font-size: 12px !important; font-weight: bold !important; text-decoration: none;}
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover { cursor: auto; background-color: #fff; } 
.ui-datepicker-calendar>tbody>tr>td { border-radius: 100%; width: 30px; height: 30px; cursor: pointer;  font-weight: 100; text-align: center; font-size: 12px; } 
.ui-datepicker-calendar>tbody>tr>td:hover { background-color: transparent; opacity: 0.6; } 

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus { border: 0px solid #cccccc; background-color: transparent; font-weight: normal; color: #2b2b2b; } 

.ui-widget-header .ui-icon { background-image: url('/images/btns.png'); } 
.ui-icon-circle-triangle-e { background-position: -20px 0px; background-size: 36px; } 
.ui-icon-circle-triangle-w { background-position: -0px -0px; background-size: 36px; } 
.ui-datepicker-calendar>tbody>tr>td:first-child a { color: red !important; } 
.ui-datepicker-calendar>tbody>tr>td:last-child a { color: #0099ff !important; } 
.ui-datepicker-calendar>thead>tr>th:first-child { color: red !important; } 
.ui-datepicker-calendar>thead>tr>th:last-child { color: #0099ff !important; } 

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight { border: 0px; background: #f1f1f1; border-radius: 50%; padding-top: 10px; padding-bottom: 10px; } 

.inp { padding: 10px 10px; background-color: #f1f1f1; border-radius: 4px; border: 0px; } 
.inp:focus { outline: none; background-color: #eee; } 


.login_btn {font-size:16px; color:#435B76; line-height: 100%; padding: 9px 14px ; border: 1px solid #ddd; border-radius: 999px; display: flex; gap:8px; align-items: center;}
.index_login_btn {border-radius: 999px; color:#fff !important; font-size:20px; line-height: 100%; font-weight: 500; letter-spacing: -.6px; text-align: center; padding:18px 10px; display: inline-block; width:306px;}
.bg-banner {background: url(/images/bg-img1.png) no-repeat; background-size:cover}
.bg-banner2 {background: url(/images/bg-img2.png) no-repeat; background-size:cover}
.bg-gra {background: linear-gradient(90.85deg, #3776E1 0.73%, #4A94DD 113.04%);}