/* 상단 로고 */
#header {width:100%; height:80px; background:#fff; display:flex; align-items: center; justify-content: center; padding:0 40px; box-shadow:0 2px 4px rgba(0,0,0,.02); position:relative; z-index:2;}
#header .header_inner {width:100%; max-width:1280px; display:flex; align-items: center; justify-content: space-between;}
#header h1 img {width:150px;}
#header .gnb {height:100%; position:absolute; left:50%; transform:translateX(-50%);}
#header .gnb > ul {display:flex; height:100%;}
#header .gnb > ul > li {font-size:1.2rem; height:100%; display: flex; align-items: center; position:relative;}
#header .gnb > ul > li.on {font-weight:800;}
#header .gnb > ul > li > a {display:inline-block; padding:20px 30px;}
#header .gnb > ul > li:hover > a {color:#235FAF;}
#header .gnb > ul > li .gnb_2 {padding-top:25px; position:absolute; left:10px; top:30px; visibility: hidden; opacity:0;}
#header .gnb > ul > li ul {display:flex; flex-direction: column; gap:20px; background:#fff; border-radius:4px; padding:26px 20px; box-shadow:0 2px 5px rgba(0,0,0,.15); border:1px solid #d9d9d9; width: max-content; min-width:140px;}
#header .gnb > ul > li ul > li {font-size:1rem; font-weight:300;}
#header .gnb > ul > li ul > li:hover {font-weight:800;}
#header .gnb > ul > li ul > li a {width:100%; display:block; text-align: left;}
#header .gnb > ul > li:hover .gnb_2 {top:65px; visibility:visible; opacity:1; transition:all ease .2s;}
#header select {width:150px;}

#m_header {display:none; position:fixed; align-items: center; justify-content: space-between; width:100%; top:0; left:0; height:50px; padding:0 10px; z-index:2; background:rgba(250,250,250,.8); backdrop-filter: blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:0 2px 4px rgba(0,0,0,.02);}
#m_header h1 {height:32px;}
#m_header h1 a {display:block; height:100%;}
#m_header h1 a img {display: block; height:100%;}
#m_header .btn_open_gnb {font-size:2rem;}

.logo {position:relative; display: flex; align-items: center;}
.logo a {overflow:hidden; display: flex; align-items: center;}
/* 모바일 */
#m_header .logo {position:absolute; left:50%; transform:translateX(-50%);}

