@charset "utf-8"; /* CSS Document */
.box0 { padding:0 4vw } 
.box1 { width:1460px; margin:0 auto; max-width:94% } 
.box2 { width:1200px; margin:0 auto; } 
.box3 { width: 1620px; margin: 0 auto; max-width: 94%; } 

.gnb li.m_hide { display:none } 
body:not(.pop) { display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100) } 

.gnb li.m_hide { display:none } 
.gnb .layer { display:none !important; } 
.gnb .blank .arrow:before { content:"\e980"; } 

.fullH { height:calc(100vh); box-sizing:border-box; } 
.fullMH { min-height:calc(100vh) !important; box-sizing:border-box; } 

.filW { filter:var(--crWhitefil); } /*화이트*/
.filB { filter:var(--crBlackfil); } /*블랙*/
.filRE { filter:var(--crfilRE); } /*색상반전*/

/*header*/
.headT { padding-top:var(--headH); } 
.headH,
#header .gnb_wrap .gnb > li,
#header .gnb_wrap .gnb > li .dp1 { height:var(--headH); transition:height .2s, background .2s; box-sizing:border-box; } 
#header:hover { background: #fff; } 
#header:hover .inner { color: var(--siteC2); } 
#header:hover .logo .in > .txt,
#header:hover .logo { filter: none; } 

#header { z-index:999; position:fixed; top:0; left:0; width:100%; /* transition: transform 1s; transform: translateY(-5em); */ } 
#header .inner { color:#fff; } 
#header .logo { width:18em; } 
#header .logo .in { display: flex; align-items: center; } 
#header .logo .in > .mark { width: 4em; height: 47px; object-fit: contain; } 
#header .logo .in > .txt { width: auto; object-fit: contain; filter: var(--crWhitefil); } 
#header .logo > .in img { display:block; width:12em; transition:.2s; transform-origin:left center; } 

/* snb */
#header .snb-list { display: flex; align-items: center; margin-right: 30px; } 
#header .snb-list li a { display: inline-flex; align-items: center; margin-right: 8px; padding: 0 16px; height: 35px; font-size: 14px; font-weight: 600; background-color: transparent; border: 1px solid #ddd; border-radius: 6px; transition: all ease 0.35s; font-size: 15px; } 
#header .snb-list li a .xi.login { margin-right: .2em; font-size: 1.215em; } 
#header .snb-list li a .xi.inquiry { margin-left: .2em; font-size: 1.15em; transform: rotate(-45deg); } 
#header .snb-list li:last-of-type a { background: rgba(255,255,255, .1); } 
#header .snb-list li a:hover { background: var(--siteC); color: #fff; } 

#header .gnb_wrap .gnb > li { } 
#header .gnb_wrap .gnb > li .dp3 { display:none; } 
#header .gnb_wrap .gnb > li .dp1 { position:relative; padding:0 3em; } 
#header .gnb_wrap .gnb > li .dp1 .tt { position:relative; font-size:1.063em; font-weight:600; } 
#header .gnb_wrap .gnb > li.act .dp1::after,
#header .gnb_wrap .gnb > li.on .dp1::after { width: 80%; opacity: 1; } 
#header .gnb_wrap .gnb > li .dp1.layer { display: none; } 
#header .gnb_wrap .gnb > li .dp1 .tt { font-weight:600; font-size:1.063em } 
#header .gnb_wrap .gnb > li .dp1 .va { position:relative } 
#header .gnb_wrap .gnb > li .dp1 .va:after { /* content:""; */ position:absolute; top:-.375em; right:-.5em; width:1em; height:1em; border-radius:50%; background:var(--siteC3); opacity:.3; transform:scale(0); visibility:hidden } 
#header .gnb_wrap .gnb > li.act .dp1 { color:var(--siteC) } 
#header .gnb_wrap .gnb > li.on .dp1 { /* color:var(--siteC) */ } 
#header .gnb_wrap .gnb > li.act .dp1 .va:after,
#header .gnb_wrap .gnb > li.on .dp1 .va:after { visibility:visible; transform:scale(1); transition:.3s } 

#header .gnb_wrap .gnb > li .dp2 { display:inline-block; opacity: 0; position:absolute; padding: 0; top:0%; left:50%; width: 100%; transform:translateX(-50%); /* max-height: 0; overflow: auto; */ transition: max-height 1.25s, padding-top .3s, padding-bottom .3s; } 
#header .gnb_wrap .gnb > li .dp2:before { background-color: var(--siteC2); content: ''; /*content:""; display:block; position:absolute; top:0; left:50%; transform:translate(-50%,-100%); display: none; border-style:solid; border-color:transparent transparent var(--siteC2); border-width:0 7px 7px; */ } 
#header .gnb_wrap .gnb > li .dp2 > li > a { padding: 0em 2em; min-height: 3.5em; box-sizing: border-box; transition: .3s; } 
#header .gnb_wrap .gnb > li .dp2 > li > a:hover .tt { color: var(--siteC); } 
#header .gnb_wrap .gnb > li .dp2 > li > a .tt { position:relative; font-size:1em; font-weight:500; opacity: .95; } 
#header .gnb_wrap .gnb > li.act .dp2 { max-height:calc(100vh - 56px); /* overflow-y: hidden; */ opacity: 1; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in { position:relative; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in:after { content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:#fff; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in > .arrow { display: none; } 
#header .gnb_wrap .gnb > li .dp2 > li > a:hover .in:after { width:100%; transition:.65s } 

#header .gnb_wrap > .gnb > li .dp2_wrap { position:absolute; left: calc(50%); width: 100vw; /* min-height:15vw; */ transform:translate(-50%, -1px); /* box-sizing:border-box; */ display:none; } 
#header .gnb_wrap > .gnb > li .dp2_wrap:before { content:""; position:absolute; top:0; left:50%; width:100vw; height:100%; background:#fff; transform:translateX(-50vw); box-sizing:border-box; } 
#header .gnb_wrap > .gnb > li .dp2 .flex { display:block; text-align:left !important; } 
#header .gnb_wrap > .gnb > li .dp2 { display: flex; flex-wrap:wrap; padding: 2vw 10vw 3em 27.5vw; background: #fff; box-sizing: border-box; /* overflow:hidden; */ box-sizing: border-box; } 
#header .gnb_wrap > .gnb > li .dp2 .gnbTit_bg { position:relative; display: block; overflow: hidden; position:absolute; top:0; left: 0; width: 30em; height:100%; background: #f6f7fc; box-sizing:border-box; background-image: url(../images/temp/allwrap_bg.jpg); background-size: cover; background-repeat: no-repeat; } 
#header .gnb_wrap > .gnb > li .dp2 .gnbTit_bg .icon { width: 15em; height: 15em; position: absolute; right: 5rem; bottom:0em; opacity: .03; } 
#header .gnb_wrap > .gnb > li .dp2 .gnbTit_bg .icon2 { position: absolute; left: 0; top: 0; } 
#header .gnb_wrap > .gnb > li .dp2 .gnbTit_bg .icon2 > img { width: 20em; opacity: .1; } 
#header .gnb_wrap > .gnb > li .dp2:after { content:attr(data-tit); height: 100%; background: #f7f7f7; position:absolute; top:0; left: 0; padding: 1.5em 3.75rem 0 0; box-sizing:border-box; font-weight:700; font-size: 1.715em; color: #111; width: 26vw; text-align: right; } 
#header .gnb_wrap > .gnb > li .dp2 > li { position:relative; flex: 1 1 16.66%; max-width: 16.66%; /* border-right:1px solid #d4d5d8; */ } 
#header .gnb_wrap > .gnb > li .dp2 > li:before { position: absolute; right: 0; width: 1px; height: 100%; background: #d4d5d8; content: ''; } 
#header .gnb_wrap > .gnb > li .dp2 > li:last-of-type:before,
#header .gnb_wrap > .gnb > li .dp2 > li:nth-child(6):before { display: none; } 
#header .gnb_wrap > .gnb > li .dp2 > li > .va_wrap { display: flex; align-items: center; } 

#header .gnb_wrap > .gnb > li .dp2 > li > a .va { display: flex; } 
#header .gnb_wrap > .gnb > li .dp2 > li > a .va > .xi { display: none; } 
#header .gnb_wrap > .gnb > li .dp2 > li > a .tt { font-size:1.1em; font-weight:600; color: var(--crBlack); text-align: left; } 
#header .gnb_wrap > .gnb > li .dp2 > li > a .arrow::before { content:"\e93f"; color:#999; } 
#header .gnb_wrap > .gnb > li .dp2 > li:hover > a,
#header .gnb_wrap > .gnb > li .dp2 > li.on > a .tt { color:var(--siteC); } 
#header .gnb_wrap > .gnb > li .dp3 { margin-top:0em; padding: 0 1em; /* border-top:1px solid #d4d5d8; */ } 
#header .gnb_wrap > .gnb > li .dp3 > li { } 
#header .gnb_wrap > .gnb > li .dp3 > li > a { } 
#header .gnb_wrap > .gnb > li .dp3 > li > a .tt { } 
#header .gnb_wrap > .gnb > li .dp3 > li { padding:.5em 0; } 
#header .gnb_wrap > .gnb > li .dp3 > li > a { position:relative; padding-left:1em; color:#666; text-align: left; } 
#header .gnb_wrap > .gnb > li .dp3 > li > a:before { /* content:""; position:absolute; left:0; top:.5em; width:4px; height:2px; background:#999; */ } 
#header .gnb_wrap > .gnb > li .dp3 > li > a .tt { font-size:16px; font-weight: 500; letter-spacing: -1px; } 
#header .gnb_wrap > .gnb > li .dp3 > li:hover > a,
#header .gnb_wrap > .gnb > li .dp3 > li.on > a { color:#000; } 
#header .gnb_wrap > .gnb > li .dp3 > li:hover > a .tt,
#header .gnb_wrap > .gnb > li .dp3 > li.on > a .tt { text-decoration:underline; } 
#header .gnb_wrap > .gnb > li.act .dp2_wrap { display:block; } 


#header.gnbOpen:before { content:""; position:fixed; top:var(--headerH); bottom:0; left:0; right:0; background:#000; opacity:.3; } 

#header .side_wrap { } 
#header .side_wrap .mem { } 
#header .side_wrap .mem > li { } 
#header .side_wrap .mem > li .in { gap:0 .5em; padding:.5em 1em; } 
#header .side_wrap .mem > li .in:hover .tt { text-decoration:underline; } 

#header .all_wrap { } 
#header .all_wrap .all { } 
#header .all_wrap .all_btn { position:relative; display:block; width:4em; height: 1.2em; margin-bottom: 1em; } 
#header .all_wrap .all_btn .ham,
#header .all_wrap .all_btn .ham:before,
#header .all_wrap .all_btn .ham:after { display:block; width:100%; height:4px; background:#fff; transition: ease-out .2s; } 
#header .all_wrap .all_btn .ham { width: 50%; background: var(--siteC); } 
#header .all_wrap .all .ham:before { width:100%; } 
#header .all_wrap .all .ham:after { width:80%; } 
#header .all_wrap .all_btn .ham:before,
#header .all_wrap .all_btn .ham:after { content:""; position:absolute; right:0; } 

#header .all_wrap .all_btn .ham:before { top:calc(50%); } 
#header .all_wrap .all_btn .ham:after { top:calc(100%); width: 50%; } 

#header .all_wrap .all_btn:hover .ham:after,
#header .all_wrap .all_btn:hover .ham { width: 100%; } 

#header:hover .all_wrap .all_btn .ham:before,
#header:hover .all_wrap .all_btn .ham:after { background: var(--crBlack); } 

#header .all_wrap .all_layer { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: var(--crWhite); color: #111; transform: translateY(-80%); opacity: 0; visibility: hidden; transition: .3s; z-index: 1000; } 
#header .all_wrap .all_layer .all_header { } 
#header .all_wrap .all_layer .all_header .all_close .close_btn { position: fixed; top: 1.5em; right: 1.5em; } 
#header .all_wrap .all_layer .all_header .close_btn { width: 5em; height: 5em; background: var(--siteC); color: var(--crWhite); border-radius: 50%; } 
#header .all_wrap .all_layer .all_header .close_btn .xi { font-size: 1.875em; transition: .3s; } 
#header .all_wrap .all_layer .all_header .close_btn:hover .xi { transform: rotate(180deg); } 

