@charset "utf-8";
/* CSS Document */
.box0{ --bw:94vw; width:var(--bw); width:round(down, var(--bw), 1px); margin:0 auto}
.boxSub,
.box1{ width:1320px; margin:0 auto; max-width:94%}
.box0.w1{ --bw:84vw}
.box0.w2{ --bw:60vw}

.gnb li.m_hide{ display:none}
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); --c2:var(--siteC); --c3:#888; --c4:#fff; --c5:#fff}
#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 > a{ display:block; height:4em; overflow:hidden}
#header .top_wrap .logo > a .in{ display:block; height:100%}
#header .top_wrap .logo > a img{ height:100%; display:block}
#header .top_wrap .etc_wrap{ display:flex; align-items:center; gap:4vmin}
#header .top_wrap .etc_wrap .btnInc{ width:3.25em; height:3.25em; display:flex; align-items:center; justify-content:center; border-radius:50%}
#header .top_wrap .etc_wrap .btnInc .ico{ font-size:1.75em}
#header .top_wrap .etc_wrap .allBtn{ position:relative; border:1px solid rgba(255,255,255,.5); box-shadow:0 0 1em rgba(0,0,0,.1)}
#header .top_wrap .etc_wrap .allBtn .ico:before{content:"\e903"}
#header .top_wrap .etc_wrap .mem_wrap{ display:flex; gap:2em; align-items:center}
#header .top_wrap .etc_wrap .mem_wrap > li > a{ display:flex; gap:.25em; align-items:center; position:relative; color:var(--c3)}
#header .top_wrap .etc_wrap .mem_wrap > li > a .t1{ font-size:.938em; font-weight:500}
#header .top_wrap .etc_wrap .mem_wrap > li.point > a{ color:var(--c2)}
#header .top_wrap .etc_wrap .mem_wrap > li:not(:first-child) > a:before{ content:""; position:absolute; left:-1em; top:50%; transform:translate(0,-50%); width:1px; height:70%; background:var(--c1)}
#header .top_wrap .etc_wrap .lang_wrap{ position:relative; color:var(--c3)}
#header .top_wrap .etc_wrap .lang_wrap .langBtn{ 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 .langBtn .t1{ font-weight:700; font-size:.813em}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .xi{ font-size:1em}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .arrow{transition:.3s}
#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; padding:.5em 1em; padding-top:0; visibility:hidden; opacity:0; display:flex; flex-direction:column; gap:.25em; background:var(--c4)}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a{ display:flex; align-items:center; gap:.5em; height:1.5em; box-sizing:border-box; padding:0 .5em 0 .75em; overflow:hidden}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .t1{ font-weight:700; font-size:.813em}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .arrow{ font-size:1em; margin-left:auto}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .arrow:before{content:"\e907"}
#header .top_wrap .etc_wrap .lang_wrap .list > li.on{ order:-1}
#header .top_wrap .etc_wrap .lang_wrap .list > li.on > a{ background:var(--c2); border-radius:1em; color:var(--c5); }
#header .top_wrap .etc_wrap .lang_wrap .list > li.on > a .arrow:before{ content:"\e92b"}
#header .top_wrap .etc_wrap .lang_wrap .list > li:not(.on) > a .arrow{ opacity:0; transform:translateX(50%)}
#header .top_wrap .etc_wrap .lang_wrap .list > li:not(.on):hover > a .arrow{ opacity:1; transform:translateX(0); transition:.3s}
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn{ border-bottom-color:transparent; border-bottom-left-radius:0; border-bottom-left-radius:0}
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn .arrow{ transform:rotate(180deg)}
#header .top_wrap .etc_wrap .lang_wrap.on .list{ visibility:visible; opacity:1; transition:.3s}

html:not(.allOn) #header .top_wrap .gnb_wrap{ display:flex; align-items:center; flex:1 1 0%; min-width:0; justify-content:center; height:100%; z-index:1; max-width:100vmin; 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;}
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 .tt{ font-weight:700; font-size:1.1875em}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt[data-en]:after{ content:attr(data-en); font-weight:500; text-transform:capitalize}
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{ position:relative}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 .va:after{ content:""; position:absolute; left:100%; top:0; transform:translate(50%, -50%) scale(.5); background:var(--siteC)}

