@charset "utf-8";
/* CSS Document */
.box0{ width:94%; margin:0 auto}
.box1{ width:80rem; max-width: 92%; margin:0 auto}
.box1L{ margin-left:calc((100vw - 87.5rem) / 2)}
.box2{ width:75rem; margin:0 auto}
.box3{ width: 70rem; margin: 0 auto; max-width: 94%;}
.boxSub { box-sizing:border-box; width:1280px; margin:0 auto }

.gnb li.m_hide,
.gnb li.m_guide{ display:none}

body:not(.pop){ display:flex; flex-direction:column}
body:not(.isIE){ height:100vh}
#footer{ margin-top:auto}


.PC { display: block; }
.PHONE { display: none; }

@media screen and (max-width:64rem){
  .PC { display: none; }
  .PHONE { display: block; }
}

.headerL { padding-right: var(--headerQ)}
.headerT { padding-top: var(--headerQ); } 
.headerH { height: 5.5em}

.stickyT { position: sticky !important; top: var(--headerHS); } 


/* #header { position:fixed; left:0; top:0; width:100%; z-index:1000; box-sizing:border-box; transition: all .5s; background-color: #fff; } */
#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 10; box-sizing: border-box; transition: all .5s; box-shadow: 0 0 32px 0 rgba(13, 14, 15, 0.04); background: #fff;} 
#header .wrap_in .logoW { display: block; width: 14em; } 
#header .wrap_in .logoW img { width: 100%; /*filter: var(--crWhitefil); */}
#header .logo > a img { height: 100%; } 

#header .wrap_in .wrapH,
#header .wrap_in .gnb_wrap .dp1 { height: 4em; } 

