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

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

#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 1000; background: #fff; padding-right: var(--pagePD); } 
#header .top_wrap { position: relative } 
#header .top_wrap .wrapH,
#header .top_wrap .gnb_wrap .dp1 { height: var(--headerH); transition: height .3s } 
.headerT { padding-top: var(--headerH) } 
#header .top_wrap .wrapF { display: flex; align-items: center; gap: 0 3vw } 
#header .top_wrap .wrapF > * { position: relative; z-index: 2 } 
#header .top_wrap .logo { height: 2.5em } 
#header .top_wrap .logo > a { display: block; height: 100%; overflow: hidden } 
#header .top_wrap .logo > a .in { display: block; height: 100%; transition: .3s } 
#header .top_wrap .logo > a img { height: 100%; display: block } 
#header .top_wrap .etc_wrap { display: flex; align-items: center; gap: 2vmin } 
#header .top_wrap .etc_wrap .btnInc { width: 3em; height: 3em; display: flex; align-items: center; justify-content: center; border-radius: 1em } 
#header .top_wrap .etc_wrap .btnInc .ico { font-size: 1.75em } 
#header .top_wrap .etc_wrap .allBtn { position: relative } 
#header .top_wrap .etc_wrap .allBtn .line { width: 100%; height: 1px; position: absolute; left: 50%; top: 50%; background: #000 } 
#header .top_wrap .etc_wrap .allBtn .line.e1 { transform: translate(-50%, -.375em) } 
#header .top_wrap .etc_wrap .allBtn .line.e2 { transform: translate(-50%, .37em) } 

#headerQ { position: fixed; right: 0; top: 0; height: 100vh; z-index: 1001; display: flex; width: 100px; transition: width ease-in-out 0.5s } 
#headerQ .all_wrap { z-index: 1 } 
#headerQ .quick_wrap { z-index: 2 } 
#headerQ .fix_wrap { z-index: 3 } 
#headerQ .quickBtn { z-index: 4 } 
#headerQ .fix_wrap { order: -1; width: 100px; height: 100%; display: flex; align-items: center; flex-direction: column; gap: 2em 0; box-sizing: border-box; background: #fff; position: relative; transition: background-color .5s; } 
#headerQ .fix_wrap:before { content: ""; position: absolute; width: 1px; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, .05) } 
#headerQ .allBtn_wrap { display: flex; align-items: center; justify-content: center; width: 100%; height: 8em; } 

#headerQ .allBtn_wrap { } 
#headerQ .allBtn_wrap .all { } 
#headerQ .allBtn_wrap .allBtn { position: relative; width: 24px; height: 24px; margin: 40px auto 0; } 
#headerQ .allBtn_wrap .allBtn .square_container { display: block; width: 100%; height: 100%; } 
#headerQ .allBtn_wrap .allBtn .square_container .square { display: block; position: absolute; width: 6px; height: 6px; background: #000; transition: all .25s ease; } 

#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(n+1):nth-child(-n+3) { top: 0; } 
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(n+4):nth-child(-n+6) { top: 9px; } 
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(n+7):nth-child(-n+9) { bottom: 0; } 
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(3n) { right: 0; } 
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(2),
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(5),
#headerQ .allBtn_wrap .allBtn .square_container .square:nth-child(7) { left: 9px; } 

#headerQ.allOn .allBtn_wrap .allBtn .square_container { z-index: 99; } 
#headerQ.allOn .allBtn_wrap .allBtn .square_container .square { background: #fff; } 
#headerQ.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(2) { top: 9px !important; } 
#headerQ.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(4) { left: 9px !important; } 
#headerQ.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(6) { right: 9px !important; } 
#headerQ.allOn .allBtn_wrap .allBtn .square_container .square:nth-child(7) { bottom: 9px !important; } 
#headerQ.allOn .all_wrap .wrap_in .gnb > li { flex-direction: column; align-items: flex-start; } 
#headerQ.allOn .all_wrap .wrap_in .gnb > li .dp1 { width: auto; } 
#headerQ.allOn .all_wrap .wrap_in .gnb > li ul { flex-wrap: wrap; } 

#headerQ .allBtn .xi { font-size: 2em } 
#headerQ .allBtn .xi:before { content: "\e91c" } 
#headerQ .allBtn > .menuT { display: flex; justify-content: center; font-size: .85em; text-transform: uppercase; font-weight: 400; padding-top: 2em; color: #fff; } 
#headerQ .all_wrap { display: flex; padding-top: var(--headHS); width: 100vw; height: 100vh; background: #fff; position: absolute; right: 0vw; top: 0; visibility: hidden; transition: .5s; } 
#headerQ .all_wrap .wrap_container { display: flex; } 
#headerQ .all_wrap .crHead { position: absolute; top: 0; left: 0; width: 100%; height: var(--headHS); background: #fff; z-index: 99; transition: .5s; } 
#headerQ .all_wrap .bg { position: relative; width: 35%; transition: .3s; } 
#headerQ .all_wrap .bg .img { margin-top: 10vh; opacity: .1; filter: brightness(0) invert(1); width: 20vw } 
#headerQ .all_wrap .bg .bgImg { position: relative; width: 100%; height: 100%; transform: translateX(5em); opacity: 0; transition: .5s; } 
#headerQ .all_wrap .bg .bgImg:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .3); content: ''; } 
#headerQ .all_wrap .bg .bgImg > img { width: 100%; height: 100%; object-fit: cover; } 
#headerQ .all_wrap .wrap_in { position: relative; justify-content: center; opacity: 0; box-sizing: border-box; width: 65%; height: 100vh; display: flex; transition: .5s; } 
#headerQ .all_wrap .wrap_in > .in { padding: 3em 6em 9em 6em; box-sizing: border-box; } 

#headerQ .all_wrap .wrap_in .all_top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2.5em; } 
#headerQ .all_wrap .wrap_in .all_header { } 
#headerQ .all_wrap .wrap_in .all_header .all_logo img { width: 12em; } 
#headerQ .all_wrap .wrap_in .all_header .close_btn { width: 4.5em; height: 4.5em; background: rgba(0, 0, 0, .2); border-radius: 50%; } 
#headerQ .all_wrap .wrap_in .all_header .close_btn .xi { font-size: 1.875em; transition: .3s; } 
#headerQ .all_wrap .wrap_in .all_header .close_btn:hover .xi { transform: rotate(180deg); } 

#headerQ .all_wrap .wrap_in .all_menu_wrap .telCon { display: flex; justify-content: end; margin-top: .75em; } 
#headerQ .all_wrap .wrap_in .all_menu_wrap .telCon > .tt { font-size: 1.125em; font-weight: 600; padding: .8em 1.5em; box-sizing: border-box; border-radius: 100px; background: var(--siteC); color: #fff; } 
#headerQ .all_wrap .wrap_in .all_menu_wrap .telCon > .tt .dataLink { vertical-align: baseline; } 

#headerQ .all_wrap .wrap_in .all_top .all_mem { gap: .5em; } 
#headerQ .all_wrap .wrap_in .all_top .all_mem .link { display: inline-flex; background: #f5f5f5; justify-content: center; align-items: center; height: 2.75em; padding: 0 2em; border: 1px solid rgba(255, 255, 255, .3); border-radius: 6em; transition: .2s; } 
#headerQ .all_wrap .wrap_in .all_top .all_mem .link .t1 { font-size: .938em; font-weight: 500; } 
#headerQ .all_wrap .wrap_in .all_top .all_mem .link:hover { background: var(--siteC); border-color: var(--siteC); color: #fff; } 

#headerQ .all_wrap .wrap_in .gnb { flex-wrap: wrap; overflow-y: auto; height: 80vh;} 
#headerQ .all_wrap .wrap_in .gnb > li { flex: 1 1 100%; align-items: center; display: flex; margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid rgba(0, 0, 0, .1); } 
#headerQ .all_wrap .wrap_in .gnb > li:first-of-type { border-top: 1px solid rgba(255, 255, 255, .2); } 
#headerQ .all_wrap .wrap_in .gnb > li:last-of-type { margin-bottom: 0em; padding-bottom: 0em; border: none; } 

#headerQ .all_wrap .wrap_in .gnb > li ul { display: flex; gap: 1em; } 
#headerQ .all_wrap .wrap_in .gnb > li a { justify-content: flex-start; text-align: left !important; padding: .5em; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp1 { width: 12em; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp1 .in { display: flex; align-items: flex-end; gap: .75em; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp1 .tt { font-size: 1.615em; font-weight: 800; } 
#headerQ .all_wrap .wrap_in .gnb > li.act { } 
#headerQ .all_wrap .wrap_in .gnb > li.act .dp1 .tt { background-position: 0 100%; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a .in { display: inline-block; position: relative; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a .in:after { content: ""; position: absolute; left: 0; bottom: -.25em; width: 100%; height: 2px; background: #fff; transform: scaleX(0); transform-origin: left bottom; transition: .2s; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a .tt { font-size: 1.063em; font-weight: 700; color: rgba(0, 0, 0, .45); transition: .1s; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li > a:hover .tt { color: var(--crBlack); } 
#headerQ .all_wrap .wrap_in .gnb > li .dp2 > li.act > a .in:after { transform: scaleX(1) } 
#headerQ .all_wrap .wrap_in .gnb > li .dp3 { display: none; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp3 > li > a { gap: 0 .75em; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp3 > li > a:before { content: ""; width: 4px; height: 2px; background: rgba(255, 255, 255, .4); } 
#headerQ .all_wrap .wrap_in .gnb > li .dp3 > li > a .tt { opacity: .7; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp3 > li.act > a .tt { text-decoration: underline; opacity: 1; } 
#headerQ .all_wrap .wrap_in .gnb > li .dp4 { display: none; } 