#header .all_wrap .all_layer .all_inner { flex: 1; opacity: 0; transition: .3s; } 
#header .all_wrap .all_layer .all_inner > .wrap_in { gap: 5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img { width: 30%; height: 100vh; position: relative; padding: 0 5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .wrap_img_txt { position: relative; z-index: 10; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .wrap_img_txt > p { font-size: 2.5rem; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom { position: absolute; bottom: 3em; left: 3em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul { opacity: 0.8; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li { display: flex; font-size: 1.125rem; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li span:first-child { width: 3.5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .img_bottom ul li:first-child { margin-bottom: 1em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .logo { width: 12rem; filter: var(--crWhitefil); } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(45deg, rgba(0, 0, 0, 0.5), transparent); } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_middle { width: 60%; height: 100vh; overflow-y: scroll; padding-top: 5em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_middle::-webkit-scrollbar { display: none; } 
#header .all_wrap .all_layer .wrap_top .all_mem { gap: .5em; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in { height: 2.75em; padding: 0 2em; border: 1px solid rgba(255, 255, 255, .3); border-radius: 6em; transition: .2s; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in .tt { font-size: .938em; font-weight: 500; } 
#header .all_wrap .all_layer .wrap_top .all_mem > li .in:hover { background: var(--siteC); border-color: var(--siteC); } 