html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2{ position:absolute; left:50%; top:100%; width:12em; border-radius:1em; box-shadow:0 0 1em rgba(0,0,0,.1); transform:translate(-50%, -.5em); background:#fff; padding:1em; box-sizing:border-box; flex-direction:column; opacity:0; visibility:hidden; z-index:-1}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2:before{ content:"\e92f"; font-family:xeicon; position:absolute; left:50%; top:0; transform:translate(-50%,-80%); color:#fff; line-height:1; font-size:1.5em}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li{ position:relative}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a{ padding:.625em; border-radius:.5em; text-align:center; justify-content:center; color:#666; transition:.3s}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .tt{ font-weight:500}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li:hover > a{ background:var(--siteBg); color:#111}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp3{ display:none}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1{ color:var(--siteC)}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp2{ opacity:1; visibility:visible; z-index:auto; transition:.3s}

.allOn #header .top_wrap .allBtn .xi:before{ content:"\e921" !important}
.allOn{ overflow-y:hidden}
.allOn #header{ height:100vh; background:rgba(0,0,0,.5); backdrop-filter:blur(1em); overflow-y:scroll; 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 .etc_wrap{ filter:var(--whiten)}
.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{ order:1; flex:1; min-height:0; width:100%; display:flex; align-items:center; box-sizing:border-box; padding:0 var(--pgPD); padding-bottom:var(--headerH); position:relative; color:#fff}
.allOn #header .top_wrap .gnb_wrap .gnb{ width:100%; max-height:100%}
.allOn #header .top_wrap .gnb_wrap .gnb > li{ flex:1; padding-bottom:var(--headerH); text-align:center}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1{ height:20vmin; display:flex; align-items:center; justify-content:center}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt{ font-size:1.5em; font-weight:700}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2{ flex-direction:column; gap:1em}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .tt{ opacity:.7; font-weight:700; font-size: 1rem;}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover .tt{ opacity:1}
.allOn #header .top_wrap .gnb_wrap .gnb > li.m_guide{ display:block; position:absolute; right:0; bottom:0; font-size:.875em}
.allOn #header .top_wrap .gnb_wrap .gnb > li.m_guide .dp1{ display:none}

#quick{ position:fixed; width:5.5em; right:1em; bottom:1em; display:flex; flex-direction:column; gap:1em; align-items:center; z-index:21}
#quick .goTop{ border-radius:50%; width:3em; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; text-align:center; background: #222; color:#fff; border:1px solid rgba(255,255,255,.3); box-shadow:0 0 1em rgba(0,0,0,.1); opacity:0; transform:translateY(100%); transition:.5s}
#quick .goTop .xi{ font-size:1.5em; transition:.3s}
#quick .goTop:hover .xi{ transform:translateY(-.25em)}
.scroll #quick .goTop{ opacity:1; transform:translateY(0)}
#quick .btnSt{ border-radius:.5em; padding:.75em; box-sizing:border-box; width:100%; display:flex; flex-direction:column; align-items:center; gap:.25em; box-shadow:0 0 1em rgba(0,0,0,.1)}
#quick .btnSt .ico{ font-size:1.75em}
#quick .btnSt .t1{ font-weight:700; font-size:.938em}
#quick .btnSt .more{ padding:0 .5em; border-radius:2em; background:#111; color:#fff; height:2em; display:flex; align-items:center; font-size:.813em; font-weight:700; box-sizing:border-box; width:100%; justify-content:center; margin-top:.5em; gap:.5em}
#quick .btnSt .more:after{content:"\e93e"; font-family:xeicon; transition:.3s}
#quick .btnSt:hover .more:after{ transform:translateX(50%)}
#quick .btnSt.kakao{ background:#fae100; color:#111}

#footer{ padding:4.5em 0 5.5em 0; background:#1f2127; color:#fff; border-top:1px solid rgba(0,0,0,.05)}
#footer .wrapF{ display:flex; gap:4em}
#footer .logo{ height:3.45em; transform:translateY(-.75em)}
#footer .logo img{ height:100%}
#footer .menu{ display:flex; flex-direction:column; align-items:flex-end; gap:1em}
#footer .menu > li > a{ position:relative; display:flex; gap:.5em; align-items:center; opacity:.8}
#footer .menu > li > a:after{ content:"\e909"; font-family:xeicon; transform:rotate(45deg)}
#footer .menu > li > a.point{ font-weight:700; color:#b4c4ff; opacity:1}
#footer .info{ flex:1 1 0%; min-width:0; overflow:hidden}
#footer .info > li{ float:left; margin-right:2em; margin-bottom:.85em; 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.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{ 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,.1)}
.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:var(--whiten)}
.sns_st > li > a.kc img{ height:1.438em}

#contents{ flex:1 1 0%; min-height:0; box-sizing:border-box}
#contents .sub_top_wrap{ height:50vmin; 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; background-repeat: no-repeat;}
#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; justify-content:center; color:#fff; line-height:1; gap:1em; box-sizing:border-box; padding:1em}
#contents .sub_top_wrap .subTit .t1{ font-size:12vmin; letter-spacing:-.5vmin; font-family:var(--fEN); color:transparent; line-height:1; -webkit-text-stroke: 1px white; text-transform:uppercase}
#contents .sub_top_wrap .subTab{ position:relative}
#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; min-width:24vmin}
.dp1_label #contents .sub_top_wrap .subTab .gnb > li > .dp2 > li{ min-width: 16vmin;}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a{ height:4em; padding:0 2em; display:flex; align-items:center; justify-content:center; color:#fff; box-sizing:border-box; background:var(--siteC); position:relative}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a:before{ content:""; position:absolute; right:0; 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.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_tit_wrap{ padding:4vmin 0 2.5vmin 0; border-bottom:1px solid #eee}
#contents .sub_tit_wrap .wrapF{ display:flex; gap:3vmin; align-items:center; justify-content:space-between}
#contents .sub_tit_wrap .titW{ flex:1; min-width:0}
#contents .sub_tit_wrap .titW .t1{ font-weight:500; font-size:2.5em}
#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:center 30%; transition:3s}
#contents .sub_top_wrap.on .wrapBg .bg:not(.vod_wrap){background-position:center 60%}

#contents .doc{ padding:5vmin 0 16vmin 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}

/**/
.corner{ position:absolute; width:1em; height:1em}
.corner path{ fill:white}
.corner.pt{ top:0}
.corner.pb{ bottom:0}
.corner.pb100{ bottom:100%}
.corner.pl{ left:0}
.corner.pr{ right:0}
.corner.pr100{ right:100%}

.mainBox{ padding:7vmin 0 10vmin; position:relative}
.mainBox.bg1{ background:#f5f5f5}
.mainBox.bg2{ background:var(--siteBg)}
.mainBox.p1{ padding:10vmin 0 14vmin 0}
.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:.5}
.mainBox .wrapF{ display:flex; flex-direction:column; gap:3em 6vmin; position:relative}
.mainBox .wrapF:not(.dRow) > *{ width:100%; min-width:0}
.mainBox .wrapF.dRow{ flex-direction:row}
.mainBox .wrapF.dRow.vc{ align-items:center}
.mainBox .wrapF.dRow .grow{ flex:1 1 0%; min-width:0}
.mainBox:has(+ .partnerW){ padding-bottom:10vmin}

.mainTit{ display:flex; flex-direction:column; align-items:flex-start; gap:1em}
.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:5.4vmin; font-family:var(--fEN); word-spacing:.5vmin}
.mainTit .tit1.s1{ font-size:4vmin}
.mainTit .tit2{ font-size:1.75em; font-weight:700}
.mainTit .c1{ color:var(--siteC)}
.mainTit .tt1{ font-size:1.375em; line-height:1.6}
.mainTit .mgL{ margin-left:auto}
.mainTit.white{ color:#fff}
.mainTitW{ display:flex; justify-content:space-between; align-items:center; padding:0 .25em}
.mainTitW.col{ flex-direction:column; align-items:flex-start}

.mainMore{ --c1:#111; --c2:#fff; --c3:transparent; background:var(--c1); color:var(--c2); height:3em; border-radius:2em; padding:0 1.5em; gap:.5em; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; border:2px solid var(--c3); transition:.3s}
.mainMore .tt{ font-weight:700; font-size:1.063em}
.mainMore:after{content:"\e93e"; font-family:xeicon; transition:.5s; margin-left:1em}
.mainMore:not(:has( .tt)){ padding:0; aspect-ratio:1/1}
.mainMore:not(:has( .tt)):after{ margin-left:0}
.mainMore.ico1:after{ content:"\e913"}
.mainMore:hover{ border-color:var(--c3); color:var(--c1); background:var(--c2)}
.mainMore:has(.tt):hover:after{ transform:translateX(50%)}
.mainMore.s1{ height:2.5em}
.mainMore.s2{ height:3.5em; font-size:1.125em}
.mainMore.re{ --c1:#fff; --c2:#111; --c3:transparent}

.tabSt{ display:flex; --tGap:3em; gap:var(--tGap); align-items:center; background:#647887; color:#fff; padding:.75em; position:relative; padding-right:3em}
.tabSt > li > .in{ position:relative; background:none; border:none; opacity:.6; padding:0 1.5em; height:3em; display:flex; align-items:center}
.tabSt > li > .in .t1{ font-weight:700; font-size:1.313em;}
.tabSt > li:not(:last-child) > .in:after{ content:""; position:absolute; right:calc(var(--tGap) / 2 * -1); top:50%; width:1px; height:80%; background:rgba(255,255,255,.2); 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(-200%, 0); width:.375em; height:.375em; border-radius:50%; background:#fff}
.tabSt > li .mainMore{ position:absolute; right:1em; top:50%; transform:translateY(-50%)}
.tabSt > li > .in:not(.on) ~ .mainMore{ display:none}

.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}

.visualSlide_wrap { position:relative; box-sizing:border-box; padding-top:var(--headerH)}
/*.visualSlide{ aspect-ratio:15 / 6; border-radius:1em}*/
.visualSlide .swiper-slide{ position: relative; overflow:hidden; height:40dvw; 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%}
.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_wrap .incW{ --controlH:7em; position:absolute; width:70%; left:0; z-index:10; box-sizing:border-box; display:flex; padding:0 10%}
.visualSlide_wrap .sloganW{ display:flex; flex-direction:column; justify-content:center; gap:4em; height:100%; padding-bottom:var(--controlH); padding-top:4%; top:0;}
.visualSlide_wrap .slogan{ display:flex; flex-direction:column; gap:3vmin; align-items:flex-start}
.visualSlide_wrap .slogan .t1{ font-size:6vmin; font-weight:700; word-break: keep-all;}
.visualSlide_wrap .slogan .t2{ font-size:2.8vmin; line-height:1.6}
.visualSlide_wrap .slogan .t2 i{line-height: 1.6;}
.visualSlide_wrap .slogan .mainMore{ margin-top:4vmin}
.visualSlide_wrap .white .slogan{ color:#fff}
.visualSlide_wrap:has( .swiper-slide-active.white) .controlW{ filter:var(--whiten)}
.visualSlide_wrap:has( .swiper-slide-active.white) .controlW .swiperBtn.pause{ background:none}
.visualSlide_wrap .controlW{ height:var(--controlH); bottom:0}

.mainScroll{ position:relative; z-index:1; height:var(--visualScrollH); display:flex; gap:.25em; align-items:center; justify-content:center; color:var(--siteC); transition:.3s}
.mainScroll .in{ display:flex; align-items:center; justify-content:center; text-align:center; box-sizing:border-box; height:100%}
.mainScroll .in .ico1{ font-size:2em; margin-right:-.25em}
.mainScroll .tt{ font-size:.875em; font-weight:900}
.scroll .mainScroll{ opacity:0; visibility:hidden}

.mainWrap{ overflow:hidden}

.mainBusiness .list{ --calcL:3; --calcG:5vmin}
.mainBusiness .list .st{ position:relative; border-radius:1em; overflow:hidden; --mw:5em}
.mainBusiness .list .st .imgW{ overflow: hidden}
.mainBusiness .list .st .imgW .bg{ aspect-ratio:5/6; position:relative; background-position-x:0}
.mainBusiness .list .st .conW{ position:absolute; inset:0; box-sizing:border-box; padding:10%; padding-bottom:0; color:#fff; background:rgba(0,0,0,.2); display:flex; flex-direction:column; gap:1em}
.mainBusiness .list .st .conW .t1{ font-size:2vmin}
.mainBusiness .list .st .conW .t2{ font-weight:700; font-size:3.8vmin; line-height:1.1}
.mainBusiness .list .st .conW .check{ margin-top:auto; padding-bottom:var(--mw)}
.mainBusiness .list .st .conW .check > li{ font-size:1.25em; margin:.75em 0; display:flex; gap:.5em}
.mainBusiness .list .st .conW .check > li:before{ content:"\e92b"; font-family:xeicon}
.mainBusiness .list .st .conW .more{ width:var(--mw); height:var(--mw); position:absolute; right:0; bottom:0; background:#fff; border-radius:1em 0; box-sizing:border-box; padding:1em; padding-right:0; padding-bottom:0; transform:translateX(100%); transition:.5s}
.mainBusiness .list .st .conW .more .xi{ background:var(--siteC); display:flex; align-items:center; justify-content:center; border-radius:inherit; height:100%; box-sizing:border-box}
.mainBusiness .list .st .conW .more .xi:before{content:"\e913"}
.mainBusiness .list .st:hover .imgW .bg{ background-position-x:100%; transition:1s}
.mainBusiness .list .st:hover .conW .more{ transform:translateX(0)}

.mainProduct .list{ --calcL:7; --calcG:1em}
.mainProduct .list > li{ position:relative; border-radius:1em; background:#fff; box-sizing:border-box; border:1px solid transparent}
.mainProduct .list > li:before{ content:""; border-radius:inherit; position:absolute; inset:0; box-sizing:border-box; background:#fff; border:2px solid var(--siteC); border-bottom-width:.5em; opacity:.2; transition:.3s}
.mainProduct .list .st{ position:relative; box-sizing:border-box; height:100%; padding:1.5em 1em; display:flex; flex-direction:column; align-items:center; text-align:center; gap:1em; }
.mainProduct .list .st .imgW{display: flex; align-items: center; justify-content: center; width: 5em; height:5em; border-radius:50%; background-color: #f1f5f9; box-shadow: inset 0 .25em .25em rgba(0,0,0,.1); transition:.3s}
.mainProduct .list .st .imgW img{ display:block; height:50%}
.mainProduct .list .st .conW .t1{ font-weight:700; opacity:.6; font-size:1.063em}
.mainProduct .list > li:hover{ border-color:rgba(0,0,0,.1)}
.mainProduct .list > li:hover:before{ opacity:.5; border-bottom-width:2px; border-top-width:.5em solid #fff; box-shadow:.5em .5em .25em rgba(0,0,0,.1) inset}
.mainProduct .list > li:hover .imgW{ background:var(--siteC); box-shadow:0 0 .5em rgba(0,0,0,.1)}
.mainProduct .list > li:hover .imgW img{ filter:var(--whiten)}
.mainProduct .list > li:hover .conW .t1{ opacity:1}

.mainFacility .swiper{ overflow:visible}
.mainFacility .swiper-slide{ height:100%; width:auto !important}
.mainFacility .st{ box-sizing:border-box; padding:2em; border-radius:1em; box-shadow: 0 0 1em rgba(0,0,0,.1); margin:0 1em; position:relative; display:flex; flex-direction:column; gap:1.5em; align-items:center; text-align:center}
.mainFacility .st .imgW img{ display:block; height:28vmin;}
.mainFacility .st:before{ content:""; position:absolute; inset:0; background:linear-gradient(45deg, rgba(0,0,0,.1) 0%, #fff 20%, #fff 80%,rgba(0,0,0,.1) 100%); border-radius:inherit; z-index:-1}
.mainFacility .st .conW .t1{ font-weight:700; font-size:1.125em}

.mainValue .list{ --calcL:2; --calcG:0em}
.mainValue .list > li{ position:relative}
.mainValue .list > li .imgW{ position:absolute; width:50vw; height:100%; top:0; left:0}
.mainValue .list > li .imgW:after{ content:""; position:absolute; inset:0; background:#000; opacity:.2}
.mainValue .list > li .imgW .bg{ height:100%}
.mainValue .list > li:first-child .imgW{ left:auto; right:0}
.mainValue .list > li .conW{ padding:12%; position:relative; color:#fff; display:flex; flex-direction:column; gap:1em; box-sizing:border-box; height:100%}
.mainValue .list > li .conW .t1{ font-weight:700; font-size:2em}
.mainValue .list > li .conW .t2{ line-height:1.5; font-size:1.125em}
.mainValue .list > li .conW .moreW{ padding-top:1em; margin-top:auto}

.mainPartenrs .wrapBg:after{ opacity:1; background:linear-gradient(#fff 70%, transparent 100%);}
.mainPartenrs .wrapF{ padding:6vmin 0 10vmin; gap:10vmin}

.mainBoard .inBox{ box-sizing:border-box; border-radius:1em; overflow:hidden; box-shadow:0 0 1em rgba(0,0,0,.1); min-height:22em}
.mainBoard .boardW{ width:50%; background:#f4f7fa}
.mainBoard .boardW .conSt{ padding:1em 2em}
.mainBoard .noticeW{ padding:2.5em}

.mainBoardSt > li > a{ display:flex; height:3em; border-bottom:1px solid rgba(0,0,0,.05); align-items:center; gap:2em; position:relative; box-sizing:border-box; padding:0 .5em}
.mainBoardSt > li > a:after{ content:""; position:absolute; width:0; height:1px; background:#111; left:0; bottom:-1px;}
.mainBoardSt > li > a .tit{ font-weight:500; font-size:1.063em; flex:1 1 0%; min-width:0}
.mainBoardSt > li > a .date{ opacity:.6; font-size:.938em}
.mainBoardSt > li > a:hover{ padding-left:1em; transition:.3s}
.mainBoardSt > li > a:hover:after{ width:100%; transition:.5s}

.mainAbout .gallSt{ overflow:hidden; border-radius:50%}
.mainAbout .gallSt .conW .tit{ opacity:.7}
.mainAbout .gallSt .conW:before{ opacity:.5; background:#000}
.mainAbout .gallSt .conW .more{ display:none}
.mainAbout .swiper-slide-active .gallSt .conW .tit{ opacity:1}
.mainAbout .swiper-slide-active .gallSt .conW .more{ margin-top:1em; display:flex}
.mainAbout .swiper-slide-active .gallSt .conW .more:before{ content:""; position:absolute; left:50%; bottom:100%; height:1.25em; width:1px; background:#fff; transform:translateY(-40%)}
.mainAbout .swiper-slide-active .gallSt .conW:before{ background:var(--siteC); opacity:.8}

.mainBasicSlideW{ --slideG: .75em; filter:drop-shadow(0 0 1em rgba(0,0,0,.1)); margin:0 calc(var(--slideG) * -1) }
.mainBasicSlideW .swiper-slide{ width:50%}
.mainBasicSlideW .swiper-slide > div{ margin:0 var(--slideG)}

.partnerSlideW{ display:flex; flex-direction:column; gap:5vmin}
.partnerSlideW .swiper{ width:100%; overflow:visible}
.partnerSlideW .swiper-wrapper{transition-timing-function: linear}
.partnerSlideW .swiper-slide{ width:20vmin}

.mainCustomer .list{ display:flex; justify-content:center; gap:1em}

/* 견적문의 */
/*member table*/
.table_form_wrap { } 
.table_form_wrap .form_tit { padding:1em 0 } 
.table_form_wrap .form_tit .t1 { font-weight:700; font-size:2.5em } 
.table_form_wrap .form_tit .t2 { font-weight:700; font-size:3em } 
.table_form_wrap .form_tit .t3 { font-weight:500; font-size:1.125em } 
.table_form > li { border-bottom:1px solid #ddd; padding:.75em 0 } 
.table_form > li:first-child { border-top:1px solid #111 } 
.table_form > li.bd0 { border-bottom:none } 
.table_form > li.bd1 { border-top:none } 
.table_form > li.p1 { padding:1.5em 0; } 
.table_form .wrap_in { display:flex; align-items:center } 
.table_form .wrap_in .ti_wrap,
.table_form .wrap_in .con_wrap { min-height:3rem; box-sizing:border-box; display:flex; flex-wrap:wrap; align-items:center; } 
.table_form .wrap_in .tit_wrap { width:12rem; gap:.5rem 0; padding:0 1.25rem; } 
.table_form .wrap_in .ti_wrap { width:14rem; gap:.5rem 0; padding:0 1.25rem; } 
.table_form .wrap_in .tit1 { font-size:1.125em; font-weight:600; } 
.table_form .wrap_in .tit2 { font-size:1.063em; font-weight:600; } 
.table_form .wrap_in .tit3 { font-size:1.000em; font-weight:500; line-height:1.2; } 
.table_form .wrap_in .con_wrap { flex:1 1 0%; min-width:0; gap:.25em; font-size:1em; } 
.table_form .wrap_in .con_wrap > * { flex:1 1 0%; min-width:0 } 
.table_form .wrap_in .con_wrap .inp_tt { flex:0 0 auto; font-size:.938rem; color:#666; } 
.table_form .wrap_in .con_wrap .input_st { width: 100%; min-width: 8rem; } 
.table_form .wrap_in .con_wrap .line { padding-top:.75rem; margin-top:.75rem; border-top:1px solid #ddd } 
.table_form .wrap_in .con_wrap .h1 { height: 300px; } 
.table_form .wrap_in .con_wrap .w1 { flex:0 0 auto; width:3rem } 
.table_form .wrap_in .con_wrap .w2 { flex:0 0 auto; width:9rem } 
.table_form .wrap_in .con_wrap .w3 { flex:0 0 auto; width:13rem } 
.table_form .wrap_in .con_wrap .w4 { flex:0 0 auto; width:16rem } 
.table_form .wrap_in .con_wrap .w5 { flex:0 0 auto; width:20rem } 
.table_form .wrap_in .con_wrap .w6 { flex:0 0 auto; width:26rem } 
.table_form .wrap_in .con_wrap .w50 { flex:0 0 auto; width:50% } 
.table_form .wrap_in .con_wrap .w100 { flex:0 0 auto; width:100% } 
.table_form .wrap_in .con_wrap .label_select.w100{flex: none;}
.table_form .wrap_in .con_wrap .w_auto { flex:0 0 auto } 
.table_form .wrap_in .con_wrap .max1 { max-width:27rem } 
.table_form .wrap_in .con_wrap .max2 { max-width:8.375rem } 
.table_form .wrap_in .con_wrap .max3 { max-width:23.5rem } 
.table_form .wrap_in .con_wrap .min1 { min-width:23.5rem } 

.table_form .wrap_in.col { flex-direction:column } 
.table_form .wrap_in.col > * { flex:0 0 auto; width:100% } 
.table_form .wrap_in.col .tit_wrap { padding:0 0; } 

.table_form .wrap_in .con_wrap .field.col_w3 .input_st { max-width: 12rem; } 

.filebox label { padding: 10px 20px; color: #fff; background-color: #999; cursor: pointer; margin-left: 10px; display: flex; align-items: center; justify-content: center; width: 7.25rem; min-width: 6.25rem; } 
.filebox input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; } 

.qna_wrap { text-align: center; padding: 3.5rem 0; margin-bottom: 2.5rem; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } 
.contact_wrap .form_wrap { flex: 1 1 100%; padding: 3.5rem; background: #f5f5f5; border-radius: .5rem; } 

.qna_wrap .symbol { margin-bottom: .5rem; } 
.qna_wrap .symbol > img { width: 3rem; } 


/* 개인정보 */
.agree_box_wrap .check { padding: 1rem 2rem; text-align: center; background: #edf1f5; display: flex; justify-content: center; align-items: center } 
.agree_box_wrap .check .sub_tt { font-size: var(--font-size-base); font-weight: 600; } 
.agree_box_wrap .agree_box { margin-top: 1rem; height: 16em; overflow-y: scroll; } 

.agree_boxS_pop { border-radius: .5rem; border: 1px solid #ddd; padding: 1.5rem 2rem; color: #555; line-height: 1.8; font-size: var(--font-size-sm); } 

.agree_wrap { box-shadow:0 0 1rem rgba(0,0,0,.1); padding:2rem; color:#666 } 
.agree_box { border-radius:.5rem; border:1px solid #ddd; padding:1.5rem 2rem; color:#555; line-height:1.6; } 
.agree_box.h1 { height:12rem; overflow-y:auto; } 
.agree_box p { padding:.5rem 0; } 
.agree_box strong { font-size:var(--font-size-base); color:#000; } 


/* 찾아오시는 길 */
.map_con { position: relative; border-radius: 1em; overflow: hidden; box-shadow: 0 0.8rem 4rem rgba(0, 0, 0, 0.1); border: 5px solid #fff; box-sizing: border-box;} 
.location_Bg .map_con:last-of-type { margin-bottom: 0rem; } 
.map_wrap { width: 100%;} 
.map_wrap > .root_daum_roughmap { border-radius: 1rem 1rem 0 0; overflow: hidden; } 
.map_wrap iframe { width: 100%; } 
.root_daum_roughmap { width: 100% !important; } 
.root_daum_roughmap .cont .section_address, .root_daum_roughmap .wrap_controllers { display: none; } 
.location_info { margin-top: -0.25rem; position: absolute; z-index: 1; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%;} 
.location_info > .con { display: flex; gap: 3rem;box-shadow: 0 1.7rem 2.7rem rgba(0, 0, 0, 0.1); background: #ffffff;  padding: 3rem 4rem; border-radius: 1rem; border: 1px solid #ccc; align-items: stretch; margin: 1.5rem;} 
.location_info > .con > .office { width: 17rem; border-right: 1px solid #e2e8f0; display: flex; align-items: center; } 
.location_info > .con > .office > .tt { font-size: 1.5rem; font-weight: 800; color: var(--color-point3); word-break: keep-all; line-height: 1.5; } 
.location_info > .con > .office .logo { width:100%; padding-right:1rem; box-sizing:border-box; height: 66px; display: flex; gap: 1rem; } 
.location_info > .con > .address { width: 60%; padding: 1.2rem 0; } 
.location_info > .con > .address .tit { font-size: 1.4375rem; font-weight: 600; color: var(--color-point); } 
.location_info > .con > .address .tit .xi { margin-right: 0.5rem; background: var(--siteC); color: #fff; width: 1.875rem; height: 1.875rem; font-size: 1rem; line-height: 1.875rem; text-align: center; border-radius: 50%; } 
.location_info > .con > .address > .add_info { display: flex; gap: 2rem; align-items: center; margin-top: 1.5rem; } 
.location_info > .con > .address > .add_info > li > .call_con { display: flex; align-items: center; gap: .5rem; } 
.location_info > .con > .address > .add_info > li > .call_con > .xi { font-size: 1.0625rem; color: #555; } 
.location_info > .con > .address > .add_info > li > .call_con > .tt { font-size: 1.0625rem; color: #555; } 
.location_info > .con > .map_view { width: 8rem; border: 1px solid var(--siteC); border-radius: 1rem; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: .2s; color: var(--siteC); } 
.location_info > .con > .map_view > .xi { font-size: 2.125rem; } 
.location_info > .con > .map_view > .mapViewT { font-size: 1.0625rem; font-weight: 500; margin-top: .35rem; } 
.location_info > .con > .map_view:hover { background: var(--siteC); color: #fff; } 
.locWrap { margin-top: 4rem; } 
.locWrap .locList > li.w100 { flex: 1 1 100%; max-width: 100%; } 
.locWrap .locList > li > .in { margin: 0 0 3rem 2rem; } 
.locWrap .locList > li > .in > .iconWrap { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; border-bottom: 2px solid #f0f4f8; } 
.locWrap .locList > li > .in > .iconWrap > .tt { font-size: 1.3125rem; font-weight: 600; line-height: 1; } 
.locWrap .locList > li > .in .icon { position: relative; top: 1px; display: flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; color: var(--siteC); background: #e8f4fd; border-radius: 0.5rem; } 
.locWrap .locList > li > .in > .info { padding-left: 4.6rem; } 
.locWrap .locList > li > .in > .info > li { margin-bottom: .5rem; } 
.locWrap .locList > li > .in > .info > li:last-of-type { margin-bottom: 0; } 
.locWrap .locList > li > .in > .info .con > .tt { font-size: 1.0625rem; font-weight: 400; line-height: 1.6; } 
.locWrap .locList > li > .in > .info .con > .tt > i, .locWrap .locList > li > .in > .info .con > .tt > b { vertical-align: baseline; } 
.locWrap .locList > li > .in > .info .con .txt_box { background: #f8fafc; padding: 1.2rem; box-sizing: border-box; margin-top: .7rem; border-radius: 0.8rem; border: 1px solid #edf2f7; } 
.locWrap .locList > li > .in > .info .con .txt-in { margin-top: 1rem; gap: 0.5rem .7rem; } 
.locWrap .locList > li > .in > .info .con .txt-in:first-child { margin-top: 0; } 
.locWrap .locList > li > .in > .info .con .txt-in > span { background: #fff; padding: 0.5rem 0.5rem; border-radius: 5px; align-items: center; flex-wrap: wrap; gap: var(--gap-sm); } 
.locWrap .locList > li > .in > .info .con .txt-in .xi { font-size: 0.75rem; border-radius: 50%; background: #e2e8f0; color: #718096; padding: 0.3rem; width: fit-content; } 
.locWrap .locList > li > .in > .info .con .txt-in i:not(.xi) { display: inline-block; padding: .25rem .75rem; white-space: nowrap; border-radius: 100px; overflow: hidden; background: #eee; font-size: 0.875rem; } 
.locWrap .locList > li > .in > .info .con .txt-in i.nor { background: rgba(0, 129, 222, 0.08); color: var(--siteC); font-weight: 600; border: 1px solid rgba(0, 129, 222, 0.15); } 

/* 연혁 */
.historyWrapper .inner{padding: 0 2em;}
.historyWrapper .history{ position:relative; padding:100px 0 200px; }
.historyWrapper .history .linewrap{ position: absolute; top: 0px; left:calc(240px + 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(240px + 330px - 80px);top:0; }
.historyWrapper .history > div{ display:flex;justify-content:space-between; margin-bottom:85px; }
.historyWrapper .history > div:last-child{margin-bottom:0;}
.historyWrapper .history > div .decade{ position:relative; width:240px; font-size:4em;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:33px;z-index:10; }
.historyWrapper .history > div .decade:after{ display:block;content:""; width:240px;height:1px; box-sizing:border-box; background:#ddd; position:absolute;left:calc(100% + 10px);top:40px; }
.historyWrapper .history > div ul{ position:relative; box-sizing:border-box; width:calc(100% - 240px); padding-top:28px;padding-left:330px; }
.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:243px;top:33px;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:228px;top:18px;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; display: flex; gap: 2.5em; 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 .year{font-weight: 700; color: #111;}

.historyWrapper .top_img{width: 100%; border-radius: 1em; overflow: hidden; height: 22em; position: relative;}
.historyWrapper .top_img::before{ position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3);}
.historyWrapper .top_img .img_wrap{width: 100%; height: 100%;}
.historyWrapper .top_img .img_wrap img{width: 100%; display: block; object-position: center; object-fit: cover; height: 100%;}
.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;}


/* 구성원 */
/* 조직도 */
.orgWrapper{padding: 0 5rem 5rem; box-sizing: border-box; border: 1px solid #ddd; border-radius: 1em;}
.orgWrapper .orgTop {position: relative; padding-bottom: 6rem; margin-top:4rem;}
.orgWrapper .orgCon {text-align:center; position: relative;}
/* .center-line {display: block; content: ""; width: 1px; height: 31.4%; top: 22.223%; position: absolute; background: rgba(0, 0, 0, 0.1); left: 50%; transform: translateX(calc(-50% + 0.5px));} */
/* .center-line:after {display: block; content: ""; position: absolute; top: 50%; transform: translateY(calc(-50% + 0.5px)); width: 30rem; height: 1px; background: rgba(0, 0, 0, 0.1);} */
/* 조직도 상단 */
.orgWrapper .org_ceo {position: relative;}
.orgWrapper .orgTop:after {display: block; content:""; position:absolute; left: 50%; bottom:2.5rem; width: 1px; height: calc(100% - 2.5rem); transform:translateX(calc(-50% + 0.5px)); background: rgba(0,0,0,0.1); z-index: -1;}
.orgWrapper .org_ceo .in {background: var(--siteC); position: relative; border-radius:5px; text-align:center; display:flex; flex-direction:column; justify-content:center; width: 12rem; height: 12rem; margin: 0 auto; padding:0 1rem; box-sizing:border-box; border-radius: 100em;}
.orgWrapper .org_ceo .in::before{position: absolute; content: ''; background-image: url(../images/inc/logoS2.svg); background-size: 100% 100%; width: 137px; height: 90px; filter: brightness(0) invert(1); opacity: 0.2; bottom: -0.6rem; right: -2rem;}
.orgWrapper .org_ceo .t1 {color: #fff; font-size:1.38rem; letter-spacing:-0.03em; line-height:1.6em; font-weight: 600; /* padding: 0 1rem; */}
.orgWrapper .org_ceo .position{font-size:1.25rem; letter-spacing:-0.03em; font-weight: 500; color: #fff; margin-top: 1rem; padding: 0.7rem 1rem 0; border-top:1px solid rgba(255,255,255,0.1);}
/* 조직도 중단 */
.orgWrapper .org_d1 {position: relative; z-index: 1; text-align:right; margin-top: 2rem; left:auto; bottom:auto; margin-left:auto;}
.orgWrapper .org_d1:before{display: none;}
.orgWrapper .org_d1 .in {position: relative; width: 16rem; display:flex; align-items:center; justify-content:center; flex-direction:column; background: #002144; border-radius:5px; padding: 1.5rem; text-align:center; box-sizing:border-box; margin-left:calc(50% + 10rem);}

.orgWrapper .org_d1 .in:before {display: block; content:""; left: 0; top: 50%; position:absolute; height: 1px; width: 10rem; background: rgba(0,0,0,0.1); transform:translate(-100%, calc(-50% + 0.5px)); z-index:-1;}
.orgWrapper .org_d1 .t1 {color: #fff; font-weight: 700; font-size:1.25rem; letter-spacing:-0.03em; }
.orgWrapper .org_d1 .position {color: rgba(255,255,255,0.7); font-size:1.25rem; letter-spacing:-0.03em;}
/* 조직도 하단 */
.orgWrapper .orgBottom {margin-top: 0;  width: 100%;}
.orgWrapper .orgBottom ul {position: relative; display:flex;}
.orgWrapper .orgBottom ul:after {display: block; content: ""; position: absolute; left: 50%; top: -2.5rem; width: 81.673%; height: 1px; background: rgba(0, 0, 0, 0.1); transform: translateX(calc(-50% + 0.5px));}
.orgWrapper .orgBottom ul li {position: relative; width: calc((100% - 12rem) / 4); margin-right: 1.7rem;}
.orgWrapper .orgBottom ul li:last-child {margin-right: 0;}
.orgWrapper .orgBox {position: relative; background-color:#f1f1f1; margin-top: 1rem; text-align:center; padding: 1rem 0; border-radius:5px;}
.orgWrapper .orgBox:after {display: block; content: ""; position: absolute; left: 50%; width: 1px; height: 1rem; background: rgba(0, 0, 0, 0.1); top: -1rem; transform: translateX(calc(-50% + 0.5px)); z-index: -1;} 
.orgWrapper .orgBox:last-of-type:after {height: 2rem; top: -2rem;}
.orgWrapper .orgBox:first-of-type {margin-top: 1rem;}
.orgWrapper .orgBox .t1 {font-size:1.125rem; letter-spacing:-0.03em; color: #000; font-weight: 700; padding: 0 1rem;}
.orgWrapper .org_team {position: relative; display: inline-block; width: 100%; text-align: center; font-size:1.25rem; letter-spacing:-0.03em; font-weight: 700; color: #fff; border-radius:5px; background-color: #333; padding: 1rem; box-sizing:border-box;}
.orgWrapper .org_team:after {display: block; content:""; position:absolute; left: 50%; transform:translateX(calc(-50% + 0.5px)); width: 1px; height: 2.5rem; background: rgba(0, 0, 0, 0.1); top: -2.5rem; z-index: -1;}

/* 테이블 스크롤 */
.scr_i { display: none; } 

/* .ideo-tit{z-index:9;}

.rnd-intro-con .rnd-intro-item:last-child{position: relative; z-index:9;}
.rnd-intro-con .rnd-intro-item:last-child .txtBox .area-inner:after{display: block; width: 2px; height: 50%; border-radius: 100%; background: #fff; position: absolute; content: ""; left: -1px; top: calc(50% + 0.5rem);}
 */

/* 인사말 */
.greetingWrapper .boxIn{width: 1320px; margin: 0 auto; max-width: 94%; padding-bottom: 3em;}
.greeting_tit strong {font-size:5rem; letter-spacing:-0.01em; font-weight: 800; color: #000; line-height:1.4em;}
.greeting_tit strong > span {color:var(--main-color);}
.greeting_tit p {font-size:2.5rem; letter-spacing:-0.064em; color: #000; font-weight: 700; line-height:1.5em;}
.greet_img {width: 50%; margin-top: -4rem;}
.greet_img img {max-width:100%;}
.greeting_txtWrap {background: #f5f5f5; padding: 4rem 0 9rem;} 
.greeting_txtWrap .inner {display:flex; align-items:center;}
.greeting_txtWrap .txtBox {width: 55%; padding-right: 8rem; box-sizing: border-box;}
.greeting_txtWrap .txtBox .tt {font-size:1.125rem; letter-spacing:-0.036em; color: #666; font-weight: 500; line-height:1.889em; margin-top: 2rem;}
.greeting_txtWrap .txtBox .tt b{font-size:1.33em; font-weight:700;}
.greeting_txtWrap .txtBox .tt:last-of-type {margin-top: 4rem;}
.greeting_txtWrap .txtBox .tt:first-of-type {margin-top: 0;}
/* .greeting_txtWrap .txtBox .tt:nth-child(5) {margin-top: 4rem;} */
.greeting_txtWrap .txtBox .ceo {font-size:1.75rem; letter-spacing:-0.04em; color: #000; font-weight: 500; line-height: 1.7em; margin-top: 3.5rem;}
.greeting_txtWrap .txtBox .ceo > span {font-weight: 700; font-size: .8em;}
.greeting_txtWrap .txtBox .ceo > i{}
.greeting_txtWrap .txtBox .ceo img {margin-left: 1.7rem;}


/**/
.page_tit { margin:0 0 1.25em 0 } 
.page_tit.c_white { color: #fff; } 
.page_tit.m0 { margin-bottom:0; } 
.page_tit.m1 { margin-bottom:2.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; line-height: 1.45; text-transform: uppercase; } 
.page_tit .t1 { font-size: 2.515em; line-height: 1.45; } 
.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-size:1.515em; text-transform: uppercase; } 
.page_tit .t4 { font-size:2em; line-height: 1.3; } 
.page_tit .t5 { font-size:1.188em; text-transform: uppercase; } 
.page_tit .t6 {font-size:.938em; } 
.page_tit .t7 { font-size:1.063em; } 
.page_tit .t8 {font-size:1.25em; color:#666; line-height: 1.6;} 
.page_tit .t9 { font-size:1.75em;  } 
.page_tit .t10 { font-size:1.88em;  } 
.page_tit .t11 { font-size:2.75em; line-height: 1.35; } 
.page_tit:last-child{ margin-bottom:0 !important;}

.page_con.p1{padding: 3.5rem 0;}
.page_con.p2{padding: 4rem 0 6rem;}
.page_con.p3{padding: 6.5rem 0 10rem;}
.page_con.p4{padding: 1.5rem 0 5.3rem;}
.page_con.bg1{background: #f1f1f1; }

.page_con + .page_con{ margin-top: 6.5rem;}

/*  */
.overview_info{ background-repeat: no-repeat; background-size: cover; width: 100%; /* padding: 4.5rem 0; */ box-sizing: border-box; margin-top: 4rem;}
.overview_info .infoList{ display: flex;  background: #f5f5f5;  border-radius: 1em;}
.overview_info .infoList li{flex: 1; display: flex; gap: 1.5rem; flex-direction: column; align-items: center; padding: 3.2rem 0; box-sizing: border-box; border-left: 1px solid #ddd;}
.overview_info .infoList li:first-child{border-left: none;}
.overview_info .infoList li .img_wrap{ }
.overview_info .infoList li .img_wrap img{ height: 3.4rem; filter: invert(24%) sepia(77%) saturate(7497%) hue-rotate(195deg) brightness(95%) contrast(102%);}
.overview_info .infoList li .txt{  text-align: center;}
.overview_info .infoList li .txt .t1{font-weight: 600; color: #333;}
.overview_info .infoList li .txt .tit{ margin-top: 0.5rem;}
.overview_info .infoList li .txt .tit .num{font-size: 1.38em; font-weight: 700; margin-right: 0.05em;}
.overview_info .infoList li .txt .tit .tt{font-size: 1.25em; font-weight: 500;}

.companyOverview{margin: 2rem 0 0; padding: 2.5rem 4rem; border: 1px solid #ddd; border-left: none; border-right: none; display: flex; }
.companyOverview .company_info{width: 50%; display: flex; flex-direction: column; gap: 1.2rem;}
.companyOverview .company_info .company_dl{display: flex;}
.companyOverview .company_info .company_dl dd{font-size: 1.125em; width: 8vw; font-weight: 700;}
.companyOverview .company_info .company_dl dt{font-size: 1.125em; color: #333; font-weight: 500;}

.business_wrap{}
.business_wrap .business_con{display: flex; padding: 2rem 1rem; box-sizing: border-box; border-top: 1px solid #ccc; }
.business_wrap .business_con:last-child{border-bottom: 1px solid #ccc;}
.business_wrap .business_con .img_wrap{width: 35%; border-radius: 1em 0 0 1em; overflow: hidden;}
.business_wrap .business_con .img_wrap img{display: block; width: 100%; height: 100%; object-fit: cover;}
.business_wrap .business_con .txt_wrap{width: 65%; background: #fff; border-radius: 0 1em 1em 0; padding: 3.5rem 3.5rem 6rem; box-sizing: border-box;}
.business_wrap .business_con .txt_wrap .s_tit{font-weight: 800; color: var(--siteC);}
.business_wrap .business_con .txt_wrap .tit{font-size: 2.25em; margin-top: 0.5rem; font-weight: 700;}
.business_wrap .business_con .txt_wrap .tt{font-size: 1.125em; margin-top: .8em; color: #555; font-weight: 500; line-height: 1.45;}

/* 사업부소개 */
.mainten_Wrap { background: #fff; padding: 6em 0 8em 0; } 
.maintenBox { } 
.maintenBox .item { display: flex; gap: 2em; margin-bottom: 3em; } 
.maintenBox .item .leftB { width: 40%; display: flex; flex-direction: column; border-radius: 1.5em; overflow: hidden; justify-content: space-between; padding: 3em; box-sizing: border-box; background: #f7f7f7; border: 1px solid #ddd; transition: .3s; } 
.maintenBox .item .leftB .numT { } 
.maintenBox .item .leftB .numT > p { font-size: 2.515em; font-weight: 700; color: rgba(0,0,0, .1); transition: .3s; } 
.maintenBox .item .leftB .btmT { } 
.maintenBox .item .leftB .btmT .tit { font-size: 2em; font-weight: 700; margin-bottom: .6em; transition: .3s; } 
.maintenBox .item .leftB .btmT .desc { font-size: 1.063em; line-height: 1.4; color: rgba(0,0,0, .9); transition: .3s; } 
.maintenBox .item .rightB { flex: 1; } 
.maintenBox .item .rightB > .img_con { width: 100%; height: 27.5em; border-radius: 1.5em; overflow: hidden; }
.maintenBox .item .rightB > .img_con > img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); transition: 2s;} 


.maintenBox .item:hover .leftB { background: var(--siteC); border: 1px solid var(--siteC); } 
.maintenBox .item:hover .leftB .numT > p { color: #ddf4ff7a; } 
.maintenBox .item:hover .leftB .btmT .desc,
.maintenBox .item:hover .leftB .btmT .tit { color: #fff; } 
.maintenBox .item:hover .rightB > .img_con > img{ transform: scale(1);}


/*  */
/* .product_wrapper .product_category{ justify-content: space-between;}
.product_wrapper .product_category .product_cateBtn{ display: flex; gap: .5em; padding: 0.5em; box-sizing: border-box; background: #f1f1f1; border-radius: 100px; overflow-x: auto; overflow-y: hidden;}
.product_wrapper .product_category .product_cateBtn li{}
.product_wrapper .product_category .product_cateBtn li a{display: block; padding: 0em 2em; height: 3.4em; line-height: 3.4em; background: #fff; border-radius: 100px; color: #333; border: 1px solid #ddd;}
.product_wrapper .product_category .product_cateBtn li a .tt{font-size: 1.125em; font-weight: 600;}
.product_wrapper .product_category .product_cateBtn li.on a{background: var(--siteC); color: #fff; border-color: var(--siteC);} */
.product_wrapper .product_list{display: flex; flex-wrap: wrap; gap: 4em 2.5em;}
.product_wrapper .product_list li{width: calc((100% - 7.5em) / 4);}
.product_wrapper .product_list li .in{width: 100%; display: block;  }
.product_wrapper .product_list li .in .img_wrap{width: 100%; height: 100%; overflow: hidden; border-radius: 1em; background: #f1f1f1; padding: 2.5em; box-sizing: border-box; position: relative;}
.product_wrapper .product_list li .in .img_wrap::before{position: absolute; left: 0; top: 0; content: ''; width: 100%; height: 100%; border: 2px solid var(--siteC); z-index: 1; opacity: 0; transition: 0.2s ease-in-out; box-sizing: border-box; border-radius: 1em;}
.product_wrapper .product_list li .in .img_wrap:hover::before{opacity: 1;}
.product_wrapper .product_list li .in .img_wrap img{width: 100%; height: 100%; object-fit: contain; display: block; transition: 0.2s ease-in-out;}
.product_wrapper .product_list li .in .img_wrap:hover img{transform: scale(1.1);}
.product_wrapper .product_list li .in .txt_wrap{margin-top: 1.3em; padding: 0 .5em;}
.product_wrapper .product_list li .in .txt_wrap .t1{font-size: 1.06em; color: var(--siteC); font-weight: 600;}
.product_wrapper .product_list li .in .txt_wrap .tit{font-size: 1.38em; font-weight: 700; padding: 0.4em 0;}












