@charset "utf-8";
.no-copyright::before { content: '저작권 미보유'; position: absolute; bottom: 20px; right: 20px; font-size: 20px; color: #fff; opacity: 0.5; }
.green-point { color: #197f68; }

.floating {position: fixed; right: 20px; bottom: 100px; z-index: 16; transform: scale(0.8);}
.right_icon {margin-top: 10px; text-align: center; display: flex; justify-content: center;}
.right_icon a {position: relative; color: #fff; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; border-radius: 40%; box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.1);}
.right_icon a > i {font-size: 30px; color:#fff;}
.right_icon a > span {font-size: 22px; font-weight:500; line-height:26px; color: #fff; display: none;}
.right_icon a:hover i, .right_icon a:hover img {display: none;}
.right_icon a:hover span {display: block;}
.right_icon a > img {width: 45px;}
.pc-tel a:hover {width: 220px !important; border-radius: 100px !important;}

.pc-none {display: none;}
.tablet-none {display: none;}
/* main */
.down-scroll { position: absolute; transform: translateX(-50%); left: 50%; bottom: 70px; z-index: 2; animation: balloon 2.5s ease-in-out infinite; }
@keyframes balloon {
  0%, 100% {
    transform: translate(-50%, 0);
  }
  50% {
    transform: translate(-50%, 20px);
  }
 }
.visual-area { position: relative; width: 100%; }
.main-visual { background-repeat: no-repeat; background-size: cover; background-position: 100% 100%; height: 810px; }
.main-visual::before { content: ''; background: linear-gradient(to top, rgb(0 0 0 / 0%) 0%, rgb(0 0 0 / 40%) 100% 100%); height: 100%; width: 100%; display: block; }
.main-visual01 { background-image: url('../../images/main-visual01.png'); }
.main-visual02 { background-image: url('../../images/main-visual02.png'); }
.main-visual03 { background-image: url('../../images/main-visual03.png'); }
.main-visual04 { background-image: url('../../images/main-visual04.png'); }
.main-title { text-align: center; position: absolute; transform: translateX(-50%); top: 270px; left: 50%; width: 100%; }
.main-title h2 { font-size:66px; font-weight: 800; color:#fafaf8; margin-bottom: 30px; }
.main-title h2 > br {display: none;}
.main-title p { font-size:26px; line-height:38px; color:#fafaf8; }

.main-pagination { position: absolute; width: 315px; transform: translateX(-50%); top: 520px; left: 50%; height: 45px; z-index: 3; }
.main-pagination .swiper-button-prev span, .main-pagination .swiper-button-next span, .main-pagination .swiper-pagination, .main-pagination .swiper-pagination-current, .main-pagination .swiper-pagination-total { font-size:18px; color:#fafaf8 !important; font-weight: 400; }
.main-pagination .swiper-button-prev::after { content: initial; }
.main-pagination .swiper-button-next::after { content: initial; }
.main-pagination .swiper-button-prev, .main-pagination .swiper-button-next { display: flex; gap: 20px; align-items: center; }
.main-pagination .swiper-pagination-current, .main-pagination .swiper-pagination-total { font-weight: 700; }
.main-pagination .swiper-pagination { position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; margin-top: initial; bottom: initial; width: initial; }
.main-pagination .swiper-button-prev { display: flex; gap: 20px; align-items: center; right: initial; top: 0; left: 0; width: initial; height: initial; margin-top: initial; }
.main-pagination .swiper-button-next { display: flex; gap: 20px; align-items: center; left: initial; top: 0; right: 0; width: initial; height: initial; margin-top: initial; }

.main-contents-area { position: relative; width: 100%; overflow: hidden; }
.contents-body { position: relative; width: 1400px; margin: 0 auto; }
.main-banner-wrap { display: flex; gap: 30px; margin:100px 0 100px; }
.main-banner-wrap a { width: 100%; display: block; }
.banner-box { width: 100%; border-radius: 15px; padding:45px; }
.banner-box p { font-size: 22px; font-weight: 500; }
.banner-box h2 { font-size: 30px; font-weight: 700; }
.banner-box.pink { background: #fff1f6; background-image: url('../../images/heart-finger.png'); background-repeat: no-repeat; background-position: 93% 12px; }
.banner-box.green { background: #f4f9e6; background-image: url('../../images/leaf-hand.png'); background-repeat: no-repeat; background-position: 91% 18px; }
.main-business-wrap { margin-bottom: 100px; }
.content-title, .content-title span { font-size: 30px; font-weight: 700; }
.business-list { display: flex; justify-content: space-between; margin-top: 60px; }
.business-list .box { text-align: center; }
.business-list .box a { display: block; }
.business-list .box a > img { margin-bottom:20px; }
.main-news-warp { display: flex; gap: 60px; position: relative; margin-bottom: 100px; }
.btn-custom .nav-link.active { background-color: #197f68 !important; border: 0 !important; }
.main-notice-lay { width: calc(100% - 592px); position: relative; }
.tabs-warp { display: flex; justify-content: space-between; margin-top: 30px; margin-bottom: 24px; }
.btn-custom button { width: 130px !important; height: 50px !important; align-items: center; justify-content: center; display: flex; font-size: 20px !important; font-weight: 600; border: 1px solid #c1c5cf !important; }
.more-view-btn a { width: 50px; height: 50px; display: block; border-radius: 6px; border: 1px solid #c1c5cf; background: #fafaf8; position: relative; }
.more-view-btn a::before { content: ''; display: block; width: 19px; height: 3px; background: #197f68; position: absolute; transform: translate(-50%, -50%);  top: 50%; left: 50%; }
.more-view-btn a::after { content: ''; display: block; width: 3px; height: 19px; background: #197f68; position: absolute; transform: translate(-50%, -50%);  top: 50%; left: 50%; }
.list-wrap {}
.list-content { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #dddddd; margin-top: 15px; padding-bottom: 15px; }
.list-wrap .list-content:last-child { border-bottom: 0; padding-bottom: 0; }
.list-content .subject { width: 580px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #1a1a1a; }
.list-content .subject a { color: #1a1a1a; }
.list-content .date, .etc-info .date, .etc-info .detail { font-size: 15px; color: #3e3e3e; }
.no-data-list { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; display: flex; justify-content: center; align-items: center; padding: 10px 0; }
.main-alert-lay { width: 592px; position: relative; }
.banner-img-wrap { margin-top: 30px; overflow: hidden; }
.banner-lay { width: 592px; height: 346px; border-radius: 15px; overflow: hidden; }
.banner-lay a { width: 100%; height: 100%; }
.banner-lay img { width: 100%; height: 100%; object-fit: cover; }
.flower-bg::before { content: ''; background-image: url('../../images/flower-bg.png'); background-repeat: no-repeat; height: 482px; width: 487px; position: absolute; bottom: 40px; right: -290px;}

.banner-pagination { position: absolute; top: 0; right: 0; z-index: 3; display: flex; align-items: center; gap: 10px; }
.banner-pagination .banner-pagination .banner-pagination .swiper-pagination, .banner-pagination .swiper-pagination-current, .banner-pagination .swiper-pagination-total { font-size:18px; color:#1a1a1a !important; font-weight: 400; }
.banner-pagination .swiper-pagination-current, .banner-pagination .swiper-pagination-total { font-weight: 700; }
.banner-pagination .swiper-button-prev::after { content: initial; }
.banner-pagination .swiper-button-next::after { content: initial; }
.banner-pagination .swiper-button-prev, .banner-pagination .swiper-button-next { position: relative; width: 34px; height: 34px;  border: 1px solid #c1c5cf; border-radius: 6px; }
.banner-pagination .swiper-pagination { position: relative; top: 0; left: 0; margin-top: initial; bottom: initial; width: initial; }
.banner-pagination .swiper-button-prev { display: flex; align-items: center; justify-content: center; right: initial; top: 0; left: 0; margin-top: initial; }
.banner-pagination .swiper-button-next { display: flex; align-items: center; justify-content: center; left: initial; top: 0; right: 0; margin-top: initial; }
.banner-buttons .prev-btn { background-image: url('../../images/banner-prev.png'); background-repeat: no-repeat; background-position: 50% 50%; background-color: #fafaf8; }
.banner-buttons .next-btn { background-image: url('../../images/banner-next.png'); background-repeat: no-repeat; background-position: 50% 50%; background-color: #fafaf8; }
.banner-buttons { display: flex; gap: 3px; }

.galley-body { background: #f6f8f9; overflow: hidden; position: relative; }
.galley-body::after { content:''; width: 12%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 2; background: linear-gradient(to left, rgba(246, 248, 249, 0) 0%, rgba(246, 248, 249, 1) 80%); }
.galley-body::before { content:''; width: 12%; height: 100%; display: block; position: absolute; top: 0; right: 0; z-index: 2; background: linear-gradient(to right, rgba(246, 248, 249, 0) 0%, rgba(246, 248, 249, 1)80%); }
.galley-wrap { padding: 100px 0; }
.galley-title { display: flex; justify-content: space-between; align-items: end; margin-bottom: 56px; }
.more-view-btn.green a { background: #197f68 !important; border: 0 !important;}
.more-view-btn.green a::before { background: #fafaf8 !important; }
.more-view-btn.green a::after {  background: #fafaf8 !important; }

.galley-list {}
.gallery-card { width:25%; background: #fafaf8; box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.06); border-radius: 15px; overflow: hidden; }
.gallery-card .thumnail { width: 100%; height: 225px; overflow: hidden; }
.gallery-card .thumnail img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }
.gallery-card .subject { width: 100%; font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gallery-card .text-area { padding: 30px 30px 40px; }
.etc-info { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.etc-info .detail { display: flex; align-items: center; gap: 15px; }
.main-galley { position: relative; }
.galley-buttons .prev-btn { background-image: url('../../images/galley-prev.png'); background-repeat: no-repeat; background-position: 50% 50%; width: 64px; height: 64px; left: -32px; }
.galley-buttons .next-btn { background-image: url('../../images/galley-next.png'); background-repeat: no-repeat; background-position: 50% 50%; width: 64px; height: 64px; right: -32px; }
.galley-buttons .swiper-button-prev::after { content: initial; }
.galley-buttons .swiper-button-next::after { content: initial; }
/* main */

/* nav */
.header-wrap { width: 1400px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 110px;}
.logo-body a > img { width:124px; }
.header-wrap nav { display: flex; gap: 50px; align-items: center; }
.menu-body a { color:#1a1a1a; }
.sns-body { display: flex; gap: 10px; align-items: center; }
.sns-body li > a { width: 22px; height: 22px; display: block; }
.sns-body li > a > img { vertical-align: top; width:100%; height: 100%; }
.main-menu li { position: relative; display: inline-block; }
.main-menu li:nth-child(1) {margin-right:30px;}
.main-menu li > a { width: 140px; display: block; text-align: center; padding: 40px 0; }
.main-menu > li:hover > a::before { content:''; width: 100%; height: 3px; background: #197f68; display: block; position: absolute; bottom: -1px; left: 0; z-index: 3;}
.menu-body:hover .submenu { display: block; }
.submenu-bg { display: none; position: absolute; top: 100%; left: 0; width: 100%; height: 200px; background: #fafaf8; z-index: 2; border-top: 1px solid #ccc; border-bottom: 1px solid #ededed; }
.menu-body:hover .submenu-bg { display: block; }
.submenu { display: none; position: absolute; z-index: 3; padding: 20px 0; width: 100%; text-align: center; }
.submenu div:nth-child(n+2) { margin-top: 20px; }
.submenu a { font-size: 18px; color: #1a1a1a; font-weight: 500; }
.menu-body { display: block; }
.m-menu-body { display: none; }
.m-menu-body a { display: flex; align-items: center;}
.m-menu-body a > i { font-size: 30px; }

.follow-top {position: fixed !important; top: 0 !important; z-index: 3000 !important; border-bottom: 1px solid #ccc;}
.follow-top .header-wrap {height: 80px;}
.follow-top .main-menu li > a {padding: 25px 0;}

.sns-body {display: none;}
/* nav */

/*  mobile nav */
.menuwrap {position: fixed; top: 0; right: -550px; width: 500px; height: 100%; background-color: #fff; transition: right 0.3s ease; z-index: 100; padding: 30px 60px;}
.menuwrap {overflow-y: auto; max-height: 100vh;}
.menuwrap.on {right: 0;}
.overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 99; display: none;}
.overlay.on {display: block;}
.menu-style {margin: 60px 0; display: grid; gap: 30px;}
.menu-style li > a {font-size: 20px; font-weight: 500; color: #1a1a1a; display: flex; align-items: center; justify-content: space-between; transition: color 0.6s ease;}
.menu-style li > a:hover {color:#197f68;}
.menu-style li > a::after {content:'\f105'; transition: transform 0.3s ease; font-family: "Font Awesome 6 Free"; font-weight: 900; color: #6e7071;}
.menu-style li.rotate > a::after {transform: rotate(90deg);}
.closed {position: absolute; top: 13px; right: 20px; height: 90px; width: 90px; background: #fff; border-radius: 100%; display: flex; align-items: center; justify-content: center;}
.closed i {color: #197f68; font-size: 30px;}
.menu-style .sub-menu {display: none; z-index: 101; background: #f8f8f8; border-radius: 10px; padding: 15px 20px; margin-top: 15px; line-height: 40px;}
.menu-style .sub-menu li > a {font-size: 17px; font-weight: 400;}
.menu-style .sub-menu li > a::after {content:initial;}
.menu-style .sub-menu .active {display: block;}
.menu-style .sub-menu li {display: flex; align-items: center; gap: 8px;}
.menu-style .sub-menu li > i {font-size: 8px;}
.m-copyright {font-size: 15px; text-align: center; font-weight: 400; color: #383838;}
/*  mobile nav */

/* copyright */
.copy-warp { border-top: 2px solid #444444; }
.copy-warp { padding : 25px 0 50px; }
.copy-logo { display: flex; align-items: center; gap: 20px;}
.copy-sns { display: flex; gap: 20px; }
.copy-sns a { width: 25px; height: 25px; display: block; }
.copy-sns a > img { vertical-align: top; }
.copy-first { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e3e3e3; padding-bottom: 20px; margin-bottom: 40px; }

.copyright-text { font-size: 16px; color: #4a4a4a; margin-top: 30px; }
.custom-select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url('../../images/select-arrow-balck.png'); background-repeat: no-repeat; background-position: 88% 50%; background-size: 13px 9px; cursor: pointer; width: 170px; /*height: 42px;*/ font-size: 16px; color: #1a1a1a !important; border-radius: 0; }
.custom-select:focus { border-color: #7fccb3 !important; box-shadow: 0 0 0 .2rem rgb(98 173 152 / 40%) !important; }
.copy-second { display: flex; align-items: start; justify-content: space-between; }
.company-info {}
.company-info div { font-size: 16px; color: #717171; display: inline-block; margin-right: 42px; position: relative; }
.company-info div::before { content:''; height: 15px; width: 1px; display: inline-block; background: #ddd; position: absolute; top: 4px; right: -22px; }
.company-info div:last-child::before { content: initial; }
.organ-list { display: flex; align-items: center; gap: 30px; }
/* copyright */

/* subpage */
.sub-visual01 { background-image: url('../../images/sub-visual01.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual02 { background-image: url('../../images/sub-visual02.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual03 { background-image: url('../../images/sub-visual03.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual04 { background-image: url('../../images/sub-visual04.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual05 { background-image: url('../../images/sub-visual05.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual06 { background-image: url('../../images/sub-visual06.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual07 { background-image: url('../../images/sub-visual07.png'); background-repeat: no-repeat; background-size: cover; background-position: center center; height: 500px; position: relative; }
.sub-visual01::before, .sub-visual02::before, .sub-visual03::before, .sub-visual04::before, .sub-visual05::before, .sub-visual06::before, .sub-visual07::before { content: ''; background: linear-gradient(to top, rgb(0 0 0 / 10%) 0%, rgb(0 0 0 / 25%) 100% 100%); height: 100%; width: 100%; display: block; }

.sub-main-img01 { background-image: url('../../images/sub-main-img01.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img03 { background-image: url('../../images/sub-main-img03.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img04 { background-image: url('../../images/sub-main-img04.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img05 { background-image: url('../../images/sub-main-img05.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img06 { background-image: url('../../images/sub-main-img06.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img07 { background-image: url('../../images/sub-main-img07.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img08 { background-image: url('../../images/sub-main-img08.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img09 { background-image: url('../../images/sub-main-img09.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; }
.sub-main-img10 { background-image: url('../../images/sub-main-img10.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; position: relative; height: 640px; border-radius: 15px; overflow: hidden; }

.sub-title { text-align: center; position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; width: 100%; text-shadow: 8.7px 5px 20px rgba(0, 0, 0, 0.4); }
.sub-title .small-tit { font-size: 26px; color: #fafaf8; }
.sub-title .big-tit { font-size: 66px; color: #fafaf8; font-weight: 800; }
.sub-contents-area { position: relative; width: 100%; overflow: hidden; }
.sub-contents-body { position: relative; width: 1400px; margin: 120px auto; }
.sub-main-title .solo-tit { font-size: 50px; font-weight: 700; text-align: center; margin-bottom: 70px; }
.sub-main-title .solo-tit > span { font-size: 50px; font-weight: 900; color: #098061; }
.sub-main-img-warp { position: relative; height: 440px; border-radius: 15px; overflow: hidden; }
.sub-main-img-warp::before { content: ''; background: #020514; opacity: 0.6; height: 100%; width: 100%; display: block; position: absolute; z-index: 0; }
.leaf-tit { width: 100%; position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; z-index: 3; text-align: center; }
.leaf-tit div { font-size: 50px; color: #fafaf8;  display: flex; justify-content: center; align-items: start; margin-bottom: 5px; gap: 10px; }
.sub-main-img-warp p { font-size: 30px; color: #fafaf8; font-weight: 500; letter-spacing: 0; }
.sub-subtitle { width: 88%; font-size:26px; font-weight: 500; letter-spacing: -1.6px; text-align: justify; text-align-last: center; line-height: 50px; margin: 50px auto 0; }

.sub-half-contents { display: flex; margin-top:130px; }
/* 푸른도시협의회 연혁 커스텀 */
.sub-half-custom { display: block; }
.sub-half-custom .sub-content-subject {width: 100% !important;}
.sub-half-custom .sub-detail-wrap {width: 100% !important; margin-top: 80px;}
/* 푸른도시협의회 연혁 커스텀 */
.sub-content-subject h2 { font-size: 36px; font-weight: 700; /*width: 460px;*/ }
.line-deco { position: relative; }
.line-deco::before { content: ''; width: 60px; height: 4px; display: block; border-radius: 10px; background: #098061; position: absolute; bottom: -20px; left: 0; }
.sub-content-subject { width: 30%; }
.sub-detail-wrap { width: calc(100% - 30%); }
.alone-ment-tit { font-size: 30px; font-weight: 700; }
.alone-content-detail { font-weight: 500; line-height: 40px; letter-spacing: -1px; text-align: justify; margin-top: 30px; }
.logo-dot-tit { display: flex; align-items: center; gap: 10px; font-size: 28px; font-weight: 700; margin-top: 60px; }
.logo-dot-tit img { width: 18px; height: 18px; }
.alone-cont-img { border-radius: 15px; overflow: hidden; margin: 32px 0 40px; width: 100%; height: 340px; }
.alone-cont-img img { width: 100%; height: 100%; object-fit: cover; }

.forest-line-deco { position: relative; padding-top: 140px; }
.forest-line-deco::before { content: ''; width: 2px; height: 130px; display: block; background: #000; position: absolute; top: -26px; transform: translateX(-50%); left: 50%; }
.sub-main-title.big .solo-tit, .sub-main-title.big .solo-tit span { font-size: 70px !important; }
.solo-tit.line-deco::before { transform: translateX(-50%); left: 50% !important; }
.history-custom { align-items: center; justify-content: center; gap: 55px; position: relative; }
.history-custom::before { content: ''; width: 560px; height: 3px; display: block; background: #dddddd; position: absolute; bottom: -40px; transform: translateX(-50%); left: 50%; }
.history-custom .nav-link { background: none !important; border: none !important; color: #777; font-weight: 700; font-size: 26px; height: 50px; width: 230px; position: relative; }
.history-custom .nav-link::before { content: ''; width: 15px; height: 15px; display: block; background: #dddddd; border-radius: 100%; position: absolute; bottom: -45px; transform: translateX(-50%); left: 50%; }
.history-custom .nav-link::after { content: ''; width: 1px; height: 30px; display: block; background: #dddddd; position: absolute; bottom: -30px; transform: translateX(-50%); left: 50%; }
.history-custom .nav-link.active { color: #098061; font-weight: 900; font-size: 34px; position: relative; }
.history-custom .nav-link.active::before { background: #098061; }
.swiper.forest-history { width: 100%; overflow: initial !important;}
.history-tab { margin-top: 125px; }
.history-tab .swiper-scrollbar-drag { background: #b1b1b1  !important; }
/*
#history-area01 .forest-history .history-card { font-size: 24px; height: 665px; }
#history-area02 .forest-history .history-card { font-size: 24px; height: 665px; }
#history-area03 .forest-history .history-card { font-size: 24px; height: 556px; }
*/
/*.forest-history .history-card { font-size: 24px; height: 660px; }*/
.forest-history .history-card { height: auto; margin-bottom: 60px; }

.history-card .thumnail { height: 287px; width: 100%; border-radius: 15px; overflow: hidden; position: relative; }
.history-card .thumnail img { width: 100%; height: 100%; object-fit: cover; }
.history-card .years { font-weight: 700; font-size: 34px; margin-top: 32px; }
.history-detail { margin-top: 25px; }
.history-detail p { font-weight: 500; text-align: justify; margin-top: 5px; }
.history-detail p > span { display: inline-block; vertical-align: text-top; letter-spacing: -1px; font-size: 20px; line-height: 30px; }
.history-detail p > span:nth-child(2n+1) { width: 20px; }
.history-detail p > span:nth-child(2n) { width: calc(100% - 20px); }
.history-scrollbar { bottom: 0 !important; left: 0 !important; width: 100% !important; }
.organ-chart { text-align: center; overflow: hidden; background-image: url('../../images/junjusi-map.png'); background-repeat: no-repeat; background-position: top center; }
.organ-img { margin: 26px 0; }

.directions-wrap { width: 100%; position: relative; display: flex; gap: 40px; }
.directions-text { width: 45%; }
.directions-text .subject { font-size: 34px; font-weight: 800; margin-bottom: 36px; }
.directions-text .subtitle { font-weight: 500; margin-bottom: 26px; letter-spacing: -1.4px; }
.directions-text .detail p { margin-bottom: 26px; display: flex; align-items: center; gap: 12px; }
.directions-text .detail p > span { font-size: 18px; font-weight: 500; }
.directions-text .sns { display: flex; align-items: center; gap: 40px; }
.directions-text .sns a > img { width: 85px; }
.directions-map { width: calc(100% - (45% + 40px)); height: 435px; overflow: hidden; }
.root_daum_roughmap .wrap_map { height: 435px !important; }
.root_daum_roughmap div { font-size: 11px; }
.root_daum_roughmap .map_border { opacity: 0 !important; }

.sub-business-title .head-tit { font-size: 50px; font-weight: 500; line-height: 70px; }
.sub-business-title .head-tit span { font-size: 50px; font-weight: 800; }
.sub-business-title .head-content { font-weight: 500; line-height: 36px; margin-top: 28px; }
.sub-nav-btn { margin-top: 60px; }
.sub-nav-btn ul { display: flex; gap: 4px; border-bottom: 1px solid #dddddd; }
.sub-nav-btn a { width: 140px; height: 50px; display: flex; color: #1a1a1a; align-items: center; justify-content: center; }
.sub-nav-btn .on a { background: #098061; border-top-left-radius: 6px; border-top-right-radius: 6px; color: #fff; }
.sub-nav-btn li { position: relative; }
.sub-nav-btn li::before { content: ''; width: 100%; height: 2px; display: block; background: #1a1a1a; position: absolute; left: 0; bottom: -1px; z-index: 2; }
.sub-nav-btn .on::before { background: #098061; }
.sub-business-body { position: relative; margin-top: 75px; width: 100%; }
.sub-business-subject { font-size: 40px; font-weight: 700; line-height: 60px; margin: 60px 0 70px; }
.sub-business-subject span { font-size: 40px; font-weight: 900; color: #098061; }
.sub-business-body .sub-subtitle { width: 100%; margin: initial; margin-top: 50px; text-align-last: initial; }
.sub-business-half { display: grid; grid-template-columns: repeat(2, 1fr); gap: 60px; margin-top: 20px; }

.sub-business-line { display: grid; gap: 70px; margin-top: 20px; }
.contents-etc-style { display: flex; gap: 60px; margin-top: 40px; }
.sub-business-line .alone-cont-img { margin: 0; width: 590px; }
.contetns-etc-text { width: calc(100% - 650px); }
.alone-content-add {  }
.alone-content-add .subject { display: flex; align-items: center; gap: 8px; font-size: 24px; font-weight: 700; margin: 40px 0 20px; }
.add-list-contents span { font-weight: 500; letter-spacing: -1.7px; }
.add-list-contents li { margin-top : 10px; position: relative; padding-left: 20px; letter-spacing: -1px; }
.add-list-contents li::before { content: ''; width: 7px; height: 7px; display: block; background: #1a1a1a; border-radius: 100%; position: absolute; top: 10px; left: 0; }
.no-mt { margin-top: 0; }
.etc-list-contents li, .etc-list-contents li > span { font-size: 22px !important; letter-spacing: -0.5px !important; }
.etc-list-contents li::before { top: 12px !important; }
.alone-content-add .subject span { font-size: 24px; font-weight: 700; color: #098061; }
.support-info { text-align: center; margin-top: 80px; }
.support-info .greeting, .support-info .greeting span { font-size: 34px; font-weight: 700; letter-spacing: -1px; }
.support-info .greeting span { font-size: 34px; font-weight: 700; color: #098061; }
.support-info .bank { margin-top: 30px; display: flex; align-items: center; justify-content: center; }
.support-info .bank, .support-info .bank span { font-size: 34px; font-weight: 500; letter-spacing: -1px; }
.support-info .bank span { font-size: 34px; font-weight: 800; color: #098061; }
.support-info .bank .dot { font-size: 50px; font-weight: 800; color: #1a1a1a; } 
.support-cs-info, .support-cs-info span {font-size: 24px; font-weight: 700;}

.greencity-custom { gap: 5px; }
.greencity-tab { margin-top: 40px; }
.greencity-tab .thumnail { height: 260px; }
/* subpage */

/* bbs board style */
.board-wrap { width: 100%; position: relative; margin-top: 74px; }
.board-count { font-size: 18px; display: flex; align-items: center; color: #3e3e3e; }
.board-count img { margin-right: 8px; }
.board-count span { color: #098061; }
.board-table table { width: 100%; margin-top: 15px; }
.board-table-head { width: 100%; background: #f5f5f5; border-top: 2px solid #1a1a1a; border-bottom: 1px solid #a4a4a4; height: 57px; line-height: 55px; }
.board-table-head th { font-size: 16px; }
.board-table-body td, .board-table-body a { font-size: 16px; font-weight: 500; color: #1a1a1a; height: 54px; line-height: 52px; vertical-align: middle; }
.board-table-body a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 48vw; display: inline-block; }
.board-table-body td { border-bottom: 1px solid #dddddd; }
.badge-green { background: #4da18b; border-radius: 100px; width: 18px; height: 18px; color: #fff; position: relative; top: -1px; }
.badge-red { background: #de0707; border-radius: 100px; width: 18px; height: 18px; color: #fff; position: relative; top: -1px; }
.btn-outline-dark:hover i { color: #fff !important; }
.custom-reset .page-item.active .page-link { background-color: #098061; border-color: #098061; }
.custom-reset *:focus { border-color: #7fccb3 !important; box-shadow: 0 0 0 .2rem rgb(98 173 152 / 40%) !important; }
.btn-green { background-color: #4da18b; }
.btn-green:hover { color: #fff; background-color: #4da18b; border-color: #4da18b; }
.btn-green i { color: #fff !important; }
.board-subject { font-size: 18px !important; }
/* bbs board style */

/* photo board style */
.photo-board-wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 60px 50px; margin-top: 18px; }
.photo-card { width:100%; overflow: hidden; }
.photo-card .thumnail { width: 100%; height: 225px; overflow: hidden; border-radius: 15px; }
.photo-card .thumnail img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.photo-card .subject-wrap { display: flex; align-items: center; }
.photo-card .subject { max-width: 100%; margin-right: 6px; font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.photo-card .text-area { padding: 30px 0 0; }
/* photo board style */