@charset "utf-8";
/* CSS Document */
.box0{ padding:0 3em}
.box0L{ padding-left:4em}
.box1{ width:1200px; margin:0 auto}
.box2{ width:1400px; margin:0 auto}
.box4{ width:900px; margin:0 auto}
 
.headerL{ padding-left:5em}
.headerT{ padding-top:5em}
.headerH,
#header .gnb_wrap .gnb > li .dp1 .va{ height:5em; justify-content: end;}

.scrollMg{scroll-margin-top: 8.5em; scroll-snap-margin-top: 8.5em}
  
.gnb li.m_hide{ display:none}
body{ width:100%; overflow: hidden;}
html:not(.pop) body{ display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100); box-sizing:border-box; padding-left: 5em;}

#headerQ { position:fixed; left:0; top:0;  height:100vh; z-index:1001;  display:flex; width:5em; transition:width ease-in-out 0.5s}
#headerQ .all_wrap { z-index:1}
#headerQ .quick_wrap{ z-index:2}
#headerQ .fix_wrap{ z-index:3}
#headerQ .quickBtn{ z-index:4}
#headerQ .fix_wrap{ order:-1; width:5em; height:100%; display:flex; align-items:center; flex-direction:column; gap:2em 0; box-sizing:border-box; background:#fff; position:relative}
#headerQ .fix_wrap:before{ content:""; position:absolute; width:1px; height:100%; top:0; right:0; background:rgba(0,0,0,.05)}
#headerQ .allBtn{ width:100%; height:5em; background:#193988; color:#fff; display:flex; align-items:center; justify-content:center}
#headerQ .allBtn .xi{ font-size:2em}
#headerQ .allBtn .xi:before{ content:"\e91c"}
#headerQ.allOn .allBtn{background: #fff; }
#headerQ.allOn .allBtn .xi:before{color: #193988;}
#headerQ .all_wrap{ width:100vw; height:100vh; background:#193988; position:absolute; left:0; top:0; overflow-y:auto; visibility:hidden}
#headerQ .all_wrap .bg{ position:absolute; left:0; top:0; height: 100%; background:#193988; width:100%; opacity:0; display:flex; align-items:center; justify-content:center; transition:.3s ease-in}
#headerQ .all_wrap .bg .img{opacity:.1; filter:brightness(0) invert(1); width:20vw}
#headerQ .all_wrap .wrap_in{ position:relative; opacity:0; box-sizing:border-box; width:100%; height: 124vh; display:flex; align-items:center; justify-content:center; color:#fff}
#headerQ .all_wrap .wrap_in .in{ padding:4em; box-sizing:border-box; width:100%}
#headerQ .all_wrap .wrap_in .gnb{ gap:2em 1em}
#headerQ .all_wrap .wrap_in .gnb .flex{ flex-direction:column}
#headerQ .all_wrap .wrap_in .gnb > li{ flex:1 1 20%}
#headerQ .all_wrap .wrap_in .gnb > li .dp1{ display:flex; align-items:center; justify-content:center; height:4em; background:#fff; border-bottom-right-radius:0; color:#193988}
#headerQ .all_wrap .wrap_in .gnb > li .dp1 .va{ font-weight:700; font-size:1.125em}
#headerQ .all_wrap .wrap_in .gnb > li .dp2{ gap:.5em 0}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 a{ line-height:1.1}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a{ background:rgba(255,255,255,.1); padding:.75em .5em}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 li.act > a .arrow,
#headerQ .all_wrap .wrap_in .gnb > li .dp2 li.on > a .arrow{ opacity:1}

#headerQ .all_wrap .wrap_in .gnb > li.more > a.link {display: none;}
#headerQ .all_wrap .wrap_in .gnb > li.more > .layer {display: block;}
#headerQ .all_wrap .wrap_in .gnb > li.more > .layer{ display:block}
#headerQ .all_wrap .wrap_in .gnb > li > a .arrow {margin-left: .5em; font-size: 1em;}
#headerQ .all_wrap .wrap_in .gnb > li.more > a .arrow:before{ content:"\e913"}
#headerQ .all_wrap .wrap_in .gnb > li.on > a .arrow:before{content:"\e93f"}
#headerQ .all_wrap .wrap_in .gnb > li.on.more > a .arrow:before{content:"\e941"}
#headerQ .all_wrap .wrap_in .gnb > li > a.layer .close{ display:none}
#headerQ .all_wrap .wrap_in .gnb > li.on > a.layer .open{ display:none}
#headerQ .all_wrap .wrap_in .gnb > li.on > a.layer .close{ display:inline-block}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a.layer {display: none;}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 {display: none;}
#headerQ .all_wrap .wrap_in .gnb > li.on .dp2 {display: block;}

#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li .dp3{ gap:.25em 0; padding:.75em 0;background:rgba(0,0,0,.1); border:1px solid rgba(255,255,255,.2)}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li .dp3 > li > a{ text-align:left; padding:.25em .5em; padding-left:1.25em; position:relative}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li .dp3 > li > a:hover .va .tt{ text-decoration:underline}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li .dp3 > li > a:before{ content:"-"; position:absolute; left:.5em; top:.375em; width:auto; height:auto}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li .dp3 > li > a .va{ font-size:.938em}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li:hover > a{ background:#fff; color:#193988; font-weight:600}
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li:hover .dp3{ background:rgba(0,0,0,.3)}
#headerQ.allOn .allBtn .xi:before{content:"\e9af"}
#headerQ.allOn .all_wrap{ visibility: visible;}
#headerQ.allOn .all_wrap .bg{ opacity:1}
#headerQ.allOn .all_wrap .wrap_in{ opacity:1; transition-delay:.3s}
#headerQ .mem_wrap .logBtn{ display:flex; flex-direction:column; align-items:center; gap:.5em 0}
#headerQ .mem_wrap .logBtn .ico{ color:#193988; font-size:2em}
#headerQ .mem_wrap .logBtn .tt{writing-mode: vertical-lr; font-weight:700; font-size:1.063em; color:#999; word-spacing:.5em}
#headerQ .mem_wrap .logBtn .tt .point{ color:#193988}
#headerQ .mem_wrap .logBtn .arrow{ font-size:1em; color:#193988; transition:.3s}
#headerQ .mem_wrap .logBtn:hover .arrow{ transform:translateY(1em)}
#headerQ .goTop{ margin-top:auto; margin-bottom:1em; width:3.5em; line-height:3.5em; text-align:center; background: linear-gradient(-225deg, #193988 0%, #0043b2 100%); color:#fff; box-shadow:0 0 1em rgba(0,0,0,.1); opacity:0; transform:translateY(100%); transition:.3s}
#headerQ .goTop .xi{ font-size:1.5em}
.scroll #headerQ .goTop{ opacity:1; transform:translateY(0)}
#headerQ .quick_wrap{ position:absolute; left:0; top:0; width:27em; height:100%; background:#fff; padding-bottom:2em; box-sizing:border-box; box-shadow:1em 0 1em rgba(0,0,0,.1); overflow:hidden; transform:translateX(-100%); transition:transform ease-in-out 0.5s; overflow-y:auto}
#headerQ .quick_wrap .wrap_in{ height:100%; box-sizing:border-box; gap:2em 0}
#headerQ .quick_wrap .logo{ flex:0 0 auto}
#headerQ .quick_wrap .link .list > li{ width:33.33%}
#headerQ .quick_wrap .link .list > li > a{ display:block; text-align:center; box-sizing:border-box; padding:.5em .25em; position:relative; border-radius:.5em; border:1px solid transparent}
#headerQ .quick_wrap .link .list > li > a .ico{ height:3.5em; display:flex; align-items:center; justify-content:center}
#headerQ .quick_wrap .link .list > li > a .ico img{ height:90%}
#headerQ .quick_wrap .link .list > li > a .t1{ display:block; margin-top:.5em; line-height:1.1; font-size:.938em}
#headerQ .quick_wrap .link .list > li > a:hover{ background:#f5f5f5}
#headerQ .quick_wrap .link .list > li > a:hover .t1{ font-weight:500}
#headerQ .quick_wrap .pop{ margin-top:auto}
#headerQ .quick_wrap .pop .control{ margin-top:.5em}
#headerQ .quick_wrap .main_tit{ margin-bottom:1em}
#headerQ .quickBtn{ position:absolute; left:100%; bottom:45%; transform:translate(-50%, -50%); width:4em; line-height:4em; background:#f0f4ff; color:#074393; border-radius:50%; display:flex; align-items:center; justify-content:center}
#headerQ .quickBtn .ico{ transition:.3s}
#headerQ .quickBtn .ico:before{content:"\e93e"}
#headerQ.quickOn{ width:32em; box-shadow:none}
#headerQ.quickOn .quick_wrap{ transform:translateX(5em)}
#headerQ.quickOn .quickBtn .ico{ transform:rotate(180deg)}
#headerQ .quick_wrap .mem_wrap { justify-content: space-around;}
#headerQ .quick_wrap .mem_wrap .link { border: 1px solid #f0f4ff; background:#f0f4ff; color: #193988; border-radius: 5em; padding: 0.25em; margin: -1em 0; width: 7.5em; text-align: center; transition:.2s;}
#headerQ .quick_wrap .mem_wrap .link:hover { border: 1px solid #193988; background:#193988; color: #fff;transition:.2s;}


#header{ position:fixed; left:0; top:0; width:100%; z-index:1000; box-sizing:border-box; color:#fff; background:rgba(0,0,0,.1)}
#header .wrap_in{ gap:0 2em;} 
.logoW{ display:block; width:10em}
.logoW img{ width:100%}
#header .logo > a img{ height:100%; filter:brightness(0) invert(1); display: block;}
#header .gnb_wrap{ margin-left:auto; flex:1}
#header .gnb_wrap .gnb{ justify-content:space-between; flex-wrap: nowrap; width: 100%;}
#header .gnb_wrap .gnb > li{ flex:1 1 auto; justify-content: center;}
#header .gnb_wrap .gnb > li:not(.m_hide){ display:flex}
#header .gnb_wrap .gnb > li .dp1.layer {display: none;}
#header .gnb_wrap .gnb > li .dp1 .va{ position:relative; display:inline-flex; align-items:center; gap:0 .25em}
#header .gnb_wrap .gnb > li .dp1 .va:after{ content:""; position:absolute; left:50%; bottom:0; width:0; height:3px; background:#fff; transform:translateX(-50%); transition:.2s}
#header .gnb_wrap .gnb > li .dp1 .tt{ font-weight:600; font-size:1em}
#header .gnb_wrap .gnb > li .dp1 .va:before{ font-family:xeicon; font-size:1.25em}
/* #header .gnb_wrap .gnb > li.m_deptA .dp1 .va:before{content:"\eb64"}
#header .gnb_wrap .gnb > li.m_deptB .dp1 .va:before{content:"\ead5"}
#header .gnb_wrap .gnb > li.m_deptC .dp1 .va:before{content:"\e995"}
#header .gnb_wrap .gnb > li.m_deptD .dp1 .va:before{content:"\e9cf"} */
#header .gnb_wrap .gnb > li .dp2{ flex:1; position:absolute; left:0; top:100%; width:100%; background:#fff; box-sizing:border-box; padding:2em; padding-left:26em; gap:2em 1em; flex-wrap:wrap; box-shadow:0 1em 1em rgba(0,0,0,.2); visibility:hidden; opacity:0; z-index:-1}
#header .gnb_wrap .gnb > li .dp2:before{ content:attr(data-tit); width:14em; background:#0043b2; box-sizing:border-box; padding:1.5em; position:absolute; left:0; top:0; height:100%; color:#fff; font-weight:700; text-align:right; font-size:1.4em}
#header .gnb_wrap .gnb > li .dp2:after{ content:""; position:absolute; left:17em; width:6em; height:6em; bottom:0; right:0; background:url(../images/inc/logoS.svg) no-repeat; background-size:100% auto; opacity:.15; filter:brightness(0) invert(1)}
#header .gnb_wrap .gnb > li .dp2 > li{ width:16em; min-width: 20em; box-sizing:border-box; min-height:6em}
#header .gnb_wrap .gnb > li .dp2 > li > a{ display:flex; align-items:center; justify-content:center; height:4em; box-sizing:border-box; font-weight:700; color:#111; position:relative}
#header .gnb_wrap .gnb > li .dp2 > li > a.layer {display: none;}
#header .gnb_wrap .gnb > li .dp2 > li > a:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; border:1px solid #ddd; box-sizing:border-box}
#header .gnb_wrap .gnb > li .dp2 > li > a:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; box-sizing:border-box; opacity:0; background:#193988; transition:.2s}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a:before{ transform:translate(.375em, .375em); opacity:1}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{ position:relative; z-index:1; font-size:.96em; width: 80%; margin: 0 auto;}
#header .gnb_wrap .gnb > li .dp2 > li .dp3{ flex-direction:column; gap:.25em 0 ; padding:1em 0; margin-left:.5em}
#header .gnb_wrap .gnb > li .dp2 > li:hover .dp3{ background:#f5f5f5}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a{ color:#666; text-align:left; padding:.25em 1.5em; position:relative}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:before{ content:""; position:absolute; left:.75em; top:.875em; width:.25em; height:.25em; background:#ddd}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a .va{ font-size:1.125em}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:hover{ color:#193988}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:hover:before{ background:#193988}
#header .mem_wrap{ margin-left:auto; display:flex; align-items:center; gap:0 1.5em; padding-left:2em}

#header .gnb_wrap .gnb > li.on .dp1{ font-weight:700}
#header .gnb_wrap .gnb > li.hover .dp1{ font-weight:700; color:#193988}
#header .gnb_wrap .gnb > li.on .dp1 .va:after{ width:90%}
#header .gnb_wrap .gnb > li.hover .dp1 .va:after{ width:90%; background:#193988}
#header .gnb_wrap .gnb > li.hover .dp2{ visibility:visible; opacity:1; z-index: auto;}

#header .gnb_wrap .gnb > li.m_project .dp2 { justify-content: center;padding-left: 0em;}

#header .gnb_wrap .gnb > li.m_deptA .dp2{justify-content: center;}

#header .gnb_wrap .gnb > li.m_deptB .dp2,
#header .gnb_wrap .gnb > li.m_deptC .dp2,
#header .gnb_wrap .gnb > li.m_deptD .dp2 { justify-content: flex-end;}

.scroll #header,
#header.hover{ background:#fff; color:#111; box-shadow:0 0 1em rgba(0,0,0,.05)}
.scroll #header .logo > a img,
#header.hover .logo > a img{ filter:none}


#header .lang_wrap {background: #f4f4f4; padding: .8em 1.4em; border-radius: 2em;}
#header .lang_wrap .lang {position: relative;}
#header .lang_wrap .lang .lang_btn {color: rgba(0, 0, 0, .7);}
#header .lang_wrap .lang .lang_btn .tt {font-weight: 500;}
#header .lang_wrap .lang .lang_btn .xi {font-size: 1rem;}

#header .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: 5px;}
#header.active .lang_wrap.on .lang .drop,
#header.gnbOpen .lang_wrap.on .lang .drop,
#header .lang_wrap.on .lang .drop:hover {background: #fff; border: 1px solid #eee;}
#header .lang_wrap.on .lang .drop {height: fit-content;}
#header .lang_wrap .lang .drop > li {}
#header .lang_wrap .lang .drop > li > a { padding: 0.5em; display: inline-block;}
#header .lang_wrap .lang .drop > li:hover > a {background: #f4f4f4;}
#header .lang_wrap .lang .drop > li > a .tt {font-size: 0.875rem;}

#footer{ z-index:1; border-top:1px solid rgba(0,0,0,.1); /*margin-top:8em;*/ background:#3a3d4c; color:#fff}
#footer .sitemap{ border-bottom:1px solid rgba(255,255,255,.1); padding:2em 0 3em 0; background:rgba(255,255,255,.05)}
#footer .sitemap .gnb{ flex-wrap:wrap; gap:3em 0}
#footer .sitemap .gnb .flex{ flex-direction:column; gap:.75em 0; line-height:1.2}
#footer .sitemap .gnb a{ text-align:left}
#footer .sitemap .gnb a.layer {display: none;}
#footer .sitemap .gnb > li{ flex:1 1 1%; box-sizing:border-box; padding:0 1em}
#footer .sitemap .gnb > li .dp1 .va{ font-size:1.063em; font-weight:600}
#footer .sitemap .gnb > li .dp2{ margin-top:1em}
#footer .sitemap .gnb > li .dp2 a{ opacity:.7}
#footer .sitemap .gnb > li .dp2 a:hover{ opacity:1}
#footer .sitemap .gnb > li .dp2 a:hover > .va .tt{ text-decoration:underline}
#footer .sitemap .gnb > li .dp2 > li .dp3{ display:none}

