@charset "utf-8";
/* 당근고양이 'ㅅ' */

/* 초기화 */
@import url("default.css");

/* 기본 레이아웃 */
html, body {width:100%; overflow-x:hidden; word-break:keep-all;}
input.text,
select.text,
textarea.text {border:#ddd 1px solid; outline:0; background:#fff; max-width:100%; transition:.2s linear;}
input.text,
select.text {height:44px;}
input.text {padding:0 20px;}
textarea.text {padding:20px;}
input.text:focus,
select.text:focus,
textarea.text:focus {border-color:#aaa;}
body.ie select.text {padding:0 0 0 0 !important; background:none;}
button,input,a {transition:.2s linear;}
a.smoth {scroll-behavior:smooth;}
.imgin img {position:absolute; top:50%; left:50%; width:auto; height:auto; max-width:100%; max-height:100%; transform:translate(-50%,-50%);}

.inner {width:100%; max-width:1440px; padding:0 20px; margin:0 auto;}
span.br {display:block;}
.mo_vw {display:none !important;}
/*.pc_vw {display:none !important;}*/
.red {color:#f00 !important;}

/* 익스 브라우저 사용시 */
.ie_wrap {display:none; font-family:'Noto Sans Korean', sans-serif;}
.ie_wrap .outbox {position:fixed; top:0; left:0; width:100%; height:100%; background:#f286af; display:table; table-layout:fixed; z-index:1000;}
.ie_wrap .inbox {display:table-cell; vertical-align:middle;}
.ie_wrap p {font-size:19px; color:#fff; font-weight:500; line-height:30px; text-align:center; margin-bottom:20px; text-shadow:rgba(0,0,0,.2) 0 0 10px;}
.ie_wrap .link {text-align:center; font-size:0;}
.ie_wrap .link a {display:inline-block; vertical-align:top; font-size:60px; color:#fff; margin:0 40px; text-shadow:rgba(0,0,0,.1) 0 0 10px;}
body.ie {overflow:hidden;}
body.ie .ie_wrap {display:block;}

/* 게시판 목록 */
.board_list {border-top:#000 2px solid;}
.board_list th,
.board_list td {height:59px; text-align:center; border-bottom:#ddd 1px solid;}
.board_list th {font-size:18px; color:#333;}
.board_list td {font-size:17px; color:#666;}
.board_list td.tal a {display:inline-block; vertical-align:top; max-width:100%; line-height:58px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.board_list .w1 {width:80px;}
.board_list .w2 {width:110px;}
.board_list .w3 {width:130px;}
.board_list i.file {display:block; width:20px; height:26px; background:url('/images/icon_file.png') no-repeat 50% 50% / contain; margin:0 auto;}

.board_bottom .btns {overflow:hidden; margin-top:20px;}
.board_bottom .btns .btn {display:inline-block; width:106px; height:38px; line-height:38px; background:#005aab; font-size:16px; color:#fff; text-align:center; border:0; vertical-align:top;}
.board_bottom .btns .btn_l {color:#1e1e1e; line-height:36px; border:#1e1e1e 1px solid; background:#fff;}
.board_bottom .paging {text-align:center; font-size:0; margin-top:30px;}
.board_bottom .paging a {display:inline-block; width:42px; height:42px; line-height:42px; text-align:center; font-size:16px; color:#898989; vertical-align:top; margin:0 7px;}
.board_bottom .paging a.on {background:#005aab; color:#fff; border-color:#005aab;}
.board_bottom .paging .nums {margin:0 3px;}
.board_bottom .paging .arrow {background:none !important; font-size:0;}
.board_bottom .search_wrap {text-align:center; font-size:0; margin-top:20px;}
.board_bottom .search_wrap .text,
.board_bottom .search_wrap .btn {display:inline-block; vertical-align:top; height:40px; font-size:15px;}
.board_bottom .search_wrap .text {line-height:38px;}
.board_bottom .search_wrap select.text {width:100px;}
.board_bottom .search_wrap input.text {width:300px; margin:0 10px;}
.board_bottom .search_wrap .btn {width:120px; line-height:40px; border:0; background:#005aab; color:#fff; font-weight:bold; text-align:center;}

/* 게시판 상세 */
.board_in {border-top:#000 2px solid;}
.board_in .tit {font-size:26px; color:#333; font-weight:500; line-height:30px; padding:30px; border-bottom:#ddd 1px solid; text-align:center;}
.board_in .file {display:flex; border-bottom:#ddd 1px solid;}
.board_in .file dt {font-size:16px; color:#333; font-weight:700; line-height:60px; width:90px;}
.board_in .file dd {width:calc(100% - 90px); padding:15px 0; display:flex; flex-wrap:wrap; gap:0 20px;}
.board_in .file dd a {display:block; font-size:16px; color:#666; line-height:30px;}
.board_in .date {display:flex; gap:36px; justify-content:flex-end; padding-top:14px; font-size:16px; color:#999; font-weight:300;}
.board_in .con {padding:70px 0; border-bottom:#ddd 1px solid;}

.board_write table {border-top:#000 2px solid;}
.board_write th,
.board_write td {padding:10px 0; border-bottom:#ddd 1px solid;}
.board_write th {font-size:17px; color:#333; width:175px; padding-left:20px; text-align:left;}
.board_write td {font-size:0; color:#666;}
.board_write td * {font-size:17px;}
.board_write dl {display:flex; margin-bottom:10px;}
.board_write dl:last-child {margin-bottom:0;}
.board_write dt {width:66px; line-height:44px;}
.board_write dd {width:calc(100% - 66px);}
.board_write .w1 {width:415px;}
.board_write .w2 {width:125px;}
.board_write .w3 {width:482px;}
.board_write .w4 {width:210px;}
.board_write select.w4 {margin-left:10px;}
.board_write .w5 {width:260px;}
.board_write .w6 {width:620px;}
.board_write em {display:inline-block; vertical-align:top; text-align:center; line-height:44px;}
.board_write em.telbar {width:52px; font-size:18px;}
.board_write em.e {width:35px;}
.board_write em.ymd {padding:0 20px 0 8px;}
.board_write .mt {margin-top:10px;}
.board_write .btn_add {width:140px; height:44px; line-height:42px; border:#666 1px solid; text-align:center;}
.board_write textarea.text {height:144px;}
.board_write .gbox {background:#f7f7f7; padding:35px; text-align:center; margin:60px 0 30px;}
.board_write .btn {display:block; font-size:18px; color:#fff; font-weight:700; line-height:54px; height:54px; width:240px; border:0; background:#005aab; margin:0 auto;}

/* 갤러리 목록 */
.gall_list {overflow:hidden; display:flex; flex-wrap:wrap; gap:60px 10px;}
.gall_list li {width:calc((100% - 30px)/4);}
.gall_list li a {display:block; text-align:center;}
.gall_list li i {display:block; width:100%; height:200px; overflow:hidden;}
.gall_list li i img {width:100%; height:100%; object-fit:cover;}
.gall_list li p {display:block; font-size:17px; color:#333; height:20px; line-height:20px; margin:23px 0 12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.gall_list li .date {font-size:17px; color:#666; font-weight:300; line-height:18px;}

/* 접근성 */
.blind_link {position:fixed; top:0; left:0; width:100%; z-index:101;}
.blind_link a {position:fixed; top:0; left:0; width:100%; height:0; font-size:20px; color:#fff; font-weight:500; line-height:60px; text-align:center; background:#999e; overflow:hidden;}
.blind_link a:focus {height:auto;}

/* header */
.header {position:fixed; top:0; left:0; width:100%; z-index:100; background:#fff; transition:.2s linear;}
.header.fixed {box-shadow:rgba(0,0,0,.1) 0 0 10px;}
.header .inner {position:relative; height:100px;}
.header .logo {position:absolute; top:0; left:20px; line-height:100px; font-size:0;}
.header h1 {display:none;}
.header .gnb ul {display:flex; justify-content:center;}
.header .gnb li {position:relative;}
.header .gnb li > a {font-size:20px; color:#222; font-weight:500; line-height:100px; padding:0 37px;}
.header .snb {position:absolute; top:100%; left:-20%; width:140%; height:0; background:#fff; overflow:hidden; transition:.2s linear;}
.header .snb a {display:block; font-size:16px; color:#666; line-height:40px; text-align:center;}
.header .snb a.on {color:#0036ab; font-weight:700;}
.header .right {position:absolute; top:0; right:20px; height:100px; display:flex; gap:10px; align-items:center;}
.header .right a {display:block; font-size:14px; color:#0036ab; line-height:40px; height:42px; width:120px; text-align:center; border:#0036ab 1px solid; border-radius:21px;}

/* footer */
.footer {background:#333; padding:29px 0 5px; font-size:14px; color:#aaa; line-height:26px;}
.footer span {position:relative; display:inline-block; margin-right:30px;}
.footer span:after {content:""; position:absolute; top:50%; right:-15px; width:1px; height:10px; margin-top:-5px; background:rgba(255,255,255,.6);}
.footer span:nth-child(4) {margin-right:0;}
.footer span:nth-child(4):after {display:none;}
.footer .copy {font-size:12px; line-height:18px; margin-top:15px;}
.footbnr {    position: relative;
    display: block;
    left: 84%;
    bottom: 66px;}
.footbnr img {width:180px;}

/* main */
.mvisual_wrap {margin-top:100px; background:#f9f9f9; padding:45px 0 60px;}
.mvisual {background:url('/images/bg_mvisual.jpg') no-repeat 50% 50% / cover; padding:105px 20px; color:#fff; text-align:center; margin-bottom:45px;}
.mvisual strong {display:block; font-size:35px; line-height:40px;}
.mvisual p {font-size:18px; font-weight:300; line-height:24px; margin-top:10px;}

.mcon .tit {position:relative; font-size:22px; color:#000; font-weight:700; line-height:24px; margin-bottom:25px;}
.mcon .tit .right {position:absolute; top:-5px; right:0; height:34px; display:flex; gap:2px;}
.mcon .tit .right button,
.mcon .tit .right .more {position:relative; display:block; width:34px; height:34px; border:#ececec 1px solid;}
.mcon .tit .right button:before {content:""; display:block; width:100%; height:100%; background:url('/images/arrow_slide.png') no-repeat 50% 50%;}
.mcon .tit .right .next:before {transform:scale(-1);}
.mcon .tit .right .more:before,
.mcon .tit .right .more:after {content:""; position:absolute; top:50%; left:50%; background:#000;}
.mcon .tit .right .more:before {width:13px; height:1px; margin:0 0 0 -6px;}
.mcon .tit .right .more:after {width:1px; height:13px; margin:-6px 0 0 0;}
.mboxs {display:flex; gap:30px; flex-wrap:wrap;}
.mboxs > div {width:calc((100% - 60px)/3); padding:30px; background:#fff;}
.mboxs .mboard {border:#ebebeb 1px solid; padding:29px;}
.mboxs .mboard li a {position:relative; display:block; font-size:16px; color:#333; font-weight:300; line-height:39px; padding-left:16px; padding-right:90px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mboxs .mboard li a:before {content:""; position:absolute; top:50%; left:0; width:6px; height:6px; background:#0036ab; border-radius:50%; margin-top:-3px;}
.mboxs .mboard li a span {position: absolute; top:0; right:0;}
.mboxs .mlinks .tit {color:#fff;}
.mboxs .mlinks li {margin-bottom:12px;}
.mboxs .mlinks li:last-child {margin-bottom:0;}
.mboxs .mlinks li a {position:relative; display:block; background:rgba(255,255,255,.3); border:rgba(255,255,255,.6) 1px solid; font-size:18px; color:#fff; font-weight:300; line-height:52px; height:54px; padding:0 20px;}
.mboxs .mlinks li a:before,
.mboxs .mlinks li a:after {content:""; position:absolute; top:50%; background:#fff;}
.mboxs .mlinks li a:before {width:15px; height:1px; right:20px;}
.mboxs .mlinks li a:after {width:1px; height:15px; right:27px; margin-top:-7px;}
.mboxs .mc03 {background:url('/images/bg_mc03.jpg') no-repeat 50% 50% / cover;}
.mboxs .mc06 {background:url('/images/bg_mc06.jpg') no-repeat 50% 50% / cover;}
.mgall_slide .mv {position:relative; display:block; font-size:0; width:100%; height:191px; overflow:hidden;}
.mgall_slide .mv img {width:100%; height:100%; object-fit:cover;}
.mgall_slide .mv p {position:absolute; bottom:0; left:0; width:100%; height:48px; line-height:48px; font-size:16px; color:#fff; font-weight:300; text-align:center; background:rgba(0,0,0,.51); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.members {margin-top:35px; background:#fff; border:#ebebeb 1px solid; padding:30px;}
.members ul {margin: 0 -11px;}
.members .slick-slide {padding:0 11px;}
.members li {height:92px;  display:flex !important; justify-content:center; align-items:center;}
.members li img {max-width:100%; max-height:100%;}

/* sub */
.svisual {margin-top:100px; color:#fff; text-align:center; padding:75px 20px; background:url('/images/svisual.jpg') no-repeat 50% 50% / cover; margin-bottom:65px;}
.svisual strong {display:block; font-size:35px; line-height:40px;}
.svisual p {font-size:18px; font-weight:300; line-height:24px; margin-top:10px;}
.container {display:flex; padding-bottom:100px;}
.aside {width:250px;}
.aside .g dd,
.aside .s dt {display:none;}
.aside dt {font-size:30px; color:#222; font-weight:700; line-height:34px; margin-bottom:20px;}
.aside dd a {position:relative; display:block; font-size:17px; color:#666; font-weight:300; line-height:58px; padding:0 20px; border-bottom:#e5e5e5 1px solid;}
.aside dd a:before,
.aside dd a:after {content:""; position:absolute; top:50%; background:#fff; opacity:0;}
.aside dd a:before {width:12px; height:2px; right:20px; margin-top:-1px;}
.aside dd a:after {width:2px; height:12px; right:25px; margin-top:-6px;}
.aside dd a.on {background:#005aab; color:#fff; font-weight:700;}
.aside dd a.on:before,
.aside dd a.on:after {opacity:1;}
.contents {width:calc(100% - 250px); padding-left:60px; font-size:17px; color:#222; line-height:27px;}
.contents > .location {position:relative; font-size:16px; color:#999; font-weight:300; line-height:24px; display:flex; margin-bottom:20px;}
.contents > .location i {display:block; width:24px; height:24px; background:url('/images/icon_home.png') #aaa no-repeat 50% 50%; border-radius:50%;}
.contents > .location em {width:40px; height:24px; background:url('/images/arrow_location.png') no-repeat 50% 50%;}
.contents .title {font-size:35px; color:#222; font-weight:700; line-height:38px; padding-bottom:30px; border-bottom:#ddd 1px solid; margin-bottom:50px;}

.contents .btit {font-size:18px; color:#222; font-weight:700; line-height:20px; margin:70px 0 15px;}
.contents .tbl th,
.contents .tbl td {line-height:28px; border-right:#ddd 1px solid; padding:10px 20px; word-break:break-all;}
.contents .tbl th:last-child,
.contents .tbl td:last-child {border-right:0;}
.contents .tbl thead th {color:#333; font-weight:500; text-align:center; background:#f4f4f4;}
.contents .tbl tbody td {border-bottom:#ddd 1px solid;}

/* 인사말 */
.greeting {position:relative; padding-right:320px;}
.greeting strong {display:block; font-size:30px; color:#005aab; line-height:39px; margin-bottom:30px;}
.greeting p {color:#333; font-weight:300; line-height:27px;}
.greeting:after {content:""; position:absolute; top:0; right:0; width:300px; height:455px; background:url('/images/img_s0101.jpg') no-repeat 50% 50% / cover;}

/* 협회설립배경 및 주요활동 */
.gbox {background:#fbfbfb; padding:40px;}
.gbox.mb {margin-bottom:25px;}
.gbox .gtit {font-size:26px; color:#222; font-weight:700; line-height:26px; padding-bottom:15px; border-bottom:#d7d7d7 1px solid; margin-bottom:25px;}

/* 조직도 */
.organization .chart .head {position:relative; width:150px; height:150px; border-radius:50%; border:#005aab 7px solid; margin:0 auto 65px; font-size:21px; color:#222; line-height:42px; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.organization .chart .head:before {content:""; position:absolute; top:calc(100% + 7px); left:50%; width:1px; height:65px; background:#ddd;}
.organization .chart .head strong {position:relative; color:#005aab;}
.organization .chart .head strong:after {content:""; position:absolute; bottom:-1px; left:50%; width:80px; height:2px; background:#005aab; margin-left:-40px;}
.organization .chart ul {position:relative; display:flex; justify-content:center; gap:35px; margin-bottom:65px;}
.organization .chart ul:before {content:""; position:absolute; top:100%; left:50%; width:1px; height:65px; background:#ddd;}
.organization .chart ul:after {content:""; position:absolute; top:50%; height:1px; background:#ddd; z-index:-1;}
.organization .chart li {width:190px; height:64px; color:#fff; line-height:20px; padding:0 10px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;}
.organization .chart .c1:after {left:50%; width:400px; transform:translateX(-50%);}
.organization .chart .c1 li {background:#1568b2;}
/*.organization .chart .c2 {padding-left:225px;}*/
/*.organization .chart .c2:after {left:50%; width:200px;}*/
.organization .chart .c2:after {left:50%; width:800px; transform:translateX(-50%);}
.organization .chart .c2 li {background:#4893cc;}
.organization .chart .c3 li {background:#4da4c0;}
.organization .chart .c4 {padding-top:35px;}
.organization .chart .c4:before {top:0; left:calc(50% + 1px); width:675px; height:1px; transform:translateX(-50%);}
.organization .chart .c4 li {position:relative; color:#333; border:#5a9ccf 1px solid;}
.organization .chart .c4 li:before {content:""; position:absolute; bottom:calc(100% + 1px); left:50%; width:1px; height:35px; background:#ddd;}
.organization .chart .c5:after {left:50%; width:100px; transform:translateX(-50%);}
.organization .chart .c5 li {background:#48cc96;}
.organization .list {display:flex; flex-wrap:wrap; gap:60px 0;}
.organization .list li {position:relative; width:50%; padding:0 20px 0 195px; min-height:196px;}
.organization .list i {position:absolute; top:0; left:0; width:175px; height:195px; background:url('/images/img_organization_list.gif') no-repeat 50% 50% / cover;}
.organization .list .subj {position:relative; color:#333; font-weight:700; line-height:20px; padding-bottom:24px; border-bottom:#e1e1e1 1px solid; margin-bottom:24px; max-width:230px;}
.organization .list .name {color:#333; line-height:26px;}

/* 찾아오시는 길 */
.map_wrap {width:100%; height:570px; overflow:hidden;}
.map_wrap .root_daum_roughmap {max-width:100%;}
.map_text {position:relative; background:#585858; padding:18px 18px 25px 90px; font-size:20px; color:#fff; line-height:42px;}
.map_text:before {content:""; position:absolute; top:20px; left:30px; width:42px; height:42px; background:url('/images/icon_map.png') rgba(255,255,255,.2) no-repeat 50% 50%; border-radius:50%;}
.map_text ul {display:flex; gap:54px; margin-top:3px;}
.map_text li {position:relative; font-size:16px; font-weight:300; line-height:14px;}
.map_text li:before {content:""; position:absolute; top:50%; left:-27px; width:1px; height:14px; background:rgba(255,255,255,.5); margin-top:-7px;}
.map_text li:first-child:before {display:none;}

/* 주요연혁 */
.history_wrap {position:relative; padding-left:50%;}
.history_wrap:before {content:""; position:absolute; top:12px; left:50%; width:1px; height:calc(100% - 24px); background:#ddd;}
.history_wrap .head {position:absolute; top:0; left:0; width:50%;}
.history_wrap .head .tt {font-size:26px; color:#333; line-height:36px;}
.history_wrap .head p {position:relative; font-size:18px; color:#999; line-height:26px; margin-top:15px; padding-bottom:35px; margin-bottom:25px;}
.history_wrap .head p:after {content:""; position:absolute; bottom:0; left:0; width:32px; height:3px; background:#333;}
.history_wrap .head i {display:block; width:470px; max-width:calc(100% - 40px); box-shadow:#f7f7f7 16px 33px 0;}
.history dl {position:relative; padding-bottom:35px; margin-bottom:65px;}
.history dl:before {content:""; position:absolute; bottom:0; left:33px; width:calc(100% - 33px); border-bottom:#000 1px dashed; opacity:.25;}
.history dt {position:relative; font-size:30px; color:#005aab; font-weight:700; line-height:24px; margin-bottom:10px; padding-left:33px; z-index:1;}
.history dt:before,
.history dt:after {content:""; position:absolute; top:50%; border-radius:50%; background:#005aab; transform:translateY(-50%);}
.history dt:before {width:26px; height:26px; left:-13px; opacity:.2;}
.history dt:after {width:12px; height:12px; left:-6px;}
.history dd {padding-left:33px;}
.history dd p {color:#666; line-height:28px;}
.history dl:last-child:after {content:""; position:absolute; top:12px; left:0; width:1px; height:100%; background:#fff;}

/* 회원가입 및 혜택안내 */
.to_be_used {color:#333; line-height:27px;}



.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff;}
.hd_pops img{max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#222;color:#fff;text-align:left;position:relative;}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject{background:#222;text-align:left}
.hd_pops_footer .hd_pops_close{background:#393939;position:absolute;top:0;right:0}