.mobile_gnb_modal {display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.7); z-index:11; backdrop-filter: blur(4px);}
.m_gnb {display:none; width:280px; height:100%; position:fixed; top:0; left:-280px; z-index:12; background: #fff; padding:20px;}
.m_gnb > ul {display:block; padding:10px 0;}
.m_gnb > ul > li {display:block; height:unset;}
.m_gnb > ul > li > a {padding:10px 0; display:flex; justify-content: space-between; align-items: center; font-size: 1.2rem; font-weight: 600;
}
.m_gnb > ul > li .gnb_2 {display:none; padding-top:0; position:static; visibility:visible; opacity:1;}
.m_gnb > ul > li ul {display:block; height:unset; padding:0; box-shadow:none; border:none;}
.m_gnb > ul > li ul > li {width:100%;}
.m_gnb > ul > li ul > li a {display:block; padding:10px 0 10px 10px;}
.m_gnb > ul > li ul > li:last-child {margin-bottom:10px;}
.mobile_top_btn {padding:0;}
.m_gnb .mobile_menu_title {display:block; font-size:1.2rem; font-weight:800; padding-bottom:20px; border-bottom:1px solid #ccc;}
.m_gnb .btn_close_gnb {display:block; position:absolute; top:15px; right:20px; font-size:1.6rem; padding:0;}

#wrap {padding-top:0;}

@media screen and (max-width:1300px){
  #header {display:none;}
  #m_header {display:flex;}
  .m_gnb {display:block;}
  #wrap {padding-top:50px;}
}

/* 메인배너 */
#mainBn {display:none; height:500px; opacity:0;}
#mainBn .swiper-container {height:100%;}
#mainBn .swiper-slide a {display:block; width:100%; height:100%; overflow:hidden; position:relative;}
#mainBn .swiper-slide .bn_copy {position:absolute; width:100%; max-width:1280px; top:50%; left:50%; transform:translate(-50%, -50%); display:flex; flex-direction: column; gap:2rem; z-index:2;}
#mainBn .swiper-slide .bn_copy .bn_copy_1 {font-size:2rem; font-weight:800;}
#mainBn .swiper-slide .bn_copy .bn_copy_2 {font-size:1.4rem; white-space: pre-wrap; line-height:1.4;}
#mainBn .swiper-slide img {height:auto; position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%, -50%);}
#mainBn .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom {bottom: 20px !important;}
#mainBn .swiper-pagination-fraction {bottom: 10px !important;}
#mainBn .swiper-button-prev {width:100px !important; height:100px !important; background-color:rgba(0,0,0,.2); border-radius:0 50% 50% 0; left:0 !important; margin-top:0 !important; transform:translateY(-50%); background-image:none;}
#mainBn .swiper-button-next {width:100px !important; height:100px !important; background-color:rgba(0,0,0,.2); border-radius:50% 0 0 50%; right:0 !important; margin-top:0 !important; transform:translateY(-50%); background-image:none;}
#mainBn svg {width:100px; height:100px; position:absolute;}
#mainBn .swiper-button-prev svg {border-radius:0 50% 50% 0; right:0;}
#mainBn .swiper-button-next svg {border-radius:50% 0 0 50%; left:0;}
#mainBn .swiper-button-prev:hover,
#mainBn .swiper-button-next:hover {width:110px !important; transition:all ease .3s;}
#mainBn .swiper-pagination-bullet {background:rgba(0,0,0,0); width:14px !important; height:14px !important; border-radius:7px !important; transition:all ease .2s; border:1px solid rgba(0,0,0,.8); opacity:1 !important;}
#mainBn .swiper-pagination-bullet-active {background:#fff !important; transition:all ease .2s;}

/* 메인배너 - 모바일 */
#mainBn_m {display:none;}
#mainBn_m .swiper-container {height:100%;}
#mainBn_m .swiper-slide a {display:block; width:100%; height:100%; overflow:hidden; position:relative;}
#mainBn_m .swiper-slide .bn_copy {position:absolute; width:100%; max-width:1280px; top:50%; left:50%; transform:translate(-50%, -50%); display:flex; flex-direction: column; gap:2rem; z-index:2; padding:0 30px;}
#mainBn_m .swiper-slide .bn_copy .bn_copy_1 {font-size:2rem; font-weight:800;}
#mainBn_m .swiper-slide .bn_copy .bn_copy_2 {font-size:1.4rem; white-space: pre-wrap; line-height:1.4;}
#mainBn_m .swiper-slide img {width:100%;}
#mainBn_m .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom {bottom: 20px !important;}
#mainBn_m .swiper-pagination-fraction {bottom: 10px !important;}
#mainBn_m .swiper-pagination-bullet {background:rgba(0,0,0,.2); width:14px !important; height:14px !important; border-radius:7px !important; transition:all ease .2s; border:1px solid rgba(0,0,0,.8); opacity:1 !important;}
#mainBn_m .swiper-pagination-bullet-active {background:rgba(255,255,255,.8) !important; transition:all ease .2s;}

@media screen and (max-width:1300px){
  #mainBn .swiper-slide .bn_copy {padding:0 50px;}
}

@media screen and (max-width:768px){
  #mainBn_m .swiper-slide .bn_copy .bn_copy_1 {font-size:1.6rem; font-weight:700;}
  #mainBn_m .swiper-slide .bn_copy .bn_copy_2 {font-size:1.2rem;}
}

@media screen and (max-width:520px){
  #mainBn_m .swiper-slide .bn_copy {padding:0 20px;}
}

@media screen and (max-width:380px){
  #mainBn_m .swiper-slide .bn_copy {padding:0 10px;}
}

@media screen and (max-width:320px){
  #mainBn_m .swiper-slide .bn_copy .bn_copy_1 {font-size:1.4rem;}
  #mainBn_m .swiper-slide .bn_copy .bn_copy_2 {font-size:1.2rem;}
}

/* 스와이프 배너 공통 */
.swiper-pagination {width:unset !important; left:50% !important; transform:translateX(-50%) !important;}

/* 동영상인 경우 */
.mainBn .movie_screen {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .05); z-index: 1;}
.mainBn video {position:relative; min-width:100%; top:50%; left:50%; transform:translate(-50%, -50%);}

/* 유튜브인 경우 */
.mainBn .swiper-slide iframe {width:100%; height:100%;}

/* 메인화면 중간영역 */
#mid_area {width:100%; display:flex; justify-content: center; overflow:hidden;}
#mid_area .blank_area {width:calc((100% - 1280px) / 2);}
#mid_area .blank_area.green {background:#90c31f; border-bottom:1px solid #7bad09;}
#mid_area .blank_area.gray {background:#f5f5f5; border-bottom:1px solid #e1e1e1;}
#mid_area .mid_area_inner {width:1280px; display:flex;}

/* 더보기 버튼 */
#mid_area .view_more {position:absolute; top:20px; right:20px; font-size:2.6rem; transition:all ease .2s; color:rgba(255,255,255,.5);}
#mid_area .view_more:hover {transform:rotate(90deg); transition:all ease .2s;}

/* 메인화면 중간영역 - 게시판 */
#mid_area .board_outer {width:calc(100% * 2 / 3); background:#90c31f; border-bottom:1px solid #7bad09;}
#mid_area .board {display:flex; height:230px;}
#mid_area .board .board_block {width:calc(100% / 2); position:relative; padding:30px;}
#mid_area .board .board_block.notice {border-right:1px solid #7bad09; padding-left:0;}
#mid_area .board .board_block.news {border-left:1px solid #a1d135; border-right:1px solid #7bad09;}
#mid_area .board .board_block .board_title {font-size:1.6rem; font-weight:600; color:#fff; height:30px; margin-bottom:10px;}
#mid_area .board ul {height:calc(100% - 44px);}
#mid_area .board ul li {font-size: 1.1rem;}
#mid_area .board ul li a {display:block; color:#fff; padding:5px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-break: break-all;}
#mid_area .board ul li a:hover {opacity:.7;}

@media screen and (max-width:1280px){
  #mid_area .mid_area_inner {width:100%;}
  #mid_area .view_more {font-size:2.3rem;}
  #mid_area .blank_area {display:none;}
  #mid_area .board .board_block.news {border-right:none;}
}

@media screen and (max-width:1024px){
  #mid_area .mid_area_inner {flex-direction: column;}
  #mid_area .board_outer {width:100%;}
  #mid_area .board {height:unset;}
  #mid_area .board .board_block {padding:20px;}
  #mid_area .board .board_block.notice {padding-left:20px;}
  #mid_area .board .board_block.news {padding-right:20px;}
  #mid_area .membership {width:100%;}
  #mid_area .view_more {top:15px; right:15px; font-size:2rem;}
}

@media screen and (max-width:980px){
  #mid_area .board {gap:0; border-radius:0 0 10px 10px; border-top:none;}
  #mid_area .board .split_line {display:none;}
  #mid_area  .board_block.articles {display:none;}
}

@media screen and (max-width:420px){
  #mid_area .board_outer {background:#fff; border-bottom:1px solid #e1e1e1;}
  #mid_area .board {flex-direction: column;}
  #mid_area .board .board_block {width:100%; margin-top:0;}
  #mid_area .board .board_block.notice {border-bottom:1px solid #e1e1e1; border-right:none;}
  #mid_area .board .board_block.news {border-left:none;}
  #mid_area .board .board_block .board_title {color:#333;}
  #mid_area .board ul li a {color:#333;}
  #mid_area .view_more {color:#90c31f;}
}

/* 메인화면 중간영역 - 메인화면 회원사 슬라이드 */
#membership_slide {width:calc(100% / 3); background:#f5f5f5; border-bottom:1px solid #e1e1e1; height:231px; position:relative;}
#membership_slide .slide_title {font-size:1.3rem; font-weight:300; height:90px; padding:30px 30px 0; color:#333; line-height:1.3;}
#membership_slide .slide_title span {font-weight:500;}
#membership_slide .swiper-container {height:calc(100% - 90px);}
#membership_slide .swiper-slide {opacity:0; background:#f5f5f5;}
#membership_slide .swiper-slide a {width:100%; height:100%; display:flex; flex-direction: column; align-items: center; justify-content: center; gap:10px;}
#membership_slide .swiper-slide a .logo_area {width:100%; display:flex; justify-content: center;}
#membership_slide .swiper-slide a .logo_area img {mix-blend-mode: multiply;}
#membership_slide .swiper-slide a p.only_name {font-size:1.6rem; font-weight:700;}
#membership_slide .swiper-slide a p.with_logo {font-size:1.1rem;}
#membership_slide .view_more {color:rgba(0,0,0,.2);}
#membership_slide .swiper-pagination.swiper-pagination-fraction {bottom:10px; right:10px; background:rgba(0,0,0,.4); color:#fff; padding:0 10px; height:26px; border-radius:13px; display:flex; justify-content: center; align-items: center; left: unset !important; opacity: 1; border: 1px solid #fff; transform:unset !important;}
/* 슬라이드 네비 */
#membership_slide .swiper-button-prev {width:50px !important; height:60px !important; /*background-color:rgba(0,0,0,.1);*/ border-radius:4px; left:5px !important; margin-top:0 !important; transform:translateY(-50%); background-image:none; opacity:.3}
#membership_slide .swiper-button-next {width:50px !important; height:60px !important; /*background-color:rgba(0,0,0,.1);*/ border-radius:4px; right:5px !important; margin-top:0 !important; transform:translateY(-50%); background-image:none; opacity:.3}
#membership_slide svg {width:50px; height:60px; position:absolute;}
#membership_slide .swiper-button-prev svg {right:0;}
#membership_slide .swiper-button-next svg {left:0;}
#membership_slide .swiper-button-prev:hover,
#membership_slide .swiper-button-next:hover {opacity:.5}

@media screen and (max-width:1024px){
  #membership_slide .slide_title {padding:20px 20px 0;}
}

@media screen and (max-width:420px){
  #membership_slide .swiper-slide .logo_area img {width:50%;}
}

/* 메인화면 협력사 슬라이드 */
#linked_site_slide {width:100%; max-width:100%; height:100px; margin:60px auto 0;}
#linked_site_slide .swiper-container {width:100%; max-width:1280px; height:100%;}
#linked_site_slide .swiper-wrapper {width:100%;}
#linked_site_slide .swiper-slide {/*width:calc((100% - 100px) / 5);*/ height:100%; display:flex; align-items: center; justify-content: center; opacity:0;}
#linked_site_slide .swiper-slide a {display:flex; align-items: center; justify-content: center;}
#linked_site_slide .swiper-slide img {mix-blend-mode: multiply;}
#linked_site_slide .swiper-button-prev {width:50px !important; height:60px !important; /*background-color:rgba(0,0,0,.1);*/ border-radius:4px; left:5px !important; margin-top:0 !important; transform:translateY(-50%); background-image:none; opacity:.3; display:none;}
#linked_site_slide .swiper-button-next {width:50px !important; height:60px !important; /*background-color:rgba(0,0,0,.1);*/ border-radius:4px; right:5px !important; margin-top:0 !important; transform:translateY(-50%); background-image:none; opacity:.3; display:none;}
#linked_site_slide svg {width:50px; height:60px; position:absolute;}
#linked_site_slide .swiper-button-prev svg {right:0;}
#linked_site_slide .swiper-button-next svg {left:0;}
#linked_site_slide .swiper-button-prev:hover,
#linked_site_slide .swiper-button-next:hover {opacity:.5}

@media screen and (max-width:768px){
  #linked_site_slide {margin:30px auto 0;}
}

@media screen and (max-width:340px){
  #linked_site_slide .swiper-slide img {width:80%;}
  #membership_slide .slide_title {padding:20px 55px 0 20px;}
  #membership_slide .slide_title br {display:none;}
}

/* 메인화면 하단 회원사 영역 */
/* #membership_list {width:1280px; margin:60px auto 0;}
#membership_list ul {display:flex; gap:20px; justify-content: center; align-items: center;}
#membership_list ul li {display:flex; gap:10px; flex-direction: column; align-items: center;}
#membership_list ul li .logo_img {width:100px;} */

/* 하단 배너 영역 */
#bottom_banner_area {width:100%; max-width:1280px; margin:60px auto 0;}
#bottom_banner_area img {border-radius:4px; width:100%;}
#bottom_banner_area .bbn {display:block;}
#bottom_banner_area .bbn_m {display:none;}

@media screen and (max-width:768px){
  #bottom_banner_area {margin:30px auto 0;}
}

@media screen and (max-width:580px){
  #bottom_banner_area .bbn {display:none;}
  #bottom_banner_area .bbn_m {display:block;}
}

/* 푸터 */
#footer {margin-top:80px; border-top:1px solid #e0e0e0; padding:30px 40px; display:flex; align-items: center; justify-content: center; opacity:0; width:100%;}
#footer .footer_inner {width:100%; max-width:1280px; display: flex; flex-direction: row; align-items: center; gap: 40px;}
#footer #bottom_logo {display:block; width:120px;}
#footer #bottom_logo img {width:100%;}
#footer .information {display:flex; flex-direction: column; gap:7px;}
#footer .information > div {display:flex; gap:0 40px; flex-wrap: wrap;}
#footer .information > div p {line-height:1.4;}
#footer .copyright {font-size:.9rem; color:#999; font-weight:400;}
#footer .copyright span {font-size:1.2rem;}
#footer .links {display:flex; gap:50px;}
#footer .links .relative_site {display:flex; gap:30px; align-items: center;}
#footer .links .relative_site a img.participation {width:130px;}
#footer .links .relative_site a img.usta {width:100px;}
#footer .links .sns {display:flex; gap:10px; align-items: center;}
#footer .links .sns a img {width:26px; border-radius:5px;}
#footer .links .sns a img.youtube {width:30px;}

@media screen and (max-width:760px){
  #footer {padding:30px;}
  #footer .footer_inner {flex-direction: column; gap: 20px; align-items: flex-start;}
  #footer .links {padding:40px 0; background:#F0F2F6; width:100%; display:block;}
  #footer .links .relative_site {justify-content: center;}
  #footer .links .sns {margin-top:20px; justify-content: center; gap:20px;}
  #footer .links img {mix-blend-mode: multiply;}
  #footer .links .sns a img {width:50px; border-radius:10px;}
  #footer .links .sns a img.youtube {width:60px;}
}

@media screen and (max-width:320px){
  #footer .links .relative_site {gap:10px;}
  #footer .links .sns a img {width:40px; border-radius:8px;}
  #footer .links .sns a img.youtube {width:50px;}
}

/* 페이지 타이틀 */
#page_header {position:relative; width:100%; height:200px; display:flex; justify-content: center; align-items: center; overflow:hidden;}
#page_header img {position:absolute; z-index:0; height:100%;}
#page_header p {position:relative; z-index:1; font-size:2.2rem; font-weight:700;}

/* 서브메뉴 */
#sub_menu {display:flex; justify-content: center; align-items: center; /*border-top:1px solid #e0e0e0;*/ border-bottom:1px solid #e0e0e0; background:#f6f6f6;}
#sub_menu ul {display:flex; height:55px; width:100%; max-width:1280px;}
#sub_menu ul li {height:100%; opacity:0;}
#sub_menu ul li a {display:flex; width:100%; height:calc(100% + 1px); justify-content: center; align-items: center; font-size:1.1rem;}
#sub_menu ul li a.on {background:#2a4f85; color:#fff; font-weight:600;}
#sub_menu_slide {margin-top:20px; height:50px;}
#sub_menu_slide .swiper-container {height:100%; margin:0 auto;}
#sub_menu_slide .swiper-wrapper {justify-content: center; gap:10px;}
#sub_menu_slide .swiper-slide {width:unset !important; height:100%;}
#sub_menu_slide .swiper-slide a {display:flex; align-items: center; height:100%; padding:0 16px; border-radius:25px; background:#f6f6f6;}
#sub_menu_slide .swiper-slide a.on {background:#2a4f85; color:#fff; font-weight:600;}

/* 서브페이지 시작 */
#sub_layout {width:1280px; margin:40px auto; position:relative;}
#sub_layout .page_title {border-bottom:2px solid #90c31f; display:flex; align-items: flex-end; justify-content: space-between; padding-bottom: 10px;}
#sub_layout .title_area {display:flex; gap:6px; flex-direction: column;}
#sub_layout .title {font-size:1.8rem; font-weight:700; line-height:1.4;}
#sub_layout .description {font-size:1.1rem; line-height:1.4; color:#7f7f7f;}
#sub_layout .path {font-size:0.9rem; margin-bottom:5px;}
#sub_layout .path a:last-child {font-weight:600;}
#sub_layout .path i {margin:0 .3rem; color:#999;}
#sub_layout .path i.fa-house {margin:0;}
#sub_layout .content {width:100%; position:relative; padding:60px 0; font-size:1.2rem; line-height:1.5;}
#sub_layout .content img {max-width:100%; border-radius:4px;}

@media screen and (max-width:1300px){
  #sub_layout {display:block; padding:0 10px; width:100%;}
}

@media screen and (max-width:860px){
  #page_header {height:120px;}
  #page_header p {font-size:1.8rem; font-weight:600;}
  #sub_layout .page_title {flex-direction:column; align-items: unset; justify-content: unset;}
  #sub_layout .path {margin-top:20px; text-align:right;}
}

@media screen and (max-width:380px){
  #sub_layout .content {padding:30px 0;}
}


/* 리스트 레이아웃 */
.list_layout ul.list_head {border-bottom:1px solid #999;}
.list_layout ul.list_head li {display:flex; align-items:center;}
.list_layout ul.list_head li div {text-align:center;}
.list_layout ul.list_body li {border-bottom:1px solid #ccc; display:flex; align-items:center; width:100%;}
.list_layout ul.list_body li > a {display:flex; align-items:center; width:100%;}
.list_layout ul.list_body li > a:hover {background:#eff7ff;}
/* .list_layout ul li {height:50px;} */
.list_layout ul li div {display:flex; justify-content: center; align-items: center; padding:20px 10px;}
.list_layout ul li div .top_notice_icon {font-weight:800; color:#235FAF;}

.search_wrap {margin-top:40px; display: flex; align-items: center; flex-wrap: wrap; gap: 5px; justify-content: center; width:100%;}
.search_wrap select {width:100px;}
.search_wrap input[type='text'] {width:calc(100% - 190px); max-width:400px;}
.search_wrap .btn_search {width:80px;}