#footer.mt_none{ margin-top: 0em;}

#footer .info_wrap{ padding:3em 0 4em 0}
#footer .menu{ display:flex; flex-direction:column; gap:1em 0}
#footer .menu > li{ width:100%;}
#footer .menu > li > a{ display:block; padding-right:2em; font-size:1.063em; position:relative; opacity:.6}
#footer .menu > li > a:after{ content:"\e915"; font-family:xeicon; position:absolute; right:0; top:0; transform:rotate(45deg)}
#footer .menu > li > a.point{ font-weight:600; opacity:1}
#footer .logo{ margin-bottom:1.5em; filter:brightness(0) invert(1)}
#footer .logo img{ height:3em}
#footer .info{ overflow:hidden}
#footer .info > li{ float:left; margin-right:2em; margin-bottom:.25em; position:relative}
#footer .info > li:before{ content:""; position:absolute; right:-1em; height:70%; top:50%; transform:translateY(-50%); width:1px; background:#fff; opacity:.2}
#footer .info > li:last-child:before{ display:none}
#footer .info > li.point{ font-weight:600}
#footer .info > li.br{ clear:left}
#footer .copyright{ font-size:.875em; color:#999; text-transform:uppercase; margin-top:.5em}


#contents .doc{ padding-bottom: 8em;}
#contents .doc.p_n{ padding-bottom: 0em;}

#contents{ flex:1}
#contents .sub_visual{ position:relative}
#contents .sub_visual .wrap_bg{ position:absolute; left:0; top:0; width:100%; height:100%}
#contents .sub_visual .wrap_con{ position:relative; box-sizing:border-box; height:15em;}
#contents .sub_visual .wrap_con .slogan_wrap{ color:#fff; text-align:center; padding-top:2.5em}
#contents .sub_visual .wrap_con .slogan_wrap .slogan .t1{ font-size:2.625em; font-weight:700}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb{ justify-content:center; margin-top:1.5em}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2{ gap:.25em}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2 > li > a{ padding:.5em 1em; position:relative; border:1px solid rgba(255,255,255,.2); opacity:.8}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2 > li > a.layer {display: none;}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2 > li > a .va{ font-size:1.125em; font-weight:500}
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2 > li:hover > a,
#contents .sub_visual .wrap_con .slogan_wrap .dp2_wrap .gnb > li.on .dp2 > li.on > a{ opacity:1; background:rgba(0,0,0,.5)}
#contents .sub_nav{ gap:0 1em; padding:.5em 0; margin-bottom:1em}
#contents .sub_nav > li{ font-size:.938em; position:relative}
#contents .sub_nav > li:not(.home):before{ content:"\e940"; font-family:xeicon; position:absolute; left:-1em; top:50%; transform:translateY(-50%) scale(.8)}
#contents .sub_nav > li:last-child .tt{ font-weight:700; text-decoration:underline}
#contents .sub_nav_control{ background:#eff1f5; position:sticky; top:5em; z-index:10}
#contents .sub_nav_control .list{ display:flex}
#contents .sub_nav_control .list > li{ position:relative}
#contents .sub_nav_control .list > li .navBtn{ display:flex; align-items:center; line-height:1.1; height:3.5em; box-sizing:border-box; padding:.25em 1.5em; padding-right:4em; position:relative; border:1px solid transparent; border-bottom:none; z-index:2; box-sizing:border-box}
#contents .sub_nav_control .list > li:not(.home) .navBtn{ min-width:9em}
#contents .sub_nav_control .list > li .navBtn:before{ content:""; position:absolute; right:-1px; top:50%; transform:translateY(-50%); width:1px; height:40%; background:#000; opacity:.1}
#contents .sub_nav_control .list > li .navBtn:after{content:""; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:#fff; display:none}
#contents .sub_nav_control .list > li .navBtn .tt{ font-size:1.125em}
#contents .sub_nav_control .list > li .navBtn .arrow{ position:absolute; right:1em; top:50%; transform:translateY(-50%); transform-origin:50% 25%; font-size:1em; transition:.3s}
#contents .sub_nav_control .list > li .navBtn .arrow:before{content:"\e941"}
#contents .sub_nav_control .list > li.home .navBtn{ width:3.5em; justify-content:center; padding:.25em; color:#193988}
#contents .sub_nav_control .list > li.home .navBtn .xi:before{content:"\eb8f"}
#contents .sub_nav_control .list > li .navWrap{ position:absolute; left:0; top:100%; width: 24em; background:#fff; border-top:1px solid #ddd; visibility:hidden; opacity:0; z-index:-1; box-sizing:border-box; border:1px solid #193988}
#contents .sub_nav_control .list > li .dp2on.navWrap{width: 100%;}
#contents .sub_nav_control .list > li .navWrap .flex{ flex-direction:column}
#contents .sub_nav_control .list > li .navWrap .gnb{ padding:1em}
#contents .sub_nav_control .list > li .navWrap .gnb a{ text-align:left; padding:.375em .5em; padding-right:3em; color:#666; position:relative; transition:.3s; overflow:hidden; font-weight:500}
#contents .sub_nav_control .list > li .navWrap .gnb a.layer {display: none;}
#contents .sub_nav_control .list > li .navWrap .gnb a .va .arrow{ position:absolute; right:0; width:3em; text-align:center; top:50%; transform:translateY(-50%); font-size:.875em; transition:.3s; }
#contents .sub_nav_control .list > li .navWrap .gnb a .va .arrow:before{content:"\e907"}
#contents .sub_nav_control .list > li .navWrap .gnb li:not(.on) > a:hover{ background:#f5f5f5; padding-left:1em; color:#193988}
#contents .sub_nav_control .list > li .navWrap .gnb li:not(.on) > a:hover .va .arrow{ right:0}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a{ color:#193988; font-weight:600}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a .va .arrow{ right:0}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a .va .arrow:before{content:"\e928"}
#contents .sub_nav_control .list > li:hover .navBtn{ background:#fff; color:#193988; border-color:#193988; font-weight:600}
#contents .sub_nav_control .list > li:hover .navBtn:after{ display:block}
#contents .sub_nav_control .list > li.home:hover .navBtn:after{ background:#193988; bottom:0}
#contents .sub_nav_control .list > li:hover .navBtn .arrow,
#contents .sub_nav_control .list > li.on .navBtn .arrow{ transform:rotate(180deg)}
#contents .sub_nav_control .list > li:hover .navWrap,
#contents .sub_nav_control .list > li.on .navWrap{ visibility:visible; opacity:1; z-index:1}
#contents .sub_tit_wrap{ height:8em; display:flex; align-items:center; justify-content:center}
#contents .sub_tit_wrap .tit{ font-weight:700; font-size:2.25em}

#contents .sub_tab{ margin-bottom:3em}
#contents .sub_tab .gnb{ box-shadow:0 0 1em rgba(0,0,0,.1); box-sizing:border-box; overflow:hidden; border-radius: .5em;}
#contents .sub_tab .gnb > li,
#contents .sub_tab .gnb > li .dp2 > li{ width:100%}
#contents .sub_tab .gnb .dp3{ justify-content:center}
#contents .sub_tab .gnb .dp3 > li > a{ display:flex; align-items:center; box-sizing:border-box; height:3.5em; box-sizing:border-box; padding:.5em 2.5em; position:relative; color:#999; position:relative}
#contents .sub_tab .gnb .dp3 > li:not(:last-child) > a:after{ content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); height:30%; width:1px; background:#ddd}
#contents .sub_tab .gnb .dp3 > li > a .va{ font-size:1.25em; font-weight:700; }
#contents .sub_tab .gnb .dp3 > li:hover > a{ color:#193988}
#contents .sub_tab .gnb .dp3 > li.on > a{ background:#193988; color:#fff}
#contents .sub_tab .gnb .dp3 > li.on > a:after{ display:none}