html:not(.allOn) #header .wrap_in { align-items: center; height: var(--headerH); color: #111; transition: height .3s, background .3s; } 
html #header.allOn .wrap_in {height: auto; } 
html:not(.allOn) #header .wrap_in .gnb_wrap { display: flex; align-items: center; flex: 1; min-width: 0; justify-content: center; height: 100%; z-index: 1}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb { width: 100%; box-sizing: border-box;  justify-content: center;} 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb a { display: flex}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb .tt { white-space: nowrap}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li { position: relative; flex: 1; border-right: .0625rem solid transparent; max-width: 9em; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li:first-child { border-left: .0625rem solid transparent}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 { display: flex; align-items: center; justify-content: center}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .va { position: relative; box-sizing: border-box; overflow: hidden; text-align: center; padding-bottom: .25rem}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .va:before { content: attr(data-en); width: auto; height: auto; text-transform: uppercase}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .va:before,
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .tt { font-weight: 600; font-size: 1.05em; position: relative; box-sizing: border-box; display: flex; align-items: center; justify-content: center; transition: .3s; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .va:after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: .25rem; background: #fff; opacity: .5; transform: scaleX(0); transition: .3s}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .va { position: relative}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1:after { content: ""; position: absolute; top: -1.125rem; left: 0; width: 100%; height: .25rem; background: linear-gradient(90deg, var(--siteC2) 49%, var(--siteC) 50%);; transform: scaleX(0); } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li:hover .dp1,
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li.on .dp1 { color: var(--siteC2);}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li:hover .dp1:after,
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li.on .dp1:after { transform: scaleX(1); transition: .3s}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp1 .xi { display: none; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 { visibility: hidden; opacity: 0; z-index: -1; position: absolute; padding: 1em; background: var(--siteC2); width: 13em; left: 50%; transform: translateX(-50%); box-sizing: border-box; box-shadow: 0 1em 1em rgba(0, 0, 0, .1); border-radius: 0 3em 0 3em;} 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li { box-sizing: border-box}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a { padding: .25em 1em; justify-content: center; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .tt { font-size: .938em; color: rgba(255, 255, 255, .8); transition: .3s; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .tt:hover { color: #fff; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .arrow { display: none}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li.on .dp1 .va:after { transform: scaleX(1)}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp3 { display: none}

html:not(.allOn) #header .etc_wrap .lang_wrap {background: #f4f4f4; padding: .8em 1.4em; border-radius: 2em;}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang {position: relative;}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .lang_btn {color: rgba(0, 0, 0, .7);}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .lang_btn .tt {font-weight: 500;}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .lang_btn .xi {font-size: 16px;}

html:not(.allOn) #header .etc_wrap .lang_wrap .lang .drop {position: absolute; top: calc(100% + 0.5em); left: 0; width: 100%; height: 0; transition: 0.3s; overflow: hidden; background: rgba(255, 255, 255, .2); border-radius: .3125rem;}
html:not(.allOn) #header.active .etc_wrap .lang_wrap.on .lang .drop,
html:not(.allOn) #header.gnbOpen .etc_wrap .lang_wrap.on .lang .drop,
html:not(.allOn) #header .etc_wrap .lang_wrap.on .lang .drop:hover {background: var(--crWhite); border: .0625rem solid #eee;}
html:not(.allOn) #header .etc_wrap .lang_wrap.on .lang .drop {height: fit-content;}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .drop > li {}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .drop > li > a { padding: 0.5em; display: inline-block;}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .drop > li:hover > a {background: var(--crGray2);}
html:not(.allOn) #header .etc_wrap .lang_wrap .lang .drop > li > a .tt {font-size: 14px;}

#header .wrap_in .gnb_wrap .gnb > li .dp2 { flex-direction: column; gap: .5em}

#header .mem_wrap { display: flex; align-items: center; gap: 0 1.5em; background: #f4f4f4; padding: .6em 1em; border-radius: 3em; overflow: hidden;} 
#header .mem_wrap > .link { position: relative; display: flex; align-items: center; gap: .35em; font-size: .86em; font-weight: 600; color: rgba(0, 0, 0, .7); transition: .3s; } 
#header .mem_wrap > .link::before {position: absolute; right: -.9em; top: 50%; transform: translateY(-50%); width: .0625rem; height: 1em; background: rgba(0, 0, 0, .2); content: ''; }
#header .mem_wrap > .link:last-child:before {display: none;}
#header .mem_wrap > .link > .t1 { } 
#header .mem_wrap > .link:hover { color: rgba(0, 0, 0, 1); } 

#header .minmenu_wrap {gap: .3em; margin-right: .5em;}
#header .minmenu_wrap .link {background: var(--siteC); border-radius: 50%; width: 2.5em; height: 2.5em; color: #fff; position: relative;}
#header .minmenu_wrap .link .xi { font-size:1.25em; text-align: center;}
#header .minmenu_wrap .link .t1 { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: #fff; border: .0625rem solid var(--siteC3); border-radius: .25em; font-size: .750em; color: var(--siteC); text-align: center; width: 4.5em; height: 2em; line-height: 2em; display: none;}
#header .minmenu_wrap .link:hover .t1 { display: block; }

html.scroll:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li.on .dp1 { color: var(--siteBg3)}
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li:hover .dp2 { visibility: visible; opacity: 1; z-index: auto; transition: .2s; } 
html.scroll #header .box1 > .wrap_in { height: var(--headerHS); color: var(--crBlack); } 
html.scroll #header.allOn .box1 > .wrap_in{height: auto;}
html.scroll #header { background: #fff; } 
html.scroll #header .box1 > .wrap_in .logoW img { filter: none; } 
html.scroll #header .mem_wrap > .link { color: rgba(0, 0, 0, .7); } 
html.scroll #header .mem_wrap > .link:hover { color: rgba(0, 0, 0, .9); } 
html.scroll:not(.allOn):not(.up) #header { transform: translateY(-100%)}
html.scroll:not(.up) #header.allOn{ transform: translateY(0)}

html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 { color: var(--siteC)}
html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 .va:after { opacity: 1; transition: .3s}
html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp2 { visibility: visible; opacity: 1; z-index: auto; transition: .2s; } 

/* body.sub #header { background: #fff; box-shadow: 0 .125rem .625rem rgba(0, 0, 0, .1)}
body.sub #header .wrap_in { height: var(--headerH); color: var(--crBlack); } 
body.sub #header .mem_wrap > .link { color: rgba(0, 0, 0, .7); } 
body.sub #header .mem_wrap > .link:hover { color: rgba(0, 0, 0, .9); } 
body.sub #header .wrap_in .logoW img { filter: none; }  */
/* 
#header .all_wrap .all_layer { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: var(--crWhite); color: #111; transform: translateY(-80%); opacity: 0; visibility: hidden; transition: .3s; } 
#header .all_wrap .all_layer .all_header { } 
#header .all_wrap .all_layer .all_header .all_close .close_btn { position: fixed; top: 1.5em; right: 1.5em; } 
#header .all_wrap .all_layer .all_header .close_btn { display: flex; align-items: center; justify-content: center; width: 5em; height: 5em; background: var(--color-point2); color: var(--crWhite); border-radius: 50%; } 
#header .all_wrap .all_layer .all_header .close_btn .xi { font-size: 1.875em; transition: .3s; } 
#header .all_wrap .all_layer .all_header .close_btn:hover .xi { transform: rotate(180deg); } 

#header .all_wrap .all_layer .all_inner { flex: 1; opacity: 0; transition: .3s; } 
#header .all_wrap .all_layer .all_inner > .wrap_in { gap: 4em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img { display: flex; align-items: center; justify-content: center; width: 25%; height: 100vh; position: relative; padding: 0 5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .wrap_img_txt { position: relative; z-index: 10; gap: 1rem;} 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .wrap_img_txt > p { font-size: 2.5rem; color: #fff;} 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom { position: absolute; bottom: 3em; left: 3em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul { opacity: 0.8; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li { display: flex; font-size: 1.125rem; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li span:first-child { width: 3.5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li:first-child { margin-bottom: 1em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .logo { width: 12rem; filter:var(--crWhitefil);} 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(45deg, rgba(0, 0, 0, 0.5), transparent); } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_middle { width: 60%; height: 100vh; overflow-y: scroll; padding-top: 5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_middle::-webkit-scrollbar { display: none; } 
#header .all_wrap .all_layer .wrap_top .all_mem { gap: .5em; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in { height: 2.75em; padding: 0 2em; border: 1px solid rgba(255, 255, 255, .3); border-radius: 6em; transition: .2s; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in .tt { font-size: .938em; font-weight: 500; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in:hover { background: var(--color-point2); border-color: var(--color-point2); } 

#header .all_wrap .all_layer .wrap_middle .gnb { flex-wrap: wrap; flex-direction: column; padding-bottom: 20vh; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li { display: flex; justify-content: space-between; align-items: flex-start; flex: 1; padding: 3.5rem 2rem 3.5rem 2rem; box-sizing: border-box; border-left: 1px solid rgba(255, 255, 255, .1); border-bottom: 1px solid #ddd; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.m_performance .tt { width: 55%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li ul { display: flex; flex-wrap: wrap; padding: 0; width: 43vw; gap: 1em 2em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li ul.dp3 { padding-bottom: 1.5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li a { justify-content: flex-start; text-align: left !important; padding: .5em .5em 0.5em 0.5em;
 position: relative; } 
 #header .all_wrap .all_layer .wrap_middle .gnb > li a.layer{display: none;}

#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .in { display: flex; align-items: flex-end; gap: .5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt { font-size: 2em; font-weight: 700; color: #111; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .arrow { display: inline-block; margin-bottom: 1.175em; margin-left: 0.5em; width: .35em; height: .35em; background: var(--color-point2); border-radius: 50%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.act { background: rgba(0, 0, 0, .03); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.act .dp1 .tt { background-position: 0 100%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .in { display: inline-block; position: relative; } 

#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .tt { font-size: 1.188em; font-weight: 500; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .tt { color: var(--color-point2); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .in:after { transform: scaleX(1)}
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a { gap: 0 .5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a:before { content: "·"; color: rgba(0, 0, 0, .4); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a .tt { opacity: .7; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li.act > a .tt { text-decoration: underline; opacity: 1; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp4 { display: none; } 

#header .all_wrap .all_layer .wrap_bottom { display: none; } 

#header .all_wrap .all_layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateY(-100%);
    opacity: 0;
    visibility: hidden;
    transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
    z-index: 998;
    background: #fff;
} */

/* #header.allOn .box1 > .wrap_in{display: none;} */

#header.allOn .allBtn_wrap  { position: absolute; right: 45rem; top: 3.5rem;} 
#header .allBtn_wrap .all { } 
#header .allBtn_wrap .allBtn { position: relative; width: 24px; height: 24px; margin: 40px auto 0; z-index: 12; } 
#header .allBtn_wrap .allBtn .square_container { display: block; width: 100%; height: 100%; } 
#header .allBtn_wrap .allBtn .square_container .square { display: block; position: absolute; width: 6px; height: 6px; background: var(--siteC4); transition: all .25s ease; } 

#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+1):nth-child(-n+3) { top: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+4):nth-child(-n+6) { top: 9px; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+7):nth-child(-n+9) { bottom: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(3n) { right: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(2),
#header .allBtn_wrap .allBtn .square_container .square:nth-child(5),
#header .allBtn_wrap .allBtn .square_container .square:nth-child(7) { left: 9px; } 

#header.allOn .allBtn_wrap .allBtn .square_container { z-index: 99; } 
/* #header.allOn .allBtn_wrap .allBtn .square_container .square { background: #fff; }  */
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(2) { top: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(4) { left: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(6) { right: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(7) { bottom: 9px !important; } 


#header .etc_wrap{ gap: 1em;}

#header .allBtn_wrap { } 
#header .allBtn_wrap .all { } 
#header .allBtn_wrap .allBtn { position: relative; width: 24px; height: 24px; margin: 9px auto 0; } 
#header .allBtn_wrap .allBtn .square_container { display: block; width: 100%; height: 100%; } 
#header .allBtn_wrap .allBtn .square_container .square { display: block; position: absolute; width: 6px; height: 6px; background: #000; transition: all .25s ease; } 

#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+1):nth-child(-n+3) { top: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+4):nth-child(-n+6) { top: 9px; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(n+7):nth-child(-n+9) { bottom: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(3n) { right: 0; } 
#header .allBtn_wrap .allBtn .square_container .square:nth-child(2),
#header .allBtn_wrap .allBtn .square_container .square:nth-child(5),
#header .allBtn_wrap .allBtn .square_container .square:nth-child(7) { left: 9px; } 

#header.allOn .allBtn_wrap .allBtn .square_container { z-index: 99; } 
/* #header.allOn .allBtn_wrap .allBtn .square_container .square { background: #fff; }  */
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(2) { top: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(4) { left: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(6) { right: 9px !important; } 
#header.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(7) { bottom: 9px !important; } 

#header .allBtn .xi { font-size: 2em}
#header .allBtn .xi:before { content: "\e91c"}
#header .allBtn > .menuT { display: flex; justify-content: center; font-size: .85em; text-transform: uppercase; font-weight: 400; padding-top: 2em; color: #fff; } 
#header .all_wrap { display: flex; padding-top: var(--headerHS); width: 100vw; height: 100vh; background: #fff; position: absolute; right: 0vw; top: 0; visibility: hidden; transition: .5s;  z-index: 10; align-items: flex-start;} 
#header .all_wrap .wrap_container { display: flex; } 
#header .all_wrap .crHead { position: absolute; top: 0; left: 0; width: 100%; height: var(--headerHS); background: #fff; z-index: 99; transition: .5s; } 
#header .all_wrap .bg { position: relative; width: 35%; transition: .3s; } 
#header .all_wrap .bg .img { margin-top: 10vh; opacity: .1; filter: brightness(0) invert(1); width: 20vw}
#header .all_wrap .bg .bgImg { position: relative; width: 100%; height: 100%; transform: translateX(5em); opacity: 0; transition: .5s; } 
/* #header .all_wrap .bg .bgImg:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .2); content: ''; }  */
#header .all_wrap .bg .bgImg > img { width: 100%; height: 100%; object-fit: cover; } 
#header .all_wrap .wrap_in { position: relative; justify-content: center; opacity: 0; box-sizing: border-box; overflow-y: auto; width: 65%; height: 100vh; display: flex; transition: .5s; } 
#header .all_wrap .wrap_in > .in { padding: 3em 6em 9em 6em; box-sizing: border-box; } 

#header .all_wrap .wrap_in .all_top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2.5em; } 
#header .all_wrap .wrap_in .all_header { } 
#header .all_wrap .wrap_in .all_header .all_logo img { width: 12em; } 
#header .all_wrap .wrap_in .all_header .close_btn { width: 4.5em; height: 4.5em; background: rgba(0, 0, 0, .2); border-radius: 50%; } 
#header .all_wrap .wrap_in .all_header .close_btn .xi { font-size: 1.875em; transition: .3s; } 
#header .all_wrap .wrap_in .all_header .close_btn:hover .xi { transform: rotate(180deg); } 

#header .all_wrap .wrap_in .all_menu_wrap .telCon { display: flex; justify-content: end; margin-top: .75em; } 
#header .all_wrap .wrap_in .all_menu_wrap .telCon > .tt { font-size: 1.125em; font-weight: 600; padding: .8em 1.5em; box-sizing: border-box; border-radius: 100px; background: var(--siteC2); color: #fff; } 
#header .all_wrap .wrap_in .all_menu_wrap .telCon > .tt .dataLink {vertical-align: baseline;}

#header .all_wrap .wrap_in .all_top .all_mem { gap: .5em; } 
#header .all_wrap .wrap_in .all_top .all_mem .link { display: inline-flex; background: #f5f5f5; justify-content: center; align-items: center; height: 2.75em; padding: 0 2em; border: 1px solid rgba(255, 255, 255, .3); border-radius: 6em; transition: .2s; } 
#header .all_wrap .wrap_in .all_top .all_mem .link .t1 { font-size: .938em; font-weight: 500; } 
#header .all_wrap .wrap_in .all_top .all_mem .link:hover { background: var(--siteC4); border-color: var(--siteC4); color: #fff; } 

#header .all_wrap .wrap_in .gnb { flex-wrap: wrap; } 
#header .all_wrap .wrap_in .gnb > li { flex: 1 1 100%; align-items: center; display: flex; margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid rgba(0, 0, 0, .1); } 
#header .all_wrap .wrap_in .gnb > li:first-of-type { border-top: 1px solid rgba(255, 255, 255, .2); } 
#header .all_wrap .wrap_in .gnb > li:last-of-type { margin-bottom: 0em; padding-bottom: 0em; border: none; } 
#header .all_wrap .wrap_in .gnb > li ul { display: flex; gap: 1em; } 
#header .all_wrap .wrap_in .gnb > li a { justify-content: flex-start; text-align: left !important; padding: .5em; } 
#header .all_wrap .wrap_in .gnb > li .dp1 { width: 12em; } 
#header .all_wrap .wrap_in .gnb > li .dp1 .in { display: flex; align-items: flex-end; gap: .75em; } 
#header .all_wrap .wrap_in .gnb > li .dp1 .tt { font-size: 1.615em; font-weight: 800; } 
#header .all_wrap .wrap_in .gnb > li.act { } 
#header .all_wrap .wrap_in .gnb > li.act .dp1 .tt { background-position: 0 100%; } 
#header .all_wrap .wrap_in .gnb > li .dp2 > li > a .in { display: inline-block; position: relative; } 
#header .all_wrap .wrap_in .gnb > li .dp2 > li > a .in:after { content: ""; position: absolute; left: 0; bottom: -.25em; width: 100%; height: 2px; background: #fff; transform: scaleX(0); transform-origin: left bottom; transition: .2s; } 
#header .all_wrap .wrap_in .gnb > li .dp2 > li > a .tt { font-size: 1.063em; font-weight: 700; color: rgba(0, 0, 0, .45); transition: .1s; } 
#header .all_wrap .wrap_in .gnb > li .dp2 > li > a:hover .tt { color: var(--crBlack); } 
#header .all_wrap .wrap_in .gnb > li .dp2 > li.act > a .in:after { transform: scaleX(1)}
#header .all_wrap .wrap_in .gnb > li .dp3 { display: none; } 
#header .all_wrap .wrap_in .gnb > li .dp3 > li > a { gap: 0 .75em; } 
#header .all_wrap .wrap_in .gnb > li .dp3 > li > a:before { content: ""; width: 4px; height: 2px; background: rgba(255, 255, 255, .4); } 
#header .all_wrap .wrap_in .gnb > li .dp3 > li > a .tt { opacity: .7; } 
#header .all_wrap .wrap_in .gnb > li .dp3 > li.act > a .tt { text-decoration: underline; opacity: 1; } 
#header .all_wrap .wrap_in .gnb > li .dp4 { display: none; } 

#header .all_wrap .all_layer .wrap_bottom { display: none; } 

#header.allOn { } 
#header.allOn .allBtn .xi:before { content: "\e9af"}
#header.allOn .all_wrap { visibility: visible; } 
#header.allOn .all_wrap .wrap_in { opacity: 1; } 
/* #header.allOn .fix_wrap { background: rgba(0,0,0,.75); } 
#header.allOn .mem_wrap .logBtn .tt { color: #fff; } 
#header.allOn .mem_wrap .logBtn .ico { font-size: 1.6em}
#header.allOn .mem_wrap .logBtn .tt .point { }
#header.allOn .mem_wrap .logBtn .arrow { font-size: 1em; transition: .3s} */
#header.allOn .all_wrap .crHead { background: rgba(0,0,0,.75); } 
#header.allOn .all_wrap .bg .bgImg { transform: translateX(0); opacity: 1; } 
/* #header.allOn .bottom_wrap .link .tt { color: #fff; } */


.allGnbOn { overflow-y: hidden; } 
.allGnbOn #header .all_wrap .all_layer { transform: translateY(0); opacity: 1; visibility: visible; } 
.allGnbOn #header .all_wrap .all_layer .all_inner { opacity: 1; transition-delay: .4s; } 


#header .top_wrap .all.on .all_btn .in { width:2.5rem; height:2.5rem; z-index:999999999; } 
#header .top_wrap .all.on .all_btn .ham { background:transparent; transition:0s; } 
#header .top_wrap .all.on .all_btn .ham:before,
#header .top_wrap .all.on .all_btn .ham:after { width:100% !important; top:50% !important; margin-top:auto; background: #fff; } 
#header .top_wrap .all.on .all_btn .ham:before { transform:rotate(45deg); } 
#header .top_wrap .all.on .all_btn .ham:after { transform:rotate(-45deg); } 
#header .top_wrap .all.on .siteBg { transform: translate(-50%,-50%) scale(100) } 

/*기존퀵메뉴디자인*/
/* #quick { position: fixed; right: 2.5%; top: 25%; z-index: 999; padding: 1.5em 0 0; overflow: hidden; background: #fff; text-align: center; border-radius: .5em; box-shadow: 0 0 32px rgba(13, 14, 15, 0.06);  border: .125rem solid transparent; box-sizing: border-box;}
#quick::before {content: ""; position: absolute; inset: 0; border-radius: inherit; padding: .125rem; background: linear-gradient(90deg, var(--siteC2) 0%, var(--siteC) 100%); z-index: 0; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor;mask-composite: exclude;}
#quick .list {width: 6.5em; margin-bottom: 1em;}
#quick .list li {width: 100%; margin-bottom: 1em;}
#quick .list li:last-child {margin-bottom: unset;}
#quick .list li .in {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; text-align: center;}
#quick .list li .in .icon {display: flex; align-items: center; justify-content: center; position: relative; width: 2.5em; height: 2.5em; border-radius: 100%; background-color: var(--siteC); color: #fff;}
#quick .list li:hover .in .icon {background: var(--siteC2); color: #fff; }
#quick .list li .in .tt {font-size: .7em; font-weight: 600; line-height: 1.5em; letter-spacing: -0.0325rem; margin-top: .5em;}
#quick .goTop {background: var(--siteC2); width: 100%; height: 100%; padding: .3em 0; text-align: center; line-height: 3em; color: #fff; z-index: 10; position: relative;}
#quick .goTop:hover {background: var(--siteC3); color: #555;} */

#quick { position: fixed; right: 1.875rem; bottom: 9rem; display: flex; flex-direction: column; align-items: center; z-index: 8;}
#quick .list { position: relative; background: #fff; border-radius: 1.875rem; padding: 1.25rem .5rem; margin-bottom: 1.1875rem; box-shadow: 0 .625rem 1.875rem rgba(0,0,0,0.15); opacity: 0; transform: translateY(20px); pointer-events: none; transition: 0.3s; border: 2px solid var(--siteC2); display: none;}

#quick .list::before{ content: ""; position: absolute; bottom: -0.875rem; left: 50%; transform: translateX(-50%); border-width: .875rem .75rem 0 .75rem; border-style: solid; border-color: var(--siteC2) transparent transparent transparent;}
#quick .list::after{ content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); border-width: .75rem .625rem 0 .625rem; border-style: solid; border-color: #fff transparent transparent transparent;}
#quick.active .list { opacity: 1; transform: translateY(0); pointer-events: auto; display: block;}
#quick .list li { text-align: center; margin: .75rem 0;}
#quick .icon i { display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; font-size: 1.25rem; color: #fff; border: 1px solid var(--siteC); border-radius: 50%; margin: 0 auto; background: var(--siteC);}
#quick .tt { font-size: .75rem; margin-top: .3125rem;}
.quickBtn { width: 60px; height: 60px; border-radius: 50%; background: #fff; border: none; display: flex; align-items: center; justify-content: center; font-weight: bold; box-shadow: 0 1px 11px rgba(29,110,180); cursor: pointer; font-size: .8rem;}
#quick.active .quickBtn { font-size: 0;}
#quick.active .quickBtn::after { content: "\e921"; font-family: "xeicon"; font-size: 1.25rem;}

/*  */
#contents{ margin-top: var(--headerH);}
#contents .sub_top_wrap { box-sizing: border-box; display: flex; flex-direction: column;} 
#contents .sub_top_wrap .wrap_con { display: flex; flex-direction: column; z-index: 2;}
#contents .sub_top_wrap .wrap_con .nav_wrap { flex: 1 1 0%; min-height: 0}
#contents .sub_top_wrap .wrap_con .nav_wrap .wrap_in { height: 100%; box-sizing: border-box; display: flex; align-items: flex-end; padding: 1.5em 0}
#contents .sub_top_wrap .wrap_con .nav_wrap .wrap_in .in { display: flex; gap: 1em; justify-content: space-between; align-items: flex-end}
#contents .sub_top_wrap .wrap_con .nav_wrap .tit { display: flex; flex-direction: column; gap: 1.215em 0; } 
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t1 { font-weight: 700; font-size: 1.25em; text-transform: uppercase; padding-left: .25em}
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t2 { font-weight: 800; font-size: 2em;}
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t2_wrap { overflow: hidden; line-height: 1.1}
#contents .sub_top_wrap .wrap_con .nav_wrap .nav { display: flex; align-items: center;}
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li { text-transform: uppercase; color: rgba(0, 0, 0, .3); font-weight: 600; font-size: .95em; display: flex; align-items: center; } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li:not(.home):before { width: .25rem; height: .25rem; background: rgba(0, 0, 0, .15); border-radius: 50%; content: ''; margin: 0 .75em}
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li.home { } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li:last-of-type { color: var(--crBlack); } 
#contents .sub_top_wrap .wrap_con .menu_wrap { position: relative; width: 100%}
#contents .sub_top_wrap .wrap_con .menu_wrap:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing: border-box; border: .0625rem solid #eee; border-left: none; border-right: none}
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb { display: block; position: relative; }
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2{justify-content: center;}
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2 > li > a { height: 4em; padding: 0 2em; color: #777}
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2 > li.on > a,
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2 > li:hover > a { color: var(--siteC2); background: #f1f1f1;}
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2 > li > a .tt { font-weight: 600; font-size: 1.05em;}
#contents .sub_top_wrap .wrap_con .menu_wrap .gnb > li .dp2 > li .dp3 { display: none; } 
#contents .sub_top_wrap .visual_wrap { height:calc(var(--vh, 1dvh) * 25); position: relative; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; background: #000}
#contents .sub_top_wrap .visual_wrap .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: .3s; } 
#contents .sub_top_wrap .visual_wrap .slogan { position: relative}
#contents .sub_top_wrap .visual_wrap .slogan .t1 { font-weight: 700; font-size: 2.25em; line-height: 1.3; color: #fff}
/* .load #contents .sub_top_wrap .wrap_con .nav_wrap .tit .t1 { letter-spacing: 0; opacity: 1; transition: 1s}
.load #contents .sub_top_wrap .wrap_con .nav_wrap .tit .t2 { transform: translateY(0); transition: 1s}
.load #contents .sub_top_wrap .wrap_con .nav_wrap .nav { opacity: 1; transition: 2s} */
.scroll #contents .sub_top_wrap .visual_wrap .bg { opacity: .9}

.dp1_member #contents .sub_top_wrap {display: none;}

#contents .sub_top_wrap2 {}
#contents .sub_top_wrap2 .gnb {margin-top: 3em; overflow: hidden;}
#contents .sub_top_wrap2 .gnb > li,
#contents .sub_top_wrap2 .gnb .dp2 > li,
#contents .sub_top_wrap2 .gnb .dp3 {width: 100%;}
#contents .sub_top_wrap2 .gnb .dp3 > li {flex: 1;}
#contents .sub_top_wrap2 .gnb .dp3 > li > a {padding: 1em;}
#contents .sub_top_wrap2 .gnb .dp3 > li.on > a,
#contents .sub_top_wrap2 .gnb .dp3 > li:hover > a { color: #fff;}
#contents .sub_top_wrap2 .gnb .dp3 > li > a .va {}

.mouse-ico { position: absolute; left: 0; bottom: 3em; width: 100%; z-index: 10; text-align: center; } 
.mouse-ico .xi { color: var(--crWhite); font-size: 40px; animation: mouseAni 1s infinite alternate; } 
@keyframes mouseAni { 
 0% { transform: translateY(0%); } 
 100% { transform: translateY(50%); } 
 }

.dp1on .gnb .dp2 { display: none !important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1 { display: none !important}
.dp2on .gnb > li.on { display: block !important}
/* .dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a { display: none !important} */
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on { display: block !important}

#contents .dp3on{ padding:1.875em 0 3em 0;}
#contents .dp3on .gnb > li .dp1,
#contents .dp3on .gnb > li .dp2 > li > a{ display:none;}
#contents .dp3on .gnb > li .dp2 > li{display: none;}

#contents .dp3on .gnb,
#contents .dp3on .gnb > li .dp2,
#contents .dp3on .gnb > li.on,
#contents .dp3on .gnb > li .dp2 > li.on{ display:block;}
#contents .dp3on .gnb > li .dp3{ flex-wrap:wrap; }
#contents .dp3on .gnb > li .dp3 > li{ flex:1 1 25%; max-width:25%; text-align: center;}
#contents .dp3on .gnb > li .dp3 > li > a{ display: flex; justify-content: center; align-items: center; height:3.5em; margin:0 0 .625em .625em; padding:.5em .5em; box-sizing: border-box; background:#fff; border:.0625rem solid #d4d5d8; border-radius:.375rem; color:#111; font-weight:600; transition:.2s;}
#contents .dp3on .gnb > li .dp3 > li:hover > a,
#contents .dp3on .gnb > li .dp3 > li.on > a{  box-shadow:0 .1875rem .375em rgba(0,0,0,.1); color: #fff; background: var(--siteC);}
#contents .dp3on .gnb > li .dp3 > li.on > a{ font-weight:700;}
#contents .dp3on .gnb > li.m_mypage .dp2 > li.sm_print .dp3 > li,
#contents .dp3on .gnb > li.m_mypage .dp2 > li.sm_eduList .dp3 > li{ flex:1 1 33.33%; max-width:33.33%;}
#contents .dp3on .gnb > li.m_mypage .dp2 > li.sm_eduTime .dp3 > li > a {padding:.5em 1em;}

#contents .doc{ padding:3.5em 0 8em 0}
.dp1_member #contents .doc {}


#contents .pageTopWrap{ position:relative;}
#contents .pageTopWrap .wBg{ /* position:absolute; left:0; top:0; width:100%; height:100%; background-color:var(--siteC); opacity:.05 */}
#contents .pageTopWrap .wBg.obj{ background-color:transparent; background-size:110vw auto}
#contents .pageTopWrap .wTop{ position:relative}
#contents .pageTopWrap .wTop .wrapF{display:flex; gap:1em 3em; flex-direction: column;}
#contents .pageTopWrap.main .wrapF{}

/*** FOOTER **********/
.memBannerSlider_wrap { padding: 1em 0em; border-top: .0625rem solid #ddd; background: #fff;} 
.memBannerSlider_wrap .inner { gap: 1em 2em; overflow: hidden;} 
.memBannerSlider_wrap .tit_wrap { gap: 0 2em; } 
.memBannerSlider_wrap .tit_wrap .tit { gap: 1em; } 
.memBannerSlider_wrap .tit_wrap .tit .tt { font-size: 1.125em; font-weight: 800; } 
.memBannerSlider_wrap .tit_wrap .tit .xi { font-size: 1.500em; color: var(--siteC); transition: .2s; } 
.memBannerSlider_wrap .tit_wrap .tit:hover { color: var(--siteC); } 
.memBannerSlider_wrap .tit_wrap .tit:hover .xi { transform: rotate(180deg); } 
.memBannerSlider { flex: 1; padding-right: .25rem; } 
.memBannerSlider .el .in { height: 4.65em; overflow: hidden; } 
.memBannerSlider .el .in > img{ width: 100%; height: 100%; object-fit: contain;}
.memBannerSlider .el .in { height: 3.25em; overflow: hidden; } 

.swiperControl.st1 { gap: 1em; } 
.swiperControl.st1 .total { gap: .5em; font-size: .938em; } 
.swiperControl.st1 .total > span.swiper-pagination-current { font-size: 1.125em; color: var(--siteC); font-weight: 900; } 
.swiperControl.st1 .control { border: .0625rem solid #ddd; border-radius: 6em; overflow: hidden; } 
.swiperControl.st1 .control .swiperBtn.btn { width: 2em; height: 2em; } 
.swiperControl.st1 .control .swiperBtn.btn:hover { background: var(--siteC2); color: #fff; } 

/* titler */
.titler{ display: flex; justify-content: center;text-align: center; line-height: 32px; font-weight: 800; font-size: 23.2px; width: 100%;}
.titler p{ color: var(--siteC2); font-weight: 800;}

/* 기관 소개 */
.company_wrap{box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08); border-radius: 2em; padding: 3em 0 0 0;}
.institution{ width: 61.125rem; margin: 0 auto;  position:relative; padding-bottom:7em; }
.institution .wrap_con{ width:53%; background:#ffffff73; position:relative; z-index:1; box-sizing:border-box; margin:0 auto; line-height: 32px; border-radius: 2em; margin-top: 2em;} 
.institution .wrap_con p{ font-size: 1.125rem;}
.institution .wrap_con p span{ font-weight: 600; font-size: 1.375em; color: #333;}
.institution .wrap_con .mission_txt{ margin-bottom: 1em;}
.history_wrap { display:flex; align-items:flex-start; position:relative; padding:4em 0 1em 0 } 
.institution_img{ position: relative;}
.vision_img{ position: absolute; left: 6.3125rem; top: -0.625rem;}
.mission_img{ position: absolute; right: 6.625rem; top: 3.5rem;}
.institution_img img{ max-width: 14.4375rem;}
/* 연혁 */

/* .historyWrapper .history{display:flex; gap:4em; padding: 5em 0 0;}
.decadeNav{ width:15em; margin-left: 5em;}
.decadeItem{ cursor:pointer; padding: 1.875em .625em; margin-bottom: 1.25em; background:#bdcddb; border-radius:10px; font-weight:600; transition:.3s; font-size: 1.5em;}
.decadeItem.active{background:var(--siteC2);color:#fff}
.hisWrap{flex:1}
.his{display:none}
.his.active{display:block}
.his .decade{ font-size: 32px;font-weight:700;margin-bottom:20px}
.his ul li{ margin-bottom: .9375rem; line-height: 2.3em;}
.his .year{ font-weight: 700; color:var(--siteC2); margin-bottom:5px; font-size: 1.4em;}
.his .tt{ font-size: 1.15em;} */

.history{ position: relative;}
.historyWrapper .history{position: relative; display:flex; gap:80px; padding: 3em 0 0 0;}
.decadeNav{width:260px}
.decadeItem{cursor:pointer;height:140px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;background:#96b2ca;color:#fff;font-size:22px;font-weight:700;border-radius:10px;transition:.3s}
.decadeItem.active{background:var(--siteC2);}
.wrap_con{flex:1; position:relative; z-index: 1;}
.historyGroup{display:none;position:relative;padding-left:60px}
.historyGroup.active{display:block}
.hObj{position:relative;margin-bottom:50px; z-index: 1; }
.hObj:before{content:"";position:absolute;left:-42px;top:8px;width:10px;height:10px;background:var(--siteC2);border-radius:50%}
.year{ font-size:1.75em; font-weight:700; margin-bottom:1.25em;}
.liSt li{ display:flex; margin-bottom: 2.3125rem; font-size: 1.2em;}
.month{width:50px;font-weight:600;color:var(--siteC2);}
.con{flex:1}
.linewrap{position:absolute; left: 28.3%; top: 0; width: 2px; height: 0;background:var(--siteC); z-index:0; }

/* 조직도 */




.organize{
            background-color: #fff;
            padding: 40px 20px;
            display: flex;
            justify-content: center;
        }

        .chart-container {
            width: 100%;
            max-width: 1200px;
            text-align: center;
        }

        /* 공통 노드 스타일 */
        .node {
            display: inline-block;
            border-radius: 6px;
            color: #fff;
            font-size: 14px;
            font-weight: bold;
            padding: 12px 20px;
            min-width: 150px;
            vertical-align: top;
        }

        /* 최상위 재단 */
        .top-foundation {
            background-color: #0b58a2;
            margin-bottom: 30px;
        }

        /* 카프이용센터 & 운영위원회 라인 영역 */
        .center-row {
            position: relative;
            margin-bottom: 40px;
            display: inline-block;
            width: 100%;
        }

        .center-node {
            background-color: #0b58a2;
            padding: 15px 30px;
        }

        /* 운영위원회 위치 세팅 */
        .committee-wrapper {
            position: absolute;
            left: calc(50% + 104px);
            top: 4px;
            display: flex;
            align-items: center;
        }

        .committee-line {
            width: 40px;
            height: 2px;
            background-color: #ddd;
        }

        .committee-node {
            background-color: #0b58a2;
            min-width: 130px;
        }

        /* 수직 연결선 (가운데 기둥) */
        .center-row::after {
            content: '';
            position: absolute;
            bottom: -40px;
            left: 50%;
            width: 2px;
            height: 40px;
            background-color: #ddd;
        }

        /* 하위 프로그램 대형 그리드 */
        .program-grid {
            display: flex;
            justify-content: space-between;
            position: relative;
            padding-top: 30px;
        }

        /* 하위 대형 가로선 */
        .program-grid::before {
            content: '';
            position: absolute;
            top: 0;
            left: 8.5%;
            right: 8.5%;
            height: 2px;
            background-color: #ddd;
        }

        .program-column {
            position: relative;
            width: 17%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* 각 컬럼으로 떨어지는 수직선 */
        .program-column::before {
            content: '';
            position: absolute;
            top: -30px;
            left: 50%;
            width: 2px;
            height: 30px;
            background-color: #ddd;
        }
        .program-column:not(.split-column)::after {
    content: '';
    position: absolute;
    top: 48px; /* program-main 박스 높이와 밸런스 맞춤 */
    left: 50%;
    width: 2px;
    height: 25px; /* 박스 사이 간격을 채우는 선 길이 */
    background-color: #ddd;
    z-index: 0;
}

        /* 메인 프로그램 타이틀 상자 */
        .program-main {
            background-color: #4c92df;
            width: 100%;
            padding: 15px 10px;
            margin-bottom: 25px;
            z-index: 1;
        }
        .liNe::after{ }
        /* 하위 세부 내용 설명 상자 */
        .program-sub {
            background-color: #5a8cb3;
            width: 100%;
            min-height: 140px;
            padding: 15px 10px;
            font-size: 14px;
            font-weight: normal;
            line-height: 1.5;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
        }

        /* 마지막 상담 컬럼 전용 수직선 세팅 */
        .program-column.split-column::after {
            content: '';
            position: absolute;
            top: 48px;
            left: 50%;
            width: 2px;
            height: 29px;
            background-color: #ddd;
        }

        /* 마지막 컬럼 내부 2개 분기용 가로선 */
        .sub-split-line {
            width: 69%;
            height: 2px;
            background-color: #ddd;
            margin-top: 2px;
            margin-bottom: 15px;
        }

        /* 마지막 컬럼 내부 2단 분기 박스 레이아웃 */
        .sub-box-group {
            display: flex;
            justify-content: space-between;
            width: 115%;
            position: relative;
        }

        .sub-box-group::before {
            content: '';
            position: absolute;
            top: -15px;
            left: 47px;
            width: 2px;
            height: 15px;
            background-color: #ddd;
        }

        .sub-box-group::after {
            content: '';
            position: absolute;
            top: -15px;
            right: 47px;
            width: 2px;
            height: 15px;
            background-color: #ddd;
        }

        .split-sub-node {
            background-color: #5a8cb3;
            width: 36%;
    min-width: 1%;
    max-width: 46%;
            min-height: 70px;
            padding: 10px 5px;
        }

/* 이용안내 */

.titler1{ font-size: 32px; font-weight: 800; line-height: 2.8;}
.titler2{ font-size: 1.25em; font-weight: 600; margin-bottom: 32px;}

.page_txt_wrap.st3 { border-top:.0625rem solid #000; }
.page_txt_wrap.st3 > .innerSec { padding:0 0; background:#fff; border-bottom:.0625rem solid #e5e5e5; }
.page_txt_wrap.st3 > .innerSec > .wrap_tit,
.page_txt_wrap.st3 > .innerSec > .wrap_con { padding:2.5em 1.5em; }
.page_txt_wrap.st3 > .innerSec > .wrap_con ul li .in p{ font-size: 1.05em; line-height: 2em;}
.page_txt_wrap.st3 > .innerSec.flex > .wrap_tit {display: flex; align-items: center; width: 14em; min-width: 1em; max-width: 20em; position:relative; text-align: center;}
.page_txt_wrap.st3 > .innerSec.flex > .wrap_tit:before { content:""; position:absolute; top:-0.0625rem; left:0; width:100%; height:.0625rem; background:var(--siteC2); }
.page_txt_wrap.st3 > .innerSec.flex > .wrap_con{ display: flex;}
.page_txt_wrap.st3 > .innerSec:nth-child(5) > .wrap_con{padding: 0;}

.page_box_list.st1 { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center;}
.page_box_list.st1 .item { flex: 1; min-width: 12.5rem; display: flex; flex-direction: column; align-items: center; position: relative;}
.page_box_list.st1 .item::before{ content:"\e93e"; font-family:xeicon; position:absolute; left:0; top:50%; transform:translateY(-50%); font-size:1.750em; color:#1d6eb4;}
.page_box_list.st1 .item:first-child::before{display: none;}
.page_box_list.st1 .item img { display: block; width: 35%; height: auto; margin-bottom: .625rem; }
.page_box_list.st1 .item:first-child img{ margin-left: 1.5em;}
.page_box_list.st1 .item p { margin: 0; text-align: center; width: 100%; color: var(--siteC2); font-weight: 800;}


/* 찾아오시는 길 */
.flex_box .fst2 > li { max-width: 50%; flex: 1 1 50%;}
.map_list { display: grid; grid-template-columns: repeat(4, 1fr); } 
.map_list > li { flex:1; text-align:center; } 
.map_list > li .in { flex:1; } 
.map_list > li + li .in { padding-left:1em; border-left:1px solid #ddd; } 

.map_list .page_txt .mark { margin-bottom:3em; } 
.map_list .page_txt .mark img { width:5em; } 

.map_list .page_txt .tit { font-size: 1.125em; font-weight: 700; } 
.map_list .page_txt > .ico + * { margin-top:1em; } 
.map_list .page_txt > .ico img { width:2.25em; } 

.map_wrap { position: relative; width: 100%;} 
.map_wrap #daumRoughmapContainer1775456272223 { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}
.map_wrap .w100 { width: 100%; } 
.map_wrap .cont { display: none; } 

.loc_park_loc{ display: flex; align-items: start; gap: 1rem; width: 100%; border: 1px solid #ddd; padding: 2rem; box-sizing: border-box;}
.loc_park_loc > .parkImg{ width: calc((100% - 1rem) / 2);}
.loc_park_loc > .parkImg > img{ width: 100%; height: 100%; object-fit: contain;}

.root_daum_roughmap { width: 100% !important;}
.root_daum_roughmap .wrap_map { width: 100% !important;}

.locWrap { margin-top: 4em; } 
.locWrap .locList { } 
.locWrap .locList > li { } 
.locWrap .locList > li.w100 { flex: 1 1 100%; max-width: 100%; } 
.locWrap .locList > li > .in { margin: 0 0 3em 1em; } 
.locWrap .locList > li > .in > .iconWrap { display: flex; gap: 1em; align-items: center; margin-bottom: 1.5em; border-bottom: 1px solid var(--siteC2); } 
.locWrap .locList > li > .in > .iconWrap > .tt { font-size: 1.315em; font-weight: 600; line-height: 1; } 
.locWrap .locList > li > .in .icon { position:relative; top: 1px; display: flex; align-items: center; justify-content: center; width: 3.5em; height: 3.5em; color: #fff; background: var(--siteC2); } 
.locWrap .locList > li > .in > .info { padding-left: 1em; } 
.locWrap .locList > li > .in > .info > li { margin-bottom: .5em; } 
.locWrap .locList > li > .in > .info > li > .con.div { } 
.locWrap .locList > li > .in > .info > li > .con.div .tt { display: flex; align-items: start; gap: .25rem; } 
.locWrap .locList > li > .in > .info > li > .con.div .tt span strong{ font-weight: 800;}
.locWrap .locList > li > .in > .info > li .memo { padding: 1.5rem; background: #f7f7f7; display: flex; align-items: start; gap: .25rem; } 
.locWrap .locList > li > .in > .info > li .memo > .xi { position:relative; top: -0.2rem; color: var(--siteC); } 
.locWrap .locList > li > .in > .info > li .memo > .desc { font-size: .936em; line-height: 1.4; color: #171717; } 
.locWrap .locList > li > .in > .info > li:last-of-type { margin-bottom: 0; } 
.locWrap .locList > li > .in > .info .con > .tt { font-size: 1.063em; font-weight: 400; line-height: 1.6; } 
.locWrap .locList > li > .in > .info .con > .tt > i,
.locWrap .locList > li > .in > .info .con > .tt > b { vertical-align: baseline; } 
.locWrap .locList > li > .in > .info .con > .tt > .round { display: inline-flex; align-items: center; justify-content: center; height: 1.84em; line-height: 1.6; font-size: .864em; border-radius: 100px; padding: 0 .75em; margin-right: 5px; } 
.locWrap .locList > li > .in > .info .con > .tt > .round.orange { background: #ff7d21; color: #fff; width: 3em;}

/* 프로그램소개 > 공통체/생활철학 */
/*프로스램소개 공통*/
.proGram { font-size: 2.5rem; font-weight: 700; color: #333; letter-spacing: -0.0625rem; margin-bottom: 1.25rem; animation: fadeUp 0.7s ease both; width: 100%; text-align: center;}
.proGram:after{ content:''; position:absolute; top:5.5rem; left:50%; transform:translateX(-50%); width:224px; height:2px; background:var(--siteC);}

.program_wrap .care_title{ text-align:center; margin-bottom:3.75rem; position:relative;}
.program_wrap .care_title .title_label{ display:block; font-size: 14px; color:var(--siteC); font-weight:600; letter-spacing:.125rem; text-transform:uppercase; margin-bottom:.625rem;}

.programA_wrap{margin-bottom: -8em;}
.programA_wrap .care_wrap{ margin-bottom:6.25rem;}

.programA_wrap .care_title h1{ font-size:2.625em; font-weight:700; color:#333; margin:0; position:relative; display:inline-block;}
.programA_wrap .care_title h1:after{ content:''; position:absolute; bottom:-0.9375rem; left:50%; transform:translateX(-50%); width:3.75rem; height:.1875rem; background:var(--siteC);}

.programA_wrap .care_content{ display:flex; gap:3.125rem; align-items:flex-start;}
.programA_wrap .care_wrap:first-child .care_content{ flex-direction:row-reverse;}
.programA_wrap .careT{ flex:1;}
.programA_wrap .careImg{ width:36%; flex-shrink:0; top:6.25rem;}
.programA_wrap .careImg img{ width:100%; height: 34em; border-radius:1.25rem; box-shadow:0 .9375rem 2.5rem rgba(0,0,0,.15); transition:.4s;}
.quote_box{ background: #9ac2e4; padding:1.5rem; border-radius:.9375rem; margin-bottom:1.875rem; position:relative; box-shadow: 0 .625rem 1.875rem rgb(102 173 234 / 30%);}
.quote_box:before{ content:'"'; position:absolute; top: .225rem; left:1.25rem; font-size:5rem; color:rgba(255,255,255,.2); font-family:Georgia,serif; line-height:1;}
.quote_text{ font-size:1.25rem; line-height:1.7; color:#fff; font-weight:500; margin:0; position:relative; z-index:1;}
.content_text{ background:#f8f9fa; padding:2.1875rem; border-radius:.9375rem; border-left:.25rem solid #9ac2e4; margin-bottom: 4em;}
.content_text .txt{ font-size:1rem; line-height:1.9; color:#555; margin-bottom:1.25rem; text-align:justify;}
/* 생활철학 */
.full{ width: 100vw; margin-left: calc(50% - 50vw); background: #829bb042;}
.care_wrap .care_principles{ padding: 4em 19em;}
.care_wrap .cont { position: relative; }

.care_wrap .cont .step_wrap { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 2em; align-items: center; opacity: 1;}
.care_wrap .inner{ max-width: 900px; margin: 0 auto;}
.care_wrap .cont .step_wrap + .step_wrap { margin-top: 2em; }
.care_wrap .cont .step_wrap .label { position: relative; width: 4rem; height: 4rem; line-height: 4rem; font-size: 1.4em; font-weight: 600; color: var(--siteC2); background-color: #fff; border-radius: 2em; text-align: center; z-index: 0;}
.care_wrap .cont .step_wrap .step { display: flex; align-items: center; justify-content: center; padding: 1.5em 2em; border-radius: 7rem; background-color: #5f86bf; }
.care_wrap .cont .step_wrap .step .tit { font-size: 1.25em; font-weight: 600; color: #fff; }
.care_wrap .cont .step_wrap .step .txt { margin-left: 4rem; font-size: 1.7rem; color: rgba(255,255,255,0.7); }
.care_wrap .step_wrap {
  grid-template-columns: 1fr 1fr;
}


.care_wrap .step {
  padding-left: 2rem;
}

/* 프로그램 */
.program_wrap {}
.program_wrap .care_title { text-align: center; margin-bottom: 3.75rem;}
.program_wrap .care_title .title_label{ display:block; font-size: 14px; color:var(--siteC); font-weight:600; letter-spacing:.125rem; text-transform:uppercase; margin-bottom:.625rem;}
.program_wrap .care_title h1 { font-size: 41.12px; font-weight: bold; color: #333; margin: 0 0 .9375rem 0; }
.program_wrap .care_title .subtitle { font-size: 1.25rem; color: #333; margin: 0; font-weight: 600; }
.program_wrap .intro_section { background: #f8f9fa; padding: 2.375rem; border-radius: .625rem; margin-bottom: 2.5rem; border-left: .25rem solid var(--siteC);}
.program_wrap .intro_section .intro_text { font-size: 1.28em; line-height: 1.8; color: #333; font-weight: 700; margin: 0; text-align: center;}
.program_wrap .program_content { display: flex; gap: 2.5rem; align-items: flex-start; margin-bottom: 6em;}
.program_wrap .program_info { flex: 1;}
.program_wrap .info_item { margin-bottom: 2.1875em; padding: 2.25em; background: #fff; border-radius: .625rem; box-shadow: 0 .125rem .625rem rgba(0,0,0,0.08); transition: all 0.3s;}
/* .program_wrap .info_item:hover { transform: translateY(-0.3125rem); box-shadow: 0 .3125rem 1.25rem rgba(0,0,0,0.12);} */
.program_wrap .info_item h3 { font-size: 1.25em; font-weight: bold; color: var(--siteC2); margin: 0 0 .9375rem 0; padding-bottom: .625rem; border-bottom: .125rem solid #f0f0f0;}
.program_wrap .info_item p { font-size: .9375rem; line-height: 1.7; color: #666; margin: 0;}
.program_wrap .info_item ul { list-style: none; padding: 0; margin: 0;}
.program_wrap .info_item ul li{ font-size:1.05em; line-height:1.8;color:#444; margin-bottom: 1em; padding-left:1.25rem; position:relative;}
.program_wrap .info_item ul li:before{ content:'•'; position:absolute; left:0; color:var(--siteC2); font-weight:700;}
.program_wrap .info_item ul li:last-child{ margin-bottom:0;}
.program_wrap .info_item strong{ color:#333; font-weight:600; font-size: 1.125em;}
.program_wrap .info_item .period{ display: inline-block;  font-size: 0.8em;  font-weight: 600; color: #fff; background: var(--siteC2); padding: .1875em .625em; border-radius: 1.25em; letter-spacing: .0313em; margin-bottom: 0.8em;}
.program_wrap .info_item .highlight{ color:var(--siteC3); font-weight:600;}
.program_wrap .info_item.process{ background:linear-gradient(135deg,#f8f9fa 0,#e9ecef 100%);}
/* .program_wrap .process_flow{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:2rem;}
.program_wrap .process_flow .step{position:relative; width:calc((100% - 6rem) / 5); min-height:95px; display:flex; align-items:center; justify-content:center; flex-direction:column; padding:1rem; box-sizing:border-box; background:#fff; border:1px solid #e5e5e5; border-radius:1rem; box-shadow:0 .25rem .75rem rgba(0,0,0,.08); text-align:center; font-size:.95rem; font-weight:600; color:#333;}
.program_wrap .process_flow .step small{ display:block; font-size:.75rem; color:#999; font-weight:400; margin-top:.3125rem;}
.program_wrap .process_flow .arrow{ font-size:1.25rem; color:var(--siteC); font-style:normal;}
.program_wrap .step:not(:last-child)::after { content: "›"; position: absolute; right: -25px; top: 28px; font-size: 28px; color: #333;} */

.program_wrap .process_flow { display:grid; grid-template-columns:repeat(5,1fr); gap:2rem; }

.program_wrap .process_flow .step { position:relative; min-height:120px; padding:1rem; display:flex; align-items:center; justify-content:center; flex-direction:column; background:#fff; border:1px solid #e5e5e5; border-radius:1rem; box-shadow:0 .125rem .5rem rgba(0,0,0,.08); text-align:center; font-size:.95rem; font-weight:600; color:#333; box-sizing:border-box; }

.program_wrap .process_flow .step p { margin:0; }

.program_wrap .process_flow .step small { display:block; margin-top:.25rem; font-size:.8rem; color:#999; font-weight:400; }

.program_wrap .process_flow .step:not(:last-child)::after { content:"›"; position:absolute; right:-1.3rem; top:50%; transform:translateY(-50%); font-size:2rem; color:var(--siteC); z-index:1; }

.program_wrap .careImg{ width:25rem; flex-shrink:0; position: sticky; top: 7.5em; height: fit-content;}
.program_wrap .careImg img{ width:100%; height:auto; border-radius: 11em; box-shadow:0 .625rem 1.875rem rgba(0,0,0,.15);}

/* table */
table{ border-radius:1em; overflow:hidden; box-shadow: 0 .125rem .625rem rgba(0, 0, 0, 0.08);}
.scr_i{ display: none;}/* 반응형시 display: block 으로 변경*/
.table_st{ border-top:2px solid;}
.table_st.print{ border-top: none;}
.table_st th,
.table_st td{ height:3.5em; padding:.75em 1em; border:1px solid #d4d5d8; border-width:1px 0 1px 1px; background:#fff; color:#444; line-height:1.4; box-sizing:border-box;}
.table_st td a[href]:hover{ text-decoration:underline;}
.table_st thead tr th:first-child,
.table_st tbody tr th:first-child,
.table_st tbody tr td:first-child{ border-left-width:0;}
/* .table_st thead th{ text-align:center; color: #111; background: var(--crGray4);} */
.table_st thead th{ text-align:center; color: #111;}
.table_st tbody th{ background:#fafafa; text-align:center; color:#111;}
.table_st tr.row ~ tr td:first-child{ border-left-width:1px;}
.table_st a[href*="mailto"]{ word-break:break-all; word-wrap:break-word;}

.table_st .content{ padding:2em 2em;}

.table_st.trColor tbody tr:nth-child(2n) th{ background:#f5f5f5;}
.table_st.trColor tbody tr:nth-child(2n) td{ background:#f9f9f9;}

.table_st .total th,
.table_st .total td{ background:#f1f1f1; color:#000;}

.table_st.page tbody th.al{ padding-left:1.5em;}

.table_st.list{}
.table_st.list th,
.table_st.list td{ padding-left:.5em; padding-right:.5em; border-width:1px; text-align:center; }

.table_st.list.line{border-left: 1px solid #d4d5d8; border-right: 1px solid #d4d5d8;}
.table_st.list.line th{ font-weight: 600; font-size: 1rem;}
.table_st.list.line td{ border-width:1px 1px; font-weight: 500; font-size: .9375rem; text-align: justify; background: #eeeeee70;} 
.table_st.list.line .po{background: #ddd;}
.table_st.list.line .one{ text-align: center;}
.table_st.list.line tr th:first-child,
.table_st.list.line tr td:first-child{ border-left-width:0;}
.table_st.list.line tr th:last-child,
.table_st.list.line tr td:last-child{ border-right-width:0;}

.table_st.list thead .navy th{background: #12548f; font-weight: 700 !important; color: #fff;}
.table_st.list thead .blue th{background: var(--siteC2); font-weight: 700 !important; color: #fff;}

.table_st.list.service td{padding: 1.6em 1.3em;}

.table_sec + .table_sec{margin-top: 3em;}


/* 후원방법 */
.method_wrap .care_title { text-align: center; margin-bottom: 3.75em;}
.method_wrap .care_title .title_label{ display:block; font-size: 14px; color: #e3ba8a; font-weight:600; letter-spacing:.125em; text-transform:uppercase; margin-bottom:.625em;}
.method_wrap .care_title .label{ font-size: 2.45em; font-weight: 700;}
.method_wrap .care_title .label::after{ content: ''; position: absolute; top: 16em; left: 50%; transform: translateX(-50%); width: 224px; height: 2px; background: #e3ba8a;}
.process_list .method {
  display: flex;
  justify-content: space-between;
  gap: 40px; margin-top: 8em;
}

.process_list .step {
  flex: 1;
  text-align: center;
  position: relative;
}

/* 동그라미 */
.process_list .circle {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  margin: 0 auto 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: #fff;
}

/* 색상 */
.process_list .ka1 { background: #f47c7c; }
.process_list .ka2 { background: #f2a65a; }
.process_list .ka3 { background: #d4c63c; }
.process_list .ka4 { background: #8cc96b; }
.process_list .ka5 { background: #6fc1b6; }
.process_list .ka6 { background: #7da2d6; }

/* 👉 화살표 */
.process_list .step::after {
  content: "›";
  position: absolute;
  right: -25px;
  top: 35px;
  font-size: 28px;
  color: #333;
}
.process_list .step:last-child:after{display: none;}
.process_list .circle img {
  width: 40px;
  height: 40px;
  object-fit: contain; filter: brightness(0) invert(1);
}

.account-wrap { padding: 37px 30px; border-top: .1875rem solid #e3ba8a; background: #fff; margin-top: 32px; border-radius: 16px; }

.account-content-wrap { }
.account-content-title { font-size: 30px; font-weight: 600; letter-spacing: 5px; text-transform: uppercase; color: #333; margin-bottom: 28px;}

.account-hero { position: relative; border-radius: 16px; overflow: hidden; min-height: 20rem; display: flex; align-items: center;}

.account-bg-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: brightness(0.5) saturate(0.7); z-index: 0;}

.account-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, rgb(165 138 106) 0%, rgb(157 144 129 / 9%) 100%); z-index: 1;}

.account-info-panel { position: relative; z-index: 2; padding: 52px 56px; display: flex; gap: 64px; flex-wrap: wrap; align-items: flex-start;}

/* @media (max-width: 37.5rem) {
  .account-info-panel { padding: 2.5rem 1.75rem; gap: 2.25rem; }
} **/
.a_label { list-style: none;}
.a_label.account-number-block { display: flex; flex-direction: column; gap: 8px;}
.a_label.account-number-block li:first-child strong { font-size: 1.5rem; font-weight: 600; letter-spacing: 4px; color: rgba(255,255,255,0.7); text-transform: uppercase; display: block; margin-bottom: 4px;}
.a_label.account-number-block li:nth-child(2) { font-size: clamp(22px, 3.2vw, 32px); color: #fff; letter-spacing: 1.5008px; line-height: 1.2;}
.a_label.account-number-block li:nth-child(3){ font-size: 1.25em; color: rgba(255,255,255,0.6);}
.a_label.account-number-block li:last-child span { font-size: .875rem; color: rgba(255,255,255,0.6); font-weight: 400;}

.a_label.account-benefit-block { display: flex; flex-direction: column; gap: 8px; max-width: 340px;}
.a_label.account-benefit-block li:first-child strong { font-size: 1.25em; font-weight: 600; letter-spacing: 4px; color: rgba(255,255,255,0.7); text-transform: uppercase; display: block; margin-bottom: 4px;}
.a_label.account-benefit-block li:last-child { font-size: 13px; line-height: 1.9; color: rgba(255,255,255,0.75); font-weight: 400;}

.account-highlight { margin-top: 16px; padding: 18px 22px; border-left: .1875rem solid  #e3ba8a; font-size: 14px; line-height: 1.9; color: #333; font-weight: 400; border-radius: 16px;} 

.ico{ display: flex; align-items: center;}
.ico img{width: 2em; margin-right: .5em;}
.ico p{ font-size: 1.25em; color: rgba(255,255,255,0.6);}

/* 자원봉사 */

.iCo{ display: flex; align-items: center;}
.iCo img{width: 2em; margin-right: .5em; filter: invert(1);}
.iCo p{ font-size: 1.25em; color: #333;}

.process_list .method{ margin-top: 0; padding: 5em 0 5em 0;}
.process_title{ font-size: 1.75rem; font-weight: 700;}
.process_list .num{ font-size: 1.2rem;}
.process_list .tit{ font-size: 1rem;}


.certification_wrap{padding:60px 0;}
.cation_title{font-size:1.75rem;font-weight:700;margin-bottom:40px;}
.cation_list{display:grid;gap:20px;}
.cation_list .item{display:grid;grid-template-columns:40px 1fr;gap:20px;align-items:center;}
.cation_list .num{width:40px;height:40px;background:#829bb0;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;}
.cation_list .txt{background:#f8f9fb;padding:15px 20px;border-radius:10px;line-height:1.5;font-size:1.13em;}
.certificate p{ margin-left: 1em;}

.volOpp_wrap .volOpp_title{ font-size: 1.75rem; font-weight: 700;}
.volOpp_wrap .method{display:grid;grid-template-columns:repeat(5,1fr);gap:3rem;padding:5em 0;}
.volOpp_wrap .step{position:relative;text-align:center;}
.volOpp_wrap .circle{width:10em;height:10em;margin:0 auto 15px;border-radius:1em;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6em; color:#fff;}
.volOpp_wrap .num{font-size:1.5em;}
.volOpp_wrap .circle img{width:3.5em;height:3.5em; filter: brightness(0) invert(1);}
.volOpp_wrap .step .vo1{background:#7fbfeb;}
.volOpp_wrap .step .vo2{background:#50b3f8;}
.volOpp_wrap .step .vo3{background:#3fa0e4;}
.volOpp_wrap .step .vo4{background:#2990d8;}
.volOpp_wrap .step .vo5{background:#157ac0;}
.volOpp_wrap .tit{line-height:1.5; font-size: 1rem; font-weight: 600;}
.volOpp_wrap .step:after{content:"›";position:absolute;top:3.2rem;right:-1.8rem;font-size:2rem;color:#333;}
.volOpp_wrap .step:last-child::after{display: none;}

.service_wrap {}
.service-content-wrap {}
.service-content-label {font-size: 13px; letter-spacing: 5px; text-transform: uppercase; color: #333; margin-bottom: 14px;}
.service-content-title { font-size: 41.12px; font-weight: 700; line-height: 1.4; color: var(--black); letter-spacing: -0.5008px; padding-bottom: 28px;}

.service-hero { position: relative; overflow: hidden; min-height: 300px; display: flex; align-items: center; margin-bottom: 0; display: flex; justify-content: center; border-radius: 16px 16px 0 0;}
.service-bg-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; filter: brightness(0.8) saturate(0.6);}
.service-info-panel { position: relative; z-index: 2; padding: 0 16rem; text-align: center;}
.service-info-panel span { font-size: 18px; line-height: 2; color: #fff; font-weight: 700;}

.service-info { display: flex; flex-direction: column; gap: 0; border: .0625rem solid #c8c6c6; border-radius: 0 0 16px 16px; border-top: none; margin-bottom: 56px;}
.service-info ul { list-style: none; padding: 28px 32px; display: flex; flex-direction: column; gap: 8px;}
.service-info ul:first-child { border-bottom: .0625rem solid #c8c6c6; min-width: 220px; flex-shrink: 0;}

.service-info ul li:first-child { font-size: 17.008px; color: #333; font-weight: 600;}
.service-info ul li:not(:first-child) { font-size: 14px; color: #aaa;}

/* 참여가능한 봉사 활동 .volOpp { margin-bottom: 3.5rem; }
.volOpp h2 { font-size: 18px; font-weight: 600; letter-spacing: 4px; color: #333; text-transform: uppercase; margin-bottom: 16px;}
.vol-table { width: 100%; border-collapse: separate; border-spacing: 0; border: .0625rem solid #c8c6c6; font-size: .8438rem;}
.vol-table thead tr { background: #FCEFE0;}
.vol-table thead th { padding: 16px 20px; text-align: left; font-size: 13px; font-weight: 400; letter-spacing: 3px; color: rgba(163, 87, 0); text-transform: uppercase;}
.vol-table tbody tr { border-bottom: .0625rem solid #c8c6c6; transition: background 0.2s ease;}
.vol-table tbody tr:last-child { border-bottom: none; }
.vol-table td { padding: 18px 20px; color: #333; line-height: 1.7; vertical-align: middle; border-right: .0625rem solid #c8c6c6; border-bottom: .0625rem solid #c8c6c6;}
.vol-table td.type { font-size: 14px; font-weight: 500; color: #333; text-align: center; letter-spacing: -0.2px; background: #fff8f0; width: 130px;}
.vol-table td:last-child { font-size: 13px; color: #333; font-weight: 400; border-right: none; }
.vol-table td:nth-child(2) { font-size: 13px; font-weight: 400; width: 150px;} */

.service-bottom { display: grid; grid-template-columns: 1fr 1fr; border: .0625rem solid #c8c6c6; overflow: hidden; min-height: 240px; border-radius: 16px;}
/* @media (max-width: 42.5rem) {
  .service-bottom { grid-template-columns: 1fr; }
  .service-bottom-image { min-height: 12.5rem; }
} */
.service-bottom-text { display: flex; align-items: center; padding: 0 0.7rem; position: relative;}


.service-bottom-text p {
  font-size: clamp(15px, 1.8vw, 20px);
  font-weight: 300;
  color: #333;
  line-height: 1.85;
  letter-spacing: -0.0187rem;
}
.service-bottom-text p strong:first-of-type {
  color: #7ab3e8;
  font-weight: 500;
}
.service-bottom-text p strong:last-of-type {
  color: #e8906a;
  font-weight: 500;
}
/* 오른쪽 이미지 패널 */
.service-bottom-image-wrap {
  overflow: hidden;
  position: relative;
}
.service-bottom-image {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.6s ease;
}
/* @media (max-width: 42.5rem) {
  .service-info { flex-direction: column; }
  .service-info ul:first-child { border-right: none; border-bottom: .0625rem solid var(--border); }
  .service-info-panel { padding: 2.25rem 1.75rem; }
  .service-bottom p { padding: 0 1.75rem; }
} */

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(.875rem); }
  to   { opacity: 1; transform: translateY(0); }
}
.service-hero, .service-info, .volOpp, .service-bottom {
  opacity: 0;
  animation: fadeIn 0.55s ease forwards;
}
.service-hero   { animation-delay: 0.05s; }
.service-info   { animation-delay: 0.15s; }
.volOpp         { animation-delay: 0.25s; }
.service-bottom { animation-delay: 0.35s; }

#footer { background:#333; color:#fff; } 
#footer .menu_wrap { padding:2.5em 0 1.75em 0; } 
#footer .menu_wrap .menu { } 
#footer .menu_wrap .menu > li > .in { position:relative; padding:.5em 1.5em; } 
#footer .menu_wrap .menu > li > .in:after { content:""; display:block; position:absolute; top:50%; right:0; width:.0625rem; height:.75em; background:rgba(255,255,255,.2); transform:translateY(-50%); } 
#footer .menu_wrap .menu > li:first-child > .in { padding-left:0; } 
#footer .menu_wrap .menu > li:last-child > .in { padding-right:0; } 
#footer .menu_wrap .menu > li:last-child > .in:after { display:none; } 
#footer .menu_wrap .menu > li > .in .tt { font-size:1.063em; font-weight:500; } 
#footer .menu_wrap .menu > li > .in .xi { font-size:1.063em; padding-left:.375em; } 
#footer .menu_wrap .menu > li > .in:hover .tt { text-decoration:underline; } 

#footer .menu_wrap .family { position:relative; } 
#footer .menu_wrap .family .btn { padding:0 1.5em 0 1.75em; height:3.125em; border:.0625rem solid rgba(255,255,255,.3); } 
#footer .menu_wrap .family .btn .tt { font-size:.938em; font-weight:500; } 
#footer .menu_wrap .family .btn .xi { font-size:.938em; margin-left:5em; } 
#footer .menu_wrap .family .btn .xi:before { display:block; transition:.3s; } 
#footer .menu_wrap .family .family_con { z-index: 100; position:absolute; left:0; bottom:100%; width:100%; max-height:20em; padding:1em .5em 1em 1em; background:var(--siteC); border:solid rgba(255,255,255,.3); border-width:.0625rem .0625rem 0 .0625rem; box-sizing:border-box; display:none; } 
#footer .menu_wrap .family .family_con .list > li .in { display:block; padding:.5em 0; } 
#footer .menu_wrap .family .family_con .list > li .in .tt { font-size:.875em; } 
#footer .menu_wrap .family .family_con .list > li .in:hover .tt { text-decoration:underline; } 

#footer .menu_wrap .family.on .btn { background:var(--siteC2); } 
#footer .menu_wrap .family.on .btn .xi:before { transform:rotate(180deg); } 
#footer .menu_wrap .family.on .family_con { display:block; } 

#footer .menu_wrap .top { padding:0 1.1em 0 1.1em; height:3.15em; border:.0625rem solid rgba(255,255,255,.3); display: flex; align-items: center; border-left: 0;} 

#footer .info_wrap { padding:0 0 4em 0; } 
#footer .info_wrap .logo img { width:12.5em; opacity:.4; filter: grayscale(1) invert(1) brightness(10); } 
#footer .info_wrap .info { flex:1; } 
#footer .info_wrap .info .list { } 
#footer .info_wrap .info .list > li { display: flex; padding:.375em 2.75em .375em 0; } 
#footer .info_wrap .info .list > li.br { clear: left; } 
/* #footer .info_wrap .info .list > li:nth-child(2) { flex:1 1 100%; } */
#footer .info_wrap .info .list > li .tt { font-size:.938em; opacity:.8; } 
#footer .info_wrap .info .copy { margin-top:2.5em; } 
#footer .info_wrap .info .copy .tt { font-size:.813em; text-transform:uppercase; opacity: 1; /* opacity:.4; */ } 

#footer .left_box {gap: 3.5em;}
#footer .visitor{}
#footer .visitor .con{ display:inline-block; *display:inline; zoom:1; line-height:2.1875rem; padding:0 1.25rem; background:#0055A2; border-radius:2.1875rem;}
#footer .visitor .con > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; padding:0 .625rem; color:#fff;}
#footer .visitor .con > li .tt{ font-size:.875em;}
#footer .visitor .con > li .num{ padding-left:.3125rem; font-weight:700;}


@keyframes downAni{
70% { transform:translateY(0)}
85% { transform:translateY(.5em)}
100% { transform:translateY(0)}
}


/*  */
.vod_wrap { position: relative } 
.vod_wrap .vod { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover } 
.vod_wrap .layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .1 } 
.vod_wrap .layer.gra { background: linear-gradient(0deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, .3) 100%); } 

/* main visual */
.pgBg{ position:relative}
.pgBg:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:var(--siteC); opacity:.05}
.pgBg > *{ position:relative}

.pgLine{ height:.5em; margin:3em 0; background: linear-gradient(135deg, #eee 25%, transparent 25%, transparent 50%, #eee 50%, #eee 75%, transparent 75%, transparent); background-size: .5em .5em;}
.pgLine.m1{ margin:1em 0}
.pgLine.m2{ margin:2em 0}

.pgTitW{ display:flex; align-items:center; margin-bottom:1em}
.pgTitW.m1{ margin-bottom:.5em}
.pgTitW .mL{ margin-left:auto}
.pgTit{font-family:var(--ffT); font-weight:700; font-size:1.25em; letter-spacing:-.05em; word-spacing:.1em;}
.pgTit.s1{ font-size:1.375em}
.pgTit.s2{ font-size:2em}
.pgTit2{ font-weight:700; font-size:1.125em; position:relative; padding-left:1.5em; color:var(--siteC)}
.pgTit2:before{ content:""; position:absolute; left:0; top:50%; width:1em; height:.0625rem; background:var(--siteC)}

.mainVisualSlideWrap{ position:relative}
.mainVisualSlideWrap .mainVisualBanner{ background-size: cover;}
.mainVisualSlideWrap .mainVisualBanner{ position:relative; width: 100%; height: 560px; overflow: hidden;}
.mainVisualSlide{margin:0 -.625em; filter:drop-shadow(0 0 1em rgba(0,0,0,.1))}
.mainVisualSlide .el{ width:100%; box-sizing:border-box; height: 38vh; border-radius:1em; overflow:hidden;}
.mainVisualSlide .el .in{ display:block; height: 100%;}
.mainVisualSlide .el .in img{ width: 100%; height: 100%; object-fit: cover;}
.mainVisualSlideWrap { position:relative; } 
.mainVisualSlideWrap .slogan { position:absolute; left:0%; width:100%; top:45%; z-index:0; color:#fff; text-align: center; transform: translateY(-50%); } 
.mainVisualSlideWrap .slogan .wrap_in { /* gap:1.625em; */ } 
.mainVisualSlideWrap .slogan .ico { display:inline-block; } 
.mainVisualSlideWrap .slogan .ico img { width:6em; filter: brightness(0) invert(1); } 
.mainVisualSlideWrap .slogan .tt { /* opacity:0; transform:translateX(2em); transition:1s; */ } 
.mainVisualSlideWrap .slogan .desc{ font-size: 1.063em; color: rgba(255,255,255, .815); margin-top: 2.25em;}
.mainVisualSlideWrap .slogan .t1 { font-weight:800; font-size:2.8em; line-height: 1.4; text-shadow: 2px 2px 5px rgb(202 202 202 / 66%); color: #fff;} 
.mainVisualSlideWrap .slogan .t2 { margin-top: 1em; font-size:1.5em; } 
.mainVisualSlideWrap .slogan .t2 .xi { font-size: 1em; opacity: .6; } 
.mainVisualSlideWrap .slogan .en { margin-bottom: .5em; font-weight: 500; font-size:1.315em; opacity: .8;  text-shadow: 2px 2px 5px rgba(188, 188, 188, 0.75); color: #fff;} 
.mainVisualSlideWrap .el.swiper-slide-active .slogan .tt { opacity:1; transform:translateX(0); transition:2s; } 
.mainVisualSlideWrap .el.swiper-slide-active .slogan .tt:nth-child(1) { transition-delay:.2s; } 
.mainVisualSlideWrap .el.swiper-slide-active .slogan .tt:nth-child(2) { transition-delay:.6s; } 
.mainVisualSlideWrap .el.swiper-slide-active .slogan .tt:nth-child(3) { transition-delay:1s; } 
.mainVisualSlideWrap .swiperControl{ position:absolute; left:0; top:100%; width:100%; box-sizing:border-box; padding:1em}

.mouse-ico { position: absolute; left: 0; bottom: 2.5em; width: 100%; z-index: 0; text-align: center; } 
.mouse-ico .xi { color: var(--crWhite); font-size: 28.8px; animation: mouseAni 1s infinite alternate; } 
.mouse-ico > .tt { text-transform: uppercase; font-size: .765em; font-weight: 500; padding-top: 1em; } 
@keyframes mouseAni {0% { transform: translateY(0%); opacity: 1; } 
100% { transform: translateY(30%); opacity: 0.5; } 
 }

.mainTopCon{ flex:1 1 0%; min-width:0; display:flex; flex-direction:column; padding-top: 48px;}
.mainTopCon .conW{ display:flex; margin-top:auto; gap:1em; flex-direction:column}
.mainTopCon .conW .snsW{ width:12em; margin-top:auto}
.mainTopCon .conW .sponsorW {background: var(--siteC); padding: 1em 1.5em; border-radius: 1em; overflow: hidden; color: #fff;}
.mainTopCon .conW .sponsorW .t1 {font-weight: 800;}
.mainTopCon .conW .sponsorW .t2 {font-weight: 600; margin: 1em 0 .5em;}
.mainTopCon .conW .sponsorW .t3 {font-size: .86em;}

/* .mainTopCon .conW .noticeW{ flex:1; min-width:0; position:relative}
.mainTopCon .conW .noticeW .swiper-slide{ box-sizing:border-box;} */
.noticeSt{ border-radius:1em; padding:2em; background:#f7f7f7; display:flex; flex-direction:column; gap:1em; align-items:flex-start; border:.0625rem solid #ddd; transition: .3s ease;}
.noticeSt .tCate{ padding:.5em 1.5em; border-radius:2em; background:var(--siteC2); color:#fff; font-size: .9em; font-weight:700}
.noticeSt .tTit{ font-size:1.125em; height: 2.75em; font-weight:700}
.noticeSt .tTxt{ color:#666}
.noticeSt .tDate{ color:#888; font-size:.86em}
.noticeSt:hover .tTit{ text-decoration: underline;}
.noticeSt:hover{ border: .0625rem solid var(--siteC2);}

.sns_st{ display:flex; flex-wrap:wrap; gap:2em 0}
.sns_st > li{ width:50%}
.sns_st > li > a{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5em}
.sns_st > li > a .ico{ width:3.125em; height:3.125em; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff}
.sns_st > li > a .ico .xi{ font-size:1.75em}
.sns_st > li > a .ico img{ height:1.875em}
.sns_st > li > a .tit{ font-size:.875em}
.sns_st > li.nv > a .ico{ background:#03C75A}
.sns_st > li.fb > a .ico{ background:#3b5a9a}
.sns_st > li.ig > a .ico{ background:url(../images/inc/sns_ig_bg.svg) no-repeat; background-size:cover}
.sns_st > li.kc > a .ico{ background:#fae100}


/* 공통 */
.mainTop{ display: flex; align-items: center; justify-content: space-between; gap: 1em; margin-bottom: 1.5em;}
.main_tit {margin-bottom: 1.5em;}
.main_tit·mb0{ margin-bottom: 0;}
.main_tit .t1 {font-size: 2.15em; font-weight: 800;}

.main_con {padding: 3em 0;}
.main_con.bg {background: #F0F2F6;}

/* main contents */
.main_archive {position: relative;}

.archive_wrap {border-radius: 1em; overflow: hidden; border: .0625rem solid #ddd; z-index: 10;}
.archive_wrap .tab_wrap {}
.archive_wrap .archive_tab { background: var(--siteC2); display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 10px; overflow-y: hidden; touch-action: pan-x; -webkit-overflow-scrolling: touch; justify-content: space-around;}
.archive_wrap .archive_tab li {text-align: center; padding: 1em; flex-shrink: 0;}
.archive_wrap .archive_tab li:last-child {border-bottom: none;}
.archive_wrap .archive_tab li .tab_btn {font-weight: 600; color: #fff; display: flex; align-items: center; text-align: center; justify-content:center; font-size: 1em;}
.archive_wrap .archive_tab li .tab_btn .xi {display: block; margin-right: .5em;}
.archive_wrap .archive_tab li.on {background: #fff;} 
.archive_wrap .archive_tab li.on .tab_btn {color: var(--siteC2);}
.archive_wrap .archive_con {flex: 1; background: #fff; padding: 1em; box-sizing: border-box; overflow: hidden;}
/* .archive_wrap .archive_con .idx {width: 95%; margin: 0 auto;} */

.archiveSlide{}
.archiveSlide .swiper-slide{ height:auto}
.archiveSlide .el{}
.archiveSlide .el .in {position: relative; display: block; margin: 1em 0 1em; box-shadow: 0 .5em 1em rgba(0, 0, 0, .1); border-radius: 1em; overflow: hidden;}
.archiveSlide .el .in .xi {position: absolute; background: var(--siteC); color: #fff; width: 1.7em; height: 1.7em; line-height: 1.7em; top: 0; right: 0; border-bottom-left-radius: .8em; text-align: center; font-size: 1.5em;}
.archiveSlide .el .in .xi.st1 {background: var(--siteC);}
.archiveSlide .el .in .xi.st2 {background: var(--siteC3);}
.archiveSlide .el .in .xi.st3 {background: var(--gradC1);}
.archiveSlide .el .in .img_box {overflow: hidden; width: 100%; height: 10em;}
.archiveSlide .el .in .img_box img {width: 100%; height: 100%; object-fit: cover; }
.archiveSlide .el .in .tbox {width: 80%; margin: 1em auto;}
.con_idx > .idx:nth-child(4) .archiveSlide .el .in .tbox .tit {font-weight: 700; margin: 2em 0 .8em;  }
.con_idx > .idx:nth-child(4) .archiveSlide .el .in .tbox{ margin: 2em auto;}
.archiveSlide .el .in .tit {font-weight: 700; margin-bottom: 0.5em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #555; }
.archiveSlide .el .in .tt { line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 3.5em;}
.archiveSlide .el .in .data {font-size: .86em; font-weight: 500; color: #9b9b9b;}
.archiveSlide .el .in.st2 {}
.archiveSlide .el .in.st2 .tbox {width: 75%; margin: 2.5em auto 1em;}
.archiveSlide .el .in.st2 .tbox .tit {font-size: 1.125em; font-weight: 600;}
.archiveSlide .el .in.st2 .tbox .tt {margin: 1em 0; min-height: 6.7em; font-size: .96em; line-height: 1.4; font-weight: 500; color: #666;}
.archiveSlide_control {justify-content: flex-end; padding: 0 1.2em;}

.main_archive .circle_wrap{overflow: hidden;}
.main_archive .circle_wrap + *{ position:relative;}
.main_archive .circle_wrap .circle{ width:100%; height:100%; border-radius:50%; box-sizing:border-box; opacity:.5;}
.main_archive .circle_wrap .circle.st1{ border:8em solid transparent; background-image:linear-gradient(#fff, #fff), linear-gradient(to bottom, #f5d7df, #fff8b4); background-origin:border-box; background-clip:content-box, border-box;}
.main_archive .circle_wrap .circle.st2{ background:var(--siteC); opacity:.3;}
.main_archive .circle_wrap .pos{ position:absolute;}
.main_archive .circle_wrap .pos1{ width:30vw; height:30vw; right:-5vw; bottom: 0%; z-index: -15;}
.main_archive .circle_wrap .pos2{ width:10vw; height:10vw; left:2vw; bottom: 5%; z-index: -15;}

.moveDownAni2{ animation-name:moveDownAni2; animation-duration: 3s; transform-origin:center; animation-iteration-count:infinite}
@keyframes moveDownAni2{
100% { bottom:-25%}
50% { bottom:-20%}
0% { bottom:-25%}
}

.moveDownAni3 { animation-name:moveDownAni3; animation-duration: 5s; transform-origin:center; animation-iteration-count:infinite}
@keyframes moveDownAni3{
100% { bottom:-10%}
50% { bottom:0%}
0% { bottom:-10%}
}

.main_contents {padding-bottom: 4em;}
.main_contents ul {display: flex; gap: 1.5em;}
.main_contents ul li {box-sizing: border-box; width: 33.333%;}
.main_contents ul li .cmi_box {display: flex; flex-direction: column; overflow: hidden; position: relative; box-sizing: border-box; width: 100%; padding: 2.5em; border-radius: 2em; background-color: #F0F2F6; text-align: left;}
.main_contents ul li:nth-child(1) .cmi_box {background:#f5678c; color: #fff;}
.main_contents ul li:nth-child(2) .cmi_box {background:#FFE082; color: #fff;}
.main_contents ul li:nth-child(3) .cmi_box {background:#6bcef8; color: #fff;}
.main_contents ul li:nth-child(4) .cmi_box {background:#75e7e7; color: #fff;}

.main_contents ul li:nth-child(1) .cmi_box:hover {background:#f5d7df; color: #333;}
.main_contents ul li:nth-child(2) .cmi_box:hover {background:#fff8b4; color: #333;}
.main_contents ul li:nth-child(3) .cmi_box:hover {background:#c9e5f1; color: #333;}
.main_contents ul li:nth-child(4) .cmi_box:hover {background:#e7f9f9; color: #333;}

.main_contents ul li .cmi_box strong {font-size: 1.125em; font-weight: 800;}
.main_contents ul li .cmi_box p {width: 100%; margin-top: 1em; font-size: 1em; font-weight: 500; line-height: 1.6em; letter-spacing: -1.152px;}
/* .main_contents ul li .cmi_box .c_more {position: absolute; right: 0; bottom: 0; width: 4.5em; height: 4.5em; border-radius: 2em 0 0 0; background-color: #fff;}
.main_contents ul li .cmi_box .c_more:before {content: ""; position: absolute; left: -5em; bottom: 0; width: 5em; height: 5em; overflow: hidden; border-radius: 50%; box-shadow: 2em 2em 0 0 #fff;}
.main_contents ul li .cmi_box .c_more:after {content: ""; position: absolute; right: 0; top: -5em; width: 5em; height: 5em; overflow: hidden; border-radius: 50%; box-shadow: 2em 2em 0 0 #fff;}
.main_contents ul li .cmi_box .c_more > i {position: absolute; right: 0; bottom: 0; z-index: 1; width: 4em; height: 4em; line-height: 4em; text-align: center; border-radius: 50%; background-color: #0D0E0F; color: #fff;}
.main_contents ul li .cmi_box .c_more > i .icon {transform: rotate(-45deg);}
.main_contents ul li:hover .cmi_box .c_more > i {background-color: var(--siteC); transition: .3s;}
.main_contents ul li:hover .cmi_box .c_more > i .icon {transform: rotate(0); transition: .3s;} */


/* 로그인 */
.layer_inp{ display:block; position:relative}
.layer_inp .inp{ border:.0625rem solid #ddd; margin-bottom:-0.0625rem; padding:1em; padding-left:4em; height:3.5em; box-sizing:border-box; width:100%; position:relative; font-weight:500; font-size:1.188em}
.layer_inp select.inp{ padding-left:3.75em}
.layer_inp select.inp optgroup,
.layer_inp select.inp option{ font-weight:400; font-size:.938em}
.layer_inp:first-child .inp{ border-top-left-radius:.5em; border-top-right-radius:.5em}
.layer_inp:last-child .inp{ border-bottom-left-radius:.5em; border-bottom-right-radius:.5em}
.layer_inp .tt{ position:absolute; left:4em; top:0; width:calc(100% - 4em); height:100%; display:flex; align-items:center; box-sizing:border-box; padding:0 .5em; z-index:2; color:#777; font-weight:500; cursor:text}
.layer_inp .tt > i{ font-size:1.063em}
.layer_inp .ico{ font-size:1em; position:absolute; left:0; top:0; width:4.5em; height:100%; display:flex; align-items:center; justify-content:center; z-index:2}
.layer_inp .ico:before{ font-size:1.5em}
.layer_inp .inp:focus,
.layer_inp .inp:valid{ border-color: #777; z-index:1; background:#fff}
.layer_inp .inp:focus ~ .tt,
.layer_inp .inp:valid ~ .tt{ width:auto; height:1em; transform:translateY(-50%); background:#fff; color: #777;}
.layer_inp .inp:focus ~ .tt > i,
.layer_inp .inp:valid ~ .tt > i{ font-size:.875em}
.layer_inp .inp:-webkit-autofill,
.layer_inp .inp:-webkit-autofill:hover,
.layer_inp .inp:-webkit-autofill:focus,
.layer_inp .inp:-webkit-autofill:active { -webkit-box-shadow: 0 0 0rem 62.5rem white inset !important; -webkit-text-fill-color: #000 !important; box-shadow: 0 0 0rem 62.5rem white inset !important}

.login{ background: url(../images/sub/login.jpg) no-repeat center / cover;}
.login_wrap{ width:33em; max-width:100%; margin:0 auto; display:flex; flex-direction:column; gap:2em}
.login_wrap.w1{ width:50em}
.login_wrap.w100{ width:100%}
.login_wrap .login_tit{ display:flex; justify-content:center; text-align:center; flex-direction:column; align-items:center; gap:1em; text-transform:uppercase}
.login_wrap .login_tit .t1{ font-weight:800; font-size:2.2em; color:#333}
.login_wrap .login_tit .t1.s1{ font-size:2.25em}
.login_wrap .login_tit .t2{ font-weight:500; color:#555; font-size:1.063em}
.login_wrap .login_tit.flexR{ justify-content:space-between; padding:1em; padding-bottom:0}
.login_wrap .login{ padding:3em; padding-top:2.5em; border-radius:1em; box-shadow:0 0 2em rgba(0,0,0,.1); background:#fff; display:flex; flex-direction:column; gap:1em 0}
.login_wrap .login.row{ flex-direction:row; gap:5em}
.login_wrap .login.row > *{ flex:1}
.login_wrap .login.g1{ gap:.5em 0}
.login_wrap .login > *{ width:100%; box-sizing:border-box; position:relative; z-index:1}
.login_wrap .btn{ height:3.5em; border-radius:.5em; border:.125rem solid transparent; font-weight:700; font-size:1.15em; display:flex; align-items:center; justify-content:center; gap:.25em}
.login_wrap .btn.s1{ font-size:1.125em}
.login_wrap .btn .xi{ font-size:1.125em}
.login_wrap .btn.c1{ background: var(--siteC); color:#fff}
.login_wrap .btn.c2{ background:#333; color:#fff}
.login_wrap .btn.c2.re{ border-color:#333; color:#333; background:#fff}
.login_wrap .link_wrap{ padding:.5em; gap:0 1.5em; display:flex; align-items:center; justify-content:center}
.login_wrap .link_wrap a{ font-weight:500; color:#777; position:relative; display:flex; align-items:center; gap:.25em}
.login_wrap .link_wrap a:after{ content:"\e93f"; font-family:xeicon}
.login_wrap .link_wrap a.point{ font-size:1.063em; font-weight:700; color:#111}
.login_wrap .link_wrap a:hover:before{ content:""; position:absolute; left:0; top:100%; width:calc(100% - 1em); height:.0625rem; background:#aaa}
.login_wrap .link_wrap a.point:hover:before{ background:#111}
.login_wrap .m0{ margin-top:-.5em}
.login_wrap .m1{ margin-top:1em}
.login_wrap .tt1{ font-weight:700}
.login_tab{ display:flex; justify-content:center; gap:2vmin}
.login_tab > li{ width:45vmin; max-width:calc(50% - 1vmin)}
.login_tab > li > div{ height:100%; border-radius:1em}
.login_tab > li .wrap_in{ height:100%; box-sizing:border-box; padding:2em; background-color:#fff; box-shadow:0 0 1em rgba(0,0,0,.2); border-radius:1em; display:flex; flex-direction:column; gap:2em}
.login_tab > li .wrap_in .icoW{ width:50%; margin:0 auto}
.login_tab > li .wrap_in .icoW .resize{ padding-bottom:100%; border-radius:50%; background:#f1f1f1}
.login_tab > li .wrap_in .icoW .resize .re{ display:flex; align-items:center; justify-content:center}
.login_tab > li .wrap_in .icoW .resize .xi{ font-size:5em; opacity:.2}
.login_tab > li .wrap_in .imgW{ width:80%; margin:0 auto; position:relative}
.login_tab > li .wrap_in .imgW:before{ content:""; position:absolute; left:50%; top:50%; width:80%; padding-bottom:80%; border-radius:50%; background:#f1f1f1; transform:translate(-50%, -50%)}
.login_tab > li .wrap_in .imgW .resize{ padding-bottom:75%}
.login_tab > li .wrap_in .conW{ display:flex; flex-direction:column; gap:1em; text-align:center}
.login_tab > li .wrap_in .conW .t1{ font-weight:800; font-size:1.25em}
.login_tab > li .wrap_in .conW .t2{ font-weight:700; color:#666; line-height:1.5; word-break:keep-all}
.login_tab > li .wrap_in .btnW{ display:flex; margin-top:auto}
.login_tab > li .wrap_in .btnW .st{ flex:1; display:flex; gap:.5em; align-items:center; justify-content:center; height:4em; border-radius:.5em; background:#f5f5f5}
.login_tab > li .wrap_in .btnW .st:after{ content:"\e93e"; font-family:xeicon; position:absolute; opacity:0; transform:translateX(100%)}
.login_tab > li .wrap_in:hover .btnW .st{ background-image: var(--siteGra); color:#fff}
.login_tab > li .wrap_in:hover .btnW .st:after{ opacity:1; transform:translateX(0); position:inherit; transition:transform .3s}
.login_tab > li .wrap_in .btnW .st.c1{ background:#ddd}
.login_tab > li .wrap_in:hover .btnW .st.c1{ background:#111}
.login_tab > li .wrap_in .btnW .st .t1{ font-weight:800; font-size:1.063em}

.agree_box{ border-radius:.5em; border:.0625rem solid #ddd; padding:1.5em; color:#666; font-size:.938em; line-height:1.4; background:#fff}
.agree_box.st1{ border-radius:1em; padding:3em; font-size:1em; line-height:1.5}
.agree_box.h1{ height:8em; overflow-y: auto; }
.agree_box.h2{ height:10em}
.agree_box strong{ color:#111; font-weight:700}

.stepSt { display:flex; justify-content:flex-end; gap:0 4em}
.stepSt > li {counter-increment: myIndex} 
.stepSt > li .ico { position:relative } 
.stepSt > li:not(:last-child) .ico:before { content:""; position:absolute; left:100%; top:50%; width:4em; height:.0625rem; background:#aaa } 
.stepSt > li .ico .xi { font-size:1em; width:1.5em; height:1.5em; margin:0 auto; display:flex; align-items:center; justify-content:center; color:#fff; background:#888; border-radius:50% } 
.stepSt > li .tt { margin-top:.5em; font-weight:600; text-align:center; color:#888} 
.stepSt > li .tt:before{content:counter(myIndex) "."}
.stepSt > li.on { opacity:1 } 
.stepSt > li.on .tt { color:var(--gradC1); } 
.stepSt > li.on .ico .xi,
.stepSt > li.on .ico:before { background:var(--gradC1); } 
.stepSt > li.on .ico .xi:before { content:"\e928" } 
.stepSt > li:not(.on) .ico .xi { transform:scale(.5) } 

.form_wrap .form_tit{ border-bottom:.0625rem solid #111; padding:.75em 0}
.form_wrap .form_tit.bd0{ border-bottom:none}
.form_wrap .form_tit .t1{ font-weight:800; font-size:1.25em}
.form_wrap .form_tit .t2{ font-weight:700; font-size:1.35em}
.form_wrap .form_tit .t3{ font-weight:500; font-size:1.05em}
.form_wrap .form_tit .t4{ font-weight:500; font-size:1em}
.form_wrap .form_con{ padding:1.5em 0}
.form_st > li{ border-bottom:.0625rem solid #ddd; padding:.75em 0}
.form_st > li:first-child{ border-top:.0625rem solid #111}
.form_wrap .form_tit + .form_st > li:first-child{ border-top:none}
.form_st.noline > li{ border-bottom:none; border-top:none}
.form_st.noline > li:first-child{ padding-top:0}
.form_st > li.bd0{ border-bottom:none}
.form_lab{ display:flex; align-items:center}
.form_lab .lab_tit,
.form_lab .lab_con{ min-height:3em; box-sizing:border-box; display:flex; flex-wrap:wrap; align-items:center;}
.form_st.h1 .lab_tit,
.form_st.h1 .lab_con{ min-height:2em}
.form_lab .lab_tit{ width:9em; margin:0 2em 0 .5em; gap:.5em 0}
.form_lab .tit1{ font-weight:600; font-size:1.063em}
.form_lab .tit2{ font-weight:600; font-size:.938em; line-height:1.2}
.form_lab .lab_con{ flex:1 1 0%; min-width:0; gap:.25em; font-weight:500}
.form_lab .lab_con.gap1{ gap:.5em 1em}
.form_lab .lab_con:not(.flex) > *{ flex:1 1 0%; min-width:0}
.form_lab .lab_con .inp_tt{ flex:0 0 auto; font-size:.938em; color:#666; font-weight:400}
.form_lab .lab_con .input_st{ width:100%}
.form_lab .lab_con .input_st.grow{ flex:1 1 0%; min-width:0; width:auto}
.form_lab .lab_con .line{ padding-top:.75em; margin-top:.75em; border-top:.0625rem solid #ddd}
.form_lab .lab_con .w1{ flex:0 0 auto; width:3em}
.form_lab .lab_con .w2{ flex:0 0 auto; width:9em}
.form_lab .lab_con .w3{ flex:0 0 auto; width:6em}
.form_lab .lab_con .w50{ flex:0 0 auto; width:50%}
.form_lab .lab_con .w100{ flex:0 0 auto; width:100%}
.form_lab .lab_con .w_auto{ flex:0 0 auto; width:auto}
.form_lab .lab_con .max1{ max-width:20.25em}
.form_lab .lab_con .max2{ max-width:10em}
.form_lab .lab_con .max3{ max-width:32em}
.form_lab .lab_con .min1{ min-width:23.5em}

.form_lab .altW{ width:100%; box-sizing:border-box;}
.form_lab .altW .tit{ display:flex; align-items:center; gap:.25em}
.form_lab .altW .tit .xi:before{content:"\e97e"; color:#888}

.form_wrap.st1{ }
.form_wrap.st1 .form_st{ border:.0625rem solid #ddd; border-radius:1em; padding:1em 2em}
.form_wrap.st1 .form_st > li{ border-top:none; padding:.625em 0}
.form_wrap.st1 .form_st > li:last-child{border-bottom:none;}
.form_wrap.st1 .form_lab{ align-items:flex-start}
.form_wrap.st1 .form_lab .lab_tit{ justify-content:flex-end; position:relative; padding-right:1em; margin-right:1em; width:6em}
.form_wrap.st1 .form_lab .lab_tit:after{ content:""; position:absolute; right:0; width:.0625rem; top:.25em; height:1em; background:#ddd}
.form_wrap.st1 .form_lab .lab_tit,
.form_wrap.st1 .form_lab .lab_con{ min-height:1em}
.form_wrap.st1 .form_lab .lab_con{ padding-top:.063em}

.form_wrap.st2{ border-radius:1em; padding:1em 2em; box-shadow:0 0 1em rgba(0,0,0,.1)}
.form_wrap.st2 .form_st > li:last-child{ border-bottom:none}

.form_wrap.st3{ padding:0 1em}
.form_wrap.st3 .form_tit{ border-color:transparent; padding:1em 0 .5em 0}
.form_wrap.st3 .form_st > li{ padding:0; padding-bottom:1.5em; border-color:#111}
.form_wrap.st3 .form_st:last-child > li{ border-bottom:none}

.form_wrap.st4 .form_lab{ padding:0 2em; box-sizing:border-box}
.form_wrap.st4 .form_st > li:first-child{ border-top:none}
.form_wrap.st4 .form_st > li:last-child{ border-bottom:none} 

.agree_wrap{ box-shadow:0 0 1em rgba(0,0,0,.1); padding:2em; color:#666}

.fin_box{ border-radius:.5em; border:.0625rem solid transparent; padding:3em; background:#f5f5f5; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:1.5em}
.fin_box.al{ align-items:flex-start; text-align:left}
.fin_box.p1{ padding:2em; gap:.75em}
.fin_box.bg1{ background:none; box-shadow:0 0 1em rgba(0,0,0,.1)}
.fin_box .tit{ font-size:1.5em; font-weight:600; color:#111; text-align:center}
.fin_box .tt1{ line-height:1.5; font-size:1.063em; color:#666; font-weight:500}
.fin_box .tt1.s1{ font-size:1em}
.fin_box .fs:not(:last-child):after{ content:","}
.fin_box .fin_ico{ font-size:4em}
.fin_box .tit,
.fin_box .tit > i,
.fin_box .tt{ word-break:keep-all}

.dlSt > dt{ display:flex; align-items:center; gap:.25em}
.dlSt > dt:not(:first-child){ margin-top:2em}
.dlSt > dt .ico{ font-size:1.5em}
.dlSt > dt .t1{ font-size:1.313em; font-weight:600; font-family:var(--ffT); letter-spacing:-.05em; word-spacing:.1em}
.dlSt > dd{ margin-top:.5em; border-radius:.5em; border:.0625rem solid #aaa; background:#fff; padding:1.5em; line-height:1.5; position:relative}
.dlSt > dd.p0{ padding:0}
.dlSt > dd.p1{ padding:1em}
.dlSt > dd.p2{ padding:4%}
.dlSt > dd.bg1{ background:#f5f5f5}
.dlSt > dd.bg2{ background:#444; color:#fff; border-color:transparent}
.dlSt .mgL{ margin-left:auto; margin-right:1em;}
.dlSt.c1 > dt{ color:var(--siteC)}
.dlSt.c1 > dd{ border-color:var(--siteC)}
.dlSt.c2 > dt{ color:green}
.dlSt.c2 > dd{ border-color:green}

.memoSt{ display:flex; flex-direction:column; gap:1em}
.memoSt > li{ position:relative; display:flex; gap:.5em; line-height:1.2; font-size: .96em;}
.memoSt > li:before{ content:"•"; transform-origin:0% 0%; height:1.2em; display:flex; align-items:center}
.memoSt > li .tt{ flex:1 1 0%; min-width:0; font-weight:500;}
.memoSt > li .tt .point{ font-weight:700; color:#111}
.memoSt > li .tt .point.c1{ color:var(--siteCerr)}
.memoSt > li .tt .t1{ font-weight:700; font-size:1.063em}
.memoSt > li .tt .t1.s1{ font-size:1.125em}
.memoSt > li .tt .t2{ font-size:.938em; color:#666; font-weight:400; line-height:1.5}
.memoSt.g1{ gap:.5em}

.page_tit { margin-bottom: 2.5em; } 
.page_tit.white > .tt { color: #fff; } 
.page_tit.icon { position: relative; } 
.page_tit.icon:before { content: ""; display: block; } 
.page_tit.icon > .tt { position: relative; } 
.page_tit > .tt > b { font-weight: 600; } 
.page_tit.icon.st1 { margin-bottom: 2em; line-height: normal; } 
.page_tit.icon.st1:before { position: absolute; left: 0; top: 0; width: 2.5em; height: 2.5em; background: var(--siteC); border-radius: 50%; opacity: .2; transform: translate(-.75em, -.375em); } 
.page_tit.icon.st2 { padding-left: 2em; line-height: 1.5; } 
.page_tit.icon.st2:before { content: "\e92b"; font-family: xeicon; font-size: 1.438em; color: inherit; position: absolute; top: 0; left: 0; line-height: normal; } 
.page_tit.icon.st2 > .t2 { top: -4px; } 
.page_tit.icon.st2 > .t4 { top: -2px; } 
.page_tit.icon.st3 { line-height: 1.5; } 
.page_tit.icon.st3:before { position: absolute; top: 0; left: 0; width: 1.125em; height: .313em; background: var(--siteC); border-radius: 6em; transform: rotate(-45deg) translate(-.625em, -.875em); } 
.page_tit.icon.st4 { padding-left: 2em; line-height: 1.5; margin-top: 1em; margin-bottom: .65em; color: var(--siteC2); } 
.page_tit.icon.st4:before { content: "\e92b"; font-family: xeicon; font-size: 1.438em; color: inherit; position: absolute; top: 0; left: 0; line-height: normal; } 

.page_tit.line { margin-bottom: 1em; padding-bottom: 1em; border-bottom: .0625rem dashed #d4d5d8; } 
.page_tit.line2 { margin-bottom: 2em; padding-bottom: 2em; position: relative; } 
.page_tit.line2::after { content: ''; width: 1.875rem; height: .125rem; background: var(--siteC); position: absolute; left: 0; bottom: 0; } 
.page_tit:last-child { margin-bottom: 0 !important; } 
.page_tit > .tt { color: #333; font-weight: 700;} 
.page_tit > .t1 { font-size: 1.625em; } 
.page_tit > .t2 { font-size: 1.375em; } 
.page_tit > .t3 { font-size: 1.875em; } 
.page_tit > .t4 { font-size: 1.188em; } 
.page_tit > .t5 { font-size: 1.125em; } 
.page_tit > .t6 { font-size: 1.063em; } 
.page_tit > .t7 { font-size: 1.5em; } 
.page_tit > .t8 { font-size: 1em; } 
.page_tit > .t9 { font-size: 25.6px;} 
.page_tit > .t10 { font-size: 2.15em; } 

.page_txt { } 
.page_txt > .tt { margin-top: 1.375em; color: #111; font-weight: 500; } 
.page_txt > .tt:first-child { margin-top: 0; } 
.page_txt > .tt.flex > .sec { padding-right: 1.75em; } 
.page_txt > .tt.flex > .sec:last-child { padding-right: 0; } 
.page_txt > .t1 { font-size: 1.063em; line-height: 1.9; } 
.page_txt > .t2 { font-size: 1.250em; } 
.page_txt > .t3 { font-size: .938em; line-height: 1.5; } 
.page_txt > .t4 { font-size: 1.125em; line-height: 1.5; } 
.page_txt > .t5 { font-size: .875em; line-height: 1.5; } 
.page_txt > .t6 { font-size: 1.5em; } 

.certconBox {position: relative; display: flex; align-items: center; justify-content: space-between; overflow: hidden; padding: 3em; box-sizing: border-box; border-radius: 1em; background: #FCEFE0;}
.certconBox .midIcon {position: absolute; right: 2em; filter: hue-rotate(136deg) brightness(3.5); opacity: 0.5; width: 10em; height: 10em;}
/* .certconBox .midIcon > img {width: 100%; height: 100%; object-fit: contain; opacity: .086; filter: invert(62%) sepia(83%) saturate(747%) hue-rotate(358deg) brightness(101%) contrast(103%);} */
.certconBox:last-of-type {margin-bottom: 0;}
.certconBox .mjinfo {position: relative; z-index: 2;}
.certconBox .mjinfo .roundT {display: flex; align-items: center; justify-content: center; padding: 0 28px; box-sizing: border-box; border-radius: 3em; background: var(--siteCO); color: #fff; font-weight: 500; height: 45.6px; display: inline-flex; margin-bottom: var(--space-3);}
.certconBox .mjinfo .roundT > p {font-size: 1em; letter-spacing: 0; text-transform: uppercase;}
.certconBox .mjinfo .tit {font-size: 1.8em; font-weight: 800;}
.certconBox .mjinfo .txt {color: #444; line-height: 1.75; margin-top: 1em; font-size: 1rem;}
.certconBox .mjinfo .txt2 {font-size: 1.05em; font-weight: 600; margin-top: 1em;}
.certconBox .mjImg {position: relative; width: 50%; height: 288px; border-radius: .8em; overflow: hidden; z-index: 2;}

.btn_wrap {gap: .5em;}

.myInfoWrap{ background:#f1f1f1; margin-bottom:2em; border-radius:1em; padding:2% 5%; display:flex; align-items:center; gap:4%}
.myInfoWrap .wrapL{ flex:1 1 0%; min-width:0}
.myInfoWrap .wrapR{ width:25em}
.myInfo{ display:flex; flex-direction:column; gap:.5em; align-items:flex-start}
.myInfo .lv{ display:flex; align-items:center; color:var(--siteC); gap:.25em; height:2em; padding:0 1em; background:var(--siteGra); color:#fff; border-radius:2em; font-size:.938em}
.myInfo .lv .t1{ font-weight:700}
.myInfo .name{ display:flex; align-items:baseline; font-weight:500}
.myInfo .name .point{ font-size:1.5em; font-weight:700}
.myInfo .btn{ display:flex; gap:.25em; font-size:.938em; padding-top:.75em}
.myInfoList {}
.myInfoList > li {}
.myInfoList > li .in{ border-bottom:.0625rem solid #ddd; padding:.5em; display:flex; align-items:center; position:relative}
.myInfoList > li .in:before{ content:""; position:absolute; left:50%; top:0; height:100%; width:calc(100% + 2em); transform:translateX(-50%); background:#fff; border-radius:2em; opacity:0}
.myInfoList > li .in > *{ position:relative}
.myInfoList > li .in .tit{ display:flex; align-items:center; gap:.5em; font-weight:700}
.myInfoList > li .in .tit .ico{ width:2em; height:2em; background:#333; color:#fff; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1em; border-radius:50%}
.myInfoList > li .in .tt{ flex:1 1 0%; min-width:0; display:flex; justify-content:flex-end; align-items:baseline; color:#666; gap:.5em; font-size:.938em}
.myInfoList > li .in .tt .point{ font-weight:700; font-size:1.25em; color:var(--siteC)}
.myInfoList > li .in .tt .arrow:before{content:"\e93f"}
.myInfoList > li .in:hover:before{ opacity:1}

.myCert_list ul {gap: 1em;}
.myCert_list ul li {border-radius: 1em; box-shadow: 0 0 1em rgba(0, 0, 0, .1); background: #fff; overflow: hidden; padding: 2em; flex: 1 19%; max-width: 20%;}
.myCert_list ul li .top {margin-bottom: 1em;}
.myCert_list ul li .top .icon {background: #f1f1f1; width: 2.5em; height: 2.5em; line-height: 2.5em; text-align: center; border-radius: 50%;}
.myCert_list ul li .top .icon .xi {color: var(--siteC);}
.myCert_list ul li .middle {margin-bottom: 1em;}
.myCert_list ul li .middle .tit {font-size: 1.05em; font-weight: 600; margin-bottom: 1em;}
.myCert_list ul li .middle .data {font-size: .9em; opacity: .7;}
.myCert_list ul li .bottom {gap: .5em;}
.myCert_list ul li .bottom button {flex: 1;}

.mem_agree .agree{ padding:2em; border:solid #ddd; border-width:.125rem .0625rem .0625em .0625em; border-top-color:#333; background:#fff; color:#444; line-height:1.8;}
.mem_agree .agree.H{ padding:1.5em 1em; border-top-width:.0625rem; height:12em; overflow-y:scroll;}
.mem_agree .agree p{ padding:.5em 0;}
.mem_agree .agree *{ vertical-align:baseline;}
.mem_agree .agree strong{}
.mem_agree .check{ padding:1em 0;}
.dp1_policy .mem_agree .agree strong{color:#fff; background:var(--siteC2); padding:.5em 1em; border-radius:.5em; text-align:center; display:block;}

.agree_box p{ padding:.5em 0;}
/* .agree_box strong{color:#fff; background:var(--siteC2); padding:.5em 1em; border-radius:.5em; text-align:center; display:block;} */

.bgfix{ background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}

.flex > *{ box-sizing: border-box; min-width: 0;}

/* 기관 소개 - 인사말 */
/* .greet_top::after { content: ''; width: 87.5rem; height: 8.75em; border-radius: 2em 2em 0 0; background: #fff; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }  */
.greet_box{ margin-top: -3.5em; position: relative; overflow: hidden; padding: 4em; border-radius: 1em;} 
.greet_box::before{ content: ""; position: absolute; inset: 0; filter: blur(5px) brightness(0.9); transform: scale(1.1); z-index: -1; transform: scaleX(-1);}
.greet_box p{ font-size: 2em; font-weight: 700; color: #333;} 
.greet_box .inner { display: flex; gap: 5em; justify-content: center;} 
.greet_box .inner + .inner { margin-top: 5em; } 
.greet_box .inner .txt_wrap { width: 50%; } 
.greet_box .inner .img_wrap img{ width: 100%; height: 88%; object-fit: cover; border-radius: 1rem;}
.greet_box .inner .img_con{ flex: 1;}
.txt_wrap, .img_wrap{flex: 1;}
.greet_box .txt_wrap .page_tit { } 
.greet_box .txt_wrap .page_txt > .tt.t4 { color: #333; } 
.greet_box .txt_wrap .ceo { gap: 2em; margin-top: 2.5em; padding-right: 1em; color: #333;} 
.greet_box .txt_wrap .ceo .t1 { font-weight: 600; font-size: 1.125em; } 
.greet_box .txt_wrap .ceo .t2 { font-weight: 800; font-size: 1.5em; } 
.greet_box .txt_wrap .ceo .sign { display: inline-block; width: 12em; height: 4em; }

/* 센터소개 공통 */
.company_top { margin: 0 auto; padding: 0 0 4em; border-radius: 2em; color: #fff; position: relative; transition: all .8s; overflow: hidden; } 
.company_top .tit { font-weight: 600; font-size: 1.125em; position: relative; margin-bottom: 2em; opacity: .8; } 
.company_top .tit::after { content: ''; display: inline-block; width: 8em; height: .0625rem; margin-left: 1.5em; background: #fff; } 
.company_top .desc { font-size: 1.875em; line-height: 1.5; display: flex; justify-content: center; text-align: center; color: var(--siteC2); font-weight: 800;} 


