@charset "utf-8";
/* CSS Document */
.box0{ padding:0 var(--pagePD); box-sizing:border-box}
.boxSub,
.box1{ box-sizing:border-box; width:1400px; margin:0 auto}
.box2{ box-sizing:border-box; width:1200px; margin:0 auto}

.gnb li.m_hide{ display:none}
body:not(.pop){ display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100)}
body {overflow:hidden;}

#header{ position: fixed; left:0; top:0; width:100%; z-index:1000; background:#fff}
#header .top_wrap{ position:relative}
#header .top_wrap .wrapH,
#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:2.25em; 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:2vmin}
#header .top_wrap .etc_wrap .btnInc{ width:3em; height:3em; display:flex; align-items:center; justify-content:center; border-radius:1em}
#header .top_wrap .etc_wrap .btnInc .ico{ font-size:1.75em}
#header .top_wrap .etc_wrap .allBtn{ position:relative}
#header .top_wrap .etc_wrap .allBtn .line{ width:90%; height:1px; position:absolute; left:50%; top:50%; background:#000; transition:.3s}
#header .top_wrap .etc_wrap .allBtn .line.e1{ transform:translate(-50%, -.375em)}
#header .top_wrap .etc_wrap .allBtn .line.e2{ transform:translate(-50%, .375em)}
#header .top_wrap .etc_wrap .lang_wrap{ position:relative}
#header .top_wrap .etc_wrap .lang_wrap .langBtn{ display:flex; gap:.25em; align-items:center; box-sizing:border-box; height:2em; padding:0 .75em; border-radius:.5em .5em 0 0; position:relative; z-index:1}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .arrow{ margin-left:.5em; transition:.3s}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .arrow:before{content:"\e936"}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .ico{ font-size:1em}
#header .top_wrap .etc_wrap .lang_wrap .langBtn .t1{ font-weight:900; font-size:.875em; text-transform: uppercase;}
#header .top_wrap .etc_wrap .lang_wrap .list{ position:absolute; left:0; top:100%; width:100%; visibility:hidden; opacity:0; transform:translateY(-1em); z-index:-1; border-radius:0 0 .5em .5em; background:var(--siteC); padding:.25em; box-sizing:border-box; box-shadow:0 1em 1em rgba(0,0,0,.1); display:flex; flex-direction:column; gap:1px}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a{ padding:.25em .75em; display:flex; align-items:center; color:#fff; border-top:1px solid rgba(255,255,255,.2); overflow:hidden}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .t1{ font-weight:900; font-size:.75em; text-transform: uppercase}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .arrow{ margin-left:auto; font-size:1em}
#header .top_wrap .etc_wrap .lang_wrap .list > li > a .arrow:before{ content:"\e907"}
#header .top_wrap .etc_wrap .lang_wrap .list > li.on > a{ color:#888}
#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(100%); transition:.3s}
#header .top_wrap .etc_wrap .lang_wrap .list > li:not(.on) > a:hover .arrow{ opacity:1; transform:translateX(0)}
#header .top_wrap .etc_wrap .lang_wrap.on .langBtn{ background:var(--siteC); color:#fff}
#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; z-index:auto; transform:translateY(0); transition:.3s}



html:not(.allOn) #header .top_wrap .etc_wrap .allBtn:hover .line{ width:70%}
html:not(.allOn) #header .top_wrap .etc_wrap .allBtn:hover .line.e1{ margin-left:10%}
html:not(.allOn) #header .top_wrap .etc_wrap .allBtn:hover .line.e2{ margin-left:-10%}

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;}
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.125em}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2{ display:none}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp1,
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1{ color:var(--siteC)}

html #header .top_wrap .gnb_wrap .gnb > li .dp1 .va{ position:relative}
html #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after{ content:""; position:absolute; bottom:0; left:50%; width:0; height:1px; background:var(--siteC); transform:translate(-50%, .25em)}
html #header .top_wrap .gnb_wrap .gnb li:hover > a .va:after,
html #header .top_wrap .gnb_wrap .gnb li.on .dp1 .va:after{ width:100%; transition:.3s}

html.main:not(.scroll):not(.allOn) #header{ background:none}

html:is(.allOn,.main:not(.scroll)) #header{ color:#fff}
html:is(.allOn,.main:not(.scroll)) #header .top_wrap .logo .in,
html:is(.allOn,.main:not(.scroll)) #header .top_wrap .etc_wrap .allBtn,
html:is(.allOn,.main:not(.scroll)) #header .top_wrap .gnb_wrap .gnb > li .dp1,
html:is(.allOn,.main:not(.scroll)) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after{ filter:brightness(0) invert(1)}

.scroll.up #header{ box-shadow:0 0 1em rgba(0,0,0,.2); transition:transform .3s}
.scroll:not(.up):not(.allOn) #header{ transform:translateY(-100%); box-shadow:none}

.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 .etc_wrap .allBtn .line{ position: absolute; left:50%; top:50%; width:90%}
.allOn #header .top_wrap .etc_wrap .allBtn .line.e1{ transform:translate(-50%, -50%) rotate(45deg)}
.allOn #header .top_wrap .etc_wrap .allBtn .line.e2{ transform:translate(-50%, -50%) rotate(-45deg)}
.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{ order:1; flex:1; min-height:0; width:100%; display:flex; align-items:center; box-sizing:border-box; padding-bottom:var(--headerH); position:relative}
.allOn #header .top_wrap .gnb_wrap .gnb{ width:100%; max-height:100%}
.allOn #header .top_wrap .gnb_wrap .gnb > li{ flex:1; padding-bottom:calc(var(--headerH) / 2)}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1{ height:calc(var(--headerH) * 1.5)}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt{ font-size:1.75em; font-weight:800}
.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:1.063em}
.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}

#footer{ z-index:1; padding:5em 0; background:#000; color:#fff}
#footer .goTop{ position:fixed; right:0; bottom:0; width:3.5em; line-height:3.5em; text-align:center; background:var(--siteC); color:#fff; box-shadow:0 0 1em rgba(0,0,0,.1); opacity:0; transform:translateY(100%); transition:.5s}
#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:4em; justify-content:space-between;}
#footer .logo_wrap{ display:flex; flex-direction:column; align-items:center; gap:2em}
#footer .logo img{ height:2em; filter:brightness(0) invert(1)}
#footer .menu_wrap{ display:flex; display:flex; flex-direction:column; gap:2em}
#footer .menu{ display:flex; flex-direction:column; gap:1em 0}
#footer .menu > li{ width:100%;}
#footer .menu > li > a{ display:block; padding-right:2em;position:relative; color:#fff; font-size:.938em; opacity:.7}
#footer .menu > li > a:after{ content:"\e915"; font-family:xeicon; position:absolute; right:0; top:0; transform:rotate(45deg)}
#footer .menu > li.point > a{ opacity:1; font-weight:700}
#footer .info_wrap{ display:flex; flex-direction:column; gap:2.5em; flex:1; min-width:0}
#footer .info{ overflow:hidden}
#footer .info > li{ float:left; margin-right:2em; margin-bottom:.5em; opacity:.7; position:relative; font-size:.938em}
#footer .info > li:before{ content:""; position:absolute; left:-1em; height:70%; top:50%; transform:translateY(-50%); width:1px; background:#fff; opacity:.2}
#footer .info > li.point{ font-weight:700}
#footer .info > li.br{ clear:left}
#footer .info > li.copyright{ font-size:.813em; opacity:.6; margin-top:1em; text-transform:uppercase}
#footer .cs_wrap{ display:flex; gap:0 4em; text-align:right}
#footer .cs_wrap .wrap_in{ position:relative}
#footer .cs_wrap .wrap_in:not(:first-child):after{ content:""; position:absolute; left:-2em; top:0; width:1px; height:100%; background:#fff; opacity:.2}
#footer .cs_wrap .t1{ opacity:.7; font-weight:500; margin-bottom:.5em}
#footer .cs_wrap .t2{ font-weight:700; font-size:1.125em}

#contents{ flex:1 1 0%; min-height:0; box-sizing:border-box}
#contents .sub_top_wrap{ height:60vh; 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:100% auto; 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; justify-content:center; color:#fff; line-height:1; gap:1em; box-sizing:border-box; padding:1em}
#contents .sub_top_wrap .subTit .t1{ font-size:10vmin; font-weight:900; 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; border-radius:1em 1em 0 0 ; overflow:hidden;background:var(--siteC);}
#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;  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:last-child > a:before{ display:none}
#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:1em; 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); border-radius:1em 1em 0 0 ;}
#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:6vmin 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:center 20%; transition:3s}
#contents .sub_top_wrap.on .wrapBg .bg:not(.vod_wrap){background-position:center 60%}

#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; 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}
.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)}
.sns_st > li > a.kc img{ height:1.438em}

/**/
.mainBox{ padding:12vmin 0; position:relative}
.mainBox.bg1{ background:#ebecf0}
.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:.2}
.mainBox .wrapF{ display:flex; flex-direction:column; gap:4em 12vmin; position:relative}
.mainBox .wrapF .mainTit{ margin-bottom:0}
.mainBox .wrapF.dRow{ flex-direction:row; align-items:center}
.mainBox .wrapF.dRow .wrapCon{ flex:1; min-width:0}

