@charset "utf-8"; /* CSS Document */
.box0 { padding:0 var(--pgPD) } 
.boxSub { width: 1620px; margin: 0 auto; max-width: 94%; } 
.box1 { width:1280px; margin:0 auto; max-width:94% } 
.box2 { padding:0 calc(var(--pgPD) * 2.5) } 

.gnb li.m_hide { display:none !important;} 
body:not(.pop) { display:flex; flex-direction:column; min-height:100dvh } 

#header { position: fixed; left:0; top:0; width:100%; z-index:1000; background:#fff; --c1:rgba(0,0,0,.1) } 
#header .top_wrap { position:relative } 
#header .top_wrap .wrapF,
#header .top_wrap .gnb_wrap .dp1 { height:var(--headerH) } 
.headerT { padding-top:var(--headerH) } 
#header .top_wrap .wrapF { display:flex; align-items:center; gap:0 3vw } 
#header .top_wrap .wrapF > * { position:relative; z-index:2 } 
#header .top_wrap .logo { display:flex; align-items:center; gap:1em } 
#header .top_wrap .logo > a { display:block; height:3em; overflow:hidden } 
#header .top_wrap .logo > a .in { display:block; height:100%; transition:.3s } 
#header .top_wrap .logo > a img { height:100%; display:block } 
#header .top_wrap .etc_wrap { display:flex; align-items:center; gap:1em } 
#header .top_wrap .etc_wrap .btnInc { width:3em; height:3em; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#f5f5f5 } 
#header .top_wrap .etc_wrap .btnInc .ico { font-size:1.25em } 
#header .top_wrap .etc_wrap .searchBtn { background:#333; color:#fff } 
#header .top_wrap .etc_wrap .allBtn { position:relative; background:#fff; border:1px solid rgba(255,255,255,.5); box-shadow:0 0 1em rgba(0,0,0,.1) } 
#header .top_wrap .etc_wrap .mem_wrap { display:flex; align-items:center; border-radius:2em; background:var(--siteC); margin:0 .5em } 
#header .top_wrap .etc_wrap .mem_wrap > li > a { display:flex; gap:.25em; align-items:center; position:relative; height:2.75em; padding:0 1em; background:var(--siteC); color:#fff; box-sizing:border-box; border:2px solid transparent; border-radius:2em; transition:.3s } 
#header .top_wrap .etc_wrap .mem_wrap > li > a .t1 { font-size:.938em; font-weight:500 } 
#header .top_wrap .etc_wrap .mem_wrap > li:not(:first-child) > a:before { content:""; position:absolute; left:0; top:50%; transform:translate(-100%,-50%); width:1px; height:40%; background:rgba(255,255,255,.5) } 
#header .top_wrap .etc_wrap .mem_wrap > li:hover > a { background:#fff; border-color:var(--siteC); color:var(--siteC) } 
#header .top_wrap .etc_wrap .mem_wrap > li:hover > a:before,
#header .top_wrap .etc_wrap .mem_wrap > li:hover + li > a:before { opacity:0 } 
#header .top_wrap .etc_wrap .lang_wrap { position:relative; color:#888 } 
#header .top_wrap .etc_wrap .lang_wrap .st { display:flex; align-items:center; gap:.25em; border:1px solid var(--c1); border-radius:.25em; height:2em; padding:0 .5em } 
#header .top_wrap .etc_wrap .lang_wrap .st .t1 { flex:1 1 0%; min-width:3em; font-weight:700; font-size:.813em } 
#header .top_wrap .etc_wrap .lang_wrap .st .xi { font-size:1em } 
#header .top_wrap .etc_wrap .lang_wrap .st .arrow { transition:.3s } 
#header .top_wrap .etc_wrap .lang_wrap .st .arrow:before { content:"\e941" } 
#header .top_wrap .etc_wrap .lang_wrap .st .ico:before { content:"\e9d1" } 
#header .top_wrap .etc_wrap .lang_wrap .list { position:absolute; left:0; top:100%; width:100%; box-sizing:border-box; border:1px solid var(--c1); border-top:none; border-radius:0 0 .25em .25em; visibility:hidden; opacity:0; display:flex; flex-direction:column; background:#fff; overflow:hidden } 
#header .top_wrap .etc_wrap .lang_wrap .list .st { border-radius:0; border-color:transparent; border-top-color:var(--c1) } 
#header .top_wrap .etc_wrap .lang_wrap .list .st .arrow { opacity:0; transform:translateX(100%); transition:.3s } 
#header .top_wrap .etc_wrap .lang_wrap .list .st .arrow:before { content:"\e907" } 
#header .top_wrap .etc_wrap .lang_wrap .list .st .t1 { padding-left:.75em } 
#header .top_wrap .etc_wrap .lang_wrap .list > li.on { display:none } 
#header .top_wrap .etc_wrap .lang_wrap.on { --c1:#888 } 
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn { border-bottom-color:transparent; border-bottom-left-radius:0; border-bottom-right-radius:0; color:var(--c1) } 
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn .arrow { transform:rotate(180deg) } 
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn .ico:before { content:"\e92b" } 
#header .top_wrap .etc_wrap .lang_wrap.on .list { visibility:visible; opacity:1; transition:.3s } 
#header .top_wrap .etc_wrap .lang_wrap.on .list .st:hover { background:var(--c1); color:#fff } 
#header .top_wrap .etc_wrap .lang_wrap.on .list .st:hover .arrow { transform:translateX(0); opacity:1 } 

html:not(.allOn) #header .top_wrap .gnb_wrap { display:flex; align-items:center; flex:1; min-width:0; justify-content:center; height:100%; z-index:1; max-width:80vmin; margin:0 auto } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb { position:absolute; left:50%; transform:translateX(-50%); top:0; width:100%; justify-content:space-around; box-sizing:border-box; transition:padding .3s } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb a { display:flex } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li { position:relative; flex:1 1 0%; min-width:0 } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 { display:flex; align-items:center; justify-content:center } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va { position:relative } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after { content:""; position:absolute; transform:translate(150%, -50%); right:0; top:0; width:.375em; height:.375em; border-radius:50%; background:var(--siteC); opacity:0; transition:.3s } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt { font-weight:500; font-size:1.25em } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 { position:absolute; left:50%; top:100%; background:#fff; border-radius:0 0 1em 1em; width:10em; transform:translateX(-50%); flex-direction:column; box-shadow:0 1em 1em rgba(0,0,0,.1); padding:.5em; padding-top:0; gap:.125em;} 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:not(:hover) .dp2 { opacity:0; visibility:hidden; margin-top:-.5em } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a { padding:.5em; border-radius:.25em; overflow:hidden; position:relative; opacity:.7; justify-content:center; text-align:center } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a:before { content:""; position:absolute; inset:0; background:var(--siteC); opacity:0 } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .va { position:relative; font-weight:500 } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li:hover > a { color:var(--siteC); opacity:1 } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li:hover > a:before { opacity:.05 } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp3 { display:none } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:is(:hover,.on) .dp1 { color:var(--siteC) } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:is(:hover,.on) .dp1 .va:after { opacity:1 } 

.allOn { overflow-y:hidden } 
.allOn #header { height:100vh; overflow-y:scroll; overflow-x: hidden; scrollbar-width: thin; scrollbar-color: white transparent } 
.allOn #header .top_wrap { height:100% } 
.allOn #header .top_wrap .wrapF { flex-direction:column; height:100%; align-items:flex-start; position:relative; box-sizing:border-box; } 
.allOn #header .top_wrap .logo,
.allOn #header .top_wrap .etc_wrap { height:var(--headerH); display:flex; align-items:center } 
.allOn #header .top_wrap .logo { position:absolute; left:var(--sitePD); top:0 } 
.allOn #header .top_wrap .etc_wrap { margin-left:auto } 
.allOn #header .top_wrap .gnb_wrap { width: 1400px; margin: 0 auto; max-width: 94%; order:1; flex:1; min-height:0; display:flex; box-sizing:border-box; padding:2em 0; position:relative; } 
.allOn #header .top_wrap .gnb_wrap .gnb { flex:1 1 0%; min-width:0; max-height:100%; flex-direction:column; justify-content: center; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li { display: flex; gap: 1.5em; border-bottom: 1px solid #ddd; padding: 2em 0;} 
.allOn #header .top_wrap .gnb_wrap .gnb > li:last-of-type { margin-bottom: 0; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li:first-of-type { border-top: 1px solid #ddd;} 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 { width: 13em; min-width: 13em; height:auto; position:relative } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1:before { content:""; position:absolute; left:0; top:0; border-left:4px solid transparent; height:100% } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt { font-size:1.415em; font-weight:700; color: var(--siteC); } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 { /* flex-direction:column; */ gap:1em; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 .va_wrap { text-align: left; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp3 { display: none; } 
.allOn #header .top_wrap .etc_wrap .allBtn .line.e3 { display: none; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .tt { opacity:.7; font-weight:600; font-size:1.063em; color: #111; transition: none; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover .tt { opacity:1; text-decoration: underline; } 