.list.grid_wrap.gsList .grid_item {cursor:pointer}
.main_news .list > li:hover .wrap_in { background: #f0f4ff; transition:.2s}
.main_news .list > li:hover .wrap_in .t1 {color:#193988; transition:.2s}
/*.main_news .list > li:hover .wrap_in:before { border: 1px solid #f0f4ff; transition:.3s}*/
.portPrint { cursor: pointer;padding: 0.45em 1em;margin: 0.25em 0.75em;background: #f0f4ff;color: #193988;font-size: .95em;font-weight: 600;}
.portPrint:hover { background: #193988;color: #f0f4ff; transition:.2s}
.portPrint.black { background: #f1f1f1;color: #333;}
.portPrint.black:hover { background: #333;color: #f1f1f1; transition:.2s}

/*popup*/
.layer_wrap{ position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; visibility:hidden;}
.layer_wrap .layer_frame{ position:absolute; z-index:10000; left:0; top:0; width:100%; height:100%; opacity:0; transition:.1s;}
.layer_wrap .layer_img{ position:absolute; z-index:10000; left:0; top:0; width:100%; height:100%; display:flex; justify-content:center; align-items:center; min-width:0;}
.layer_wrap .layer_img .img{ position:relative; z-index:2; display:inline-block; box-sizing:border-box; padding:.5em; background:#fff; box-shadow:3px 3px .625em rgba(0,0,0,.5);}
.layer_wrap .layer_img .img img{ max-width:80vw; max-height:85vh;}
.layer_wrap .layer_img .layer_bg{ opacity:.8;}
.layer_wrap .layer_img .popClose{ top:0; right:-2.5em; color:#fff;}

.layer_wrap.on{ visibility:visible;}
.layer_wrap.on .layer_frame{ opacity:1;}
.layer_bg{ position:fixed; z-index:1; width:100%; height:100%; left:0; top:0; background:#000; opacity:.5;}
.popClose{ position:absolute; z-index:10000; top:.938em; right:1em; font-size:1em; color:#222; transition:.3s}
.popClose .xi{ font-size:1.750em;}
.popClose .xi:before{ content:"\e921"}
.popClose:hover{ color:#ed4043;}

body.pop{ background:transparent; display:flex; justify-content:center; align-items:center; width:100vw; height:100vh;}
body.pop .popWrap .popTit,
body.pop .popWrap .popTit .tit,
body.pop .popWrap .popIn,
body.pop .popWrap .popIn .popCon{ box-sizing:border-box;}
body.pop .popWrap{ position:relative; display:flex; justify-content:center; align-items:center; max-width:96vw;}
body.pop .popWrap .popTit{ position:absolute; left:0; top:0; width:100%; z-index:3;}
body.pop .popWrap .popTit .tit{ display:flex; align-items:center; width:100%; height:4em; padding:0 1.5em; background:#fff; border-bottom:1px solid #e5e5e5;}
body.pop .popWrap .popTit .tit .t1{ font-size:1.375em; color:#000; font-weight:600;}
body.pop .popWrap .popIn{ position:relative; z-index:2; background:#fff; box-shadow:1px 1px 10px rgba(0,0,0,.6); text-align:left; white-space:normal; width:100%; max-width:96vw; max-height:96vh;}
body.pop .popWrap .popIn .popCon{ padding:3em 1.5em;}
body.pop .popWrap .popTit + .popIn .popCon{ padding-top:6em;}
body.pop .popWrap .popIn .popCon.pd{ padding-top:5em; padding-bottom:1em;}
body.pop .winpopWrap{ padding:1em 1.5em; font-size:16px;}
.choiceFile { justify-content: center;padding: 0.7em 1.1em;background: #e1e9fe; color:#16244b;border-radius: 0.5em;margin: 0 0.5em;cursor:pointer}
.choiceFile:hover { background: #193988; font-weight:500; color:#fff; transition:.2s; } 
.fileDel { color: #111;padding: 0.5em 2em;box-sizing: border-box;border: 1px solid #ddd;border-radius: 0.5em;width: 100%;height: 3em;margin-top: 0.5em; line-height: 1.67em;}

.dp1on .gnb .dp2{ display:none!important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1,
.dp2on:not(.subShow) .gnb > li .dp3{ 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}

.layout1 #contents .sub_visual{ height:0;}
.layout1 #contents .sub_visual .wrap_con,
.layout1 #contents .sub_nav_control{ display:none}
.layout2 #footer{ margin-top:0}
.layout2 #contents .sub_visual .dp2_wrap,
.layout2 #contents .sub_nav_control,
.layout2 #contents .sub_tit_wrap,
.layout2 #contents .sub_tab{ display:none}
.layout2 #contents .sub_visual .wrap_con .slogan_wrap{ padding-top:0; padding-bottom:2em; padding-bottom: 4em;}
.layout2 #contents .layout2_wrap{ background:#fff; position:relative; margin-top:-5em; display:flex}
.layout2 #contents .layout2_wrap .layout2_lnb{ width:18em; padding:2em 2em 8em 2em; box-sizing:border-box; display:flex; flex-direction:column; gap:2em 0; border-right:1px dashed #ddd}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap{ display:flex; flex-direction:column; align-items:center; gap:1em 0}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap .name{ font-size:1.125em}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap .name .point{ vertical-align:baseline; font-weight:700; font-size:1.5em}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap .info{ display:flex; flex-direction:column; align-items:center; gap:.125em 0}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap .info .t1{ color:#999}
.layout2 #contents .layout2_wrap .layout2_lnb .user_wrap .info .t2{ font-weight:600}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap{ border:1px solid #ddd; border-radius:.5em; overflow:hidden}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb,
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb .flex{ display:block}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb a{ text-align:left; position:relative; padding-right:2.5em}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb a:after{ content:"\e93f"; font-family:xeicon; position:absolute; right:0; top:50%; transform:translateY(-50%); width:2em; text-align:center; display:none}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb li.on > a:after{ display:block}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li{ position:relative}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li:before{ content:""; position:absolute; width:100%; left:0; bottom:-1px; border-bottom:1px dashed #ddd}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > a{ padding:1em; display:flex; align-items:center; gap:0 .25em; font-size:1.125em; font-weight:500; line-height:1.1}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > a:before{ content:"\e903"; width:auto; font-family:xeicon; }
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li:hover > a{ font-weight:600; color:#193988}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li.on > a{ font-weight:600; background:#193988; color:#fff}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li.m2_portfolio > a:before{content:"\e961"}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li.m2_question > a:before{content:"\e9c3"}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li.m2_modify > a:before{content:"\e986"}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3{ background:#f5f5f5; padding:1em 0; border-top:1px dashed #ddd}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3 > li > a{ padding:.375em 1.5em; display:flex; gap:0 .5em; color:#666}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3 > li > a:before{ content:"-"; width:auto}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3 > li > a .va{ flex:1}
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3 > li.on > a,
.layout2 #contents .layout2_wrap .layout2_lnb .menu_wrap .gnb > li .dp2 > li > .dp3 > li:hover > a{ font-weight:600; color:#333}
.layout2 #contents .layout2_wrap .layout2_lnb .btn_wrap{ display:flex; align-items:center; justify-content:center}
.layout2 #contents .layout2_wrap .layout2_lnb .btn_wrap .btn{ padding:.25em 1em; border:1px solid #ddd; border-radius:2em; font-size:.875em; color:#777; font-weight:600}
.layout2 #contents .layout2_wrap .layout2_con{ flex:1 1 0%; min-width:0; position:relative}
.layout2 #contents .layout2_wrap .layout2_con .layout2_tit{ display:flex; align-items:center; padding:0 2em; height:5em; box-sizing:border-box; border-bottom:1px dashed #ddd}
.layout2 #contents .layout2_wrap .layout2_con .layout2_tit .tit{ font-weight:700; font-size:1.5em;}
.layout2 #contents .layout2_wrap .layout2_con .doc{padding:2em 2em 8em 2em}
.userIco{ width:4em; height:4em; display:flex; align-items:center; justify-content:center; background:#0043b2; color:#fff; border-radius:50%}
.userIco .userT{ font-weight:700; font-size:1.75em}

/*수료증 출력*/
.pop .printDiv{ border:1px solid #ccc;}
.pop .pop_page_print{ position:relative; background:#fff; letter-spacing:0; width:210mm; max-width:100%; margin:0 auto;  height:800px;} /*800px임의*/
.pop .pop_page_print .bg{ text-align:center; position:relative; top:32%}
.pop .pop_page_print .txt_wrap{ position:absolute; top: 7%; bottom:5.5%; left:5%; right:5%;}
.pop .pop_page_print .txt_wrap .mark{ text-align:center;}
.pop .pop_page_print .txt_wrap .mark img{ width:20%;}
.pop .pop_page_print .txt_wrap .en{ font-family:"Times New Roman", Times, serif;}
.pop .pop_page_print .txt_wrap .tit{ text-align:center;}
.pop .pop_page_print .txt_wrap .tit.kr{ font-size: 2.2em;font-weight: bold;letter-spacing: 0em;text-indent: 0em; margin: 0.7em 0 0.2em;}
.pop .pop_page_print .txt_wrap .tit.en{ font-size:1.250em; color:#666; letter-spacing:.04em; text-indent:.04em;}
.pop .pop_page_print .txt_wrap .tit.kr2{ font-size:1.250em; color:#666; letter-spacing:.04em; text-indent:.04em;}
.pop .pop_page_print .txt_wrap .info{}
.pop .pop_page_print .txt_wrap .info.info_top{ float: left; margin-top: 1em;/*font-family:'바탕체','Batang',sans-serif;*/}
.pop .pop_page_print .txt_wrap .info.info_bottom{ border-width:2px 0 2px 0; border-style:solid; border-color:#888; margin-top:2.750em; padding:0 1em; margin-left:.5em; margin-right:.5em}
.pop .pop_page_print .txt_wrap .info.info_bottom > li{ padding:.7em 0;}
.pop .pop_page_print .txt_wrap .info > li{ padding: 0.4em 0; overflow:hidden;}
.pop .pop_page_print .txt_wrap .info > li .tt{ display:block;}
.pop .pop_page_print .txt_wrap .info > li .t1{ float:left; position:relative; width:6em;}
.pop .pop_page_print .txt_wrap .info > li .t2{ margin-left:7em; letter-spacing: .3em;}
.pop .pop_page_print .txt_wrap .info > li .ls2{ letter-spacing:3.75em;}
.pop .pop_page_print .txt_wrap .info > li .ls3{ letter-spacing:.875em;}
.pop .pop_page_print .txt_wrap .info > li .ls4{ letter-spacing:.25em;}
.pop .pop_page_print .txt_wrap .info > li .dot{ position:absolute; top:0; right:0; letter-spacing:0;}
.pop .pop_page_print .txt_wrap .txt{ line-height:1.8;}
.pop .pop_page_print .txt_wrap .txt.t1{ margin-top: 1.5em; margin-bottom: 0.5em; font-size: 1em;/* text-indent:1em; text-align:justify;*/ text-align: left;/*font-family:'바탕체','Batang',sans-serif;*/}
.pop .pop_page_print .txt_wrap .txt.t11{ margin-top: 0.5em; font-size: 1em;/* text-indent:1em; text-align:justify;*/ text-align: left; /*font-family:'바탕체','Batang',sans-serif;*/}
.pop .pop_page_print .txt_wrap .txt.t2{ margin-top:2em; font-size:.688em;}
.pop .pop_page_print .txt_wrap .txt.f_date{ margin-top: 1.5em; /*font-family:'바탕체','Batang',sans-serif;*/}
.pop .pop_page_print .txt_wrap .sign{ position:absolute; left:0; right:0; bottom: 0.5em; /*padding-right:3em; */text-align:center; z-index:1;}
.pop .pop_page_print .txt_wrap .sign .tt.t1{ display:inline-block; position:relative; font-size: 1.7em; font-weight:bold;}
.pop .pop_page_print .txt_wrap .sign .tt.t2{ display:block; font-size:.750em;}
.pop .pop_page_print .txt_wrap .sign .tt .in{ position:relative; z-index:2;}
.pop .pop_page_print .txt_wrap .sign .stamp{ position:absolute; z-index:-1;left: 90%;top: -85%;}
.pop .pop_page_print .txt_wrap .sign .stamp img{ display:block; /*width:2em; */max-width:none;}
.pop .pop_page_print .print_num{ position:absolute; left:5%; top:4%;}
.pop .pop_page_print .print_num .num{ font-family:'맑은고딕','Malgun Gothic',sans-serif}
html.pop .popWrap.printDiv01 { max-width: 42em;height: 100%;}
.pop .input_st { padding: 0.45em 1em; height: auto;  margin-bottom: 0.5em;}
.pop .table_st { box-shadow: 0 0 2.3em rgba(0,0,0,0);}
.pop .table_st tbody th.col:nth-child(2) { background: #fff;}
.pop .table_st tbody th.col {color: #111;background: #fff;font-size: .9em;font-weight: normal;}
.pop .table_st th, 
.pop .table_st td { height: 0; padding: 0.4em 1em; border: 1px solid #111;border-radius: 0;border-width: 1px 1px 1px 1px;text-align: center;color: #111;line-height: 1.5;background: #fff;font-weight: normal;/*font-family:'바탕체','Batang',sans-serif;*/}
.pop .table_st tbody th.col:first-child { background: #fff;}
.pop .table_st tbody th { background: #fff;}
.pop .sub1_4wd1 {width: 1em;}
.pop .sub1_4wd2 {width: 1em;}
html.pop .popWrap.printDiv01 .popIn {padding:1em;}
.pop .prac .pop_page_print .txt_wrap .sign {/* bottom: 2em;*/    bottom: 0em;}
.pop .plz .pop_page_print .txt_wrap { top: 1%;}
.pop .plz .pop_page_print .txt_wrap .txt.t11 { margin-top: 0.5em; font-size: .9em; /*text-align: center;*/ text-align: left;}
.pop .plz .pop_page_print .txt_wrap .sign {  bottom: 0em;}

/*PRINT*/
@page{ size:auto; margin:10mm -210mm; -webkit-margin-before:0; -webkit-margin-end:0; -webkit-margin-after:0; -webkit-margin-start:0;}
.printBreak{ page-break-before:always;}

@media print {
.pop .pop_page_print{ position:relative; background:#fff; letter-spacing:0; width:180mm; max-width:100%; margin:0 auto;  height:860px;} 
.pop .pop_page_print.it{ position:relative; background:#fff; letter-spacing:0; width:190mm; max-width:100%; margin:0 auto;  height:910px;} 
.pop .pop_page_print.it .txt_wrap .tit.kr { margin: 0em 0 2.5em;}
.pop .pop_page_print.it .page_tbl_wrap { margin-bottom: 3em;}
.pop_page_print.it .txt_wrap .txt.t11 {/*text-align: center;*/text-align: left;}
.pop_page_print.it .txt_wrap {top: 0%;bottom: 0%;}
.pop_page_print.it .f_size1.mt10 {margin-bottom:4em;}
.pop_page_print .f_size1.mt40 { margin-top: 80px !important;}
}

/**/
.mypage_box:not(:first-child){ margin-top:3em}
.mypage_box .box_tit{ margin-bottom:.25em; font-weight:700; font-size:1.375em}
.mypage_box .box_con{ border:1px solid #ddd; border-radius:.5em; padding:1.5em}
.mypage_box .box_con.p1{ padding:.5em 1.5em}

.mypage_box .total{ display:flex; overflow:hidden}
.mypage_box .total > li{ flex:1}
.mypage_box .total > li .wrap_in{ padding:1.5em; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.5em 0; position:relative; text-align:center}
.mypage_box .total > li .wrap_in:before{ content:""; position:absolute; left:-1px; top:-1px; width:100%; height:100%; border:1px dashed #ddd; border-right:none; border-bottom:none}
.mypage_box .total > li .wrap_in .ico{ font-size:2em; color:#ddd}
.mypage_box .total > li .wrap_in .tit .t1{ font-weight:700; font-size:1.188em}
.mypage_box .total > li .wrap_in .tit .t2{ font-weight:500; color:#999}
.mypage_box .total > li .wrap_in .no{ font-weight:900; font-size:1.5em}

.mypage_box .link{ display:flex; overflow:hidden}
.mypage_box .link > li{ flex:1}
.mypage_box .link > li > a{ display:flex; gap:0 .5em; align-items:center; padding:.5em 2em; position:relative}
.mypage_box .link > li > a:before{ content:""; position:absolute; left:-1px; height:100%; border-left:1px dashed #ddd}
.mypage_box .link > li > a .ico{ font-size:1.5em}
.mypage_box .link > li > a .t1{ font-weight:600; font-size:1.063em; flex:1}
.mypage_box .link > li > a .arrow{ font-size:1em; width:2em; text-align:center; margin-left:auto; transition:.3s}
.mypage_box .link > li > a .arrow:before{content:"\e93e"}
.mypage_box .link > li > a:hover{ color:#193988}
.mypage_box .link > li > a:hover .arrow{ transform:translateX(1em)}

.mypage_box .board_table{ border-top:none}
.mypage_box .board_table tr:hover{ background:none}
.mypage_box .board_table tr:last-child td{ border-bottom:none}

.chartWrap{ display:flex; gap:0 3em}
.chartWrap .chartObj.grow{ flex:1 1 0%; min-width:0}
.chartWrap .chartObj.w1{ width:18em}
.chartObj{ height:25em}

/**/
.visualSlider .el{ position:relative; overflow:hidden; height:64vh; background:#fff}
.visualSlider .el .port{ transform:scale(1.1)}
.visualSlider .el.swiper-slide-active .port,
.visualSlider .el.swiper-slide-duplicate-active .port{ transform:scale(1); transition:3s}

.visualSlider_wrap{ position:relative}
.visualSlider_wrap .slogan{ position:absolute; left:0; width:100%; top:50%; transform:translateY(-50%); margin-top:3em; box-sizing:border-box; z-index:10; color:#fff; overflow:hidden; text-align:center}
.visualSlider_wrap .slogan .t1{ font-size:2.75em; font-weight:700}
.visualSlider_wrap .slogan .t2{ font-size:1.25em; margin:.5em 0 0 0}
.visualSlider_wrap .name{ position:absolute; left:0; width:100%; bottom:-.5em; box-sizing:border-box; z-index:10; overflow:hidden; text-align:center}
.visualSlider_wrap .name .t1{ font-size:4em; font-weight:900; text-transform:uppercase; line-height:1; letter-spacing:-1px; white-space:nowrap; word-spacing:.125em; color: transparent; -webkit-text-stroke: 1px #fff; padding-left:5em}
.visualSlider_control{ width:100%; margin-top:3em}
.visualSlider_control .paging{ width:5em; text-align:center;}
.visualSlider_control .paging .swiper-pagination-current{ font-weight:700}

.port{ position:relative; height:100%; overflow:hidden}
.port:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.1)}
.port .parallax-layer{ position:absolute;  max-width:none}

.mainScroll{ position:absolute; left:50%; transform:translateX(-50%); bottom:0; z-index:100; color:#fff}
.mainScroll .line{ position:relative; display:block; height:4em; overflow:hidden}
.mainScroll .line:before{ content:""; position:absolute; left:50%; top:0; height:100%; width:1px; background:#fff;}
.mainScroll .dot{ position:absolute; left:50%; transform:translateX(-50%); top:0; width:.5em; height:.5em; background:#fff; border-radius:50%}
.mainScroll .tt{ display:block; transform:rotate(90deg); font-size:.75em; margin:0 0 2.5em 0}
.mainScroll .tt .xi{ font-size:1.5em; margin-right:.25em}

.main_contents{ overflow:hidden}
.main_box{ padding:4em 0 5em 0}
.main_box.bg1{ background:#f5f5f5}
.main_box .box_flex{ gap:0 10em}
.main_box .box_flex .main_tit{ padding:1em 0 0 1em}

.main_tit{ margin-bottom:2em}
.main_tit.hc{ align-items:center}
.main_tit .tit1{ font-weight:700; font-size:2.25em; text-transform:uppercase;}
.main_tit .tit2{ font-weight:700; font-size:1.75em}
.main_tit .tit3{ font-weight:800; font-size:1.25em}
.main_tit .ico1{ position:relative}
.main_tit .ico1:before{ content:""; position:absolute; top:0; right:100%; transform:translate(-50%,-50%); width:.375em; height:.375em; border-radius:50%; background:#074393}
.main_tit .tt1{ font-size:1.313em; opacity:.7}
.main_tit .tt2{ font-size:1.5em}
.main_tit.white{ color:#fff}
.main_tit.point{ color:#074393}

.scrollS{ position:relative; margin-top:1em}
.scrollS:after{ content:""; width:3em; height:1px; background:#074393; position:absolute; left:2em; top:50%}
.scrollS .xi{ font-size:2em; transform:rotate(90deg); animation-name: scrollS; animation-duration: 5s; animation-iteration-count: infinite}

@keyframes scrollS{
0% { margin-left:-1em }
40% { margin-left:0}
}

.main_data{ padding:2em 0 4em 0}
.main_data .wrap_search{ width:30%; margin-right:6vw; padding-top:2em}
.main_data .wrap_search .search_tit{ display:flex; justify-content:center}
.main_data .wrap_search .search_tit .img{ display:block; height:10em}
.main_data .wrap_search .search{ position:relative; font-size:1.125em}
.main_data .wrap_search .search .inp{ height:3.5em; box-sizing:border-box; background:#fff; box-shadow:0 1em 1em rgba(0,0,0,.1); border:3px solid #074393; width:100%; padding:0 4em 0 1em; color:#074393; font-weight:700}
.main_data .wrap_search .search .inp::placeholder{ font-weight:400}
.main_data .wrap_search .search .btn{ position:absolute; right:0; top:0; width:4em; height:3.5em; background:none; border:none; color:#074393}
.main_data .wrap_search .search .btn .xi{ font-size:1.75em}

.main_data .notice{ background:#193988; color:#fff; padding:0 3em; margin-bottom:1em; gap:0 2em}
.main_data .notice .tit_wrap{ display:flex; align-items:center; gap:0 .25em}
.main_data .notice .tit_wrap .ico{ font-size:1.5em}
.main_data .notice .tit_wrap .ico:before{content:"\ea59"; animation-name: noticeIcoAni; animation-duration:2s; transform-origin:center; animation-timing-function:linear; animation-iteration-count: infinite}
.main_data .notice .tit_wrap .tt{ font-weight:600; font-size:1.125em}
@keyframes noticeIcoAni{
33% {content:"\ea5a"}
66% {content:"\ea5b"}
}
.main_data .notice,
.mainNoticeSlide{ height:3.5em}
.mainNoticeSlide .el{ height:100%}
.mainNoticeSlide .el .in{ height:100%; display:flex; align-items:center;}
.mainNoticeSlide .el .in .tt{ flex:1 1 0%; min-width:0; font-size:1.063em}
.mainNoticeSlide .el .in:hover .tt{ text-decoration:underline}
.mainNoticeSlide .el .in .date{ opacity:.6; margin-left:2em}
.mainNoticeSlide_control{ height:100%; display:flex; flex-direction:column}
.mainNoticeSlide_control > a{ height:50%; width:3em; text-align:center; box-sizing:border-box; border:1px solid rgba(255,255,255,.2); border-bottom:none}
.mainNoticeSlide_control > a .xi{ font-size:1em}
.mainNoticeSlide_control > a.prev .xi:before{content:"\e944"}
.mainNoticeSlide_control > a.next .xi:before{content:"\e941"}
.mainNoticeSlide_control > a:hover{ background:rgba(0,0,0,.2)}

.mainDataSlide .el{ width:16em;}
.mainDataSlide .el .img_wrap{ overflow:hidden}
.mainDataSlide .el .con_wrap{ padding:.75em 1em; position:relative; border:1px solid #ddd; border-top:none}
.mainDataSlide .el .con_wrap .cate{ position:absolute; left:-1px; bottom:100%; background:#000; color:#fff; padding:.5em 1em; font-size:.875em; font-weight:500}
.mainDataSlide .el .con_wrap .cate.c1{ background:#2895a9}
.mainDataSlide .el .con_wrap .cate.c2{ background:#5b65ef}
.mainDataSlide .el .con_wrap .cate.c3{ background:#8561d7}
.mainDataSlide .el .con_wrap .cate.c4{ background:#4a9cf8}
.mainDataSlide .el .con_wrap .tit .t1{ font-weight:600; font-size:1.125em}
.mainDataSlide .el .con_wrap .tit .arrow{ font-size:1em; width:2em; line-height:2em; text-align:center; border-radius:50%; background:#eee; color:#999}
.mainDataSlide .el .con_wrap .tit .arrow:before{content:"\e907"}
.mainDataSlide .el:hover .con_wrap .tit .arrow{ background:#333; color:#fff}
.mainDataSlide_control{ margin-top:.5em; gap:0 .25em}

.main_link{ position:relative; padding-bottom:6em}
.main_link .wrap_obj{ position: absolute}
.main_link .wrap_obj img{ width:100%}
.main_link .wrap_obj.a1{ left:80%; top:20%; width:6em}
.main_link .wrap_obj.a2{ right:-70%; top:50%; width:30em}
.main_link .wrap_bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-position-y:bottom}
.main_link .wrap_con{ position:relative}
.main_link .main_tit{ width:16em; margin-right:6em; position:relative; z-index:10}

.mainLinkSlide .blank{ width:50vw}
.mainLinkSlide .el{ display:flex; flex-wrap:wrap; gap:1em; width:31em; height:31em}
.mainLinkSlide .wrap_in{ height:100%; width:100%; height:100%; position:relative}
.mainLinkSlide .wrap_in.w1{ width:15em}
.mainLinkSlide .wrap_in.h1{ height:15em}
.mainLinkSlide .wrap_in .bg{ position:absolute; left:0; top:0; width:100%; height:100%; opacity:.9; background:#fff }
.mainLinkSlide .wrap_in.c1 .bg{ background:#1f307a}
/*.mainLinkSlide .wrap_in.c2 .bg{ background:#6e89ff}*/
.mainLinkSlide .wrap_in.c2 .bg{ background:#d7663b;}
.mainLinkSlide .wrap_in.c3 .bg{ background:#f8d98f}
.mainLinkSlide .wrap_in.c4 .bg{ background:#1a7ca9}
.mainLinkSlide .wrap_in .con{ height:100%; box-sizing:border-box; position:relative}
.mainLinkSlide .wrap_in .con .ico{ width:auto; height:4em; margin-top:auto; margin-left:auto}
.mainLinkSlide .wrap_in .con .ico img{ height:100%}
.mainLinkSlide .wrap_in.white{ color:#fff}
.mainLinkSlide .wrap_in.white .con .ico{ filter:brightness(0) invert(1)}
.mainLinkSlide .wrap_pd{ padding:2em}
.mainLinkSlide .wrap_tit{ display:flex; flex-direction:column; gap:1em 0; margin-bottom:1em}
.mainLinkSlide .wrap_tit .t1{ font-weight:600; font-size:1.313em}
.mainLinkSlide .wrap_tit.st1{ position:absolute; left:0; top:0; width:100%; box-sizing:border-box; z-index:10}
.mainLinkSlide .wrap_tt1{ font-size:1.125em}
.mainLinkSlide .wrap_tt2{ opacity:.7; font-weight:500}
.mainLinkSlide .el .swiper-container,
.mainLinkSlide .el .swiper-wrapper,
.mainLinkSlide .el .swiper-slide{ height:100%}
.mainLinkSlide .el .swiper-slide{ position:relative}
.mainLinkSlide .el .swiper-slide .layer{ position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2}
.mainLinkSlide .el .swiper-slide.st1{ display:flex}
.mainLinkSlide .el .swiper-slide.st1 > *{ width:50%; height:100%; box-sizing:border-box}
.mainLinkSlide .el .swiper-slide.st2{ display:flex; justify-content:flex-start; align-items:center; height:4em}
.mainLinkSlide .el .swiper-slide.st2{ opacity:.6}
.mainLinkSlide .el .swiper-slide.st2.swiper-slide-active{ opacity:1}
.mainLinkSlide .el .control{ position:absolute; left:0; bottom:0; padding:2em; box-sizing:border-box; gap:0 .25em}
.mainLinkSlide .el .control.w1{ width:50%}
.mainLinkSlide .el .board_st{ display:flex; align-items:center; padding:.5em 0; border-top:1px solid rgba(255,255,255,.2); box-sizing:border-box; width:100%}
.mainLinkSlide .el .board_st .data{ font-weight:700; text-align:center; width:6em; margin-right:1em}
.mainLinkSlide .el .board_st .data .t1{ display:block; font-size:1em; }
.mainLinkSlide .el .board_st .data .t2{ display:block; font-size:1.125em; font-weight:700}
.mainLinkSlide:hover{cursor: url(../images/inc/cursor.svg) 2 2, auto;}

.main_news .list{ display:flex; flex-wrap:wrap;}
.main_news .list > li{ width:20%}
.main_news .list > li .wrap_in{ position:relative; box-sizing:border-box; padding:1.5em; background:#fff; display:flex; flex-direction:column; gap:1em 0}
.main_news .list > li .wrap_in:before{ content:""; position:absolute; left:0; top:0; width:calc(100% + 1px); height:calc(100% + 1px); box-sizing:border-box; border:1px solid #ddd}
.main_news .list > li .wrap_in .cate .ico{ width:1.5em; line-height:1.5em; color:#fff; text-align:center; border-radius:50%; margin-right:.25em}
.main_news .list > li .wrap_in .cate .tt{ font-weight:600; color:#999}
.main_news .list > li .wrap_in .t1{ font-weight:500; font-size:1.125em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word;}
.main_news .list > li .wrap_in .t3{ color:#999; margin-top:1em}
.main_news .list > li.board-notice .wrap_in .cate .ico{ background:#099}
.main_news .list > li.board-notice .wrap_in .cate .ico:before{ content:"\ea5b"}
.main_news .list > li.board-notice .wrap_in .cate .tt:before{ content:"공지사항"}
.main_news .list > li.board-data .wrap_in .cate .ico{ background: #36F}
.main_news .list > li.board-data .wrap_in .cate .ico:before{ content:"\eb96"}
.main_news .list > li.board-data .wrap_in .cate .tt:before{ content:"자료실"}
.main_news .list > li.board-gallery .wrap_in .cate .ico{ background: #FC3}
.main_news .list > li.board-gallery .wrap_in .cate .ico:before{ content:"\ea50"}
.main_news .list > li.board-gallery .wrap_in .cate .tt:before{ content:"갤러리"}
.main_news .list > li.board-news .wrap_in .cate .ico{ background: #693}
.main_news .list > li.board-news .wrap_in .cate .ico:before{ content:"\eb16"}
.main_news .list > li.board-news .wrap_in .cate .tt:before{ content:"교육뉴스"}
.main_news .list > li.board-info .wrap_in .cate .ico{ background: #F66}
.main_news .list > li.board-info .wrap_in .cate .ico:before{ content:"\eb43"}
.main_news .list > li.board-info .wrap_in .cate .tt:before{ content:"임용/진로 정보"}

.main_etc{ position:relative; margin-bottom: 8em;}
.main_etc .wrap_in{ position:relative; height:16vw;}
.main_etc .wrap_in .wrap_bg{ position:absolute; left:0; top:0; width:100%; height:100%; border-radius:0 0 14em 0; overflow:hidden}
.main_etc .wrap_in .wrap_bg .bg,
.main_etc .wrap_in .wrap_bg .vod{ position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover}
.main_etc .wrap_in .wrap_con{ padding:2em; box-sizing:border-box; height:100%; display:flex; align-items:center; text-align:center; color:#fff}
.main_etc .wrap_in .wrap_con .in{ width:100%}
.main_etc .wrap_in .wrap_con .t1{ font-size:1.875em; font-weight:700}
.main_etc .wrap_in .wrap_con .t2{ font-size:1.25em; margin-top:.75em; opacity:.8}
.main_etc .wrap_in .btn{ position:absolute; right:-1em; bottom:-1em; width:12em; height:12em; display:flex; align-items:center; justify-content:center; color:#fff}
.main_etc .wrap_in .btn .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background:#074393; border-radius:50%}
.main_etc .wrap_in .btn .bg.b2{ opacity:.5}
.main_etc .wrap_in .btn .con{ position:relative; text-align:center}
.main_etc .wrap_in .btn .con .t1{ font-weight:600; font-size:1.25em}
.main_etc .wrap_in .btn .con .t1 .xi{ font-size:1em; margin-left:.5em; vertical-align: baseline}

.con.flex.col.wrap_pd.bgGray {background: #f5f5f5;}
.con.flex.col.wrap_pd.bgGray.c2 { background: #f0f4ff;}

.mainEtcBtnAni1{ animation-name: mainEtcBtnAni1; animation-duration:10s; animation-iteration-count: infinite; animation-direction:alternate}
@keyframes mainEtcBtnAni1{
	40% {transform:skew(-5deg) rotate(-360deg); border-radius:30%}
}
.mainEtcBtnAni2{ animation-name: mainEtcBtnAni2; animation-duration:10s; animation-iteration-count: infinite; animation-direction:alternate}
@keyframes mainEtcBtnAni2{
	40% {transform:skew(5deg) rotate(360deg); border-radius:30%}
}

/*agree***************************/
.agree_txt .t1{padding: 2em 0 1em 0; line-height:1.8; font-size:1.063em; color:#666;}
.agree_box{ border:1px solid #ddd; box-shadow:1px 1px 1em rgba(0,0,0,.2); padding:2em}
.agree_box .tit{ font-size:1.188em; font-weight:500; color:#111; margin-bottom:1em; margin-top:2em}
.agree_box .tit:first-child{ margin-top:0}
.agree_box .con{ font-size:.875em; color:#666; line-height:1.6}
.agree_box .con.hSt {overflow-y:scroll; height:10em;}
.agree_box .con > *{padding-top:.5em;}
.agree_box .check{ border-top:1px solid #ddd; margin-top:1.5em; padding-top:1em}
label_st.agree_box ul{ margin-top:1em}
.agree_box table{ margin:1em 0; width:100%}
.agree_box table th,
.agree_box table td{ border:1px solid #ddd; padding:1em}
.agree_box table th{ background:#f5f5f5}
.agree_box p strong{ font-size:1.125em; color:#333}
.agree_box a{ vertical-align:top; color:#666; text-decoration:underline}
.agree_box a:hover{ opacity:.6}
.agree_box strong{ vertical-align:top; font-weight:500}
.agree_big_ti {padding:3em 0;}
.agree_big_ti > i {font-size:2.5em; text-align:center; font-weight:700;}

/*MEMBER***************************/
.member_wrap{ margin-top:-3em}
.member_wrap .login_box{ width: 40em; max-width:100%; margin:0 auto;}
.member_wrap .join_box { width: 40em; max-width:100%; margin:0 auto;}
.member_wrap .cert_box { width: 40em;; max-width:100%; margin:0 auto;}
.member_wrap .join_box.paper_fin_St {width: inherit;} /*설문조사 완료 박스*/

.member_wrap .member_tit{ padding:1em 0 1.5em 0; text-align:center;}
.member_wrap .member_tit .tit { margin-bottom:.3em; font-size:2.500em; color:#3c3c3d; font-weight:700; text-transform:uppercase;}
.member_wrap .member_tit .tit2{ font-size:1.750em; color:#3c3c3d; font-weight:700; letter-spacing:-1px;}
.member_wrap .member_tit .txt { color:#72727d; line-height:1.5em;}
.member_wrap .member_tit .c1{ color:#3c3c3d;}

.member_wrap .member_tab{ text-align:center; padding:0 1px 0 0;}
.member_wrap .member_tab > li{ width:50%;}
.member_wrap .member_tab > li .in{ position:relative; z-index:1; margin:0 -1px -1px 0; padding:1em .5em; background:#f0f0f0; border:1px solid #d4d5d8; font-size:1.125em; color:#72727d;}
.member_wrap .member_tab > li.on .in{ z-index:2; background:#fff; border-bottom-color:transparent; color:#193988;}
.member_wrap .member_tab > li.on .in:before{ content:""; position:absolute; top:-1px; left:-1px; right:-1px; height:4px; background:#193988;}

.member_wrap .member_form{ padding:2.5em 2em; border:1px solid #d4d5d8; border-top:3px solid #193988}
.member_wrap .member_form.st2{ border-top-width:4px; border-top-color:#193988;}
.member_wrap .member_form.st3{ padding:0; border-top-color:#313851;}

.member_wrap .form > li:first-child{ margin-top:0;}
.member_wrap .form .inp_wrap{ position:relative; margin-top:.4em;}
.member_wrap .form .inp_wrap .xi{ position:absolute; z-index:2; top:0; left:0; width:4em; line-height:3.5em; text-align:center; font-size:1em; color:#3c3c3d;}
.member_wrap .form .inp_wrap .xi:before{ font-size:1.750em;}
.member_wrap .form .inp_wrap .inp{ box-sizing:border-box; width:100%; height:3.5em; padding:0 1em 0 4.5em; background:#fff; border:1px solid #ddd; border-radius:.3em; color: #888; font-weight: 400; }
.member_wrap .form .inp_wrap .inp_sel{ background:transparent;}
.member_wrap .form .inp_wrap .inp:focus{ border-color:#193988;}
.member_wrap .form .inp_wrap textarea { border-radius:.3em;}
.member_wrap .form .btn_wrap{ margin-top:1.2em;}
.member_wrap .form .btn_wrap .btn{ margin:.4em 0; font-size:1.125em;}
.member_wrap .form .btn{ display:block; box-sizing:border-box; text-align:center; width:100%; padding:.8em 1em; border:1px solid #193988; border-radius:.3em;}
.member_wrap .form .btn.c1{ background:#193988; color:#fff;}
.member_wrap .form .btn.c2{ background:#ffffff; color:#193988;}
.member_wrap .form .etc_wrap{ margin-top:1.5em;}
.member_wrap .form .etc_wrap .find{ text-align:right;}
.member_wrap .form .etc_wrap .find .link{ position:relative; display:inline-block; *display:inline; zoom:1; vertical-align:middle; margin-left:.8em; padding-left:.8em;}
.member_wrap .form .etc_wrap .find .link:before{ content:""; position:absolute; top:10%; left:0; width:1px; height:80%; background:#ccc;}
.member_wrap .form .etc_wrap .find .link:first-child{ margin-left:0; padding-left:0;}
.member_wrap .form .etc_wrap .find .link:first-child:before{ display:none;}
.member_wrap .form .etc_wrap .find .link:hover{ text-decoration:underline;}
.member_wrap .form .id_wrap{ padding:3em 1em; background:#f5f5f5; border:1px solid #e5e5e5; border-radius:.3em; text-align:center; font-size:1.125em;}
.member_wrap .form .id_wrap strong{ vertical-align:baseline; color:#193988; letter-spacing:0;}
.member_wrap .form .pw_wrap{ padding:3em 1em; background:#f5f5f5; border:1px solid #e5e5e5; border-radius:.3em; text-align:center; font-size:.938em; color:#3c3c3d; line-height:1.8;}

.member_wrap .form .cer_wrap > li{ width:33.33%; text-align:center;}
.member_wrap .form .cer_wrap > li .inner{ margin:0 1px; padding:1em .6em; background:#ecf0f4;}
.member_wrap .form .cer_wrap .icon .in{ display:inline-block; width:4em; height:4em; background:#fff; border-radius:100%;}
.member_wrap .form .cer_wrap .icon .in img{ max-height:2.5em;}
.member_wrap .form .cer_wrap .txt{ margin-top:1em; height:3em;}
.member_wrap .form .cer_wrap .btn{ padding:.4em .4em;}

.member_wrap .terms_wrap .all_check{ padding:1em 0; border-bottom:1px dashed #bbb; font-size:1.063em;}
.member_wrap .terms_wrap > li{ padding-top:1.5em;}
.member_wrap .terms_wrap > li:first-child{ padding-top:0;}
.member_wrap .terms_wrap .tit{ margin-bottom:.6em; font-size:1.250em; color:#3c3c3d; font-weight:500}
.member_wrap .terms_wrap .tit *{ vertical-align:baseline;}
.member_wrap .terms_wrap .c1{ color:#d82744;}

.member_btn_wrap{ margin:2em 0 0 ; text-align:center;}
.member_btn_wrap > li{ width:50%;}
.member_btn_wrap .in{ margin:0 .2em;}
.member_btn_wrap .input_st{ width:100%; min-width:40% !important; border-radius: 0.3em;}

.member_agree .agree{ padding:3em; border:solid #ddd; border-width:2px 1px 1px 1px; border-top-color:#333; font-size:1em; color:#777; line-height:1.5em;}
.member_agree .agree.H{ padding:1em 1.5em; border-top-width:1px; height:10em; overflow-y:scroll;}
.member_agree .agree p{ padding:.5em 0;}
.member_agree .agree *{ vertical-align:baseline;}
.member_agree .agree strong{ color:#333;}
.member_agree .check{ padding:1em 2em; border:solid #ddd; border-width:0 1px 1px 1px; border-radius:0 0 .6em .6em; text-align:right;}

.member_wrap .form2{ margin-top:1.5em; padding-top:1.5em; border-top:1px dashed #ccc;}
.member_wrap .form2:first-child{ margin-top:0; padding-top:0; border-top:none;}
.member_wrap .form2 > li{ margin-top:.4em; font-weight:300;}
.member_wrap .form2 > li:first-child{ margin-top:0;}
.member_wrap .form2 .inp_wrap{ color:#3c3c3d;}
.member_wrap .form2 .inp_wrap select.input_st,
.member_wrap .form2 .inp_wrap input[type=text].input_st,
.member_wrap .form2 .inp_wrap input[type=password].input_st{ background-color:transparent;}
.member_wrap .form2 .inp_wrap input[disabled=disabled].input_st{ background-color:#f5f5f5;}
.member_wrap .form2 .inp_txt2 { font-size: .9em; font-weight: 500; margin-top: 1em; color: #555; }
.member_wrap .form2 .check_wrap > *{ display:inline-block; *display:inline; zoom:1; vertical-align:middle;}
.member_wrap .form2 .check_wrap .label_sec{ min-width:5em}
.member_wrap .form2 .check_wrap .label_sec span {vertical-align:text-top}
.member_wrap .form2 .check_wrap .label_wrap{ width:100%;}
.member_wrap .form2 .check_wrap .label_wrap > *{ width:33.33%; margin:.2em 0;}
.member_wrap .form2 .check_wrap .label_tit{ position:relative; min-width:14em; margin-right:2em}
.member_wrap .form2 .check_wrap .label_tit:after{ content:""; position:absolute; right:0; top:0; height:100%; width:1px; background:#ccc;}
.member_wrap .form2 .ess{ display:none;}
.member_wrap .form2 .required .ess{ display:inline-block;}
.member_wrap .form2 .field{ position:relative;}
.member_wrap .form2 .field .txt{ position:absolute; z-index:1; top:50%; left:1.2em; transform:translate(0, -50%); transition:transform .2s ease-out; transform-origin:0 0; font-weight: 500;}
.member_wrap .form2 .field.on .txt{ color:#69696b; transform:translate(0, -100%) scale(.7,.7);}
.member_wrap .form2 .col .col_w1{ width:65.68%; margin-left:1%;}
.member_wrap .form2 .col .col_w1:first-child{ width:66.66%; margin-left:0;}
.member_wrap .form2 .col .col_w2{ width:32.34%; margin-left:1%;}
.member_wrap .form2 .col .col_w2:first-child{ width:33.32%; margin-left:0;}
.member_wrap .form2 .required .field > input { border-radius: 0.3em; font-weight: 500; }

.member_wrap .form2 .tit.input_st{ background:#f5f5f5;}
.member_wrap .form2 .check_st{ position:relative; text-align:center; border-color:transparent; cursor:pointer;}
.member_wrap .form2 .check_st .on{ position:absolute; top:-1px; bottom:-1px; left:-1px; right:-1px; background:#fff; border:1px solid #095282; border-radius:5px;}
.member_wrap .form2 .check_st .on ~ span{ position:relative; color:#095282;}
.member_wrap .form2 .check_st:hover input ~ .on,
.member_wrap .form2 .check_st input:checked ~ .on{ background:#095282;}
.member_wrap .form2 .check_st:hover input ~ .on ~ span,
.member_wrap .form2 .check_st input:checked ~ .on ~ span{ color:#fff;}
.member_wrap .form2 .check_st input[type=checkbox],
.member_wrap .form2 .check_st input[type=radio]{ width:0; height:0; overflow:hidden; opacity:0;}


.join_table{ border-top:1px solid #666;}
.join_table th,
.join_table td{ height:2.25em; padding:.75em 1.5em; border-bottom:1px solid #e8e8e8; text-align:left; font-size: 1.05em;}
.join_table th{ color:#3c3c3d; padding-right:.8em; background:#f8f8f8;}
.join_table td{ color:#72727d;}
.join_table .checkShow td{ padding-left:0; padding-right:0;}
.join_table .input_st,
.board_btn_wrap > button { border-radius: 0.3em; }

.join_in_box{ padding:.4em .8em; border:1px solid #ddd; background:#f7f7f7;}
.join_in_box:first-child{ margin-top:0 !important;}
.join_in_box > li{ margin-top:.8em; padding-top:.6em; border-top:1px dashed #ccc;}
.join_in_box > li:first-child{ margin-top:0; padding-top:0; border-top:none;}
.join_in_box .tit{ position:relative; margin:.4em 0 .4em 0; padding-left:.8em; color:#193988;}
.join_in_box .tit:before{ content:""; position:absolute; top:.45em; left:0; width:.35em; height:.35em; background:#193988; border-radius:100%;}

.join_finish{ padding:1em 0 2em; text-align:center;}
.join_finish .tit{ margin-bottom:1em; font-size:1.375em; font-weight:500; letter-spacing:-1.5px;}
.join_finish .txt{ color:#999; line-height:1.5em; font-size: 1.1em;}
.join_finish .txt strong{ color:#193988; vertical-align:baseline;}
.join_finish .join_table{ width:90%; margin:2em auto 0 auto;}


/**/
.page_step_wrap{ margin-bottom:2em; text-align:center;}
.page_step_wrap .step{ display:inline-block; *display:inline; zoom:1;}
.page_step_wrap .step > li .in{ position:relative; padding:0 1.5em; min-width:8em; color:#aaa;}
.page_step_wrap .step > li .in:before{ content:"\e940"; font-family:xeicon; position:absolute; font-size:2.000em; color:#ddd; top:.2em; left:-.5em;}
.page_step_wrap .step > li:first-child .in:before{ display:none;}
.page_step_wrap .step > li .in > *{ position:relative; display:block;}
.page_step_wrap .step > li .in .xi{ margin:.2em 0 .6em 0; font-size:2.500em;}
.page_step_wrap .step > li .in .xi:before{ position:relative; z-index:2;}
.page_step_wrap .step > li .in .xi:after{ content:""; position:absolute; z-index:1; top:50%; left:50%; transform:translate(-50%, -50%); width:1.6em; height:1.6em; background:#e8e8e8; border-radius:100%;}
.page_step_wrap .step > li .in .no{ font-size:.688em; font-weight:700; text-transform:uppercase;}
.page_step_wrap .step > li .in .tt{ font-size:1.125em;}
.page_step_wrap .step > li.on .in{ color:#3c3c3d;}
.page_step_wrap .step > li.on .in .xi{ color:#fff;}
.page_step_wrap .step > li.on .in .xi:after{ background:#193988;}
.page_step_wrap .step > li.on .in .no{ color:#193988;}


/*LOGIN***************************/
.login_wrap{ position:fixed; width:100%; height:100%; left:0; top:0; align-items:center; background:#1d335a; background:url(../images/sub/login_bg.jpg) no-repeat 50% 50%; background-size:cover;}
.login_wrap .login{ width:600px; max-width:94%; margin:0 auto; padding:1em 0 5em 0;}
.login_wrap .login_tit{ margin-bottom:1em; text-align:center; color:#fff;}
.login_wrap .login_tit .logo img{ width:17em;}
.login_wrap .login_tit .tit{ margin-top:.6em;}
.login_wrap .login_tit .tit > *{ display:inline-block;}
.login_wrap .login_tit .tit .t1{ font-size:1.500em; font-weight:700; padding:.4em .25em 0 0;}
.login_wrap .login_tit .tit .t2{ font-size:3.000em; margin-left:.25em;}
.login_wrap .login_con{ background:#fff; box-shadow:0 2px 3px rgba(0,0,0,.2); border-radius:.6em; overflow:hidden;}
.login_wrap .login_con .tab{ align-items:stretch; align-items:center; text-align:center;}
.login_wrap .login_con .tab > li{ flex:1;}
.login_wrap .login_con .tab > li > a{ display:block; padding:1.2em 1em; background:#ecf0f4; border:solid #d4d5d8; border-width:0 0 1px 1px; color:#333; font-weight:700;}
.login_wrap .login_con .tab > li:first-child > a{ border-left-width:0;}
.login_wrap .login_con .tab > li.on > a{ background:#fff; border-bottom-color:#fff; color:#005bbb;}
.login_wrap .form_wrap{ padding:3em 2em; background:#fff;}
.login_wrap .form_wrap .form > li{ margin-top:.6em;}
.login_wrap .form_wrap .form > li:first-child{ margin-top:0;}
.login_wrap .form_wrap .form > li .in{ position:relative; padding:0 1em 0 4em; border:1px solid #ddd; border-radius:.25em; overflow:hidden;}
.login_wrap .form_wrap .form > li .in .xi{ position:absolute; top:0; left:0; width:4em; line-height:4em; background:#ecf0f4; border-right:1px solid #ddd; text-align:center; font-size:1em;}
.login_wrap .form_wrap .form > li .in .xi:before{ font-size:1.500em; color:#333;}
.login_wrap .form_wrap .form > li .in .inp{ width:100%; box-sizing:border-box; padding:1em 0 1em 1em; height:4em; border:none; background:none; font-weight:700;}
.login_wrap .form_wrap .form > li.btn_wrap{ margin-top:2em; align-items:center;}
.login_wrap .form_wrap .form > li.btn_wrap .check{ font-size:.938em; font-weight:700;}
.login_wrap .form_wrap .form > li.btn_wrap .btn{ padding:0 2em; height:3.5em; border-radius:.25em; background:#3086c9; color:#fff; font-weight:700; border:none; min-width:40%;}

.login_wrap .link_wrap{ padding:1em .2em; align-items:center; border-top:1px dotted rgba(255,255,255,.3);}
.login_wrap .link_wrap .xi{ line-height:1;}
.login_wrap .link_wrap .t1{ font-size:.813em; color:#fff;}
.login_wrap .link_wrap .t1 .xi{ font-size:1.5em;}
.login_wrap .link_wrap .t2{ padding:.6em 1.5em; background:#193988; border-radius:6em; font-size:.938em; color:#fff; font-weight:700; text-transform:uppercase;}
.login_wrap .link_wrap .t2 .tt{ display:inline-block; padding:0 .25em;}
.login_wrap .link_wrap .t2:hover .tt{ text-decoration:underline;}

.myinfo_wrap { position: relative; }
.myinfo_wrap .myinfo_modal { position: absolute; background: #fff; border: 1px solid #ddd; padding: 0.7em; display: none; }
.myinfo_wrap .myinfo_modal.m1 { left: 9em; top: 11em; }
.myinfo_wrap .myinfo_modal.m2 { left: 9em; top: 15em; }
.myinfo_wrap .myinfo_modal.m3 { left: 9em; top: 19em; }
.myinfo_wrap .myinfo_tit { /*border-top: 2px solid #333;*/ border-bottom: 1px solid #666; padding: 1em .5em; }
.myinfo_wrap .myinfo_tit .btn { font-size: .938em; }
.myinfo_wrap .myinfo_con { border: 1px solid #ddd;border-radius: .5em; margin: 0 0.2em 0.5em; }
.myinfo_wrap .myinfo_con .tit { width: 13em; background: rgb(248, 248, 248); padding: 1em 0; border-radius: 0.5em 0 0 0.5em;}
.myinfo_wrap .myinfo_con .tit > .circle > .xi { font-size: .95em; padding-left: .3em; color: #ff473e; }
.myinfo_wrap .myinfo_con .txt { flex: 1; padding: 1em 0 1em 1em; }
.myinfo_wrap .myinfo_con .txt.situation { flex: 1 1 12.16%; max-width: 12.16%; }
.myinfo_wrap .myinfo_con .txt.situation > a > .t14 { display: inline; }
.myinfo_con.st2 {border:1px solid #ddd;}

.board_search_wrap {  }
.board_search_wrap .sel { margin-right: .25em; }
.board_search_wrap button { width: 8em; }
.board_search_wrap .date2 { margin-left: .25em; }
.input_calendar{ position:relative; display:inline-block}
.input_calendar .xi{ position:absolute; left:.5em; top:.375em}
.input_calendar .xi:before{content:"\e9a4"; font-size:1.5em; color:#aaa}

.appList_wrap > .page_tbl_Wrap .board_st .date {  }
.appList_wrap > .page_tbl_Wrap .board_st .num { font-weight: 600; }

/**/
.grWrap{ display:flex; width:100%; height: 100vh}
.grWrap .gr-gallery{ flex:1 1 0%; min-width:0}

.grWrap .grUtil{ width:20em; height:100%; color:#fff; position:relative; z-index:1}
.grWrap .grUtil:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:5em; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); transform:skewX(-45deg); transform-origin:right bottom; opacity:.5}
.grWrap .grUtil .wrap_in{ position:relative; z-index:1; box-sizing:border-box; height:100%; padding:2em; background:url(../js/wall/images/util.jpg); background-size:100% auto; display:flex; flex-direction:column; gap:2em 0}
.grWrap .grUtil .logo{ filter:brightness(0) invert(1)}
.grWrap .grUtil .figureListWrap{ flex:1 1 0%; min-height:0; display:flex; flex-direction:column; gap:.5em 0}
.grWrap .grUtil .figureListWrap .subject{ text-align:center; line-height:1.2; padding:1em; box-shadow:0 0 1em rgba(0,0,0,.5); background:rgba(0,0,0,.1); border:1px solid #fee494; color:#fee494}
.grWrap .grUtil .figureListWrap .subject .t1{ font-weight:700; font-size:1.125em}
.grWrap .grUtil .figureListWrap .figureList{ flex:1 1 0%; min-height:0; overflow-x:hidden}
.grWrap .grUtil .figureListWrap .figureList > li{ margin-top:.25em; display:block; padding:.5em 1em; background:rgba(255,255,255,.1); cursor:pointer; font-size:.938em; position:relative; border:1px solid rgba(255,255,255,.1)}
.grWrap .grUtil .figureListWrap .figureList > li:hover{ background:rgba(0,0,0,.2); border-color:rgba(255,255,255,.3)}
.grWrap .grUtil .figureListWrap .figureList > li:after{ content:"\e90b"; font-family:xeicon; position:absolute; right:-3em; top:50%; transform:translateY(-50%)}
.grWrap .grUtil .figureListWrap .figureList > li:hover:after{ transition:.3s; right:.75em}
.grWrap .grUtil .toggleBtn{ position:relative; display:flex; align-items:center; gap:0 .5em}
.grWrap .grUtil .toggleBtn .tit{ margin-left:auto; font-weight:600; font-size:.875em}
.grWrap .grUtil .toggleBtn .btn{ width:5em; height:2em; border-radius:2em; box-sizing:border-box; padding:.25em; position:relative; display:flex; align-items:center; cursor:pointer; box-shadow:1px 1px .5em rgba(0,0,0,.5) inset}
.grWrap .grUtil .toggleBtn .btn:before{ display:block; font-size:.75em; font-weight:900; transition:.5s}
.grWrap .grUtil .toggleBtn .btn:after{ content:""; position:absolute; width:2em; height:2em; border-radius:50%; background:linear-gradient(-45deg, #fff 50%, #aaa 100%); box-sizing:border-box; border:1px solid #fff; transition:.5s}
.grWrap .grUtil .toggleBtn.on .btn{ background:#193988}
.grWrap .grUtil .toggleBtn.off .btn{ background:#aaa}
.grWrap .grUtil .toggleBtn.on .btn:before{ content:"ON"; padding-right:3em; margin-left:auto}
.grWrap .grUtil .toggleBtn.off .btn:before{ content:"OFF"; padding-left:3em;}
.grWrap .grUtil .toggleBtn.on .btn:after{ right:0}
.grWrap .grUtil .toggleBtn.off .btn:after{ right:100%; transform:translateX(100%)}

.grIntro{ position: absolute; z-index:10000; left:0; top:0; width:100%; height:100%; display:flex; justify-content:center; align-items:center; box-sizing:border-box; padding:1.5em}
.grIntro .introTit{ position:relative}
.grIntro .introTit .t1{ font-weight:900; font-size:3.5em; padding:.25em 1em; background-image: linear-gradient(0deg, #fef9ce 0%, #fee494 10%, #a2722a 22%, #d19f4a 41%, #fee08b 56%, #f8e9a7 70%, #dbb565 80%, #cf9f4a 84%, #a97a2b 92%, #cd9d46 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.grIntro .bg{ position: absolute; top:0; width:50%; height:100%; overflow:hidden; background:#333}
.grIntro .bg:before{ content:""; position:absolute; top:0; width:200%; height:100%; background:url(../js/wall/images/intro.jpg); background-size:100% 100%}
.grIntro .bg.left{ left:0}
.grIntro .bg.right{ right:0}
.grIntro .bg.left:before{ left:0; background-position:right top}
.grIntro .bg.right:before{ right:0; background-position:left top}

.load .grIntro .introTit{ transition:1s; opacity:0; transition-delay:2s}
.load .grIntro .bg{ transition:2s; transition-delay:3s}
.load .grIntro .bg.left{ left:-100%}
.load .grIntro .bg.right{ right:-100%}
.load .grIntro{ visibility:hidden; transition-delay:5s}
.grWrap{ opacity:0}
.load .grWrap{ opacity:1}

/*서브 폰트*/
.v_base{ vertical-align: baseline;}
.sub_tit .t1{ text-transform: uppercase; font-weight: 700; font-size: 2.85em;}
.sub_tit .t2{ font-size: 1.75em; font-weight: 600;}
.sub_tit .t3{ font-size: 1.35em; font-weight: 600;}
.sub_tit .t4{ font-size: 1.125em;  font-weight: 500; line-height: 1.6; color: #555;}
.sub_tit .t5{ font-size: 2.25em; text-transform: uppercase; font-weight: 600;}
.sub_tit .t6{ font-size: 1.05em; font-weight: 500; line-height: 1.4;}

.se_pad{ padding: 4em 0; margin: 4em 0;}
.se_pad.mb_n{ margin: 4em 0 0 0;}

/*연혁*/
.history_bgw {overflow:hidden; position:relative; border-radius: 1.5em;}
.history_bgw .bg_w {position:absolute; left:0; top:0; width:100%; height:100%; background-position:center top; background-repeat:no-repeat; background-size:cover;}
.history_bgw .txt_wrap {text-align:center; }
.history_bgw .txt_wrap .en {font-weight: 700;  padding-bottom:.5em; color:#fff; letter-spacing:-1px; font-size:2.5em;}
.history_bgw .txt_wrap .kr {font-size:1.7em; color:#fff; font-weight:500;}
.history_bgw .line_wrap{ position:relative; height:20em;}
.history_bgw .line_wrap .line{ position:absolute; background:#fff; width:1px; height:1px; transition:1s; opacity:.5; display:none;}
.history_bgw .line_wrap .line.hor{ transition-delay:1s}
.history_bgw .line_wrap .line.top{ top:0}
.history_bgw .line_wrap .line.bot{ bottom:0}
.history_bgw .line_wrap .line.left{ left:0}
.history_bgw .line_wrap .line.right{ right:0}
.load .history_bgw .line_wrap {margin:2em 1.5em;}
.load .history_bgw .line_wrap .line.ver{ height:100%}
.load .history_bgw .line_wrap .line.hor{width:40%;}
.load .history_bgw .line_wrap .line{ display:block}

.sub_history_img { text-align:center; }
.sub_history_tit{ text-align:center; padding:60px 0; background:url(../images/sub/history_top.jpg) no-repeat bottom center; box-shadow:1px 5px 10px rgba(0,0,0,0.3); display:none}
.sub_history_tit .t1{ font-size:2em; color:#003f87; letter-spacing:-1px; padding-right:30px; font-weight:600}
.sub_history_tit .t2{  font-size:.938em; color:#333; margin-top:10px;  padding-right:30px;}
.sub_history_tit .t1 .col {color:#F00;}
.sub_history_wrap{position:relative;z-index:inherit;padding-left: 420px;}
.sub_history_wrap .sub_history_line{position:absolute;z-index:inherit;width:1px;background:#ddd;left: 381px;height:100%;margin-left:1px;top:-80px;}
.sub_history_wrap .sub_history > li{ position:relative; z-index:inherit; width:100%; margin-top:5em; padding-bottom:60px; border-bottom:1px dotted #ccc}
.sub_history_wrap .sub_history > li:last-of-type{ border-bottom: none;}
.sub_history_wrap .sub_history > li .history{ padding:0 20px;}
.sub_history_wrap .sub_history > li .history:before{content:''; position:absolute; top:20px;  left:-42px; width:10px; height:10px; background:#292c6f
; border-radius:100%;}
.sub_history_wrap .sub_history > li .history .year{ font-weight:600; font-size:2.875em;  font-weight:700;/* color:#003f87;*/ position:relative; z-index:inherit; letter-spacing:-1px; color: #444;}
.sub_history_wrap .sub_history > li .history .list{ position:relative; z-index:inherit; margin-top:15px; padding-left:1.5em}
.sub_history_wrap .sub_history > li .history .list .tt{ display:block; font-size:1.15em; font-weight: 500; color:#222; line-height:1.4; margin-bottom:15px; vertical-align:middle;}
.sub_history_wrap .sub_history > li .history .list .txt {position:relative; padding-left:10px;}
.sub_history_wrap .sub_history > li .history .list .txt:before {position:absolute; content:""; width:5px; height:2px; background:#888; left:0; top:10px;}
.sub_history_wrap .sub_history > li .history .list .month{ min-width:80px; display:inline-block; color:#003f87;}
.sub_history_wrap .sub_history > li .history_img{margin-bottom:1em;clear:both;position:absolute;left: -45%;top:0;}
.sub_history_wrap .sub_history > li .history_img > li{ margin-right:.3em; width:100%;margin-top:1em;}
.sub_history_wrap .sub_history > li .history_img > li:first-child {margin-top:0}
.sub_history_wrap .sub_history > li .history .list:before{ content:"\e91b"; position:absolute; left:0; font-family:'xeicon'; color:#888}
.sub_history_wrap .sub_history > li .history_img img{ max-width:240px}

/*인사말*/
.gree_bg{ position:relative; height: 25em; width: 100%; border-radius:1.5em;}
.gree_bg:after{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.05); content: ''; border-radius: 1.5em;}
.gree_bg .g_bg_t{ position:relative; width: 80%; margin: 0 auto; padding: 5em 3em 0 3em; box-sizing: border-box; z-index: 2; }
.gree_con{ justify-content: center;}
.gree_con .g_t{ width: 80%; position: relative; top: -8em; background: #fff; box-sizing: border-box; padding: 5em 3em 0 4em; border-radius: 1.5em; gap: 4em; margin: 0 auto; align-items: center; z-index: 2;}
.gree_con .g_t .g_left{ flex: 1 1 50%;}
.gree_con .g_t .g_right{ flex: 1 1 50%; height: 30em;}
.gree_con .g_t .g_right > img{ height: 100%; width: 100%; object-fit: cover; border-radius: 1.5em;}
.g_line{ width: 100%; height: 2px; background: #ddd; margin: 2em 0; opacity: .85;}
.ceo_sign{ align-items: baseline;}
.ceo_name{ margin-left: .5em; font-size: 1.45em; color: #111;}

.page_bottom > .list > li{ width:33.33%; filter:grayscale(1);}
.page_bottom > .list > li:nth-child(n + 4){ flex:25%;}
.page_bottom > .list > li:nth-child(3) .resize{ border-top-right-radius: 5em;}
.page_bottom > .list > li:nth-child(1) .resize{ border-top-left-radius: 5em;}

/**절차**/
.process{}
.process > li{width:calc( ( 100% - 100px) / 3);margin-bottom:50px;padding: 1.5em;box-sizing:border-box;border-radius:.5em;background: rgba(0,96,174,.1);word-break:keep-all;position:relative;color: #eff1f5;font-size: 1.05em;font-weight: 600; box-shadow: 0 0 1em rgba(0,0,0,.25);}
.process > li::after{ content:"\e907"; font-family:xeicon; font-weight:700; font-size:1.5em; color:#348AC7; position:absolute; right:-38px; top:50%; transform:translateY(-50%);}
.process > li:last-child:after{ display:none;} 
.process > li:first-child { background: linear-gradient(to right, #193988,#348AC7)}
.process > li { background: #348AC7;}
.process > li:last-child { background: linear-gradient(to right, #348AC7, #7474BF);}
.process.plus1 > li{width:calc( ( 100% - 100px) / 4);padding: 1.5em 1em;}
.process.plus1 > li::after{ right:-30px;}
/*.process > li:nth-child(4)::after{ display:none;} 
.process > li:nth-child(n+5):nth-child(n-6)::after{ transform:translateY(-50%) rotate(180deg);} 
.process > li:nth-child(n+4):nth-child(n-6){ margin-bottom:0;} 
 
.process > li:nth-child(4){ order:6;} 
.process > li:nth-child(5){ order:5;} 
.process > li:nth-child(6){ order:4;} */

.progMany .process{}
.progMany .process > li{ width:calc( ( 100% - 100px) / 4); height:6em; margin-bottom:50px; padding:1em; box-sizing:border-box; border-radius:.5em; background: rgba(0,96,174,.1); word-break:keep-all; position:relative;}
.progMany .process > li::after{ content:"\e907"; font-family:xeicon; font-weight:700; font-size:1.5em; color:#aaa; position:absolute; right:-30px; top:50%; transform:translateY(-50%);}
.progMany .process > li:nth-child(8)::before{ content:"\e907"; font-family:xeicon; font-weight:700; font-size:1.5em; color:#aaa; position:absolute; right:-30px; top:50%; transform:translateY(-50%);}
.progMany .process > li:nth-child(4)::after{ content:"\e905"; right:42%; top:127px;} 
.progMany .process > li:nth-child(5)::after{transform:translateY(-50%) rotate(180deg);} 
.progMany .process > li:nth-child(8)::before{transform:translateY(-50%) rotate(180deg);} 
.progMany .process > li:nth-child(6)::after{transform:translateY(-50%) rotate(180deg);} 
.progMany .process > li:nth-child(7)::after{transform:translateY(-50%) rotate(180deg);} 
.progMany .process > li:nth-child(8)::after{transform:translateY(-50%) rotate(180deg);} 

.progMany .process > li:nth-child(5)::after{ display:none;} 
.progMany .process > li:nth-child(n+8):nth-child(n-8)::after{ transform:translateY(-50%) rotate(180deg);} 
.progMany .process > li:nth-child(n+7):nth-child(n-8){ margin-bottom:0;}
.progMany .process > li:nth-child(n+6):nth-child(n-8){ margin-bottom:0;} 
 
.progMany .process > li:nth-child(5){ order:8; margin: 3em 0 1em;} 
.progMany .process > li:nth-child(6){ order:7; margin: 3em 0 1em;} 
.progMany .process > li:nth-child(7){ order:6; margin: 3em 0 1em;} 
.progMany .process > li:nth-child(8){ order:5; margin: 3em 0 1em;} 

.progMany .process > li { background: #348AC7;}
.progMany .process > li:first-child { background: linear-gradient(to right, #193988,#348AC7)}

/************캘린더***************/
.box1.cal { width: 85%;}
.calendar h1, .calendar h2, .calendar h3, .calendar h4, .calendar h5, .calendar p{ margin-bottom: 10px;}
.calendar p{line-height: 20px;}
.clearfix{clear: both;}
.calendar{border-radius: 4px;overflow: hidden;width: 100%; height: 51em;background-color: #ffffff;color: #333333;border-radius: 1.5em; box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18);}
.calendar h1, .calendar h2{font-weight: 300; font-size: 2.5em;}
.calendar h1 span{display: block;}
.calendar .col{}
.calendar .col .content{ padding: 3em;}
.calendar ul{margin: 0px;}
.calendar ul li{list-style: none;}
.calendar .leftCol{width: 30%;background-color: #193988;}
.calendar .noteList li{color: #ffffff;margin-bottom: 1em; justify-content: space-between;}
.calendar .notes p,
.calendar .notes input,
.calendar .noteList li{font-weight: 300;font-size: 1em;}
.calendar .noteList li a:first-child { font-size: 1em;}
.calendar .notes p{border-bottom: solid 1px rgba(255,255,255,0.4);}
.calendar .notes input{background-color: #193988;color: #ffffff;border: none;width: 200px;}
.calendar .addNote,
.calendar .removeNote{color: rgba(255,255,255,0.4);font-weight: bold;width: 25%; font-size: .9em; line-height: 1.7em;}
.calendar .addNote:hover,
.calendar .removeNote:hover{color: #ffffff;}
.calendar .addNote{font-size: 16px;}
.calendar .leftCol h1{color: #ffffff; margin-bottom: 1.5em;}
.calendar .rightCol{width: 70%;}
.calendar .rightCol h2{color: #C7BEBE;text-align: right;margin-bottom: 70px;}
.calendar .months li{ width: 8%;}
.calendar .weekday li{ padding: 0.365em;height: 2em;width: 14.285%;background: #f0f4ff;border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .days li{ width: 14%;box-sizing: border-box;padding: .5em;height: 8em;border: 1px solid #f0f4ff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .months li a,
.calendar .weekday li a,
.calendar .days li a{display: block;color: #747978;}
.calendar .months li a{font-size: 1em; color: #C7BEBE;text-align: center; margin-bottom: 1em;}
.calendar .months li .selected{font-weight: bold;color: #747978;}
.calendar .weekday li a{text-align: center;font-size: 1em;color: #193988;font-weight: 500;}
.calendar .days li a{text-align: center;margin: auto auto;font-size: 1em;font-weight: bold;border-radius: .5em;margin-bottom: .5em;padding: 0.25em;transition:.2s; }
.calendar .days li:hover a{background-color: #f0f4ff;color: #193988;transition:.2s; }
.calendar .days li a.selected {color: #fff !important;}
.calendar .days li .selected{background-color: #193988!important;color: #ffffff;}
.calendar .days li .event{color: #193988;}
.calendar .review { overflow: hidden;white-space: nowrap;text-overflow: ellipsis;word-break: break-all; width: 70%;}
.calendar .months, .calendar .days {gap: 0.2em;}
.calendar .weekday { margin-bottom: 1em;}
.calendar {border-radius: 4px;overflow: hidden;width: 100%; height: 100%;background-color: #ffffff;color: #333333;border-radius: 1.5em;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18);-webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18);}
.calendar .leftCol { width: 30%; background: linear-gradient(to bottom, #193988,#348AC7);}
.calendar .days li .selected { background: linear-gradient(to right, #348AC7, #7474BF);color: #ffffff;}
.calendar .leftCol h1 { margin-bottom: 2em;}
.calendar h1, .calendar h2 {font-weight: 300;font-size: 3em;}
.calendar .date { position:relative; }
.calendar .date:after { content:""; position:absolute; width:1em; height:.5px;opacity: 0.6; bottom: -0.85em; bottom:-.4em; left:0; background:#fff;}
.calendar .days li { width: 14%;box-sizing: border-box;padding: 0.5em;height: 8em;border: 2px solid #f0f4ff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .weekday li { padding: 0.365em;height: 2em;width: 14.285%;background: #1f4c97;border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .weekday li a { color: #f0f4ff;}


/******마이페이지캘린더******/
.mypageCal .calendar h1, .mypageCal .calendar h2, .mypageCal .calendar h3, .mypageCal .calendar h4, .mypageCal .calendar h5, .mypageCal .calendar p{ margin-bottom: 10px;}
.mypageCal .calendar p{line-height: 20px;}
.clearfix{clear: both;}
.mypageCal .calendar{border-radius: 4px;overflow: hidden;width: 100%; height: 51em;background-color: #ffffff;color: #333333;border-radius: 1.5em; box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18);overflow:scroll;}
.mypageCal .calendar h1, .mypageCal .calendar h2{font-weight: 300; font-size: 2.5em;}
.mypageCal .calendar h1 span{display: block;}
.mypageCal .calendar .col{}
.mypageCal .calendar .col .content{ padding: 2em 2.5em;}
.mypageCal .calendar ul{margin: 0px;}
.mypageCal .calendar ul li{list-style: none;}
.mypageCal .calendar .leftCol{width: 30%;background-color: #193988;}
.mypageCal .calendar .noteList li{color: #ffffff; margin-bottom: 0.65em; justify-content: space-between;}
.mypageCal .calendar .notes p,
.mypageCal .calendar .notes input,
.mypageCal .calendar .noteList li{font-weight: 300;font-size: 1em;}
.mypageCal .calendar .noteList li a:first-child { font-size: 1em;}
.mypageCal .calendar .notes p{border-bottom: solid 1px rgba(255,255,255,0.4);}
.mypageCal .calendar .notes input{background-color: #193988;color: #ffffff;border: none;width: 200px;}
.mypageCal .calendar .addNote,
.mypageCal .calendar .removeNote{color: rgba(255,255,255,0.4);font-weight: bold;width: 10%; font-size: .9em; line-height: 1.7em;}
.mypageCal .calendar .addNote:hover,
.mypageCal .calendar .removeNote:hover{color: #ffffff;}
.mypageCal .calendar .addNote{font-size: 16px;}
.mypageCal .calendar .leftCol h1{color: #ffffff; margin-bottom: 1.5em;}
.mypageCal .calendar .rightCol{width: 100%;}
.mypageCal .calendar .rightCol h2{color: #C7BEBE;text-align: right;margin-bottom: 70px;}
.mypageCal .calendar .months li{ width: 7.9%;}
.mypageCal .calendar .weekday li{ padding: 0.365em;height: 2em;width: 14.285%;background: #f0f4ff;border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.mypageCal .calendar .days li{ width: 14%;box-sizing: border-box;padding: .5em;height: 8em;border: 1px solid #f0f4ff;border-radius: 0.5em;box-sizing: border-box;}
.mypageCal .calendar .months li a,
.mypageCal .calendar .weekday li a,
.mypageCal .calendar .days li a{display: block;color: #747978;}
.mypageCal .calendar .months li a{font-size: 1em; color: #C7BEBE;text-align: center; margin-bottom:0em;}
.mypageCal .calendar .months li .selected{font-weight: bold;color: #747978;}
.mypageCal .calendar .weekday li a{text-align: center;font-size: 1em;color: #193988;font-weight: 500;}
.mypageCal .calendar .days li a{text-align: center;margin: auto auto;font-size: 1em;font-weight: bold;border-radius: .5em;margin-bottom: .5em;padding: 0.25em;transition:.2s; }
.mypageCal .calendar .days li:hover a{background-color: #f0f4ff;color: #193988;transition:.2s; }
.mypageCal .calendar .days li a.selected {color: #fff !important;}
.mypageCal .calendar .days li .selected{background-color: #193988!important;color: #ffffff;}
.mypageCal .calendar .days li .event{color: #193988;}
.mypageCal .calendar .review { overflow: hidden;white-space: nowrap;text-overflow: ellipsis;word-break: break-all; width: 70%;}
.mypageCal .calendar .months, .mypageCal .calendar .days {gap: 0.2em;}
.mypageCal .calendar .weekday { margin-bottom: 1em;}
.mypageCal .calendar {border-radius: 4px;overflow: hidden;width: 100%; height: 100%;background-color: #ffffff;color: #333333;border-radius: 1em;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18);-webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.1);}
.mypageCal .calendar .leftCol { width: 100%; background: linear-gradient(to bottom, #193988,#348AC7);}
.mypageCal .calendar .days li .selected { background: linear-gradient(to right, #348AC7, #7474BF);color: #ffffff;}
.mypageCal .calendar .leftCol h1 { margin-bottom: 0.65em;}
.mypageCal .calendar h1, .mypageCal .calendar h2 {font-weight: 300;font-size: 2em;}
.mypageCal .calendar .date { position:relative; }
.mypageCal .calendar .date:after { content:""; position:absolute; width:0em; height:.5px;opacity: 0.6; bottom: -0.85em; bottom:-.4em; left:0; background:#fff;}
.mypageCal .calendar .days li { width: 13.9%;box-sizing: border-box;padding: 0.5em;height: 4.5em;border: 2px solid #f0f4ff;border-radius: 0.5em;box-sizing: border-box;}
.mypageCal .calendar .weekday li { padding: 0.365em;height: 2em;width: 14.285%;background: #1f4c97;border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.mypageCal .calendar .weekday li a { color: #f0f4ff;}
.mypageCal .calendar .noteList li:last-child {margin-bottom:0;}

/*****outline****/
.gree_bg.out { height: 15em;}
.gree_con.out .sub_tit .t2 { font-size: 1.75em; position:relative;}
.gree_con.out .sub_tit .t2 .overTop {position:absolute;top: 1.2em;bottom:0;font-size: .95em;color: #eee;line-height: .8em;z-index: -1;}
.gree_con.out .sub_tit .t2 .v_base { font-size: 1.43em;font-weight: 800;}
.gree_con.out .sub_tit .t2 .v_base::before { content: "";position: absolute;top: 1em;height: 1.5em;width: 1.5em;border-radius: .4em;z-index: -10;opacity: .2;margin-left: -0.3em;}
.gree_con.out .g_t .g_right.pad01 { height: 37em;} 
.gree_con.out .sub_tit .t4 > .xi { margin-top: -0.25em;}

/*학부과정*/
.rule_wrap { position:relative; padding: 1.5em 0 1em; line-height: 2; border-top: 2px solid #193988;  border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc; background: #fff;}
.rule_wrap .textarea_box { width: 100%; height: 350px; padding: 20px; box-sizing: border-box; overflow-y: auto; line-height: 1.4;}
.rule_wrap .textarea_box .rule_top{ padding: 2.5em; background: #fff; box-shadow: 3px 0 9px rgba(0,0,0,.15); box-sizing:border-box;}
.rule_wrap .textarea_box .rule_box{ padding: 1.5em; box-sizing: border-box;}
.rule_wrap .textarea_box .rule_box .rule
.rule_wrap .textarea_box .rule_box .rule_ttl{ }
.rule_box .rule_ttl{ position:relative; padding-left: 5.2em; font-size: 1.15em; letter-spacing: .3px; line-height: 1.4;  color: #111; font-weight: 600; padding-bottom: .5em;}
.rule_box .rule_ttl > span{ position:absolute; top: 0; left: 0; color: #193988;}
.rule_box ul{ padding-left: 1em;}
.rule_box ul > li{ position: relative; font-size: 1em; color: #444; font-weight: 500; padding-left: 1.25em; padding-bottom: .5em;}
.rule_box ul > li:last-of-type{ padding-bottom: 0em;}
.rule_box ul > li > span{ position: absolute; top: 0; left: 0;}
.rule_box .rule_se{ padding-bottom: 2em;}

.unInfo .table_st td ul {padding: 0 0em;}

/* -------- 공통 :: 탭 -------- */
/* Tab 공통 스타일 */

.prod_tab_wrap {position:relative; width:100%; margin-top: 1em;}
.prod_tab_wrap .list_tab {/*overflow:hidden;*/  position:relative; display: flex;margin-bottom: 2em;}
.prod_tab_wrap .list_tab li {float:left; position:relative; line-height:2px; flex: 1;}
.prod_tab_wrap .list_tab li > a {display:block;text-align:center;transition:.3s;margin:0; color:#193988;border:1px solid #f0f4ff;font-size: 1em;padding: 0 1em;height: 3em;line-height: 3em;background:#f0f4ff; word-break: keep-all;border-radius: 0.5em;margin: 0.2em;font-weight: 500;}
.prod_tab_wrap .list_tab li:hover > a{ color:#193988; border-color:#193988 ;}
.prod_tab_wrap .list_tab li.on > a {color:#eff1f5; background:#193988; position:relative; border-color:transparent;}
.prod_tab_wrap .list_tab li.on > a { color: #eff1f5; font-weight: 500;}
.prod_tab_wrap .con_idx {}

.prod_tab_wrap.mypageP { margin-top: 0em; margin-bottom: 1em !important;}
.prod_tab_wrap.volunapp { position: relative;width: 100%;margin-top: -1em;margin-bottom: 3.5em !important;}
 
.article { display: block;}
.sub-tab-wrapper-style{position:relative; height:75px; margin-bottom:20px; }
.sub-tab-list-style ul{display:flex; justify-content: center; width:100%; height:100%; text-align: center;}
.sub-tab-list-style ul:after{display:none}
.sub-tab-list-style ul li{/* float:left; */ display:inline-block; vertical-align:middle; position:relative; width:17.1%; background-color:#eee}
.sub-tab-list-style ul li a{display:table; height:75px; width:100%; }
.sub-tab-list-style ul li a em{display:table-cell; vertical-align:middle; color:#888; font-size:1.2em; letter-spacing:-0.25px; text-align:center;}
.sub-tab-list-style ul li.selected{z-index:1; }
.sub-tab-list-style ul li.selected a{background-color:#044390}
.sub-tab-list-style ul li.selected a em{color:#fff; font-weight: 600}
/* Tab Fixed Move*/
.sub-tab-list-style.top-fixed{position:fixed; top:70px; left:0; width:100%; height:75px; z-index: 1;}
/* Mobile Tab Drop Menu */
.sub-drop-open-btn-style{display:none}
.con_idx{ position:relative;}
.con_idx > .idx{ position:absolute; left:0; top:0; width:100%; height:0; overflow:hidden; visibility:hidden; filter:alpha(opacity=0); opacity:0; box-sizing: border-box; /*border: 1px solid #ddd;*/}
.con_idx > .idx.on{ position:relative; height:auto; overflow:visible; visibility:visible; filter:alpha(opacity=100); opacity:1;}

.board_search_detail{ position:relative; margin: 2em 0;}
.board_search_detail .wrap_tit{ position:absolute; left:2.5em; top:2.5em; padding:0 .75em; background:#eff1f5; transform:translateY(-50%)}
.board_search_detail .wrap_tit .t1{ font-weight:700; font-size:1.313em; color:#0060ae}
.board_search_detail .wrap_con{ border:1px solid #eff1f5; background: #eff1f5; padding: 1em 2em 0.5em; border-radius:.5em}
.board_search_detail .wrap_con .list{ display:flex; flex-wrap:wrap; gap:0 4em}
.board_search_detail .wrap_con .list > li{ width:100%}
.board_search_detail .wrap_con .list > li .in{ display:flex; padding:.75em 0; min-height:2em}
.board_search_detail .wrap_con .list > li .in.vc{ align-items:center}
.board_search_detail .wrap_con .list > li:not(:first-child){ border-top:1px solid #ddd}
.board_search_detail .wrap_con .list > li.st1{ border-top:none}
.board_search_detail .wrap_con .list > li .in .tit{ width:9em; position:relative; display:flex; align-items:center; box-sizing:border-box}
.board_search_detail .wrap_con .list > li .in .tit.st2 { width:18%;}
.board_search_detail .wrap_con .list > li .in .tit.p1{ padding-left:1em}
.board_search_detail .wrap_con .list > li .in .tit .t1{ font-weight:500; font-size:1.125em}
.board_search_detail .wrap_con .list > li .in .tit .t2{ font-weight:500}
.board_search_detail .wrap_con .list > li .in .tit .ico{ font-size:1em; width:1.5em; text-align:center}
.board_search_detail .wrap_con .list > li .in .con{ flex:1 1 0%; min-width:0; padding:.125em 0}
.board_search_detail .wrap_con .list > li .in .con .t1{ font-size:1.063em}
.board_search_detail .wrap_con .list > li.w1{ width:calc(50% - 2em)}
.board_search_detail.st1 .wrap_con .list > li{ border-bottom:none}
.board_search_detail.st1 .wrap_con .list > li .in{ padding:.375em 0}

.board_search_detail .wrap_con .list > li .pd1.in { padding-top: 3.5em !important;}

.volunteerApp .board_search_detail .wrap_con .list > li .pd1 { padding-top: 3.5em !important;}
.volunteerApp .board_search_detail{ position:relative; margin: 1em 0 0;}
.volunteerApp .form_st > li.formG { border-top: 0px solid #111;}
.volunteerApp .form_st > li.formG { padding: 0.75em 0 1em;}
.volunteerApp .form_st > li.formF { border-bottom: 1px solid #111;border-top: 0px solid #111;padding: 0em;}
.volunteerApp .form_st > li.formF.G { padding: 0.75em 0 1em;}
.volunteerApp .form_wrap { margin-bottom: 4em;}
.volunteerApp .form_wrap:last-child { margin-bottom: 0em;}
/*.volunteerApp .form_st > li:last-child {border-bottom: 1px solid #111;}*/

/*사범대학*/
.dot_s{ position:relative; padding-left: 1.5em;}
.dot_s:before{ position: absolute; top: 0; left: 9px; content: '-';}
.page_list2 dd .d_txt{ padding-left: 2.5em;}
.page_list2 dd .d_txt > p{ position: relative; padding-bottom: .1em;}
.page_list2 dd .d_txt > p:before{  position: absolute; top: 0; left: -12px; content: '-';}
.page_list2 dd .d_txt > p:last-of-type{ padding-bottom: 0em;}
.page_list2 dd ul{ margin-top: 1.5em;}
.page_list2 dd ul.mt_n{ margin-top: 0em;}
.page_list2 dd:first-of-type ul{ margin-top: 0;}
/*.page_list2 dd ul > li{ padding-bottom: .8em;}*/
.page_list2 dd ul > .str{ font-weight: 600; color: #111;}
.page_list2 dd ul > li .p_1{ color: #111; font-weight: 600;}
.page_list2 dd ul > li .p_2{ padding-left: 1.5em; padding-top: .2em;}

.applyForm .page_list2 dd ul > li {  padding-bottom: 0em;}
.applyForm .table_st td ul.w_35 > li { width: 100%;}
.applyForm .nocon { margin-top:2em; background: #fff;}
.applyForm .input_st { width: 100%;}
.applyForm .inW50 .input_st { /*width: 50%*/;}
.applyForm .page_btn .in { width: 24.5%;}
.applyForm .page_btn .in.inW50 { width: 50%;}

.sub-tab-wrapper-style2{ position: relative; height: 100%; padding-bottom: 1.5em; padding-top: .5em;}
.sub-tab-list-style2{ padding: 0 2em;}
.sub-tab-list-style2.bg_n{ background: none;}
.sub-tab-list-style2.p_n{ padding: 0em;}
.sub-tab-list-style2 ul{ display:flex; justify-content: center; width:100%; height:100%; text-align: center; gap: .5em;}
.sub-tab-list-style2 ul.b_cen{ justify-content: center;}
.sub-tab-list-style2 ul.wrap{ flex-wrap: wrap;}
.sub-tab-list-style2 ul.certi_tab{ justify-content: start;}
.sub-tab-list-style2 ul:after{ display:none}
.sub-tab-list-style2 ul .selected { display:inline-block; vertical-align:middle; position:relative; width:16.66%; min-width: 16.66%; box-shadow: 2px 1px 6px rgba(0,0,0,.15);}
.sub-tab-list-style2 ul.b_cen .selected{ flex: initial; min-width: 10em;}
.sub-tab-list-style2 ul .selected:hover a { }
.sub-tab-list-style2 ul .selected:hover a em{ color: #222; font-weight: 600;}
.sub-tab-list-style2 ul .selected:hover a:before{ /*height: 100%; width: 100%; transition: .25s ease-out; z-index: -1;*/}
.sub-tab-list-style2 ul .selected a{ position:relative; height:45px; background: #fff; border: 1px solid #e1e1e1; cursor: pointer; align-items: center; justify-content: center; transition:.3s;}
.sub-tab-list-style2 ul .selected a em{ color: #222; font-weight: 500; font-size:1em; text-align:center;}
.sub-tab-list-style2 ul .selected.on a{ background: #193988; trnasition: .3s; border-color: transparent;}
.sub-tab-list-style2 ul .selected.on a:before{ content: none;} 
.sub-tab-list-style2 ul .selected.on a em{ color: #eff1f5; font-weight: 600;}

/**/
.sub-tab-list-style2 ul .selected2 { display:inline-block; vertical-align:middle; position:relative; width:16.66%; min-width: 16.66%; box-shadow: 2px 1px 6px rgba(0,0,0,.15);}
.sub-tab-list-style2 ul.b_cen .selected2{ flex: initial; min-width: 10em;}
.sub-tab-list-style2 ul .selected2:hover a { }
.sub-tab-list-style2 ul .selected2:hover a em{color: #222; font-weight: 600;}
.sub-tab-list-style2 ul .selected2:hover a:before{ /*height: 100%; width: 100%; transition: .25s ease-out; z-index: -1;*/}
.sub-tab-list-style2 ul .selected2 a{ position:relative; height:45px; background: #fff; border: 1px solid #e1e1e1; cursor: pointer; align-items: center; justify-content: center; transition:.3s;}
.sub-tab-list-style2 ul .selected2 a em{ color: #222; font-weight: 500; font-size:1em; text-align:center;}
.sub-tab-list-style2 ul .selected2.on a{ background: #193988; trnasition: .3s; border-color: transparent;}
.sub-tab-list-style2 ul .selected2.on a:before{ content: none;} 
.sub-tab-list-style2 ul .selected2.on a em{ color: #eff1f5; font-weight: 600;}

.product_wrap{ position:relative; width:100%; height:0; opacity:0; visibility:hidden; overflow:hidden;}
.product_wrap.on{ position:relative; height:auto; opacity:1; visibility:visible; overflow:visible;}

.page_wrap{ position:relative; width:100%; height:0; opacity:0; visibility:hidden; overflow:hidden;}
.page_wrap.on{ position:relative; height:auto; opacity:1; visibility:visible; overflow:visible;}

/*대학원과정*/
.o_num{ margin-top: 0em !important;}
.o_num > li{ position: relative; padding-left: 2em; font-size: .938em; /*padding-bottom: 0em !important;*/}
.o_num > li:last-of-type{ margin-bottom: 0em;}
.o_num > li > span{ position: absolute; top: 0; left: 12px;}

.notice_pro{ padding: 1.5em; background: #fff; border-radius: .5em; margin: .8em 0 1.5em 0 !important;}
.notice_pro > .tt{ padding-bottom: .5em;}
.notice_pro > .txt{ padding-left: 1em;}

/*전공과목안내*/
.search_box{ width: 100%; justify-content: center;  border-radius: 1em; padding: 2em; margin: 0 auto; box-sizing: border-box; background: #f9f9f9; box-shadow: 1px 0 3px rgba(0,0,0,.15); border: 1px solid #193988;}
.search_box .sech_con{ align-items: center; margin-right: 2em;}
.search_box .sech_con:last-of-type{ margin-right: 0em;}
.search_box .sech_con .sech_left{ margin-right: 1em;}
.search_box .sech_con .sech_left > p{ position: relative; color: #111; font-weight: 700; font-size: 1.05em;}
.search_box .sech_con .sech_left > p:before{ position: absolute; bottom: 0; left: 0; background: #193988; width: 100%; height: 8px; opacity: .15; content: '';}

/*search*/
.detailS {font-size: 1.08em;font-weight: 700;color: #555;background: #f0f4f5;padding: 0.3em 1em 0.2em 1.5em;transition:.2s;}
.detailS:hover { color:#f0f4ff;background: #193988;transition:.2s;}

/*봉사실습신청서*/
/*input group*****/
.formBong .group_file{ display:flex; flex-wrap:wrap; align-content:center; align-items:center;}
.formBong .group_file .label_file{ flex:1;}
.formBong .group_file .removeF{ margin-left:.25em;}
.formBong .group_file .label_file + .next_fileModi{ margin-top:.5em;}
.formBong .group_file .next_fileModi{ width:100%; padding:.25em 0; font-size:.938em;}
.formBong .group_file .next_fileModi > .label_st{ margin-right:.5em;}
.formBong .group_file .next_fileModi > span{ flex:1; word-break:break-all; word-wrap:break-word;}
.formBong .board_st{ font-size:1em;}

.formBong .board_st th,
.formBong .board_st td{ height:2.25em; padding:.75em .5em; border-bottom:1px solid #e5e5e5;}
.formBong .board_st th{ color:#111;}
.formBong .board_st td{ color:#555;}
.formBong .board_st ~ div.no_con{ border-top:none;}

.formBong .board_st.list.tit th{ border:solid #333; border-width:1px 0;}
.formBong .board_st.list td{ text-align:center;}
.formBong .board_st.list td .xi{ font-size:1.438em;}
.formBong .board_st.list td.w_tit{ text-align:left;}
.formBong .board_st.list td.w_tit > .inTit{ max-width:100%; overflow:hidden;}
.formBong .board_st.list td.w_tit a{ flex:1; padding-right:.375em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:1.4; color:#111;}
.formBong .board_st.list td.w_tit .bd_tit{ display:inline-block; color:#111; line-height:1.4;}

.formBong .board_st.list a:hover,
.formBong .board_st.view a:hover{ text-decoration:underline;}
.formBong .board_st.view a{ display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

.formBong .board_st.list.notice td{ background:#fbfcfd;}
.formBong .board_st.list .reply td{ background:#f9f9f9;}

.formBong .board_st.write{ border-top:1px solid #333;}
.formBong .board_st.write th{ padding-left:1.5em; text-align:left;}

.formBong .board_btn_wrap{ margin-top:4em; text-align:center;}

/*조사결과*/
.graph_wrap{ position: relative;width: 47%;border: 1px solid #193988; padding: 2em 0; border-radius: 1em; box-shadow: 3px 0 9px rgba(0,0,0,.15); margin-top: 2em;}
.graph_wrap:first-child { margin-left:0;}
.graph_wrap .graph_line{}
.graph_wrap .graph_line > li:first-of-type{ border-top: 1px solid #eee;}
.graph_wrap .graph_line > li{ position: relative; border-bottom: 1px solid #eee; width: 100%;height: 2.5em;}
.graph_wrap .graph_line > li > span{ position: absolute; left: -22px; top: -10px; font-weight: 800; font-size: 1em;}
.graph_wrap .graph_line > li:last-of-type > span{ top: 38px;}

.graph_wrap .graph{position: absolute;bottom: 0;left: 50%;width: 28em;margin: 0em auto; padding-top: 2em;;height: 100%;box-sizing: border-box;transform: translateX(-50%);align-items: self-end;}
.graph_wrap .graph .shame{ position: absolute;display: block;margin: -2em 0 0em;text-align: center;color: #888;font-weight: 500; width: 15em; transform: translateX(-35%);transition: .3s;}
.graph_wrap .graph .shameHover{ position: absolute;top: 4em;display: none;margin: -2em 0 0em;text-align: center;color: #fff;font-weight: 500;font-size: .9em;transform: translateX(-35%);padding: 0.5em 1em;background: rgba(0,0,0,.5);transition: .3s;}
.graph_wrap .graph .graphBar:hover .shameHover { display: block;transition: .3s;}
.graph_wrap .graph .gra{ position: absolute;bottom: -4em;font-size: 1.2em;font-weight: 600; left: 50%; transform: translateX(-50%);}

.graphTxt { padding: 0.5em 1.3em;margin: 1em 0 -1em;background: #193988;font-size: 1.12em;font-weight: 600;color: #fff;width: 43%;text-align: center;}

.graph_wrap .graph .graphBar{ position: relative; width: 4.5em; height: 100%; border-radius: unset;transition: .3s;}
.graph_wrap .graph .graphBar:nth-child(1) { background: #348AC7;}
.graph_wrap .graph .graphBar:nth-child(2) { background: #3b58c9;}
.graph_wrap .graph .graphBar:nth-child(3) { background: #5544ad;}
.graph_wrap .graph .graphBar:nth-child(4) { background: #2d30a9;}
.graph_wrap .graph .graphBar:nth-child(5) { background: #193988;}

/*.graph_wrap .graph .graphBar.bar01{ position: absolute; bottom: 0; left: 0; width: 15%; background: #348AC7; height: 19.5em; border-radius: unset;}
.graph_wrap .graph .graphBar.bar02{ position: absolute; bottom: 0; left:50%; width: 15%; background: #5544ad; height: 21.4em; border-radius: unset; transform: translateX(-175%);}
.graph_wrap .graph .graphBar.bar03{ position: absolute; bottom: 0; left:50%; width: 15%; background: #193988; height: 16.5em; border-radius: unset; transform: translateX(-50%);}
.graph_wrap .graph .graphBar.bar04{ position: absolute; bottom: 0; left:50%; width: 15%; background: #5544ad; height: 21.4em; border-radius: unset; transform: translateX(75%);}
.graph_wrap .graph .graphBar.bar05{ position: absolute; bottom: 0; right: 0; width: 15%; background: #193988; height: 16.5em; border-radius: unset;}*/

.graph_wrap .wh_box{ position: absolute; top: 50%; right: 20px; transform: translateY(-50%);}
.graph_wrap .wh_box > p{ font-size: 1em; font-weight: 600; margin-bottom: .3em;}
.graph_wrap .wh_box .wh_bc1{ background: #348AC7; width: 2em; height: 2em; border-radius: unset;}
.graph_wrap .wh_box .wh_bc2{ background: #193988; width: 2em; height: 2em; border-radius: unset;}

.graph_wrap .wh_box .wh_bc_con{ gap: .6em;}
.graph_wrap .wh_box .wh_bc_con > span{ font-size: .93em; font-weight: 700;}

.chartWrap{ position:relative; height:0; padding-bottom:50%}
.chartWrap.h1{ padding-bottom:100%}
.chartWrap.h2{ padding-bottom:0; height:35em}
.chartWrap canvas{ position:absolute; left:0; top:0; width:100%; height:100%}
/*.chartWrap #chart2 { left: 21em;}*/
.chartList > li{ width:45%}
.chartList > li.w1{ width:40%}
.chartList > li.w2{ width:55%}
.chartList > li.w3{ width:30%}
.chartList > li.w4{ width: 100%;}
.chart_source{ font-size:1.1em; color:#888; text-align:right; margin:1em 0}
.chart_source a{ vertical-align:top; text-decoration:underline}
.chart_source a:hover{ color:#333}

/**/
.map_info1 {overflow:hidden; margin-bottom:20px; padding: 2.5em; background: #193988; border-radius: 0 0 0 3em; margin-top:1em; box-sizing:border-box;}
.map_info1 .t1 span { color:#fff; display:inline-block; margin-right:1.5em;font-size: 1.05em; font-weight: 500; display: flex; align-items: center;}
.map_info1 .t1 span .mapt{ }
.map_info1 .t1 span.st {margin-bottom:1em;}
.map_info1 .t1 span:last-child { margin-right:0;}
.map_info1 .t1 .xi { font-size:1.3em; color:#193988; margin-right: 0.7em; border-radius:50%; width:1.8em; height:1.8em; min-width: 1.8em; min-height: 1.8em; line-height:1.8em; text-align:center; background:#fff}
.map_info1 .t1 span .stop1 {background:#193988; color:#fff; text-align:center; border-radius:50px; padding:.5em 1em; font-size:.813em;}

.bg_gray{ background: #f9f9f9;}
.organ_con{ text-align: center; margin: 0 auto;}
.role_wrap{ /*margin-top: 2em;*/}
.role_wrap .role_list{ gap: 6em;}
/*
.role_wrap .role_list > li{ background: #fff; /*backdrop-filter: blur(2px); flex: 1 1 47%; padding: 4.5em 3.5em; border-radius: 2em; box-sizing: border-box; }
.role_wrap .role_list > li .sub_tit .list_t{ margin-bottom: 1em; font-size: 2.25em; font-weight: 700;}
.role_wrap .role_list > li .sub_tit ul{ background: rgba(0,67,178, .1); padding: 1.5em; border-radius: 1.5em;}
.role_wrap .role_list > li .sub_tit ul > li{ position:relative; font-size: 1.25em; font-weight: 600; color: #333; padding: 0.45em 0.25em; border-bottom: 1px dashed rgba(0,67,178, .4); display: flex; align-items: center;}
.role_wrap .role_list > li .sub_tit ul > li:last-of-type{ border-bottom: none;}
.role_wrap .role_list > li .sub_tit ul > li .check_p{ color: #0043b2; margin-right: .2em; font-size: 1.35em;}
.sub_tit .t1 .f_w{ font-weight: 500;}
*/
.role_wrap .role_list > li{ display: flex; gap: 6em; padding: 4em 0 4em 0; border-bottom: 1px solid #ccc; align-items: center;}
.role_wrap .role_list > li:last-of-type{ border-bottom: 0em;}
.role_wrap .role_list > li .role_left{ flex: 1 1 50%;}
.role_wrap .role_list > li .role_left .sub_tit{}
.role_wrap .role_list > li .role_left .sub_tit .list_t{ font-size: 34px; font-weight: 800;}
.role_wrap .role_list > li .role_left .sub_tit ul{ background: #fff; padding: 1.5em; border-radius: 1.5em; margin-top: 2em;}
.role_wrap .role_list > li .role_left .sub_tit ul > li{ position:relative; font-size: 1.25em; font-weight: 600; color: #333; padding: 0.45em 0.25em; border-bottom: 1px dashed rgba(0,67,178, .4); display: flex; align-items: center;}
.role_wrap .role_list > li .role_left .sub_tit ul > li:last-of-type{ border-bottom: none;}
.role_wrap .role_list > li .role_left .sub_tit ul > li .check_p{ color: #0043b2; margin-right: .2em; font-size: 1.35em;}
.role_wrap .role_list > li .role_right{ flex: 1 1 50%; height: 30em;}
.role_wrap .role_list > li .role_right > img{ width: 100%; height: 100%; object-fit: cover; border-radius: 1.5em;}

.mypageCal .calendar ul {margin-bottom: 1em;}

.doc .box1 .page_list2.logo { background: #fff;}
.doc .box1 .page_list2.logo dd.fir { width: 39%;text-align: center;margin-top: 1em;border-right: 1px solid #ddd;border-radius: 0;}
.doc .box1 .page_list2.logo dd.sec { width: 60%;text-align: center;margin-top: 1em;padding-bottom: 0 !important;}
.doc .box1 .page_list2.logo dd.sec img { width: 32em;}
.doc .box1 .page_list2.logo dd.thr { width: 44%;text-align: center;margin-top: 1em;border-right: 1px solid #ddd;border-radius: 0;}
.doc .box1 .page_list2.logo dd.four { width: 51.5%;text-align: center;margin-top: 1em;padding-bottom: 0 !important;margin-left: 2em;}
.doc .box1 .page_list2.logo dd.thr img { width: 27em;}
.doc .box1 .page_list2.logo dd.four img { width: 29em;}

.mbBlock { display:none;}

/**/
.pop .pop_page_print .txt_wrap.st1{ position:relative; padding:0 5%; top:auto; left:auto; bottom:auto; right:auto}
.pop .pop_page_print .txt_wrap.st1 .sign{ position:relative}
.boxList{ display:flex; flex-wrap:wrap; gap:1em}
.boxList > li{ width:calc(50% - .5em)}
.chartIn{ border:1px solid #ddd; border-radius:.5em; height:0; padding-bottom:80%; position:relative}
.chartIn .re{ position:absolute; left:30px; top:15px; width:80%; height:80%; display:flex; align-items:center; justify-content:center;}