.mainTit{ display:flex; flex-direction:column; align-items:flex-start; gap:2.5em; margin-bottom:2em}
.mainTit.ac{ align-items:center; text-align:center}
.mainTit.g1{ gap:4em}
.mainTit .wIn{ display:flex; flex-direction:column; gap:1.5em;}
.mainTit .tit1{ font-size:2.875em; font-weight:900; letter-spacing:-.05em; word-spacing:.2em; padding:0 .1em; line-height:1.1; text-transform:uppercase}
.mainTit .tit2{ font-size:2em; font-weight:700; color:#333; word-spacing:.2em}
.mainTit .tt1{ font-weight:500; font-size:1.125em; line-height:1.8}
.mainTit .mgL{ margin-left:auto}
.mainTit.white{ filter:brightness(0) invert(1)}
.mainTit.white .tt1{ opacity:.8}
.mainTit .mainMore{ margin:4em 0 0 0}
.mainTitW{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2em}
.mainTitW .mainTit{ margin-bottom:0}

.mainMore{ display:flex; align-items:center; gap:1em; color:#333}
.mainMore .t1{ font-size:1.125em; font-weight:700}
.mainMore .arrow{ display:flex; align-items:center}
.mainMore .arrow:before{ content:""; display:block; width:3em; height:1px; background:#333; transition:.3s}
.mainMore .arrow .cc{ width:1em; height:1em; background:#333; border-radius:50%; position:relative}
.mainMore .arrow .cc:before{ content:""; position:absolute; left:0; top:calc(50% - 1px); width:60%; height:1px; background:#fff}
.mainMore:hover .arrow:before{ width:4em}
.mainMore.white{ color:#fff}
.mainMore.white .arrow{ filter:invert(1)}
.mainMore.st1{ border:2px solid #ddd; padding:1.5em 3em; font-size:1.125em; border-radius:.25em}

.tabSt{ display:flex; gap:4em; align-items:center}
.tabSt > li > a{ position:relative; opacity:.5}
.tabSt > li > a .t1{ font-weight:700; font-size:1.25em}
.tabSt > li.on > a,
.tabSt > li:hover > a{ opacity:1}
.tabSt > li.on > a:before{ content:""; position:absolute; right:calc(100% + .25em); top:0; width:.375em; height:.375em; border-radius:50%; background:#111}

.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:.1}
.vod_wrap .layer.gra{ background: linear-gradient(0deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,.3) 100%);}
.visualSlide .el{ position: relative; overflow:hidden; height:100vh; background:#fff}
.visualSlide .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.15)}
.visualSlide .el .vod_wrap{ position:absolute; left:0; top:0; width:100%; height:100%;}
.visualSlide .el .vod_wrap:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000}
.visualSlide .el.swiper-slide-active .vod_wrap:after,
.visualSlide .el.swiper-slide-duplicate-active .vod_wrap:after{ transition:2s; opacity:.4}
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg{ transition:7s; transform:scale(1) rotate(.001deg)}

.visualSlide_wrap { position:relative}
.visualSlide_wrap .slogan{ position:absolute; width:100%; height:100%; left:0; top:0; color:#fff; z-index:10}
.visualSlide_wrap .slogan .in{ display:flex; flex-direction:column; justify-content:center; align-items:center; height:100%; box-sizing:border-box}
.visualSlide_wrap .slogan .t1{ font-size:6vmin; font-weight:900; text-transform:uppercase; word-spacing:.5vmin; margin-bottom:6vmin; display:flex; gap:.5em}
.visualSlide_wrap .slogan .t2{ font-weight:500; font-size:3vmin}

.visualSlide_wrap .controlW{ position:absolute; bottom:2em; z-index:10; width:100%}
.visualSlide_wrap .controlW .wrapIn{ display:flex; align-items:flex-end;}
.visualSlide_wrap .swiperControl{ display:flex; align-items:center;}
.visualSlide_wrap .swiperControl .paging{ display:flex; margin:0}
.visualSlide_wrap .swiperControl .paging span{ font-size:.75em}
.visualSlide_wrap .swiperControl .paging span.swiper-pagination-bullet-active{ height:0; width:8em; transform:none; transition:width .5s}
.visualSlide_wrap .swiperControl .btnW{ display:flex; margin:0 1em}
.visualSlide_wrap .swiperControl .btnW .swiperBtn:hover{ background:none}

.mainScroll{ width:14vmin; position:relative; margin-left:auto; color:#fff}
.mainScroll .svgtt{ width:100%; height:100%}
.mainScroll .svgtt .tt{ text-transform:uppercase; letter-spacing:.125em; word-spacing:.25em; fill:#fff}
.mainScroll .in{ position:absolute; left:10%; top:10%; width:80%; height:80%; border-radius:50%; display:flex; align-items:center; justify-content:center; text-align:center; box-sizing:border-box}
.mainScroll .in .ico1{ font-size:2em; margin-right:-.25em}

.mainAbout{ overflow:hidden}
.mainAbout .list{ --mainSecGap:2em; display:flex; gap:var(--mainSecGap)}
.mainAbout .list > li{ width:calc(33.33% - (var(--mainSecGap) * 2 / 3));}
.mainAbout .list .in{--mainAboutBg:var(--siteC); position:relative; overflow:hidden; border-radius:1em; background:var(--mainAboutBg); color:#fff; gap:1em}
.mainAbout .list .in .img{ position:relative}
.mainAbout .list .in .img:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background: linear-gradient(0deg, var(--mainAboutBg) 0%, rgba(0,0,0,0) 80%);}
.mainAbout .list li:nth-child(2n) .in{ --mainAboutBg:#222}
.mainAbout .list .in .img .resize{ padding-bottom:120%}
.mainAbout .list .in .con{ position:absolute; left:0; bottom:0; width:100%; display:flex; flex-direction:column; box-sizing:border-box; padding:10%; gap:1em}
.mainAbout .list .in .con .t1{ font-weight:700; font-size:1.75em}
.mainAbout .list .in .con .t2{ font-weight:100; font-size:1.063em}

.serviceSt{--serviceStTitH:30vmin; padding-top:var(--serviceStTitH); box-sizing:border-box; background:#fff; box-shadow:0 0 1em rgba(0,0,0,.1); border-radius:2em; position:relative; border:4px solid transparent; transition:.3s}
.serviceSt .titW{ padding:0 10%; height:var(--serviceStTitH); position: absolute; left:0; top:0; width:100%; color:#fff; overflow:hidden; box-sizing:border-box; display:flex; align-items:center}
.serviceSt .titW .bg{ position:absolute; left:0; top:0; width:100%; height:100%; border-radius:calc(2em - 4px); overflow:hidden}
.serviceSt .titW .bg:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.3}
.serviceSt .titW .tit{ position:relative; display:flex; align-items:center; height:5em; gap:1em; line-height:1}
.serviceSt .titW .tit .t1{ font-weight:900; font-size:1.75em; word-break:keep-all;}
.serviceSt .conW{ padding:2em 10%; position:relative; height:100%; box-sizing:border-box; display:flex; flex-direction:column; gap:2em}
.serviceSt .conW .t1{ color:#555; word-break:keep-all; line-height:1.7; /* 삭제요청 */ display:none;}
.serviceSt .conW .t2{ font-weight:500; font-size:1.063em; line-height:1.3}
.serviceSt .conW .check{ display:flex; flex-direction:column; gap:1em}
.serviceSt .conW .check > li{ display:flex; gap:.5em}
.serviceSt .conW .check > li > i{ flex:1; min-width:0}
.serviceSt .conW .check > li:before{ content:"\e928"; font-family:xeicon; color:var(--siteC)}
.serviceSt .conW .btn{ display:flex; gap:2px; margin-top:auto; padding-top:2em}
.serviceSt .conW .btn .st:hover { background:var(--siteC); color:#fff;}
.serviceSt .conW .btn .st{transition:all 0.3s ease; flex:1; min-width:0; justify-content:center; font-size:1.063em; font-weight:700}
.serviceSt.st1 .bg:after{ background:#fff; opacity:.2}
.serviceSt.st1 .titW{ color:#111}
.serviceSt:hover{ border-color:var(--siteC)}
.mainService{}
.mainServiceSlide{ margin:0 -2em; overflow:visible !important}
.mainServiceSlide .el{ width:60%; height:auto}
.mainServiceSlide .el .serviceSt{ height:100%; margin:0 2em}
.mainServiceSlide .el [class^="swiper-slide-shadow-"]{ width:calc(100% - 2em); border-radius:2em}
.mainServiceSlide .el .swiper-slide-shadow-right{ left:auto; right:0}
.mainServiceSlide .el:not(.swiper-slide-active) .titW{ position:absolute; left:0; top:0; width:100%; height:100%}
.mainServiceSlide .el:not(.swiper-slide-active) .conW{ opacity:0}
.mainService .swiperControl:not(.nav){ z-index:10; position:relative; margin:0 0 4em 0; justify-content:center}
.mainService .swiperControl .paging{ padding:.5em; background:var(--siteC); border-radius:5em; box-shadow:0 0 1em rgba(0,0,0,.2); flex:0 0 auto;}
.mainService .swiperControl .paging .swiper-pagination-bullet{ display:flex; width:auto; height:3.5em; align-items:center; background:none; opacity:.6; border-radius:3em; padding:0 1em; color:#fff}
.mainService .swiperControl .paging .swiper-pagination-bullet-active{ font-weight:700; background:#fff; color:var(--siteC); opacity:1; transition:.3s; transform:none}
.mainService .swiperControl .paging .swiper-pagination-bullet .tt{ font-weight:700; font-size:.938em}
.mainService .swiperControl.nav{ position:absolute; top:50%; transform:translateY(-50%)}
.mainService .swiperControl.nav.prev{ left:0}
.mainService .swiperControl.nav.next{ right:0}
.mainService .swiperControl.nav.prev .prev{ transform:translateX(100%)}
.mainService .swiperControl.nav.next .next{ transform:translateX(-100%)}

.mainGlobal .wrapBg{ background:#000; overflow:hidden}
.mainGlobal .wrapBg:after{ opacity:.5}
.mainGlobal .wrapBg .vod_wrap{ transform:translateY(20%)}
.mainGlobalW{ display:flex; flex-direction:column; gap:3em }
.mainGlobalSlideW{ margin:0 -1em;}
.mainGlobalSlide .swiper-wrapper{ align-items:stretch}
.mainGlobalSlide .el{ width:33.33%; height:auto}
.mainGlobalSlide .el .in{ margin:1em; background:rgba(255,255,255,.2); height:calc(100% - 1em); border-radius:1em; display:flex; flex-direction:column; gap:2em; box-sizing:border-box; padding:10%; color:#fff; backdrop-filter:blur(1em)}
.mainGlobalSlide .el .in .tit .t1{ font-weight:900; font-size:1.25em}
.mainGlobalSlide .el .in .logo{ margin-top:auto; display:flex; justify-content:flex-end; gap:.5em}
.mainGlobalSlide .el .in .logo .resize{ width:33.33%; padding-bottom:20%; box-sizing:border-box; background:#fff; border-radius:.5em}
.mainGlobalSlide .el .in .logo .resize .objC img{ min-height:1em; min-width:2em; max-height:70%}

.mainClientSlideW{ display:flex; flex-direction:column; gap:2em; margin-top:2em}
.mainClientSlide{ width:100%}
.mainClientSlide .swiper-wrapper{transition-timing-function: linear}
.mainClientSlide .el{ width:calc(16.66% - 18px)}
.mainClientSlide .el .img_wrap{ padding:0}
.mainClientSlide .el .img_wrap .resize{ padding-bottom:30%}
.mainClientSlide .el .img_wrap .resize img{ max-height:70%; min-height:30%}

.mainCs{ position:relative; z-index:1}
.mainCs .inquiry{ display:flex; gap:3vmin}
.mainCs .wInc{ border-radius:1em; box-sizing:border-box; overflow:hidden; position:relative}
.mainCs .img_wrap{ width:20vw; padding:5vmin; position:relative}
.mainCs .img_wrap .bg{ position:absolute; left:0; top:0; width:100%; height:100%; filter:saturate(0) brightness(2); transition:.5s}
.mainCs .img_wrap .bg:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.5; transform-origin:0 0; transition:1s}
.mainCs .img_wrap > *{ position:relative}
.mainCs .con_wrap{ flex:1; min-width:0; background:#fff; box-shadow:0 0 1em rgba(0,0,0,.1); padding:5vmin}
.mainCs .btn_wrap{ order:1; width:12vw; border:1px solid var(--siteC2); display:flex; align-items:center; justify-content:center;}
.mainCs .btn_wrap .st{ position:relative; flex:1; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.5em; background:var(--siteC2); color:#fff}
.mainCs .btn_wrap .st:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; transform:scaleX(0); transform-origin:0 0}
.mainCs .btn_wrap .st .t1{ font-weight:700; font-size:1.375em}
.mainCs .btn_wrap .st .arrow{ font-size:2em}
.mainCs .btn_wrap .st > *{ position:relative}
.mainCs .btn_wrap .st:hover{ color:var(--siteC2)}
.mainCs .btn_wrap .st:hover:before{ transform:scaleX(1); transition:.5s }
.mainCs .btn_wrap:hover ~ .img_wrap .bg{ filter:saturate(2)}
.mainCs .btn_wrap:hover ~ .img_wrap .bg:before{ opacity:0}
.mainCs .formSt{ display:flex; flex-wrap:wrap; gap:1vmin; position:relative}
.mainCs .formSt > li{ width:100%}
.mainCs .formSt > li.w1{ width:calc(50% - .5vmin)}
.mainCs .formSt .wrap_in{ display:flex; align-items:center; gap:1em}
.mainCs .formSt .wrap_in > *{ flex:1 1 0%; min-width:0}
.mainCs .formSt .input_st{ background-color:none}
.mainCs .formSt textarea{ height:15vmin; padding:1.5em}
.mainCs .formSt .label_wrap{ border:1px solid rgba(0,0,0,.3); padding:1em; border-radius:.5em}
.mainCs .formSt .label_st{ font-weight:700; color:#666}
.mainCs .formSt .label_st .xi{ border-color:#ccc}
.mainCs .formSt .btnW > *{flex:0 0 auto}
.mainCs .formSt .btnW .link{ padding:.25em 1.25em; border-radius:2em; border:1px solid rgba(0,0,0,.3); font-size:.875em; font-weight:500; display:flex; align-items:center; color:#666}

/* sub */
/* 서브 공통 */
.page_txt:not(:last-child) { margin-bottom:3.5em; } 
.page_txt.m0 { margin-bottom:.75em; } 
.page_txt.m1 { margin-bottom:1.25em; } 
.page_txt.m2 { margin-bottom:5em; } 

.page_txt .inner{margin: 0 1em;}

.page_tt { font-size:1em; word-break:keep-all; line-height:1.4; } 
.page_tt > .tt + .tt { margin-top:1.25em; } 
.page_tt.o1 { opacity:.7; } 
.page_tt.o2 { opacity:.1; } 
.page_tt.s1 { font-size:0.938em } 
.page_tt.s2 { font-size:1.063em } 
.page_tt.s3 { font-size:1.125em } 
.page_tt.s4 { font-size:1.250em } 
.page_tt.s5 { font-size:1.313em } 
.page_tt.s6 { font-size:1.500em } 
.page_tt.s7 { font-size:1.875em } 
.page_tt.s8 { font-size:2.250em } 
.page_tt.s9 { font-size:2.500em } 
.page_tt.s10 { font-size:3.000em } 
.page_tt.s11 { font-size:3.500em } 
.page_tt.s12 { font-size:4.000em; } 
.page_tt.s13 { font-size:4.500em; } 
.page_tt.s14 { font-size:5.000em; } 

.page_tt.dot1{margin-bottom:.8em; padding-left: 1.2em; display: inline-block; font-weight: 600; font-size: 1.875em !important; color:#111; position: relative;}
.page_tt.dot1::before{content:''; position:absolute; top: 50%; left:0; transform: translateY(-50%); width: 10px; height: 10px; border: 6px solid #e4e4ff; background:var(--siteC); border-radius: 15%;}
.page_tt.dot2{margin-bottom:.5em; font-weight: 600; padding-left: .7em;  color:#111; position: relative;}
.page_tt.dot2::before{content: ''; width: 5px; height: 5px; border-radius: 50%; background: #111; position: absolute; left: 0; top: 10px;}
.page_tt.s4.dot2::before{top: 12px;}
.page_tt.dot3{margin-bottom:.6em; padding-left: 1.3em; ; font-size: 1.06em; color:#111; position: relative;}
.page_tt.dot3.page_tt.s6{ margin-bottom: .2em !important;}
.page_tt.dot3::before{position: absolute; left: 0; top: 50%; content:"\e92b"; display: inline-block; transform: translateY(-50%); margin-right: .3em; font-family:xeicon; color:var(--siteC); line-height: 1.5;}
.page_tt.dot3.st1::before{top: 0; transform: translateY(0);}
.page_tt:last-child{margin-bottom: 0;}

.page_tt.dot4{ padding-left: 1em; color:#555; position: relative; line-height: 1.6; font-weight: 500;}
.page_tt.in{margin: 0 1.3em;}
.page_tt.dot4.in{margin: 0 .5em;}
.page_tt.dot4::before{ content: ''; width: 5px; height: 1px; background-color:#777; position: absolute; left: 0; top: 13px;}

.page_tt.dot4.st1{padding-left: 0.7em;}


/*온라인 문의*/
.addinfo_tw{ margin-bottom: .5em; display: flex; flex-direction: column; align-items: end;}
.addinfo_tw > .tt{ font-size: 1.063em; color: #999; font-weight: 500;}

.select-wrapper { position:relative; } 
.select-wrapper:before { position: absolute; top: 50%; right: 1.5rem; transform: translateY(-50%); font-size: 1.5rem; color: #fff; transition: all .4s ease-in-out; font-family: 'xeicon'; z-index: 2; } 
.select-wrapper:not(.selected):before { content: '\e936' } 
.select-wrapper.selected:before { content: '\e930'; } 
/* 
#opSelect { position:relative; color: #fff; } 
#opSelect option { color: #111; } 
*/ 
#opSelect:focus option { color: black; } 

.form_wrap { } 
.form_wrap .form { gap:1em; font-size:.95em; } 
.form_wrap .form > li { position: relative; } 
.form_wrap .form > li:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; content: ''; background: #fafafa; border-radius: 0.25rem; } 
.form_wrap .form > li:not(.w100) { width:calc(50% - .5em); } 
.form_wrap .form > li .inp_wrap { position:relative; } 
.form_wrap .form > li .inp_wrap .tit,
.form_wrap .form > li .inp_wrap .input_st:not(textarea) { height:4.5em; } 
.form_wrap .form > li .inp_wrap .input_st::placeholder { font-size: 1.15em; } 
.form_wrap .form > li .inp_wrap .tit { position:absolute; top:0; left:0; padding-left:2em; } 
.form_wrap .form > li .inp_wrap .tit .tt { font-size: 1.215em; font-weight:600; } 
.form_wrap .form > li .inp_wrap .input_st:not(textarea) { width:100%; padding-left:13em; } 
.form_wrap .form > li .inp_wrap textarea.input_st { padding-top:4em; padding-left:1.5em; height:12em; } 
.form_wrap .form > li .inp_wrap .input_st { border:none; background: transparent; border-radius: .15em; outline: 1px solid transparent; transition: all .4s ease-in-out; } 
.form_wrap .form > li .inp_wrap input:focus { outline: 1px solid #fff; } 
.form_wrap .form_chk { margin-top:2em; } 
.form_wrap .form_chk .chk { gap:1em; } 
.form_wrap .form_chk .btn .input_st { background: transparent; color: #fff; width:12em; border: 4px solid rgba(255, 255, 255, .4); transition: all .4s ease-in-out; } 
.form_wrap .form_chk .btn .input_st:hover { border: 4px solid #fff; } 

.form_wrap .form_chk .btn .input_st{background: var(--siteC); border-color: var(--siteC); color: var(--crWhite); border: none;}

.form_label_wrap { height: 100%; align-items: center; } 
.form_label_wrap > li { box-sizing:border-box; margin-right: 3em; font-size: 1.1em; } 
.form_label_wrap > li:last-of-type { margin-right: 0em; } 
.form_label_wrap.st1 > li { flex:1 0 33.33%; max-width: 33.33%; } 
.form_label_wrap.st2 > li { flex:1 0 25%; max-width: 25%; } 
.form_label_wrap.st3 > li { flex:1 0 16.66%; max-width: 16.66%; } 

.form_label_st:not(.cssbrowser) input ~ .xi.st1 { padding-right:0; padding-left:.125em; font-size:1em } 
.form_label_st:not(.cssbrowser) input ~ .xi.st1:before { content:"\e929"; opacity:0 } 
.form_label_st:not(.cssbrowser) input:checked ~ .xi.st1:before { content:"\e929"; opacity:1 } 

.form_label_st { display:inline-block; *display:inline; zoom:1; cursor:pointer } 
.form_label_st > * { display:inline-block; *display:inline; zoom:1; vertical-align:middle; cursor:pointer; } 
.form_label_st > .xi { font-size: 1.15em; margin: 0; } 
.form_label_st:not(.cssbrowser) .xi:before { font-family:xeicon!important; font-style:normal; font-size:1.25em; padding-right:.25em } 
.form_label_st:not(.cssbrowser) input ~ span { color:#666; font-weight: 600; } 
.form_label_st:not(.cssbrowser) input ~ .xi:before { color:#aaa } 
.form_label_st:not(.cssbrowser) input:checked ~ span { color:#333 } 
.form_label_st:not(.cssbrowser) input:checked ~ .xi:before { color:var(--siteC); } 
.form_label_st:not(.cssbrowser) input[type=checkbox] ~ .xi:before { content:"\e92e" } 
.form_label_st:not(.cssbrowser) input[type=checkbox]:checked ~ .xi:before { content:"\e92d" } 
.form_label_st:not(.cssbrowser) input:radio ~ span { color:#333 } 
.form_label_st:not(.cssbrowser) input:radio ~ .xi:before { color:var(--siteC); } 
.form_label_st:not(.cssbrowser) input[type=radio] ~ .xi:before { content:"\e92e" } 
.form_label_st:not(.cssbrowser) input[type=radio]:checked ~ .xi:before { content:"\e92d" } 
.form_label_st:not(.cssbrowser) input[type=checkbox],
.form_label_st:not(.cssbrowser) input[type=radio] { width:0; height:0; overflow:hidden; } 

.filebox .upload-name { height: 3.5em; padding: 0 10px; vertical-align: middle; border: none; background: transparent; width: 80%; } 
.filebox .upload-name::placeholder { font-size: 1.15em; font-weight: 500; color: #aaa; } 
.filebox label { padding: 10px 20px; color: #fff; background-color: var(--siteC); cursor: pointer; margin-left: 10px; border-radius: 5px; display: flex; align-items: center; justify-content: center; width: 30%; min-width: 6.25em; } 
.filebox input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; } 

.form_chk .label_st input[type=checkbox],
.form_chk .label_st input[type=radio] { width: auto; height: auto; overflow: visible; margin-bottom: auto; } 

.dp1_inquiry #contents {overflow: hidden;}
.inquiry-con .inquiry-bg-wrap { position: relative; height: 48em; filter: contrast(0.9);} 
.inquiry-con .inquiry-bg-wrap .img-area { position: absolute; width: 50vw; height: inherit; overflow: hidden; border-radius: 1em 0 0 1em; } 
.inquiry-con .inTxt{ padding-top: 9em;}

.page_col { gap:2em 6em; } 
.page_col.gp1 { } 
.page_col > li { } 
.page_col > li.w1 { width:40%; } 
.page_col > li.w2 { width:26%; } 
.page_col + .page_col { margin-top:8em; } 
.page_col > li .p1 { padding:4em 0 5em 0; } 
.page_col > li .p2 { padding:1.5em 0 2em 0; } 
.page_col > li .round { border-radius:1.5em; overflow:hidden; } 
.page_col > li .wrap_img:not(.resize) { position:relative; height:100%; } 

/* greetings */
.point_c {color:var(--siteC2)}
.pageCon.greetings { display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 4rem; border-bottom: 0.0625rem dashed #e2e8f0; padding-bottom: 4rem; margin-bottom: 4rem; }
.pageCon.greetings .img_wrap { flex: 0.95; filter: drop-shadow(0 1rem 2rem rgba(15,23,42,0.04)); overflow: hidden; border-radius: 1.5rem 0 0 1.5rem; display: flex; } 
.pageCon.greetings .img_wrap img { border-radius: 1.5rem; width: 100%; height: auto; object-fit: cover; transition: transform 0.5s ease; }
.pageCon.greetings .img_wrap:hover img { transform: scale(1.03); }

.pageCon.greetings .greeting_wrap { flex: 1.05; display: flex; flex-direction: column; align-items: flex-start; gap: 1.5rem; padding: 1rem 0; }
.pageCon.greetings .greeting_wrap .top_badge {font-size:1em; font-weight:700; color:var(--siteC)}
.pageCon.greetings .greeting_wrap .greeting_tit { font-weight: 800; font-size: var(--font-size-lg); color: #0f172a; line-height: 1.4; letter-spacing: -0.02em; margin: 0; }
.pageCon.greetings .greeting_wrap .greeting_tit strong { color: var(--siteC); font-weight: 800; }

.pageCon.greetings .greeting_wrap .greeting_txt { display: flex; flex-direction: column; gap: 1rem; width: 100%; }
.pageCon.greetings .greeting_wrap .greeting_txt p { color: #475569; font-size: var(--font-size-base); line-height: 1.75; word-break: keep-all; margin: 0; } 

@media (max-width: 1024px) { 
  .pageCon.greetings { flex-direction: column; align-items: flex-start; gap: 2.5rem; } 
  .pageCon.greetings .img_wrap { max-width: 100%; width: 100%; } 
  .pageCon.greetings .greeting_wrap { padding: 0; } }

.strategy { margin: 0 auto; padding: 5rem 0;width: 100%; }
.strategy .pageTit { text-align: center; margin-bottom: 4rem; }
.strategy .pageTit .top_tit { font-size: 0.85rem; font-weight: 900; color: var(--siteC2); text-transform: uppercase; letter-spacing: 0.1rem; margin-bottom: 0.5rem; }
.strategy .pageTit .tit { font-size: var(--font-size-xxl); font-weight: 800; color: #0f172a; letter-spacing: -0.02em; }
.strategy .card_list { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; padding: 0; list-style: none; }
.boxSub .strategy .card { background: #ffffff; border: 0.0625rem solid #e2e8f0!important; border-radius: 1.5rem; padding: 2.5rem 2.25rem; width: calc((100% - 1.5rem * 2) / 3); box-sizing: border-box; display: flex; flex-direction: column; gap: 1.75rem; box-shadow: 0 0.375rem 1.25rem rgba(15,23,42,0.02); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); flex: none; }
.boxSub .strategy .card:hover { transform: translateY(-0.35rem); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd!important; }
.strategy .card_head { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.strategy .card_head i { font-size: var(--font-size-lg); color: #64748b; background-color: #f8fafc; width: 3.5rem; height: 3.5rem; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease; }
.boxSub .strategy .card:hover .card_head i { background-color: #e0f2fe; color: #0284c7; transform: scale(1.05); }
.strategy .card_head .num { font-size: var(--font-size-xs); font-weight: 700; color: #0369a1; background-color: #e0f2fe; padding: 0.25rem 0.65rem; border-radius: 0.375rem; font-family: inherit; }
.strategy .card .in { display: flex; flex-direction: column; gap: 0.85rem; padding-top: 1.25rem; border-top: 0.0625rem dashed #f1f5f9; }
.strategy .card .in .tit { font-size: var(--font-size-base); font-weight: 800; color: #0f172a; margin: 0; letter-spacing: -0.02em; }
.strategy .card .in .txt { font-size: var(--font-size-sm); color: #475569; line-height: 1.6; margin: 0; word-break: keep-all; }

@media (max-width: 1024px) { .boxSub .strategy .card { width: calc((100% - 1.5rem) / 2); } }
@media (max-width: 640px) { .boxSub .strategy .card { width: 100%; } }

/* history */
.history_wrap {}
.history_wrap .tap_btn_wrap {}
.history_wrap .tap_btn_wrap .btn_container {display:flex; flex-direction:row; gap:var(--space-2); justify-content: center; }
.history_wrap .tap_btn_wrap .btn_container button {border-radius:999px; background-color:#eee; font-size:var(--font-size-base); font-weight:600; border:none; padding:1.5rem 4rem;}
.history_wrap .tap_btn_wrap .btn_container button.on {background-color:var(--siteC); color:#fff; }
.history_wrap .historyCon {margin:0 auto; padding:6rem 0; }
.history_wrap .historyCon:last-child {padding-bottom:0;}
.history_wrap .historyCon .con {gap:var(--space-3); align-items:start; padding:0;}
.history_wrap .historyCon .con .year_wrap {display:flex; flex-direction:row; align-items: center;}
.history_wrap .historyCon .con .year_wrap .active_icon {width:3rem; height:3rem; border:2px solid var(--siteC); border-radius:50%;display:flex; justify-content: center; align-items: center}
.history_wrap .historyCon .con .year_wrap .active_icon_inner {width:2.5rem; height:2.5rem; background-color:var(--siteC); border-radius:50%;}
.history_wrap .historyCon .con .year_wrap .year {font-size:var(--font-size-xxl); font-weight:800; margin-left:1rem; color:var(--siteC)}
.history_wrap .historyCon .con .con_wrap {}
.history_wrap .historyCon .con .con_wrap .history_list {}
.history_wrap .historyCon .con .con_wrap .history_list .history_item:first-child {padding-top :0;}
.history_wrap .historyCon .con .con_wrap .history_list .history_item {display:flex; flex-direction:row; gap:var(--space-3); align-items:start; padding:3rem 0; border-bottom:1px solid #eee;}
.history_wrap .historyCon .con .con_wrap .history_list .history_item .date {line-height:1.5; font-size:var(--font-size-base); font-weight:800; }
.history_wrap .historyCon .con .con_wrap .history_list .history_item .story_wrap {font-size:var(--font-size-sm); color:#555;}
.history_wrap .historyCon .con .con_wrap .history_list .history_item .story_wrap p::before {content:""; display:block; width:0.2rem; height:0.2rem; background-color:#000; border-radius:50%;}
.history_wrap .historyCon .con .con_wrap .history_list .history_item .story_wrap p {line-height:1.5; display:flex; flex-direction:row; gap:var(--space-2); align-items:center;}

/* 조직도 */
.org_wrap {padding:2rem 0 4rem;}
.org_wrap .org_group {display:flex; justify-content:center; margin-bottom:3rem; position:relative;}
.org_wrap .org_group::after {content:""; position:absolute; bottom:-3rem; left:50%; width:0.1rem; height:3rem; background-color:#aaa;}
.org_wrap .org_tree::before {content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:51rem; height:0.1rem; background-color:#aaa;}
.org_wrap .org_tree {display:flex; flex-direction:row; justify-content:center; gap:var(--space-3); align-items:start; position:relative;  padding-top:3rem;}
.org_wrap .org_depth {display:flex; flex-direction:column; align-items:center; flex:1; position:relative;}
.org_wrap .org_depth::before {content:""; position:absolute; top:-3rem; left:50%; width:0.1rem; height:3rem; background-color:#aaa;}
.org_wrap .member_card {background-color:#fff; border:1px solid #eee; border-radius:0.8rem; padding:1.5rem 2rem; text-align:center; box-shadow:0 0.4rem 1.2rem rgba(0,0,0,0.03); transition:all 0.3s ease; width:100%; max-width:13rem;}
.org_wrap .member_card:hover {border-color:var(--siteC); transform:translateY(-0.3rem);}
.org_wrap .member_card.leader {background:#ffffff; border:1px solid #eeeeee; border-radius:1.2rem; padding:1.8rem 2.5rem; max-width:11rem; display:flex; flex-direction:row; align-items:center; gap:2rem; box-shadow:0 1.5rem 3.5rem rgba(0,0,0,0.04); text-align:left; transition:all 0.4s cubic-bezier(0.16,1,0.3,1);}
.org_wrap .member_card.leader .logo_box {width:5rem;  display:flex; justify-content:center; align-items:center; flex-shrink:0; overflow:hidden;}
.org_wrap .member_card.leader .logo_box img {width:100%; height:100%; object-fit:contain;}
.org_wrap .member_card.leader .info_box {display:flex; flex-direction:row; align-items:center; gap:1rem; justify-content:center; width:100%;}
.org_wrap .member_card.leader .position {font-size:var(--font-size-sm); font-weight:700; color:#888888; margin-bottom:0.2rem; letter-spacing:-0.02rem;}
.org_wrap .member_card.leader .name {font-size:var(--font-size-xl); font-weight:800; color:#111111; line-height:1.1; letter-spacing:0.05rem;}
.org_wrap .member_card.division {background-color:var(--siteC); border:none; border-radius:0.5rem; padding:1.2rem 2rem;}
.org_wrap .member_card.division .position {font-size:var(--font-size-base); font-weight:700; color:#fff;}
.org_wrap .team_list {width:100%; display:flex; flex-direction:column; align-items:center; gap:var(--space-2); margin-top:2.5rem; padding:0; list-style:none; position:relative;}
.org_wrap .team_list::before {content:""; position:absolute; top:-2.5rem; left:50%; width:0.1rem; height:2.5rem; background-color:#eee;}
.org_wrap .member_card.team {background-color:#f9f9f9; border-radius:0.5rem; padding:1rem 1.5rem; display:flex; justify-content:center; align-items:center; gap:var(--space-2);}
.org_wrap .member_card.team::before {content:""; display:block; width:0.4rem; height:0.4rem; background-color:var(--siteC); border-radius:50%;}
.org_wrap .member_card.team .team_name {font-size:var(--font-size-sm); font-weight:600; color:#555;}



/* 오시는길 */
#daumRoughmapContainer1778549099115 .roughmap_lebel_text {font-size: 0 !important; line-height: 0 !important;}
#daumRoughmapContainer1778549099115 .roughmap_lebel_text::after {content: "PCA 피씨에이"; font-size: 13px !important; line-height: 1.5 !important;visibility: visible !important;color: #000; }
#daumRoughmapContainer1778549099115 .wrap_controllers {display:none;}
#daumRoughmapContainer1778549099115 .cont {display:none;}
#daumRoughmapContainer1778549099115 {overflow:hidden; border-radius:3rem; border:1px solid #ddd; width:100%;}

.location_wrap {display:flex; flex-direction:column; gap:var(--space-7); }
.address_wrap.w2 {border-top:1px solid #ddd; padding-top:var(--space-7);}
.address_wrap {display:flex; flex-direction:row; gap:var(--space-4); justify-content: space-between; align-items: start;}
.address_wrap .tit {width:10%}
.address_wrap .tit p {font-size:var(--font-size-lg); font-weight:800; }
.address_wrap .con {width:60%;}
.address_wrap .con ul {display:flex; flex-direction:column; gap:var(--space-3); }
.address_wrap .con ul .ad_con {display:flex; flex-direction:row;align-items: center;}
.address_wrap .con ul .ad_con .tit {font-size:var(--font-size-base); font-weight:800; width:8rem;}
.address_wrap.w2 .con ul .ad_con .tit {width:12rem;}
.address_wrap.w2 .con ul .ad_con .txt {}
.address_wrap .con ul .ad_con .txt {font-size:var(--font-size-sm); color:#555; width:100%;}
.address_wrap .con ul .ad_con .fill_box {height:fit-content; background-color:var(--siteC2); color:#fff; border-radius:999px; padding:0.5rem 1rem;  word-break:keep-all; display:flex; align-items:center; margin-right:1rem; font-size:var(--font-size-xs) }
.address_wrap .loca_btn_wrap {width:8rem; height:8rem;}
.address_wrap .loca_btn_wrap .loca_btn {width:100%; height:100%; background-color:var(--siteC); color:#fff; display:flex; flex-direction:column; justify-content: center; align-items:center; border-radius:1rem;}
.address_wrap .loca_btn_wrap .loca_btn img {width:40%; margin-bottom:0.5em; }
.address_wrap .loca_btn_wrap .loca_btn p {font-size:var(--font-size-sm); font-weight:600;}
.address_wrap .loca_btn_wrap.hide {visibility: hidden;}


/* 사업영역 */
.top_sec {/* display:none!important; */  position: relative; overflow: hidden; padding: 6rem 3rem; border-radius: 1.5rem; background: linear-gradient(135deg, var(--siteC) 0%, #0f172a 100%); border: 0.0625rem solid rgba(255,255,255,0.08); box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.15); display: flex; justify-content: center; align-items: center; }
.top_sec .top_tit { position: relative; z-index: 2; color: #ffffff; font-size: 3.5rem; font-weight: 900; letter-spacing: -0.03em; line-height: 1; text-transform: uppercase; background: linear-gradient(to bottom, #ffffff 40%, rgba(255,255,255,0.6) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.top_sec::before { content: ""; position: absolute; top: -6rem; right: -6rem; width: 18rem; height: 18rem; border-radius: 50%; background: radial-gradient(circle, #38bdf8 0%, rgba(56,189,248,0) 70%); opacity: 0.2; filter: blur(1.5rem); z-index: 1; }
.top_sec::after { content: ""; position: absolute; top: -3rem; right: -3rem; width: 12rem; height: 12rem; border-radius: 50%; background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%); border: 0.0625rem solid rgba(255,255,255,0.05); z-index: 1; }

.boxSub.business { display: block; width: 100%; color: #333333; background-color: #ffffff; line-height: 1.6; }
.boxSub .page_wrap { width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 1.25rem; box-sizing: border-box; }
.boxSub .page_con { padding: 5rem 0; }
.boxSub .page_con:first-child { padding-top: 0; }
.boxSub .page_con.bg_gray { background-color: #f8fafc; padding: 3rem 2rem; border-radius: 1.5rem; border: 0.0625rem solid #f1f5f9;box-sizing:border-box;}
.boxSub .top_con_wrap { display: flex; justify-content: flex-start; align-items: center; gap:var(--space-6) }
.boxSub .txt_wrap p { font-size: 1.125rem; color: #475569; margin: 0 0 1rem 0; word-break: keep-all; }
.boxSub .txt_wrap p strong { color: var(--siteC); font-weight: 700; position: relative; z-index: 1;  }
.boxSub .txt_wrap p strong::after { content: ''; position: absolute; left: 0; bottom: 0.1rem; width: 100%; height: 0.35rem; background-color: #e0f2fe; z-index: -1; }

.boxSub .txt_wrap p:last-child { margin-bottom: 0; }
.boxSub .page_tit { font-size: var(--font-size-lg-1); font-weight: 800; color: #0f172a; margin: 0 0 2.5rem 0; text-transform: uppercase; letter-spacing: -0.01em; border-left: 0.375rem solid var(--siteC); padding-left: 1.25rem; }
.boxSub .card_wrap { width: 100%; padding: 2rem; background: #ffffff; box-sizing: border-box; border-radius: 1.5rem; border: 0.0625rem solid #f1f5f9; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); }
.boxSub .card_wrap ul.flex { display: flex; flex-wrap: wrap; gap: 0.7rem; padding: 0; margin: 0; list-style: none; }
.boxSub .card { width: 100%; box-sizing: border-box; border-bottom: 0.0625rem dashed #e2e8f0; display: flex; gap: 0.5rem; padding-bottom: 0.7rem; }
.boxSub .card:last-child { border-bottom: none; padding-bottom: 0; }
.boxSub .card .tit { font-size: var(--font-size-sm); font-weight: 800; color: var(--siteC); word-break: keep-all; width:6em; }
.boxSub .card .cate { display: inline-block; background-color: #f0fdf4; border-radius: 0.375rem; padding: 0.25rem 0.75rem; }
.boxSub .card .cate p { font-size: var(--font-size-xs); font-weight: 700; color: #16a34a; margin: 0; }
.boxSub .card .txt_list.dot { margin: 0; list-style-type: disc; }
.boxSub .card .txt_list.dot .txt::before { content: ""; width: 0.25rem; height: 0.25rem; background-color: var(--siteC); border-radius: 50%; display: inline-block; margin-right: 0.5rem; vertical-align: middle; }
.boxSub .card .txt_list .txt { font-size: var(--font-size-sm); color: #475569; margin-bottom: 0.625rem; line-height: 1.6; word-break: keep-all; }
.boxSub .card .txt_list .txt:last-child { margin-bottom: 0; }

.boxSub .card_wrap.ce_page { background: transparent; padding: 0; border: none; box-shadow: none; margin: 0 auto; max-width: 1200px; width: 100%; }
.boxSub .card_wrap.ce_page ul.flex { display: flex; flex-wrap: nowrap; gap: 1rem; align-items: stretch; justify-content: center; }
.boxSub .card_wrap.ce_page .card { flex: 1; max-width: calc((100% - 3rem) / 4); flex-direction: column; align-items: center; text-align: center; background: #ffffff; padding: 2rem 1rem 1.75rem 1rem; border-radius: 1.25rem; border: 0.0625rem solid #e2e8f0; box-shadow: 0 0.375rem 1.25rem rgba(15,23,42,0.02); transition: all 0.3s ease; }
.boxSub .card_wrap.ce_page .card:hover { transform: translateY(-0.25rem); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd;}
.boxSub .card_wrap.ce_page .card .icon { position: relative; width: 3.5rem; height: 3.5rem; background-color: #f8fafc; border-radius: 50%; display: flex; justify-content: center; align-items: center; margin-bottom: 1rem; transition: all 0.3s ease; order: 0; }
.boxSub .card_wrap.ce_page .card .icon i { font-size: var(--font-size-md); color: #64748b; transition: all 0.3s ease; }
.boxSub .card_wrap.ce_page .card .icon img.xi { width:1em; color: #64748b; }
.boxSub .card_wrap.ce_page .card:hover .icon { background-color: #e0f2fe; }
.boxSub .card_wrap.ce_page .card:hover .icon i { color: #0284c7; transform: scale(1.1); }
.boxSub .card_wrap.ce_page .card .cate { background-color: #e0f2fe; margin-bottom: 0.75rem; padding: 0.25rem 0.65rem; border-radius: 0.375rem; order: 2; }
.boxSub .card_wrap.ce_page .card .cate p { color: #0369a1; font-size: var(--font-size-xs); font-weight: 700; }
.boxSub .card_wrap.ce_page .card .tit { font-size: var(--font-size-base); font-weight: 800; color: #0f172a; min-height: 2.75rem; line-height: 1.3; margin-bottom: 1rem; order: 1; display: flex; align-items: center; justify-content: center; }
.boxSub .card_wrap.ce_page .card .txt_list.dot { order: 3; width: 100%; text-align: left; padding-top: 1rem; border-top: 0.0625rem dashed #f1f5f9; }
.boxSub .card_wrap.ce_page .card .txt_list.dot .txt { position: relative; padding-left: 0.75rem; font-size: var(--font-size-sm); color: #475569; line-height: 1.4; margin-bottom: 0.5rem; }
.boxSub .card_wrap.ce_page .card .txt_list.dot .txt:last-child { margin-bottom: 0; }
.boxSub .card_wrap.ce_page .card .txt_list.dot .txt::before { position: absolute; left: 0; top: 0.45rem; width: 0.2rem; height: 0.2rem; background-color: #38bdf8; }


.boxSub .ce_thumb_area { flex: 0.8; position: relative; width: 100%; max-width: 500px; height: 15.625rem; border-radius: 1.5rem; overflow: hidden; box-shadow: 0 0.75rem 2rem rgba(15,23,42,0.06); border: 0.0625rem solid #e2e8f0; }
.boxSub .ce_thumb_area img { width: 100%; height: 100%; object-fit: cover; display: block; filter: contrast(110%) brightness(90%); transition: all 0.4s ease; }
.boxSub .ce_thumb_area::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(15,23,42,0.0.5); mix-blend-mode: multiply; pointer-events: none; transition: all 0.4s ease; }
.boxSub .txt_wrap { flex: 1.2;  }
/* .boxSub .ce_thumb_area:hover img { transform: scale(1.05); filter: contrast(115%) brightness(100%); }
.boxSub .ce_thumb_area:hover::after {background:transparent} */

.boxSub .consulting_banner { text-align: center; margin-bottom: 3rem; padding: 2rem 0; }
.boxSub .consulting_banner .banner_tag { font-size: var(--font-size-xs); font-weight: 800; color: var(--siteC); text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 0.5rem 0; }
.boxSub .consulting_banner .banner_main_tit { font-size: var(--font-size-lg); font-weight: 800; color: #0f172a; margin: 0; letter-spacing: -0.01em; }
.boxSub .partner_grid { display: flex; flex-wrap: wrap; gap: 1rem; padding: 0; margin: 0; list-style: none; }
.boxSub .partner_item { flex: 1 1 calc(25% - 0.75rem); min-width: 13.75rem; height: 6.25rem; background-color: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 0.75rem; display: flex; justify-content: center; align-items: center; box-sizing: border-box; transition: all 0.3s ease; box-shadow: 0 0.25rem 0.5rem rgba(15,23,42,0.01); }
.boxSub .partner_item:hover { background-color: #f8fafc; transform: translateY(-0.25rem); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }
.boxSub .partner_item span { font-size: var(--font-size-sm); font-weight: 700; color: #64748b; text-align: center; transition: color 0.2s ease; }
.boxSub .partner_item:hover span { color: var(--siteC); }

@media (max-width: 48rem) { .boxSub .compare_container { flex-direction: column; gap: 1.5rem; } .boxSub .partner_item { flex: 1 1 calc(50% - 0.5rem); } }

/* 서브페이지 인포그래픽 */

/* semi */
.circle_container { position: relative; width: 35rem; height: stretch; margin: 0 auto; border-radius: 1.5rem; border: 0.0625rem solid rgba(15,23,42,0.08); box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.04); transition: all 0.2s ease-in-out; background-color: transparent; }
.circle_container:hover { box-shadow: 0 1rem 2.5rem rgba(15,23,42,0.08); }
.center_circle { position: absolute; top: 50%; left: 50%; width: 10rem; height: 10rem; margin-top: -5rem; margin-left: -5rem; background: linear-gradient(135deg, var(--siteC) 0%, #0f172a 100%); color: #ffffff; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-weight: 800; font-size: var(--font-size-lg-2); box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.25); z-index: 2; letter-spacing: -0.02em; }
.circle_item { position: absolute; top: 50%; left: 50%; width: 4.5rem; height: 4.5rem; margin-top: -2.25rem; margin-left: -2.25rem; background-color: #ffffff; color: #94a3b8; border: 0.0625rem solid #e2e8f0; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-weight: 700; font-size: var(--font-size-base); z-index: 1; text-align: center; box-shadow: 0 0.25rem 0.5rem rgba(15,23,42,0.02); transition: all 0.2s ease; }
.circle_item.active { background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%); color: #0369a1; width: 5.2rem; height: 5.2rem; font-size: var(--font-size-md); z-index: 3; border: 0.0625rem solid #7dd3fc; box-shadow: 0 0.5rem 1.2rem rgba(3,105,161,0.2); }

.circle_container .item-1 { margin-top: -13.75rem; margin-left: -2.25rem; } 
.circle_container .item-2 { margin-top: -12.6rem; margin-left: 2.74rem; } 
.circle_container .item-3 { margin-top: -9.33rem; margin-left: 6.88rem; } 
.circle_container .item-4 { margin-top: -4.8rem; margin-left: 8.65rem; }  
.circle_container .item-5 { margin-top: 0.74rem; margin-left: 8.95rem; }  
.circle_container .item-6 { margin-top: 5.42rem; margin-left: 6.88rem; }  
.circle_container .item-7 { margin-top: 8.44rem; margin-left: 2.74rem; }  
.circle_container .item-8 { margin-top: 9.25rem; margin-left: -2.25rem; } 
.circle_container .item-9 { margin-top: 8.44rem; margin-left: -7.24rem; } 
.circle_container .item-10 { margin-top: 5.42rem; margin-left: -11.38rem; }
.circle_container .item-11 { margin-top: 0.74rem; margin-left: -13.45rem; }
.circle_container .item-12 { margin-top: -4.53rem; margin-left: -13.45rem; }
.circle_container .item-13 { margin-top: -9.33rem; margin-left: -11.38rem; }
.circle_container .item-14 { margin-top: -12.6rem; margin-left: -7.24rem; } 

.boxSub .circle_item.active { animation: floatEff 4s ease-in-out infinite; box-shadow: 0 0.5rem 1.5rem rgba(56, 189, 248, 0.3); }

@keyframes floatEff {
  0%, 100% { transform: translateY(0) translateX(0); }
  50% { transform: translateY(-4px) translateX(8px); } 
}

.step_container { width:100% ; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.5rem; box-sizing: border-box; height:stretch;}
.step_item {width: calc((100% - 1.5rem) / 2 ); background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1rem; padding: 2.5rem 1.5rem; display: flex; flex-direction: column; align-items: center; text-align: center; box-shadow: 0 0.5rem 1.5rem rgba(15, 23, 42, 0.03); transition: all 0.2s ease; box-sizing: border-box;}
.step_item:hover { transform: translateY(-0.25rem); border-color: #cbd5e1; box-shadow: 0 1rem 2rem rgba(15, 23, 42, 0.06); }
.step_badge { display: inline-block; padding: 0.25rem 0.75rem; background: #e0f2fe; color: var(--siteC2); font-size: 0.8125rem; font-weight: 700; border-radius: 2rem; margin-bottom: 1.25rem; }
.step_icon_box { width: 3.5rem; height: 3.5rem; background: #f8fafc; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--siteC); font-size: 1.5rem; margin-bottom: 1.25rem; border: 0.0625rem solid #f1f5f9; }
.step_title { font-size: 1.125rem; font-weight: 700; color: var(--siteC); margin: 0 0 0.75rem 0; letter-spacing: -0.02em; }
.step_desc { font-size: var(--font-size-sm); color: #64748b; line-height: 1.6; margin: 0; word-break: keep-all; }
@media (max-width: 1024px) { .step_item { flex: 0 0 calc(50% - 0.75rem); } }
@media (max-width: 768px) { .step_item { flex: 0 0 100%; } }

/* ntrl 비교 인포그래픽 */
.boxSub .split_compare_zone { width: 100%; max-width: 1100px; margin: 3rem auto 0 auto; background: #ffffff; border-radius: 1.5rem; border: 0.0625rem solid #e2e8f0; padding: 2.5rem; box-shadow: 0 1rem 3rem rgba(15,23,42,0.04); }
.boxSub .split_hd_row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
.boxSub .split_hd_box { flex: 1; padding: 2rem; border-radius: 1.25rem; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all 0.3s ease; }
.boxSub .split_hd_box.left_wing { background: linear-gradient(135deg, #f8fafc 0%, #e0f2fe 100%); border: 0.0625rem solid #bae6fd; }
.boxSub .split_hd_box.right_wing { background: linear-gradient(135deg, #f8fafc 0%, #f0fdf4 100%); border: 0.0625rem solid #d3ffe0; }
.boxSub .split_center_space { flex: 0 0 140px; }
.boxSub .tech_badge { display: inline-block; font-size: var(--font-size-sm-1); font-weight: 800; padding: 0.25rem 0.625rem; border-radius: 0.375rem; margin-bottom: 0.5rem; letter-spacing: 0.02em; }
.boxSub .tech_badge.b_blue { background-color: var(--siteC); color: #ffffff; }
.boxSub .tech_badge.b_orange { background-color: #16a34a; color: #ffffff; }
.boxSub .split_hd_box .hd_tit { font-size: var(--font-size-md); font-weight: 900; color: #0f172a; letter-spacing: -0.03em; margin: 0; }
.boxSub .split_bd_matrix { display: flex; flex-direction: column; gap: 0.75rem; }
.boxSub .matrix_row { display: flex; align-items: center; justify-content: space-between; position: relative; }
.boxSub .data_cell { flex: 1; background: #f8fafc; border: 0.0625rem solid #f1f5f9; padding: 1.25rem 2rem; border-radius: 1rem; min-height: 2.5rem; display: flex; flex-direction: column; justify-content: center; transition: all 0.2s ease; }
.boxSub .data_cell.left_cell { text-align: right; align-items: flex-end; }
.boxSub .data_cell.right_cell { text-align: left; align-items: flex-start; }
.boxSub .matrix_row:hover .data_cell { background: #ffffff; border-color: #cbd5e1; box-shadow: 0 0.5rem 1.25rem rgba(15,23,42,0.02); }
.boxSub .axis_cell { flex: 0 0 140px; text-align: center; display: flex; justify-content: center; align-items: center; z-index: 10; }
.boxSub .axis_lbl { font-size: var(--font-size-base); font-weight: 800; color: var(--siteC); background: #ffffff; border: 0.125rem solid #e2e8f0; padding: 0.375rem 0.875rem; border-radius: 6.25rem; letter-spacing: -0.02em; display: inline-block; min-width: 5.5rem; box-shadow: 0 0.25rem 0.75rem rgba(15,23,42,0.02); }
.boxSub .val_txt { font-size: var(--font-size-sm); font-weight: 600; color: #1e293b; margin: 0; line-height: 1.4; letter-spacing: -0.01em; }
.boxSub .val_txt.color_dim { color: #94a3b8; font-weight: 500; }
.boxSub .sub_note { font-size: var(--font-size-sm); color: #64748b; margin: 0.25rem 0 0 0; }
.boxSub .accent_note { font-size: var(--font-size-sm); color: #ef4444; font-weight: 700; margin: 0.25rem 0 0 0; }

/* S-mark&KCs */
.boxSub .sh_desc_grid { display: flex; gap: 3rem; width: 100%; }
.boxSub .sh_desc_item { flex: 1; position: relative; }
.boxSub .sh_desc_item > strong { display: block; font-size: var(--font-size-lg); font-weight: 800; color: var(--siteC); margin-bottom: 0.5rem; letter-spacing: -0.02em; }
.boxSub .sh_desc_item p { font-size: var(--font-size-base); color: #475569; line-height: 1.6; word-break: keep-all; }
.boxSub .sh_dual_wrap { display: flex; gap: 2rem; width: 100%; margin-top: 1.5rem; }
.boxSub .sh_card { flex: 1; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1.5rem; padding: 2.5rem 2rem; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); transition: all 0.25s ease; }
.boxSub .sh_card_hd { text-align: left; border-bottom: 0.0625rem solid #f1f5f9; padding-bottom: 1.25rem; margin-bottom: 1.5rem; }
.boxSub .sh_badge { display: inline-block; font-size: var(--font-size-sm); font-weight: 800; padding: 0.25rem 0.5rem; border-radius: 0.25rem; background-color: #e0f2fe; color: #0369a1; margin-bottom: 0.5rem; }
.boxSub .sh_badge.accent { background-color: #f0fdf4; color: #16a34a; }
.boxSub .sh_card_hd h3 { font-size: var(--font-size-md-1); font-weight: 800; color: #0f172a; letter-spacing: -0.02em; margin: 0; }
.boxSub .sh_list { display: flex; flex-direction: column; gap: 0.85rem; }
.boxSub .sh_list li { position: relative; padding-left: 0.85rem; font-size: var(--font-size-base); color: #334155; font-weight: 600; line-height: 1.4; text-align: left; }
.boxSub .sh_list li::before { content: ''; position: absolute; left: 0; top: 0.45rem; width: 0.25rem; height: 0.25rem; background-color: var(--siteC2); border-radius: 50%; transition: all 0.3s ease; }
.boxSub .sh_card:hover { transform: translateY(-0.25rem); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }
.boxSub .sh_card_img { width: 100%; text-align: center; margin: 1rem 0; border-radius: 1rem; overflow: hidden; }
.boxSub .sh_card_img img { height: auto; display:block; }

/* other */
.boxSub .cs_grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; width: 100%; max-width: 1200px; margin: 3rem auto 0 auto; }
.boxSub .cs_grid .card { transition: all 0.3s ease;  width: 15rem; height: 15rem; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 50%; padding: 1.5rem 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03);  }
.boxSub .cs_grid .tit { font-size: var(--font-size-base); font-weight: 800; color: var(--siteC); margin: 0 0 0.25rem 0; letter-spacing: -0.01em; line-height: 1.2; }
.boxSub .cs_grid .sub { font-size: var(--font-size-sm); font-weight: 600; color: #475569; line-height: 1.3; word-break: keep-all; }
.boxSub .cs_grid .logo { width: 100%; height: 5rem; display: flex; align-items: center; justify-content: center; }
.boxSub .cs_grid .logo img { max-height: 100%; object-fit: contain;  }
.boxSub .cs_grid .card:hover { transform: translateY(-0.25rem); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }

/* consulting */
.boxSub .spec_wrap { width: 100%; max-width: 1200px; margin: 3rem auto 0 auto; display: flex; flex-direction: column; gap: 4rem; }
.boxSub .spec_top { display: flex; align-items: center; justify-content: space-between; gap: 4rem; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1.5rem; padding: 3.5rem; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); }
.boxSub .spec_top .info_box { flex: 1.2; text-align: left; }
.boxSub .spec_top .info_box h3 { font-size: var(--font-size-lg); font-weight: 900; color: var(--siteC); margin: 0 0 1.25rem 0; letter-spacing: -0.02em; }
.boxSub .spec_top .info_box p { font-size: var(--font-size-base); color: #475569; line-height: 1.7; word-break: keep-all; margin: 0; }
.boxSub .spec_top .info_box p strong { color: var(--siteC); font-weight: 700; position: relative; z-index: 1; }
.boxSub .spec_top .info_box p strong::after { content: ''; position: absolute; left: 0; bottom: 0.1rem; width: 100%; height: 0.35rem; background-color: #e0f2fe; z-index: -1; }
.boxSub .spec_top .img_box { flex: 0.8; display: flex; justify-content: center; align-items: center; min-height: 250px; border-radius:1rem; overflow:hidden;}
.boxSub .spec_top .img_box img { max-width: 100%; height: auto; object-fit: contain; }
.boxSub .spec_partners { text-align: left; }
.boxSub .spec_partners .section_sub_tit { font-size: var(--font-size-sm-1); font-weight: 800; color: #64748b; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 1.25rem; padding-left: 0.25rem; }
.boxSub .spec_wrap .logo_grid { display: grid; grid-template-columns: repeat(4, 1px); grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; width: 100%; }
.boxSub .spec_wrap .logo_card {transition: all 0.3s ease;  background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1rem; height: 5.5rem; display: flex; align-items: center; justify-content: center; padding: 1rem; box-shadow: 0 0.25rem 0.75rem rgba(15,23,42,0.01);  }
.boxSub .spec_wrap .logo_card:hover { transform: translateY(-0.25rem);box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }
.boxSub .spec_wrap .logo_card img {height:100%;}

/* education */
.boxSub .edu_wrap { width: 100%; max-width: 1200px; margin: 3rem auto 0 auto; display: flex; flex-direction: column; gap: 3rem; }
.boxSub .edu_head { text-align: left; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1.5rem; padding: 2.5rem 3rem; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); }
.boxSub .edu_head h3 { font-size: var(--font-size-lg); font-weight: 900; color: var(--siteC); margin: 0 0 0.75rem 0; letter-spacing: -0.01em; }
.boxSub .edu_head p { font-size: var(--font-size-base); color: #475569; line-height: 1.6; word-break: keep-all; margin: 0; }
.boxSub .edu_head p strong { color: var(--siteC); font-weight: 700; }
.boxSub .edu_body { display: flex; gap: 2rem; width: 100%; align-items: stretch; }
.boxSub .edu_table { flex: 1.4; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1.5rem; padding: 2rem; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.02); display: flex; flex-direction: column; }
.boxSub .edu_table .th_row { display: flex; border-bottom: 0.125rem solid var(--siteC); padding-bottom: 1rem; }
.boxSub .edu_table .th_cell { flex: 1; font-size: var(--font-size-base); font-weight: 800; color: var(--siteC); text-align: left; padding: 0 0.5rem; }
.boxSub .edu_table .th_cell:first-child { flex: 0.9; }
.boxSub .edu_table .tr_row { display: flex; align-items: center; padding: 1.25rem 0; border-bottom: 0.0625rem solid #e2e8f0; transition: all 0.2s ease; }
.boxSub .edu_table .tr_row:last-child { border-bottom: none; }
.boxSub .edu_table .td_cell { flex: 1; text-align: left; padding: 0 0.5rem; line-height: 1.4; }
.boxSub .edu_table .td_cell:first-child { flex: 0.9; }
.boxSub .edu_table .main_txt { font-size: var(--font-size-base); font-weight: 700; color: #0f172a; letter-spacing: -0.01em; }
.boxSub .edu_table .sub_txt { font-size: var(--font-size-sm); font-weight: 600; color: #475569; }
.boxSub .edu_visual { flex: 0.6; border-radius: 1.5rem; min-height: 350px; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.04); position: relative; overflow:hidden;}
.boxSub .edu_visual img {height:stretch; object-fit:cover; }
.boxSub .edu_table .tr_row:hover { background-color: #f0f9ff; padding-left: 0.5rem; padding-right: 0.5rem; }

/* network */
.boxSub .spec_wrap { width: 100%; max-width:none; margin: 3rem auto 0 auto; display: flex; flex-direction: column; gap: 4rem; }
.boxSub .spec_top { display: flex; align-items: center; justify-content: space-between; gap: 4rem; background: #ffffff; border: 0.0625rem solid #e2e8f0; border-radius: 1.5rem; padding: 3.5rem; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); }
.boxSub .spec_top .info_box { flex: 1; text-align: left; }
.boxSub .spec_top .info_box h3 { font-size: var(--font-size-lg); font-weight: 900; color: var(--siteC); margin: 0 0 1.25rem 0; letter-spacing: -0.02em; }
.boxSub .spec_top .info_box p { font-size: var(--font-size-base); color: #475569; line-height: 1.7; word-break: keep-all; margin: 0; }
.boxSub .spec_top .info_box p strong { color: var(--siteC); font-weight: 700; position: relative; z-index: 1; }
.boxSub .spec_top .info_box p strong::after { content: ''; position: absolute; left: 0; bottom: 0.1rem; width: 100%; height: 0.35rem; background-color: #e0f2fe; z-index: -1; }

.boxSub .spec_top .coop_grid_box {transition:all 0.3s ease; width:100%; box-sizing:border-box; flex: 1.2; display: grid; grid-template-columns: repeat(4, 1fr); background: #f8fafc; border-radius: 1.25rem; border: 1px solid #e2e8f0; overflow: hidden; padding: 1rem; }
.boxSub .spec_top .grid_item {  border-right: 1px solid #e2e8f0;padding: 2rem 1.5rem; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; gap: 1.25rem; position: relative; }
.boxSub .spec_top .coop_grid_box:hover {transform: translateY(-5px); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }
.boxSub .spec_top .grid_item:nth-child(4) { border-right: none; }
.boxSub .spec_top .grid_item h4 { font-size: 1.05rem; font-weight: 800; color: #b91c1c; margin: 0; letter-spacing: -0.02em; }
.boxSub .spec_top .logo_flex { display: flex; gap: 1rem; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 4.5rem; }
.boxSub .spec_top .logo_flex.v_stack { flex-direction: column; gap: 0.6rem; }
.boxSub .spec_top .logo_row { display: flex; gap: 0.75rem; align-items: center; justify-content: center; }
.boxSub .spec_top .logo_flex img { height: 6rem; width: auto; object-fit: contain; max-width: 100%; border-radius:0.5rem; }

.dp2_network #contents .doc {padding-top: 0}
.network_wrap.main .map_bg::before {opacity: 0.9;}
.network_wrap.main {border-bottom:none; padding-bottom:0}
.network_wrap.main .map_bg {margin:0 auto; width:100%; margin-top: -7em;}

.network_wrap { width: 100%; padding-bottom: 3rem; border-bottom: 0.0625rem dashed #e2e8f0;}
.network_wrap .map_bg { position: relative; width: 100%; aspect-ratio: 16 / 9; }
.network_wrap .map_bg::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/sub/network_map.svg') no-repeat center center; background-size: cover; opacity: 0.35; z-index: 0; }
.network_wrap .map_inner { position: relative; width: 100%; height: 100%; z-index: 1; }
.network_wrap .network_list, .network_list li { list-style: none; margin: 0; padding: 0; }
.network_wrap .network_list > li { position: absolute; display: flex; flex-direction: column; align-items: center; transform: translate(-50%, -50%); }
.network_wrap .pin_dot { position: relative; width: 16px; height: 16px; background-color: #0284c7; border: 3px solid #fff; border-radius: 50%; box-shadow: 0 2px 5px rgba(0,0,0,0.2); z-index: 2; cursor: pointer; transition: transform 0.3s ease; }
.network_wrap .pin_dot::before { content: ''; position: absolute; top: -3px; left: -3px; width: 16px; height: 16px; border: 3px solid #0284c7; border-radius: 50%; animation: pinPulse 2s infinite ease-out; z-index: -1; box-sizing: content-box; }
.network_wrap .pin_dot:hover { transform: scale(1.2); }
@keyframes pinPulse { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(2.8); opacity: 0; } }

.network_wrap .item_usa .pin_dot { background-color: #0369a1; } 
.item_usa .pin_dot::before { border-color: #0369a1; }
.network_wrap .item_international .pin_dot { background-color: #16a34a; } 
.item_international .pin_dot::before { border-color: #16a34a; }
.network_wrap .item_england .pin_dot { background-color: #0284c7; } 
.item_england .pin_dot::before { border-color: #0284c7; }
.network_wrap .item_europe .pin_dot { background-color: #3c9ed3; } 
.item_europe .pin_dot::before { border-color: #0369a1; }
.network_wrap .item_china .pin_dot { background-color: #16a34a; } 
.item_china .pin_dot::before { border-color: #16a34a; }
.network_wrap .item_korea .pin_dot { background-color: #e0ad1f; } 
.item_korea .pin_dot::before { border-color: #caa94e; }
.network_wrap .info_box { position: absolute; bottom: 25px; background: #ffffff; padding: 0.75rem 1.15rem; border-radius: 0.75rem; box-shadow: 0 4px 15px rgba(2, 132, 199, 0.15); text-align: center; white-space: nowrap; z-index: 3; }
.network_wrap .info_box::after { content: ''; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%); border-width: 6px 6px 0; border-style: solid; border-color: #ffffff transparent; display: block; width: 0; }
.network_wrap .info_box .country { font-size: 0.8rem; font-weight: 700; color: #0369a1; margin: 0 0 0.35rem 0; letter-spacing: -0.02em; }
.network_wrap .logo_wrap { display: none ; gap: 0.4rem; justify-content: center; align-items: center; margin-bottom: 0.35rem; }
.network_wrap .logo_txt { display: none ;width:auto; font-size: 0.65rem; font-weight: bold; background: #f0fdf4; padding: 0.15rem 0.4rem; border-radius: 0.25rem; color: #16a34a; border: 1px solid #e0f2fe; }
.network_wrap .cert_logo_wrap { display: flex; gap: 0.5rem; justify-content: center; align-items: center; margin-top: 0.2rem; flex-wrap:wrap;}
.network_wrap .cert_logo_wrap img { height: 3rem; width: auto; object-fit: contain; }
.network_wrap .info_box.w1 {width: auto;}
.network_wrap .info_box.w2 {width: 8rem;}
.network_wrap .info_box.w3 {width: 13rem;}

.boxSub .spec_experience { width: 100%; display: flex; flex-direction: column; gap: 2.5rem; margin-top: 4rem; }
.exp_title_zone { text-align: left; }
.exp_title_zone .sub_num { display: block; font-size: 0.85rem; font-weight: 700; color: #94a3b8; letter-spacing: 0.05em; margin-bottom: 0.5rem; }
.exp_title_zone h3 { font-size: var(--font-size-lg); font-weight: 900; color: var(--siteC); margin: 0; letter-spacing: -0.02em; }

.spec_top.spec_experience {padding:0; border:none; box-shadow:none; margin-top:3rem; flex-direction:column; padding-top:4rem; border-top: 0.0625rem dashed #e2e8f0; border-radius:0;}
.spec_top.spec_experience .info_box {width:100%}
.boxSub .exp_card_grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; width: 100%; }
.boxSub .exp_card_item { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 1.25rem; padding: 2rem 1.75rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; position: relative; transition: all 0.3s ease; box-shadow: 0 0.25rem 1rem rgba(15,23,42,0.01); }
.boxSub .exp_card_item:hover { transform: translateY(-5px); box-shadow: 0 1rem 2rem rgba(15,23,42,0.06); border-color: #bae6fd; }
.boxSub .exp_card_item .card_badge { font-size: 0.65rem; font-weight: 800; padding: 0.2rem 0.5rem; border-radius: 2rem; margin-bottom: 1rem; letter-spacing: -0.01em; }
.boxSub .exp_card_item .card_badge.target_us { background: #f0fdfa; color: #0d9488; border: 1px solid #ccfbf1; }
.boxSub .exp_card_item .card_badge.target_kr { background: #eff6ff; color: #2563eb; border: 1px solid #dbeafe; }
.boxSub .exp_card_item .card_badge.target_etc { background: #f8fafc; color: #64748b; border: 1px solid #e2e8f0; }
.boxSub .exp_card_item .company_name { font-size: 1.1rem; font-weight: 800; color: #1e293b; margin: 0 0 0.75rem 0; letter-spacing: -0.02em; }
.boxSub .exp_card_item .project_desc { font-size: 0.9rem; color: #64748b; line-height: 1.6; margin: 0; word-break: keep-all; text-align: left; }
.boxSub .exp_card_item .project_desc strong { color: var(--siteC); font-weight: 700; }
.boxSub .exp_card_item.wide_card { grid-column: span 4; background: #f8fafc; flex-direction: row; align-items: center; gap: 2rem; padding: 1.5rem 2rem; }
.boxSub .exp_card_item.wide_card .card_badge { margin-bottom: 0; }
.boxSub .exp_card_item.wide_card .company_name { margin-bottom: 0; border-right: 1px solid #e2e8f0; padding-right: 2rem; min-width: 140px; }
.boxSub .exp_card_item.wide_card .project_desc { color: #475569; }
.boxSub .exp_card_item.wide_card .project_desc span { font-weight: 700; color: #1e293b; background: #ffffff; padding: 0.15rem 0.4rem; border-radius: 0.25rem; border: 1px solid #e2e8f0; margin: 0 0.1rem; }

/* 공평성 선언 */
.fairness_wrap { background: #ffffff; padding: 40px; border-radius: 1.5rem; border: 0.0625rem solid #e2e8f0; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); max-width: 1400px; margin: 3rem auto 0 auto; box-sizing: border-box; }
.fairness_wrap h2 { font-size: var(--font-size-lg); font-weight: 900; color: var(--siteC); margin: 0 0 1.25rem 0; letter-spacing: -0.02em; padding-left: 1.25rem; text-align:center;}
.fairness_wrap .intro-text { margin-bottom: 2rem; }
.fairness_wrap .intro-text p { font-size: 1.125rem; color: #475569; margin: 0; line-height: 1.7; word-break: keep-all; }
.fairness_wrap ul.pledge-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1rem; }
.fairness_wrap ul.pledge-list li { position: relative; padding-left: 4.5rem; font-size: var(--font-size-base); color: #334155; font-weight: 600; line-height: 1.6; text-align: left; background: #f8fafc; border: 0.0625rem solid #f1f5f9; padding: 1.25rem 1.5rem 1.25rem 4.5rem; border-radius: 1rem; transition: all 0.2s ease; }
.fairness_wrap ul.pledge-list li:hover { background: #ffffff; border-color: #cbd5e1; box-shadow: 0 0.5rem 1.25rem rgba(15,23,42,0.02); }
.fairness_wrap ul.pledge-list li .item-number { position: absolute; left: 1.5rem; top: 1.25rem; font-weight: 800; color: var(--siteC); }

.guide_box {padding:4em; border-radius:1em; border: 1px solid #cbd5e1 ; box-shadow: 0 0.5rem 1.5rem rgba(15,23,42,0.03); background-color:#ffffff; box-sizing:border-box; line-height:1.8; }
.guide_box h4 { font-size: 1.0625rem; font-weight: 700; color: var(--color-point, #011351); margin-top: 1.5rem; margin-bottom: 0.5rem; }
.guide_box h4:first-child { margin-top: 0; }
.guide_box p { margin-bottom: 1rem; }
.guide_box strong { font-weight: 700; color: var(--color-black-2, #111111); }