.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 { top: 5px; box-shadow: none; display: flex; flex-wrap: wrap; gap: 2em; transition: none; z-index: 99; text-align: left; position: relative; visibility: visible; opacity: 1; top: unset; width: auto; left: 0; padding: 0; transition: none; transform: translateX(0); flex-direction: inherit; background: transparent; flex: 1; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2:before { display: none; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li { padding: 0; height: fit-content; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li.m_guide { display:none !important; position:absolute; right:0; bottom:4em; font-size:.875em; padding-bottom: 0; margin-bottom: 0; border-bottom: none; } 
.allOn #header .top_wrap .gnb_wrap .gnb > li.m_guide .dp1 { display:none } 
.allOn #header .top_wrap .etc_wrap .btnInc .ico:before { content: '\e921'; } 

/* quick eng ori */
/* 
#quick { position: fixed; left:0em; top:0; --qLW : 4.5em; width:var(--qLW); padding-bottom:1em; height:100%; box-sizing:border-box; z-index:999; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:1em } 
#quick .link { display:flex; flex-direction:column; align-items:center; width:100% } 
#quick .link > li { width:100% } 
#quick .link > li .st { color:#fff; padding:2em .5em; display:flex; writing-mode: vertical-lr; align-items:center; text-align:center; gap:.5em; box-shadow:-2em 0 2em rgba(0,0,0,.1); position:relative; box-sizing:border-box; width:calc(var(--qLW) - 1em); transition:.3s } 
#quick .link > li .st.c1 { --c:var(--siteC3); background:var(--c) } 
#quick .link > li .st.c2 { --c:var(--siteC4); background:var(--c) } 
#quick .link > li .st .t1 { font-size:1.5em; font-family:var(--fSerif) } 
#quick .link > li .st .more { padding:.25em; background:inherit; width:2em; display:flex; align-items:center; writing-mode: vertical-lr; gap:.5em; padding:.75em 0; border-radius:2em; box-sizing:border-box; justify-content:center; margin-top:.5em; border:1px solid rgba(255,255,255,.5); transition:.3s } 
#quick .link > li .st .more ~ .more { margin-top:0 } 
#quick .link > li .st .more .arrow:before { content:"\e980" } 
#quick .link > li .st .more .arrow { font-size:1em } 
#quick .link > li .st .more .tt { font-weight:700; font-size:.813em } 
#quick .link > li .st .corner { --cc:var(--c); left:0; font-size:2em } 
#quick .link > li .st .corner.p1 { bottom:100%; transform:rotate(90deg) } 
#quick .link > li .st .corner.p2 { top:100%; transform:rotate(180deg) } 
#quick .link > li:first-child .st { border-top-right-radius:1em } 
#quick .link > li:last-child .st { border-bottom-right-radius:1em } 
#quick .link > li:not(:first-child) .st .corner.p1,
#quick .link > li:not(:last-child) .st .corner.p2 { display:none } 
#quick .link > li .st:hover { width:100%; border-radius:0 1em 1em 0 } 
#quick .link > li .st:hover .more { border-color:transparent; background:#fff; color:#111 } 

#quick:not(:has(.link)) .goTop { position:fixed; right:1em; bottom:1em } 
.goTop { width:3em; border-radius:50%; aspect-ratio:1 / 1; background:#fff; box-shadow:0 0 2em rgba(0,0,0,.2); box-sizing:border-box; border:1px solid rgba(255,255,255,.2); display:flex; align-items:center; justIfy-content:center; color:var(--siteC); opacity:0; visibility:hidden; transform:translateY(1em); transition:.3s } 
.goTop .xi { transition:.3s } 
.scroll .goTop { opacity:1; visibility:visible; transform:translateY(0) } 
.goTop:hover .xi { transform:translateY(-20%) }  */

#quick { position: fixed; right:0em; top:0; --qLW : 6em; width:var(--qLW); height:100%; box-sizing:border-box; padding-top:var(--headerH); z-index:999; display:flex; flex-direction:column; justify-content:center } 
#quick .link { display:flex; flex-direction:column; gap:.5em; padding-right:.5em } 
#quick .link > li .st { position:relative; border-radius:var(--qLW); color:#fff; padding:calc(var(--qLW) / 3) .5em; display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5em; box-shadow:-2em 0 2em rgba(0,0,0,.1); overflow: hidden;} 
#quick .link > li .st:before{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .515); content: '';}
/* #quick .link > li .st.c1 { background:#0A2D33 } 
#quick .link > li .st.c2 { background:#227bc0 }  */
#quick .link > li .st .t1 { position:relative; font-family:var(--fSerif); font-size:1.5em } 
#quick .link > li .st .t2 { position:relative; font-size:.875em; line-height:1.1; opacity:1 } 
#quick .link > li .st .more { position:relative; padding:.25em; background:inherit; display:flex; align-items:center; gap:.25em; border-radius:1em; box-sizing:border-box; width:100%; justify-content:center; margin-top:1em; border:1px solid rgba(255,255,255,.5); transition:.3s } 
#quick .link > li .st .more .arrow:before { content:"\e980" } 
#quick .link > li .st .more .arrow { font-size:1em } 
#quick .link > li .st .more .tt { font-weight:700; font-size:.75em } 
#quick .link > li .st.c1 .more{ background:#0A2D33}
#quick .link > li .st.c2 .more{ background:#227bc0}
#quick .link > li .st:hover .more { border-color:transparent } 
#quick .link > li .st.c1:hover .more { background:#46B559 } 
#quick .link > li .st.c2:hover .more { background: #036 } 

#footer { padding:6vmin 0 6vmin 0; border-top:1px solid rgba(0,0,0,.05); box-shadow:0 -2em 3em rgba(0,0,0,.1); position:relative; border-radius:0 15vmin 0 0; overflow:hidden } 
#footer .goTop { position:fixed; right:1em; bottom:1em; border-radius:50%; width:3.5em; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; text-align:center; background: var(--siteC); color:#fff; border:1px solid rgba(255,255,255,.2); box-shadow:0 0 1em rgba(0,0,0,.1); opacity:0; transform:translateY(100%); transition:.5s; z-index: 9999; } 
#footer .goTop .xi { font-size:1.5em; transition:.3s } 
#footer .goTop:hover .xi { transform:translateY(-.25em) } 
.scroll #footer .goTop { opacity:1; transform:translateY(0) } 
#footer .wrapF { display:flex; gap:2em 3em; position:relative } 
#footer .logo_wrap { display:flex; align-items:center; gap:4em } 
#footer .logo { height:3em } 
#footer .logo img { height:100% } 
#footer .menu { display:flex; align-items:center; gap:2em; margin-left:auto } 
#footer .menu > li > a { position:relative; display:flex; gap:.5em; align-items:center; font-weight:500 } 
#footer .menu > li:not(:first-child) > a:before { content:""; position:absolute; left:-1em; top:50%; height:70%; background:#ddd; width:1px; transform:translateY(-50%) } 
#footer .menu > li > a.point { font-weight:700; color:var(--siteC); opacity:1 } 
#footer .info_wrap { display:flex } 
#footer .info { flex:1 1 0%; min-width:0; overflow:hidden; padding-top:.75em } 
#footer .info > li { float:left; margin-right:2em; margin-bottom:.375em; position:relative; opacity:.8; font-size:.938em } 
#footer .info > li:after { content:""; position:absolute; left:-1em; top:50%; width:1px; height:70%; background:rgba(255,255,255,.2); transform:translate(0,-50%) } 
#footer .info > li.point { opacity:1; font-weight:700 } 
#footer .info > li.point.c1 { color:var(--siteC) } 
#footer .info > li.br { clear:left } 
#footer .info > li.copyright { font-size:.813em; opacity:.5; text-transform:uppercase; margin-top:1em } 
#footer .info:after { content:""; display:block; clear:both } 

.sns_st { display:flex; gap:.5em } 
.sns_st > li > a { display:flex; align-items:center; justify-content:center; width:2.5em; height:2.5em; border-radius:50%; transition:.3s; background:rgba(255,255,255,.2) } 
.sns_st > li > a .xi { font-size:1.125em } 
.sns_st > li > a img { height:1.125em } 
.sns_st > li > a:hover { background:#111; color:#fff } 
.sns_st > li > a:hover img { filter:brightness(0) invert(1) } 

#contents { flex:1 1 0%; min-height:0; box-sizing:border-box } 
#contents .sub_top_wrap { height:50vh; position:relative } 
#contents .sub_top_wrap .wrapBg { position:absolute; left:0; top:0; width:100%; height:100%; background-color:#f1f1f1; overflow:hidden } 
#contents .sub_top_wrap .wrapBg .bg { height:100%; background-size: cover; position:relative } 
#contents .sub_top_wrap .wrapBg .bg:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2 } 
#contents .sub_top_wrap .wrapBg .bg.vod_wrap:after { opacity:.4 } 
#contents .sub_top_wrap .wrapCon { display:flex; height:100%; flex-direction:column; position:relative; padding-top:var(--headerH); box-sizing:border-box } 
#contents .sub_top_wrap .wrapF { } 
#contents .sub_top_wrap .subTit { flex:1; min-height:0; justify-content:center; display:flex; align-items:center } 
#contents .sub_top_wrap .subTit .wrapF { height:100%; display:flex; flex-direction:column; align-items:center; text-align:center; justify-content:center; color:#fff; line-height:1; gap:1.5em; box-sizing:border-box; padding-top:1em } 
#contents .sub_top_wrap .subTit .t1 { font-size:5.5vmin; font-weight:700; color:transparent; -webkit-text-stroke: 1px #fff } 
#contents .sub_top_wrap .subTit .t2 { font-size:1.25em; font-family:var(--fSerif); word-spacing:.2em; letter-spacing:.05em; line-height:1.5 } 
#contents .sub_top_wrap .subTab { position:relative; --tabC:rgba(255,255,255,.3) } 
#contents .sub_top_wrap .subTab .wrapF { display:flex; justify-content:center } 
#contents .sub_top_wrap .subTab .inF { display:flex; justify-content:center; position:relative } 
#contents .sub_top_wrap .subTab:has( .dp2 > li.on:first-child) .corner.p1 svg path,
#contents .sub_top_wrap .subTab:has( .dp2 > li.on:last-child) .corner.p2 svg path { fill:white } 
#contents .sub_top_wrap .subTab .corner { bottom:0; width:1.5em } 
#contents .sub_top_wrap .subTab .corner svg path { fill:var(--tabC) } 
#contents .sub_top_wrap .subTab .corner.p1 { right:100% } 
#contents .sub_top_wrap .subTab .corner.p2 { left:100%; bottom:0; transform:rotateY(180deg) } 
#contents .sub_top_wrap .subTab .gnb > li.on { display:flex !important; justify-content:center; width:100% } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 { display:inline-flex; justify-content:center; flex-wrap:wrap; overflow:hidden; border-radius:1em 1em 0 0 } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li { position:relative; flex:1; min-width:0; width:30vmin; max-width:30vmin } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a { height:4em; display:flex; align-items:center; justify-content:center; color:#fff; box-sizing:border-box; background:var(--tabC); position:relative } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a:before { content:""; position:absolute; left:-1px; top:50%; height:30%; transform:translateY(-50%); background:#fff; width:1px; opacity:.2 } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a .va { display:flex; align-items:center; line-height:1.1; position:relative; transition:.3s; word-break:keep-all; text-align:center } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a .va .tt { font-size:1.125em; font-weight:700 } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a .va .arrow { position:absolute; right:0; top:50%; transform:translateY(-50%); overflow:hidden; font-size:0; transition:.3s } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li > a .va .arrow:before { content:"\e942" } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li:not(.on):hover .tt { text-decoration:underline; text-underline-offset:.25em; text-decoration-thickness: 2px; } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li.on > a { background:#fff; color:var(--siteC) } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li.on > a .va { opacity:1; transform:translateX(0); padding-right:1.5em } 
#contents .sub_top_wrap .subTab .gnb > li .dp2 > li.on > a .va .arrow { font-size:1.25em } 
#contents .sub_top_wrap .subTab .gnb > li .dp3 { display:none } 

#contents .sub_tit_wrap { padding:8vmin 0; border-bottom:1px solid #eee } 
#contents .sub_tit_wrap .wrapF { display:flex; display:flex; flex-direction:column; gap:3vmin; align-items:center } 
#contents .sub_tit_wrap .titW { flex:1; min-width:0 } 
#contents .sub_tit_wrap .titW .t1 { font-weight:500; font-size:2.75em } 
#contents .sub_tit_wrap .nav { display:flex; align-items:center } 
#contents .sub_tit_wrap .nav { display:inline-flex; align-items:center; gap:0 1em } 
#contents .sub_tit_wrap .nav > li { color:#666 } 
#contents .sub_tit_wrap .nav > li:not(.home):before { content:"\e940"; font-family:xeicon; margin-right:.5em; font-size:.938em } 
#contents .sub_tit_wrap .nav > li.home > a { width:1.5em; height:1.5em; border-radius:50%; background:var(--siteC); color:#fff; display:flex; align-items:center; justify-content:center } 
#contents .sub_tit_wrap .nav > li.home > a .xi { font-size:.875em } 

#contents .sub_top_wrap .wrapBg .bg:not(.vod_wrap) { background-position:50% 30%; transition:background-position 3s ease-out; } 
#contents .sub_top_wrap .wrapBg .bg.on:not(.vod_wrap) { background-position:50% 60% } 

#contents .sub_tab { margin-top:3rem } 
#contents .sub_tab .gnb > li .dp2 > li,
#contents .sub_tab .gnb > li{ width: 100%;}
#contents .sub_tab .gnb > li .dp3{ display: flex; justify-content: center; gap: .5em; width: 100%;}
#contents .sub_tab .gnb > li .dp3 > li { flex: 1;} 
#contents .sub_tab .gnb > li .dp3 > li > a { display:flex; justify-content:center; align-items:center; height:3.65em; border-radius: 5px; background: #f5f5f5; padding:.5em; color:#777; font-weight: 400; position:relative; box-sizing:border-box; } 
#contents .sub_tab .gnb > li .dp3 > li > a .va > .tt{ font-size: 1.063em; font-weight: 500;}
#contents .sub_tab .gnb > li .dp3 > li.on > a{ background: var(--siteC); color: #fff;}
#contents .sub_tab .gnb > li .dp3 > li.on > a .va > .tt{ font-weight: 600;}

#contents .doc { padding:8vmin 0 20vmin 0 } 

.dp1on .gnb .dp2 { display:none!important } 
.dp2on .gnb > li,
.dp2on .gnb > li .dp1 { display:none!important } 
.dp2on .gnb > li.on { display:block!important } 
.dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a { display:none!important } 
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on { display:block!important } 

.sns_st { display:flex; align-items:center; gap:.5em;} 
.sns_st > li > a { width:2.5em; height:2.5em; color: #111; background:#f1f1f1; display:flex; align-items:center; justify-content:center; border-radius:50% } 
.sns_st > li > a .xi,
.sns_st > li > a img { opacity:.5 } 
.sns_st > li > a .xi { font-size:1.25em } 
.sns_st > li > a img { height:40% } 
.sns_st > li > a { color:#fff; transition:.3s } 
.sns_st > li > a .xi,
.sns_st > li > a img { opacity:1 } 
.sns_st > li > a img { filter:brightness(0) invert(1) } 
.sns_st > li > a.fb { background:#395398 } 
.sns_st > li > a.in { background:#a9309d } 
.sns_st > li > a.yt { background:#f70000 } 
.sns_st > li > a.tt { background:#111 } 
.sns_st > li > a.nb { background:#29a139 } 

.ch .sns_st > li > a .xi,
.ch .sns_st > li > a img { opacity: 1; filter: brightness(0) invert(1); } 
.ch .sns_st > li > a.fb { background:#395398 } 
.ch .sns_st > li > a.in { background:#a9309d } 
.ch .sns_st > li > a.yt { background:#f70000 } 
.ch .sns_st > li > a.tt { background:#111 } 
.ch .sns_st > li > a.nb { background:#29a139 } 

.page_tit { margin:0 0 3em 0 } 
.page_tit.c_white { color: #fff; } 
.page_tit.m0 { margin-bottom:0; } 
.page_tit.m1 { margin-bottom:1.25em; } 
.page_tit.m2 { margin-bottom: 1em; } 
.page_tit .tt { } 
.page_tit .tt * { vertical-align:baseline; } 
.page_tit .tt .info-tt { color: #888; font-size: 0.875rem; margin-top: 5px; } 
.page_tit .t0 { font-size: 3.215em; font-weight: 700; line-height: 1.2; text-transform: uppercase; } 
.page_tit .t0.en { font-size: 3.515em; font-weight: 500; } 
.page_tit .t1 { font-size: 2.515em; font-weight: 700; line-height: 1.3; } 
.page_tit .t1.en { font-size: 2.815em; font-weight: 500; } 
.page_tit .t2 { margin:.75em 0; color:#555666; font-size:1.063em; line-height: 1.4; } 
.page_tit .t2:first-child { margin-top:0; } 
.page_tit .t3 { font-weight:700; font-size:1em; margin-bottom: 1em; text-transform: uppercase; } 
.page_tit .t4 { font-weight:700; font-size:2em; line-height: 1.3; } 
.page_tit .t5 { font-weight:600; font-size:1.415em; text-transform: uppercase; } 
.page_tit .t6 { font-weight:500; font-size:.938em; } 
.page_tit .t7 { font-weight:500; font-size:1.063em; } 
.page_tit .t8 { font-weight:500; font-size:1.188em; color:#666; } 
.page_tit .t9 { font-size:1.75em; } 
.page_tit .t10 { font-size:1.88em; } 
.page_tit:last-child { margin-bottom:0 !important; } 

/**/
.mainBox { padding:6vmin 0; position:relative } 
.mainBox.p0 { padding:0 } 
.mainBox.p1 { padding:8vmin 0 } 
.mainBox.bg1 { background:var(--siteBg) } 
.mainBox .wrapBg { position:absolute; left:0; top:0; width:100%; height:100% } 
.mainBox .wrapBg:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.7 } 
.mainBox .wrapF { display:flex; flex-direction:column; gap:1em 4em; position:relative } 
.mainBox .wrapF .vc { justify-content:center } 
.mainBox .wrapF.dRow { flex-direction:row } 
.mainBox .wrapF.dRow.g0 { gap:0 } 
.mainBox .wrapF.dRow.g1 { column-gap:8% } 
.mainBox .wrapF.dRow.vt { align-items:flex-start } 
.mainBox .wrapF.dRow.vc { align-items:center } 
.mainBox .wrapF.dRow .grow { flex:1 1 0%; min-width:0 } 
.mainBox .wrapObj { position:absolute; right:10%; top:40%; width:40%; aspect-ratio:1 / 1; background:linear-gradient(0deg, var(--siteC2), var(--siteC) 50%); opacity:.1; animation: mainBoxAni 10s linear infinite; filter: blur(5em); } 
@keyframes mainBoxAni { 50% { transform:rotate(180deg) skew(20deg); } 
100% { transform:rotate(360deg) skew(0deg); } 
 }

.mainTit { display:flex; flex-direction:column; align-items:flex-start; gap:.75em; padding:0 .25em } 
.mainTit.ac { align-items:center; text-align:center } 
.mainTit.ar { align-items:flex-end; text-align:right } 
.mainTit.g0 { gap:0 } 

.mainTit .wIn { display:flex; flex-direction:column; gap:1.5em; } 
.mainTit .tit1 { font-size:1.75em; font-weight:600 } 
.mainTit .tit2 { font-size:2.75em; font-family:var(--fSerif); word-spacing:.1em } 
.mainTit .tit2.s1 { font-size:1.5em } 
.mainTit .tit2.s2 { font-size:3.5em } 
.mainTit .c1 { color:var(--siteC) } 
.mainTit .tt1 { opacity:.7; font-size:1.125em } 
.mainTit .tt1.m1 { margin-top:1em } 
.mainTit .mgL { margin-left:auto } 
.mainTit.white { color:#fff } 
.mainTit .more { margin-top:.5em; font-size:.938em; height:2em; border-radius:2em; background:#111; color:#fff; padding:0 1em; display:flex; align-items:center; gap:1em; transition:.3s } 
.mainTit .more .arr { margin-left:auto; font-size:1em } 
.mainTit .more .arr:before { content:"\e907" } 
.mainTit .more:hover { background:var(--siteC) } 
.mainTitW { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:.5em } 

.mainMore { display:flex; align-items:center; gap:.25em; --c:rgba(0,0,0,.1) } 
.mainMore .arrow { width:2em; height:2em; margin-left:1em; background:var(--c); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1em; transition:.3s } 
.mainMore .arrow:before { content:"\e93f"; font-size:1.5em } 
.mainMore .ico.s1 { font-size:1.5em } 
.mainMoreW:hover .mainMore .arrow,
.mainMore:hover .arrow { transform:translateX(20%); background:var(--siteC); transition:.3s } 

.mainArrow { width:3em; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; border-radius:50%; border-bottom-left-radius:0; background:var(--siteC); color:#fff; position:relative; overflow:hidden } 
.mainArrow:before { content:""; position:absolute; transform:translate(100%, -100%); background:var(--siteC2); border-radius:50%; filter:blur(.5); width:200%; height:200%; left:50%; top:50% } 
.mainArrow:after { content:"\e913"; font-family:xeicon; font-size:1.5em; position:relative; transition:.3s } 
.mainArrow:hover:before { transition:.3s; transform:translate(-50%,-50%) } 
.mainArrow:hover:after { transform:rotate(180deg) } 

.tabSt { display:flex; --tGap:3em; gap:var(--tGap); align-items:center } 
.tabSt > li > .in { position:relative; background:none; border:none; opacity:.4; padding:0 1em } 
.tabSt > li > .in .t1 { font-weight:700; font-size:1.375em; } 
.tabSt > li:not(:last-child) > .in:after { content:""; position:absolute; right:calc(var(--tGap) / 2 * -1); top:50%; width:1px; height:80%; background:rgba(0,0,0,.15); transform:translate(0,-50%) } 
.tabSt > li > .in.on,
.tabSt > li:hover > .in { opacity:1 } 
.tabSt > li > .in.on:before { content:""; position:absolute; left:100%; top:0; transform:translate(-100%, 0); width:.375em; height:.375em; border-radius:50%; background:var(--siteC2) } 

.corner { position:absolute; width:1em; aspect-ratio:1/1; --cc:white } 
.corner svg { display:block } 
.corner svg path { fill:var(--cc) } 

.vod_wrap { position:relative; height:100% } 
.vod_wrap .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 
.vod_wrap .layer { position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2 } 
.vod_wrap .layer.gra { background: linear-gradient(0deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,.3) 100%); } 
.vod_wrap .layer.c1 { background:var(--siteC); opacity:.3; mix-blend-mode:difference } 

.main #contents { --visualConPD:1.5em; --visualConH : 9em; --visualControlH:4em } 
.visualSlide_wrap { position:relative; box-sizing:border-box; height:calc(90dvh - var(--visualConPD)) } 
.visualSlide { height:100% } 
.visualSlide .swiper-slide { position: relative; overflow:hidden; height:100%; transition-timing-function: cubic-bezier(0.5, 0, 0.1, 1); background:#fff } 
.visualSlide .swiper-slide .bg { position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.1) } 
.visualSlide .swiper-slide .vod_wrap { position:absolute; left:0; top:0; width:100%; height:100%; } 
.visualSlide .swiper-slide .vod_wrap:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2 } 
.visualSlide .swiper-slide.swiper-slide-active .bg,
.visualSlide .swiper-slide.swiper-slide-prev .bg,
.visualSlide .swiper-slide.swiper-slide-duplicate-active .bg { transition:7s; transform:scale(1) rotate(.001deg) } 

.visualSlide_wrap .slogan { position:absolute; width:100%; height:100%; left:0; top:0; color:#fff; z-index:10; box-sizing:border-box; padding-bottom:var(--visualConH); padding-top:var(--headerH); font-family:var(--fSerif) } 
.visualSlide_wrap .slogan .wIn { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2em; height:100%; box-sizing:border-box; text-align:center } 
.visualSlide_wrap .slogan .wIn .in { display:flex; flex-direction:column; align-items:center; gap:.75em } 
.visualSlide_wrap .slogan .t1 { font-size:3.75em } 
.visualSlide_wrap .slogan .t2 { font-size:2em } 
.visualSlide_wrap .visualCon { position:absolute; left:0; bottom:0; width:100%; z-index:1; display:flex; align-items:flex-end; gap:4em; } 
.visualSlide_wrap .visualCon .scrollW { flex:1 1 0%; min-width:0; display:flex; justify-content:flex-end; padding:1em 0 } 
.visualSlide_wrap .visualCon .wIn { position:relative; width:calc(100% - 50vmin) } 
.visualSlide_wrap .visualCon .wIn .corner { width:3em } 
.visualSlide_wrap .visualCon .wIn .corner.p1 { right:100%; bottom:0 } 
.visualSlide_wrap .visualCon .wIn .corner.p2 { right:0; bottom:100% } 

.mainLink { --calcL:6; --calcG:.5em; height:var(--visualConH); border-radius:3em 0 0 0; background:#fff; box-shadow:0 -4em 4em rgba(0,0,0,.1); z-index:1; display:flex; align-items:center; box-sizing:border-box; padding:var(--visualConPD); padding-bottom:0; gap:1em } 
.mainLink > li { flex:1 1 0%; min-width:0; position:relative; border-radius:1em; height:100%; --hoverLineC:var(--siteC); --hoverLineW:.25em } 
.mainLink > li:before { content:""; position:absolute; inset: 0; background:var(--siteC); opacity:.1; border-radius:inherit } 
.mainLink > li:has(.w1) { flex-grow:1.5 } 
.mainLink > li .in[class*="c"] { --hoverLineC:#fff; color:var(--hoverLineC); } 
.mainLink > li .in[class*="c"]:before { opacity:1 } 
.mainLink > li .in.c1 { background:var(--siteC) } 
.mainLink > li .in.c2 { background:var(--siteC2) } 
.mainLink > li .in.c3 { background:var(--siteC3) } 
.mainLink > li .in.c4 { background:var(--siteC4) } 
.mainLink > li .in { position:relative; flex-direction:column; gap:.5em; box-sizing:border-box; height:100%; border-radius:inherit } 
.mainLink > li .in .ico { font-size:2.5em; } 
.mainLink > li .in .tt { display:flex; align-items:center; gap:.5em } 
.mainLink > li .in .t1 { font-weight:500; font-size:1.125em } 
.mainLink > li .in .arrow { margin-left:-1.5em; opacity:0; font-size:1em; transition:.3s } 
.mainLink > li .in .arrow:before { content:"\e907"; display:block } 
.mainLink > li .in[target="_blank"] .arrow:before { content:"\e980"; transform:scale(.8) translate(-25%, -25%) } 
.mainLink > li .in:not([class*="c"]) .ico { opacity:.3; color:var(--siteC) } 
.mainLink > li .in:hover .arrow { margin-left:0; opacity:1 } 

.visualSlide_wrap .controlW { position:absolute; bottom:var(--visualConH); z-index:10; width:100% } 
.visualSlide_wrap .controlW .wrapIn { display:flex; align-items:center; justify-content:flex-end; height:var(--visualControlH) } 

.mainScroll { position:relative; z-index:1; display:flex; gap:.25em; align-items:center; justify-content:center; color:#fff; transition:.3s; opacity:.5 } 
.mainScroll .in { display:flex; align-items:center; justify-content:center; text-align:center; box-sizing:border-box; height:100% } 
.mainScroll .in .xi { font-size:1em } 
.mainScroll .in .ico1 { font-size:1.75em; margin-right:-.25em } 
.mainScroll .tt { font-size:.813em; font-weight:900 } 
.mainScroll:hover { transition:.3s; opacity:1 } 
.scroll .mainScroll { opacity:0; visibility:hidden } 

.mainWrap { overflow:hidden } 

.mainAbout .wrapImg { width:40%; overflow:hidden; border-radius:1em } 
.mainAbout .wrapImg .bg { height:100% } 
.mainAbout .listW { background:#f5f5f5; border-radius:1em; margin-top:3em; padding:2em 0; } 
.mainAbout .list { display:flex; align-items:center; overflow:hidden } 
.mainAbout .list > li { flex:1 1 0%; min-width:0 } 
.mainAbout .list > li .wIn { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5em; box-sizing:border-box; height:100%; box-shadow:none; padding:0 2em } 
.mainAbout .list > li .wIn:before { content:""; position:absolute; right:0; bottom:0; width:100%; height:100%; border:1px solid rgba(0,0,0,.1); border-bottom:none; border-right:none; border-top: none;} 
.mainAbout .list > li .wIn .tit .t1 { font-weight:700; font-size:1em } 
.mainAbout .list > li .wIn .tit .t2 { font-size:1.25em } 
.mainAbout .list > li .wIn .tt { margin-top:1em; display:flex; align-items:flex-end; justify-content:space-between } 
.mainAbout .list > li .wIn .tt .no { font-weight:900; font-size:2em; font-weight:700; color:var(--siteC); letter-spacing:-.05em; display:flex; align-items:center; gap:.25em } 
.mainAbout .list > li .wIn .tt .no .sub { font-weight:400; font-size:.75em } 
.mainAbout .list > li .wIn .ico { width:4em } 
.mainAbout .list > li .wIn .ico .xi { font-size:2em } 
.mainAbout .list > li .wIn .more { margin:auto 0 0 auto } 
.mainAbout .list > li .bgW { position:absolute; left:0; top:0; width:100%; height:100% } 
.mainAbout .list > li .wIn.titW { color:#fff } 

.moveImg { overflow:hidden } 
.moveImg .el { width:200%; background-position-x:0; } 

.mainAcademic .swiper { width:100%; height:100% } 
.mainAcademic .bg { height:100% } 

.mainBoard { position:relative; display:flex; flex-direction:column } 
.mainBoard .wTit { display:flex; } 
.mainBoard .grow { flex:1 1 0%; min-width:0 } 
.mainBoard .swiper { flex:1 1 0%; min-width:0 } 

.mainGallery .list { display:grid; aspect-ratio:7 / 2; grid-template-columns: 1fr repeat(6, .5fr) 1fr; grid-template-rows: 1fr .5fr 1fr; gap:1.5em } 
.mainGallery .list > li:nth-child(2) { grid-column: span 3; grid-row: span 2; } 
.mainGallery .list > li:nth-child(3) { grid-column: span 3; grid-row: span 2; } 
.mainGallery .list > li:nth-child(4) { grid-row: span 3; } 
.mainGallery .list > li:nth-child(5) { grid-row: span 2; } 
.mainGallery .list > li:is(:nth-child(6), :nth-child(7), :nth-child(8)) { grid-column: span 2 } 

.mainBoxSt { position:relative; box-sizing:border-box; padding:2em; border-radius:2em; background:rgba(255,255,255,.5); box-shadow:0 1em 3em rgba(0,0,0,.1); border:1px solid rgba(255,255,255,.3); display:flex; flex-direction:column; gap:1.5em; overflow:hidden } 
.mainBoxSt.st1 { box-shadow: none; border-radius:1em } 
.mainBoxSt.st1:before { content:""; position:absolute; inset:0; } 
.mainBoxSt.c1:before { background:black; opacity:.05 } 
.mainBoxSt.c2:before { background:var(--siteC); opacity:.1 } 
.mainBoxSt.c3:before { background:green; opacity:.1 } 
.mainBoxSt.p0 { padding:0 } 
.mainBoxSt.p1 { padding:2em } 
.mainBoxSt > *:not(.hideT) { position:relative } 

.mainBasicSlideW { --slideG: .5em; filter:drop-shadow(0 0 1em rgba(0,0,0,.1)); margin:0 calc(var(--slideG) * -1) } 
.mainBasicSlideW .swiper-slide { width:33.33%; height:auto } 
.mainBasicSlideW .swiper-slide > div { margin:0 var(--slideG); box-sizing:border-box; height:100% } 
.mainBasicSlideW.news .swiper-slide { width:25% } 

.mainBasicSlideW.partner1 .swiper-slide { width:14.28% } 

/**/
.page_dot_list { padding: 0 1.25em; margin-top: 1.25em; } 
.page_dot_list.pN { padding: 0em; } 
.page_dot_list.mt0 { margin-top: 0em; } 
.page_dot_list.pN > li:before { display: none; } 
.page_dot_list > li { position: relative; margin-bottom: .25em; font-size: .915em; color: #272727; } 
.page_dot_list > li > .con { display: flex; } 
.page_dot_list > li:before { position: absolute; left: -15px; top: -1px; content: '-'; } 
.page_dot_list > li:last-of-type { margin-bottom: 0em; } 

.pageWrapper { } 
.pageWrapper .pageCon { padding-bottom: 6em; } 
.pageWrapper .pageCon:last-of-type { padding-bottom: 0; } 
.pageWrapper .pageCon.pt { padding-top: 6em; } 
.pageWrapper .pageCon.pb { padding-bottom: 6em; } 

/**/
.descList { } 
.descList > li { font-size: 1.125rem; line-height: 1.6; margin-bottom: 1.5rem; color: #373737; } 
.descList > li.t1 { font-size: 1.615em; font-weight: 600; line-height: 1.4; color: #111; } 
.descList > li.t2 { font-size: 1.315em; font-weight: 500; line-height: 1.4; color: #111; margin-bottom: .5em; } 
.descList > li > i { color: var(--siteC); font-weight: 500; } 
.descList > li:last-of-type { margin-bottom: 0; } 


/*SUB RULE*/
.page_Navcontainer { } 
.page_Navcontainer .Navdiv { } 
.page_Navcontainer .Navdiv > .subNavcon { } 
.page_Navcontainer .Navdiv > .subInfoWrap { flex: 1; word-break: keep-all; } 
.page_Navcontainer .Navdiv > .subInfoWrap .linkScroll { margin-bottom: 6em; } 
.page_Navcontainer .Navdiv > .subInfoWrap .linkScroll:last-of-type { margin-bottom: 0em; } 
.page_Navcontainer .Navdiv > .subInfoWrap .linkScroll .pageTit { align-items: center; gap: .75em; } 
.page_Navcontainer .Navdiv > .subInfoWrap .linkScroll .pageTit .goTop { display: flex; width: 2.5em; height: 2.5em; border:1px solid var(--siteC); color: #fff; border-radius: .25em; background: var(--siteC); align-items: center; justify-content: center; } 
.page_Navcontainer .Navdiv > .subInfoWrap .amendment { display: flex; gap: .5em .75em; flex-wrap: wrap; margin-bottom: 2.5em; text-align: right; } 
.page_Navcontainer .Navdiv > .subInfoWrap .amendment > li { font-size: .815em; color: #888; margin-bottom: .15em; } 

.subNavcon .linkNavWrap { } 
.NavTab { display: flex; border-radius: .5em; overflow: hidden; border: 1px solid #ddd; margin-bottom: 2.5em; } 
.NavTab > li { width: 20%; } 
.NavTab > li > a { font-size: 1em; text-align: center; width: 100%; box-sizing: border-box; letter-spacing: -1px; color: #000; border-bottom: 1px solid #ddd; font-weight: 600; display: inline-block; border-right: 1px solid #ddd; padding: 16px 20px; transition: .3s; } 
.NavTab > li:nth-last-child(-n+2) > a { border-bottom: none; } 
.NavTab > li:nth-child(5n) > a { border-right: none; } 
.NavTab > li > a:hover,
.NavTab > li > a.on { background: var(--siteC); color: #fff; } 

.titleFlex { display: flex; align-items: center; justify-content: space-between; margin-bottom: .75em; } 

.ThickLineB { padding: 2em; box-sizing: border-box; border: 8px solid #f1f1f1; border-radius: .25em; background: #fff; } 
.ThickLineB > .txt { font-size: 1.15em; line-height: 1.4; font-weight: 600; margin-bottom: 1em; color: #333; } 
.ThickLineB table { margin-top: 1em; } 

.page_Num_list { counter-reset: item; } 
.page_Num_list > li { position:relative; padding-left: 1.8em; margin-bottom: 1em; font-size: 1.063em; line-height: 1.4; color: #444; } 
.page_Num_list > li:last-of-type { margin-bottom: 0em; } 
.page_Num_list > li:after { position: absolute; top: 0; left: 0; display: flex; align-items: center; z-index: 0; justify-content: center; width: 1.25em; height: 1.25em; border-radius: .2em; background: var(--crGrad2); color: #fff; content: ''; } 
.page_Num_list > li:before { position: absolute; left: 0; width: 1.8em; height: 1.8em; align-items: center; display: flex; justify-content: center; counter-increment: item; color: #fff; content: counter(item); z-index: 1; font-size: .7em; font-weight: 600; } 

.page_txt_list { } 
.page_txt_list > li { margin-bottom: .5em; } 
.page_txt_list > li:last-of-type { margin-bottom: 0em; } 
.page_txt_list > li > .con { display: flex; gap: .75em; } 
.page_txt_list > li > .con > .tNum { width: 4em; min-width: 4em; display: flex; align-items: center; justify-content: center; height: 1.8em; background: var(--siteC); color: #fff; border-radius: .25em; } 
.page_txt_list > li > .con > .tNum > .tt { font-size: .9em; font-weight: 600; } 
.page_txt_list > li > .con > .tt { position:relative; top: 3px; font-size: 1.063em; line-height: 1.4; color: #444; } 

/*SUB REGULATOIN*/
.agTitBox { } 
.agTitBox .TitBoxCon { margin-bottom: 2.25em; } 
.agTitBox .TitBoxCon:last-of-type { margin-bottom: 0em; } 
.agTitBox .TitBoxCon > .tit { display: flex; align-items: center; font-size: 1.15em; font-weight: 700; color: var(--siteC); margin-bottom: .75em; } 
.agTitBox .TitBoxCon > .tit > .xi { margin-right: .25em; } 
.agTitBox .TitBoxCon .descWrap,
.agTitBox .TitBoxCon .page_Num_list { padding-left: 1.9em; } 
.agTitBox .TitBoxCon > .NumTwo > .page_Num_list,
.agTitBox .TitBoxCon > .page_Num_list { margin-top: 12px; } 
.agTitBox .TitBoxCon .descWrap.plN { padding-left: 0em; } 
.agTitBox .TitBoxCon .NumTwo { margin-bottom: 1em; } 
.agTitBox .TitBoxCon .NumTwo:last-of-type { margin-bottom: 0em; } 

.agTitBox .TitBoxCon .descWrap .ttWrap.divi > .tt { display: flex; gap: .25em; } 
.agTitBox .TitBoxCon .descWrap .ttWrap.divi > .tt > i { } 
.agTitBox .TitBoxCon .descWrap .ttWrap.divi > .tt > span { flex: 1; }

.TopLineB { position:relative; padding: 2em; box-sizing: border-box; border: 1px solid #ddd; border-radius: .5em 0 .5em .5em; } 
.TopLineB:before { position: absolute; top: -1px; right: 0; width: 5%; height: 2px; background: var(--siteC); content: ''; } 
.TopLineB.gray { background: #f7f7f7; } 
.TopLineB.boxInner { padding: 1.5em; margin-top: 10px; } 
.descWrap { } 
.descWrap.fx { display: flex; gap: 1em; } 
.descWrap .tt { font-size: 1.063em; line-height: 1.4; color: #444; margin-bottom: .75em; } 
.descWrap .tt:last-of-type { margin-bottom: 0em; } 

.descWrap.s1 .tt { font-size: .95em; margin-bottom: .25em; } 
.descWrap.mb2 .tt { margin-bottom: 1.5em; } 

.linkA { color: var(--siteC); font-weight: 600; } 

.pageTit { margin-bottom: .75em; } 
.pageTit > .tt { font-size: 1.715em; font-weight: 700; line-height: 1.4; } 


/**/
.introWrapper { display: flex; justify-content: space-between; align-items: stretch; gap: 5em; } 
.introWrapper .imgCon { width: 45%; } 
.introWrapper .imgCon img { width: 100%; height: 100%; border-radius: 1em; object-fit: cover; display: block; } 
.introWrapper .infoCon { width: 55%; display: flex; flex-direction: column; gap: 1.5em; } 
.introWrapper .infoCon .tit.siteCerr { font-size: 2em; color: #111111; line-height: 1.3; margin: 0; } 
.introWrapper .infoCon .descList { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.8em; } 
.introWrapper .infoCon .descList li { font-size: 1.063em; color: #444; line-height: 1.6; } 
.introWrapper .infoCon .list { list-style: none; padding: 0; margin: 1.5em 0 0 0; display: flex; gap: 1em; } 
.introWrapper .infoCon .list li { flex: 1; background-color: #f2f3f7; border-radius: 0.6em; padding: 1.5em 2em; box-sizing: border-box; } 
.introWrapper .infoCon .list li .wIn { display: flex; flex-direction: column; gap: 0.4em; } 
.introWrapper .infoCon .list li .tt { order: 1; } 
.introWrapper .infoCon .list li .tt .no { font-size: 1.8em; font-weight: 800; color: #111111; line-height: 1.2; } 
.introWrapper .infoCon .list li .tt .no i { font-style: normal; } 
.introWrapper .infoCon .list li .tit { order: 2; } 
.introWrapper .infoCon .list li .tit .t1 { font-size: 0.85em; color: #777777; font-style: normal; font-weight: 500; } 

/**/
.greetingWrapper { display: flex; gap: 4.5em; } 
.greetingWrapper .ceoImg { position: sticky; top: var(--headerH); width: 25em; height: 100%; } 
.greetingWrapper .ceoCon { position:relative; height: 35em;  } 
.greetingWrapper .ceoCon > img { width: 100%; height: 100%; object-fit: cover; border-radius: 1em; } 
.greetingWrapper .ceoImg > .info { margin-top: 1em; } 
.greetingWrapper .ceoImg > .info > .name { font-size: 1.515em; font-weight: 400; } 
.greetingWrapper .ceoImg > .info > .nth { font-size: 1em; color: #444; margin-top: .15em; } 
.greetingWrapper .ceoImg > .info > .date { font-size: 1em; color: #444; margin-top: 1em; } 
.greetingWrapper .greetingContent { flex: 1; } 
.greetingWrapper .greetingContent > .item { margin-bottom: 5em; } 
.greetingWrapper .greetingContent > .item:last-of-type { margin-bottom: 0; } 
.greetingWrapper .greetingContent > .item > .titCon { padding-bottom: 1em; margin-bottom: 2em; border-bottom: 1px solid #111; } 
.greetingWrapper .greetingContent > .item > .titCon > .tt { font-size: 2.415em; font-weight: 400; line-height: 1.5; } 
.greetingWrapper .greetingContent > .item .greImgList { display: flex; align-items: stretch; gap: 2em; margin-top: 3em; } 
.greetingWrapper .greetingContent > .item .greImgList > li { flex: 1; } 
.greetingWrapper .greetingContent > .item .greImgList > li > .imgCon { position:relative; width: 100%; height: 25em; border-radius: .5em; overflow: hidden; } 
.greetingWrapper .greetingContent > .item .greImgList > li > .imgCon > img { width: 100%; height: 100%; object-fit: cover; } 

/* 연혁 */
.historyWrapper .inner { padding: 0 2em; } 
.historyWrapper .history { position:relative; padding:100px 0 200px; } 
.historyWrapper .history .linewrap { position: absolute; top: 0px; left:calc(150px + 330px - 80px); width:2px; height: 0%; background: var(--siteC); } 
.historyWrapper .history:after { display:block; content:""; width:1px; height: 98%; z-index:-1; border-left:2px dotted #ccc; position:absolute; left:calc(150px + 330px - 80px); top:0; } 
.historyWrapper .history > div { display:flex; justify-content:space-between; margin-bottom:50px; } 
.historyWrapper .history > div:last-child { margin-bottom:0; } 
.historyWrapper .history > div .decade { position:relative; width:200px; font-size:3em; color:#000; font-weight:700; } 
.historyWrapper .history > div .decade:before { display:block; content:""; width:15px; height:15px; box-sizing:border-box; border:2px solid #dcdcdc; border-radius:50%; background:#fff; position:absolute; left:100%; top:23px; z-index:10; } 
.historyWrapper .history > div .decade:after { display:block; content:""; width:190px; height:1px; box-sizing:border-box; background:#ddd; position:absolute; left:calc(100% + 10px); top: 30px; } 
.historyWrapper .history > div ul { position:relative; box-sizing:border-box; width:calc(100% - 200px); padding-top:18px; padding-left:280px; } 
.historyWrapper .history > div ul:before { display:block; content:""; width:15px; height:15px; box-sizing:border-box; border:2px solid #dcdcdc; border-radius:50%; background:#fff; position:absolute; left:193px; top:23px; z-index:10; } 
.historyWrapper .history > div ul:after { display:block; content:""; width:45px; height:45px; box-sizing:border-box; border-radius:50%; background:rgba(39, 159, 229, 0.15); position:absolute; left:178px; top:8px; z-index:9; transform:scale(0); transition:all 0.4 ease; } 
.historyWrapper .history > div ul.on:after { transform:scale(1); transform-origin:center center; transition:all 0.3s ease-in-out; } 
.historyWrapper .history > div ul.on:before { border:2px solid var(--siteC); transition:all 0.3s ease-in-out; } 
.historyWrapper .history > div ul li { margin-bottom:10px; font-size:1.125em; color:#666; position: relative; line-height: 1.6; } 
.historyWrapper .history > div ul li::before { position: absolute; content: ''; left: -.8em; top: 12px; width: 4px; height: 4px; border-radius: 100px; background: #666; } 
.historyWrapper .history > div ul li + li { margin-top: 20px; } 
.historyWrapper .history > div ul li:last-child { margin-bottom:0; } 
.historyWrapper .history > div ul li .in { display: flex; gap: 1em; } 
.historyWrapper .history > div ul li .year { font-weight: 800; color: var(--siteC); width: 3rem; flex-shrink: 0; } 
.historyWrapper .history > div ul li .img_wrap { width: 19em; height: 12em; border-radius: .5em; overflow: hidden; margin: 1em 0 2.5em; } 
.historyWrapper .history > div ul li .img_wrap img { object-fit: cover; width: 100%; height: 100%; display: block; } 

.historyWrapper .top_img { width: 100%; border-radius: 1em; overflow: hidden; height: 19em; position: relative; } 
.historyWrapper .top_img::before { position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.25); } 
.historyWrapper .top_img .img_wrap{ width: 100%; height: 100%;}
.historyWrapper .top_img .img_wrap img { width: 100%; height: 100%; object-fit: cover; display: block; } 
.historyWrapper .top_img .bg_tit { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; } 
.historyWrapper .top_img .bg_tit p { font-size: 2.5em; color: #fff; font-weight: 700; text-align: center; } 

/* tab */
.sub_tab .tab_idx { background:url(../images/sub2/sub2_2_tabline.jpg) repeat-x left 46px; background: #f1f1f1; display:flex; align-items: center; width: 100%; box-sizing: border-box; border-radius: .5em; overflow: hidden; } 
.sub_tab .tab_idx > li { position: relative; text-align: center; padding:1em 2em; border-radius: .5em; /* background: #f1f1f1; */box-sizing: border-box; font-size:1.19em; font-weight: 600; color:#333; cursor:pointer; flex:1; transition:.3s; } 
.sub_tab .tab_idx > li.tab1 { padding:14px 28px; } 
.sub_tab .tab_idx > li.tab2 { padding:14px 28px; } 
.sub_tab .tab_idx > li.tab3 { padding:14px 28px; } 
.sub_tab .tab_idx > li.tab4 { padding:14px 28px; } 
.sub_tab .tab_idx > li.tab5 { padding:14px 28px; } 
.sub_tab .tab_idx > li.tab6 { padding:14px 27px 14px 28px; } 

.sub_tab .tab_idx > li:hover { background:#f9f9fb; } 
.sub_tab .tab_idx > li.on { color: #fff; background: var(--siteC); font-weight:700; /* box-shadow: 0 11px 16px rgba(0, 0, 0, 0.12); */ } 

.con_idx { position: relative; overflow: hidden; } 
.con_idx > .idx { position: absolute; left: 0; top: 0; width: 100%; height: 0; visibility: hidden; opacity: 0; pointer-events: none; } 
.con_idx > .idx.on { position: relative; height: auto; visibility: visible; opacity: 1; pointer-events: auto; } 


/**/
.locationWrapper { display: flex; gap: 4em; align-items: stretch; } 
.locationWrapper .leftForm { width: 50%; } 
.locationWrapper .leftForm > .locBox { display: grid; flex: 0 0 auto; gap: 16px; grid-auto-rows: min-content; grid-template-columns: repeat(2, minmax(50px, 1fr)); grid-template-rows: repeat(1, min-content); height: min-content; justify-content: center; overflow: hidden; padding: 0px; position: relative; width: 100%; } 
.locationWrapper .leftForm > .locBox > li:first-of-type { place-self: start; flex: 0 0 auto; grid-column: span 2; height: auto; position: relative; width: 100%; } 
.locationWrapper .leftForm > .locBox > li { place-self: start; flex: 0 0 auto; height: auto; position: relative; width: 100%; } 
.locationWrapper .leftForm > .locBox > li > .con { align-items: flex-start; cursor: pointer; display: flex; flex-flow: column; gap: 56px;justify-content: space-between; overflow: hidden; padding: 32px; position: relative; text-decoration: none;width: 100%;background: #f5f5f5;box-sizing: border-box;border-radius: 1em;transition: .3s ease; will-change: var(--framer-will-change-override, transform); } 
.locationWrapper .leftForm > .locBox > li > .con > .titCon { } 
.locationWrapper .leftForm > .locBox > li > .con > .titCon > .tit { font-size: 1.15em; font-weight: 700; margin-bottom: .5em; } 
.locationWrapper .leftForm > .locBox > li > .con > .titCon .listTxt { } 
.locationWrapper .leftForm > .locBox > li > .con > .titCon .listTxt > li { position:relative; font-size: .938em; font-weight: 500; color: #333; margin-bottom: .15em; transition: .3s ease; } 
.locationWrapper .leftForm > .locBox > li > .con > .titCon .listTxt > li:last-of-type { margin-bottom: 0; } 
.locationWrapper .leftForm > .locBox > li > .con > .icon { } 
.locationWrapper .leftForm > .locBox > li > .con > .icon > .xi { font-size: 2em; } 
.locationWrapper .leftForm > .contactList { margin-bottom: 1em; } 
.locationWrapper .leftForm > .contactList > li { } 
.locationWrapper .leftForm > .contactList > li > .con { display: flex; align-items: center; gap: .35em; font-size: 1.415em; } 
.locationWrapper .leftForm > .contactList > li > .con > .xi { color: var(--siteC); } 
.locationWrapper .leftForm > .contactList > li > .con > .tt { font-weight: 500; } 
.locationWrapper .rightForm { width: 50%; } 
.locationWrapper .rightForm > .map { position:relative; width: 100%; height: 100%; border-radius: 1em; overflow: hidden; } 
.locationWrapper .rightForm > .map > iframe { width: 100%; height: 100%; } 

.locationWrapper .leftForm > .locBox > li > .con:hover { background: var(--siteC2); color: #fff; } 
.locationWrapper .leftForm > .locBox > li > .con:hover > .titCon .listTxt > li { color: rgba(255,255,255, .915); } 

/**/
.businessWrapper{ padding: 4em; box-sizing: border-box; background: #f2f3f7; border-radius: 1em;}
.businessWrapper .businessList{ display: flex; gap: 2em; flex-wrap: wrap;}
.businessWrapper .businessList > li{ display: flex; width: calc((100% - 4em) / 3);}
.businessWrapper .businessList > li > .con{ flex: 1; padding: 2.5em; background: #fff; border-radius: .5em;}
.businessWrapper .businessList > li > .con.fic{ background-size: cover;}
.businessWrapper .businessList > li > .con > .iconB{ display: inline-flex; align-items: center; width: 4em; padding: .75em 1em; box-sizing: border-box; background: #f2f3f7; border-radius: .35em;}
.businessWrapper .businessList > li > .con > .iconB > img{ width: 100%; height: 100%; object-fit: contain;}
.businessWrapper .businessList > li > .con > .tit{ font-size: 1.315em; font-weight: 500; margin-top: 2em;}

/**/
.journalWrapper { } 
.journalWrapper .journalImg { position: relative; padding: 5.5em 6em; box-sizing: border-box; border-radius: 1em; overflow: hidden; margin-bottom: 1.5em; } 
.journalWrapper .journalImg:before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 135, 111, 1) 10%, rgba(255, 255, 255, 0) 70%); content: ''; } 
.journalWrapper .journalImg.b1:before { background: linear-gradient(90deg, rgb(0 110 135) 10%, rgba(255, 255, 255, 0) 70%); } 
.journalWrapper .journalImg>.inner { position: relative; z-index: 2; } 
.journalWrapper .journalImg>.inner>.en { font-size: 1.315em; font-weight: 600; color: #78ffe0; margin-bottom: .25em; } 
.journalWrapper .journalImg.b1>.inner>.en { color: #78ccff; } 
.journalWrapper .journalImg>.inner>.tit { font-size: 2.815em; font-weight: 800; color: #fff; } 
.journalWrapper .journalImg>.inner>.desc { font-size: 1.15em; line-height: 1.5; color: #fff; margin-top: 1.35em; } 
.journalWrapper .journalcopy { margin-top: 1em; } 
.journalWrapper .journalcopy>.tt { font-size: .815em; color: #999; font-weight: 400; } 

.grayBox { padding: 1.5em; box-sizing: border-box; background: #f7f7f7; border-radius: .25em; } 
.grayBox.ty1 { padding: 2.5em; border-radius: 1em; } 
.grayBox.wh { background: #fff; } 

 .visionWrapper { } 
.visionWrapper .vimi { display: flex; align-items: center; gap: 2em; flex-direction: column;} 
.visionWrapper .vimi > .item { position:relative; width: 100%; border-radius: 1em; overflow: hidden; padding: 4em; box-sizing: border-box; } 
.visionWrapper .vimi > .item:before { position: absolute; bottom: 0; left: 0; background: linear-gradient(0deg,rgba(0, 0, 0, .45) 35%, rgba(255, 255, 255, 0) 100%); width: 100%; height: 100%; content: ''; } 
.visionWrapper .vimi > .item > .inner { position:relative; display: flex; flex-direction: column; justify-content: end; height: 100%; z-index: 2; text-align: center;} 
.visionWrapper .vimi > .item > .inner > .tit { font-size: 2.415em; color: #fff; } 
.visionWrapper .vimi > .item > .inner > .txt { font-size: 1.315em; line-height: 1.5; color: #fff; margin-top: 1em; } 

.visionWrapper .valueDiv { display: flex; gap: 1.5em; } 
.visionWrapper .valueDiv > li { display: flex; width: calc((100% - 4.5em) / 4); } 
.visionWrapper .valueDiv > li > .con { flex: 1; padding: 2em; box-sizing: border-box; background: #f2f3f7; border-radius: .5em;} 
.visionWrapper .valueDiv > li > .con > .enT { display: flex; align-items: center; justify-content: center; color: #fff; margin: 0 auto; width: 4em; height: 4em; border-radius: 50%; } 
.visionWrapper .valueDiv > li:nth-child(1) > .con > .enT{ background: var(--siteC2);}
.visionWrapper .valueDiv > li:nth-child(2) > .con > .enT{ background: #64c0cf;}
.visionWrapper .valueDiv > li:nth-child(3) > .con > .enT{ background: var(--siteC);}
.visionWrapper .valueDiv > li:nth-child(4) > .con > .enT{ background: #d771a0;}
.visionWrapper .valueDiv > li > .con > .enT > .tt { font-size: 2.15em; font-weight: 600; } 
.visionWrapper .valueDiv > li > .con > .vBox { } 
.visionWrapper .valueDiv > li > .con > .vBox > .tt { font-size: 1.315em; font-weight: 400; text-align: center; margin: 1em 0 1.25em 0; height: 3em; display: flex; align-items: center; justify-content: center; } 
.visionWrapper .valueDiv > li > .con > .vBox > .line { position: relative; width: 100%; height: 1px; background: #111;} 
.visionWrapper .valueDiv > li > .con > .vBox > .line > .dot { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1em; height: 1em; background: var(--siteC); border-radius: 50%; } 
.visionWrapper .valueDiv > li > .con > .vBox > .line > .dot:before { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1.6em; height: 1.6em; border: 1px solid #111; border-radius: 50%; content: ''; } 
.visionWrapper .valueDiv > li > .con > .vBox > .desc { font-size: 1.063em; margin-top: 2em; line-height: 1.4;} 
.visionWrapper .valueDiv > li > .con > .vBox > .desc > i { display: block; margin-bottom: .5em;} 
.visionWrapper .pageCon { position:relative; } 
.visionWrapper .pageCon.bf:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .615); content: ''; } 
.visionWrapper .pageCon .boxSub { position: relative; z-index: 2; } 

.visionWrapper .coreWrapper { } 
.visionWrapper .coreWrapper .coreList { display: flex; flex-wrap: wrap; } 
.visionWrapper .coreWrapper .coreList > li { position: relative; width: 25%; background: #f5f5f5; } 
.visionWrapper .coreWrapper .coreList > li:first-child { border-radius: 2em 0 0 2em; } 
.visionWrapper .coreWrapper .coreList > li:last-of-type { border-radius: 0 2em 2em 0; } 
.visionWrapper .coreWrapper .coreList > li > .con { position: relative; width: 100%; height: 100%; z-index: 1; padding: 5em 3em 10em; box-sizing: border-box; text-align: center; transition: all 0.25s ease; border-radius: 2em; } 
.visionWrapper .coreWrapper .coreList > li > .con > .icon { width: 7em; height: 5em; margin: 0 auto; } 
.visionWrapper .coreWrapper .coreList > li > .con > .icon > img { width: 100%; height: 100%; object-fit: contain; transition: all 0.25s ease; } 
.visionWrapper .coreWrapper .coreList > li > .con > .mid { text-align: center; margin-top: 2em; } 
.visionWrapper .coreWrapper .coreList > li > .con > .mid > .en { font-size: 1.415em; font-weight: 400; } 
.visionWrapper .coreWrapper .coreList > li > .con > .mid > .tt { font-size: 1.063em; font-weight: 400; color: #666; margin-top: .25em; } 
.visionWrapper .coreWrapper .coreList > li > .con > .lgEn { position: absolute; left: 50%; transform: translateX(-50%); transition: all 0.25s ease; color: var(--siteC2); opacity: .215; bottom: .75em; font-weight: 700; font-size: 4em; text-transform: uppercase; } 

.visionWrapper .coreWrapper .coreList > li.on > .con { background: var(--siteC2); } 
.visionWrapper .coreWrapper .coreList > li.on > .con > .lgEn { opacity: 1; color: #fff; } 
.visionWrapper .coreWrapper .coreList > li.on > .con > .mid > .tt,
.visionWrapper .coreWrapper .coreList > li.on > .con > .mid > .en { color: #fff; } 
.visionWrapper .coreWrapper .coreList > li.on > .con > .icon > img { filter: var(--whiten); } 

.incImgBanner{ position:relative; width: 100%; height: 100%;}
.incImgBanner > img{ width: 100%; height: 100%;}