/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.6.1772607266
Updated: 2026-03-04 06:54:26

*/

/* main-visual-con */
.visual-wrap {padding: 3rem 0; display: flex; align-items: center; justify-content: space-between;}
.visual-wrap .vis-left-con {position: relative; width: calc(100% - 44rem);}
.vis-top-wrap {padding: 0 6rem; display: flex; justify-content: space-between; align-items: end; position: absolute; width: 100%; bottom: 6rem; z-index: 10;}
.vis-top-wrap .vis-top-left .title {padding-bottom: 3rem; font-size: 4.8rem; color: #fff; font-weight: 700; letter-spacing: -0.24rem;}
.vis-top-wrap .vis-top-left .detail {color: #fff; font-size: 2.8rem; font-weight: 400; letter-spacing: -0.16rem;}
.vis-top-wrap .vis-top-right .vis-arrow-wrap {display: flex; align-items: center; gap: 1.5rem;}
.vis-top-wrap .vis-top-right .vis-arrow-wrap .vis-arrow {cursor: pointer; transition: all 0.3s ease;}
.vis-top-wrap .vis-top-right .vis-arrow-wrap .vis-arrow:hover {opacity: 0.6;}
.vis-top-wrap .vis-top-right .vis-arrow-wrap .paging-wrap {font-size: 1.6rem; color: #fff; font-weight: 500;}
.vis-top-wrap .vis-top-right .vis-arrow-wrap .paging-wrap span {padding: 0 0.5rem;}
.vis-slide-wrap {border-radius: 2rem; overflow: hidden;}
.bg-font {padding-bottom: 1.5rem; line-height: 0.7; text-transform: uppercase; text-align: center; font-size: 12rem; font-family: 'Poppins', sans-serif; font-weight: bold; color: #e7e8f0;}
/* 팝업 */
.vis-right-con {width: 40rem; height: 46rem; background-color: #ccc; border-radius: 2rem;}

/* main-notice-con */
.title-wrap {display: flex; justify-content: space-between; align-items: center; margin-bottom: 5rem;}
.title-wrap .main-btn a {padding: 2rem 2rem 2rem 3rem; display: flex; gap: 1.5rem; font-size: 1.8rem; color: #203995; font-weight: 600; border: 1px solid #203995; border-radius: 3rem; transition: all 0.3s ease;}
.title-wrap .main-btn a:hover {background-color: #203995; color: #fff;}
.notice-wrap {display: flex;justify-content: space-between; gap: 6rem; margin-bottom: 10rem;}
.noti-left {width: 65%;}
.noti-right {width: 35%;}
.noti-right .quick-wrap {padding: 3rem 4rem; display: flex; flex-flow: row wrap; gap: 2rem; justify-content: center; background-color: #f9f9f9; border-radius: 2rem; border: 1px solid #ebebeb;}
.noti-right .quick-wrap .btn {width: calc(50% - 1rem);}
.noti-right .quick-wrap .btn a {padding: 4rem 0; display: flex; flex-direction: column; align-items: center; gap: 2rem; border: 1px solid #ebebeb; border-radius: 2rem; background-color: #fff; transition: all 0.3s ease;}
.noti-right .quick-wrap .btn a .icon {width: 6rem; height: 6rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: var(--sub-color); transition: all 0.3s ease;}
.noti-right .quick-wrap .btn a .icon img {filter: brightness(0) invert(1); transition: all 0.3s ease;}
.noti-right .quick-wrap .btn a .btn-name {font-size: 2rem; color: #282828; font-weight: 500; letter-spacing: -0.1rem;}
.noti-right .quick-wrap .btn a:hover {background-color: var(--main-color);}
.noti-right .quick-wrap .btn a:hover .icon {background-color: #fff;}
.noti-right .quick-wrap .btn a:hover .icon img {filter: none;}
.noti-right .quick-wrap .btn a:hover .btn-name {color: #fff;}

/* main-quick-con */
.main-quick-con {background-color: #f9f9f9;}
.main-quick-con .quick-wrap {padding: 10rem 0; display: flex; justify-content: space-between; gap: 2rem;}
.main-quick-con .quick-wrap .btn {width: 33.3%; border-radius: 2rem; overflow: hidden; background: no-repeat center / cover;}
.main-quick-con .quick-wrap .btn a {position: relative; padding: 11rem 0; display: flex; gap: 2rem; flex-direction: column; align-items: center; justify-content: center;}
.main-quick-con .quick-wrap .btn a::before {content: ""; position: absolute; width: 100%; height: 100%; border: 0px solid var(--main-color); border-radius: 2rem; transition: all 0.3s ease;}
.main-quick-con .quick-wrap .btn a:hover::before {border: 10px solid var(--main-color);}
.main-quick-con .quick-wrap .btn a .title {font-size: 4.5rem; font-weight: 600; color: #fff;}
.main-quick-con .quick-wrap .btn a .detail {font-size: 2rem; font-weight: 400; color: #fff; letter-spacing: -0.1rem;}

/* main-gallery-con */
.main-gallery-con {position: relative; overflow: hidden;}
.gallery-con {padding: 10rem 0; background-color: #ecf3f9;}
.gal-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.gal-bg .left {position: absolute; top: -17%; left: -3%;}
.gal-bg .right {position: absolute; top: 17%; right: -16%;}

/* **********************
sub
*************************/

/* 오시는길 */
.map-con .root_daum_roughmap
{width: 100%; border-radius: 2rem 2rem 10rem 2rem;}
.map-con .root_daum_roughmap .cont,.map-con .root_daum_roughmap .map_border
{display: none;}

.location-con 
{display: flex; margin: 8rem 0;}
.location-con .tit 
{width: 50%; display: flex; flex-direction: column; font-size: 4rem; font-weight: 700; font-family: "pretandard"; line-height: 1.4; letter-spacing: -0.14rem;}
.location-con .tit-detail 
{padding-bottom: 1rem; font-size: 2rem; color: var(--main-color); font-family: "pretandard";}
.location-con .info-box 
{width: 50%;}
.location-con .info-box dl 
{padding: 3rem; display: flex; align-items: center; border-bottom: 1px solid rgba(0,0,0,0.1);}
.location-con .info-box dl:first-child 
{border-top: 3px solid #000000;}
.location-con .info-box dl dt 
{width: 28%; font-size: 2.4rem; font-weight: 700; font-family: "pretandard";}
.location-con .info-box dl dt i
{font-size: 2.4rem; color: var(--main-color); padding-right: 1.2rem;}
.location-con .info-box dl dd 
{font-size: 1.8rem; font-weight: 500; color: #666666;}

/* 임원현황 */
.organ-con .tab-wrap
{margin: 10rem 0; display: flex; justify-content: center; gap: 1rem;}
.organ-con .tab-wrap li
{padding: 2rem; width: 15%; font-size: 1.8rem; color: #203995; text-align: center; font-weight: 600; border: 1px solid #203995; border-radius: 3rem; transition: all 0.3s ease; cursor: pointer;}
.organ-con .tab-wrap li.active
{color: #fff; background-color: #203995;}

.org-sec
{margin-bottom: 6rem;}
.org-sec .title-wrap
{margin-bottom: 3rem; padding-bottom: 2rem; border-bottom: 1px solid #ededed;}
.org-sec .title-wrap .title
{position: relative; font-size: 3.2rem; font-weight: 800; color: #000;}
.org-sec .title-wrap .title::before
{content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: -2rem; width: 1rem; height: 1rem; border-radius: 50%; background-color: var(--sub-color);}

.org-list-con .list-wrap 
{display: flex; flex-flow: row wrap; gap: 3rem 2rem;}
.org-list-con .list-wrap .list 
{display: flex; gap: 3rem; width: calc((100% - 2rem) / 2); padding: 3rem; box-shadow: 0 0 5px #c4cbcf; border-radius: 1rem; background-color: #fff; overflow: hidden;}
.org-list-con .list-wrap .list .img 
{display: flex; align-items: center;}
.org-list-con .list-wrap .list .img img
{object-fit: cover; height: 18rem;}

.org-list-con .list-wrap .list .txt 
{padding-top: 1.5rem; width: calc(100% - 18.5rem);}
.org-list-con .list-wrap .list .txt .name
{position: relative; padding-bottom: 1rem; margin-bottom: 1.2rem; font-size: 2.1rem; font-weight: 700; border-bottom: 1px solid #e9e9e9;}
/* .org-list-con .list-wrap .list .txt .name .position
{padding-left: 0.2rem; font-size: 1.8rem; color: var(--sub-color);} */

.org-list-con .list-wrap .list .txt .detail-wrap 
{display: flex; flex-direction: column; gap: 0.8rem;}
.org-list-con .list-wrap .list .txt .detail-wrap .detail-name 
{padding: 0.5rem; min-width: 8rem; text-align: center; background-color: #ffded0; border-radius: 0.3rem;}
.org-list-con .list-wrap .list .txt .detail-wrap .detail-value 
{display: flex; align-items: flex-start; gap: 0.8rem; font-size: 1.6rem; color: #5a5a5a; font-weight: 500; line-height: 1.4; letter-spacing: -0.04rem;}

/* 연혁 */
.sub-title02 
{position: relative; margin-bottom: 3rem; padding-left: 2rem; font-size: 3.2rem; font-weight: 800; color: #222; }  
.sub-title02::before 
{content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 6px; height: 3rem; background: var(--main-color); border-radius: 5rem; } 
.sec-con 
{display: flex; flex-direction: column; gap: 8rem;}

.purpose-box 
{padding: 5rem; background: #f8fafb; border: 1px solid #e4e8ec; border-radius: 2rem;}  
.purpose-box p 
{font-size: 2rem; line-height: 1.6; color: #555; font-weight: 500; letter-spacing: -0.04rem;}

.history-list 
{position: relative; margin-left: 3rem;}  
.history-list::before 
{content: ""; position: absolute; left: 11rem; top: 0; width: 2px; height: 100%; background: #e5e5e5;}  
.history-list li 
{position: relative; display: flex; align-items: center; gap: 6rem; padding-bottom: 4rem; margin-top: 5rem;}  
.history-list li:last-child 
{padding-bottom: 0;}  
.history-list li::before 
{content: ""; position: absolute; left: 10.4rem; top: .8rem; width: 14px; height: 14px; background: var(--main-color); border-radius: 50%; z-index: 2;}  
.history-list .date 
{width: 8rem; font-size: 2rem; font-weight: 800; color: var(--main-color);}  
.history-list p 
{flex: 1; font-size: 1.9rem; color: #555; line-height: 1.6; font-weight: 500;}  

/* 주요사업 */
.business-con 
{display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem;}  
.business-item 
{display: flex; align-items: center; gap: 2.5rem; padding: 3rem; background:#fff; border: 1px solid #ddd; border-radius: 1.5rem; }  
.business-item .num 
{display: flex; align-items: center; justify-content: center; width: 7rem; height: 7rem; min-width: 7rem; border-radius: 50%; background: var(--main-color); color: #fff; font-size: 2.1rem; font-weight: 700; }  
.business-item h3 
{font-size: 2.4rem; font-weight: 700; color: #222; line-height: 1.5; }  

/* 관련단체 홈페이지 */
.link-con
{display: flex; flex-flow: row wrap; gap: 3rem; justify-content: center;}  
.link-con *
{transition: all .35s ease;}
.link-item 
{width: 48%; display: flex; flex-direction: column; justify-content: space-between; padding: 3.5rem; border: 1px solid #ddd; border-radius: 2rem; background: #fff; }  
.link-item .logo 
{display: flex; align-items: center; justify-content: center; height: 6rem;} 
.link-item .logo img 
{max-width: 100%; max-height: 100%; object-fit: contain; }
.link-item span 
{margin-top: 3rem; padding-top: 2rem; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #eee; font-size: 1.7rem; font-weight: 600; color: #333; }
.link-item span i 
{font-size: 2rem; color: var(--main-color); } 

.link-item:hover 
{transform: translateY(-8px); border-color: var(--main-color); box-shadow: 0 20px 40px rgba(0, 0, 0, .08);}  
.link-item:hover .logo img 
{transform: scale(1.04);}  
.link-item:hover span 
{color: var(--main-color);}  
.link-item:hover span i 
{transform: translateX(6px);} 