#header .all_wrap .all_layer .wrap_bottom { display: none; } 

#headerQ .mem_wrap .logBtn { display: flex; flex-direction: column; align-items: center; gap: .5em 0 } 
#headerQ .mem_wrap .logBtn .ico { color: var(--siteC); font-size: 1.6em } 
#headerQ .mem_wrap .logBtn .tt { writing-mode: vertical-lr; font-weight: 700; font-size: 1.063em; color: #999; word-spacing: .5em } 
#headerQ .mem_wrap .logBtn .tt .point { color: var(--siteC) } 
#headerQ .mem_wrap .logBtn .arrow { font-size: 1em; color: var(--siteC); transition: .3s } 
#headerQ .mem_wrap .logBtn:hover .arrow { transform: translateY(1em) } 
#headerQ .bottom_wrap { margin-top: auto; } 
#headerQ .bottom_wrap .link { display: block; text-align: center; position: relative; } 
#headerQ .bottom_wrap > .link::before { position: absolute; content: ""; bottom: -8px; left: 0; width: 100%; height: 1px; background: #ddd; } 
#headerQ .bottom_wrap .link:last-child:before { display: none; } 
#headerQ .bottom_wrap .link .icon_box { background: var(--siteC); margin: 0 auto .5em; width: 2.5em; height: 2.5em; border-radius: 100px; text-align: center; line-height: 2.9em; } 
#headerQ .bottom_wrap .link .icon_box img { width: 50%; } 
/* #headerQ .bottom_wrap .link img { background: var(--siteC); width: 1.5em; padding: .5em; border-radius: 50%; } */
#headerQ .bottom_wrap .link .tt { font-size: .8em; display: block; font-weight: 500; } 
#headerQ .bottom_wrap .link:hover img { opacity: 0.6; } 
#headerQ .goTop { width: 3.5em; line-height: 3.5em; text-align: center; background: var(--siteC); color: #fff; box-shadow: 0 0 1em rgba(0, 0, 0, .1); opacity: 0; transform: translateY(100%); transition: .3s } 
#headerQ .goTop .xi { font-size: 1.5em } 
.scroll #headerQ .goTop { opacity: 1; transform: translateY(0) } 

.stickyT { position: sticky !important; top: var(--headHS); } 

#headerQ.allOn { } 
#headerQ.allOn .allBtn .xi:before { content: "\e9af" } 
#headerQ.allOn .all_wrap { visibility: visible; } 
#headerQ.allOn .all_wrap .wrap_in { opacity: 1; } 
#headerQ.allOn .fix_wrap { background: rgba(0, 0, 0, .75); } 
#headerQ.allOn .mem_wrap .logBtn .tt { color: #fff; } 
#headerQ.allOn .mem_wrap .logBtn .ico { color: #ffd0d4; font-size: 1.6em } 
#headerQ.allOn .mem_wrap .logBtn .tt .point { color: #ffd0d4; } 
#headerQ.allOn .mem_wrap .logBtn .arrow { font-size: 1em; color: #ffd0d4; transition: .3s } 
#headerQ.allOn .all_wrap .crHead { background: rgba(0, 0, 0, .75); } 
#headerQ.allOn .all_wrap .bg .bgImg { transform: translateX(0); opacity: 1; } 
#headerQ.allOn .bottom_wrap .link .tt { color: #fff; } 



html:not(.allOn) #header .top_wrap .gnb_wrap { display: flex; align-items: center; flex: 1; min-width: 0; justify-content: center; height: 100%; z-index: 1; max-width: 120vmin; margin: 0 auto } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb { position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 100%; justify-content: space-around; box-sizing: border-box; transition: padding .3s } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb a { display: flex } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li { position: relative; } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 { display: flex; align-items: center; justify-content: center } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt { font-weight: 500; font-size: 1.188em } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va { position: relative } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after { content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 1px; background: var(--siteC); transform: translate(-50%, .25em) } 
/* html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 { display:none } */
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp1,
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 { color: var(--siteC) } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp1 .va:after,
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 .va:after { width: 100%; transition: .3s } 

