@charset "utf-8";

@font-face {
    font-family: 'KimJeongCheolHandwriting';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulScript-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'KimJeongCheolHandwriting';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulScript-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'KimJeongCheolHandwriting';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulScript-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'OwnglyphYuntaeng';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/2608211801@font-160/font-160/온글잎 윤탱체.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'SeoulNotice';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/SeoulAlrimTTF-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'SeoulNotice';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/SeoulAlrimTTF-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'SeoulNotice';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/SeoulAlrimTTF-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'SeoulNotice';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/SeoulAlrimTTF-Heavy.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}
@font-face {
    font-family: 'Bobaesomjindo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2410-1@1.0/BobaesumJindoTTF.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

.sub_visual {margin-top:200px; background:#e2f3ef; margin-bottom:20px}
.sub_visual > div {max-width:1400px; margin:0 auto; height:150px; padding-top:35px; box-sizing:border-box}
.sub_visual > div h2 {font-size:35px; font-weight:700; margin-top:20px}
.sub_visual > div .page_navigation {display:none}
.sub_visual > div .page_navigation span {background:url('/images/comm/ico_home.png') no-repeat 0 0; padding-left:30px; font-size:18px; line-height:23px; height:23px; display:inline-block}


nav.sub_menu {height:70px}
nav.sub_menu a.m1 {display:none; font-size:18px; line-height:50px; box-sizing:border-box; padding-left:20px; border-bottom:1px solid #fff; position:relative; background:#0d7cd2; color:#fff}
nav.sub_menu a.m1 i {width:15px; height:9px; background:url('/images/comm/allow_u.png') no-repeat; display:block; position:absolute; top:50%; transform:translateY(-50%); right:20px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease}
nav.sub_menu a.m1.on i {transform: rotate(180deg)}

nav.sub_menu ul {max-width:1400px; margin:0 auto; text-align:center; display:flex}
nav.sub_menu ul > li {display:inline-block; position:relative; height:70px; flex-basis:100%}
nav.sub_menu ul > li+li:before {content:''; position:absolute; left:0; width:3px; height:3px; background:#888; border-radius:50%; top:50%; transform:translateY(-50%)}
nav.sub_menu ul > li > a {font-size:20px; transition:all 0.3s; position:relative; display:flex; align-items:center; justify-content:center; padding:20px 10px; box-sizing:border-box; height:70px; font-weight:600}
nav.sub_menu ul > li > a:after {content:''; display:inline-block; width:0; height:100%; vertical-align:middle}
nav.sub_menu ul > li.active > a {color:#fff; font-weight:700; background:#0d7cd2; border-radius:20px}
nav.sub_menu ul > li.active+li:before {display:none}
nav.sub_menu ul > li > a:hover:before {background-color:#0d7cd2; width:50px}
nav.sub_menu ul > li > a:before {display:block; content:""; position:absolute; width:0; height:5px; border-radius:5px; background-color:transparent; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); transition:all 0.3s;}
nav.sub_menu ul > li > a em {font-size:14px; display:block}


.container {clear:both; max-width:1400px; margin:0 auto; position:relative; padding-top:70px; box-sizing:border-box}
.container.board {margin-bottom:50px}

.sub_page {line-height:1.5; font-size:17px; font-weight:400; padding-bottom:70px; letter-spacing:-0.5px; min-height:400px}
.sub_page img {max-width:100%}
.sub_page .section {margin-bottom:50px}
.sub_page .tac {text-align:center}
.sub_page .mb50 {margin-bottom:50px}
.sub_page .mb80 {margin-bottom:80px}
.sub_page .yt {font-family: 'OwnglyphYuntaeng'}
.sub_page .pro_m {display:none}

.sub_page .btn {text-align:center}
.sub_page .btn a {display:inline-block; padding:10px 40px; box-sizing:border-box; background:#555; color:#fff; border-radius:10px; box-shadow:3px 3px 3px rgba(0,0,0,0.25)}
.sub_page .btn a:hover {box-shadow:inset 0 0 3px 3px rgba(0,0,0,0.25)}

h3.tit {font-size:32px; margin-bottom:60px; font-weight:700; position:relative; padding-bottom:30px; border-bottom:#eee solid 1px}
h4.tit {font-size:27px; font-weight:700; margin-bottom:30px; clear:both; color:#399f86}
h5.tit {font-size:22px; margin-bottom:20px; font-weight:600; position:relative; padding-left:22px}
h5.tit:after {content:''; width:13px; height:13px; border:3px solid #5e93f5; position:absolute; top:8px; left:0; box-sizing:border-box; border-radius:5px}
h5.tit span {font-size:18px; font-weight:400; margin-left:10px}
h6.tit {font-size:20px; margin-bottom:20px; font-weight:600; color:#5e92f5}

.nav_tab1 {margin-bottom:70px; font-size:0; margin-left:-1px; display:flex}
.nav_tab1 a {font-size:18px; color:#555; width:100%; height:60px; flex-basis:100%; text-align:center; margin-left:1px; position:relative; line-height:1; letter-spacing:-1px; border:1px solid #dbdbdb; background:#f7f7f7}
.nav_tab1 a:after {content:''; display:inline-block; width:0; height:100%; vertical-align:middle}
.nav_tab1 a:hover,
.nav_tab1 a.active {font-weight:500; background:#66b46b; color:#fff; border:1px solid #66b46b}
.nav_tab1 a.active:before {content: ""; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid #66b46b; position: absolute; left: 50%; bottom: -8px; transform: translate(-50%, 0)}
.nav_tab1 a.long {display:flex; align-items:center; justify-content:center; line-height:1.5}
.nav_tab1 a.long:after {height:50%}

.inquiry {padding:30px 40px 30px 100px; box-sizing:border-box; border:3px solid #eee; position:relative}
.inquiry i {font-size:1.2em; background:#469c86; padding:15px; box-sizing:border-box; border-radius:50px; color:#fff; position:absolute; top:50%; left:25px; transform:translateY(-50%)}
.inquiry strong {font-size:1.2em; color:#5e92f5; padding:0 10px; box-sizing:border-box}
.inquiry span {display:inline-block; margin-left:20px}

/*한원복지재단 소개*/
.about .greeting p.title {font-size:1.6em; font-weight:bold; color:#0e3a6f}
.about .greeting p+p {margin-top:20px}
.about .greeting .sign {text-align:right}
.about .greeting .sign strong {font-size:1.8em; padding-left:15px; box-sizing:border-box; font-family: 'KimJeongCheolHandwriting'}

.about .tit_box {padding:30px 40px; box-sizing:border-box; background:#f9f9f9; border-radius:15px}

.about .num_box {display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-bottom:50px}
.about .num li {line-height:1.5; position:relative; padding-left:43px; padding-bottom:10px; border-bottom:1px dotted #dbdbdb}
.about .num li+li {margin-top:10px}
.about .num li label {width:30px; height:30px; padding:3px 10px; box-sizing:border-box; position:absolute; top:-3px; left:0; background:#0d7cd2; color:#fff; border-radius:5px}

.about .organization {text-align:center; padding:80px 30px; box-sizing:border-box; border:1px solid #777; border-radius:25px; position:relative}
.about .organization::before {content:''; background:#dbdbdb; width:1px; height:30%; position:absolute; top:158px; left:50%; transform:translateX(-50%); z-index:-1}
.about .organization::after {content:''; background:#dbdbdb; width:12%; height:1px; position:absolute; top:210px; left:56%; transform:translateX(-50%); z-index:-1}
.about .organization .o1 {width:250px; padding:15px 30px; box-sizing:border-box; border-radius:10px; background:#f8a700; color:#fff; position:relative; margin:0 auto 100px}
.about .organization .o2 {background:#555; color:#fff; border-radius:50px; padding:10px 60px; box-sizing:border-box; position:absolute; right:25%; top:187px}
.about .organization .o3 {width:250px; background:#4990e2; color:#fff; padding:15px 30px; box-sizing:border-box; border-radius:10px; margin:0 auto 50px}
.about .organization .o3.red {background:#e31c21}
.about .organization .o4 {display:flex; justify-content:space-evenly; margin-top:150px; position:relative}
.about .organization .o4::before {content:''; width:41%; height:1px; background:#dbdbdb; position:absolute; top:-50px; left:50%; transform:translateX(-50%)}
.about .organization .o4 > div {width:23%; padding:20px 30px; box-sizing:border-box; border-radius:25px; position:relative; background:#f9fff9; border:2px solid #c0dfc0}
.about .organization .o4 > div::before {content:''; width:1px; height:51px; background:#dbdbdb; position:absolute; top:-52px; left:50%; transform:translateX(-50%); z-index:-1}
.about .organization .o4 > div p {background:#7ed320; color:#fff; padding:7px; box-sizing:border-box; border-radius:20px; margin-bottom:20px}
.about .organization .o4 > div p.green {background:#008001}
.about .organization .o4 > div > ul > li {line-height:1.5; padding-bottom:10px; box-sizing:border-box; border-bottom:1px dotted #dbdbdb}
.about .organization .o4 > div > ul > li span {display:block; font-size:0.8em}
.about .organization .o4 > div > ul > li+li {margin-top:10px}

.about4 .history {position:relative; padding-top:50px}
.about4 .history::before {content:''; width:1px; height:100%; background:#dbdbdb; position:absolute; top:0; left:50%; transform:translateX(-50%)}
.about4 .history .box {display:flex; position:relative}
.about4 .history .box .no_txt {padding:60px 60px 0 0; text-align:center}
.about4 .history .box .no_txt > div.tr {text-align:right}
.about4 .history .box .no_txt > div {margin-bottom:40px; text-align:left}
.about4 .history .box .no_txt > div:nth-child(2) {text-align:right; margin-bottom:0}
.about4 .history .box .no_txt > div img {border-radius:25px}
.about4 .history .box::before {content:''; width:8px; height:8px; border-radius:25px; background:#0e3a6f; position:absolute; top:0; left:50%; transform:translateX(-50%)}
.about4 .history .box > div {width:50%; padding:0 0 50px 50px; box-sizing:border-box}
.about4 .history .box > div .tit {color:#0e3a6f; font-size:3em; font-weight:bold; margin-bottom:20px}
.about4 .history .box > div .txt {display:flex; margin-bottom:20px}
.about4 .history .box > div .txt .year {width:60px; color:#222; font-size:1.2em; font-weight:600; margin-top:-3px}
.about4 .history .box > div .txt .text {width:calc(100% - 60px); padding-left:10px; box-sizing:border-box; color:#555}
.about4 .history .box > div .txt .text > li {line-height:1.5; margin-bottom:8px}

.about4 .history .box.reverse {flex-direction:row-reverse}
.about4 .history .box.reverse::before {background:#efad3a}
.about4 .history .box.reverse > div {padding:0 50px 50px 0}
.about4 .history .box.reverse > div.no_txt {padding:60px 0 0 60px}
.about4 .history .box.reverse > div .tit {text-align:right; color:#efad3a}
.about4 .history .box.reverse > div .txt {flex-direction:row-reverse}
.about4 .history .box.reverse > div .txt .year {text-align:right}
.about4 .history .box.reverse > div .txt .text {padding-left:0; padding-right:10px}
.about4 .history .box.reverse > div .txt .text > li {text-align:right}

.about5 .mv {display:flex; align-items:center; text-align:center; margin-bottom:80px}
.about5 .mv .left {display:flex; justify-content:center; align-items:center; width:150px; height:140px; background:#399f86; color:#fff; font-size:1.6em; font-weight:bold; border-radius:50%}
.about5 .mv .right {width:calc(100% - 150px); margin-left:80px; padding:45px 30px; box-sizing:border-box; background:#f8fffd; border-radius:25px; position:relative; font-family: 'SeoulNotice'; font-size:1.4em; color:#555; word-break:keep-all}
.about5 .mv .right::before {content:''; width:40px; height:1px; background:#ccc; position:absolute; left:-60px; top:50%; transform:translateY(-50%)}
.about5 .mv .right strong {color:#399f86; font-size:1.2em}
.about5 .mv.yellow  .right strong {color:#FC0}
.about5 .mv.yellow .left {background:#FC0}
.about5 .mv.yellow .right {background:#fffdf3}

.about5 .mv.navy .left {background:#3e64a2}
.about5 .mv.navy .right {background:#f9f9f9}
.about5 .mv.navy .right > ul {display:flex}
.about5 .mv.navy .right > ul > li {width:calc(25% - 30px); font-size:0.85em; font-weight:600; position:relative; padding:0 20px; box-sizing:border-box}
.about5 .mv.navy .right > ul > li::before {content:''; width:25px; height:25px; background-image:url('/images/about/plus.png'); position:absolute; top:50%; right:-26px}
.about5 .mv.navy .right > ul > li:last-child::before {display:none}
.about5 .mv.navy .right > ul > li p {margin:25px 0 15px; color:#3e64a2}
.about5 .mv.navy .right > ul > li+li {margin-left:40px}
.about5 .mv.navy .right > ul > li > ul > li {font-size:0.85em; font-family:pretendard; text-align:left; font-weight:400; position:relative; padding-left:15px; box-sizing:border-box; word-break:keep-all}
.about5 .mv.navy .right > ul > li > ul > li::before {content:'·'; position:absolute; top:0; left:0}

.about5 .mv_bottom .title {font-size:1.1em; font-weight:bold; margin-bottom:40px; text-align:center; background:#f4f9ff; padding:20px; box-sizing:border-box; border-radius:35px 0 35px 0}
.about5 .mv_bottom .title strong {font-size:1.3em; color:#0d7cd2}
.about5 .mv_bottom .content {display:flex; align-items:center}
.about5 .mv_bottom .content .img {width:35%}
.about5 .mv_bottom .content .text_list1 {width:65%; padding-left:50px; box-sizing:border-box}
.about5 .mv_bottom .content .text_list1 li strong {color:#0d7cd2}

.about .affiliated {display:grid; grid-template-columns:1fr 1fr; gap:20px}
.about .affiliated .box {border:3px solid #ddd}
.about .affiliated .box .img.logo {text-align:center; padding:30px 0; box-sizing:border-box; border-bottom:1px solid #dbdbdb}
.about .affiliated .box .bottom {display:flex; align-items:center; border-bottom:1px solid #dbdbdb}
.about .affiliated .box .bottom .img {width:30%; padding:20px; box-sizing:border-box}
.about .affiliated .box .bottom .txt {width:70%; padding:20px; box-sizing:border-box; border-left:1px solid #dbdbdb}
.about .affiliated .box .bottom .txt .top {background:#f9f9f9; border-radius:20px; padding:20px; box-sizing:border-box; text-align:justify}
.about .affiliated .box .bottom.b2 .img {border-right:1px solid #dbdbdb}
.about .affiliated .box .bottom.b2 .txt {border-left:none}
.about .affiliated .text_list1 {padding:30px; box-sizing:border-box}
.about .affiliated .box .mv {padding:20px; box-sizing:border-box; border-bottom:1px solid #dbdbdb}
.about .affiliated .box .mv > div > p {font-size:1.2em; font-weight:bold; margin-bottom:15px}
.about .affiliated .box .mv1 {margin-bottom:20px}
.about .affiliated .box .mv1 > div {background:#f4faff; padding:20px; box-sizing:border-box; text-align:center; border-radius:0 25px 0 25px; word-break:keep-all}
.about .affiliated .box .mv2 {margin-bottom:20px}
.about .affiliated .box .mv2 ul li {box-sizing:border-box; position:relative; padding: 0 0 7px 35px; box-sizing:border-box; line-height:1.5; border-bottom:1px dotted #dbdbdb}
.about .affiliated .box .mv2 ul li+li {margin-top:10px}
.about .affiliated .box .mv2 ul li label {width:25px; height:25px; background:#0d7cd2; color:#fff; padding:3px 8px; box-sizing:border-box; border-radius:20px; font-size:0.8em; position:absolute; top:0; left:0}
.about .affiliated .box .mv3 ul {display:flex; justify-content:space-evenly}
.about .affiliated .box .mv3 ul li {box-sizing:border-box; position:relative; background:#f9f9f9; border-radius:50px; padding:5px 30px; box-sizing:border-box}
.about .affiliated .box .mv3 ul li:hover {background:#333; color:#fff; cursor:pointer}

.about .title2 {background:#fcf9ea; margin-bottom:30px; border-radius:25px 25px 25px 0; padding:25px 30px; box-sizing:border-box; font-size:1.1em; font-weight:500}

.about .map_txt {display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:40px}
.about .map_txt li {line-height:1.5; position:relative; padding-left:80px}
.about .map_txt li label {position:absolute; left:33px; top:0; font-weight:bold}
.about .map_txt li i {position:absolute; left:0; top:2px; color:#0d7cd2; font-size:1.2em}

/*느티나무*/
.zelkova .history {display:flex; padding:25px 0; box-sizing:border-box; position:relative}
.zelkova .history::before {content:''; width:2px; height:100%; background:#485cbb; position:absolute; top:0; left:20%; opacity:0.6; z-index:1}
.zelkova .history::after {content:''; width:100%; height:2px; background:#f4f4f4; position:absolute; bottom:0; left:0; z-index:-1}
.zelkova .history:last-child::after {display:none}
.zelkova .history.alc {align-items:center}
.zelkova .history .year {width:20%; font-size:2.8em; font-weight:bold; opacity:0.4; color:#485cbb}
.zelkova .history .txt {width:80%; position:relative; padding-left:30px; box-sizing:border-box}
.zelkova .history .txt li {position:relative; line-height:1.5; padding-left:100px}
.zelkova .history .txt li::before {content:''; width:7px; height:7px; border-radius:25px; background:#485cbb; position:absolute; top:45%; left:-29px; transform:translateX(-50%)}
.zelkova .history .txt li+li {margin-top:15px}
.zelkova .history .txt li label {position:absolute; top:0; left:0; color:#485cbb; font-weight:600}

.zelkova .bottom li {color:#777; line-height:1.5}
.zelkova .bottom li+li {margin-top:10px}

.zelkova .organization {text-align:center; padding:80px 30px; box-sizing:border-box; border:1px solid #777; border-radius:25px; position:relative}
.zelkova .organization::before {content:''; background:#dbdbdb; width:1px; height:26%; position:absolute; top:135px; left:50%; transform:translateX(-50%); z-index:-1}
.zelkova .organization::after {content:''; background:#dbdbdb; width:12%; height:1px; position:absolute; top:193px; left:56%; transform:translateX(-50%); z-index:-1}
.zelkova .organization .o1 {width:250px; padding:15px 30px; box-sizing:border-box; border-radius:10px; background:#339966; color:#fff; position:relative; margin:0 auto 100px}
.zelkova .organization .o2 {background:#555; color:#fff; border-radius:50px; padding:10px 60px; box-sizing:border-box; position:absolute; right:25%; top:170px}
.zelkova .organization .o3 {width:250px; background:#00cccc; color:#fff; padding:15px 30px; box-sizing:border-box; border-radius:10px; margin:0 auto 50px}
.zelkova .organization .o4 {display:flex; justify-content:space-evenly; margin-top:100px; position:relative}
.zelkova .organization .o4::before {content:''; width:61.5%; height:1px; background:#dbdbdb; position:absolute; top:-50px; left:50%; transform:translateX(-50%)}
.zelkova .organization .o4 > div {width:23%; padding:20px 30px; box-sizing:border-box; border-radius:25px; position:relative; background:#f7ffff; border:2px solid #bbf0f0}
.zelkova .organization .o4 > div::before {content:''; width:1px; height:51px; background:#dbdbdb; position:absolute; top:-52px; left:50%; transform:translateX(-50%); z-index:-1}
.zelkova .organization .o4 > div p {background:#6ed8d8; color:#fff; padding:7px; box-sizing:border-box; border-radius:20px; margin-bottom:20px}
.zelkova .organization .o4 > div > ul > li {line-height:1.5; padding-bottom:10px; box-sizing:border-box; border-bottom:1px dotted #dbdbdb}
.zelkova .organization .o4 > div > ul > li span {display:block; font-size:0.8em}
.zelkova .organization .o4 > div > ul > li+li {margin-top:10px}

.zelkova .procedure {padding:40px; box-sizing:border-box; border:1px solid #dbdbdb; border-radius:25px; text-align:center; font-size:0.8em}
.zelkova .procedure .b1 {width:15%; background:#e0f7fa; border:1px solid #888; border-radius:5px; margin:0 auto; padding:15px; box-sizing:border-box}
.zelkova .procedure .arrow_b {position:relative; margin-bottom:50px}
.zelkova .procedure .arrow_b.mb80 {margin-bottom:80px}
.zelkova .procedure .arrow_b::after {content:'▼'; position:absolute; bottom:-40px; left:49.9%; transform:translateX(-50%); font-size:0.9em}
.zelkova .procedure .arrow_b .fq::before {content:'예'; position:absolute; right:-20px; top:5px; font-size:0.8em}
.zelkova .procedure .arrow {position:absolute; left:50%; top:0; transform:translateX(-50%); width:1px; height:30px; background:#333}
.zelkova .procedure .b1 strong {display:block}
.zelkova .procedure .b2 {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; position:relative; margin:80px 0 25px}
.zelkova .procedure .b2 .b2_y {display:flex; justify-content:center; align-items:center; width:120px; height:120px; background:#fff3e0; transform:rotate(45deg); border:1px solid #888}
.zelkova .procedure .b2 .b2_y p {transform:rotate(-45deg)}
.zelkova .procedure .b2 .break {flex-basis: 100%; width: 100%; height: 0; /* 공간 차지 방지 */}
.zelkova .procedure .b2 .b2_y .left {position:relative}
.zelkova .procedure .b2 .b2_p {display:inline-block; background:#ffebee; border:1px solid #888; border-radius:5px; padding:10px 50px; box-sizing:border-box; position:absolute; top:50%; left:32%; transform:translate(-50%,-50%)}
.zelkova .procedure .b2 .b2_p::before {content:'\000a 아니요'; display: inline-block; white-space: pre-line; width:30px; height:1px; background:#333; position:absolute; right:-55px; top:50%; transform:translateY(-50%); font-size:0.8em}
.zelkova .procedure .b2 .b2_p::after {content:'◀'; position:absolute; right:-26px; top:50%; transform:translateY(-50%)}
.zelkova .procedure .b3 {width:15%; background:#ffebee; border:1px solid #888; border-radius:5px; margin:0 auto; padding:15px; box-sizing:border-box}
.zelkova .procedure .b3 strong {display:block}

.zelkova .program {display:flex; align-items:center; border:1px solid #dbdbdb; padding:0 40px 0 40px; box-sizing:border-box; border-radius:25px}
.zelkova .program .left {width:15%; font-size:1.6em; font-weight:bold; text-align:center; padding-right:40px; box-sizing:border-box; /*color:#399f86*/}
.zelkova .program .right {width:85%; margin-top:50px}

.zelkova .floor .photo_list {display:flex; flex-wrap:wrap; margin-left:-30px; margin-top:20px}
.zelkova .floor .photo_list li {width:calc(25% - 30px); margin-left:30px; text-align:center}
.zelkova .floor .photo_list li:nth-child(n+5) {margin-top:30px}
.zelkova .floor .photo_list li img {padding:5px; border:#dbdbdb solid 1px; border-radius:5px}
.zelkova .floor .photo_list li p {margin-top:10px}

.zelkova .sv .title {padding:30px; box-sizing:border-box; border-radius:70px; background:#fbfbfb; border:1px solid #dbdbdb; box-shadow:5px 5px 10px #eee; text-align:center; margin-bottom:40px; font-size:1.5em; font-weight:bold; font-family: 'SeoulNotice'}
.zelkova .sv .title strong {color:#0e3a6f; font-size:1.5em}
.zelkova .sv .title strong.yellow {color:#e09f2f}
.zelkova .sv .title span {color:#0d7cd2}
.zelkova p.bt {text-align:center; color:#666}

.zelkova .sv .vision {display:flex; flex-wrap:wrap; justify-content:center; margin-left:15px; margin-bottom:40px}
.zelkova .sv .vision li {width:280px; height:280px; border-radius:50%; border:solid 15px; border-color:#a1bfe3 #a1bfe3 #fedd7e #fedd7e; transform: rotate(-45deg); margin-left:-15px; text-align:center; position:relative; box-sizing:border-box}
.zelkova .sv .vision li:nth-child(odd) {border-color:#fedd7e #fedd7e #a1bfe3 #a1bfe3;}
.zelkova .sv .vision li > div {position:absolute; left:35%; top:35%; transform: translate(-25%, -25%) rotate(45deg); text-align:center; word-break:keep-all}
.zelkova .sv .vision li+li > div {left:calc(35% - 7px)}
.zelkova .sv .vision li > div p {font-size:30px; font-weight:700; margin-bottom:10px}
.zelkova .sv .vision li > div p span {color:#0d7cd2}

.zelkova .sv .value {display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:20px}
.zelkova .sv .value li {padding:20px; box-sizing:border-box; border:3px solid #f4f9ff; border-top:3px solid #0d7cd2; border-radius:20px}
.zelkova .sv .value li p {font-size:1.3em; font-weight:bold; margin-bottom:10px}
.zelkova .sv .value li p span {font-size:0.7em; color:#999; font-weight:400}

.zelkova .sv .key li {position:relative; font-weight:400; padding-left:35px; padding-bottom:10px; box-sizing:border-box; border-bottom:1px dotted #dbdbdb}
.zelkova .sv .key li+li {margin-top:10px}
.zelkova .sv .key li label {font-size:0.9em; width:23px; height:23px; border-radius:5px; position:absolute; top:0; left:0; background:#0d7cd2; color:#fff; padding:1px 6.5px; box-sizing:border-box}
.zelkova .sv .key li strong {margin-right:8px}

.zelkova .sv .slogan {text-align:center; font-size:3em; font-family: 'Bobaesomjindo'; margin-bottom:30px}
.zelkova .sv .slogan span {color: #0d7cd2}
.zelkova .sv .slogan span.red {color: #e72e2e}
.zelkova .sv .slogan_b {text-align:center; background:#f4f9ff; padding:30px; box-sizing:border-box}

.zelkova .sv .principles > li {font-size:1.2em; font-weight:bold}
.zelkova .sv .principles > li+li {margin-top:25px}
.zelkova .sv .principles > li > p {font-size:0.8em; font-weight:400; padding:20px; box-sizing:border-box; text-align:center; background:#f9f9f9; margin-top:20px; border-radius: 0 25px 25px 25px}
.zelkova .sv .principles > li > ul {display:grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr; gap:20px; margin-top:40px; margin-bottom:30px}
.zelkova .sv .principles > li > ul > li {font-size:0.8em; font-weight:400; position:relative; border:1px dotted #dbdbdb; border-radius:25px; padding:30px; box-sizing:border-box; text-align:center; word-break:keep-all}
.zelkova .sv .principles > li > ul > li > label {position:absolute; top:-15px; left:50%; transform:translateX(-50%); background:#0d7cd2; color:#fff; width:30px; height:30px; border-radius:25px; padding:3px; box-sizing:border-box}

.zelkova .sv .box {border:4px solid #eee; padding:30px; box-sizing:border-box}
.zelkova .sv .box span {display:block; text-align:center; margin-top:20px;  font-family: 'KimJeongCheolHandwriting'; font-size:1.1em; color:#555}

/*함께나누는행복*/
.divide .title {display:flex; align-items:center; justify-content:space-between; background:#fff0d9; border-radius:50px; font-family: 'OwnglyphYuntaeng'; font-size:2.2em; padding:0 40px 0 80px; box-sizing:border-box}
.divide .title .txt strong {color:#fc1111; font-size:1.3em}
.divide .title .txt span {color:#259afe; font-weight:600; font-size:1.3em}

.divide .tit_b {text-align:center; margin-bottom:50px; margin-top:30px}

.divide .how {display:grid; grid-template-columns:1fr 1fr; gap:20px}
.divide .how > li {display:flex; align-items:center; padding:30px 40px; box-sizing:border-box; border:1px solid #dbdbdb; border-radius:25px}
.divide .how > li .img {width:20%}
.divide .how > li .txt {width:80%}
.divide .how > li strong {display:block; font-size:1.3em; margin-bottom:10px; color:#0d7cd2}
.divide .how > li span {color:#999}
.divide .how > li > ul > li {position:relative; padding-left:10px}
.divide .how > li > ul > li::before {content:'·'; position:absolute; top:0; left:0}


/* 식단표 */
.calendar {margin-bottom:50px}
.calendar > p {margin-bottom:10px; display:flex; justify-content:center; align-items:center}
.calendar > p span {font-size:30px; font-weight:700}
.calendar > p span strong {color:#0d7cd2}
.calendar > p span,
.calendar > p a {margin-right:20px}
.calendar > p a:last-child {margin-right:0}
.calendar .Sun {color:#de3634}
.calendar .Sat {color:#477cd8}
.calendar > ul > li > div time em {float:right; font-size:14px}
.calendar > ul > li > div time p strong {font-weight:normal; margin-top:10px; display:inline-block}

.calendar > ul {display:table; width:100%; font-size:0px; margin-bottom:15px}
.calendar > ul > li {display:table-row; width:100%}
.calendar > ul > li > div {padding:5px; display:table-cell; width:14%; min-height:140px; height:140px;border-right:1px solid #ececf1; border-bottom:1px solid #ececf1; background:#fff}
.calendar > ul > li > div:last-child {border-right:0px;}
.calendar > ul > li.cal_header > div {height:30px; line-height:30px; min-height:0px; border-top:1px solid #dfd8c6; border-right:1px solid #dfd8c6; border-bottom:1px solid #dfd8c6; background:#fbfaf7; color:#777777; font-weight:bold; text-align:center; font-size:16px}
.calendar > ul > li.cal_header > div:last-child {border-right:0px}
.calendar > ul > li.cal_header > div.Sun {color:#cc2220}
.calendar > ul > li.cal_header > div.Sat {color:#2453a5}
.calendar > ul > li > div > time {display:block; padding:3px; min-height:15px;  font-size:14px}
.calendar > ul > li > div > time span {display:none;}
.calendar > ul > li > div > time p {font-weight:normal; margin-top:5px; color:#333; text-align:center; font-size:16px; padding-bottom:10px}
.calendar > ul > li > div > time p div {background:#F00}
.calendar > ul > li > div.today{background:#f4f4f4;}

.calendar .food {display:flex; padding-top:30px}
.calendar .food > div {width:20%; text-align:center; border-top:2px solid #0d7cd2; box-sizing:border-box}
.calendar .food ul li {padding:10px; box-sizing:border-box; border-bottom:#dbdbdb solid 1px; border-left:#dbdbdb solid 1px; min-height:347px; display:flex; text-align:center; justify-content:center; align-items:center}
.calendar .food ul li:first-child {background:#ebf2fb; min-height:30px; font-weight:700}
.calendar .food > div:first-child li {border-left:none}
.calendar .food ul li:nth-child(2) {line-height:2; padding:20px 10px}



/*회원메뉴*/
.member {font-size:16px}
.member .box {border:#e3e3e3 solid 1px; border-radius:10px; padding:20px; margin-bottom:30px}
.member p {margin-bottom:20px}
.member p.title {font-weight:600}
.member ul {margin-bottom:20px}
.member ul li ul {margin-top:10px}

.agree {border:1px solid #999; margin-bottom:40px; padding:20px; font-size:16px}
.agree .box {background:#f7f7f7; padding:20px; margin-bottom:20px; text-align:center}
.agree p {margin-bottom:20px}
.agree p.tit {font-weight:700; margin-bottom:20px}
.agree ul {margin-bottom:30px; margin-left:10px}
.agree ul li {font-size:16px}
.agree .check_box {text-align:center; margin-left:-20px}
.agree .check_box input {margin-left:20px}

.agree .btn {text-align:center; margin-left:-20px}
.agree .btn input {margin-left:20px}
.agree .np {padding-bottom:0; margin-bottom:0}

.member .box {border:#e3e3e3 solid 1px; border-radius:10px; padding:20px; margin-bottom:30px}
.member .txt1 {margin-left:20px; margin-bottom:40px}
.member .txt1 p {margin-bottom:20px}

.sub_page .btn_area {text-align:center; margin-left:-10px; font-size:0}
.sub_page .btn_area a,
.sub_page .btn_area input,
.sub_page .btn_area button {display:inline-block; margin-left:10px}



.popModal {display:none}
.popModal p.title {font-size:20px; font-weight:bold; padding-bottom:20px; margin-bottom:15px; border-bottom:2px solid #888888; width:95% !important}