@charset "utf-8";

.subContainer {margin-top: 120px;}

/* sub navigation */
.sub_lnb {position: fixed; width: 100%; height: 60px; background: url('/images/page/contents/lnb_bg.png') no-repeat right 50%, linear-gradient(to right, #00339f, #21388b); background-size: cover; transition: all 0.3s ease-in-out; z-index: 8000;}
.cont_navigation {position: relative; display: flex; align-items: center; height: 60px;}
.cont_navigation .home {display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; text-align: center;}
.cont_navigation .home > i {font-size: 18px; color: #fff; vertical-align: -webkit-baseline-middle;}
.cont_navigation .navi_select {position: relative; z-index: 100;}
.cont_navigation .navi_select .depth {position: relative; display: block; width: 220px; height: 100%; padding: 0 20px; text-align: left; transition: all .3s;}
.cont_navigation .navi_select .depth:after {content: ''; position: absolute; top: 50%; right: 0; margin-top: -9px; display: block; width: 1px; height: 18px; background-color: rgba(255, 255, 255, .3);}
.cont_navigation .navi_select.select1 .depth:before {content: ''; position: absolute; top: 50%; left: 0; margin-top: -9px; display: block; width: 1px; height: 18px; background-color: rgba(255, 255, 255, .3);}
.cont_navigation .navi_select .depth span {position: relative; display: block; color: #fff; font-size: 1rem; line-height: 100%; letter-spacing: -0.05rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.cont_navigation .navi_select .depth span:after {content: ''; position: absolute; top: 50%; right: 5px; margin-top: -5px; display: block; width: 8px; height: 8px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); transition: all .4s; box-sizing: border-box;}

.cont_navigation .navi_list {position: absolute; top: 30px; left: 0; width: 100%; background-color: rgba(255, 255, 255, .9); backdrop-filter: blur(3px); border: 1px solid var(--gray-200); padding: 10px 12px; display: none; border-radius: 16px;}
.cont_navigation .navi_list li {display: block; font-size: 1rem; padding: 10px 12px; line-height: 1; border-radius: 8px;}
.cont_navigation .navi_list li a {display: block; color: #666; letter-spacing: -0.05rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.cont_navigation .navi_list li:hover {background-color: var(--gray-100);}
.cont_navigation .navi_list li:hover a {color: var(--main-color);}

/* navi active */
.cont_navigation .navi_select.active .depth span:after {transform: rotate(225deg);}

/* scroll lnn */
.down .sub_lnb {margin-top: -40px;}

/* sub tit */
.sub_wrap {padding-top: 150px;}
.page_title .inner {border-bottom: 1px solid var(--gray-200); padding-bottom: 40px;}
.page_title .inner:after {content: ''; clear: both; display: block;}
.page_title h1 {font-size: 36px; font-weight: 800; color: #000;}
.page_title p {font-size: 18px; font-weight: 400; color: var(--gray-400); margin-top: 20px;}
.page_title p > b {color: var(--sub-color);}


/* navigation - page_path */
.page_path {position: absolute; bottom: 50px; right: 0; display: flex; align-items: center;}
.page_path li {position: relative; font-size: 15px; color: var(--gray-300); font-weight: 500; padding: 0 10px;}
.page_path li a {color: var(--main-color);}
.page_path li:before {content: ''; display: block; position: absolute; top: 50%; left: 0; width: 2px; height: 10px; margin-top: -5px; margin-left: 1px; background-color: var(--gray-200); transform: rotate(15deg);}
.page_path li:first-child:before {content: none;}
.page_content {padding: 60px 0 120px;}


/* page intro title */
h2.intro_tit {font-size: 26px; font-weight: 700; margin-bottom: 40px; word-break: keep-all;}
h2.intro_tit > b {color: var(--main-color);}


/* section */
section + section {margin-top: 60px;}

/* page content title */
.cont_tit {display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.cont_tit h4 {font-size: 28px; font-weight: 700;}


/* list style 공통 */
.list_st_dot > li {position:relative; padding-left:10px; text-align:left; font-size: 1rem}
.list_st_dot > li + li{margin-top:10px;}
.list_st_dot > li:before{content:''; width:4px; height:4px; border-radius:50%; background:#aaa; position:absolute; display:block; left:0; top:10px; margin-right:8px;}
.list_st_dot > li > b {color:#222;}
.list_st_dot > li > p {font-size: 17px; color: #333;}
.list_st_dot > li > ul {margin-top: 15px;}

.list_st_dash > li {position:relative; padding-left:10px; text-align:left; font-size: 1rem;}
.list_st_dash > li + li{margin-top:10px;}
.list_st_dash > li:before{content:'-'; position:absolute; display:block; left:0; top:0; margin-right:8px;}
.list_st_dash > li > b{color:#222;}


/* arw button */
.arw_btn {text-align: center; font-size: 1rem; font-weight: 700; width: 45px; height: 45px;}
.arw_btn .arw {position: relative; width: 100%; height: 100%; display: inline-block; border-radius: 50%; background: no-repeat 50% 50%; background-image: url('/images/page/common/icon_arw_wh.png'); background-size: auto 13px; background-color: #000; margin: 0 auto; z-index: 10; transition: all .3s;}
.arw_btn .arw_circle {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; z-index: 1; animation: wavePulse 1.6s linear infinite;}

.arw_btn:hover .arw {background-color: var(--main-color);}

@keyframes wavePulse {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: .3
    }

    100% {
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
        opacity: 0
    }
}


/* tab */
.tab {display: inline-block; font-size: 0; margin-bottom: 60px;}
.tab .tab_item {display: inline-block; padding: 0 30px; height: 40px; font-size: 18px; line-height: 40px; color: var(--gray-400); background-color: var(--gray-100); border-radius: 20px; margin-right: 10px;}
.tab .tab_item.active {background-color: var(--main-color);}
.tab .tab_item.active {color: #fff; font-weight: 600;}

.tab_content {display: none;}
.tab_content.active {display: block;}


/* 준비중 페이지 */
.ready_box {text-align: center;}
.ready_box i {display: block; width: 120px; height: 120px; border: 5px solid #ddd; border-radius: 50%; margin: 0 auto;}
.ready_box i span {font-size: 60px; font-weight: 800; color: #ddd; line-height: 120px;}
.ready_box h5 {font-size: 35px; font-weight: 800; color: #111; letter-spacing: 5px; margin-top: 40px;} 
.ready_box p {margin-top: 30px; color: #666;}


/* 협회 소개 - 인사말 */
.greeting {display: flex; justify-content: space-between; gap: 40px 60px;}
.greeting .txt_box {position: relative; width: 55%;}
.greeting .txt_box p {margin-bottom: 24px; font-size: 18px; color: #111; word-break: keep-all;}
.greeting .sign {clear: both; padding-top: 40px; text-align: right;}
.greeting .sign * {display: inline-block; vertical-align: middle;}
.greeting .sign span {font-size: 1rem; font-weight: 400; color: var(--gray-400);}
.greeting .sign img {width: 150px; margin-left: 15px;}
.greeting .img_box {width: 45%; border: 0; padding-top: 47%;}


/* 협회 소개 - 연혁 */
.history .history_cont {margin-bottom: 100px;}
.history .history_cont .img_box {position: relative; width: 100%; height: 300px; border-radius: 20px; overflow: hidden; background-color: #000; margin-bottom: 60px;}
.history .history_cont .img_box > img {object-fit: cover;}
.history .history_cont .img_box p {position: absolute; left: 60px; bottom: 40px; font-size: 32px; font-weight: 700; color: #fff;}
.history .history_cont .item {display: flex; align-items: stretch; justify-content: space-between; padding-bottom: 50px;}
.history .history_cont .item:last-child {padding-bottom: 0;}
.history .history_cont .item .history_year {width: 295px; padding-left: 30px;} 
.history .history_cont .item .history_year h3 {position: relative; font-size: 32px; font-weight: 800; color: #111;}
.history .history_cont .item .history_year h3:after {content: ''; position: absolute; top: 50%; transform: translateY(-50%); right: -5.5px; width: 11px; height: 11px; background-color: var(--gray-200); border-radius: 50%; z-index: 10;}
.history .history_cont .item.active .history_year h3 {color: var(--main-color);}
.history .history_cont .item.active .history_year h3:after {background-color: var(--main-color);}

.history .history_list {position: relative; width: calc(100% - 295px); padding-left: 165px; padding-top: 10px;}
.history .history_list:before,
.history .history_list:after {content: ''; position: absolute; top: 20px; left: 0; width: 1px; height: calc(100% + 100px); background-color: var(--gray-200); transition: height 1s ease;}
.history .history_list:after {height: 0;}
.history .history_cont .item.active .history_list:after {background-color: var(--main-color); height: calc(100% + 100px);}
.history .history_list > li {display: flex; align-items: stretch; justify-content: space-between; font-size: 18px;} 
.history .history_list > li + li {margin-top: 20px;}
.history .history_list > li .month {width: 180px; font-weight: 600;}
.history .history_list > li > ul {width: calc(100% - 180px);}
.history .history_list > li > ul > li {position: relative; font-size: 17px; font-weight: 400; padding-left: 12px;}
.history .history_list > li > ul > li:before {content: ''; position: absolute; top: 12px; left: 0; width: 5px; height: 1px; background-color: var(--gray-300);}
.history .history_list > li > ul > li + li {margin-top: 10px;}
.history .history_list > li > ul > li > small {display: block; font-size: 14px; font-weight: 400; color: var(--gray-400);}


/* 협회 소개 - 조직도 */
.organization .org_box {display: flex; align-items: center; justify-content: center; width: 160px; height: 60px;}
.organization .org_box span {font-size: 1rem; color: #000; font-weight: 500;}
.organization .org_box.type1 {border: 3px solid var(--main-color);  border-radius: 30px;}
.organization .org_box.type2 {background-color: #000; border-radius: 10px;}
.organization .org_box.type2 span {color: #fff;}
.organization .org_box.type3 {width: 200px; background-color: rgba(var(--sub-color-rgb), .1); border-radius: 10px;}
.organization .org_box.type3 span {color: var(--main-color);}

.organization .org_list {position: relative; display: flex; flex-direction: column; align-items: center; gap: 60px 0; max-width: 890px; width: 100%; margin: 0 auto 120px;}
.organization .org_list:after {content: ''; position: absolute; top: 0; left: 50%; width: 2px; height: calc(100% - 120px); background-color: var(--gray-200); z-index: -1;}
.organization .org_depth1 {position: relative;}
.organization .org_depth1 .org_rank {position: relative; display: flex; align-items: center; justify-content: center; width: 160px; height: 160px; border-radius: 50%; background-color: var(--main-color); margin: 0 auto;}
.organization .org_depth1 .org_rank:after {content: ''; position: absolute; bottom: 10px; left: 0; right: 0; margin: 0 auto; width: 100px; height: 40px; background: url('/images/logo_symbol_wh.png') no-repeat 50% 50%; background-size: auto 40px; opacity: .2;}
.organization .org_depth1 .org_rank strong {font-size: 24px; font-weight: 700; color: #fff;}
.organization .org_depth1 .org_box.type1 {position: absolute; top: 50%; transform: translateY(-50%); left: calc(50% + 140px);}
.organization .org_depth1 .org_box.type1:before {content: ''; position: absolute; top: 50%; left: -63px; width: 60px; height: 2px; background-color: var(--gray-200); z-index: -1;}

.organization .org_depth2 {position: relative;}
.organization .org_depth2 .org_box {margin: 0 auto;}

.organization .org_depth3 {position: relative;}
.organization .org_depth3 .org_box {margin: 0 auto;}
.organization .org_depth3 .org_box.type1 {position: absolute; top: 50%; transform: translateY(-50%); left: calc(50% + 140px);}
.organization .org_depth3 .org_box.type1:before {content: ''; position: absolute; top: 50%; left: -63px; width: 60px; height: 2px; background-color: var(--gray-200); z-index: -1;}

.organization .org_depth4 {position: relative; display: flex; align-items: center; justify-content: center; gap: 0 30px; margin-top: 60px;}
.organization .org_depth4:before {content: ''; position: absolute; top: -60px; width: calc(100% - 200px); height: 2px; background-color: var(--gray-200);}
.organization .org_depth4 .org_box.type3 {position: relative;}
.organization .org_depth4 .org_box.type3:before {content: ''; position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 2px; height: 100%; background-color: var(--gray-200);}

.organization .bbsTop {margin-top: 60px;}
.organization .bbsTop .search_box {width: 100%; border-radius: 10px; padding: 20px 0; background-color: var(--gray-100);}

.org_tab {width: 100%; height: 60px; border-bottom: 1px solid var(--gray-200); background-color: #fff;}
.org_tab .inner {width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; }
.org_tab .tab_item {position: relative; text-align: center; width: calc(100% / 8); height: 100%; line-height: 60px;}
.org_tab .tab_item:before {content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 0; height: 3px; background-color: var(--main-color); transition: all .3s;}
.org_tab .tab_item > span {font-size: 17px; font-weight: 500; color: var(--gray-400);}
.org_tab .tab_item:hover:before,
.org_tab .tab_item.active:before {width: 100%;}
.org_tab .tab_item:hover > span,
.org_tab .tab_item.active > span {color: var(--main-color); font-weight: 700;}

/* .org_cont {padding-top: 60px;} */
.organization section:first-child {margin-top: 60px;}
.organization section .info li {font-size: 1rem;}
.organization section .info li {font-size: 1rem;}
.organization section .info li + li {margin-top: 5px;}
.organization section .info li i {width: 24px; height: 24px; border-radius: 50%; background-color: rgba(var(--sub-color-rgb), .2); color: var(--main-color); font-size: 1rem; line-height: 24px; text-align: center; margin-right: 5px;}

/* scroll org tab */
.org_tab.fixed {position: fixed; width: 100%; top: 140px; left: 0; z-index: 10;}
.org_wrap.fixed {padding-top: 60px;}


/* 협회 소개 - 오시는 길 */
.map_label {position: relative; display: inline-block; background: var(--main-color); padding: 10px 20px;}
.map_label > span {color: #fff;}
.map_label:after {content:''; position: absolute; left: 0; right: 0; bottom: -10px; margin: 0 auto; width: 0; height: 0; border-top: 10px solid var(--main-color); border-left: 10px solid transparent; border-right: 10px solid transparent;}

.location .map_cont .cont_tit {padding-left: 20px;}
.location .map_box {width: 100%; overflow: hidden; background-color: #ddd;}
.location .map_box .root_daum_roughmap {width: 100%;}
.location .map_box .root_daum_roughmap .wrap_map {height: 100%; height: 400px;}
.location .map_box .root_daum_roughmap .cont {display: none;}
.location .map_info {position: relative; background: linear-gradient(to right, #051632, var(--main-color)); border-radius: 20px 20px 0 0; padding: 30px 40px;}
.location .map_info .address {font-size: 26px; font-weight: 700; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .2); padding-bottom: 20px;}
.location .map_list {margin-top: 20px; font-size: 0;}
.location .map_list li {display: flex; align-items: center; font-size: 17px; color: #fff;}
.location .map_list li + li {margin-top: 10px;}
.location .map_list li .tit {position: relative; width: 120px;}
.location .map_list li .tit:after {content: ''; position: absolute; top: 50%; margin-top: -6px; right: 0; width: 2px; height: 12px; background-color: rgba(255, 255, 255, .2);}
.location .map_list li .tit strong {font-size: 18px; font-weight: 700; vertical-align: middle;}
.location .map_list li .tit i {background-color: rgba(255, 255, 255, .2); padding: 5px; border-radius: 50%; vertical-align: middle; margin-right: 10px;}
.location .map_list li p {display: block; padding-left: 20px;}


/* 사업공고 - 사업신청 폼 */
/* step */
.step {border:1px solid #ddd; border-radius:15px; margin-bottom:60px;}
.step .step_list:after {content: ''; clear: both; display: block;}
.step .step_list {width:fit-content; margin:0 auto; padding: 30px 0; font-size: 0;}
.step .step_list li {position: relative; float: left; padding: 0 50px 0 25px; font-size: 1rem; font-weight: 500; text-align: center;}
.step .step_list li:after {content: ''; position: absolute; right: 0; top: 50%; margin-top: -1px; width: 30px; height: 2px; border-bottom: 2px dashed var(--gray-200);}
.step .step_list li:last-child:after {content: none;}
.step .step_list li span {display: inline-block; max-width: 80px; font-weight: 800; text-transform: uppercase; font-size: 13px; border: 2px solid var(--gray-200); padding: 4px 8px; border-radius: 20px; vertical-align: middle; margin-right: 10px;}

.step .step_list li.on a {color: #243056; font-weight: 800;}
.step .step_list li.on:after {border-color: var(--main-color);}
.step .step_list li.on span {background: var(--main-color); color: #fff; border-color: var(--main-color); box-shadow: 0 5px 10px 0 rgba(var(--main-color-rgb), .2);}

.step .step_list li.end {color: var(--gray-400);}
.step .step_list li.end span {color: var(--gray-300); border-color: var(--gray-300); background-color: var(--gray-200);}
.step .step_list li.end:after {border-color: #999;}


/* 사업공고 - 협회일정 */
.schedule .all {background-color: #000;}

.schedule .calendar_top {display: flex; align-items: center; justify-content: center; gap: 0 20px; margin-bottom: 30px;}
.schedule .calendar_top .month_ctrl {display: flex; align-items: center; justify-content: center; gap: 0 15px;}
.schedule .calendar_top .month_ctrl button {width: 30px; height: 30px; border: 1px solid var(--gray-200); border-radius: 5px;}
.schedule .calendar_top .month_ctrl button > i {font-size: 20px; color: var(--gray-400);}
/* .schedule .calendar_top .month_ctrl select {padding-left: 20px; padding-right: 50px; height: 50px; border: 0; background-color: #fff; border: 1px solid var(--gray-200); border-radius: 6px; color: #111; font-size: 20px; font-weight: 600; cursor: pointer;} */
.schedule .calendar_top .month_label > h3 {font-size: 32px; font-weight: 700; display: inline-block;}
.schedule .cal_category {display: flex; align-items: center; justify-content: end; gap: 10px 10px; margin-bottom: 20px;}
.schedule .cal_category .item {border: 1px solid var(--gray-100); background-color: var(--gray-100); padding: 8px 20px; border-radius: 30px;}
.schedule .cal_category .item .dot {display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color: #666; vertical-align: middle; margin-right: 5px;}
.schedule .cal_category .item span {display: inline-block; vertical-align: middle; font-size: 15px; color: var(--gray-400); font-weight: 400;}
.schedule .cal_category .item.active {border: 1px solid var(--gray-200); background-color: #fff;}
.schedule .cal_category .item.active span {color: #111; font-weight: 500;}

.schedule .calendar {width: 100%;}
.schedule .calendar .sun > span {color: #FC6259 !important;}
.schedule .calendar .sat > span {color: #2A71EF !important;}
.schedule .calendar .cal_week {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background-color: rgba(var(--sub-color-rgb), .07); border-radius: 8px; margin-bottom: 10px;}
.schedule .calendar .cal_week .day {position: relative; text-align: center; padding: 16px 0; font-size: 17px; font-weight: 600; color: var(--gray-400);}
.schedule .calendar .cal_week .day:after {content: ''; position: absolute; right: 0; top: 50%; margin-top: -6px; width: 1px; height: 12px; background-color: #DEE3EA;}
.schedule .calendar .cal_week .day:last-child:after {content: none;}
.schedule .calendar .cal_date {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));}
.schedule .calendar .cal_date:last-child {border-bottom: 1px solid var(--gray-200);}
.schedule .calendar .cal_date .date {position: relative; min-height: 120px; border: 1px solid var(--gray-200); border-width: 1px 1px 0 0; padding: 50px 10px 0 10px; padding-top: 50px;}
.schedule .calendar .cal_date .date > span {position: absolute; top: 15px; left: 15px; display: inline-block; font-size: 1rem; font-weight: 400; color: #111; z-index: 10;}
.schedule .calendar .cal_date .date:last-child {border-right: 0;}
/* .schedule .calendar .cal_date .date.today {border-color: var(--sub-color)} */
.schedule .calendar .cal_date .date.today > span {color: #fff;}
.schedule .calendar .cal_date .date.today > span:before {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; background-color: var(--sub-color); border-radius: 50%; z-index: -1;}
.schedule .calendar .date_bar {position: absolute; left: 0; padding: 0 16px; height: 26px; line-height: 26px; z-index: 1000; border-radius: 15px; background-color: #ddd; color: #fff; font-weight: 500; font-size: 1rem;}
.schedule .calendar .date_bar.bar_start {border-radius: 15px 0 0 15px;}
.schedule .calendar .date_bar.bar_end {border-radius: 0 15px 15px 0;}

.schedule .calendar .cal_date .date_more_btn {position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; padding-top: 0; margin-top: 0;}
.schedule .calendar .cal_date .date_more_btn {width: 100%; padding: 5px 0; text-align: center; font-size: 1rem; font-weight: 400; color: var(--gray-400);}
.schedule .calendar .cal_date .date_more_btn > span {color: var(--main-color); margin-right: 5px;}
.schedule .calendar .cal_date .date_more_btn:hover {color: var(--main-color); font-weight: 500;}

/* 타기관 공고 */
.ext_dl_group{background:var(--gray-100); padding:10px; border-radius:10px; display:flex; align-items: center; gap:10px; border:1px solid #ddd; flex-wrap: wrap;}
.ext_dl_group dl{display:flex; background:#fff; padding:2px 10px; border-radius:25px; border:1px solid #ddd; font-size:14px; gap:5px;}
.ext_dl_group > dl > dt{font-weight: 500; color:#222; white-space: nowrap;}
.ext_dl_group > dl > dt > i.bx{color:rgba(var(--main-color-rgb), 0.7);}
.ext_dl_group > dl > dd{color:#666;}
.ext_dl_group > dl > dd > div{display:flex; gap:0 5px; flex-wrap: wrap;}
.ext_dl_group > dl > dd > div span + span{position:relative; padding-left:12px;}
.ext_dl_group > dl > dd > div span + span:before{content:''; display:block; width:3px; height:3px; border-radius: 50%; background:#ddd; position:absolute; left:0; top:0; bottom:0; margin:auto;}



.ext_status{display:flex; justify-content: space-between; align-items: center; gap:40px; margin-top:30px; padding-bottom:30px; border-bottom:1px dashed #ddd;}
.ext_stend{text-align: center; width:fit-content; min-width:320px;}
.ext_stend > strong{font-family: var(--tit_font); font-size:18px; color:#fff; font-weight: 500; background:var(--main-color); display:block; padding:10px; border-radius:10px;}
.ext_stend > ul{display:flex; justify-content: center; align-items: stretch; gap:10px; margin-top:10px;}
.ext_stend > ul > li{width:calc((100% - 10px)/2); height:100%; padding:10px; border:1px solid #ddd; text-align: center; display: flex; flex-direction: column; justify-content: center;}
.ext_stend > ul > li b{font-size:26px;}
.ext_stend > ul > li span{font-size:16px;}


.ext_link{width:100%;}
.ext_link > ul{ display:flex; justify-content:space-between; align-items: stretch; flex-wrap: wrap; gap: 10px;}
.ext_link > ul > li{width:calc((100% - 80px)/5); border:1px solid #ddd; border-radius: 10px; height:100%;}
.ext_link > ul > li > a{display:block; padding: 15px; height:100%;}
.ext_link > ul > li > a > span{text-align: left; font-size:14px; position:relative; padding-left:15px;}
.ext_link > ul > li > a p{text-align: right;}
.ext_link > ul > li > a p > b{font-size:20px;}
.ext_link > ul > li > a > span:before{content:''; display:block; width:8px; height:8px; border-radius:50%; position:absolute; left:0; top:0; bottom:0; margin: auto;}
.ext_link > ul > li:nth-child(1) > a > span:before{background:#6B21D9}
.ext_link > ul > li:nth-child(2) > a > span:before{background:#C05200}
.ext_link > ul > li:nth-child(3) > a > span:before{background:#9D1239}
.ext_link > ul > li:nth-child(4) > a > span:before{background:#065F46}
.ext_link > ul > li:nth-child(5) > a > span:before{background:#0057B8}
.ext_link > ul > li:nth-child(6) > a > span:before{background:#00875A}
.ext_link > ul > li:nth-child(7) > a > span:before{background:#0369A1}
.ext_link > ul > li:nth-child(8) > a > span:before{background:#7E22CE}
.ext_link > ul > li:nth-child(9) > a > span:before{background:#B45309}
.ext_link > ul > li:nth-child(10) > a > span:before{background:#0F766E}

.ext_link > ul > li > a p > span{color:#666; font-size:12px;}

/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
.public .public_box {padding: 20px 20px; border: 1px solid var(--gray-200); background-color: var(--gray-100); border-radius: 16px;}
.public .public_box ul {display: flex; align-items: stretch; flex-wrap: wrap; gap: 10px 20px;}
.public .public_box ul > li {position: relative; width: calc((100% - 80px) / 5); text-align: left;}
.public .public_box ul > li > a {display: block; width: 100%; height: 100%; background-color: #fff; border: 1px solid var(--gray-200); padding: 10px 20px; border-radius: 8px; font-size: 1rem; font-weight: 500; color: #111; transition: all .25s;}
.public .public_box ul > li > a span {transition: all .25s;}
.public .public_box ul > li > a i {display: flex; align-items: center; justify-content: center; width: 40px; height: 100%; position: absolute; top: 0; right: 0; border-left: 1px solid var(--gray-200); font-size: 18px; color: var(--gray-300); text-align: center; border-radius: 0 8px 8px 0; transition: all .25s;}

.public .public_box ul > li:hover > a {border-color: var(--main-color); box-shadow: 0 3px 15px 0 rgba(var(--main-color-rgb), .1);}
.public .public_box ul > li:hover > a span {padding-left: 10px;}
.public .public_box ul > li:hover > a i {border-color: var(--main-color); background-color: var(--main-color); color: #fff;}

/* .local_government .cont_tit {position: relative;}
.local_government .cont_tit:after {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 300px); border: 1px dashed var(--gray-200); z-index: -1;}
.local_government .cont_tit h4 {background-color: #fff;} */


/* 관련기업 소개 */
.partner .partnerList {display: flex; gap: 25px 25px; flex-wrap: wrap; align-items: stretch;}
.partner .partnerList li {width: calc((100% - 75px) / 4); border: 1px solid var(--gray-200); border-radius: 15px; overflow: hidden;}
.partner .partnerList li.nodata {width: 100%;}
.partner .partnerList li .thumb {position: relative; display: flex; align-items: center; justify-content: center; width: 100%; padding: 30px 30px; aspect-ratio: 16 / 9; background-color: #fff;}
.partner .partnerList li .thumb > img {max-width: 100%; max-height: 100%; object-fit: contain; transform: scale(1); transition: all .25s;}
.partner .partnerList li .link_btn {position: absolute; bottom: 10px; right: 10px; display: block; width: 40px; height: 40px; background-color: var(--gray-100); border: 1px solid var(--gray-200); border-radius: 10px; text-align: center; line-height: 40px; transition: all .25s;}
.partner .partnerList li .link_btn > i {font-size: 20px; color: var(--main-color);}
.partner .partnerList li .txt {border-top: 1px solid var(--gray-200); padding: 25px 25px;}
.partner .partnerList li .txt .tit {display: block; font-size: 18px; font-weight: 600; margin-top: 10px;}
.partner .partnerList li .txt P {font-size: 1rem; color: var(--gray-400); margin: 5px 0;}
.partner .partnerList li .txt P.address {font-size: 15px; color: #000;}
.partner .partnerList li .txt P.address > i {vertical-align: text-top;}
.partner .partnerList li:hover .link_btn {background-color: var(--main-color); border-color: var(--main-color);}
.partner .partnerList li:hover .link_btn > i {color: #fff;}
.partner .partnerList li:hover .thumb > img {transform: scale(1.1);}

.partner .partner_box {display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;}
.partner .partner_box .partner_img {position: relative; display: flex; align-items: center; justify-content: center; width: 380px; height: 220px; border: 1px solid var(--gray-200); padding: 30px 30px; overflow: hidden; background-color: #fff; border-radius: 10px;}
.partner .partner_box .partner_img > img {max-width: 100%; max-height: 100%; object-fit: contain;}
.partner .partner_box .partner_txt {width: calc(100% - 380px); padding-left: 80px;}
.partner .partner_box .partner_txt .tit {display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.partner .partner_box .partner_txt .tit strong {font-size: 30px; font-weight: 700; color: #111;}
.partner .partner_box .partner_txt .tit .link_btn {display: block; width: 40px; height: 40px; background-color: var(--gray-100); border: 1px solid var(--gray-200); border-radius: 10px; text-align: center; line-height: 40px; transition: all .25s;}
.partner .partner_box .partner_txt .tit .link_btn > i {font-size: 20px; color: var(--sub-color);}
.partner .partner_box .partner_txt .tit .link_btn:hover {background-color: var(--sub-color); border-color: var(--sub-color);}
.partner .partner_box .partner_txt .tit .link_btn:hover > i {color: #fff;}
.partner .partner_box .partner_txt p {font-size: 18px; line-height: 1.5; font-weight: 400; color: #111;}
.partner .partner_box .partner_txt .cont_box {margin-top: 15px;}


/* 통합검색 */
.search section + section {padding-top: 60px; border-top: 1px dashed var(--gray-200);}
.search .pagination {margin-top: 40px !important;}

/* 팝업 */
.product_img {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 1px solid var(--gray-200); border-radius: 10px; overflow: hidden;}

/* 레이어팝업 layerpopup */
.layer_popup {position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; display: none;}
.layer_popup {background: rgba(16, 25, 36, .4); backdrop-filter: blur(5px);}
.popup_box {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; width: 1024px; max-height: 95%; height: auto; background: #fff; border: 1px solid #eee; box-shadow: 0 3px 29px 0 rgba(0, 0, 0, 0.15); border-radius: 10px; overflow: auto;}
.popup_box.sm {width: 640px;}
.popup_box .popup_header {position: relative; width: 100%; height: 60px; background-color: var(--gray-100); padding: 16px 30px; border-bottom: 1px solid #eee;}
.popup_box .popup_header > h4 {font-size: 18px; font-weight: 600;}
.popup_box .close_btn {position: absolute; top: 0; right: 0; transform: none; z-index: 10; display: block; width: 60px; height: 60px; background: url("/images/page/common/icon_close.svg") no-repeat 50% 50%; background-size: 20px auto;}
.popup_box .popup_body {padding: 30px 30px;}
.popup_box .popup_body .map {height: 400px;}
.popup_box .search_box {margin-bottom: 30px;}
.popup_box .btn_wrap {margin-top: 0; padding-top: 10px; text-align: center !important;}
.popup_box .pagination {margin-top: 30px; padding-top: 20px;}
.popup_box .pagination .page_item {width: 35px; height: 35px; line-height: 33px; font-size: 15px;}
.popup_box .popup_bottom {padding: 16px 30px; border-top: 1px solid var(--gray-200);}
.popup_box .fixedY {max-height: 303px;}


@media (max-width: 1440px) {

	/* navigation - page_path */
	.page_path {right: 20px;}

	/* 협회 소개 - 조직도 */
	.org_tab .inner {padding: 0;}
	.org_tab.fixed .inner {padding: 0 20px;}
}


@media (max-width: 1280px) {

	/* sub tit */
	.sub_wrap {padding-top: 120px;}
	.page_title h1 {font-size: 32px;}


	/* 협회 소개 - 인사말 */
	.greeting .txt_box p {font-size: 16px;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .img_box {height: 240px;}
	.history .history_cont .img_box p {font-size: 28px; left: 40px;}
	.history .history_cont .item .history_year h3 {font-size: 28px;}


	/* 협회 소개 - 조직도 */
	.org_tab .tab_item > span {font-size: 1rem;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar_top .month_label > h3 {font-size: 28px;}


}

@media (max-width: 1024px) {

	/* sub navigation */
	.sub_lnb {height: 50px;}
	.cont_navigation {height: 50px;}
	.cont_navigation .home {width: 50px; height: 50px;}
	.cont_navigation .navi_list {top: 25px;}

	/* sub tit */
	.page_title p {font-size: 1rem;}


	/* list style 공통 */
	.list_st_dot > li > p {font-size: 1rem;}


    /* arw button */
    .arw_btn .arw {width: 40px; height: 40px; background-size: auto 9px;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .item .history_year {width: 220px;}
	.history .history_cont .item .history_year h3 {font-size: 24px;}
	.history .history_list {width: calc(100% - 220px); padding-left: 120px;}
	.history .history_list > li {font-size: 16px;}
	.history .history_list > li .month {width: 120px;}
	.history .history_list > li > ul {width: calc(100% - 120px);}
	.history .history_list > li > ul > li {font-size: 1rem;}


	/* 협회 소개 - 조직도 */
	.org_tab {height: 50px;}
	.org_tab .tab_item {line-height: 50px;}

	/* scroll org tab */
	.org_tab.fixed {top: 130px;}


	/* 협회 소개 - 오시는 길 */
	.location .map_info .address {font-size: 22px;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar .cal_week .day {font-size: 1rem;}

	/* 타기관 공고 */
	.ext_status{flex-direction: column; gap:30px;}
	.ext_stend {width:100%; display:flex; align-items: center; border:1px solid #ddd; border-radius:10px; overflow:hidden;}
	.ext_stend > strong{width:50%; max-width:320px; border-radius: 0;}
	.ext_stend > ul{width:80%; margin-top:0; padding:10px;}
	.ext_stend > ul > li{width:100%; flex-direction:row-reverse; align-items: center; gap:10px; padding:0; border:none; border-radius:0; }
	.ext_stend > ul > li + li{border-left:1px solid #ddd;}
	.ext_stend > ul > li > span{position:relative; padding-right:10px; font-size:16px;}
	.ext_stend > ul > li > span:before{content:':' color:#666; position:absolute; right:0;}
	.ext_stend > ul > li b{font-size:16px;}

	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 60px) / 4);}

	/* 지원기업 소개 */
	.partner .partnerList li {width: calc((100% - 50px) / 3);}
	.partner .partner_box .partner_txt {padding-left: 40px;}
	.partner .partner_box .partner_txt .tit strong {font-size: 24px;}
	.partner .partner_box .partner_txt p {font-size: 16px;}


	/* 레이어팝업 layerpopup */
    .popup_box,
    .popup_box.sm {width: 94%;}
    .popup_box .popup_body {padding: 20px 20px;}
    .popup_box .popup_header {padding-left: 20px; padding-right: 20px;}

}

@media (max-width: 960px) {
	/* 협회 소개 - 조직도 */
	.organization .org_box.type3 {width: 160px;}
    .organization .org_depth4 {gap: 0 16px;}
    .organization .org_depth4:before {width: calc(100% - 160px);}
	
}

@media (max-width: 768px) {
	/* sub tit */
	.sub_wrap {padding-top: 90px;}
	.page_title .inner {padding-bottom: 30px;}
	.page_title h1 {font-size: 28px;}


	/* navigation - page_path */
	.page_path {bottom: 30px;}
	.page_content {padding: 60px 0 80px;}


	/* page intro title */
	h2.intro_tit {font-size: 22px;}


	/* section */
	section + section {margin-top: 40px;}


	/* page content title; */
	.cont_tit h4 {font-size: 22px;}


	/* tab */
	.tab {display: flex; align-items: center; flex-wrap: nowrap; gap: 10px; margin-bottom: 40px; width: 100%; overflow-y: hidden; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
	.tab .tab_item {font-size: 16px; margin-right: 0; padding: 0 24px; white-space: nowrap;}

	
	/* 협회 소개 - 인사말 */
	.greeting {flex-direction: column-reverse;}
	.greeting .txt_box {width: 100%;}
	/* 이미지 안나오는거 확인하기 */
	.greeting .img_box {width: 100%; padding-top: 80%;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .img_box {height: 200px; margin-bottom: 40px;}
	.history .history_cont .img_box p {font-size: 24px;}


	/* 협회 소개 - 조직도 */
	.org_tab .inner {overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; gap: 0 30px; scrollbar-width: none; -ms-overflow-style: none;}
	.org_tab .tab_item {width: auto; white-space: nowrap;}

	.organization .org_list {width: fit-content; gap: 40px 0; align-items: start; max-width: none;}
	.organization .org_list:after {height: calc(100% - 26px); left: 70px;}
	.organization .org_box {width: 140px; height: 54px;}
	
	.organization .org_depth1 .org_rank {width: 140px; height: 140px;}
	.organization .org_depth1 .org_rank strong {font-size: 18px;}
	.organization .org_depth1 .org_box.type1 {left: calc(50% + 120px);}
	.organization .org_depth1 .org_box.type1:before {width: 50px; left: -53px;}

	.organization .org_depth3 .org_box.type1 {left: calc(50% + 120px);}
	.organization .org_depth3 .org_box.type1:before {width: 50px; left: -53px;}

	.organization .org_depth4 {flex-direction: column; margin-top: 0; padding-left: 150px; gap: 10px 0;}
	.organization .org_depth4:before {content: none;}
	.organization .org_depth4 .org_box.type3:before {top: 50%; transform: translateY(-50%); left: -50%; width: 50%; height: 2px;}


	/* 협회 소개  - 오시는 길 */
	.location .map_info {padding: 24px 30px;}
	.location .map_list li {display: block;}
	.location .map_list li .tit {display: block; width: 100%;}
	.location .map_list li .tit:after {content: none;}
	.location .map_list li p {padding-left: 0; margin-top: 10px;}


	/* 사업공고 - 사업신청 폼 */
	.step .step_list {margin: 0; flex-direction: column; padding: 20px 20px;}
	.step .step_list li {float: none; width: 100%; text-align: left; padding: 0;}
	.step .step_list li:after {content: none;}
	.step .step_list li + li {margin-top: 10px;}
	.step .step_list li span {display: inline-block; margin: 0 10px 0 0;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar_top .month_label > h3 {font-size: 24px;}
	.schedule .cal_category {justify-content: start; flex-wrap: nowrap; overflow-y: hidden; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
	.schedule .cal_category .item {white-space: nowrap;}

	/* 타기관 공고 */
	.ext_link > ul{gap:10px;}
	.ext_link > ul > li{width:calc((100% - 40px)/5);}

	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 40px) / 3);}

	
	/* 지원기업 소개 */
	.partner .partnerList li {width: calc((100% - 25px) / 2);}
	.partner .partner_box {display: block;}
	.partner .partner_box .partner_img {margin: 0 auto;}
	.partner .partner_box .partner_txt {width: 100%; padding-left: 0; padding-top: 40px;}
}

@media (max-width: 640px) {
	/* sub navigation */
	/* .cont_navigation .navi_select.select1 {display: none;} */
	.cont_navigation .home {display: none;}
	.cont_navigation .navi_select {width: 50%;}
	.cont_navigation .navi_select .depth {width: 100%;}

	/* 타기관 공고 */
	.ext_dl_group{flex-direction: column;}
	.ext_dl_group dl{padding:8px 10px; width:100%;}

	.ext_stend{flex-direction: column;}
	.ext_stend > strong{width:100%; max-width: unset;}
	.ext_stend > ul{width:100%;}

	.ext_link > ul > li{width:calc((100% - 10px)/2); }
	.ext_link > ul > li > a{width:100%; display:flex; align-items: center; justify-content: space-between;}

}

@media (max-width: 576px) {

	/* navigation - page_path */
	.page_path {position: static; margin-top: 20px;}


	/* page intro title */
	h2.intro_tit > br {display: none;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .item {flex-direction: column;}
	.history .history_cont .item .history_year {width: 100%; padding-left: 0; margin-bottom: 10px;}
	.history .history_cont .item .history_year h3 {padding-left: 30px;}
	.history .history_cont .item .history_year h3:after {left: 0;}
	.history .history_list {width: 100%; padding-left: 30px;}
	.history .history_list:before, .history .history_list:after {top: -30px; left: 5px;}
	.history .history_list > li {display: block;}
	.history .history_list > li .month {display: block; width: 100%; margin-bottom: 10px;}
	.history .history_list > li > ul {width: 100%;}
	.history .history_list > li > ul > li + li {margin-top: 5px;}


	/* 협회 소개 - 오시는 길 */
	.location .map_info .address {font-size: 18px;}
	.location .map_list li {font-size: 1rem;}
	.location .map_list li p {word-break: keep-all;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar .date_bar {font-size: 12px; padding: 0 10px;}


	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 20px) / 2);}


	/* 지원기업 소개 */
	.partner .partnerList li {width: 100%;}
}

@media (max-width: 420px) {
	/* sub tit */
	.page_title h1 {font-size: 25px;}
	.page_title p {margin-top: 10px;}
	

	/* page intro title */
	h2.intro_tit {font-size: 20px; margin-bottom: 24px;}


	/* 협회 소개 - 인사말 */
	.greeting .txt_box p {font-size: 1rem;}

	/* 타기관 공고 */
	.ext_link > ul > li{width:100%; }


	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: 100%;}
	
}