html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li:hover .dp2 { visibility: visible; opacity: 1; z-index: auto; transition: .2s; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 { visibility: hidden; flex-direction: column; gap: .5em; opacity: 0; z-index: -1; position: absolute; padding: 1em; background: var(--siteC); width: 13em; left: 50%; top: 5.2em; transform: translateX(-50%); box-sizing: border-box; box-shadow: 0 1em 1em rgba(0, 0, 0, .1); } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li { box-sizing: border-box } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a { padding: .25em 1em; justify-content: center; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .tt { font-size: .938em; color: rgba(255, 255, 255, .8); transition: .3s; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .tt:hover { color: #fff; } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp2 > li > a .arrow { display: none } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li.on .dp1 .va:after { transform: scaleX(1) translate(-50%, .25em) } 
html:not(.allOn) #header .wrap_in .gnb_wrap .gnb > li .dp3 { display: none } 


html:not(.scroll) body:not(.sub) #header { background: none; color: #fff } 
html:not(.scroll) body:not(.sub) #header .top_wrap .logo .in { transform: translateY(-100%) } 
html:not(.scroll) body:not(.sub) #header .top_wrap .etc_wrap .allBtn { filter: brightness(0) invert(1) } 

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

#footer { z-index: 1; padding: 4em 0 4em 0; background: #000; color: #fff; padding-right: var(--pagePD); } 
#footer .goTop { position: fixed; right: 0; bottom: 0; width: 3.5em; line-height: 3.5em; text-align: center; background: var(--siteC); color: #fff; box-shadow: 0 0 1em rgba(0, 0, 0, .1); opacity: 0; transform: translateY(100%); transition: .5s } 
#footer .goTop .xi { font-size: 1.5em; transition: .3s } 
#footer .goTop:hover .xi { transform: translateY(-.25em) } 
.scroll #footer .goTop { opacity: 1; transform: translateY(0) } 
#footer .wrapF { display: flex; flex-direction: column; gap: 2em } 
#footer .logo_wrap { display: flex; gap: 2em } 
#footer .logo img { height: 2.5em; filter: brightness(0) invert(1) opacity(.6) } 
#footer .menu { display: flex; gap: 3em; margin-left: auto } 
#footer .menu > li > a { display: block; position: relative; color: #fff; opacity: .7 } 
#footer .menu > li:not(:last-child) > a:after { content: ""; position: absolute; right: -1.5em; top: 50%; width: 1px; height: 80%; transform: translateY(-50%); background: #fff; opacity: .5 } 
#footer .menu > li.point > a { opacity: 1; font-weight: 700 } 
#footer .info_wrap { display: flex; flex-direction: column; gap: .5em } 
#footer .infoW { display: flex; gap: 1.5em; background: var(--siteC); padding: 1em; align-items: center;} 
#footer .infoW .infoTit { font-weight: 700; font-size: .9em; } 
#footer .info { overflow: hidden; min-width: 0; display: flex; width: 88%; } 
#footer .info > li { opacity: .7; position: relative; font-size: .8em;} 
/* #footer .info > li { float: left; margin-right: 2em; opacity: .7; position: relative; font-size: .875em; flex: 1 1 27%; max-width: 27%; } */
#footer .info > li:before { content: ""; position: absolute; left: -1em; height: 70%; top: 50%; transform: translateY(-50%); width: 1px; background: #fff; opacity: .2 } 
#footer .info > li.point { font-weight: 700; opacity: 1 } 
#footer .info > li.br { clear: left } 
#footer .info > li:nth-child(1),
#footer .info > li:nth-child(2) {flex: 1 1 11%; max-width: 11%;}
#footer .info > li:nth-child(3) { flex: 1 1 15%; max-width: 15%; } 
#footer .info > li:nth-child(4) { flex: 1 1 16%; max-width: 16%; }
#footer .info > li:nth-child(5) { flex: 1;} 

#footer .copyright { font-size: .813em; opacity: 1; margin-top: .5em; text-transform: uppercase; margin: 2em 0 0 0; opacity: .5 } 
#footer .cs_wrap { display: flex; gap: 0 4em; text-align: right } 
#footer .cs_wrap .wrap_in { position: relative } 
#footer .cs_wrap .wrap_in:not(:first-child):after { content: ""; position: absolute; left: -2em; top: 0; width: 1px; height: 100%; background: #fff; opacity: .2 } 
#footer .cs_wrap .t1 { opacity: .7; font-weight: 500; margin-bottom: .5em } 
#footer .cs_wrap .t2 { font-weight: 700; font-size: 1.125em } 
.sns_st { display: flex; gap: .5em } 
.sns_st > li > a { display: flex; align-items: center; justify-content: center; width: 2em; height: 2em; border-radius: 50%; transition: .3s; border: 1px solid rgba(255, 255, 255, .2) } 
.sns_st > li > a .xi { font-size: 1em } 
.sns_st > li > a img { height: 1em } 
.sns_st > li > a:hover { background: #333; color: #fff } 
.sns_st > li > a:hover img { filter: brightness(0) invert(1) } 
.sns_st > li > a.kc img { height: 1.438em } 

#quick { background: var(--siteC); position: fixed; left: 50%; bottom: 0; width: 70em; max-width: 90%; transform: translate(-50%, 100%); background: #fff; z-index: 1000; border-radius: 3em 3em 0 0; box-shadow: 0 0 3em rgba(0, 0, 0, .2); opacity: 0; display: flex; overflow: visible; } 
#quick .link { width: 45%; display: flex; align-items: center; padding: 1em; } 
#quick .link > li { flex: 1em; display: flex; justify-content: center; position: relative; } 
#quick .link > li .in { display: flex; height: 5em; flex-direction: column; gap: .25em; text-align: center; justify-content: center; align-items: center; box-sizing: border-box; opacity: .8 } 
#quick .link > li .in .t1 { font-size: .938em; font-weight: 700 } 
#quick .link > li .in .ico { font-size: 2em } 
#quick .link > li.goTop .in { width: 5em; border-radius: 50%; background: linear-gradient(0deg, #eee 0%, #ccc 100%); padding: .5em; opacity: 1 } 
#quick .link > li.goTop .in .in { width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(90deg, #eee 0%, #ccc 100%); border: 1px solid rgba(255, 255, 255, .5) } 
#quick .link > li.goTop .in .in .ico { font-size: 1.5em } 
#quick .inquiry { flex: 1; min-width: 0; padding: 1em 2em; padding-top: 1.5em; background: var(--siteC); color: #fff; border-radius: 3em 0 0 0; } 
#quick .inquiry .titW { display: flex; align-items: center; justify-content: space-between } 
#quick .inquiry .titW .t1 { font-size: 1.125em; font-weight: 700 } 
#quick .inquiry .titW .label_st { font-size: .875em } 
#quick .inquiry .inpW { display: flex; margin: .75em 0 0 0; gap: .5em } 
#quick .inquiry .inpW .inp { flex: 1; min-width: 0; background: rgba(0, 0, 0, .5); border: none; box-sizing: border-box; height: 2.5em; padding: .5em 1em } 
#quick .inquiry .inpW .btn { background: #fff; color: var(--siteC); border: none; padding: 0 2em; font-weight: 700; filter: saturate(1.5) } 
.scroll #quick { transform: translate(-50%, 0%); opacity: 1; transition: 1s } 

/* 공통 구조 유지 */
#quick .link > li { position: relative; } 
#quick .link > li.kakao {cursor: pointer;}
#quick .link { position: relative; } 
#quick .link > li { position: relative; } 
#quick .link > li .kakao_card { display: none; position: absolute; bottom: 6em; /* 버튼 위로 살짝 */
 left: 50%; transform: translateX(-50%); background: #fff; border-radius: 1em; box-shadow: 0 0 1em rgba(0, 0, 0, .25); padding: 1.2em; width: 10em; z-index: 10; text-align: center; } 
#quick .link > li .kakao_card.active { display: block; } 
#quick .profile_card .name { font-size: .96em; font-weight: 700; color: #333; margin-bottom: .8em;} 
#quick .profile_card .title { font-size: 0.938em; color: #666; margin-bottom: 0.75em; border-bottom: 1px dashed #ddd; } 
#quick .profile_card ul { text-align: left; font-size: 0.875em; line-height: 1.6; } 
#quick .profile_card .triangle { position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #fff; } 

/* 등장 애니메이션 */
@keyframes fadeUp { 
 from { opacity: 0; transform: translateX(-50%) translateY(10px); } 
 to { opacity: 1; transform: translateX(-50%) translateY(-10px); } 
 }


#contents { flex: 1 1 0%; min-height: 0; padding-right: var(--pagePD); } 
#contents .sub_top_wrap { position: relative; padding-top: var(--headerH) } 
#contents .sub_top_wrap .wrapBg { height: 30vh; overflow: hidden; position: relative } 
#contents .sub_top_wrap .wrapBg .bg { height: 100%; position: relative; background-size: cover } 
#contents .sub_top_wrap .wrapBg .bg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .3 } 
#contents .sub_top_wrap .wrapBg .bg { background-position: center 0%; transition: 3s } 
#contents .sub_top_wrap.on .wrapBg .bg { background-position: center 50% } 
#contents .sub_top_wrap .wrapBg .tt { position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing: border-box; padding: 3% 5%; text-align: right; display: flex; flex-direction: column; gap: 1em; align-items: flex-end; justify-content: flex-end } 
#contents .sub_top_wrap .wrapBg .tt .t1 { font-size: 2.5em; mix-blend-mode: difference; color: #fff; font-weight: 700 } 
#contents .sub_top_wrap .wrapBg .tt .t2 { font-size: 1.125em } 
#contents .sub_top_wrap .wrapCon { position: relative; box-sizing: border-box } 
#contents .sub_top_wrap .wrapCon .wrapF { display: flex; flex-direction: column } 
#contents .subTit { display: flex; height: 15vh; box-sizing: border-box; padding-bottom: 2vh; align-items: flex-end } 
#contents .subTit .t1 { font-size: 6vmin } 
#contents .subTit .subNav { margin-left: auto } 
#contents .subNav { display: flex; align-items: center; color: #888; gap: 1em } 
#contents .subNav > li:not(.home):before { content: "\e940"; font-family: xeicon; margin-right: .5em } 
#contents .subNav > li.home > a { width: 2em; height: 2em; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center } 
#contents .subNav > li.home > a .xi { font-size: 1em } 
#contents .subTab { border-bottom: 1px solid #111; padding: 1em 0 } 
#contents .subTab .gnb > li { display: none; } 
#contents .subTab .gnb > li.on { width: 100%; display: block; } 
#contents .subTab .gnb > li > a { display: none; } 
#contents .subTab .gnb .dp2 { width: 100%; display: flex; justify-content: center; flex-wrap: wrap } 
#contents .subTab .gnb .dp2 > li > a { display: flex; align-items: center; justify-content: center; text-align: center; box-sizing: border-box; padding: 1em 2em; opacity: .5 } 
#contents .subTab .gnb .dp2 > li > a .va { position: relative } 
#contents .subTab .gnb .dp2 > li > a .tt { font-weight: 700; font-size: 1.25em } 
#contents .subTab .gnb .dp2 > li.on > a,
#contents .subTab .gnb .dp2 > li:hover > a { opacity: .8 } 
#contents .subTab .gnb .dp2 > li.on > a .va:after { content: ""; position: absolute; left: 100%; bottom: 100%; transform: translate(100%, 0); width: .375em; height: .375em; border-radius: 50%; background: #333 } 

#contents .subPageTit { padding: 4em 0; line-height: 1.1; text-align: center } 
#contents .subPageTit .t1 { font-weight: 500; font-size: 3em } 

#contents .doc { padding: 8vmin 0 16vmin 0 } 
#contents .doc.pt0 { padding: 0vmin 0 16vmin 0 } 

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

/**/
.br1 { border-radius: 1em } 
.br2 { border-radius: 2em } 
.outRound { position: relative; padding: 1.5em; background: #fff; box-sizing: border-box } 
.outRound:before,
.outRound:after { content: ""; position: absolute; width: 2em; height: 2em; z-index: 1; background: url(../images/inc/round.svg) no-repeat; background-size: 100% 100% } 
.outRound.rb { border-top-left-radius: 2em } 
.outRound.rb:before { right: 0; bottom: 100% } 
.outRound.rb:after { right: 100%; bottom: 0 } 
.outRound.lb { border-top-right-radius: 1em } 
.outRound.lb:before { left: 0; bottom: 100%; transform: rotateY(180deg) } 
.outRound.lb:after { left: 100%; bottom: 0; transform: rotateY(180deg) } 

.mainBox { padding: 12vmin 0; position: relative } 
.mainBox.bg1 { background: #333 } 
.mainBox.bg2 { background: #535366 } 
.mainBox .wrapBg { position: absolute; left: 0; top: 0; width: 100%; height: 100% } 
.mainBox .wrapBg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .2 } 
.mainBox .wrapF { display: flex; flex-direction: column; gap: 4vmin 12vmin; position: relative } 
.mainBox .wrapF.dRow { flex-direction: row; align-items: center } 
.mainBox .wrapF.dRow .wrapCon { flex: 1; min-width: 0 } 

.mainTit { display: flex; flex-direction: column; align-items: flex-start; gap: .5em; margin-bottom: 2em } 
.mainTit.ac { align-items: center; text-align: center } 
.mainTit .tit0 { font-size: 1.25em; opacity: .5; font-style: italic } 
.mainTit .tit0 > i { font-style: inherit } 
.mainTit .tit1 { font-size: 2.75em; font-weight: 800; letter-spacing: -.05em; word-spacing: .1em; line-height: 1.1 } 
.mainTit .tit1 .inS { font-size: 1.75em; font-weight: 700 } 
.mainTit .tt1 { filter: opacity(.6); font-weight: 500; font-size: 1.188em; line-height: 1.5; margin-top: 2em } 
.mainTit .mgL { margin-left: auto } 
.mainTit.white { filter: brightness(0) invert(1) } 
.mainTit.white .tt1 { opacity: .8 } 
.mainTit .icoW { display: flex; gap: .5em; align-items: center } 
.mainTit .icoW .ico { width: 4em; height: 4em; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle, #fff 40%, #ddd 100%); border-radius: 50% } 
.mainTit .icoW .ico img { width: 50% } 
.mainTit .icoW .tt { font-size: 2em; font-weight: 700 } 
.mainTit .icoW.s1 { font-size: .75em } 
.mainTit .icoW.s1 .tt { font-size: 1.625em; font-weight: 500 } 
.mainTit .mainMore { margin: 4em 0 0 0 } 
.mainTitW { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 2em } 
.mainTitW .mainTit { margin-bottom: 0 } 

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

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

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

.visualSlide .el { position: relative; overflow: hidden; height: 100vh; background: #fff;  } 
.visualSlide .el .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(1.2) } 
.visualSlide .el .vod_wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } 
.visualSlide .el .vod_wrap:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000 } 
.visualSlide .el.swiper-slide-active .vod_wrap:after,
.visualSlide .el.swiper-slide-duplicate-active .vod_wrap:after { transition: 2s; opacity: .5 } 
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg { transition: 6s; transform: scale(1) rotate(.001deg) } 

.visualSlide_wrap { position: relative } 
.visualSlide_wrap .slogan { position: absolute; width: 100%; height: 100%; left: 0; top: 80px; color: #fff; z-index: 10 } 
.visualSlide_wrap .slogan .in { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100% } 
.visualSlide_wrap .slogan .t1 { font-size: 1.8vw; word-spacing: .2vw; margin-bottom: 1vw } 
.visualSlide_wrap .slogan .t2 { font-weight: 500; font-size: 4vw; letter-spacing: -.2vw; word-spacing: .2vw } 

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

.visualSlide_wrap .searchW { --mainSearchH: 4em; --mainSearchL: 6em; width: 40em; max-width: 90%; margin: 0 auto; transform: translateY(138px); } 
.visualSlide_wrap .searchW .tit { text-align: center; margin-bottom: 1em;} 
.visualSlide_wrap .searchW .tit .tt1 { font-weight: 700; font-size: 1.625em; margin-bottom: 1em; color: var(--siteC); filter: brightness(2) saturate(1.5) } 
.visualSlide_wrap .searchW .in { height: var(--mainSearchH); background: var(--siteC); color: #fff; border-radius: var(--mainSearchH); position: relative; box-sizing: border-box; padding-left: var(--mainSearchL) } 
.visualSlide_wrap .searchW .in .tag { position: absolute; left: 0; top: 0; width: var(--mainSearchL); height: 100%; text-align: center; display: flex; align-items: center; justify-content: center } 
.visualSlide_wrap .searchW .in .tag .tt1 { font-style: italic; font-size: 2em } 
.visualSlide_wrap .searchW .in .tt1 { font-size: 1.25em; font-weight: 500 } 
.visualSlide_wrap .searchW .in .form { width: 100%; height: 100%; border-radius: inherit } 
.visualSlide_wrap .searchW .in .inp { width: 100%; height: 100%; border-radius: inherit; border: none; background: none; box-sizing: border-box; padding-left: 1px; opacity: 0 } 
.visualSlide_wrap .searchW .in .inp::placeholder { color: #fff; opacity: .5 } 
.visualSlide_wrap .searchW .in .btn { width: var(--mainSearchH); height: 100%; position: absolute; right: 0; top: 0; border-radius: inherit; box-sizing: border-box; border: .5em solid var(--siteC); background: #fff; color: var(--siteC) } 
.mainKeywordSlideW { position: absolute; left: 0; top: 0; width: calc(100% - var(--mainSearchH)); height: 100%; box-sizing: border-box; padding-left: var(--mainSearchL); margin-right: var(--mainSearchH) } 
.mainKeywordSlideW .mainKeywordSlide,
.mainKeywordSlideW .mainKeywordSlide .el { height: var(--mainSearchH) } 
.mainKeywordSlideW .mainKeywordSlide .el { display: flex; align-items: center; cursor: pointer } 
.mainKeywordSlideW .mainKeywordSlide .el:not(.swiper-slide-active) { opacity: 0 !important } 
.searchW.on .mainKeywordSlideW { opacity: 0; z-index: -1 } 
.searchW.on .in .inp { opacity: 1 } 
.mainKeywordSlide_control { position: absolute; right: 0; top: 100%; padding: .25em 1em } 

.mainScroll { color: #fff } 
.mainScroll .tt { display: flex; align-items: center; font-size: .813em; font-weight: 500 } 
.mainScroll .tt .xi { font-size: 1.5em; margin-right: .25em; position: relative } 

.mainAbout { --mainSecGap: 1.5em; } 
.mainAbout .mainTit { width: 45% } 
.mainAbout .list { display: flex; gap: var(--mainSecGap) } 
.mainAbout .list > li { flex: 1 } 
.mainAbout .list > li .in { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 1em } 
.mainAbout .list > li .imgW { position: relative } 
.mainAbout .list > li .imgW .resize { padding-bottom: 160% } 
.mainAbout .list > li .imgW:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .1 } 
.mainAbout .list > li .conW { display: flex; gap: 1em; flex-direction: column; box-sizing: border-box; padding: .25em; padding-right: 1em } 
.mainAbout .list > li .conW .ico { font-size: 2.5em; margin-bottom: .25em } 
.mainAbout .list > li .conW .t1 { font-size: 1.25em; font-weight: 700; } 
.mainAbout .list > li .conW .t2 { color: #777; word-break: keep-all } 
.mainAbout .list > li:nth-child(2) { padding-top: 4em } 

.mainBranchW { width: 70%; } 
.mainBranchSlideW { margin: -1em; margin-top: 0 } 
.mainBranchSlide .swiper-wrapper { align-items: stretch } 
.mainBranchSlide .el { width: 50%; height: auto } 
.mainBranchSlide .el .in { margin: 1em; background: rgba(255, 255, 255, .2); height: 100%; display: flex; flex-direction: column; gap: 1em; box-sizing: border-box; padding: 7%; color: #fff } 
.mainBranchSlide .el .in .tel { display: flex; gap: .5em; align-items: center; justify-content: center } 
.mainBranchSlide .el .in .tel .ico { width: 2em; height: 2em; border-radius: 50%; background: var(--siteC); display: flex; align-items: center; justify-content: center } 
.mainBranchSlide .el .in .tel .ico:before { content: "\e9d3" } 
.mainBranchSlide .el .in .tel .no { font-weight: 900; font-size: 1.5em; letter-spacing: -.01em } 
.mainBranchSlide .el .in .mainMore { margin: auto 0 0 auto; font-size: .875em } 
.mainBranchSlide .el .in .infoSt { background: rgba(0, 0, 0, .2); padding: 5% } 

.logoBranch { display: flex; gap: 1em; align-items: center } 
.logoBranch .logo { height: 2em } 
.logoBranch .t1 { font-weight: 500; font-size: 1.5em; padding-left: .5em; margin-left: .25em; border-left: 1px solid #fff } 



.infoSt { display: flex; flex-direction: column; gap: .75em } 
.infoSt > li { display: flex; align-items: flex-start; gap: .5em; line-height: 1.1 } 
.infoSt > li:before { content: "■"; transform: scale(.3) } 
.infoSt > li .t1 { font-size: .938em; flex: 1; min-width: 0; word-break: keep-all } 

.mainWork .listW { position: relative } 
.mainWork .listW .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100% } 
.mainWork .list { display: flex; margin-top: 2em } 
.mainWork .list > li { flex: 1 1 auto; width: 25%; transition: 1s } 
.mainWork .list > li .wrap_in { height: 80vh; position: relative; color: #fff; overflow: hidden; box-sizing: border-box; border: 1px solid #555; margin: -1px } 
.mainWork .list > li .wrap_in .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing: border-box } 
.mainWork .list > li .wrap_in .bg:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5) } 
.mainWork .list > li .wrap_in .tit_wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; gap: 2em; justify-content: center; align-items: center; box-sizing: border-box; padding: 1em } 
.mainWork .list > li .wrap_in .tit_wrap .ico { height: 2.5em; filter: brightness(0) invert(1) } 
.mainWork .list > li .wrap_in .tit_wrap .t1 { font-weight: 700; font-size: 1.75em } 
.mainWork .list > li .wrap_in .con_wrap { position: relative; box-sizing: border-box; display: flex; flex-direction: column; gap: 2em; opacity: 0; transform: translateY(5vmin); padding: 15% 10%; box-sizing: border-box; height: 100% } 
.mainWork .list > li .wrap_in .con_wrap .tt1 { font-weight: 700; font-size: 2.5em } 
.mainWork .list > li .wrap_in .con_wrap .tt2 { opacity: .8; font-size: 1.188em; line-height: 1.5 } 
.mainWork .list > li .wrap_in .con_wrap .mainMore { margin: auto 0 0 auto; transform: translateY(50%) } 
.mainWork .list > li:hover { width: 60% } 
.mainWork .list > li:hover .tit_wrap { display: none } 
.mainWork .list > li:hover .con_wrap { opacity: 1; transform: translateY(0); transition: .3s; transition-delay: .6s } 
.mainWork .list2 { display: flex; gap: 1em; color: #fff } 
.mainWork .list2 > li { flex: 1; min-width: 0; position: relative; } 
.mainWork .list2 > li:before { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); border-radius: .25em; background: rgba(255, 255, 255, .2) } 
.mainWork .list2 > li .in { display: flex; align-items: center; text-align: center; flex-direction: column; gap: 1em; padding: 2em .5em; padding-bottom: 3em; box-sizing: border-box; height: 100%; position: relative } 
.mainWork .list2 > li .in .ico { height: 4em; width: 4em; display: flex; justify-content: center; align-items: center; background: var(--siteC); border-radius: 50%; opacity: .7 } 
.mainWork .list2 > li .in .ico img { height: 60%; filter: brightness(0) invert(1) } 
.mainWork .list2 > li .in .t1 { font-weight: 500; font-size: 1.125em } 
.mainWork .list2 > li .in .arrow { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); opacity: 0 } 
.mainWork .list2 > li .in .arrow:before { content: "\e916" } 
.mainWork .list2 > li:hover:before { background: #fff; height: 120%; transition: .3s } 
.mainWork .list2 > li .in:hover { color: var(--siteC); transition: .3s } 
.mainWork .list2 > li .in:hover .arrow,
.mainWork .list2 > li .in:hover .ico { opacity: 1 } 

.peopleSt { display: flex; color: #fff } 
.peopleSt .imgW { width: 70%; margin-left: auto; } 
.peopleSt .imgW .img { padding-bottom: 140%; filter: drop-shadow(1em 1em 1em rgba(0, 0, 0, .5)) } 
.peopleSt .logoW { width: 3em; background: rgba(0, 0, 0, .5); position: relative } 
.peopleSt .logoW .logoBranch { position: absolute; left: 50%; top: 10%; transform: rotate(90deg) translateX(-50%); transform-origin: 0% 50%; white-space: nowrap } 
.peopleSt .logoW .logoBranch .t1 { white-space: nowrap } 
.peopleSt .conW { position: absolute; left: 0; bottom: 0; width: 80%; box-sizing: border-box; padding: 4em; display: flex; flex-direction: column; gap: 3em; opacity: 0 } 
.peopleSt .conW .tit { position: relative } 
.peopleSt .conW .tit:before { content: ""; position: absolute; left: 0; bottom: -1em; width: 0; height: 1px; background: #fff } 
.peopleSt .conW .tit .t1 { font-size: 1.125em } 
.peopleSt .conW .tit .t2 { font-size: 3em; font-weight: bold; letter-spacing: .3em } 
.peopleSt .conW .infoSt { font-size: .938em; min-height: 14em } 
.mainPeople { overflow: hidden; --mainPeopleSlideW: 40em; } 
.mainPeople .swiperControl { background: rgba(0, 0, 0, .5); padding: .5em 0; justify-content: center } 
.mainPeople .swiperControl .paging { flex: 0 0 auto; margin-left: 2em } 
.mainPeople .swiperControl .cBtn { position: absolute; left: 50%; top: 50%; z-index: 10; width: 4em; height: 4em; background: var(--siteC); filter: brightness(1.5); box-shadow: 0 0 1em rgba(0, 0, 0, .2) } 
.mainPeople .swiperControl .cBtn:before { font-size: 2em } 
.mainPeople .swiperControl .cBtn.prev { margin-left: calc(var(--mainPeopleSlideW) / 2 * -1); transform: translate(-200%) } 
.mainPeople .swiperControl .cBtn.next { margin-left: calc(var(--mainPeopleSlideW) / 2); transform: translate(50%) } 
.mainPeople .swiperControl .cBtn:hover { background: #fff; color: var(--siteC) } 
.mainPeopleSlide { overflow: visible !important; margin-top: 4vmin } 
.mainPeopleSlide .el { width: var(--mainPeopleSlideW); opacity: .4 } 
.mainPeopleSlide .el.swiper-slide-active { opacity: 1; transition: .3s } 
.mainPeopleSlide .el.swiper-slide-active .peopleSt .conW { opacity: 1; transition: .3s } 
.mainPeopleSlide .el.swiper-slide-active .peopleSt .conW .tit:before { width: 100%; transition: 1s; transition-delay: .3s } 

.caseStW { display: flex; flex-direction: column; gap: 4em } 
.caseSt { display: flex; gap: 4em } 
.caseSt .imgW { width: 26em } 
.caseSt .imgW .resize { padding-bottom: 56.25% } 
.caseSt .conW { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2em; align-items: flex-start } 
.caseSt .conW .tit { display: flex; flex-direction: column; align-items: flex-start; gap: .5em } 
.caseSt .conW .tit .tit1 { font-size: 1.625em } 
.caseSt .conW .cate { background: var(--siteC); color: #fff; padding: .25em 1em; display: inline-block; font-size: .938em; font-weight: 500 } 
.caseSt .conW .area { display: flex; align-items: center; gap: .25em; color: var(--siteC); opacity: .7 } 
.caseSt .conW .area .ico:before { content: "\eb59" } 
.caseSt .conW .area .t1 { font-weight: 500 } 
.caseSt .conW .tt1 { color: #666 } 

.mainCs { padding-bottom: 16vmin } 
.mainCs .list { display: flex; overflow: hidden; gap: 2em } 
.mainCs .list > li { flex: 1; min-width: 0; position: relative; overflow: hidden; box-shadow: 0 0 1em rgba(0, 0, 0, .1) } 
.mainCs .list > li:nth-child(3) { flex: 0 0 22% } 
.mainCs .list > li.stw20 { flex: 0 0 20% } 
.mainCs .list > li .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100% } 
.mainCs .list > li .bg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .3 } 
.mainCs .list > li > .in { display: flex; flex-direction: column; align-items: flex-start; padding: 2em; box-sizing: border-box; gap: 1em; position: relative; height: 30vmin; color: #fff; border: 1px solid rgba(255, 255, 255, .2) } 
.mainCs .list > li > .in .ico { height: 2em; filter: brightness(0) invert(1) } 
.mainCs .list > li > .in .t1 { font-weight: 700; font-size: 1.5em } 
.mainCs .list > li > .in .more { margin: auto 0 0 auto; display: flex; align-items: center; gap: .5em; font-size: 1.125em; font-weight: 500 } 
.mainCs .list > li > .in .arrow { transition: .3s } 
.mainCs .list > li > .in .arrow:before { content: "\ea3f" } 
.mainCs .list > li > .in .group { display: flex; gap: .5em; margin-top: auto; width: 100%; flex-wrap: wrap; } 
.mainCs .list > li > .in .group > li { flex: 1 1 25%; min-width: 0 } 
.mainCs .list > li > .in .group > li > a { display: flex; flex-direction: column; justify-content: center; text-align: center; align-items: center; background: rgba(0, 0, 0, .5); box-sizing: border-box; padding: .5em; border-radius: .25em; opacity: .9 } 
.mainCs .list > li > .in .group > li > a .tt1 { font-weight: 700; } 
.mainCs .list > li > .in .group > li > a .tt2 { font-size: .938em } 
/* .mainCs .list > li > .in .group > li > a .tt2:after { content: "" }  */
.mainCs .list > li:hover .bg { transform: scale(1.1); transition: 1s } 

.newsSlide,
.newsSlide .el { height: 7em } 
.newsSlideW { display: flex; align-items: center; gap: 2em; padding: 0 2em; border: 1px solid rgba(255, 255, 255, .2); border-left: none; border-right: none; color: #fff } 
.newsSlideW .titW { display: flex; align-items: center; gap: 1em } 
.newsSlideW .titW .t1 { font-weight: 700; font-size: 1.375em } 
.newsSlideW .newsSlide { flex: 1; min-width: 0 } 
.mainNewsSt { height: 100%; display: flex; align-items: center } 
.mainNewsSt .conW { flex: 1; min-width: 0; display: flex; align-items: center; gap: 4em } 
.mainNewsSt .tTit { flex: 1; min-width: 0; font-size: 1.125em; font-weight: 500 } 
.mainNewsSt .tDate { opacity: .5 } 
.mainNewsSt:hover .tTit { text-decoration: underline } 

/*sub_consulting*/
.work_con { padding-bottom: 3em; } 
.work_con { padding-bottom: 3em; } 
.work_con:last-child { padding-bottom: 0; } 
.work_wrap { gap: 1em; align-items: center; } 
.work_wrap.st2 { gap: 2em; align-items: center; } 
.work_wrap .work_left { width: 55%; padding-right: 2em; box-sizing: border-box; } 
.work_wrap .work_left.w1 { width: 100%; height: 19em; } 
.work_wrap .work_left.w1.st2 { width: 100%; height: 15em; position: relative; padding: 1em; box-sizing: border-box; line-height: 2; } 
.work_wrap .work_left.w2 { width: 52%; } 
.work_wrap .work_left .tit { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: .8em; position: relative; } 
.work_wrap .work_left .tit.st2 { font-size: 1.8em; font-weight: 700; display: inline-block; margin-bottom: 0em; position: relative; } 
.work_wrap .work_left .tit::before { content: ''; z-index: -1; position: absolute; bottom: -3px; left: 0; width: 100%; height: 20px; background: #dfeaff; border-radius: 20em; } 
.work_wrap .work_left .tit.st2::before { content: ''; z-index: -1; position: absolute; bottom: -3px; left: 0; width: 0%; height: 20px; background: #dfeaff; border-radius: 20em; } 
.work_wrap .work_left .tit2 { font-size: 1.8em; font-weight: 700; display: inline-block; margin: .4em 0; position: relative; } 
.work_wrap .work_left .tit3 { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: .8em; position: relative; } 
.tit2.quotes { position: relative; } 
.tit2.quotes::before { content: " "; position: absolute; width: .5em; height: .5em; background-image: url(../images/inc/Lquotes.svg); background-repeat: no-repeat; background-position: center center; background-size: cover; top: -8px; left: -20px; } 
.tit2.quotes::after { content: " "; position: absolute; width: .5em; height: .5em; background-image: url(../images/inc/Rquotes.svg); background-repeat: no-repeat; background-position: center center; background-size: cover; top: -8px; right: -20px; } 

.work_wrap .tit3::before { content: ''; z-index: -1; position: absolute; bottom: 9px; left: 0; width: 100%; height: 20px; background: #dfeaff; border-radius: 20em; display: inline-block; } 

.work_wrap .work_left .sub_tit { font-size: 1.125em; color: #222; line-height: 1.6; margin-bottom: 1em; } 
.work_wrap .work_left .sub_tit.st2 { font-size: 1.25em; color: #222; line-height: 1.6; margin-bottom: 1em; background-color: #fefefe; padding: 1em; border-radius: .8em; box-shadow: 3px 3px 5px #ddd; } 
.work_wrap .work_left .sub_tit.st3 { font-size: 1.15em; color: #222; line-height: 1.6; margin-bottom: 1em; background-color: #fefefe; padding: 1em; border-radius: .8em; box-shadow: unset; } 
.work_wrap .work_left .txt { font-size: 1.125em; color: #777; margin-bottom: 1em; line-height: 1.6; } 
.work_con .add { color: #222; margin-top: 5em; } 
.work_con .add.mt2 { margin-top: 2em; } 
.work_con .add .point_c { color: #ff5a00; display: inline-block; vertical-align: top; } 
.work_con .add .add_info { display: inline-block; } 
.work_wrap .work_left .check_list .item .xi { color: #0098ff; min-width: 1.25em; margin-right: .25em; } 
.work_wrap .work_left .check_list .item .txt { color: #555; } 

.page_sec { margin-top: 6em; } 
.page_sec2 { margin-top: 1.5em; } 
.work_wrap .work_right { width: 45%; height: 330px; } 
.work_wrap .work_right.h2 {height: 350px;}
.work_wrap .work_right.w2 { width: 42%; height: 330px; } 
.work_wrap .work_right.w2.st2 { width: 42%; height: 390px; } 
.work_wrap .work_right .img_box { overflow: hidden; border-radius: 15px; box-shadow: 0 0 20px rgba(0, 0, 0, .15); height: 100%; } 
.work_wrap .work_right .img_box > img { height: 100% !important; width: 100%; object-fit: cover; object-position: center; } 
.work_wrap .work_left.pr_n { padding-right: 0em; padding-left: 2em; } 
.work_wrap .work_left .sub_tit > .highlight { font-size: .9em; } 

.con_box { padding: 1.5em 2em; } 
.con_box.ver2 { padding: 2em 0.5em; } 
.con_box .Blist { width: 100%; } 
.con_box .Blist > li { width: calc((100% - 1.5em) / 4); } 
.con_box .Blist > li .tit_box { background-color: var(--siteC); border-radius: .8em .8em 0 0; height: 3em; font-size: 1.25em; } 
.con_box.mt { margin-top: 3em; } 
.con_box.bg { background-color: #f3f3ff; } 
.con_box.tline { border: 1px solid #ddd; word-break: keep-all; border-radius: 1em; background: #fafafa; } 
.con_box.line { border: 1px solid #ddd; border-radius: .5em; } 
.con_box .check_wrap { display: flex; align-items: center; gap: 2em; padding: 0 2em; } 
.con_box .check_wrap .icon { width: 8em; height: 8em; background-repeat: no-repeat; background-position: center center; background-size: contain; padding: 1.5em; border-radius: 50%; border: 2px solid #ddd; display: flex; justify-content: center; align-items: center; box-sizing: border-box; } 
.con_box .check_wrap .icon img { height: 100%; margin-left: 10px } 
.con_box .check_wrap .cont { } 
.con_box .check_wrap .cont .tit { margin-bottom: .2em; font-weight: 600; font-size: 1.25em; color: var(--color_dblue); display: block; } 
.con_box .check_wrap .cont .td { margin-bottom: 1.2em; margin-bottom: 1em; font-size: 1.125em; color: #555; } 
.con_box .check_wrap .cont .td:last-child { margin-bottom: 0; } 
.con_box .desc { margin-bottom: 1em; padding-left: 1.5em; } 
.con_box .desc .page_tt + .page_tt { margin-top: .2em; } 
/* .con_tit { position:relative; } 
.con_tit .stroke { font-weight: 800; position: absolute; top: -68px; left: 50%; font-size:5.75em; color: transparent; -webkit-text-stroke: 2px #ddd; } */
.con_box .busi_img + .busi_tit { margin-top: 2em; } 
.con_box .law_wrap { margin-left: 1.5em; } 
.con_box .law_wrap .tit { margin-bottom: 0.5em; font-weight: 600; font-size: 1.125em; color: var(--color_dblue) } 
.con_box .law_wrap .cont_list { list-style-type: circle; } 
.con_box .law_wrap .cont_list > li + li { margin-top: 1em; } 
.con_box .law_wrap .cont_list .cont { color: #333; position: relative; } 
.con_box .law_wrap .cont_list .cont .num { padding-right: 0.5em; } 
.con_box .law_wrap .t2 { margin-top: 1em; color: var(--color_lblue) } 

.con_box > ul.flex { gap: 2.5em; } 
.con_box.st2 > ul.flex { gap: 1.5em; } 
.con_box.st3 > ul.flex { gap: 0em; } 

.sub_box.line {border-top: 1px solid var(--siteC); padding-top: 3em;}
.sub_box ul.round_L { gap: .5em !important; } 
.sub_box ul.round_L.st2 { gap: 0em !important; } 
.sub_box .txt_box.st2 { background-color: #fff; padding: 1em; box-sizing: border-box; border-radius: .8em; box-shadow: 0 3px 10px #ddd; } 
.sub_box .txt_box.st3 { background-color: #fff; padding: 2em; box-sizing: border-box; border-radius: .8em; box-shadow: 0 3px 10px #ddd; } 
.sub_box .txt_box.st4 { width: auto; overflow-y: auto; height: 20em; } 

.highlight { display: inline; box-shadow: inset 0 -33px 0 15px #1010c7; color: #fff; padding: 0.1em 0.2em; border-radius: 0.3em; opacity: .8; } 
.highlight2 { display: inline; text-decoration: underline; font-weight: 700; color: var(--siteC); } 
.highlight3 { font-size: 3em; font-weight: 700; position: relative; display: inline-block; } 
.highlight3::before { content: ""; width: 100%; height: .5em; border-radius: 3em; background: var(--siteC); opacity: .2; position: absolute; right: 0px; bottom: 3px; } 

.page_tt { margin-bottom: .5em; } 
.page_tt.tt1 { font-weight: 500; font-size: 1.05em; color: #555; } 
.page_tt.lh1 { line-height: 1.5; } 
.page_tt.tt2 { font-weight: 400; font-size: 1.05em; color: #666; } 
.page_tt.tt3 { font-weight: 400; font-size: .955em; color: #666; } 
.page_tt.tbox { border: 1px solid #ddd; background-color: #f7f7ff; padding: 1.5em; } 
.page_tt.tbox2 { border: 1px solid #ddd; background-color: #fff; padding: 1.5em; } 
.page_tt { font-size: 1em; word-break: keep-all; line-height: 1.6; } 
.page_tt > .tt + .tt { margin-top: 1.25em; } 
.page_tt.o1 { opacity: .7; } 
.page_tt.o2 { opacity: .1; } 
.page_tt.s1 { font-size: 0.938em } 
.page_tt.s2 { font-size: 1.063em } 
.page_tt.s3 { font-size: 1.125em } 
.page_tt.s4 { font-size: 1.250em } 
.page_tt.s5 { font-size: 1.313em } 
.page_tt.s6 { font-size: 1.500em } 
.page_tt.s7 { font-size: 1.625em } 
.page_tt.s8 { font-size: 1.875em } 
.page_tt.s9 { font-size: 2.375em } 
.page_tt.s10 { font-size: 2.750em } 
.page_tt.s11 { font-size: 3.250em } 
.page_tt.s12 { font-size: 4.000em; } 
.page_tt.s13 { font-size: 4.500em; } 
.page_tt.s14 { font-size: 5.250em; } 
.page_tt:last-child {margin-bottom: unset;}

.page_tit .tit1 { font-size: 2.05em; font-weight: 800; display: inline; } 
.page_tit .tit2 { font-size: 1.145em; font-weight: 800; display: inline; } 
.sub_tt { border-bottom: 2px dotted #ddd; } 
.sub_tt .s1 { font-weight: 800; font-size: 1.5em; } 

.page_tt.dot1 { margin-bottom: .5em; color: #222; position: relative; padding-left: 25px; } 
.page_tt.dot1.st2 { margin-bottom: .5em; color: #222; position: relative; padding-left: 10px; } 
.page_tt.dot1.st3 { margin-bottom: .5em; color: #222; position: relative; padding-left: 10px; } 
.page_tt.dot1.st4 { margin-bottom: .5em; color: #222; position: relative; padding-left: 10px;} 
.page_tt.dot1.st5 { margin-bottom: .5em; color: #222; position: relative; padding-left: 15px; } 
.page_tt.dot1:last-child {margin-bottom: unset;}
.page_tt.dot1::before { content: ""; position: absolute; display: inline-block; top: 15px; left: 5px; width: 5px; height: 5px; background-color: rgba(46, 49, 146, .7); transform: translate(-50%, -50%); } 
.page_tt.dot1::after { content: ""; position: absolute; display: inline-block; top: 15px; left: 5px; width: 15px; height: 15px; background-color: rgba(46, 49, 146, .2); transform: translate(-50%, -50%); } 
.page_tt.dot1.st2::before { content: ""; position: absolute; display: inline-block; top: 13px; left: 0px; width: 5px; height: 5px; background-color: rgba(46, 49, 146, .6); transform: translate(-50%, -50%); border-radius: 50%; } 
.page_tt.dot1.st2::after { content: ""; position: absolute; display: inline-block; top: 15px; left: -5px; width: 0; height: 15px; background-color: rgba(46, 49, 146, .1); transform: translate(-50%, -50%); } 
.page_tt.dot1.st3::before { content: ""; position: absolute; display: inline-block; top: 5px; left: -5px; width: 5px; height: 5px; background-color: rgba(46, 49, 146, .7); transform: translate(-50%, -50%); } 
.page_tt.dot1.st3::after { content: ""; position: absolute; display: inline-block; top: 5px; left: -5px; width: 15px; height: 15px; background-color: rgba(46, 49, 146, .2); transform: translate(-50%, -50%); } 
.page_tt.dot1.st4::before { content: ""; position: absolute; display: inline-block; top: 15px; left: 0px; width: 5px; height: 5px; background-color: rgba(46, 49, 146, .6); transform: translate(-50%, -50%); border-radius: 50%; } 
.page_tt.dot1.st4::after { content: ""; position: absolute; display: inline-block; top: 15px; left: -5px; width: 0; height: 15px; background-color: rgba(46, 49, 146, .1); transform: translate(-50%, -50%); } 
.page_tt.dot1.st5::before { content: ""; position: absolute; display: inline-block; top: 15px; left: 5px; width: 5px; height: 5px; background-color: rgba(46, 49, 146, .6); transform: translate(-50%, -50%); border-radius: 50%; } 
.page_tt.dot1.st5::after { content: ""; position: absolute; display: inline-block; top: 15px; left: 5px; width: 0; height: 15px; background-color: rgba(46, 49, 146, .1); transform: translate(-50%, -50%); } 
.page_tt.dot2 { margin-bottom: .5em; color: #111; position: relative; margin-left: 10px; display: inline; } 
.page_tt.dot2::before { content: ""; position: absolute; display: inline-block; bottom: 10px; left: 0; width: 100%; height: 15px; border-radius: 3em; background-color: rgba(46, 49, 146, 0.2); /* width:15px; height:5px; border-radius: 5px; background-color:var(--color_lblue); */
 /* position:absolute; left:0; top: 6px; */ } 
.page_tt.dot3 { margin-bottom: .5em; /* padding-left: 1.2em; */
 font-weight: 600; font-size: 1.125em; color: #333; position: relative; } 
.page_tt.dot3.st2 { margin-bottom: .5em; /* padding-left: 1.2em; */
 font-weight: 600; font-size: 1.125em; color: #555; position: relative; } 
.page_tt.dot3::before { content: "\e92b"; display: inline-block; transform: translateY(2px); margin-right: .3em; font-family: xeicon; color: var(--siteC); /* width:15px; height:5px; border-radius: 5px; background-color:var(--color_lblue); */
 /* position:absolute; left:0; top: 6px; */ } 

/*tab*/
.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; } 
.wrap_idx .sub-tab { display: flex; border: 1px solid #ddd; border-radius: .8em; overflow: hidden; } 
.wrap_idx .sub-tab.pd_w { padding-bottom: 3em; } 
.wrap_idx .sub-tab > li { position: relative; margin-left: -1px; cursor: pointer; height: 100%; display: flex; height: 3.5em; align-items: center; justify-content: center; flex: 1; font-size: 1.05em; font-weight: 700; } 
.wrap_idx .sub-tab > li { flex: 1 20%; border-right: 1px solid #ddd; } 
.wrap_idx .sub-tab > li:last-child { border-right: unset; } 
.wrap_idx .sub-tab > li > .tab_btn { padding: 0 1vw; box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #444; transition: .3s; } 
.wrap_idx .sub-tab > li.on > .tab_btn,
.wrap_idx .sub-tab > li:hover > .tab_btn { background-color: var(--siteC); color: #fff; } 

.wrap_idx .sub-tab.st2 > li { position: relative; margin-left: -1px; cursor: pointer; height: 100%; display: flex; height: 3em; align-items: center; justify-content: center; flex: 1; font-size: 1.15em; font-weight: 700; } 
.wrap_idx .sub-tab.st2 > li { flex: 1 11%; border-right: 1px solid #ddd; } 
.wrap_idx .sub-tab.st2 > li:last-child { border-right: unset; } 
.wrap_idx .sub-tab.st2 > li > .tab_btn { padding: 0 1vw; box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #444; transition: .3s; } 
.wrap_idx .sub-tab.st2 > li.on > .tab_btn,
.wrap_idx .sub-tab.st2 > li:hover > .tab_btn { background-color: var(--siteC); color: #fff; } 

.ico_list > li { position: relative; max-width: 14%; flex: 1 1 16.66%; } 
.ico_list.st2 > li { position: relative; max-width: 50%; flex: 1 1 49%; } 
/* .ico_list >li::before { content: "\e93e"; display: inline-block; transform: translateY(0px); margin-right: .3em; font-family: xeicon; color: var(--siteC); position: absolute; right: -70px; font-size: 2em; } */
.ico_list > li::before { content: "\e93e"; position: absolute; right: -35px; width: 1em; height: .5em; background-image: url(../images/sub/sub_consulting/right_a2.png); font-size: 2em; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 
.ico_list > li:last-of-type::before { display: none; } 
.ico_list > li .in { border: 1px solid #ddd; border-radius: .8em; height: 10em; padding: 1em; width: 80%; box-shadow: 0 3px 10px #ddd; } 
.ico_list > li .in .icoW { width: 5em; height: 5em; background-color: var(--siteC); border-radius: 50%; } 
.ico_list > li .in .icoW img { filter: brightness(0) invert(1); } 
.ico_list > li .in .txtW { width: 100%; height: 4em; } 
/* company-ceo 인사말 */
.greet_wrap { } 
.greet_wrap .greet-top { border-bottom: 1px dotted #777; padding-bottom: .5em; line-height: 1.7; position: relative; } 
.greet_wrap .greet-top::before { content: ""; position: absolute; bottom: -0.1em; left: 0; width: 22%; height: 1.2px; background-color: var(--siteC) } 
.greet_wrap .greet-top .t2 { margin-top: 10px; line-height: 1.2; } 
.greet_wrap .greet-con { gap: 5em; align-items: flex-start; /* padding: 0 3em; */ } 
.greet_wrap .greet-con .img_wrap { width: 40%; } 
.greet_wrap .greet-con .img_wrap .img { width: 100%; padding-bottom: 140%; background-color: #f2f2f2; border-radius: 1em; } 
/* .greet_wrap .greet-con .img_wrap .img { width: 100%; margin-top: -4em; padding-bottom: 120%; border:1px solid #ddd; border-radius: 1em; box-shadow: -3px 3px 15px rgba(0,0,0,.1); } */
.greet_wrap .greet-con .txt_wrap { order: -1; flex: 1; padding-top: 1em; } 
.greet_wrap .greet-con .txt_wrap .page_tt { color: #333; } 
.greet_wrap .greet-con .txt_wrap .page_tt + .page_tt { margin-top: 1em; } 
.greet_wrap .greet-con .txt_wrap p.ceo { margin-top: 1em; padding-right: 3em; font-size: 1.25em; text-align: right; } 
.greet_wrap .greet-con .txt_wrap p.ceo strong { padding-left: 1em; font-weight: 600; font-size: 1.5rem; } 

.mainT_list { width: 100%; gap: 1.5em; } 
.mainT_list > li { width: calc((95% - 1em)/3); } 
.mainT_list > li .in .titW { background-color: var(--siteC); height: 4em; border-radius: .8em; width: 100%; } 
.mainT_list > li .in .titW .tit { border: 2px solid rgba(255, 255, 255, 0.3); height: 2.25em; box-sizing: border-box; width: 98%; line-height: 2.25em; border-radius: .5em; font-size: 1.55em; font-weight: 800; } 
.mainT_list > li .in .txtA { margin-top: 15px; padding: 1em; box-sizing: border-box; border-radius: .8em; background-color: #fafafa; width: 100%; box-shadow: 0px 3px 10px #ddd; height: 15em; } 

.conW .mem_list { gap: 2em; } 
.conW .mem_list > li { width: 23.24%; } 
.conW .mem_list > li .in { border-bottom: 1px solid #ddd; } 
.conW .mem_list > li .in .imgC { text-align: center;} 
.conW .mem_list > li .in .imgC img { border-radius: .5em; transition: all .3s; filter: grayscale(1); } 
.conW .mem_list > li:hover .in .imgC img { border-radius: .5em; transition: all .3s; filter: grayscale(0); } 
.conW .mem_list > li .in .txtC { border-bottom: 1px solid #ddd; } 
.conW .mem_list > li .in .txtC .tit { font-size: 1.05em; opacity: .9; } 
.conW .mem_list > li .in .txtC .name { font-size: 1.05em; opacity: .9; } 
.conW .mem_list > li .in .txtC .name .nam { width: 4em; } 
.conW .mem_list > li .in .txtC .name .desc { width: 5em; } 

.btn_list { width: 100%; height: 3.5em; gap: 1em; border-bottom: 2px solid #ddd; padding-bottom: .5em; } 
.btn_list > li { position: relative; margin-left: -1px; cursor: pointer; height: 100%; display: flex; height: 3.5em; align-items: center; justify-content: center; font-size: 1em; font-weight: 700; flex: 1 14%; overflow: hidden; color: #555 } 
.btn_list > li::before { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: 1em; transform: translateY(-50%); background-color: #444; } 
.btn_list > li:last-of-type::before { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: 0; transform: translateY(-50%); background-color: #444; } 
.btn_list > li:hover { color: var(--siteC); position: relative; z-index: 1; font-weight: 800; } 

.root_daum_roughmap .cont { display: none; } 
.branch_list { width: 100%; gap: 1.5em; } 
.branch_list > li { width: 31%; } 
.branch_list > li .in { background: linear-gradient(45deg, #fefefe 0%, #f3f3fa 99%); border: 2px solid #ddd; border-radius: .5em; height: 30em; padding: 1.5em; border-radius: .5em; box-sizing: border-box; transition: border .3s; cursor: pointer; } 
.branch_list > li .in .linkB { opacity: 0; transition: all .3s; transform: translateX(40px) } 
.branch_list > li .in .location {min-height: 3.2em;}
.branch_list > li .in:hover { border: 2px solid var(--siteC); border-radius: .5em; } 
.branch_list > li .in:hover .linkB { opacity: 1; } 
.logoico { position: relative; margin-right: 1.75em; } 
.logoico::before { content: ""; position: absolute; top: 50%; left: 0; width: 1.5em; height: 1.5em; transform: translateY(-50%); background-image: url(../images/inc/logoS.png); background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } 

.mem_imgC { width: 28%; border-radius: .8em; overflow: hidden; } 
.mem_DtxtC { width: 68%; } 
.mem_DtxtC .mem_tit { border-bottom: 1px dashed #ddd; } 

.kakao_popup { position: fixed; right: 90px; bottom: 140px; display: none; z-index: 9999; } 

.kakao_popup .popup_inner { background: #fff; padding: 20px 25px; width: 150px; border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25); position: relative; } 
.kakao_popup .popup_title { font-size: 15px; font-weight: 700; margin-bottom: 15px;} 
.branch_list.st2 li { width: 100%; margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px dashed #ddd; text-align: center;} 
.branch_list.st2 li:last-child {border-bottom: unset; margin-bottom: unset;}
.branch_list li a { color: #555; font-size: 14px; } 
.branch_list.st2 li:hover a {color: var(--siteC);}


/* 말풍선 아래 삼각형 */
.kakao_popup .arrow { position: absolute; bottom: 83px; left: 193px; width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 12px solid #fff; filter: drop-shadow(0 2px rgba(0, 0, 0, 0.1)); transform: rotate(-90deg); } 

/* 전체 래퍼 */
.searchContainer { max-width: 1000px; margin: 0 auto; padding: 40px 20px 100px; font-family: 'SeoulNamsan', 'Noto Sans KR', sans-serif; } 

/* 🎉 상단 검색결과 카드 */
.searchHeaderCard { background: linear-gradient(135deg, #1e4fd3, #6a8dff); color: #fff; padding: 35px 40px; border-radius: 18px; display: flex; align-items: center; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15); margin-bottom: 50px; } 

.searchHeaderCard .shIcon { font-size: 48px; margin-right: 25px; opacity: 0.9; } 

.searchHeaderCard .keyword_tit { font-size: 28px; font-weight: 800; margin-bottom: 8px; } 

.searchHeaderCard .keyword { color: #ffe25c; } 
.keyword { color: var(--siteC); font-weight: 700; } 

.searchHeaderCard .total { font-size: 16px; opacity: 0.9; } 

/* 구분선 */
.sectionDivider { height: 3px; background: #1e4fd3; margin: 50px 0; opacity: 0.45; border-radius: 2px; } 

/* 섹션 헤더 */
.sectionHeader { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; } 

.sectionAccent { width: 10px; height: 30px; background: #1e4fd3; border-radius: 6px; } 

.sectionHeader h3 { font-size: 22px; font-weight: 700; color: #222; } 

/* breadcrumb */
.breadcrumbWrap { display: flex; align-items: center; gap: 6px; margin-bottom: 20px; } 
.breadcrumbWrap .crumb { background: #e8edfb; padding: 5px 10px; border-radius: 6px; font-size: 14px; color: #1e4fd3; } 
.breadcrumbWrap i { font-size: 12px; color: #999; } 

/* 결과 카드 */
.resultCard { background: #ffffff; border: 1px solid #d9deea; padding: 30px 35px; border-radius: 16px; line-height: 1.8; font-size: 15px; color: #444; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.09); transition: 0.25s; } 

.resultCard:hover { transform: translateY(-3px); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.14); border-color: #c5cce0; } 

/* 강조 텍스트 */
.resultCard b,
.resultCard strong { color: #d6333a; } 

.imgbox {border: 1px solid #ddd; padding: 1em; border-radius: .8em; text-align: center;}
.imgbox img {margin: 0 auto;}

.step_Wrap{}
.step_Wrap > li{ position:relative; background: var(--siteC); margin-bottom: 5em;}
.step_Wrap > li .down_icon{ position: absolute; top: 99.5%; left: 66%; transform: translate(-50%, 17%); display: flex; align-items: center;}
.step_Wrap > li .down_icon > i{ color: var(--siteC); font-size: 1.65em;}
.step_Wrap > li .down_icon > span {width: 25em; display: inline-block; background: #f4f4f4; border: 1px solid #ddd; padding: .5em; margin-left: 2em;}
.step_Wrap > li:nth-child(2n-1) > .step_List{ background: var(--crGray6);}
.step_Wrap > li:nth-child(2n) > .step_List .iBox .icon_box{ background: #f9f9f9;}
.step_Wrap > li > .step_List{ border: 1px solid #ddd; padding: 1.5em; gap: 2em; align-items: center; }
.step_Wrap > li > .step_List .iBox{ flex: 1 1 15%; border-right: 2px dashed #ccc; padding-right: 2em; }
.step_Wrap > li > .step_List .iBox .step_Di{ text-align: center; background: var(--siteC); text-align: center; padding: .3em .5em; border-radius: .5em; margin-bottom: .5em;}
.step_Wrap > li > .step_List .iBox .step_Di > .tt{ text-transform: uppercase; font-size: .8em; color: #fff;}
.step_Wrap > li > .step_List .iBox .icon_box{ display: flex; align-items: center; justify-content: center; background: #fff; padding: 0.5em 1em; border-radius: 0.5em;}
.step_Wrap > li > .step_List .iBox .icon_box > img{ width: 3em;}
.step_Wrap > li > .step_List .tBox{ flex: 1 1 85%;}
.step_Wrap > li > .step_List .tBox .tbox_ttl{ margin-bottom: .5em;}
.step_Wrap > li > .step_List .tBox .tbox_ttl > .tt{ font-size: 1.05em; font-weight: 400; color: #fff;}
.step_Wrap > li > .step_List .tBox .tbox_ttl > .tt .xi {font-size: 1em; vertical-align: bottom;}

.con_st1 {}
.con_st1 li {}
.con_st1 li .arrow {margin:.5em 0; color: var(--siteC);}
.con_st1 li .in {gap: 1em;}
.con_st1 li .in .t1 {width: 25%; background: var(--siteC); color: #fff; height: 4em; line-height: 4em;}
.con_st1 li .in .t2 {width: 25%; background: #ffff; border: 1px solid var(--siteC); height: 4em; line-height: 4em;}
.con_st1 li .in .t3 {flex: 1; background: #f4f4f4; border: 1px solid #ddd; padding: .9em 0;}


/* 모바일 대응 */
@media (max-width: 768px){
 .searchHeaderCard { padding: 25px 25px; flex-direction: column; text-align: center; } 
 .searchHeaderCard .shIcon { margin-right: 0; margin-bottom: 10px; } 
 .searchHeaderCard .keyword { font-size: 22px; } 
 .resultCard { padding: 22px 22px; } 
 .sectionHeader h3 { font-size: 19px; } 
 }

.m_search { display: none !important;} 
.num { width: 1.5em; height: 1.5em; background-color: var(--siteC); border-radius: 50%; font-size: 0.85em; font-weight: 800; color: #fff; display: inline-block; display: flex; align-items: center; justify-content: center; min-width: 0; flex: 0 0 auto; } 
.dotted { position: relative; padding-left: 10px; display: inline; } 
.dotted::before { content: ""; position: absolute; top:10px; left: 0; width: 3px; height: 3px; background-color: var(--siteC); } 
.dotted2 { position: relative; padding-left: 12px; display: inline; } 
.dotted2::before { content: ""; position: absolute; top: 50%; left: 2px; width: 4px; height: 4px; background-color: var(--siteC); opacity: .5; transform: translateY(-50%); } 
.dotted2::after { content: ""; position: absolute; top: 50%; left: 0; width: 8px; height: 8px; background-color: var(--siteC); opacity: .3; transform: translateY(-50%); } 
/* .wrap { display: flex; align-items: center; gap: 50px; margin: 40px; }  */

/* 전체 레이아웃 */
.layout { display: flex; align-items: center; gap: 50px; margin: 40px; } 

/* 왼쪽 큰 원 */
.main-circle { width: 280px; height: 280px; background: #86aee0; color: #fff; display: flex; justify-content: center; align-items: center; border-radius: 50%; font-size: 20px; font-weight: 800; } 

/* 오른쪽 라벨 그룹 */
.label-group { display: flex; flex-direction: column; gap: 25px; } 

/* 오른쪽 라벨 개별 줄 */
.label-row { display: flex; align-items: center; gap: 10px; } 

/* 점 */
.label-dot { width: 16px; height: 16px; background: #1a4f80; border: 4px solid #cfe3f6; border-radius: 50%; } 

/* 점에서 박스로 이어지는 라인 */
.label-line { width: 40px; height: 2px; background: #7f8c8d; display: inline-block; } 

/* 텍스트 박스 */
.label-box { width: 600px; background: #cce6f8; padding: 15px 25px; border-radius: 30px; font-size: 16px; color: #333; }