#header .all_wrap .all_layer .wrap_middle .gnb { flex-wrap: wrap; flex-direction: column; padding-bottom: 20vh; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li { display: flex; justify-content: space-between; align-items: flex-start; flex: 1; padding: 3.5em 2.5em; border-left: 1px solid rgba(255, 255, 255, .1); border-bottom: 1px solid #ddd; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.m_performance .tt { width: 55%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li ul { display: flex; flex-wrap: wrap; padding: 0; width: 40vw; gap: 1em 2em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li ul.dp3 { padding-bottom: 1.5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li a { justify-content: flex-start; text-align: left !important; padding: .5em .5em 0.5em 0.5em; /* align-items: flex-start; */position: relative; } 
/* #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li a::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.25em; aspect-ratio: 1/1; border-radius: 50%; background: var(--siteC); } */
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .in { display: flex; align-items: flex-end; gap: .5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt { font-size: 2.250em; font-weight: 700; color: #111; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .arrow { display: inline-block; margin-bottom: .375em; width: .35em; height: .35em; background: var(--siteC); border-radius: 50%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.act { background: rgba(0, 0, 0, .03); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.act .dp1 .tt { background-position: 0 100%; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .in { display: inline-block; position: relative; } 
/* #header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .in:after { content:""; position:absolute; left:0; bottom:-.25em; width:100%; height:2px; background:var(--siteC); transform:scaleX(0); transform-origin:left bottom; transition:.2s; } */
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .tt { font-size: 1.188em; font-weight: 500; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .tt { color: var(--siteC); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .in:after { transform: scaleX(1) } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a { gap: 0 .5em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a:before { content: "·"; color: rgba(0, 0, 0, .4); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li > a .tt { opacity: .7; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp3 > li.act > a .tt { text-decoration: underline; opacity: 1; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp4 { display: none; } 

#header .all_wrap .all_layer .wrap_bottom { display: none; } 

.allGnbOn { overflow-y: hidden; } 
.allGnbOn #header .all_wrap .all_layer { transform: translateY(0); opacity: 1; visibility: visible; } 
.allGnbOn #header .all_wrap .all_layer .all_inner { opacity: 1; transition-delay: .4s; } 

.white #header { background: #fff; color: var(--crBlack); } 
.white #header .inner { color: var(--crBlack); } 
.white #header .logo { filter: none; } 
.white #header .all_wrap .all_btn .ham:after,
.white #header .all_wrap .all_btn .ham:before { background: var(--crBlack); } 

.white #header .logo .in > .txt { filter: none; } 

/**/
#nav { position: fixed; left:3em; width:auto; top:50%; transform:translateY(-50%); transition: .5s .3s; z-index:994; } 
#nav > li { margin-bottom: 1.5em; transition: .3s; } 
#nav > li:last-of-type { margin-bottom: 0em; } 
#nav > li > a { color:#fff; position:relative } 
#nav > li > a .dot { width: .75em; height: .75em; border: 2px solid #fff; border-radius: 50%; position:relative } 
#nav > li > a .tt { position:absolute; top:60%; transform: translateY(-50%); left:100%; margin-left:1em; white-space:nowrap; opacity:0; transition: .2s; } 
#nav > li > a .t1 { font-size:1em; font-weight: 700; } 
#nav > li:hover > a,
#nav > li.on > a,
#nav > li:hover > a .dot:after,
#nav > li.on > a .dot:after,
#nav > li:hover > a .tt { opacity:1; transition:.3s } 
#nav > li.on > a .tt { opacity: 1; } 
#nav.black { filter:brightness(.3) } 
#nav.black > li > a .dot { /* background: #111; */ } 
#nav.black > li > a .tt { color: #111; font-weight: 600; } 

.nav_non #nav { opacity: 0; visibility: visible; clip-path: inset(100%); } 

/*footer*/
#footer { z-index:1; color:#fff; background:#000; width: 100%; } 
#footer .goTop { position:fixed; right:0; bottom:0; z-index: 999; width:3.5em; line-height:3.5em; text-align:center; background:#1ebbcc; 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 .footerT { width: 100%; } 
#footer { } 
#footer .foot_top { padding: 1em 0; border-bottom: 1px solid #2c2c2c; } 
#footer .foot_top .link_wrap { display: flex; gap: 1.5em; } 
#footer .foot_top .link_wrap > li { font-size: 1em; font-weight: 500; color: rgba(255,255,255, .75) } 
#footer .foot_top .link_wrap > li.policy { font-weight: 600; color: #fff; } 
#footer .box1 { position:relative; display: flex; align-items: center; } 
#footer .gnb_wrap { width: 100%; } 
#footer .gnb_wrap .gnb { gap: 1.5em; } 
#footer .gnb_wrap .gnb > li { position:relative; width: 25%; box-sizing: border-box; } 
#footer .gnb_wrap .gnb > li:last-of-type { padding-right: 0em; } 

/*
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(3),
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(4) { width: 10.5%; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp1 { display:inline-block; padding:2em 0em 1.2em 0em; font-size:1.125em; color: #fff; text-align:left !important; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp1 > .in > .tt { font-size: 1em; font-weight: 600; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 { flex-direction:column; align-items: start; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li { display:block; margin-bottom: 1em; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a { display:inline-block; text-align:left !important; opacity:.6; transition:.3s; font-size: 1em; } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a .va { font-size:.875em } 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover { opacity:1 } 

#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(4) .dp2,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(2) .dp2,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(1) .dp2 { display: flex; flex-wrap: wrap; flex-direction: row; } 
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(4) .dp2 > li,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(2) .dp2 > li,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(1) .dp2 > li { width: calc(50%); margin-bottom: .75em; } 

#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(1) .dp2 > li > a,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(2) .dp2 > li > a,
#footer .menu_wrap .gnb_wrap .gnb > li:nth-child(4) .dp2 > li > a { display: flex; justify-content: start; } 

#footer .menu_wrap .gnb_wrap .gnb > li .dp3, 
#footer .menu_wrap .gnb_wrap .gnb > li.m_privacy, 
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 .m2_survey { display: none; } 

#footer .info_wrap { padding:3em 0 4em; } 
#footer .info_wrap .logoC { } 
#footer .info_wrap .logoC > img { width: 100%; height: 40px; object-fit: contain; filter: brightness(0) invert(1); opacity: .8; } 
#footer .info_wrap > .box1 { position:relative; gap: 2em; } 
#footer .info_wrap .foot_top { display:flex; justify-content:space-between; align-items:center; margin-bottom:2em; } 
#footer .info_wrap .foot_top .logo { width:210px } 
#footer .info_wrap .foot_top .logo img { height:3em; filter:brightness(0) invert(1) opacity(.5) } 
#footer .info_wrap .foot_top .link_wrap { display:flex; margin-right:5px; } 
#footer .info_wrap .foot_top .link_wrap .link { margin-left:2em; font-size:1em; color:rgba(255, 255, 255, .9); opacity:.5; position:relative } 
#footer .info_wrap .foot_top .link_wrap .link.point ,
#footer .info_wrap .foot_top .link_wrap .link.policy { opacity:.8; } 
#footer .info_wrap .foot_top .link_wrap .link::after { content:''; width:1px; height:100%; background:rgba(255, 255, 255, .5); position:absolute; left:-1em; top:0; } 
#footer .info_wrap .foot_top .link_wrap .link:first-child::after { display:none } 


#footer .info_wrap .info > li { float:left; margin-right:2em; margin-bottom:.3em; opacity:.8; font-weight:300; font-size:.95em; position:relative } 
#footer .info_wrap .info > li.br { display: block; width: 100%; } 
#footer .info_wrap .info .copyright { width:100%; margin-top:1em; margin-bottom:0; font-size:.813em; opacity:.6; text-transform:uppercase; font-size:.8125em; } 

#footer .info_wrap .info.st2 { margin-top: 2em; padding-top: 1em; border-top: 1px solid rgba(255, 255, 255, .2); zoom: .9; } 
#footer .info_wrap .info.st2 .name { margin-bottom: 0.5em; font-size:1.1em; } 


#footer .infoA { gap: 2em; margin-top: 2em; } 
#footer .family { position:relative; min-width: 12em; } 
#footer .family .btn { padding:0 1.5em 0 1.75em; height:3.125em; background: #191919; color: #fff; } 
#footer .family .btn .tt { font-size:.938em; font-weight:500; } 
#footer .family .btn .xi { font-size:.938em; margin-left:2.5em; } 
#footer .family .btn .xi:before { display:block; transition:.3s; } 
#footer .family .family_con { position:absolute; left:0; bottom:100%; width:100%; max-height:20em; padding:1em .5em 1em 1em; background:#111; box-sizing:border-box; display:none; z-index: 99; } 
#footer .family .family_con .list > li .in { display:block; padding:.5em 0; color: #fff; } 
#footer .family .family_con .list > li .in .tt { font-size:.875em; } 
#footer .family .family_con .list > li .in:hover .tt { text-decoration:underline; } 

#footer .family.on .btn { background:#111; } 
#footer .family.on .btn .xi:before { transform:rotate(180deg); } 
#footer .family.on .family_con { display:block; } 
*/
#footer .wrapIn { display:flex; align-items:flex-start; gap:4em; padding:4em 0 } 
#footer .logo_wrap { /* display:flex; flex-wrap:wrap; align-items:center; gap:2em; flex:1 1 0%; min-width:0 */ } 
#footer .logo_wrap .logo img { display:block; height:3.5em; filter: brightness(0) invert(1); margin-bottom: 1.5em; } 
#footer .info { width:100% } 
#footer .info > li { float:left; margin-right:2em; font-size:.875em; font-weight:700; opacity:.8; margin-bottom:.5em } 
#footer .info > li.br { clear:left } 
#footer .info:after { content:""; display:block; clear:both } 
#footer .info > li.copyright { width: 100%; font-size:.75em; opacity:.5; text-transform:uppercase; letter-spacing:0; margin-top:1.5em } 
#footer .menu { display:flex; gap:2em } 
#footer .menu > li > a { font-weight:700; font-size:.938em; color: rgba(255,255,255, .75) } 
#footer .menu > li.point > a { font-weight:700; color: #fff; } 
#footer .menu > li:hover > a { color: rgba(255,255,255, .9) } 
#footer .menu_wrapper,
#footer .etc_wrap { margin-top:1em } 
#footer .menu_wrapper .gnb { gap: 2em; } 
#footer .menu_wrapper .gnb > li { width: 14em; } 
#footer .menu_wrapper .gnb > li:not(.m_product, .m_data, .m_community),
#footer .menu_wrapper .gnb > li .dp4 { display:none } 
#footer .menu_wrapper .gnb a { text-align:left; justify-content: start; } 
#footer .menu_wrapper .gnb a.layer { display: none; } 
#footer .menu_wrapper .gnb > li .dp3,
#footer .menu_wrapper .gnb > li .dp2 { gap: .5em; flex-wrap: wrap; } 
#footer .menu_wrapper .gnb > li .dp2 > li { width: calc(50% - .25em); } 
#footer .menu_wrapper .gnb > li .dp2 > li > a .tt,
#footer .menu_wrapper .gnb > li .dp1 .tt { font-weight:800; text-transform:uppercase; font-size: 1.15em; } 
#footer .menu_wrapper .gnb > li .dp2 > li > a .tt { transition: .2s; } 
#footer .menu_wrapper .gnb > li .dp2 > li > a:hover .tt { color: #fff; } 
#footer .menu_wrapper .gnb > li .dp1 .in { margin-bottom: 1em; } 
#footer .menu_wrapper .gnb > li .dp3 > li > a .tt,
#footer .menu_wrapper .gnb > li .dp2 > li > a .tt { font-weight:700; font-size:.875em; color:#777 } 
#footer .menu_wrapper .gnb > li .dp3 > li:hover > a .va,
#footer .menu_wrapper .gnb > li .dp2 > li:hover > a .va { } 
#footer .etc_wrap { display:flex; flex-direction:column; align-items:flex-end; gap:1em; width: 15%; } 
#footer .cs_wrap { text-align:right } 
#footer .cs_wrap .t1 { font-weight:700; font-size:1.125em; color:#666 } 
#footer .cs_wrap .call { display:flex; align-items:center; gap:.5em } 
#footer .cs_wrap .call .xi { width:2em; height:2em; background:#fff; color:var(--siteC); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1em } 
#footer .cs_wrap .call .no { font-weight:700; font-size:1.25em; } 
#footer .sns_wrap { display:flex; gap:1em } 
#footer .sns_wrap > li > a { color:#999; width:2em; height:2em; border-radius:50%; display:flex; align-items:center; justify-content:center } 
#footer .sns_wrap > li > a .xi { font-size:1.5em } 
#footer .sns_wrap > li:hover > a { color: #333; } 
#footer .site_wrap { position:relative; z-index:1 } 
#footer .site_wrap .btn { display:block; padding:.75em 1em; padding-right:3em; background:#fff; width:9em; position:relative; } 
#footer .site_wrap .btn .xi { position:absolute; right:0; width:2.5em; text-align:center; top:50%; color: #111; line-height:1em; margin-top:-.5em; transition:.3s; font-size:1em } 
#footer .site_wrap .btn .tt { font-weight:700; font-size:.875em; color:#666 } 
#footer .site_wrap .siteBtn { font-weight:500 } 
#footer .site_wrap .list { position:absolute; bottom:100%; width:100%; transition:.3s; opacity:0; visibility:hidden } 
#footer .site_wrap .list .btn { overflow:hidden } 
#footer .site_wrap .list .btn .xi { right:-2em } 
#footer .site_wrap .list .btn .xi:before { transform:scale(.75) } 
#footer .site_wrap .list .btn:hover { background:#ddd; } 
#footer .site_wrap .list .btn:hover .xi { right:0 } 
#footer .site_wrap.on .list { opacity:1; visibility:visible } 
#footer .site_wrap.on .siteBtn .xi { transform:rotate(180deg) } 

.sns_st { display:flex; align-items:center; gap:.25em } 
.sns_st > li > a { width:2.5em; height:2.5em; background:#f1f1f1; display:flex; align-items:center; justify-content:center; border-radius:50% } 
.sns_st > li > a .xi,
.sns_st > li > a img { opacity:.5 } 
.sns_st > li > a .xi { font-size:1.25em } 
.sns_st > li > a img { height:40% } 
.sns_st > li > a:hover { color:#fff; transition:.3s } 
.sns_st > li > a:hover .xi,
.sns_st > li > a:hover img { opacity:1 } 
.sns_st > li > a:hover img { filter:brightness(0) invert(1) } 
.sns_st > li > a:hover.fb { background:#395398 } 
.sns_st > li > a:hover.in { background:#a9309d } 
.sns_st > li > a:hover.yt { background:#f70000 } 
.sns_st > li > a:hover.tt { background:#111 } 
.sns_st > li > a:hover.nb { background:#29a139 } 
.ch .sns_st > li > a .xi,
.ch .sns_st > li > a img { opacity: 1; filter: brightness(0) invert(1); } 
.ch .sns_st > li > a.fb { background:#395398 } 
.ch .sns_st > li > a.in { background:#a9309d } 
.ch .sns_st > li > a.yt { background:#f70000 } 
.ch .sns_st > li > a.tt { background:#222 } 
.ch .sns_st > li > a.nb { background:#29a139 } 



/**********공통**********/
#contents { overflow: hidden; } 
#contents .doc { padding: 4em 0 10em 0; } 
#contents .doc.pt0 { padding: 0em 0 10em 0; } 
#contents .doc.pb0 { padding: 4em 0 0em 0; } 

.Rlate { position:relative; } 

.con_idx { position:relative } 
.con_idx > .idx { position:absolute; left:0; top:0; width:100%; visibility:hidden; filter:alpha(opacity=0); opacity:0; display: none; } 
.con_idx > .idx.on { position:relative; visibility: visible; filter:alpha(opacity=100); opacity:1; display: block; } 


/*gary before*/
.begray { position: relative; } 
.begray:before { position: absolute; width: 100%; bottom: 0; top: 4.5em; background: #f9f9f9; content: ''; } 

/*gra line*/
.sub_line { width: 100%; height: 2px; background: linear-gradient(to right, #7fc31c, #00844a); } 

/*page_dot 공통*/
.page_dot_list { padding: 0 1.25em; margin-top: 1.25em; } 
.page_dot_list > li { position:relative; margin-bottom: .5em; font-size: 1.063em; } 
.page_dot_list > li > .txt { font-size: 1em; } 
.page_dot_list > li:before { position: absolute; left: -13px; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); content: ''; } 
.page_dot_list > li:last-of-type { margin-bottom: 0em; } 

.page_dot_list.s1 { margin-top: 0em; } 
.page_dot_list.s1 > li:before { width: none; height: none; background: none; top: unset; left: -15px; content: '-'; } 

/*page_line 공통*/
.page_line_list { margin-top: 1.25em; } 
.page_line_list > li { position:relative; padding: .65em 1.25em; border-bottom: 1px solid #e5e5e5; } 
.page_line_list > li > .txt { font-size: 1em; } 
.page_line_list > li:before { position: absolute; left: -13px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); content: ''; } 

/*sub areaD*/
.page_con { position:relative; padding: 4em 0; } 
.page_con.bg1 { background: #f9f9f9; } 
.page_con.pbM { padding-bottom: 8em; } 

/*버튼*/
.button-gradient { color: #fff; background-image: linear-gradient(48deg, #90fa3e, #21996c, #21996c, #63ff93); background-size: 300% 100%; background-position: 0%; border-color: transparent; transition: background ease .3s; } 
.button-gradient:hover { background-position: 15%; } 
.btn-round { border-radius: 50px; } 
.sub_btn .btn { padding-top: 18px; padding-bottom: 18px; width: 200px; text-align: center; font-size: 20px; font-weight: 700; } 
.sub_btn .btn > .xi { margin-left: .3em; } 
.sub_btn .btn.s1 { font-size: 16px; padding-bottom: 16px; padding-top: 16px; font-weight: 600; background: var(--siteC); color: #fff; } 

/*sub 타이틀 점*/
.dot-tit { position:relative; padding-left: 1em; font-size: 1.85em; font-weight: 800; color: #111; margin-bottom: 1.15em; } 
.dot-tit:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; width: 7px; height: 7px; border-radius: 50%; border: 4px solid var(--siteC); } 

/*sub 펼쳐짐 효과*/
.sub-wide { overflow: hidden; position: relative; clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%); transition: clip-path 1.2s cubic-bezier(0.4, 0, 0.2, 1) .15s; } 
.sub-wide.on { clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); visibility: visible; opacity: 1; transition: clip-path 1.2s cubic-bezier(0.4, 0, 0.2, 1) 0.15s, opacity 1.4s cubic-bezier(0.4, 0, 0.2, 1) 0s; } 

/*구분 de*/
.sub_diviC { gap: 6em; transform: translateY(2em); transition: 1s; opacity: 0; } 
.sub_diviC.listShow.on { transform: translateY(0em); transition: 1s; opacity: 1; } 
.sub_diviC .dvT { flex: 1 1 20%; } 
.sub_diviC .dvT .tit { } 
.sub_diviC .dvIF { flex: 1 1 80%; } 
.sub_diviC .dvIF .tt { font-size: 1.1em; line-height: 1.6; color: #444; } 

/*flex box*/
.flex_box { } 
.flex_box.s1 { margin: 0 0 -1em -1em; } 
.flex_box.s2 { margin: 0 0 -2em -2em; } 
.flex_box.s3 { } 
.flex_box.s4 { } 
.flex_box.s5 { } 

.flex_box .fst2 > li { flex: 1 1 50%; max-width: 50%; } 
.flex_box .fst2 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst3 > li { flex: 1 1 33.33%; max-width: 33.33%; } 
.flex_box .fst3 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst4 > li { flex: 1 1 25%; max-width: 25%; } 
.flex_box .fst4 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst5 > li { flex: 1 1 20%; max-width: 20%; } 
.flex_box .fst5 > li > .in { margin: 0 0 1em 1em; } 

.flex_box li > a { display: block; } 

/*sub 탑 공통*/
.sub #header .logo,
.sub #header .all_wrap .all_btn { filter: none; } 
.sub #header .inner { /* color: var(--crBlack); */ } 
.sub #contents { padding-top: var(--headB); } 
.sub #header .logo { /* filter: var(--crWhitefil); */ } 
.sub #header:hover .logo { filter: none; } 

.sub.scroll #header .inner { background: #fff; color: var(--crBlack); } 
.sub.scroll #header .logo { filter: none; } 

.sub.scroll #header .all_wrap .all_btn .ham:before,
.sub.scroll #header .all_wrap .all_btn .ham:after { background: var(--crBlack); } 
.sub.scroll #header .logo .in > .txt { filter: none; } 

.dp1_product #header .inner { background: #fff; color: var(--crBlack); border-bottom: 1px solid #ddd; } 
.dp1_product #header .logo { filter: none; } 

.dp1_product #header .all_wrap .all_btn .ham:before,
.dp1_product #header .all_wrap .all_btn .ham:after { background: var(--crBlack); } 
.dp1_product #header .logo .in > .txt { filter: none; } 

/*contents*/
#contents .sub_page_top { position:relative; height:30em; } 
#contents .sub_page_bg { position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; } 
#contents .sub_page_bg > .bg { position:absolute; top:0; right:0; width:calc(100% + 3vw); height:100%; transition:3s; } 
#contents .sub_page_bg > .bg:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,.2)); } 
.load #contents .sub_page_bg > .bg { right:-1.5vw; } 
#contents .sub_page_tit { flex:1 0 auto; position:relative; color:#fff; padding-top: 3em; } 
#contents .sub_page_tit .sub_tit .tt { font-size:3.500em; font-weight:600; text-transform: capitalize; } 
#contents .navT { position:absolute; right:2%; bottom:0; padding-bottom:2em; } 
#contents .navT > li { } 
#contents .navT > li .xi { width:1.5em; height:1.5em; background:var(--siteC2); border-radius:50%; font-size:1em; color:#fff; } 
#contents .navT > li .tt { vertical-align:middle; font-size:.938em; } 
#contents .navT > li + li:before { content:"\e940"; font-family:xeicon; padding:0 .5em; vertical-align:middle; opacity:.8; } 
#contents .navT > li:last-child .tt { font-weight:600; text-decoration:underline; } 

#contents .sub_con_tit { padding:6em 0 0; text-align:center; } 
#contents .sub_con_tit .tt { position:relative; display:inline-block; font-size:2.500em; font-weight:700; } 

#contents .sub_page_menu { position:relative; background:rgba(0,0,0,.15); backdrop-filter:blur(10px); } 
#contents .sub_page_menu .gnb { display:block; } 
#contents .sub_page_menu .gnb .dp3 { display:none; } 
#contents .sub_page_menu .gnb .dp2 { justify-content:center; } 
#contents .sub_page_menu .gnb .dp2 > li { width: 15%; position:relative; } 
#contents .sub_page_menu .gnb .dp2 > li:before { content:""; position:absolute; left:0; bottom:100%; width:100%; height:3px; background:#fff; transform:scaleX(0); transition:.3s; } 
#contents .sub_page_menu .gnb .dp2 > li > a { gap:.875em; height:5em; padding:0 1em; color:#fff; } 
#contents .sub_page_menu .gnb .dp2 > li > a .tt { font-size:1.188em; opacity:.8; } 
#contents .sub_page_menu .gnb .dp2 > li.act > a .tt,
#contents .sub_page_menu .gnb .dp2 > li.on > a .tt { opacity:1; } 
#contents .sub_page_menu .gnb .dp2 > li.on > a .tt { font-weight:600; } 
#contents .sub_page_menu .gnb .dp2 > li.act:before,
#contents .sub_page_menu .gnb .dp2 > li.on:before { transform:scaleX(1); } 

#contents .sub_page_con { padding:5em 0 0 0; text-align:center; } 
#contents .sub_page_con .con_tit { } 
#contents .sub_page_con .con_tit .tt { font-size:3.000em; font-weight:700; } 
#contents .sub_page_con .con_tit + .con_menu { margin-top:3em; } 
#contents .sub_page_con .con_menu { } 
#contents .sub_page_con .con_menu ul:not(.dp3) { display:block; } 
#contents .sub_page_con .con_menu .gnb .dp4 { display:none; } 
#contents .sub_page_con .con_menu .gnb .dp3 { justify-content:center; flex-wrap: wrap; gap: 1em 0; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li { width:20%; background:var(--crGray); } 
#contents .sub_page_con .con_menu .gnb .dp3 > li:first-child { border-radius:6em 0 0 6em; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li:last-child { border-radius:0 6em 6em 0; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li:nth-child(5) { border-radius:0 6em 6em 0; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li:nth-child(6) { border-radius:6em 0 0 6em; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li > a { height:4em; padding:0 0.5em; border-radius:6em; color:#777; transition:.2s; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li > a .tt { font-size:1em; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li.act > a { color:#000; } 
#contents .sub_page_con .con_menu .gnb .dp3 > li.on > a { background:var(--siteC); color:#fff; font-weight:500; } 

#contents .sub_top_wrap { box-sizing:border-box; display:flex; flex-direction:column } 
#contents .sub_top_wrap .wrap_con { display:flex; flex-direction:column; padding-top: var(--headH); } 
#contents .sub_top_wrap .wrap_con .nav_wrap { flex:1 1 0%; min-height:0 } 
#contents .sub_top_wrap .wrap_con .nav_wrap .wrap_in { height:100%; box-sizing:border-box; display:flex; align-items:flex-end; padding:3em 0 } 
#contents .sub_top_wrap .wrap_con .nav_wrap .wrap_in .in { display:flex; gap: 1em; justify-content:space-between; align-items:flex-end } 
#contents .sub_top_wrap .wrap_con .nav_wrap .tit { display:flex; flex-direction:column; gap:1.215em 0 } 
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t1 { font-weight:700; font-size:1.25em; text-transform:uppercase; padding-left:.25em } 
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t2 { font-weight:700; font-size:3.515em; letter-spacing: -0.01em; } 
#contents .sub_top_wrap .wrap_con .nav_wrap .tit .t2_wrap { overflow:hidden; line-height:1.1 } 
.dp1_product #contents .nav { } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav { display:flex; align-items:center; } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li { text-transform:uppercase; color:#777; display: flex; align-items: center; } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li:not(.home):before { content:"\e940"; font-family:xeicon; margin:0 .5em } 
#contents .sub_top_wrap .wrap_con .nav_wrap .nav > li.home { color:var(--siteC) } 

/*
#contents .detail-wrapper .nav { position: relative; right: 0; bottom: 0; padding-bottom: 0; } 
#contents .detail-wrapper .nav > li .xi { width: unset; height: unset; line-height: 1; color: var(--siteC); border-radius: 0; font-size: 1.35em; } 
#contents .detail-wrapper .nav > li .tt { font-size: 1.1em; font-weight: 600; } 
#contents .detail-wrapper .nav > li + li:before { padding: 0 1em; } 
#contents .detail-wrapper .nav > li:last-child .tt { text-decoration: unset; } 
.detail-wrapper { padding-bottom: 6em; } 
.detail-wrapper .navi_wrapper { position: sticky; top: var(--headH); border-top: 1px solid #ddd; background: #fff; align-items: center; margin-top: var(--headH); padding: 1.25em 0; border-bottom: 1px solid #ddd; z-index: 99; } 
.detail-wrapper .navi_wrapper .inner { display: flex; align-items: center; gap: 3em; } 

#contents .sub_drop_menu .drop_menu { position:relative; } 
#contents .sub_drop_menu .drop_menu:before { position: absolute; left: -2em; top: 50%; transform: translateY(-50%); content: "\e940"; font-family: xeicon; vertical-align: middle; opacity: .8; } 
#contents .sub_drop_menu .drop_menu .drop_tit { gap:0 1em; min-width:15em; transition:.2s; } 
#contents .sub_drop_menu .drop_menu .drop_tit .tt { font-size:1.1em; font-weight: 600; } 
#contents .sub_drop_menu .drop_menu .drop_tit .tt:hover { text-decoration: underline; } 
#contents .sub_drop_menu .drop_menu .drop_tit .arrow { font-size: 1.515em; transition:.2s; } 
#contents .sub_drop_menu .drop_menu .drop_tit .arrow:before { content:"\e942"; } 
#contents .sub_drop_menu .drop_menu ul { display:block; } 
#contents .sub_drop_menu .drop_menu ul .dp3 { padding: .5em 1.5em 1em 1.5em; box-shadow: 3px 0 12px rgba(0,0,0, .1); } 
#contents .sub_drop_menu .drop_menu ul > li.on { /* display: none; } 
#contents .sub_drop_menu .drop_menu .gnb { position:absolute; top:150%; left:0; width:100%; background: #fff; color:#171717; display:none; } 

#contents .sub_drop_menu .drop_menu .gnb a.flex { display:block; text-align:left !important; } 
#contents .sub_drop_menu .drop_menu .gnb li > a { padding:.45em 0; font-size: 1.063em; font-weight:500; transition:.2s; } 
#contents .sub_drop_menu .drop_menu .gnb li > a .tt { font-size:.938em; } 
#contents .sub_drop_menu .drop_menu .gnb li.act > a,
#contents .sub_drop_menu .drop_menu .gnb li.on > a { color:var(--siteC); } 
#contents .sub_drop_menu .drop_menu .gnb li.on > a { font-weight:600; } 
#contents .sub_drop_menu .home:hover,
#contents .sub_drop_menu .drop_menu:hover,
#contents .sub_drop_menu .drop_menu.on { z-index:2; } 
#contents .sub_drop_menu .drop_menu:hover .drop_tit,
#contents .sub_drop_menu .drop_menu.on .drop_tit { } 
#contents .sub_drop_menu .drop_menu:hover .drop_tit { } 
#contents .sub_drop_menu .drop_menu.on .drop_tit { } 
#contents .sub_drop_menu .drop_menu.on .drop_tit .arrow { transform:rotate(-180deg); } 
#contents .sub_drop_menu .drop_menu.on .gnb { display:block; } 
*/

.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 } 

/*버튼 공통*/
.Abtn .more { display: inline-flex; width: auto; align-items: center; border: 1px solid var(--crBlack); box-sizing: border-box; color: var(--siteC2); font-size: 16px; padding: .8em 1.5em; overflow: hidden; position: relative; font-weight: 700; } 
.Abtn .more.white { border: 1px solid #fff; color: #fff; transition: all 0.2s; } 
.Abtn .more.white:hover { border: 1px solid var(--crBlack); } 
.Abtn .more.round { border-radius: 70px; } 
.Abtn .more:before { content: ""; display: inline-block; position: absolute; top: 0; left: 0; height: 100%; width: 0; z-index: 1; background-color: var(--siteC2); transition: all 0.5s; background-color: #222; } 

.Abtn .more.c1:before { background-color: var(--siteC); color: #fff; } 
.Abtn .more.c1 { border: 1px solid var(--siteC); color: var(--siteC); } 

.Abtn .more.s1 { font-size: .9em; } 
.Abtn .more.s2 { font-size: .85em; } 

.Abtn .more > span { position:relative; z-index: 2; line-height: 1; } 
.Abtn .more:hover { color: #fff; } 
.Abtn .more:hover::before { width: 100%; } 
.Abtn .more > .xi { padding-left: .65em; position: relative; z-index: 2; } 

.Abtn .more.st1 { border: none; padding: 0em; font-weight: 500; font-size: 1.25em; border-radius: 0; color: #eee; } 
.Abtn .more.st1:before { top: unset; bottom: 0; width: 0%; height: 3px; background: rgba(255,255,255, .65); content: ''; transition: .3s all; } 
.Abtn .more.st1:hover:before { width: 100%; } 

/**/
#quickBtn { position: fixed; z-index: 994; width: 7em; top: 85%; right: 6vw; transform: translateY(-50%); } 
.sub #quickBtn { display: none; } 
.fp-viewing-Footer #quickBtn { opacity: 0; visibility: hidden; clip-path: inset(100%); } 
.link-btn { position:relative; display: flex; justify-content: center; align-items: center; padding: 13px 36px 13px 40px; border-radius: 35px; border: 1px solid #ddd; width: fit-content; margin: 0 auto; } 
.link-btn .text { overflow: hidden; } 
.link-btn .text span { position: relative; font-size: 1.15em; text-shadow: 0px 27px 0px #000; color: #000; font-weight: 800; transition: 0.5s; } 
.link-btn.white .text span { color: #fff; text-shadow: 0px 27px 0px #fff; } 
.link-btn.accent .text span { color: var(--siteC); text-shadow: 0px 27px 0px var(--siteC); } 
.link-btn.accent > .xi { color: var(--siteC); } 
.link-btn .xi { margin-left: 15px; vertical-align: baseline; margin-top: 2px; font-size: 1.6em; } 
.link-btn .ico-left { margin-right: 6px; vertical-align: baseline; } 
.link-btn.small { padding: 0; border: none; line-height: 1; } 
.link-btn.small .ico { margin-left: 7px; margin-top: 0; } 
.link-btn.small .text { line-height: 1; } 
.link-btn.small .text span { line-height: 1; text-shadow: 0; } 
.link-btn.small .text span { line-height: 1; text-shadow: 0px 18px 0px #000; } 
.link-btn:hover .text span { transform: translateY(-110%); } 

.link-btn.cp { background: var(--siteC); color: #fff; border: 1px solid var(--siteC); } 
.link-btn.cp .text span { color: #fff; text-shadow: 0px 27px 0px #fff; } 

.side-btns a { padding: 15px 18px 15px 28px; width: 100%; justify-content: space-between; font-weight: bold; background: var(--accent-color); border:none; } 
.side-btns a .text span { color: #fff; } 
.side-btns a + a { margin-top: 10px; background: #fff; border: 1px solid #dddddd; } 
.side-btns a + a .text span { } 
.side-btns.sub { height: 100%; bottom: auto; top: 120px; right: 1.5%; z-index: 9; } 
.side-btns.sub .group { position: sticky; top: 100px; } 

/**/
.vod_wrap { position:relative; width: 100%; 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% } 

.visualSlide_wrap { position: relative; height: 100vh; overflow: hidden; } 
.visualSlide_wrap .visualSlide { } 
.visualSlide .el { position:relative; overflow:hidden; height:100vh; background:#fff } 
.visualSlide .el:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(0,0,0,.2) 0%, rgba(0,0,0,.5) 100%); content: ''; z-index: 1; } 
.visualSlide .el .bg { position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.15) } 
.visualSlide .el .bg > img { width: 100%; height: 100%; object-fit: cover; } 
.visualSlide .el .mask { -webkit-mask-image: url(../images/main/visual_mask.svg); -webkit-mask-repeat: no-repeat; -webkit-mask-size: cover; -webkit-mask-position: right bottom; } 
.visualSlide .el .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 
.visualSlide .el .vod_wrap:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:1 } 
.visualSlide .el .vod_bg { position:absolute; left:0; top:0; width:100%; height:100% } 
.visualSlide .el.swiper-slide-active .vod_wrap:after,
.visualSlide .el.swiper-slide-duplicate-active .vod_wrap:after { transition:2s; opacity:.1 } 
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg { transition:5s; transform:scale(1) } 

.visualSlideSlogan_wrap { position:absolute; left:0; width: 100%; top:45%; transform:translateY(-50%); z-index:10; color:#fff; text-align:left } 
.visualSlide_wrap .slogan { margin-bottom:auto; box-sizing:border-box; } 
.visualSlide_wrap .slogan .wrap_in { display:flex; flex-direction:column } 
.visualSlide_wrap .slogan .t1 { font-size:4.15em; text-transform:uppercase; font-weight:900; line-height:1.3; margin-bottom: .35em; transform: translateY(-100%); opacity:0; } 
.visualSlide_wrap .slogan .t2 { font-size:1.615em; font-weight: 500; line-height: 1.4 margin-bottom: .35em; color: rgba(255,255,255, 1); opacity: 0; transform: translateX(4em); transition: 1.5s .5s; } 

.visualSlide_wrap .el.swiper-slide-active .slogan .t1 { transform: translateY(0); opacity: 1; } 
.visualSlide_wrap .el.swiper-slide-active .slogan .t2 { transform: translateX(0); opacity: 1; } 
.visualSlide_wrap .slogan .ani { overflow:hidden } 

.visualSlide_wrap .slogan .ani > i { transform:translateY(200%); } 
.visualSlide_wrap .el.swiper-slide-thumb-active .slogan .ani > i { transform:translateY(0); opacity: 1; transition:1.5s; } 

.visualSlide_control { margin-bottom: 3.5em; } 
.visualSlide_control .paging { color:#fff; width:auto; display:flex } 
.visualSlide_control .paging span { position:relative; background:rgba(255,255,255,.5); opacity:1; width:0; height:3px; border-radius:0; position:relative; transition:.3s; height:2px; counter-increment: vIndex; display:block; margin:0 1.5em; font-weight: 800; } 
.visualSlide_control .paging span:before { content:counter(vIndex); position:absolute; right:100%; top:50%; width:1.5em; transform:translateY(-50%) } 
.visualSlide_control .paging span:nth-child(-n+10):before { content:"0" counter(vIndex) } 
.visualSlide_control .swiperBtn { margin-right:.5em } 
.visualSlide_control .swiperBtn:hover { background: var(--siteC); } 
/* .visualSlide_control .paging { margin-left:1.5em } */
.visualSlide_control .paging > span:after { content:""; position:absolute; left:0; top:0; width:0; height:100%; background:#fff } 
.visualSlide_control .paging > span.swiper-pagination-bullet-active { width:10em } 
.visualSlide_control .paging > span.swiper-pagination-bullet-active:after { width:100%; transition:7s } 

.mainScroll { color:#fff } 
.mainScroll .line { position:relative; display:block; height:4em; overflow:hidden } 
.mainScroll .line:before { content:""; position:absolute; left:50%; top:0; height:100%; width:1px; background:#fff; } 
.mainScroll .dot { position:absolute; left:50%; transform:translateX(-50%); top:0; width:.5em; height:.5em; background:#fff; border-radius:50% } 
.mainScroll .tt { display:block; transform:rotate(90deg); font-size:.75em; margin:0 0 2.5em 0 } 
.mainScroll .tt .xi { font-size:1.5em; margin-right:.25em } 

.main_box { padding:6em 0; overflow:hidden } 
.main_box.bg1 { background:#f5f5f5 } 

.main_tit { margin-bottom:2.5em; display:flex; flex-direction:column; gap:1em } 
.main_tit.white { color: #fff; } 
.main_tit.g1 { gap:2em } 
.main_tit.hc { align-items:center; text-align:center } 
.main_tit.vc { justify-content:center } 
.main_tit .t1 { font-size: 3.215em; font-weight: 700; } 
.main_tit .t4 { font-size: 1em; font-weight: normal; line-height: 1.4; } 
.main_tit.en .t1 { font-size: 4.15em; } 
.main_tit .t2 { font-size: 2.35em; font-weight: 800; } 
.main_tit .tit1 { font-size:7.25vw; font-weight:900; letter-spacing:-.063em; word-spacing:.125em } 
.main_tit .tit1.s1 { font-size:5.5em } 
.main_tit .tit1.s2 { font-size:3em } 
.main_tit .tt1 { font-size:1.25em; line-height:1.8; font-weight:500 } 
.main_tit .vodW { position:relative } 
.main_tit .vodW .vod_wrap { position:absolute; left:0; top:0; width:100%; height:100%; mix-blend-mode:lighten } 
.main_tit .vodW .twrap { background:#fff } 
.main_tit .c1 { opacity:.1 } 

/*메인 서브 타이틀*/
.main_tit { position:relative; } 
.main_tit .icon:before { width: 3.15em; height: 1px; background: var(--siteC); content: ''; } 
.main_tit .icon.white:before { background: #fff; } 
.main_tit .main_subt { margin-bottom: 1em; } 
.main_tit .main_subt .tt { font-size: 1.65em; font-weight: 700; } 
.main_tit .main_subt .tt.ffEN { font-size: 2.15em; font-weight: 700; } 
.main_tit .icon { display: inline-flex; align-items: center; gap: 1em; } 

.mainFlex { display:flex; gap:4em; align-items:flex-start; position:relative; box-sizing:border-box } 
.mainFlex .wrapTit { width:30%; position:sticky; left:0; top:0; padding:5em 0; box-sizing:border-box } 
.mainFlex .wrapCon { flex:1 1 0%; min-width:0 } 

/**/
.sectionW { height:100vh !important; position:relative; box-sizing:border-box } 
.sectionW.cen { display: flex; align-items: center; } 
.sectionW.cen.dir { flex-direction: column; justify-content: space-between; } 
.section .Inner { margin-top: 3em; } 

/* 카운트 */
.countUp { display: flex; align-items: center; justify-content: center; } 
.countUp .count-num-box { display:flex; align-items:center; justify-content: center; font-size:3rem } 
.countUp .count-num-box .num { line-height: 1em; font-size: 16rem; color:#000000; font-weight:500; } 
.countUp .count-num-box .num.white { color: #fff; } 
.countUp .count-num-item-wrap { height:5.33em; overflow:hidden; } 
.countUp .count-num-item-wrap .count-num-item-box { height:53.5em; } 
.countUp .count-num-item-wrap .count-num-item-box .count-num-item { line-height: 1em; font-size: 4.815em; font-weight: 800; letter-spacing: -0.03em; } 
.countUp .txt { font-size: 1.7rem; font-weight: 500; letter-spacing: -0.02em; color: #000; line-height: 1.64; padding-bottom: 2rem; } 
.countUp .plus { position:relative; top: -10px; font-size: 4.815em; font-weight: 700; line-height: 1; } 
/* active */
.active .count-num-item-box { animation:count-up-ani 4s forwards; } 
.active .count-num-item-box.down { animation:count-down-ani 4s forwards; } 
@keyframes count-up-ani { 
 0% { transform: translate3d(0, 0, 0); } 
 100% { transform: translate3d(0, -90%, 0); } 
 }
@keyframes count-down-ani { 
 0% { transform: translate3d(0, -90%, 0); } 
 100% { transform: translate3d(0, 0, 0); } 
 }

/*메인 텍스트 슬라이드*/
.marqueeAni { animation-name: marqueeAni; animation-duration: 30s; animation-timing-function:linear; animation-iteration-count: infinite } 
@keyframes marqueeAni { 
 0% { transform:translateX(0); } 
100% { transform:translateX(-50%); } 
 }
.marqueeAni.sp1 { animation-duration: 40s; } 
.page_mq { overflow:hidden; } 
.page_mq .mqTT { display:flex; flex-shrink:0; white-space:nowrap; text-transform: uppercase; } 
.page_mq .mqTT.bod { border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; } 
.page_mq .mqTT.c1 { color: #f8f8f8; } 
.page_mq .mqTT.c2 { } 
.page_mq .mqTT > * { margin:0 .375em; } 
.page_mq .mqTT.sp1 > * { margin: 0 .15em; } 
.page_mq .mqTT .name { margin: 0 .375em 0 0; } 
.page_mq .mv_tit { } 
.page_mq .mv_tit .tit { font-weight: 900; } 
.page_mq .mv_tit .tit.fs1 { font-size: 7.45em; } 
.page_mq .mv_tit .tit.fs2 { font-size: 20em; } 

/* sub */
.page_con { padding: 6em 0; } 
.page_con.p1 { padding: 0em 0 6em; } 
.page_con.bg { background: #f4f4f4; background } 

.page_tit { margin-bottom: 2em; } 
.page_tit .tit1 { text-align: center; font-size: 2em; font-weight: 700; line-height: 1.8em; } 
.page_tit .tit2 { text-align: center; font-size: 1.5em; line-height: 1.6; text-transform: uppercase; font-weight: 600; } 

.page_tt { font-size: 1em; word-break: keep-all; line-height: 1.6; } 
.page_tt > .tt + .tt { margin-top: 1.5em; } 
.page_tt.o1 { opacity: .75; } 
.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.625em } 
.page_tt.s8 { font-size: 1.875em } 
.page_tt.s9 { font-size: 2.00em; } 
.page_tt.s10 { font-size: 2.65em; } 
.page_tt.s11 { font-size: 3em; } 
.page_tt.s12 { font-size: 4.000em; } 
.page_tt.s13 { font-size: 6.500em; } 

.page_tt.w400 { font-weight: 400; } 
.page_tt.w500 { font-weight: 500; } 
.page_tt.w600 { font-weight: 600; } 
.page_tt.w700 { font-weight: 700; } 
.page_tt.w800 { font-weight: 800; } 

/*메인 제품*/
.prodSlide_wrap { padding-top: var(--headH); width: 100%; } 
.main_prod { position: relative; } 
.main_prod .move_titW { position: absolute; top: 50%; transform: translateY(-50%); } 
.main_prod .prodSlide { position:relative; height: 100vh; display: flex; align-items: start; /* padding-top: 6em; */ } 
.main_prod .prodSlide .el { } 
.main_prod .prodSlide .el .prodContainer { position:relative; height: 100vh; display: flex; align-items: center; gap: 6em; margin: 2em auto 0; transform: translateY(6em); opacity: 0; width: 1460px; max-width: 94%; margin: 0 auto; transition: 1s; } 
.main_prod .prodSlide .el .prodContainer .prodImg { width: 42rem; min-width: 36rem; height: 36rem; border-radius: 50%; border: 4px solid var(--siteC); box-shadow: 4px 8px 12px rgb(255 98 98 / 5%); overflow: hidden; } 
.main_prod .prodSlide .el .prodContainer .prodImg > img { width: 100%; height: 100%; object-fit: cover; } 
.main_prod .prodSlide .el .prodContainer .info { position:relative; width: 100%; } 
.main_prod .prodSlide .el .prodContainer .info .titW { overflow: hidden; line-height: 1; } 
.main_prod .prodSlide .el .prodContainer .info .tit { font-size: 3.15em; line-height: 1; font-weight: 800; margin-bottom: .75em; } 
.main_prod .prodSlide .el .prodContainer .info .txt { font-size: 1.615em; line-height: 1.4; font-weight: normal; word-break: keep-all; color: #555; } 

.main_prod .prodSlide .el.prodAni .prodContainer .prodImg { transform: translateY(5em); opacity: 0; transition: 1s; } 
.main_prod .prodSlide .el.prodAni .prodContainer .info .tit { transform: translateY(150%); transition: 1s; } 
.main_prod .prodSlide .el.prodAni .prodContainer .info .Pbtn { opacity: 0; transition: .3s; } 

.main_prod .prodSlide { position: relative; } 
.main_prod .prodSlide .prod_control { } 
.main_prod .prodSlide .prod_control .paging { position: absolute; width: 50%; height: 3.5em; box-sizing: border-box; top: 10em; left: 47%; display: flex; gap: .75em; transform: translateX(8em); opacity: 0; transition: 1s; } 
.main_prod .prodSlide .prod_control .paging .swiper-pagination-bullet { margin: 0; width: auto; height: auto; border-radius: none; opacity: 1; background: none; } 
.main_prod .prodSlide .prod_control .Pbtn { display: flex; justify-content: center; align-items: center; height: 3.5em; border-radius: 100px; width: max-content; padding: 0 1.3em; font-size: 1.063em; font-weight: 700; box-sizing: border-box; text-align: center; transition: .3s; } 
.main_prod .prodSlide .prod_control .paging .swiper-pagination-bullet-active .Pbtn { background: var(--crBlack); color: #fff; } 

.main_prod .prodSlide .el.prodAni.swiper-slide-active .prodContainer .info .tit { transform: translateY(0); } 
.main_prod .prodSlide .el.prodAni.swiper-slide-active .prodContainer .info .Pbtn { opacity: 1; } 
.main_prod .prodSlide .el.prodAni.swiper-slide-active .prodContainer .prodImg { transform: translateY(0); opacity: 1; /* margin-left: 6em; */ } 

.main_prod.active .prodSlide .prod_control .paging { transform: translateX(0); opacity: 1; } 
.main_prod.active .prodSlide .el .prodContainer { transform: translateY(0); opacity: 1; } 

/*메인 컴퍼니*/
.main_company .vod_wrap:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .25); content: ''; z-index: 1; } 
.ComWrap { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; } 
.ComWrap .Circle_wrap { width: 90%; margin: 0 auto; padding: 4em 4.5em; box-sizing: border-box; background: rgba(255,255,255, .1); backdrop-filter: blur(20px); border-radius: 500px; } 
.ComWrap .Circle_wrap .Cir_list { display: flex; gap: 2em; } 
.ComWrap .Circle_wrap .Cir_list > li { flex: 1; } 
.ComWrap .Circle_wrap .Cir_list > li > .con { text-align: center; color: #fff; } 
.ComWrap .Circle_wrap .Cir_list > li > .con > .icon { display: flex; align-items: center; justify-content: center; margin-bottom: 1.5em; } 
.ComWrap .Circle_wrap .Cir_list > li > .con > .icon > img { width: 100%; height: 75px; object-fit: contain; filter: var(--crWhitefil); } 
.ComWrap .Circle_wrap .Cir_list > li > .con > .txtT { font-size: 1.063em; color: #fff; margin-bottom: .75em; font-weight: 600; } 
.ComWrap .Circle_wrap .Cir_list > li > .con > .tit { font-size: 4.515em; font-weight: 800; line-height: 1; } 
.ComWrap .Circle_wrap .Cir_list > li > .con > .txt { margin-top: .5em; font-size: 1.063em; font-weight: normal; color: rgba(255,255,255, .8); } 


/*메인 notice*/
.main_notice .notice_wrap { display: flex; align-items: start; } 
.main_notice .notice_wrap .imgWrap { width: 34%; height: 63.5vh; border-radius: 0em; border-top-right-radius: 25em; border-bottom-right-radius: 25em; overflow: hidden; } 
.main_notice .notice_wrap .imgWrap > img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.2); transition: all 4s; } 
.main_notice.active .notice_wrap .imgWrap > img { transform: scale(1); } 
.main_notice .infoWrap { width:66%; padding-left:120px; } 
.main_notice .infoWrap .news_wrap li:first-child a { border-top:4px solid #111; } 
.main_notice .infoWrap .news_wrap li a { padding:41px 40px 41px 120px; position:relative; display:flex; justify-content:space-between; align-items:center; position:relative; border-bottom:4px solid rgb(0,0,0,.1); } 
.main_notice .infoWrap .news_wrap li a::after { content:''; width:0; height:4px; background-color: var(--siteC); position:absolute; right:0; bottom:-4px; transition:all .3s; } 
.main_notice .infoWrap .news_wrap li a:hover::after { width:100%; left:0; } 
.main_notice .infoWrap .news_wrap li a .news_number { position:absolute; left:40px; top: 50%; transform: translateY(-50%); } 
.main_notice .infoWrap .news_wrap li a .news_number { text-align:center; } 
.main_notice .infoWrap .news_wrap li a .news_number h4 { font-size:34px; } 
.main_notice .infoWrap .news_wrap li a .news_number p { font-size:16px; font-weight:bold; } 
.main_notice .infoWrap .news_wrap li a .news_cont { width:100%; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; } 
.main_notice .infoWrap .news_wrap li a .news_cont h5 { font-size:16px; margin-bottom:10px; margin-top: 0; } 
.main_notice .infoWrap .news_wrap li a .news_cont p { font-size:20px; font-weight:500; width: 95%; } 
.main_notice .infoWrap .news_wrap li a .news_arrow > .xi { font-size: 1.815em; transition:all .3s; } 
.main_notice .infoWrap .news_wrap li a:hover .news_arrow > .xi { transform:rotate(-45deg); } 
.main_notice .infoWrap .news_wrap li a:hover .news_cont p { text-decoration: underline; } 

/*메인 하단*/
.footerB_wrap { display: flex; gap: 3em; margin-top: 12em; margin-bottom: 4em; } 
.footerB_wrap .con { flex: 1; } 
.footerB_wrap .con > .inner { width: 100%; display: block; padding: 3em; box-sizing: border-box; color: #fff; border-radius: 1em; } 
.footerB_wrap .con > .inner > .tit { font-size: 32px; font-weight: 700; margin-bottom: 10px; } 
.footerB_wrap .con > .inner > .txt { font-size: 1.063em; font-weight: normal; margin-bottom: 28px; } 
.footerB_wrap .con > .inner > .iconW { display: flex; align-items: center; justify-content: space-between; } 
.footerB_wrap .con > .inner > .iconW > .icon { } 
.footerB_wrap .con > .inner > .iconW > .icon > img { width: 100%; height: 60px; object-fit: contain; filter: brightness(0) invert(.95); opacity: .9; } 
.footerB_wrap .con > .inner > .iconW > .arrow { } 
.footerB_wrap .con > .inner > .iconW > .arrow > .xi { font-size: 2em; transition: .5s; } 

.footerB_wrap .con > .inner:hover .iconW > .arrow > .xi { transform: translateX(.35em); } 

.footerB_wrap .con > .inner.cBox { background: #b90711; } 

/*문의*/
.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) { min-height:4.5em; } 
.form_wrap .form > li .inp_wrap .input_st.hauto:not(textarea) { height: 100%; } 
.form_wrap .form > li .inp_wrap .input_st.hauto .form_label_wrap { padding: 1em 0; } 
.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_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; } 

/*인증서*/
.page_certificate { } 
.page_certificate .list { gap: 6em 2em; } 
.page_certificate .list > li { position: relative; flex: 0 0 calc(25% - 1.5em); min-width: 250px; box-sizing: border-box; cursor: pointer; } 
.page_certificate .list > li .img-area { position: relative; padding: 2.5em; background: #f8f8f8; border: 3px solid transparent; transition: 0.3s; } 
.page_certificate .list > li .xi { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 2.5em; height: 2.5em; border: 3px solid var(--siteC); border-radius: 50%; color: #fff; background: var(--siteC); opacity: 0; visibility: hidden; transition: 0.3s; } 
.page_certificate .list > li:hover .xi { opacity: 1; visibility: visible; } 
.page_certificate .list > li:hover .img-area { border-color: var(--siteC); } 
.page_certificate .list > li .img-area .imgfix { box-shadow: 0 0 30px rgba(0, 0, 0, .075); width: 240px; height: 340px; aspect-ratio: 2/3; } 
.page_certificate .list > li .txt { margin-top: 1.5em; text-align: center; } 
.page_certificate .list > li .txt > p { font-size: 1.125rem; } 
.page_certificate .list > li .txt > span { display: inline-block; font-size: 1rem; color: var(--crGray3); margin-top: 10px; } 

/*제품 뷰페이지*/
.agency-view-container { padding-top: var(--headH); } 
.agency-view-top { gap: 5em; } 
.agency-view-top .view-img { flex: 0 0 50%; position: relative; } 
.agency-view-top .view-img .img-wrap { position: relative; } 
.agency-view-top .view-img .img-wrap .imgfix { border-radius: 10px; overflow: hidden; box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); height: 540px; aspect-ratio: 1/1; } 
.agency-view-top .view-img .img-wrap .imgfix > img { width: 100%; height: 100%; object-fit: contain; } 
.agency-view-top .view-img .img-wrap .change-btn { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; } 
.agency-view-top .view-img .img-wrap .change-btn .prev,
.agency-view-top .view-img .img-wrap .change-btn .next { align-items: center; justify-content: center; background: var(--crWhite); border: 1px solid #eee; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 50%; width: 3em; height: 3em; cursor: pointer; transition: 0.3s; } 
.agency-view-top .view-img .img-wrap .change-btn .prev:hover,
.agency-view-top .view-img .img-wrap .change-btn .next:hover { background: var(--siteC); border-color: var(--siteC); color: var(--crWhite); } 
.agency-view-top .view-img .img-wrap .change-btn .prev { margin-left: -1.5em; } 
.agency-view-top .view-img .img-wrap .change-btn .next { margin-right: -1.5em; } 
.agency-view-top .view-img .img-thumbs { position: relative; } 
.agency-view-top .view-img .img-thumbs .list { gap: .5em; margin-top: 1em; } 
.agency-view-top .view-img .img-thumbs .list > li { } 
.agency-view-top .view-img .img-thumbs .list > li .imgfix { width: 100px; height: 100px; border: 1px solid #eee; border-radius: 10px; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); cursor: pointer; position: relative; } 
.agency-view-top .view-img .img-thumbs .list > li .imgfix > img { width: 100%; height: 100%; object-fit: contain; } 
.agency-view-top .view-img .img-thumbs .list > li.on .imgfix { border-color: var(--siteC); border-width: 2px; } 
.agency-view-top .view-img .img-thumbs .list > li .imgfix::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 1; } 
.agency-view-top .view-img .img-thumbs .list > li.on .imgfix::before { background: transparent; } 

.agency-view-top .page_txt { flex: 1 1 50%; padding-top: 3em; } 
.agency-view-top .page_txt .s6 { margin-bottom: .25em; } 
.agency-view-top .page_txt .s11 { line-height: 1.2; margin-bottom: .5em; } 

.agency-view-top .view-img .img-thumbs .list > li.on .imgfix { } 

.agency-view-top .info-list { } 
.agency-view-top .info-list > li { margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid #ddd; } 
.agency-view-top .info-list > li:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } 
.agency-view-top .info-list > li > dl { } 
.agency-view-top .info-list > li > dl > dt { } 
.agency-view-top .info-list > li > dl > dd { } 
.agency-view-middle { } 
.agency-view-middle .spec-ico-list { width: 80%; margin: 0 auto; } 
.agency-view-middle .spec-ico-list > li { flex: 1; position: relative; } 
.agency-view-middle .spec-ico-list > li .icon { position: relative; } 
.agency-view-middle .spec-ico-list > li .icon::after { content: ''; position: absolute; top: 50%; right: -30%; transform: translateY(-50%); width: 50%; height: 1px; background: var(--crBlack); border-radius: 10px; } 
.agency-view-middle .spec-ico-list > li:last-child .icon::after { display: none; } 
.agency-view-middle .spec-ico-list > li .icon .imgfix { width: 8rem; height: 8rem; margin: 0 auto; border-radius: 50%; background: var(--siteC); padding: 1.5em; box-sizing: border-box; } 
.agency-view-bottom .title.st2 { padding-bottom: 0.5em; border-bottom: 3px solid #ddd; } 
.agency-view-bottom .spec-info { gap: 2em 1em; } 
.agency-view-bottom .spec-info > li { flex: 0 0 calc(25% - .75em); max-width: calc(25%); border: 2px solid transparent; border-radius: 1em; background-image: linear-gradient(#fff, #fff), var(--crGrad1); background-origin: border-box; background-clip: content-box, border-box; box-shadow: 0 0 30px rgba(0, 0, 0, 0.05), inset 0 0 20px rgb(0 114 255 / 5%); } 
.agency-view-bottom .spec-info > li .in { padding: 2em 1.5em; position: relative; } 
.agency-view-bottom .spec-info > li .in .num { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); background: var(--siteC); border-radius: 50%; width: 2.125rem; height: 2.125rem; } 

.lineBox { padding: 2.5em; box-sizing: border-box; border: 1px solid #ddd; border-radius: 1em; text-align: center; } 


/*제품*/
.mall_list_top { padding:0 0 2.5em 0 } 
.mall_list_top .tit_wrap { padding:1em 0; border-bottom:1px solid #222 } 
.mall_list_top .tit_wrap .tit { font-size:2.25em; font-weight:700 } 
.mall_list_top .tit_wrap .sub_nav_st { margin-left:auto } 
.mall_list_top .gnb_wrap { position:relative } 
.mall_list_top .gnb_wrap:before { content:""; position:absolute; right:0; bottom:0; width:100%; height:1px; background:#eee } 
.mall_list_top .gnb_wrap:after { content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:#fff } 
.mall_list_top .gnb_wrap .gnb > li.on { display:flex; flex-wrap:wrap; width:100%; } 
.mall_list_top .gnb_wrap .all { width:14.28%; position:absolute; left:0; top:0 } 
.mall_list_top .gnb_wrap .gnb > li .dp2 { flex-wrap:wrap } 
.mall_list_top .gnb_wrap .gnb > li .dp2 > li { width:14.28% } 
.mall_list_top .gnb_wrap .gnb > li .dp2 > li:first-child { margin-left:14.28% } 
.mall_list_top .gnb_wrap a { padding:.5em 1.5em; height:4em; border-bottom:1px solid #eee; box-sizing:border-box; display:flex; align-items:center; font-weight:300; color:#666; position:relative } 
.mall_list_top .gnb_wrap a:after { content:""; position:absolute; right:-1px; top:0; width:1px; height:100%; background:#eee } 
.mall_list_top .gnb_wrap a.dp1 { font-weight:500; color:#111 } 
.mall_list_top .gnb_wrap .all.on,
.mall_list_top .gnb_wrap .dp2 > li.on a { font-weight:500; color:#111 } 
.mall_list_top .gnb_wrap a .va:after { content:"\e942"; font-family:xeicon; margin:0 .5em; vertical-align:middle } 
.mall_list_top .gnb_wrap a .va { font-size:1.063em } 

.mall_list_total { padding:0 0 1em 0 } 
.mall_list_total .total .t1 { font-size: 1.063em; font-family: var(--fontEng); font-weight: 500; } 
.mall_list_total .total .t2 { font-size:1.5em; font-weight:900; margin-left:.25em } 
.mall_list_total .etc { margin-left:auto } 

.sub_nav_st { display: flex; align-items: center; } 
.sub_nav_st > li.home { color: var(--siteC); } 
.sub_nav_st > li { text-transform: uppercase; color: #777; display: flex; align-items: center; } 
.sub_nav_st > li:before { content: "\e940"; font-family: xeicon; margin: 0 .5em; } 
.sub_nav_st > li:first-of-type:before { display: none; } 


/*제품소개*/
.proTabW { position: relative; } 
.pro-tab { display: flex; align-items: center; gap: 1em; } 
.pro-tab > li { } 
.pro-tab > li > .tabT { padding: .2em 1em; font-size: 1.215em; font-weight: 600; border: 1px solid #ddd; border-radius: 100px; font-family: var(--fontEng); color: #999; cursor: pointer; transition: .2s; } 

.pro-tab > li.on > .tabT { background: var(--siteC); border: 1px solid var(--siteC); color: #fff; } 

.ProWarp { } 
.ProWarp .proTop { margin-top: 3em; padding-bottom: 1em; margin-bottom: 2em; border-bottom: 1px solid #111; } 
.ProWarp .proTop > .con { display: flex; align-items: center; gap: 2em; justify-content: space-between; } 
.ProWarp .proTop > .con > .tabT { display: flex; align-items: start; gap: .5em; } 
.ProWarp .proTop > .con > .tabT > .tit { font-size: 2.515em; font-weight: 700; font-family: var(--fontEng); } 
.ProWarp .proTop > .con > .tabT > .total { font-size: 15px; line-height: 1; display: inline-block; background-color: #171717; color: #fff; padding: 0.45em 1em; border-radius: 50px; letter-spacing: 0; font-weight: 400; vertical-align: 3px; } 

.ProWarp .proList_con { } 
.ProWarp .proList_con .proList { } 
.ProWarp .proList_con .proList > li { } 
.ProWarp .proList_con .proList > li > .in { margin: 0 0 2em 2em; } 
.ProWarp .proList_con .proList > li > .in > .prod-img { position:relative; padding: 3em 0; box-sizing: border-box; border: 1px solid #ddd; border-radius: 1em; overflow: hidden; } 
.ProWarp .proList_con .proList > li > .in > .prod-img .imgfix { height: 180px; } 
.ProWarp .proList_con .proList > li > .in > .prod-img .imgfix > img { width: 100%; height: 100%; object-fit: contain; transition: .3s; } 

.ProWarp .proList_con .proList > li > .in > .proinfo { margin-top: 1em; padding: 0 .5em; } 
.ProWarp .proList_con .proList > li > .in > .proinfo > .title { font-size: 1.415em; font-weight: 700; margin-bottom: .5em; } 
.ProWarp .proList_con .proList > li > .in > .proinfo > .type { font-size: .95em; color: #666; font-weight: 500; } 

.ProWarp .proList_con .proList > li > .in:hover > .prod-img { } 
.ProWarp .proList_con .proList > li > .in:hover > .prod-img .imgfix > img { transform: scale(1.05); } 
.ProWarp .proList_con .proList > li > .in:hover > .proinfo > .title { text-decoration: underline; } 

.tag_list { position: absolute; display: flex; gap: .5em; top: 1em; left: 1em; z-index: 1; } 
.tag_list > li { } 
.tag_list > li > .tt { padding: .3em 1.15em; border-radius: 100px; border: 1px solid transparent; font-size: .95em; font-weight: 500; } 
.tag_list > li > .ty1 { background: var(--siteC); color: #fff; border: 1px solid var(--siteC); } 
.tag_list > li > .ty2 { background: var(--siteC2); color: #fff; border: 1px solid var(--siteC2); } 

/*브랜드 검색 탭*/

.brand_tab { padding-bottom: 4em; } 
.brand_tab.pb2 { padding-bottom: 2em; } 
.brand_tab .brand_list { } 
.brand_tab .brand_list > li { } 
.brand_tab .brand_list > li > .in { margin: 0em; border: 1px solid #ddd; padding: .5em 1.25em; height: 3.5em; display: flex; align-items: center; box-sizing: border-box; background: rgba(0, 0, 0, .8); color: #fff; } 
.brand_tab .brand_list > li > .in > .tab_In { display: flex; gap: .5em; justify-content: space-between; width: 100%; align-items: center; } 
.brand_tab .brand_list > li > .in > .tab_In > .tt { font-size: 1.063em; font-weight: 600; font-family: var(--fontEng); } 

.brand_tab .brand_list > li.on > .in { background: var(--siteC); } 


.dp1_product #contents .menu_wrap .gnb > li { width: 100%; } 
.dp1_product #contents .menu_wrap .dp2 { display: flex; flex-wrap: wrap; padding-bottom: 2em; } 
.dp1_product #contents .menu_wrap .dp2 > li { flex: 1 1 20%; max-width: 20%; } 
.dp1_product #contents .menu_wrap .dp2 > li > .va_wrap { margin: 0em; border: 1px solid #ddd; padding: .5em 1.25em; height: 3.5em; display: flex; align-items: center; box-sizing: border-box; background: rgba(0, 0, 0, .8); color: #fff; } 
.dp1_product #contents .menu_wrap .dp2 > li > .va_wrap > .va { display: flex; gap: .5em; justify-content: space-between; width: 100%; align-items: center; } 
.dp1_product #contents .menu_wrap .dp2 > li > .va_wrap > .va > .tt { font-size: 1.063em; font-weight: 600; font-family: var(--fontEng); } 
.dp1_product #contents .menu_wrap .dp2 > li > .va_wrap > .va > .arrow { } 
.dp1_product #contents .menu_wrap .dp2 > li > .va_wrap > .va > .arrow:before { content: '\e919'; } 
.dp1_product #contents .menu_wrap .dp2 > li.on .va_wrap { background: var(--siteC); } 


/*제품 검색*/
.pro_searchWarp { display: flex; gap: .5em; } 
.pro_searchWarp > .divi { } 
.pro_searchWarp > .divi label { position: relative; } 
.pro_searchWarp > .divi label > .xi { position: absolute; right: 1.25em; top: 50%; transform: translateY(-50%); color: #fff; font-size: 1em; } 
.pro_searchWarp > .divi .input_st { position:relative; border-radius: 100px; padding: .3em 1.25em; background: #171717; border: 1px solid #171717; color: #fff; } 
.pro_searchWarp .input_st { height: 3em; } 
.pro_search { position: relative; border-radius: 50px; border: 1px solid #ddd; font-size: 1em; /* overflow: hidden; */padding: 0 0.5em 0 1.5em; } 
.pro_search:has(input:focus) { border-color: #171717; } 
.pro_search > input { height: auto; border: none; padding: 0.5em 0; width: 15em; } 
.pro_search > input:focus { } 
.pro_search > button { flex: 1; border: none; background: transparent; } 
.pro_search > button .xi { font-size: 1.5rem; } 

/* History */
.history-bg { height: 500px; border-radius: 1em; overflow: hidden; } 
.history-con { padding: 5rem 0; } 
.history-list { } 
.history-list > li { padding-bottom: 8rem; position: relative; } 
.history-list > li:last-of-type { padding-bottom: 0em; } 
.history-list > li::before { content: ''; position: absolute; top: 36px; left: 0; right: 0; margin: auto; width: 1px; height: calc(100% - 2.5rem); background: #ddd; } 
.history-list > li:last-child:before { display: none; } 
.history-list > li > dl { flex-direction: column; padding-left: calc(50% + 60px); } 
.history-list > li:nth-child(odd) > dl { /* flex */padding-left: 0; padding-right: calc(50% + 60px); text-align: right; } 
.history-list > li > dl > dt::before { content: ''; position: absolute; top: 0; right: -5px; bottom: 0; margin: auto; width: 10px; height: 10px; background: #ddd; border-radius: 50%; transition: 0.3s; } 
.history-list > li.active > dl > dt::before { box-shadow: 0 0 0 5px rgba(212, 228, 255, 1); background: var(--siteC); } 
.history-list > li:nth-child(odd) > dl > dt::before { right: auto; left: -5px; } 
.history-list > li > dl > dt { position: absolute; top: -12px; right: 50%; padding-right: 60px; padding-left: 0; font-weight: 700; } 
.history-list > li:nth-child(odd) > dl > dt { left: 50%; right: auto; padding-left: 60px; padding-right: 0; } 
.history-list > li > dl > dd { position: relative; margin-bottom: 0.5em; padding-left: 1em; font-size: 1.125rem; color: #666; } 
.history-list > li:nth-child(odd) > dl > dd { margin-left: auto; } 
.history-list > li > dl > dd > p { } 

/*인사말*/
.greeting_wrap { display: flex; overflow: hidden; } 
.greeting_wrap > .left { width: 37.5%; } 
.greeting_wrap > .left > .img_con { width: 100%; height: 100%; } 
.greeting_wrap > .left > .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.greeting_wrap > .right { flex: 1; margin-left: 6em; } 
.greeting_wrap > .right > .tit { font-size: 2.615em; word-break: keep-all; font-weight: 700; letter-spacing: -0.01em; line-height: 1.3; margin-bottom: .6em; } 
.greeting_wrap > .right > .sub_tit { font-size: 1.515em; font-weight: 700; margin-bottom: 2.5em; } 
.greeting_wrap > .right > .desc { } 
.greeting_wrap > .right > .desc > .tt { font-size: 1.063em; line-height: 1.6; margin-bottom: 1.6em; word-break: keep-all; } 
.greeting_wrap > .right > .desc > .tt:last-of-type { margin-bottom: 0em; } 
.greeting_wrap > .right > .desc > .ceo { font-size: 1.315em; font-weight: 700; align-items: baseline; gap: .5em; } 
.greeting_wrap > .right > .desc > .ceo > .name { font-size: 1.515em; font-weight: 700; } 

/*회사 개요*/
.overview-wrapper { } 
.overview-wrapper .overview-img { position:relative; width: 100%; height: 80vh; } 
.overview-wrapper .overview-img:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .25); content: ''; } 
.overview-wrapper .overview-img > img { width: 100%; height: 100%; object-fit: cover; } 
.overview-wrapper .overview-img .filTit { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: rgba(255,255,255, .8); width: 100%; text-align: center; } 
.overview-wrapper .overview-img .filTit > .tit { font-size: 7em; font-weight: 800; line-height: 1; } 
.overview-wrapper .overview-img .filTit > .txt { font-size: 1.815em; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; opacity: 0; transition: 1s; } 
.overview-wrapper .overview-img .filTit > .txt.on { letter-spacing: unset; opacity: 1; } 
.overview-wrapper .overview_txt { padding: 4.5em 0 8em 0; text-align: center; } 
.overview-wrapper .overview_txt .tit { font-size: 2.15em; font-weight: 700; margin-bottom: .5em; } 
.overview-wrapper .overview_txt .txt { font-size: 1.515em; line-height: 1.6; color: #444; } 

.overviewList { display: flex; flex-wrap: wrap; margin: -1rem; } 
.overviewList > li { position: relative; display: flex; flex-direction: column; justify-content: space-between; width: calc(33.33% - 2rem); margin: 1rem; height: 25rem; background: #fff; border-radius: 1rem; padding: 3.5rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; transition: .3s; } 
.overviewList > li > .info-top { position: relative; display: flex; justify-content: space-between; } 
.overviewList > li > .info-top > .xi { font-size: 3.15em; } 
.overviewList > li > .info-bottom { position:relative; } 
.overviewList > li > .info-bottom .tit { display: flex; align-items: baseline; gap: .3em; } 
.overviewList > li > .info-bottom .tit > .txt { font-size: 1.215em; font-weight: 700; } 
.overviewList > li > .info-bottom .tit > .tt { font-size: 4em; font-weight: 800; } 
.overviewList > li > .info-bottom .tit > .tt.s1 { font-size: 2em; } 
.overviewList > li > .info-bottom .tit > .tt.s2 { font-size: 3em; } 
.overviewList > li > .info-bottom .sub_tit { font-size: 1.315em; line-height: 2; letter-spacing: -0.02em; color: var(--siteC); font-weight: 700; margin-bottom: 1rem; transition: .3s; } 
.overviewList > li:hover { background: var(--siteC); color: #fff; } 
.overviewList > li:hover .info-bottom .sub_tit { color: #fff; } 

/*조직도*/
.organization_img { text-align: center; margin: 0 auto; } 

/*오시는길*/
.location_Bg .map_con { margin-bottom: 6em; } 
.location_Bg .map_con:last-of-type { margin-bottom: 0em; } 
.map_wrap { width: 100%; } 
.map_wrap > .root_daum_roughmap { border-radius: 1em; overflow: hidden; } 
.map_wrap iframe { width: 100%; border-radius: 1em; overflow: hidden; } 
.root_daum_roughmap .cont .section_address,
.root_daum_roughmap .wrap_controllers { display: none; } 

.location_info { margin-top: 2.5em; } 
.location_info > .con { display: flex; gap: 3em; background: #f7f7f7; padding: 64px; border-radius: 16px; border: 1px solid #ddd; } 
.location_info > .con > .office { width: 13em; } 
.location_info > .con > .office > .tt { font-size: 1.515em; font-weight: 700; } 
.location_info > .con > .address { width: 60%; } 
.location_info > .con > .address > h3 { font-size: 23px; font-weight: 500; } 
.location_info > .con > .address > .add_info { display: flex; gap: 2em; align-items: center; margin-top: 1.5em; } 
.location_info > .con > .address > .add_info > li { } 
.location_info > .con > .address > .add_info > li > .call_con { display: flex; align-items: center; gap: .5em; } 
.location_info > .con > .address > .add_info > li > .call_con > .xi { font-size: 1.75em; color: #444; } 
.location_info > .con > .address > .add_info > li > .call_con > .tt { font-size: 1.215em; color: #444; } 

.location_info > .con > .map_view { width: 8em; display: flex; align-items: center; justify-content: center; flex-direction: column; transition :.2s; } 
.location_info > .con > .map_view > .xi { font-size: 2.15em; } 
.location_info > .con > .map_view > .mapViewT { font-size: 1.063em; font-weight: 500; margin-top: .35em; } 

.location_info > .con > .map_view:hover { color: var(--siteC); } 

/*조직도*/
.department-info { position: relative; padding: 0px 0 0px; text-align: center; } 
.department-info .department-top { position: relative; margin-bottom: 70px; } 
.department-info .department-top::before { position: absolute; content: ''; width: 1px; height: 70px; border-left: 1px solid #ccc; left: 50%; transform: translateX(-50%); bottom: -70px; } 
.department-info .department-top::after { position: absolute; content: ''; width: 7px; height: 7px; background: #2E3639; border-radius: 50%; border: 3px solid #fff; left: 50%; transform: translateX(-50%); bottom: -74px; z-index: 1; } 
.department-info .department-tit { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 200px; height: 200px; border-radius: 50%; background: var(--siteC); box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.15); margin: 0 auto; } 
.department-info .department-tit::before { position: absolute; content: ''; width: 240px; height: 240px; border-radius: 50%; border: 1px solid var(--siteC); top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.department-info .department-middle { position:relative; } 
.department-info .department-middle::after { position: absolute; content: ''; width: 7px; height: 7px; background: #2E3639; border-radius: 50%; border: 3px solid #fff; left: 50%; transform: translateX(-50%); bottom: -126px; z-index: 1; } 
.department-info .department-middle::before { position: absolute; content: ''; width: 1px; height: 150px; border-left: 1px solid #ccc; left: 50%; transform: translateX(-50%); bottom: -120px; } 
.department-info .department-middle .department-tit::before { display: none; } 
.department-info .department-middle .department-tit .tit { font-size: 22px; } 
.department-info .department-side { position: absolute; width: 10em; left: 65%; bottom: -4em; padding: 22px; display: block; font-size: 18px; font-weight: 700; line-height: 1.6; background: #fff; border: 2px solid var(--siteC); color: var(--siteC); } 
.department-info .department-side:before { position: absolute; height: 1px; width: 222px; right: 100%; background: #ccc; top: 50%; transform: translateY(-50%); content: ''; } 
.department-info .department-tit .s-tit { color: #fff; font-weight: 400; font-size: 16px; } 
.department-info .department-tit .tit { color: #FFF; font-size: 26px; font-weight: 700; } 
.department-info .department-tit .name { color: #fff; font-size: 18px; font-weight: 600; } 
.department-info .department-list { position: relative; display: flex; gap: 4.4%; margin: 0 auto; padding: 170px 0 0; text-align: left; } 
.department-info .department-list::before { position: absolute; content: ''; width: 52%; height: 54px; border: 1px solid #ccc; border-bottom: 0; top: 120px; left: 50%; transform: translateX(-50%); } 
.department-info .department-list .item { width: calc(50% - 2.2%); background: #fff; box-shadow: 0px 5px 12px 0px rgba(0, 0, 0, 0.10); border: 1px solid #999; border-top: 0; } 
.department-info .department-list .item .charge { position: relative; display: block; padding: 22px; text-align: center; color: #FFF; font-size: 18px; font-weight: 700; line-height: 1.6; } 
.department-info .department-list .item .charge::before { position: absolute; content: ''; width: 7px; height: 7px; background: #2E3639; border-radius: 50%; border: 3px solid #fff; left: 50%; transform: translateX(-50%); top: -7px; z-index: 1; } 
.department-info .department-list .item .charge.color1 { background: var(--siteC); } 
.department-info .department-list .item .charge.color2 { background: #2C354E; } 
.department-info .department-list .item .work-box { padding: 40px 48px 48px; } 
.department-info .department-list .item .work-box .tit-top { display: flex; justify-content: space-between; align-items: center; padding: 0 0 16px; margin: 0 0 26px; border-bottom: 1px solid #000; } 
.department-info .department-list .item .work-box .tit-top .tit { color: #000; font-weight: 700; font-size: 20px; } 
.department-info .department-list .item .work-box .tit-top .call-list { display: flex; gap: 30px; } 
.department-info .department-list .item .work-box .tit-top .call-list .call { position: relative; padding: 0 0 0 25px; color: #444; font-size: 16px; font-weight: 600; } 
.department-info .department-list .item .work-box .tit-top .call-list .call::before { position: absolute; content: ''; display: flex; align-items: center; justify-content: center; background: #000; color: #fff; border-radius: 50%; width: 25px; height: 25px; top: 50%; transform: translateY(-50%); left: -.5em; background-repeat: no-repeat; } 
.department-info .department-list .item .work-box .tit-top .call-list .call.icon1::before { font-family: 'xeicon'; content: '\e9d3'; font-size: .85em; } 
.department-info .department-list .item .work-box .tit-top .call-list .call.icon2::before { font-family: 'xeicon'; content: '\e9bc'; font-size: .85em; } 
.department-info .department-list .item .work-box .work-list { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; } 
.department-info .department-list .item .work-box .work-list > li { position: relative; padding: 0 0 0 14px; width: calc(50% - 10px); color: #444; font-size: 16px; font-weight: 400; } 
.department-info .department-list .item .work-box .work-list > li::before { position: absolute; content: ''; width: 3px; height: 3px; border-radius: 50%; background: #666; top: 11px; left: 6px; } 
.department-info .department-list .item .work-box .info_list { gap: 1em } 
.department-info .department-list .item .work-box .info_list > li { width: calc(50% - .5em) } 
.department-info .department-list .item .work-box .info_list > li > .con { border: 1px solid #eee; } 
.department-info .department-list .item .work-box .info_list > li > .con .name { text-align: center; padding: 1em 0; background: #f7f7f7; } 
.department-info .department-list .item .work-box .info_list > li > .con .name > .tt { font-size: 1em; font-weight: 700; } 
.department-info .department-list .item .work-box .info_list > li > .con .subj { padding: .75em; text-align: center; } 
.department-info .department-list .item .work-box .info_list > li > .con .subj > .tt { font-size: .95em; color: #222; } 
.department-info .txt-check { display: inline-block; margin: 40px 0 0; max-width: 441px; } 