@charset "utf-8";
:root{
    --main-color: #0a3274;
    --sub-color: #a28951;
    --sub-red: #ac2f30;
}
/*
*{font-weight: 400; letter-spacing: -1px}
*/
.mt0{margin-top:0px !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt25{margin-top:25px !important}
.mt30{margin-top:30px !important}
.mt40{margin-top:40px !important}
.mt50{margin-top:50px !important}
.mt60{margin-top:60px !important}
.mt70{margin-top:60px !important}
.mt80{margin-top:60px !important}
.mt90{margin-top:60px !important}
.mt100{margin-top:60px !important}

.mr0{margin-right: 0px !important;}
.mr5{margin-right: 5px !important;}
.mr10{margin-right: 10px !important;}
.mr20{margin-right: 20px !important;}

.ml0{margin-left: 0px !important;}
.ml5{margin-left: 5px !important;}
.ml10{margin-left: 10px !important;}
.ml20{margin-left: 20px !important;}

.mb0{margin-bottom: 0px !important;}
.mb5{margin-bottom: 5px !important;}
.mb10{margin-bottom: 10px !important;}
.mb15{margin-bottom: 15px !important;}
.mb20{margin-bottom: 20px !important;}
.mb30{margin-bottom: 30px !important;}
.mb40{margin-bottom: 40px !important;}
.mb50{margin-bottom: 50px !important;}
.mb60{margin-bottom: 50px !important;}


.pl0{padding-left: 0px !important;}
.pl5{padding-left: 5px !important;}
.pl10{padding-left: 10px !important;}
.pl15{padding-left: 15px !important;}
.pl20{padding-left: 20px !important;}

.pr0{padding-right: 0px !important;}
.pr5{padding-right: 5px !important;}
.pr10{padding-right: 10px !important;}
.pr15{padding-right: 15px !important;}
.pr20{padding-right: 20px !important;}

.pt0{padding-top:0px !important}
.pt5{padding-top:5px !important}
.pt10{padding-top:10px !important}
.pt15{padding-top:15px !important}
.pt20{padding-top:20px !important}
.pt25{padding-top:25px !important}
.pt30{padding-top:30px !important}
.pt40{padding-top:40px !important}
.pt50{padding-top:50px !important}
.pt60{padding-top:60px !important}

.wid5{width: 5% !important;}
.wid10{width: 10% !important;}
.wid20{width: 20% !important;}
.wid30{width: 30% !important;}
.wid40{width: 40% !important;}
.wid50{width: 50% !important;}
.wid60{width: 60% !important;}
.wid70{width: 70% !important;}
.wid80{width: 80% !important;}
.wid90{width: 90% !important;}
.wid100{width: 100% !important;}

.pc{display: block}
.tablet{display: none}
.mobile{display: none;}

/* basic icon */
.icon_tel{padding-left: 20px; background: url(../img/sub/06/icon_tel.png) no-repeat center left; background-size: auto 100%;}
.icon_email{padding-left: 27px; background: url(../img/sub/06/icon_email.png) no-repeat center left;}

/* table scroll */
.scroll_tb{overflow-x: auto;}
.scroll_tb > table{word-break: keep-all;}

/* font-style */
.font_blue{color: #3071ca; font-size: 15px;}
.txt-center{text-align: center !important;}
.txt-left{text-align: left !important;}
.txt-right{text-align: right !important;}
.main_color{color: var(--main-color) !important;}

/* table width */
.w6{width: 6% !important;}


.sect:not(:last-child){margin-bottom: 60px;}
/* .sub_cont{font-color: #444; font-weight: 500;} */
.sub_cont > .dot, .dot{font-size: 15px; color: #666; font-weight: 500;}
.sub_gray_box{background-color: #f4f4f4; border: 1px solid #ddd; padding: 25px 1.875rem; display: flex; color: #444; font-weight: 400; row-gap: 20px; flex-wrap: wrap; align-items: center; line-height: 1.7; justify-content: space-between;}
.sub_gray_box .short{max-width: 630px; width: 100%;}
.sub_gray_box .sub_btn{margin-top: 0; flex-shrink: 0; font-size: 14px;}
.sub_gray_box_border{border: 1px solid #ccc; padding: 1.875em;}

.table_sty01 + .dot, .table_sty01 + .gray_dot,  .scroll_tb + .gray_dot{margin-top: 20px;}

/* dot style */
.gray_dot > li{padding-left: 15px; position: relative; color: #666;}
.gray_dot > li::before{display: block; content: ""; position: absolute; top: 8px; left: 0; width: 5px; height: 5px; background-color: #666; border-radius: 5px;}

/* btn style */
.btn_w{display: flex; flex-wrap: wrap; gap: 15px;}
.sub_btn{display: inline-block; height: 36px; line-height: 36px; border-radius: 36px; padding: 0 20px; margin-top: 40px; min-width: 145px; text-align: center;}
.btn_blue{background-color: var(--main-color) !important; color: #fff;}
.btn_gold{background-color: var(--sub-color) !important; color: #fff;}
.btn_gray{background-color: #666; color: #fff;}
.btn_gold{background-color: var(--sub-color); color: #fff; font-size: 14px; font-weight: 500; margin-top: 20px;}
.sub_btn:not(:last-child){margin-right: 5px;}
.btn_short{padding-right: 46px; background: url('../img/sub/common/icon_short.png') no-repeat center right 25px;}
.btn_down{position: relative; min-width: 170px; padding-right: 50px;}
.btn_down::after{width: 36px; height: 36px; background: url(../img/sub/common/icon_dw.png) no-repeat center center / 16px 15px; display: block; position: absolute; content: "";border-radius: 36px; top: -1px; right: -1px;}
.pdf_dw{border: 1px solid var(--sub-red); color: var(--sub-red);}
.pdf_dw::after{background-color: var(--sub-red);}
.hwp_dw{border: 1px solid var(--main-color); color: var(--main-color);}
.hwp_dw::after{background-color: var(--main-color);}
.word_dw{border: 1px solid #3071ca; color: #3071ca;}
.word_dw::after{background-color: #3071ca;;}

/* bullet_tit */
.bullet_tit{padding-left: 20px; font-size: 1.438rem; font-weight: 700; position: relative; margin-bottom: 15px;}
.bullet_tit::before{background: url(../img/sub/common/blue_bullet.png) no-repeat center; content: ""; display: block; width: 12px; height: 12px; position: absolute; left: 0; top: 6px;}

.sub_bullet_tit{padding-left: 30px; color: var(--main-color); font-size: 18px; position: relative; margin-top: 50px; margin-bottom: 20px; font-weight: 700;}
.sub_bullet_tit::before{content: ""; display: block; position: absolute; background: url(../img/sub/common/sub_bullet.png) no-repeat center; width: 18px; height: 18px; top: 4px; left: 2px;}

.sub_bullet_txt{padding-left: 30px; font-size: 16px; font-size: 1em; position: relative; margin-bottom: 10px; color: #666;}
.sub_bullet_txt::before{content: ""; display: block; position: absolute; background: url(../img/sub/common/sub_bullet.png) no-repeat center; width: 18px; height: 18px; top: 4px; left: 2px;}

/* table */
.table_sty01{width: 100%; border-top: 2px solid #1b4d8c; margin-top: 20px;}
.table_sty01 th{background-color: #f1f6fb; text-align: center; /* width: 14.5%;*/ font-weight: 500;}
.table_sty01 td{}
.table_sty01 th,
.table_sty01 td{border: 1px solid #ddd; color: #444; padding: 15px 10px; text-align: center;}
.table_sty01 th:first-child, .table_sty01 td:first-child{border-left: 0;}
.table_sty01 th:last-child, .table_sty01 td:last-child{border-right: 0;}
.table_sty01 tbody th{background-color: #f7f7f7;}
.table_sty01.tbody_th th{background-color: #f1f6fb; width: 14.5%;}
.table_sty01.tbody_th td{width: 30%;}
.table_sty01 a{margin-top: 0;}


/* top_thum */
.top_thum{border: 10px solid #ededee; padding: 50px; display: flex; flex-wrap: wrap; gap: 50px; row-gap: 30px; justify-content: space-between; margin-bottom: 50px; align-items: center; min-height: 160px;}
.top_thum .txt{width: calc(100% - 380px - 50px);}
.top_thum .txt .tit{font-size: 1.750rem; color: var(--main-color);}
.top_thum .txt .sub_tit{font-size: 1.125rem; margin: 30px 0 20px; font-weight: 600;}
.top_thum .txt .expln{font-size: 15px; color: #444; font-weight: 400;  line-height: 1.5;}

/* top_thum - icon_w*/
.top_thum.icon_w{justify-content: normal; padding: 35px 50px; align-items: flex-start;}
.top_thum.icon_w .expln{font-size: 1.4rem;}
.top_thum.icon_w .expln b{color: var(--sub-color); font-weight: 700;}
.top_thum.icon_w .txt{width: calc(100% - 90px - 50px);}
.top_thum.icon_w .txt .sub_expln{font-size: 16px; color: #444; line-height: 1.6;}
.top_thum.icon_w .txt .sub_expln > b{font-weight: 700;}

/* top_thum - blue_w*/
.top_thum.blue_w{position: relative; padding: 30px 50px;}
.top_thum.blue_w::before, .top_thum.blue_w::after{content: ""; display: block; position: absolute; background-color: var(--main-color); top: -10px; left: -10px;}
.top_thum.blue_w::before{width: 10px; height: 50px;}
.top_thum.blue_w::after{height: 10px; width: 50px;}
.top_thum.blue_w .txt{width: 100%;}
.top_thum.blue_w .txt .tit{color: #000; font-weight: 700; font-size: 1.5rem; line-height: 1.3}
.top_thum.blue_w .txt .expln{margin-top: 20px; padding-top: 20px; border-top: 1px solid #ccc;}
.top_thum.blue_w .txt .tit > span{color: var(--main-color); font-weight: 700;}

.blue_w .icon_top{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 15px;}
.blue_w .icon_w{display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap;}
.blue_w .icon_w .tit{font-size: 20px; color: #111; margin-bottom: 15px;}
.blue_w .icon_w .cont, .blue_w .txt .expln._st2{color: #444;}
.blue_w .icon_w .cont > span, .blue_w .txt .expln._st2 > span{font-weight: 700;}

/* top_thum - blue_w - width btn */
.top_thum.width_btn{display: flex; flex-wrap: wrap;}
.top_thum.width_btn .txt{width: auto;}
.top_thum.width_btn .sub_btn{background-color: #3071ca; color: #fff; height: 3.750rem; line-height: 3.750rem; margin-top: 0; order: 3;}
.top_thum.width_btn .sub_btn > span{ padding-right: 55px; position: relative;}
.top_thum.width_btn .sub_btn span:after{content: ""; display: block; position: absolute; top: -7px; right: 0; width: 36px; height: 36px; background: var(--main-color) url(../img/sub/common/wh_arrow.png) no-repeat center; border-radius: 36px;}

/* bbs sch */
input, .bo_sch form select{border:1px solid #ddd; padding: 0 1rem; height: 45px;}
input::placeholder{padding: 0;}
input::-webkit-inner-spin-button { appearance: none; -moz-appearance: none; -webkit-appearance: none;}
.bo_sch form select{padding-right: 30px; background: #fff url(../img/sub/common/select_arrow_form.jpg) no-repeat center right 20px; }
.bo_sch form input{height: 45px;}

.bo_sch form{padding: 30px 40px; border: 1px solid #ddd; background-color: #f7f7f7; display: flex; gap: 20px; margin-bottom: 30px; min-height: 120px; align-items: center; justify-content: center;}
.bo_sch form .schSelect, .bo_sch form .schKeyword, .bo_sch form .submit{height: 45px;}
.bo_sch form .schSelect{padding: 0 30px; background: url('../img/sub/common/select_arrow.png') no-repeat center right 20px; width: 150px;}
.bo_sch form .schKeyword{flex: 1; background-color: #f7f7f7; padding: 0 25px; max-width: 535px;}
.bo_sch form .schKeyword::placeholder{color: #757575; padding: 0;}
.bo_sch form .schSelect, .bo_sch form .schKeyword{border: 0; border-bottom: 1px solid #333; font-size: 15px;}
.bo_sch form .submit{background-color: #3a3b3f; color: #fff; width: 145px;  line-height: 45px;}
#bo_list_total{color: #333; margin-bottom: 15px;}
#bo_list_total > strong{color: var(--sub-red); font-weight: 700;}

.label_box_w form{flex-wrap: wrap}
.bo_sch form .label_box{display: inline-flex; gap: 15px; align-items: center; }
.bo_sch form .label_box label{flex-shrink: 0; min-width: 65px;}
.bo_sch form .label_box select{padding-right: 70px;}

/* 기부캠페인 tab style */
.tabs-st2{display: flex; margin-bottom: 30px;}
.tabs-st2 > li{ height: 50px;}
.tabs-st2 > li a{display: block; text-align: center; border: 1px solid #ccc; border-bottom-color: #000; height: 100%; display: flex; align-items: center; justify-content: center; color: #444; flex-direction: column}
.tabs-st2 > li:not(:first-child) a{border-left: 0;}
.tabs-st2 > li a.active{border-top: 3px solid var(--sub-color); border-right-color: #000; border-left: 1px solid #000; color: #444; border-bottom: 0; font-weight: 600;}

.tabs-st2._high > li{height: 70px;}
.tabs-st2._high > li a > span{display: block; color: #757575; font-size: 14px;}

.tabs-st2.len1 > li{width: 100%}
.tabs-st2.len2 > li{width: 50%}
.tabs-st2.len3 > li{width: 33.333333333%}
.tabs-st2.len4 > li{width: 25%}
.tabs-st2.len5 > li{width: 20%}
.tabs-st2.len6 > li{width: 16.6666666667%}
.tabs-st2.len7 > li{width: 25%}
.tabs-st2.len8 > li{width: 25%}
.tabs-st2.len9 > li{width: 20%}
.tabs-st2.len10 > li{width: 20%}
.tabs-st2.len11 > li{width: 16.6666666667%}
.tabs-st2.len12 > li{width: 16.6666666667%}

/* 기부캠페인 tab style */
.tabs-st3{display: flex; margin-bottom: 30px;}
.tabs-st3 > li{ height: 50px;}
.tabs-st3 > li a{display: block; text-align: center; border: 1px solid #ccc; border-bottom-color: #000; height: 100%; display: flex; align-items: center; justify-content: center; color: #444; flex-direction: column}
.tabs-st3 > li:not(:first-child) a{border-left: 0;}
.tabs-st3 > li a.active{border-top: 3px solid var(--main-color); border-right-color: #000; border-left: 1px solid #000; color: #444; border-bottom: 0; font-weight: 600;}

.tabs-st3._high > li{height: 70px;}
.tabs-st3._high > li a > span{display: block; color: #757575; font-size: 14px;}

.tabs-st3.len1 > li{width: 100%}
.tabs-st3.len2 > li{width: 50%}
.tabs-st3.len3 > li{width: 33.333333333%}
.tabs-st3.len4 > li{width: 25%}
.tabs-st3.len5 > li{width: 20%}
.tabs-st3.len6 > li{width: 16.6666666667%}
.tabs-st3.len7 > li{width: 25%}
.tabs-st3.len8 > li{width: 25%}
.tabs-st3.len9 > li{width: 20%}
.tabs-st3.len10 > li{width: 20%}
.tabs-st3.len11 > li{width: 16.6666666667%}
.tabs-st3.len12 > li{width: 16.6666666667%}


#bo_list_total{color: #333; margin-bottom: 15px;}
#bo_list_total > strong{color: var(--sub-red);}

/* 로그인 */
.loginbox .title{text-align: center; font-size: 20px; line-height: 1.3}
.loginbox .form_w{margin-top: 30px; padding: 60px 20px; border: 1px solid #ccc; display: flex; justify-content: center;
flex-direction: column; align-items: center; gap: 15px;}
/* .loginbox .form_w .top{display: flex; gap: 30px; flex-direction: column;} */
.loginbox .form_w .form > li .t{width: 70px;}
.loginbox .form_w .form > li input{width: 100%; margin-top: 10px;}
.loginbox .form_w .inp_wrap .submit{height: 50px; color: #fff; width: 100%; margin-top: 30px;}
.loginbox .form_w .etc{display: flex; gap: 20px;}
.loginbox .form_w .etc > a{color: #0c82e9; border-bottom: 1px solid #0c82e9;}

/* 썸네일 bbs */
.bbs_thum{border-top: 2px solid #333; gap: 30px; display: flex; flex-wrap: wrap; row-gap: 0;}
.bbs_thum > li{margin-top: 30px; width: calc(33.333% - (60px/3)); padding-bottom: 20px; border-bottom: 1px solid #ddd;}
.bbs_thum > li .tit{font-size: 17px; overflow: hidden; white-space: normal;  text-overflow: ellipsis; margin-top: 20px; font-weight: 600;}
.bbs_thum > li .sub{margin-top: 15px; color: #757575; font-size: 14px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; max-height: 39px;}
.bbs_thum > li .date{margin-top: 15px; color: #757575; font-size: 14px; display: block;}
.bbs_thum > li .sub i{padding: 10px; font-style: unset;}
.bbs_thum .img_w{position: relative;}
.bbs_thum .img_w img{width: 100%;}
.bbs_thum .img_w::after{content: ""; display: block; position: absolute; width: 45px; height: 45px; background: url() no-repeat center center / cover; top: 16px; right: 16px;}
.bbs_thum .grade1::after{background-image: url("../img/sub/02/arete_grade_1.png");}
.bbs_thum .grade2::after{background-image: url("../img/sub/02/arete_grade_2.png");}
.bbs_thum .grade3::after{background-image: url("../img/sub/02/arete_grade_3.png");}

/* 썸네일 bbs 비디오 */
.bbs_thum._video .img_w{position: relative;}
.bbs_thum._video .img_w:after{content: ""; display: block; width: 63px; height: 63px; background: url(../img/sub/03/icon_video.png) no-repeat center center / cover; top: 50%; left: 50%; transform: translate(-50%, -50%);}


/* 페이지네이션 */
.paging_w{text-align: center; margin-top: 3.750rem; display: flex; justify-content: center;}
.paging_w >*{font-size: 16px; display: flex;align-items: center; justify-content: center; margin-right: 15px; color: #666; margin: 0 12px;}
.paging_w .current{ color: var(--sub-red); text-decoration: underline; font-weight: 600;}

.paging_w .arrow {text-indent: -9999px; background-position: center center; background-repeat: no-repeat; width: 14px;}
.paging_w .arrow.prev {background-image: url('../img/sub/common/prev.gif');}
.paging_w .arrow.first {background-image: url('../img/sub/common/prev_end.gif');}
.paging_w .arrow.next {background-image: url('../img/sub/common/next.gif');}
.paging_w .arrow.last {background-image: url('../img/sub/common/next_end.gif'); margin-right: 0; margin-left: 15px;}
.paging_w a:not(.arrow):last-child{margin-right: 0;}

/* 썸네일 컨텐츠 */
.thum_vertical > li{display: flex; gap: 50px; align-items: flex-start; padding: 30px 0;}
.thum_vertical > li:not(:last-child){border-bottom: 1px dotted #000;}
.thum_vertical > li .title{font-size: 1.33rem; font-weight: 700; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 2px solid #121c25;}
.thum_vertical > li .cont{color: #5b5b5b; min-height: 100px;}
.thum_vertical > li .btn_w{gap: 5px; margin-top: 25px;}
.thum_vertical > li .btn_w a{margin-top: 0; margin-right: 0;}

/* 작업자 정보 */
.work_info{display: flex; gap: 10px; flex-wrap: wrap;}
/* .work_info > li{padding: 1.875em; border: 1px solid #ddd; border-top: 2px solid var(--main-color); width: calc(33.333% - 7px);} */
.work_info > li{padding: 1.875em; border: 1px solid #ddd; border-top: 2px solid var(--main-color); width: calc(24.9% - 7px);}
.work_info > li img{margin-bottom: 25px;}
.work_info > li .tit{color: var(--main-color) !important; font-size: 20px; font-weight: 700; margin-bottom: 20px;}

/* dash list */
.dash_list > li{padding-left: 12px; position: relative;}
.dash_list > li:before{content: ""; display: block; width: 6px; height: 1px; background-color: #444; position: absolute; top: 10px; left: 0;}

/* cont_w */
.cont_w{display: flex; gap: 30px; flex-wrap: wrap;}
.cont_w .sub_bullet_tit{margin-top: 0;}
.cont_w._cont02 > div{width: calc(50% - 15px);}

/* 참여방법 */
.step_w{display: flex; flex-wrap: wrap; row-gap: 10px; }
.step_w > li{ flex: 1; text-align: center; display: flex; justify-content: center; }
.step_w, .step_w > li{ gap: 6px;}
/* .step_w > li:not(:last-child):after{content: ""; display: inline-block; width: 40px; height: 31px; background: url(../img/sub/02/arrow_img.png) no-repeat center center / 100%; position: relative; top: -25px;} */
.step_w > li.arrow { flex: unset; position: relative; display: block; width: 40px; }
.step_w > li.arrow:before { content: ''; position: absolute; top: 50px; left: 50%; width: 100%; background: url(../img/sub/02/arrow_img.png) no-repeat center / 100%; transform: translateX(-50%); aspect-ratio: 40 / 31; }
.step_w > li img{width: 130px;}
.step_w > li p{color: var(--main-color); margin-top: 15px; margin-bottom: 5px; font-size: 14px; font-weight: 700}
.step_w > li span{font-weight: 600}

.typesDonate{display: flex; gap: 1.875rem; margin-top: 30px; flex-wrap: wrap;}
.typesDonate > li{width: calc(50% - 15px); text-align: center; color: #fff;}
.typesDonate > li p{background-color: #172547; height: 45px; line-height: 45px; font-size: 1.03rem;}
.typesDonate > li .cont{border: 1px solid #ddd; border-top: 0; color: #444; height: 80px; display: flex; align-items: center; font-weight: 500; justify-content: center; padding: 10px;}

/* faq */
.faq_list{border-top: 2px solid #333;}
.faq_list > li{border-bottom: 1px solid #ccc;}

.faq_list .q{display: flex; align-items: center;}
.faq_list .q a{align-items: center; color: #172547; font-size: 18px;}
.faq_list .q a, .faq_list .a{padding: 20px 40px; display: flex}
.faq_list .q a{ font-size: 1.125rem; font-weight: 700; width: 100%;text-align: left; position: relative;}
.faq_list .q a:before{display: inline-block; content: "Q"; color: var(--pink); font-size: 20px; margin-right: 20px; width: 45px; height: 45px; border-radius: 45px; background-color: #172547; color: #fff; line-height: 45px; text-align: center; flex-shrink: 0;}
.faq_list .q a:after{display: block; content: ""; background: url('../img/sub/common/faq_arrow.png') no-repeat center / 100%; width: 17px; height: 10px; position: absolute; right: 50px; top: 50%; transform:translateY(-50%) rotate(-180deg) ; transition: .3s;}
.faq_list .q.faq_li_open a:after{transform:translateY(-50%) rotate(0);}


.faq_list .a{background: #f9f9f9; display: none; text-align: left; letter-spacing: 0; padding-bottom: 35px; border-top: 1px solid #ddd; color: #444;}
.faq_list .a *{line-height: 1.7;}
.faq_list .a .cont{padding-left: 67px; position: relative;}
.faq_list .a .cont:before{display: inline-block; content: "A"; color: #333; font-size: 1.375rem; margin-right: 20px; font-weight: 700; width: 45px; height: 45px; color: #666; font-size: 20px; border: 1px solid #dedede; border-radius: 45px; text-align: center; flex-shrink: 0; background-color: #fff; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0;}

.faq_list .a p.add_cont{border-top: 1px solid #ccc; margin-top: 30px; padding-top: 30px;}
.faq_list .a .btn_short{color: var(--main-color); background-image: url(../img/sub/common/icon_short_blue.png); position: relative; padding-right: 24px; background-position: center right; display: inline-block; margin-top: 20px;}
.faq_list .a .btn_short::after{display: block; content: ""; width: 100%; height: 1px; background-color: var(--main-color); position: absolute; bottom: 0; left: 0;}

/* 인사말 */
.greeting .tit{color: var(--main-color); font-size: 1.750rem; margin-bottom: 25px; font-weight: 700; line-height: 1.3; }
.greeting .sub{color: #444;}
.greeting .img_w{background: url(../img/sub/06/greeting_img.jpg) no-repeat center left / cover; display: flex; justify-content: flex-end; margin-bottom: 40px; margin-top: 25px;}
.greeting .img_w > p{background-color: rgba(162, 137, 81, .95); padding: 60px 50px; max-width: 400px; color: #fff; line-height: 1.6; font-size: 15px;}

/* 찾아오는길 */
.map iframe{width: 100%; height: 450px;}
.toggle_cont >.item{display: none;}
.toggle_cont >.item.active{display: block;}

/* 기부내역 조회 */
.record_inquiry{display: flex; gap: 10px; flex-wrap: wrap;}
.record_inquiry > .item{border: 1px solid #ddd; width: calc(50% - 5px); min-height: 290px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.record_inquiry > .item:hover{border-color: var(--main-color);}
.record_inquiry > .item p{font-size: 1.25rem; color: var(--main-color); font-weight: 700; margin-top: 25px;}

/* 명예의 전당 */
.hallFame{display: flex; gap: 30px; flex-wrap: wrap;}
.hallFame > li {border: 1px solid #dfdfdf; width: calc(33.333% - (60px/3)); padding: 30px;}
.hallFame > li .tit{color: #0a3274; font-weight: 700; font-size: 17px; margin-bottom: 10px; word-break: break-all; }
.hallFame > li .sub{font-size: 15px; color: #757575; word-break: break-all; }

.hallFame_view{background-color: #c0a355; padding: 40px 60px; color: #fff;}
.hallFame_view .tit{margin-bottom: 25px; font-size: 30px; font-weight: 700; line-height: 30px;}
.hallFame_view .sub{margin-bottom: 10px;}
.hallFame_view .sub > span{position: relative; padding-right: 15px;}
.hallFame_view .sub > span::after{content: ""; position: absolute; right: 3px; top: 10px; width: 3px; height: 3px; background: #fff; border-radius: 100%;}
.hallFame_view .etc{font-size: 15px;  color: #e7dbbc;  line-height: 15px;}
.hallFame_view .etc > span{padding: 0 20px;}

/* 게시판 이전글 다음글 */
.bo_v_nb{margin-top: 30px; border-top: 1px solid #ccc;}
.bo_v_nb > li{border-bottom: 1px solid #ccc; display: flex;}
.bo_v_nb .nb_tit{width: 91px;}
.bo_v_nb > li > span{position: relative;}
.bo_v_nb > li > span:after{content: ""; display: block; position: absolute; width: 1px; height: 100%; max-height: 60%; background-color: #ccc; right: 0; top: 50%; transform: translateY(-50%);}
.bo_v_nb > li > * {padding: 15px 10px; display: inline-block;}
.fa-chevron-up:before, .fa-chevron-down:before{padding-right: 10px;}
.bo_v_nb > li > a{width: calc(100% - 91px);  display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.bo_v_nb > li > a:hover{text-decoration: underline;}

/* 글쓰기 버튼 */
.black_btn{background-color: #1f1f1f; color: #fff; width: 145px; line-height: 45px; text-align: center; margin-top: 30px;}

/* 후원의 집 */
.support .work_info > li{text-align: center;}
.support .work_info p{color: #666;}

/* 쿠밀리 */
.khumily-logo{display: flex; align-items: center; flex-wrap: wrap;;}
.khumily-logo li{text-align: center; width: 50%; height: 240px; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center;}
.khumily-logo img{}
.khumily-logo .v-white{background: #fff;}
.khumily-logo .v-blue{background: #233a70;}

.khumily-activity{display: flex;align-items: flex-start;flex-wrap: wrap;gap: 10px;}
.khumily-activity .item{width: calc(33.3333% - 6.7px);padding: 20px;display: flex;align-items: center;border: 1px solid #ddd;border-top: 1px solid var(--main-color);}
.khumily-activity .img{margin-right: 20px; width: 80px;}
.khumily-activity .img img{}
.khumily-activity .txt{flex: 1; color: #666; word-break: keep-all;}

.khumily-sns{display: flex;align-items: stretch;justify-content: space-between;gap: 5px; --blog: #2db400; --face: #004a92; --insta: #dc1c6d;}
.khumily-sns >li{flex: 1;}
.khumily-sns >li >a{display: inline-flex;align-items: center;background: #fff;border: 1px solid #ddd;border-radius: 5px;padding: 15px;width: 100%;height: 100%;  transition: .3s all ease;}
.khumily-sns >li >a .img{display: inline-block;margin-right: 10px; width: 30px; height: 30px; border-radius: 100%; background: url('') no-repeat center / 100%; transition: .3s all ease;}
.khumily-sns >li >a .txt{display: inline-block;line-height: 1.2;font-size: 15px;}
.khumily-sns .item1{color: var(--blog);}
.khumily-sns .item2{color: var(--face);}
.khumily-sns .item3{color: var(--insta);}
.khumily-sns .item1 .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_09.png');}
.khumily-sns .item2 .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_10.png');}
.khumily-sns .item3 .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_11.png');}

.khumily-sns .item1:hover{color: #fff; background: var(--blog);}
.khumily-sns .item2:hover{color: #fff; background: var(--face);}
.khumily-sns .item3:hover{color: #fff; background: var(--insta);}
.khumily-sns .item1:hover .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_09_on.png');}
.khumily-sns .item2:hover .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_10_on.png');}
.khumily-sns .item3:hover .img{background-image: url('/theme/khuc/img/sub/06/khumily-img_11_on.png');}

/* .khumily-sns .item1{border-color: #2db400; background: #2db400; color: #fff;}
.khumily-sns .item2{color: #004a92;}
.khumily-sns .item3{color: #dc1c6d;}
.khumily-sns .item4{border-color: transparent;background: url('/theme/khuc/img/sub/06/khumily-img_13.png') no-repeat center / cover;color: #fff;}
.khumily-sns .item3{color: #dc1c6d;}
.khumily-sns .item4{border-color: transparent;background: url('/theme/khuc/img/sub/06/khumily-img_13.png') no-repeat center / cover;color: #fff;} */

.khumily-contact{display: flex; align-items: flex-start;; flex-wrap: wrap; border: 1px solid #ddd;}
.khumily-contact >li{position: relative;width: 50%;padding: 40px 30px;}
.khumily-contact ._tit{font-size: 18px; font-size: 1.125em; color: #053b72; font-weight: 700; margin-bottom: 10px;}
.khumily-contact >li:first-child::after{content: '';position: absolute;top: 50%;right: 0;width: 1px;height: 50px;background: #ddd;transform: translateY(-50%);}


@media (max-width: 1024px){
  .khumily-activity .img{width: 50px;}

  .step_w { gap: 0; row-gap: 24px; }
  .step_w > li { gap: 0; }
  .step_w > li:not(.arrow) { flex: unset; width: calc(100% / 3 - 40px); }
}
@media (max-width: 768px){
  .khumily-logo li{width: 100%; height: auto; padding: 30px 0}

  .khumily-activity .item{width: calc(50% - 10px)}

  .khumily-sns{flex-wrap: wrap;}
  .khumily-sns >li{width: calc(50% - 3px); flex: auto;}

  .khumily-contact >li{width: 100%; padding: 20px 30px;}
  .khumily-contact >li:first-child::after{display: none;}
  .khumily-sns >li >a span br{display: none;}


  .hallFame > li { padding: 20px 16px; }
}
@media (max-width: 600px) {
    .step_w > li:not(.arrow) { flex: unset; width: calc(100% / 3 - 30px); }
    .step_w > li.arrow { width: 30px; }
    .step_w > li.arrow:before { top: 44px; width: 20px; }
    .step_w > li img { width: 100px; }


	.bo_sch form { gap: 8px; padding: 20px 16px; min-height: auto; }
	.bo_sch form select { background-position: right 10px center; background-size: 11px; }
	.bo_sch form input { flex: 1 100%; width: 100%; }
	.bo_sch form .submit { flex: 1 33%; padding: 0 10px; width: auto; }
}
@media (max-width: 480px){
    .khumily-sns >li{width: 100%;}

    .khumily-activity{gap: 15px}
    .khumily-activity .item{width: 100%; padding: 15px;}
    .khumily-activity .img{margin-right: 15px;}


    .step_w > li:not(.arrow) { flex: unset; width: calc(50% - 30px); }
}
@media (max-width: 375px) {
	input, .bo_sch form select { height: 40px; }

	.bo_sch form { flex-wrap: wrap; }
	.bo_sch form select { width: 100%; }
	.bo_sch form input { height: 40px; }
	.bo_sch form .submit { height: 40px; line-height: 40px; }
}




.khu-info {margin-top:30px;border:solid 1px #dbdbdb;box-sizing:border-box;}
.khu-info:after {content:"";display:block;clear:both;}
.khu-info > li {float:left;width:50%;padding:15px 20px;border-left:solid 1px #dbdbdb;text-align:center;box-sizing:border-box;}
.khu-info > li.ico01 {border:none;}
.khu-info > li.btm {width:100%;border-top:solid 1px #dbdbdb;}
.khu-info > li.ico01 .img:after {content:"(서울)";display:inline-block;font-size:13px;color:#0a326f;line-height:30px;vertical-align:middle;box-sizing:border-box;margin: 0px 0 -5px 5px;}
.khu-info > li.ico02 .img:after {content:"(국제)";display:inline-block;font-size:13px;color:#0a326f;line-height:30px;vertical-align:middle;box-sizing:border-box;margin: 0px 0 -5px 5px;}
.khu-info > li > p {display:inline-block;margin:0 10px;font-size:15px;color:#606060;vertical-align:middle;}
.khu-info > li > p > span {display:inline-block;margin-right:5px;font-weight:700;color:#0a326f;vertical-align:top;}


/* 후원의집 소개 > 참여방법 */
.join_way{display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px;}
.join_way >li{width: 50%; flex: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; border: 1px solid #ddd; border-top: 2px solid #a40e17; padding: 30px;}
.join_way .img{width: 90px;}
.join_way .img >img{width: 100%;}
.join_way .cont{width: 100%; flex: 1;}
.join_way .cont .t{font-size: 20px; font-weight: 700; color: #a40e17;}
.join_way .cont .desc{font-size: 15px; color: #666; margin-top: 10px;}

@media (max-width: 768px){
  .join_way >li{width: 100%; flex: auto;}
}
@media (max-width: 480px){
  .join_way >li{padding: 20px;}
  .join_way .img{width: 70px;}
  .join_way .cont .t{font-size: 18px;}
  .join_way .cont .desc{font-size: 15px;}
}



/* 반응형 */
@media (max-width: 1024px){
    .top_thum, .top_thum.icon_w, .top_thum.blue_w{padding: 20px; gap: 20px;}
    .bbs_sch, .arete_grade{padding: 20px;}
    .arete_grade > p{width: 100%;}
    .thum_vertical > li{gap: 30px;}
}
@media (max-width: 768px){
    .pc{display: none;}
    .tablet{display: block;}

    .top_thum .txt, .top_thum.icon_w .txt{width: auto; order: 2;}
    .bbs_sch{flex-wrap: wrap;}

    .arete_grade > p{font-size: 18px;}
    .arete_grade > div > img{width: 50px; height: 50px;}
    .arete_grade > div > span{font-size: 16px;}

    .bbs_thum > li{width: calc(50% - (30px/2));}

    /* .step_w > li img{width: 120px;} */

    .thum_vertical > li{flex-direction: column;}

    .work_info > li{width: calc(50% - 5px); padding: 20px;}

    .cont_w._cont02 > div{width: 100%;}

    .table_sty01 a{height: auto; line-height: 1.3; padding: 5px 20px;}
}
@media (max-width: 720px){
    .faq_list .q a, .faq_list .a{padding: 20px;}
    .faq_list .q a{padding-right: 40px;}
    .faq_list .q a:after{right: 20px;}

    .faq_list .q a:before, .faq_list .a .cont:before{width: 35px; height: 35px; line-height: 35px;}
    .faq_list .a .cont{padding-left: 50px;}

    .greeting .img_w > p{padding: 30px;}

    .hallFame_view{padding: 40px 20px;}
}

@media (max-width: 600px){
    .bo_sch form .label_box, .bo_sch form .label_box select{width: 100%}
}
@media (max-width: 480px){
    .pc{display: none;}
    .mobile{display: block;}

    .sub_btn{margin-top: 30px;}
    .bo_sch form .schSelect, .bo_sch form .schKeyword, .bo_sch form .submit{width: 100%;}
    .bo_sch form .schSelect, .bo_sch form .schKeyword{padding: 0 15px;}
    .bo_sch form .schKeyword::placeholder{font-size: 14px;}

    .bbs_thum > li{width: 100%;}

    .paging_w >*{margin: 0 5px;}

    .step_w > li{width: 48%; align-items: flex-start;}
    .step_w > li img{width: 100px;}
    .step_w > li:not(:last-child):after{width: 20px; top: 19%;}

    .typesDonate > li .cont{height: 155px;}

    .top_thum.width_btn .sub_btn span{padding-right: 0}
    .top_thum.width_btn .sub_btn span:after{display: none;}

    .thum_vertical > li .btn_w a{width: 100%;}

    .work_info > li{width:100%;}
    .record_inquiry > .item{width: 100%;}

	.hallFame { gap: 20px; }
	.hallFame > li { width: calc(100% / 3 - calc(40px / 3)); }
}
@media (max-width: 424px) {
	.hallFame > li { width: calc(50% - 10px); }
}

/* 인사말 */
.q_marks{font-size: 1.88em; color: #333; margin-bottom: 40px; position: relative; padding: 30px 100px; line-height: 1.35;}
.q_marks:before,.q_marks:after{position: absolute; content: ''; width: 40px; height: 36px; background: url('') center center no-repeat;}
.q_marks:before{left: 0; top:0; background-image: url('/theme/khuc/img/sub/common/quot_l.png')}
.q_marks:after{right: 0; bottom:0; background-image: url('/theme/khuc/img/sub/common/quot_r.png')}
.no_border{border: 0; display: block;}

@media screen and (max-width: 1280px){
    .q_marks,.junbijung .big{padding: 30px 50px}
}

@media screen and (max-width: 841px) {
    .q_marks{padding: 0 45px;}
    .q_marks:before, .q_marks:after{width: 30px; height: 26px; background-size: 100%;}
}

.arrow_step{display: flex; flex-wrap: wrap; border-top: solid 1px #dbdbdb; border-left: solid 1px #dbdbdb;}
.arrow_step > li{width: 50%; padding: 1.5rem; position: relative; border-right: solid 1px #dbdbdb; border-bottom: solid 1px #dbdbdb;}
.arrow_step > li::after{content: ''; display: block; width: 1.875rem; height: 1.875rem; background: #efefef url('/theme/khuc/img/icon/ico-sel1.png') center center no-repeat; border-radius: 30px; border: 1px solid #ddd; position: absolute; top: 50%; right: -15px; transform: translateY(-50%) rotate(-90deg);}
.arrow_step > li:nth-child(2)::after{top: auto; bottom: -15px; right: 50%; transform: rotate(0);}
.arrow_step > li:nth-child(3)::after{transform: translateY(-50%) rotate(90deg);}
.arrow_step > li:nth-child(4)::after{display: none;}

 .noflex {display: inline-block !important;}


.tab__type01-menu {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    margin: 40px auto 20px;
}

.tab__type01-menu li {
    width: 20%;
    max-width: 20%;
    flex-grow: 1;
    margin-left: -1px;
    margin-top: -1px;
}
.tab__type01-menu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    color: #111;
    padding: 10px;
    background: #f3f4f6;
    border: 1px solid #d7d7d7;
    height: 57px;
}
.tab__type01-menu .active {
    background: #fff;
    color: #9c1c1f;
    font-weight: 500;
    box-shadow: 3px 3px 3px rgba(16, 24, 40, 0.08);
}
/* li가 4개 이하일 때 (즉, 5개 미만) li 전체에 flex: 1 적용 */
.tab__type01-menu:has(> li:nth-last-child(-n+4):first-child) > li {
    max-width: none;
}
@media (max-width: 768px) {
    .tab__type01-menu li {
        width: 25%;
        max-width: 25%;
        margin-top: 0;
    }
}
@media (max-width: 480px) {
    .tab__type01-menu {
        flex-wrap: nowrap;     /* 줄바꿈 방지 */
        overflow-x: auto;      /* 가로 스크롤 허용 */
        padding-bottom: 10px;
        -webkit-overflow-scrolling: touch; /* 부드러운 스크롤 */
            margin-top: 0;
            padding-left: 5px;
    }
    /* 1. 스크롤바 전체 영역 (높이 설정) */
    .tab__type01-menu::-webkit-scrollbar {
        height: 6px;  /* 얇고 심플한 두께 */
    }

    /* 2. 스크롤바 트랙 (배경) */
    .tab__type01-menu::-webkit-scrollbar-track {
        background: transparent; /* 배경을 투명하게 해서 깔끔함 유지 */
        /* 필요하다면 background: #f5f5f5; 처럼 연한 회색 지정 가능 */
    }

    /* 3. 스크롤바 핸들 (움직이는 막대) */
    .tab__type01-menu::-webkit-scrollbar-thumb {
        background-color: #d1d1d1; /* 연한 회색 */
        border-radius: 10px;       /* 둥근 모서리 */
        border: 2px solid transparent; /* 여백을 주는 느낌 (선택사항) */
        background-clip: content-box;
    }

    /* 4. 마우스 올렸을 때 핸들 색상 진하게 */
    .tab__type01-menu::-webkit-scrollbar-thumb:hover {
        background-color: #a8a8a8;
    }
    .tab__type01-menu li {
            width: auto;
            max-width: none;
        flex: 0 0 auto;       /* 아이템 크기 고정 (찌그러짐 방지) */
        white-space: nowrap;  /* 텍스트 줄바꿈 방지 */
    }
    .tab__type01-menu li a {
        font-size: 14px;
        padding: 10px 20px;
    }
}

.tab__type02-menu {}
.tab__type02-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #d1d7e1;
    border-bottom : 1px solid #d1d7e1;
}
.tab__type02-menu li {
    flex: 1;
}
.tab__type02-menu li a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 90px;
    font-size: 17px;
    font-weight: 700;
    text-align: center;
    line-height: 1.4;
    color: #7d8086;
    padding: 0 10px;
    word-break: keep-all;
}
.tab__type02-menu a.active {
    color: #080717;
/*  border-bottom: 5px solid #002654; */
}
.tab__type02-menu a.active:before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%) rotate(0deg); /* rotate(0) = 위쪽 삼각형 */
    bottom: 0;
    width: 28px;
    height: 14px;
    background: #002654;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%); /* 삼각형 모양 */
}
.tab__type02-menu li a:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 5px;
    transition: all .3s ease-in-out;
    background: #002654;
}
.tab__type02-menu a.active:after {
    left: 0;
    width: 100%;
}