@charset "utf-8"; /* CSS Document */
.box0 { width: var(--container-ultra-xxl); margin: 0 auto; max-width: 94%; } 
.box1 { width: var(--container-ultra-xxxxl); margin: 0 auto; max-width: 92%; } 
.box2 { width: var(--container-xxxl); margin: 0 auto; max-width: 92%; } 
.box3 { width: var(--container-lg); margin: 0 auto; max-width: 92%; } 
.box4 { width: var(--container-xl); margin: 0 auto; max-width: 92%; } 
.box5 { width: var(--container-xxl); margin: 0 auto; max-width: 92%; } 
.box_full { width:100vw; } 

.PC { display:block } 
.PHONE { display:none; } 

.gnb li.m_hide { display:none !important; } 
.gnb .layer { display:none !important; } 
body:not(.pop) { display:flex; flex-direction:column; min-height:100dvh; min-height:calc(var(--vh, 1dvh) * 100) } 
.scroll:not(.up) #header { transform: translateY(-100%); } 
#header .top_wrap { position: relative; color: #fff; transition: transform .5s; } 
#header .top_wrap .wrapH,
#header .top_wrap .gnb_wrap .dp1 { height: var(--headH); transition: .3s; } 
#header .top_wrap .etc_wrap { display: flex; gap: 2rem; } 
#header .top_wrap { } 
#header .top_wrap .wrapIn { padding: 0 2.5em; box-sizing: border-box; } 
#header .top_wrap .wrapIn { display:flex; align-items:center; justify-content:space-between; gap:0 1vw } 
#header .top_wrap .logo { } 
#header .top_wrap .logo > a { display: flex; align-items: center; } 
#header .top_wrap .logo > a img { filter: brightness(0) invert(1); height: 53px; object-fit: contain; display: block; } 

#header { position:fixed; top:0; left:0; width:100%; transition: transform .5s, background-color .5s, padding .5s; z-index:999999; } 
#header .gnb_wrap .gnb > li,
#header .gnb_wrap .gnb > li .dp1 { transition:height .2s, background .2s, padding .5s ease; box-sizing:border-box; } 
#header .gnb_wrap .gnb > li { position:relative; padding: 0 2.19rem; transition: width 0.5s, background-color 0.5s; } 
/* #header .gnb_wrap .gnb > li:before { position: absolute; right: -3px; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; border-radius: var(--radius-pill); background: rgba(255,255,255, .315); content: ''; } */
#header .gnb_wrap .gnb > li:last-of-type:before,
#header .gnb_wrap .gnb > li:nth-last-of-type(2)::before { display: none; } 
#header .gnb_wrap .gnb > li .dp1 { position:relative; justify-content: center; display: flex; align-items: center; } 
#header .gnb_wrap .gnb > li .dp1 .tt { font-size: var(--font-size-md-1); letter-spacing: 0; font-weight:600; text-transform:uppercase; transition: .3s; } 

#header .header_quick { width: 100%; background: var(--color-point); color: #fff; padding: .5rem 0; } 
#header .header_quick .wrapIn { gap: 3rem; } 
#header .header_quick .inMenu { gap: 2rem; display: flex; } 
#header .header_quick .inMenu li { font-weight: 500; position: relative; font-size: var(--font-size-sm); } 
#header .header_quick .inMenu li::before { position: absolute; content: ''; width: 1px; height: 70%; background: #fff; left: -1rem; top: 50%; transform: translateY(-50%); } 
#header .header_quick .inMenu li:nth-child(1):before { display: none; } 

#header .header_quick .telT { background: #fff; padding: 0.4rem 1rem; box-sizing: border-box; display: flex; align-items: center; gap: 1rem; border-radius: 100rem; } 
#header .header_quick .telT .tt { display: flex; align-items: center; color: var(--color-point); gap: 0.3em; font-size: var(--font-size-base); font-weight: 700; } 
#header .header_quick .telT .tt .xi { font-size: 1.05rem; } 

#header .top_wrap .gnb_wrap .gnb > li .dp2 { position: absolute; top: calc(100px - 20px); padding: 1rem 0; display: flex; flex-direction: column; left: 50%; transform: translateX(-50%); z-index: 99; width: 11rem; text-align: left; opacity: 0; visibility: hidden; transition: all 0.2s cubic-bezier(0.4, 0, 1, 1); } 
#header .top_wrap .gnb_wrap .gnb > li .dp2:before { content: ""; position: absolute; top: 0px; left: 0px; right: 0px; height: 0; background: #fff; box-shadow: 0.5em 0.5em 2em rgba(0, 0, 0, 0.1); transition: all 0.2s cubic-bezier(0.4, 0, 1, 1); border-radius: 1em; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li { position: relative; padding: .5rem 1.65rem; text-align: left !important; opacity: 0; transition: all 0s 0s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li { opacity: 1; transition: all 0.8s ease-in-out; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(1) { transition-delay: 0.1s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(2) { transition-delay: 0.2s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(3) { transition-delay: 0.3s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(4) { transition-delay: 0.4s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(5) { transition-delay: 0.5s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(6) { transition-delay: 0.6s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(7) { transition-delay: 0.7s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(8) { transition-delay: 0.8s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(9) { transition-delay: 0.9s; } 
#header .top_wrap .gnb_wrap .gnb > li.act .dp2 > li:nth-child(10) { transition-delay: 1s; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a { position:relative; display: inline-block; text-align: left !important; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a > .va > .tt { position:relative; font-weight: 600; font-size: var(--font-size-sm); color: rgba(0,0,0, .3); transition: .3s; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a > .va > .tt:before { position: absolute; content: attr(data-label); top: 0; left: 0; width: 0; height: 100%; color: var(--color-point2); white-space: nowrap; transition: all 0.2s ease-in-out; overflow: hidden; z-index: 9; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a > .va > .tt:hover:before { width: 100%; } 
#header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a > .va > .tt { } 

#header .top_wrap .gnb_wrap .gnb > li.more:hover .dp1 { } 
#header .top_wrap .gnb_wrap .gnb > li.more:hover .dp1:after { } 

#header .top_wrap .gnb_wrap .gnb > li:hover .dp2 { opacity:1; visibility: visible; } 
#header .top_wrap .gnb_wrap .gnb > li:hover .dp2:before { height: 100%; } 
#header .top_wrap .gnb_wrap .gnb > li .dp1.layer { display: none; } 
#header .top_wrap .gnb_wrap .gnb > li .dp3 { display: none; } 

#header .top_wrap .all { } 
#header .top_wrap .all_btn { } 
#header .top_wrap .all_btn .in { position: relative; display: block; width: 1.81rem; height: 1.25rem; margin-left: auto; } 
#header .top_wrap .all_btn .ham,
#header .top_wrap .all_btn .ham:before,
#header .top_wrap .all_btn .ham:after { display: block; width: 100%; height: 2px; background: #fff; transition: .2s, background 0s; } 
#header .top_wrap .all_btn .ham:before,
#header .top_wrap .all_btn .ham:after { content: ""; position: absolute; right: 0; } 
#header .top_wrap .all_btn .ham { width: 100%; } 
#header .top_wrap .all_btn .ham:before { left: 0; top: calc(50% - 1px); width: 100%; } 
#header .top_wrap .all_btn .ham:after { top: calc(100% - 1px); width: 100%; } 
#header .top_wrap .all_btn:hover .ham,
#header .top_wrap .all_btn:hover .ham:before { width: 100%; } 
#header .top_wrap .all_btn:hover .ham:after { width: 100%; } 

#header .top_wrap .all.on .all_btn .in { position:fixed; top:2em; right:3em; width:2.5em; height:2.5em; z-index:9999; } 
#header .top_wrap .all.on .all_btn .ham { background:transparent; transition:0s; } 
#header .top_wrap .all.on .all_btn .ham:before,
#header .top_wrap .all.on .all_btn .ham:after { width:100% !important; top:50% !important; margin-top:auto; background:#fff; } 
#header .top_wrap .all.on .all_btn .ham:before { transform:rotate(45deg); } 
#header .top_wrap .all.on .all_btn .ham:after { transform:rotate(-45deg); } 

.headLink { display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem; } 
.headLink > li { } 
.headLink > li > .inner { display: flex; align-items: center; gap: .35rem; justify-content: center; padding: 0 1rem; height: 2.25rem; background: rgba(255, 255, 255, .075); backdrop-filter: blur(5px); border: 1px solid #fff; border-radius: var(--radius-pill); transition: .3s ease; } 
.headLink > li > .inner > .tit { font-size: var(--font-size-xs); font-weight: 600; } 
.scroll .headLink > li > .inner { background: var(--color-point); color: #fff; border: 1px solid var(--color-point); } 

#header .searchInc .wrapIn { width: 20em; padding: 0; } 
#header .searchInc .wrapIn form { width: 100%; } 
#header .searchInc .wrapF { display: flex; flex-direction: column; gap: 0.5em; } 
#header .searchInc .formW { --searchIncInpH: 7vmin; position: relative; display: flex; align-items: flex-end; justify-content: center; width: 100%; border: none; box-sizing: border-box; border-width: 1px; border-color: #ccc; border-style: solid; border-image: initial; padding: 0.4rem; border-radius: 100px; } 
#header .searchInc .formW .inp { width: 100%; font-size: var(--font-size-sm); line-height: 2.3; padding: 0 1rem; box-sizing: border-box; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; } 
#header .searchInc .formW .inp::placeholder { color: #fff; } 
.scroll #header .searchInc .formW .inp::placeholder { color: #666; } 
#header .searchInc .formW .btn { border: none; color: #fff; background: var(--color-point); padding: .5rem .6rem; box-sizing: border-box; border-radius: 100rem; } 
.searchOn#header .top_wrap::before { position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.7); } 
.searchOn#header ~ #contents .visualSlide_wrap { z-index:-1; } 

#quick_inquiry { position: fixed; z-index: 999; bottom: 2rem; left: 1.5vw; width: 28rem; border-radius: var(--radius-md); overflow: hidden; } 
#quick_inquiry.on { display: none; } 
#quick_inquiry .inquiryHead { display: flex; align-items: center; background: var(--color-point); padding: .85rem 1.5rem; box-sizing: border-box; justify-content: space-between; gap: 1rem; } 
#quick_inquiry .inquiryHead .tit { font-size: var(--font-size-base); font-weight:700; color: #fff; } 
#quick_inquiry .inquiryHead .close { color: #fff; } 
#quick_inquiry .formInner { background: #fff; padding: 1rem 1.5rem 1.5rem 1.5rem; box-sizing: border-box; } 
#quick_inquiry .formInner .tx { font-size: var(--font-size-sm); font-weight: 600; color: var(--color-point); } 
#quick_inquiry .formInner .formItem { padding-bottom: var(--space-2); } 
#quick_inquiry .formInner .formItem .input_st { font-size: var(--font-size-sm-1); } 

.scroll #header { background: #fff; color: var(--color-black-3); box-shadow: 0px 0px 15px rgba(18, 18, 18, 0.15); } 
.scroll #header .top_wrap { color: var(--color-black-3); } 
.scroll #header .top_wrap .logo > a img { filter: none; } 
.scroll #header .top_wrap .all_btn .ham,
.scroll #header .top_wrap .all_btn .ham:before,
.scroll #header .top_wrap .all_btn .ham:after { background: var(--color-black-3); } 
/* .scroll #header .top_wrap .wrapH,
.scroll #header .top_wrap .gnb_wrap .dp1 { height: 6.5rem; } */
/* .scroll #header .gnb_wrap .gnb > li:before { background: var(--color-black); opacity: .15; } */

#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; } 
#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 { display: flex; align-items: center; justify-content: center; width: 5em; height: 5em; background: var(--color-point2); 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: 4em; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img { display: flex; align-items: center; justify-content: center; width: 25%; 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; gap: 1rem; } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_img .wrap_img_txt > p { font-size: 2.5rem; color: #fff; } 
#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.7), transparent); } 
#header .all_wrap .all_layer .all_inner > .wrap_in .wrap_middle { width: 60%; height: 100vh; overflow-y: scroll; padding-top: 3em; } 
#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(--color-point2); border-color: var(--color-point2); } 

#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: 2rem 1rem; box-sizing: border-box; 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: 43vw; gap: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 a.layer { display: none; } 
/* #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(--color-point2); } */
#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: 1.5em; font-weight: 700; color: #111; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .arrow { display: inline-block; margin-bottom: 1.175em; margin-left: 0.5em; width: .35em; height: .35em; background: var(--color-point2); 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(--color-point2); 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(--color-point2); } 
#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; } 

#header .all_wrap .all_layer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; transform: translateY(-100%); opacity: 0; visibility: hidden; transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease; z-index: 998; background: #fff; } 
.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; } 


#header .top_wrap .all.on .all_btn .in { width:2.5rem; height:2.5rem; z-index:999999999; } 
#header .top_wrap .all.on .all_btn .ham { background:transparent; transition:0s; } 
#header .top_wrap .all.on .all_btn .ham:before,
#header .top_wrap .all.on .all_btn .ham:after { width:100% !important; top:50% !important; margin-top:auto; background: #fff; } 
#header .top_wrap .all.on .all_btn .ham:before { transform:rotate(45deg); } 
#header .top_wrap .all.on .all_btn .ham:after { transform:rotate(-45deg); } 
#header .top_wrap .all.on .siteBg { transform: translate(-50%,-50%) scale(100) } 

/* .allGnbOn { overflow-y:hidden } 
.allGnbOn body { overflow-y:scroll } 
.allGnbOn #header .all_wrap .all_layer .all_inner .innerGuide { opacity: 1; } 
.allGnbOn #header .all_wrap .all_layer .all_inner .innerLink .linkContainer,
.allGnbOn #header .all_wrap .all_layer .all_inner .innerBg { opacity: 1; transform: translateY(0); } 
.allGnbOn #header .all_wrap .all_layer .all_inner .innerBg .Bginner > .title { opacity: 1; transform: translateX(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 } 


/*quick*/
#quick_new { position:fixed; z-index:999; bottom:2rem; right:1.5vw; text-align:right; overflow: hidden; transform: translateY(0); transition: .5s var(--ani-1); filter: drop-shadow(0 3.2px 19.2px rgba(0, 0, 0, 0.16)); -webkit-filter: drop-shadow(0 3.2px 19.2px rgba(0, 0, 0, 0.16)); } 
html.main:not(.scroll) #quick_new { opacity: 0; visibility: hidden; } 
html:not(.scroll) #quick_new > li { transform: translateY(4rem); } 
#quick_new .quick_wrap { position:relative; display: inline-flex; width:4.85rem; min-height: 4rem; box-sizing:border-box; transition:width .3s; padding: .85rem 0 .75rem 0; border-radius: var(--radius-sm); box-sizing: border-box; } 
#quick_new .quick_wrap > .in { position:relative; display: flex; flex-direction: column; } 
#quick_new .quick_wrap > .in .tt { font-weight: 800; font-size: var(--font-size-xs); line-height: 1; letter-spacing: -1px; } 
#quick_new > li { margin-bottom: .5rem; transition: .5s var(--ani-1); } 
#quick_new > li:last-of-type { margin-bottom: 0; } 
#quick_new > li .quick_wrap .quick_icon { text-align:center; font-size: var(--font-size-xxxs); margin-bottom: .0876rem; } 
#quick_new > li .quick_wrap .quick_icon > .xi { line-height: 1; } 
#quick_new > li .quick_wrap .icon { } 
#quick_new > li .quick_wrap .icon > img { width: 30px; height: 35px; object-fit: contain; } 
#quick_new > li .quick_wrap.inquiry .icon { filter: var(--crWhitefil); } 
#quick_new.top { bottom: 320px; padding-bottom: .5em; } 

#quick_new > li .goTop { color:#fff; background: var(--color-black-2); transition: .5s var(--ani-1); } 
#quick_new > li .inquiry { color: #fff; background: var(--color-point2); } 
#quick_new > li .faq { background: #fff; color: var(--color-black); } 

/*all*/
.vod_wrap { position:relative; width: 100%; height: 100%; } 
.vod_wrap .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 

.smRound { width: 2rem; height: 2rem; border-radius: 50%; background: var(--color-point); display: flex; align-items: center; justify-content: center; } 
.smRound > .xi { transform: rotate(-45deg); font-size: var(--font-size-sm); color: #fff; transition: .3s ease; } 

.smRound.s1 { width: 2.5rem; height: 2.5rem; } 

.vod_wrap { position:relative; width: 100%; height: 100%; } 
.vod_wrap .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 

.visualSlide_wrap { position: relative; height:calc(var(--vh, 1vh) * 100); box-sizing: border-box; } 
.visualSlide { position: relative; height: 100%; overflow: hidden; } 

.visualSlide .swiper-wrapper > .el { background: #000; } 
.visualSlide .swiper-wrapper > .el .bg { position:absolute; left:0; top:0; width:100%; height:100%; transform: scale(1); transition: 4s ease; } 
.visualSlide .swiper-wrapper > .el .bg:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .25) 100%); content: ''; } 
.visualSlide .swiper-wrapper > .el .bg > img { height: 100%; object-fit: cover; width: 100%; } 
.visualSlide .swiper-wrapper > .el .vod_wrap { position: relative; } 
.visualSlide .swiper-wrapper > .el .vod_wrap:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .25) 100%); content: ''; z-index: 1; } 
.visualSlide .slogan_wrap { position: absolute; top: 47%; transform: translateY(-50%); width: 100%; z-index: 2; } 
.visualSlide .slogan_wrap .slogan .title { overflow: hidden; } 
.visualSlide .slogan_wrap .slogan .title > .t1 { font-size: var(--font-size-xxxl); line-height: 1.3; font-weight: 800; color: #fff; transform: translateY(100%); transition: 1.4s ease; text-shadow: 0 0 20px rgb(17 17 17 / 16%); } 
.visualSlide .slogan_wrap .slogan .title > .t1 > .c1 { color: var(--color-point4); } 
.visualSlide .slogan_wrap .slogan .title > .t1 > .c2 { color: var(--color-point2); } 
.visualSlide .slogan_wrap .slogan .txt_wrap { } 
.visualSlide .slogan_wrap .slogan .txt_wrap .desc { font-size: var(--font-size-md); line-height: var(--line-height-normal); margin-top: var(--space-2); color: rgba(255,255,255, .915); font-weight: 300; transform: translateX(6rem); opacity: 0; transition: 1.4s ease .6s; text-shadow: 0 0 20px rgb(17 17 17 / 16%); } 
.visualSlide .slogan_wrap .slogan .btn_Wrap { transform: translateX(4rem); opacity: 0; filter: blur(5px); transition: 1s all 1s; } 
.visualSlide .el.swiper-slide-active .bg { transform: scale(1.05); } 

.load .visualSlide .el.swiper-slide-active .slogan_wrap .slogan .txt_wrap .desc { opacity: 1; transform: translateX(0); } 
.load .visualSlide .el.swiper-slide-active .slogan_wrap .slogan .title > .t1 { transform: translateY(0); } 


.visualSlide_wrap .visualControl { color: #fff; margin-top: var(--space-6); position: absolute; left: 50%; top: 70%; width: var(--container-xxxl); margin: 0 auto; max-width: 92%; transform: translate(-50%, -50%); z-index: 10; } 
/* .visualSlide_wrap .visualControl.posiB { padding: 1rem 2rem 1rem 3.5rem; z-index: 100; border-radius: var(--radius-posi-2) var(--radius-posi-2) 0 0; } */
.visualSlide_wrap .visualControl .control { display: flex; align-items: center; gap: .5rem; margin-left: -1rem; } 
.visualSlide_wrap .visualControl .control .progress-container { display: flex; align-items: center; gap: .85rem; } 
.visualSlide_wrap .swiperControl .paging.dot { display: flex; align-items: center; gap: var(--gap-xs); } 
.visualSlide_wrap .swiperControl .paging.dot span { width: 20px; background: transparent; opacity: 1; } 
.visualSlide_wrap .visualControl .control .progress-container .progress-bar { position: relative; display: block !important; bottom: 0; width: 100px; height: 3px; background: rgba(0,0,0, .15); } 
.visualSlide_wrap .visualControl .control .progress-container .progress-bar .swiper-pagination-progressbar-fill { background: #fff; } 
.visualSlide_wrap .visualControl .control .progress-container .current-slide,
.visualSlide_wrap .visualControl .control .progress-container .total-slide { font-size: var(--font-size-sm-1); min-width: 1.25rem; line-height: 1; font-weight: 800; } 
.visualSlide_wrap .visualControl .control .swiperPauseWrap .swiperBtn { background: transparent; } 
.visualSlide_wrap .visualControl .control .swiperPauseWrap .swiperBtn:hover { color: var(--color-point); } 
.visualSlide_wrap .visualControl .control .swiperPauseWrap .swiperBtn:before { font-size: var(--font-size-md); } 

.swiper-button-lock { display: flex !important; } 

.circle-chart-container { position: relative; display: inline-block; } 
.circle-chart { transform: rotate(-90deg); } 
.circle-chart circle { transition: stroke-dashoffset 1s ease; } 
.circle-chart circle:first-child { stroke: #e6e6e6; } 

.circle-progress { stroke: #fff; stroke-dasharray: 75.398; stroke-dashoffset: 75.398; } 
.swiper-pagination-bullet-active .circle-progress { animation: fillCircle 8s linear forwards; } 

@keyframes fillCircle { 
 0% { stroke-dashoffset: 75.398; } 
100% { stroke-dashoffset: 0; } 
 }

.mainScroll { position:absolute; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 99; } 
.mainScroll .inner { align-items: center; justify-content: center; } 
.mainScroll .tt { display:block; text-align: center; color: #fff; font-size: var(--font-size-sm); margin-bottom: var(--space-2); font-weight: 400; } 
.mainScroll .mouseImg { position:relative; } 
.mainScroll .mouseImg > .point { width: 1px; height: 35px; background: rgba(255, 255, 255, 0.2); margin: 0 auto; position: relative; overflow: hidden; } 
.mainScroll .mouseImg > .point > span { display: block; width: 1px; height: 200%; background: #fff; position: absolute; top: 0; left: 0; bottom: auto; -webkit-animation: scroll 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; animation: scroll 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } 

@-webkit-keyframes scroll { 
 0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); } 
to { -webkit-transform: translateY(50%); transform: translateY(50%); } 
 }

@keyframes scroll { 
 0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); } 
to { -webkit-transform: translateY(50%); transform: translateY(50%); } 
 }
.mainScroll .mouseImg > img { width: 100%; height: 30px; object-fit: contain; filter: var(--crWhitefil); } 

/* 인사말 */
.greet_wrap { } 
.greet_wrap .greet-top { margin-bottom: 1rem; } 
.greet_wrap .greet-top .t1 { font-size: var(--font-size-xl); line-height: var(--line-height-normal); font-weight: 500; } 
.greet_wrap .greet-top .cp-2 { font-weight: 700; } 
.greet_wrap .greet-con { gap:4.5rem; /* padding: 0 3em; */ } 
.greet_wrap .greet-con .img_wrap { width: 42%; } 
.greet_wrap .greet-con .img_wrap .img { width: 100%; margin-top: -5em; padding-bottom: 120%; position: relative; border-radius: 5rem 0 5rem 0; } 
.greet_wrap .greet-con .img_wrap .img::before { content: ''; position: absolute; right: -6em; bottom: -7em; width: 80%; padding-bottom: 80%; border-radius: 50%; background: linear-gradient(0deg, #fff 0%, var(--color-point2) 50%, #fff 100%); animation-name: mainServiceAni4; animation-duration: 13s; animation-iteration-count: infinite; animation-direction: alternate; filter: blur(10px); opacity: .25; z-index: -2; } 
/* .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: 1.6rem; } 
.greet_wrap .greet-con .txt_wrap .t1 { color: #333; font-size: var(--font-size-base); line-height: var(--line-height-normal); } 
.greet_wrap .greet-con .txt_wrap .t1 + .t1 { margin-top: 1.7rem; } 
.greet_wrap .greet-con .txt_wrap .ceo { margin-top: 1rem; padding-right: 3em; font-size: var(--font-size-lg-1); font-weight: 600; text-align: right; } 
.greet_wrap .greet-con .txt_wrap p.ceo .sign { position:relative; top: 1rem; } 
.greet_wrap .greet-con .txt_wrap p.ceo .sign > img { width: 100%; height: 50px; object-fit: contain; } 

@keyframes mainServiceAni { 
 0% { transform: rotate(0) translate(0, 0) scale(1) } 
 100% { transform: rotate(360deg) translate(20%, 5%) scale(1.2, 1); } 
 }
@keyframes mainServiceAni2 { 
 0% { transform: rotate(0) translate(0, 0) scale(1) } 
 100% { transform: rotate(360deg) translate(10%, 5%) scale(1.2, 1); } 
 }
@keyframes mainServiceAni3 { 
 0% { transform: rotate(0) translate(0, 0) scale(1) } 
 100% { transform: rotate(-360deg) translate(10%, 5%) scale(1.2, 1); } 
 }
 @keyframes mainServiceAni4 { 
 0% { transform: rotate(0deg) translate(0, 0) scale(1); } 
 100% { transform: rotate(90deg) translate(-15%, -10%) scale(1.1, 1.3); } 
 }
@keyframes mainServiceAni5 { 
 0% { transform: rotate(0deg) translate(0, 0) scale(1); } 
 100% { transform: rotate(-180deg) translate(-25%, 15%) scale(1.4, 0.9); } 
 }
@keyframes mainServiceAni6 { 0%, 100% { transform: rotate(0deg) translate(0, 0) scale(1); } 
 50% { transform: rotate(180deg) translate(15%, -15%) scale(1.2, 1.1); } 
 }

/* */
#sec_notice .box1 { position:relative; } 
#sec_notice .notice,
.mainNoticeSlide { height:4em } 
 #sec_notice .notice { position: relative; overflow: hidden; width: 100%; box-sizing: border-box; background: var(--color-point2); color:#fff; padding:0 2.5rem; border-radius: var(--radius-sm); margin-bottom:4em; gap:0 2em; z-index: 99; } 
#sec_notice .notice .tit_wrap { display:flex; align-items:center; gap:0 .25em } 
#sec_notice .notice .tit_wrap .ico { font-size:1.5em } 
#sec_notice .notice .tit_wrap .ico:before { content:"\ea59"; animation-name: noticeIcoAni; animation-duration:2s; transform-origin:center; animation-timing-function:linear; animation-iteration-count: infinite } 
#sec_notice .notice .tit_wrap .tt { font-weight:600; font-size:var(--font-size-base) } 
@keyframes noticeIcoAni {33% { content:"\ea5a" } 
66% { content:"\ea5b" } 
 }
.mainNoticeSlide .el { height:100% } 
.mainNoticeSlide .el .in { height:100%; display:flex; align-items:center; } 
.mainNoticeSlide .el .in .tt { flex:1 1 0%; min-width:0; font-size:1.063em } 
.mainNoticeSlide .el .in:hover .tt { text-decoration:underline } 
.mainNoticeSlide .el .in .date { opacity:.6; margin-left:2em } 
.mainNoticeSlide_control { height:100%; display:flex; flex-direction:column } 
.mainNoticeSlide_control > a { display: flex; align-items: center; justify-content: center; height:50%; width:3em; text-align:center; box-sizing:border-box; border:1px solid rgba(255,255,255,.2); border-bottom:none } 
.mainNoticeSlide_control > a .xi { font-size:1em } 
.mainNoticeSlide_control > a.prev .xi:before { content:"\e944" } 
.mainNoticeSlide_control > a.next .xi:before { content:"\e941" } 
.mainNoticeSlide_control > a:hover { background:rgba(0,0,0,.2) } 

/* */
#sec_best { overflow: hidden; } 
#sec_best .best-container { } 
.products .main_tab { gap: 0.5rem; margin-bottom: var(--space-5); } 
.products .main_tab li { cursor: pointer; padding: .6rem 1.5rem; box-sizing: border-box; border: 1px solid #ccc; border-radius: 100px; font-weight: 500; color: #333; font-size: var(--font-size-base); } 
.products .main_tab li.on { background: var(--color-point); color: #fff; font-weight: 600; border-color: var(--color-point); } 

.ProductList { display: flex; flex-wrap: wrap; gap: 3.5rem 1.5rem; } 
.ProductList > li { width: calc((100% - 4.5rem) / 4); } 
.ProductList > li .imgWrap { position: relative; padding: 3rem; box-sizing: border-box; border: 1px solid #ccc; border-radius: var(--radius-md); transition: 0.2s ease-in-out; } 
.ProductList > li .imgWrap:hover { border: 1px solid var(--color-point); box-shadow: 0px 0px 10px rgba(25, 71, 186, 0.2); } 
.ProductList > li .imgWrap .imgBox { width: 100%; height: auto; } 
.ProductList > li .imgWrap .imgBox img { width: 100%; height: 11rem; object-fit: contain; transition: 0.2s ease-in-out; } 
.ProductList > li .imgWrap .cateWrap { display: flex; gap: 0.5rem; position: absolute; left: 1rem; top: 1rem; } 
.ProductList > li .imgWrap .cateWrap li { padding: 0.3rem .8rem; border-radius: 100rem; box-sizing: border-box; color: #fff; font-weight: 500; font-size: var(--font-size-sm-1); } 
.ProductList > li .imgWrap .cateWrap li.c1 { background: #E13939; } 
.ProductList > li .imgWrap .cateWrap li.c2 { background: #4F47E3; } 

.ProductList > li .txtWrap { margin-top: 1.5rem; } 
.ProductList > li .txtWrap .t1 { font-size: var(--font-size-md-1); font-weight: 700; } 
.ProductList > li .txtWrap .t1:hover { text-decoration: underline; text-underline-offset: 4px; } 
.ProductList > li .txtWrap .t2 { font-size: var(--font-size-base); font-weight: 500; color: #555; margin-top: 0.45rem; } 

.ProductList > li .in { position: relative; display: block; } 
.ProductList > li .in:hover .imgWrap .imgBox img { transform: scale(1.15); } 

/* */
#sec_business { position:relative; overflow:hidden; padding:10vmin 0 } 
#sec_business .wrapF { } 
#sec_business .wrap_con { display:flex; gap:2vmin } 
#sec_business .wrap_con .el { flex:1 1 auto; width:calc(50% - 1vmin); height:40vmin; position:relative; transition:.5s; overflow:hidden } 
#sec_business .wrap_con .el .bg { position:relative; height:100%; /* filter:grayscale(1); */ } 
#sec_business .wrap_con .el .bg:after { content:""; z-index: 2; position:absolute; left:0; top:0; width:100%; height:100%; /* background:#fff; */ opacity:.5 } 
#sec_business .wrap_con .el .bg::before { content:""; z-index: 2; position:absolute; left:0; top:0; width:100%; height:100%; /* background:#fff; */ opacity:.5; z-index: 100; transition:0.3s ease-in } 
#sec_business .wrap_con .el .con { position:absolute; z-index: 10; left:0; top:0; width:100%; height:100%; display:flex; flex-direction:column; color:#fff; box-sizing:border-box; padding:5vmin } 
#sec_business .wrap_con .el .con .s_tit { font-size: var(--font-size-base); font-weight: 600; margin-bottom: var(--space-1); display: none; } 
#sec_business .wrap_con .el .con .t1 { font-size: var(--font-size-lg-2); font-weight:700; /* opacity: 0; */ margin-bottom: var(--space-2); text-align: center; transform: translateY(110px); } 
#sec_business .wrap_con .el .con .t2 { font-size:var(--font-size-base); line-height: var(--line-height-normal); opacity:0; transform:translateY(50%); } 
#sec_business .wrap_con:not(:hover) .el:first-child,
#sec_business .wrap_con .el:hover { flex:0 0 auto; width:58% } 
#sec_business .wrap_con .el:first-child .bg:after,
#sec_business .wrap_con .el .bg:after { opacity:.35; background:#000; transition:1s } 
#sec_business .wrap_con:not(:hover) .el:first-child .bg::before,
#sec_business .wrap_con .el:hover .bg::before { opacity:.35; background: linear-gradient(180deg,rgba(25, 71, 186, 1) 0%, rgba(25, 71, 186, 0) 60%); } 
#sec_business .wrap_con:not(:hover) .el:first-child .bg,
#sec_business .wrap_con .el:hover .bg { filter:grayscale(0); transition:1s } 

#sec_business .wrap_con:not(:hover) .el:first-child .con .t1,
#sec_business .wrap_con .el:hover .con .t1 { text-align: left; } 

#sec_business .wrap_con:not(:hover) .el:first-child .con .t2,
#sec_business .wrap_con .el:hover .con .t2 { opacity:1; transform:translateY(0); transition:.5s; transition-delay:.2s; color: #fff; text-align: left; } 

#sec_business .wrap_con:not(:hover) .el:first-child .con .s_tit,
#sec_business .wrap_con .el:hover .con .s_tit { display: block; transition: 0.2s ease-in-out; } 

#sec_business .wrap_con:not(:hover) .el .con .t1 { color: #fff; } 
#sec_business .wrap_con:not(:hover) .el:first-child .con .t1,
#sec_business .wrap_con .el:hover .con .t1 { transform: translateY(0); } 

/* */
#sec_example { position: relative; } 
#sec_example .page_mq { position: absolute; width: 100%; left: 0; bottom: -1.25em; z-index: -1; } 
#sec_example > .box1 { position: relative; z-index: 10; } 
.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: rgba(255,255,255); } 
.page_mq .mqTT.c2 { color: #eee; } 
.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: 800; line-height: 1; } 
.page_mq .mv_tit .tit.fs1 { font-size: 12.5em; } 
.page_mq .mv_tit .tit.fs2 { font-size: 20em; } 

.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; } 

.exampleWrap .Topin_wrap { } 
.exampleWrap .Topin_wrap .main_tit { gap: 4rem; } 
.exampleWrap .Topin_wrap .exampleControl .control { display: flex; gap: 0.5em; } 
.exampleWrap .Topin_wrap .exampleControl .swiperBtn { width: 4.19rem; height: 4.19rem; background: #fff; border: 1px solid #ccc; text-align: center; line-height: 4.19rem; } 
.exampleWrap .Topin_wrap .exampleControl .swiperBtn.next:hover { color: #111; } 
.exampleWrap .Topin_wrap .exampleControl .swiperBtn.prev { background: var(--color-black-5); color: #fff; border-color: var(--color-black-5); } 

.exampleSlide { filter: drop-shadow(0 0 0.8em rgba(0, 0, 0, .25)); } 
.exampleSlide .el .in { display: block; } 
.exampleSlide .el .in .imgWrap { border-radius: 1rem 1rem 0 0; overflow: hidden; width: 100%; height: 14.5rem; } 
.exampleSlide .el .in .imgWrap img { width: 100%; height: 100%; object-fit: cover; } 
.exampleSlide .el .in .txtWrap { background: #fff; border-radius: 0 0 1rem 1rem; padding: 1.5em; box-sizing: border-box; } 
.exampleSlide .el .in .txtWrap .tit { font-size: var(--font-size-md-1); font-weight: 700; margin-bottom: var(--space-1); } 
.exampleSlide .el .in .txtWrap .tt { font-size: var(--font-size-sm); font-weight: 500; color: #555; min-height: 2.9rem; } 
.exampleSlide .el .in .txtWrap .date { font-size: var(--font-size-sm); margin-top: var(--space-5); text-align: right; color: #666; } 

/* */
#sec_inquiry { position: relative; } 
#sec_inquiry::before { position: absolute; content: ''; width: 57%; background: rgba(0, 0, 0, 0.6); height: 100%; top: 0; right: 0; z-index: 1; } 
#sec_inquiry .inWrap { gap: 12rem; position: relative; z-index: 3; } 
#sec_inquiry .inWrap .leftWrap { color: #fff; width: 50%; } 
#sec_inquiry .inWrap .leftWrap .tel_wrap { padding:1em; background-color:rgb(25, 71, 186, 0.5); color:#fff; font-size:1.5rem; font-weight:500; margin-bottom:1em; border:1px solid #bbb; transition: 0.2s ease-in-out; width:100%; box-sizing:border-box; backdrop-filter: blur(5px); } 
#sec_inquiry .inWrap .leftWrap .tel_wrap:hover { background-color:#fff; color:var(--color-point); } 
#sec_inquiry .inWrap .leftWrap .tel_wrap .tel { display:flex; flex-direction:row; gap:0.5em; align-items:center; justify-content: center; } 
#sec_inquiry .inWrap .leftWrap .tel_wrap .tel i { font-size:1.2em; } 
#sec_inquiry .inWrap .leftWrap .quick_menu { display: flex; } 
#sec_inquiry .inWrap .leftWrap .quick_menu .in { display: block; transition: 0.2s ease-in-out; padding: 3.5rem 0; width: 50%; box-sizing: border-box; border: 1px solid #bbb; background: rgba(17, 17, 17, 0.25); color: #fff; text-align: center; backdrop-filter: blur(5px); } 
#sec_inquiry .inWrap .leftWrap .quick_menu .in:hover { background: #fff; color: var(--color-point); border-color: #fff; } 
#sec_inquiry .inWrap .leftWrap .quick_menu .in:hover img { filter: brightness(0) saturate(100%) invert(20%) sepia(92%) saturate(2910%) hue-rotate(218deg) brightness(90%) contrast(95%); } 
#sec_inquiry .inWrap .leftWrap .quick_menu .in:last-child { border-left: none; } 
#sec_inquiry .inWrap .leftWrap .quick_menu .in .txt { font-size: var(--font-size-base); margin-top: 1rem; font-weight: 600; } 

#sec_inquiry .inWrap .rightWrap { color: #fff; width: 80%; } 
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li:before { background: rgba(255, 255, 255, 0.25); backdrop-filter: blur(20px); } 
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap .input_st { color: #fff; } 
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap .input_st:not(textarea) { padding-left: 7rem; } 
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap select,
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap .input_st:not(textarea)::placeholder { color: #fff; } 
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap .input_st.w1,
#sec_inquiry .inWrap .rightWrap .form_wrap .form > li .inp_wrap .captcha_wrap .input_st { padding-left: 10rem; } 


#headerQ { position:fixed; right: 0; top:0; height: calc(var(--vh, 1vh) * 100); z-index: 999999; transform: translateX(100%); display:flex; transition: ease 0.5s } 
#headerQ.on { transform: translateX(0); box-shadow:none } 
#headerQ.on .quickBtn .ico { transform:rotate(180deg) } 
#headerQ .quick_wrap { position:relative; background: var(--color-point); box-sizing:border-box; width: 24rem; overflow-y: auto; background-size: cover; } 
#headerQ .quick_wrap:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; opacity: .915; } 
#headerQ .quick_wrap .quick_btmImg { width: 100%; height: 12.5rem; } 
#headerQ .quick_wrap .quick_btmImg > img { width: 100%; height: 100%; object-fit: cover; } 
#headerQ .quick_wrap .wrap_in { position:relative; box-sizing:border-box; gap:2em 0; margin: 3.5rem 0; } 
#headerQ .quick_wrap .wrap_in .link { padding: 0 1.5rem; box-sizing: border-box; } 
#headerQ .quick_wrap .wrap_in .logoW { padding: 0 2.5rem; } 
#headerQ .quick_wrap .wrap_in .logoW > img { height: 40px; object-fit: contain; filter: var(--crWhitefil); } 
#headerQ .quick_wrap .link .list { margin:-.5em } 
#headerQ .quick_wrap .link .list > li { width:33.33% } 
#headerQ .quick_wrap .link .list > li > a { display:block; margin:.5em; text-align:center; box-sizing:border-box; padding:.5rem 0 } 
#headerQ .quick_wrap .link .list > li > a .ico { height:3em } 
#headerQ .quick_wrap .link .list > li > a .ico img { height:100% } 
#headerQ .quick_wrap .link .list > li > a .t1 { display:block; font-size:1.063em; margin-top:1em } 
#headerQ .quick_wrap .link .guide_top { padding-bottom: 1.8em; } 
#headerQ .quick_wrap .link .guide_top .tit { gap: .6rem; margin-bottom: var(--space-1); } 
#headerQ .quick_wrap .link .guide_top .tit .img img { height: 3rem; } 
#headerQ .quick_wrap .link .guide_top .t1 { font-size: var(--font-size-md); font-weight: 700; margin-bottom: .5rem; background: #fff; color: var(--color-point); display: flex; align-items: center; justify-content: center; border-radius: var(--radius-sm); padding: 0.3em 0; box-sizing: border-box; margin-top: var(--space-3); } 
#headerQ .quick_wrap .link .guide_top .t1 .xi { font-size: 1.35rem; } 
#headerQ .quick_wrap .link .guide_top .t2 { font-weight: 600; font-size: var(--font-size-lg-2); color: #fff; } 
#headerQ .quick_wrap .link .guide_top .t3 { font-size: var(--font-size-sm); font-weight: 500; line-height: 1.6; color: rgba(255,255,255, .8); word-break: keep-all; } 
#headerQ .quick_wrap .link .guide_mid { padding: 1em; box-sizing: border-box; background: #fff; border-radius: var(--radius-md); } 
#headerQ .quick_wrap .link .guide_mid .g_agree { margin-top: 1.5em; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li { margin-bottom: .5em; flex-wrap: nowrap; gap: 1em; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li > label { position:relative; font-size: 16px; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li > label > span { font-size: var(--font-size-sm); margin-left: 5px; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li > a { font-size: 16px; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li:last-of-type { margin-bottom: 0em; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li:first-of-type { margin-bottom: 1em; } 
#headerQ .quick_wrap .link .guide_mid .g_agree > li > a > p { color: #fff; font-size: .915em; text-decoration: underline; } 
#headerQ .quick_wrap .link .guide_mid .g_tell { position:relative; text-align: center; margin-top: 1rem; } 
#headerQ .quick_wrap .link .guide_mid .g_tell > p { position:relative; font-size: 2.85rem; font-weight: 600; } 
#headerQ .quick_wrap .link .guide_mid .g_tell > p > i { font-size: .85rem; margin-right: .35rem; } 
#headerQ .quick_wrap .link .guide_mid .g_info { } 
#headerQ .quick_wrap .link .guide_mid .g_info > .item { margin-bottom: .5rem; } 
#headerQ .quick_wrap .link .guide_mid .g_info > .item:last-of-type { margin-bottom: 0; } 
#headerQ .quick_wrap .pop { margin-top:auto } 
#headerQ .quick_wrap .pop .control { margin-top:.5rem } 
#headerQ .quick_wrap .main_tit { margin-bottom:1em } 
#headerQ .quickBtn { position: absolute; left: .1rem; top: 50%; gap: 2rem; transform: translate(-3.6em,-50%); background: var(--color-point); display: flex; align-items: center; justify-content: center; padding: 1.5em 0; box-sizing: border-box; writing-mode: vertical-lr; width: 3.6rem; border-top-left-radius: .315rem; border-bottom-left-radius: .315rem; box-shadow: -8px 0 18px rgba(0,0,0, .15); } 
#headerQ .quickBtn.ty1 { top: calc(26% + 195px); background: var(--color-point2); } 
#headerQ .quickBtn > p { font-weight: 600; color: #fff; letter-spacing: 2px; font-size: .915rem; } 
#headerQ .quickBtn > i { color: rgba(255,255,255, .6); font-weight: 500; } 
#headerQ .quickBtn .ico { transition:.3s } 
#headerQ .quickBtn .ico:before { content:"\e93e" } 
#headerQ.on { transform: translateX(0); box-shadow:none } 
#headerQ.on .quickBtn .ico { transform:rotate(180deg) } 




/*main tit*/
.main_tit { position:relative; margin-bottom: var(--space-6); } 
.main_tit.white > * { color: #fff !important; } 
.main_tit.white .line { background: #fff !important; } 
.main_tit.mb0 { margin-bottom: 0; } 
.main_tit .cate { font-size: var(--font-size-md); font-weight: 500; margin-bottom: var(--space-4); color: var(--color-point2); } 
.main_tit.white .cate { color: #fff; } 
.main_tit .t1 { font-size: var(--font-size-xxl); font-weight: 600; line-height: 1.215; } 
.main_tit .t1.en { font-weight: 800; } 
.main_tit .t2 { font-size: var(--font-size-xl-1); font-weight: 400; } 
.main_tit .t3 { position:relative; font-weight: 800; color: var(--color-point); font-size: var(--font-size-md-1); margin-bottom: var(--space-2); } 
.main_tit.white .t3 { border: 1px solid rgba(255,255,255, .315); color: rgba(255,255,255, .915) !important; } 
.main_tit .t3.en { font-weight: 600; } 
.main_tit .t3 .line { width: 4rem; height: 2px; background: var(--color-point); } 
.main_tit .t4 { font-size: var(--font-size-md-1); line-height: var(--line-height-loose); margin-top: var(--space-4); color: var(--color-black-4); } 
.main_tit .tt { font-size: var(--font-size-base); line-height: var(--line-height-normal); color: #555; } 

.main_tit .t5 { font-size: var(--font-size-md-1); line-height: var(--line-height-loose); color: var(--color-black-6); margin-top: var(--space-3) } 

/*main box*/
.main_topCon { margin-bottom: var(--space-6); align-items: end; } 
.main_box { padding: 3.75rem 0; } 
.main_box.p2 { padding: 6.88rem 0; } 
.main_box.p3 { padding: 5rem 0; } 
.main_box.pt { padding-top: 0; } 
.main_box.pb { padding-bottom: 0; } 
.main_box.pN { padding: 0; } 
.main_box.bg1 { background: var(--color-bg-2); } 

/*roundmore*/
.roundMore { display: flex; align-items: center; justify-content: center; width: 3.75rem; height: 3.75rem; border-radius: var(--radius-pill); background: var(--color-point); color: #fff; } 
.roundMore > .xi { transform: rotate(-45deg); } 

/*linemore*/
.lineMore { position:relative; } 
.lineMore:before { position: absolute; bottom: 0; width: 100%; height: 2px; content: ''; transition: .3s var(--ani-1); } 
.lineMore > .tt { font-size: var(--font-size-base); font-weight: 700; padding-bottom: .75rem; transition: .3s var(--ani-1); } 
.lineMore.btn_white { color: #fff; } 
.lineMore.btn_white:before { background: #fff; } 
.lineMore.btn_white:hover { color: var(--color-point2); } 
.lineMore.btn_white:hover:before { background: var(--color-point2); } 

/*blur more*/
.blurBoxArrow { display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-pill); background: #fff; transition: .3s var(--ani-1); } 
.blurBoxArrow > .xi { transform: rotate(-45deg); } 
.blurBoxArrow:hover { background: var(--color-point); color: #fff; } 

.mainTop { display: flex; align-items: end; justify-content: space-between; gap: 10rem; margin-bottom: var(--space-6); } 

/*sec_about*/

/*footer*/
#footer { background: #222; padding: var(--space-6) 0 calc(var(--space-6) + .5rem); } 
#footer .footerTop { display: flex; justify-content: space-between; align-items: center; padding-bottom: var(--space-3); border-bottom: 1px solid rgba(255, 255, 255, 0.2); } 
#footer .footerTop .logo { } 
#footer .footerTop .logo > img { height: 60px; object-fit: contain; filter: var(--crWhitefil); } 
#footer .footerTop .menu { display: flex; gap: 2rem; color: #ddd; } 
#footer .footerTop .menu li .in { font-size: var(--font-size-sm); position: relative; font-weight: 500; } 
#footer .footerTop .menu li .in::before { content: ''; position: absolute; width: 3px; height: 3px; background: #ddd; border-radius: 100em; left: -1rem; top: 50%; transform: translateY(-50%); } 
#footer .footerTop .menu li:nth-child(1) .in { color: #fff; } 
#footer .footerTop .menu li:nth-child(1) .in::before { display: none; } 
#footer .footerBtm { display: flex; justify-content: space-between; margin-top: var(--space-4); } 
#footer .footerBtm .leftCon { color: #fff; width: 60%; } 
#footer .footerBtm .leftCon .infoSec { } 
#footer .footerBtm .leftCon .infoSec .infoList { overflow: hidden; } 
#footer .footerBtm .leftCon .infoSec .infoList li { float: left; margin-right: 2rem; margin-bottom: .75rem; opacity: .8; position: relative; } 
#footer .footerBtm .leftCon .infoSec .infoList li.br { clear: left; } 
#footer .footerBtm .leftCon .copyright { color: #888; margin-top: 0.5rem; } 


/*contents*/
.main #contents { } 
#contents .doc { padding: 4.5rem 0 10rem 0 } 
#contents .doc.pb0 { padding-bottom: 0rem; } 
#contents .doc.pt0 { padding-top: 0rem; } 
#contents .doc.pN { padding: 0rem; } 
#contents .sub_top_wrap { height:30rem; position:relative; margin: 0 auto; transition: 1s ease; } 
#contents .sub_top_wrap .wrapBg { position:relative; width:100%; height:100%; background-color:#f1f1f1; overflow:hidden } 
#contents .sub_top_wrap .wrapBg .bg { height:100%; background-size:100% auto; transform: scale(1.2); transition: transform 3.4s ease; } 
.load #contents .sub_top_wrap .wrapBg .bg { transform: scale(1); } 
#contents .sub_top_wrap .wrapBg:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.28; } 
#contents .sub_top_wrap .subTit { position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; } 
#contents .sub_top_wrap .subTit .t1 { font-size: var(--font-size-xxl); text-align: center; line-height: 1; font-weight:500; color: #fff; opacity: 0; letter-spacing: .515rem; } 
#contents .sub_top_wrap .subTit .t2 { font-size: var(--font-size-md); font-weight: 400; margin-top: 1.5rem; color: rgba(255,255,255, .915); opacity: 0; letter-spacing: .165rem; } 
.load #contents .sub_top_wrap .subTit .t2 { letter-spacing: 0; opacity: 1; transition: 1.4s .4s ease; } 
.load #contents .sub_top_wrap .subTit .t1 { letter-spacing: -2px; opacity: 1; transition: 1.8s .4s ease; } 
#contents .sub_top_wrap { position:relative } 
#contents .sub_top_wrap .gnb > li.on { display:flex !important; justify-content:center; width:100% } 
#contents .sub_top_wrap .gnb > li > .dp2 { display:inline-flex; justify-content:center; flex-wrap:wrap } 
#contents .sub_top_wrap .gnb > li > .dp2 > li { position:relative; flex:1; min-width:0; width:20vmin; max-width:18vmin } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a { height:4em; display:flex; align-items:center; justify-content:center; color:#fff; box-sizing:border-box; background:var(--color-point); position:relative } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a:before { content:""; position:absolute; right:0; top:50%; height:30%; transform:translateY(-50%); background:#fff; width:1px; opacity:.2 } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a .va { display:flex; align-items:center; line-height:1.1; position:relative; transition:.3s; word-break:keep-all; text-align:center } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a .va .tt { font-size:1.125em; font-weight:600 } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a .va .arrow { position:absolute; right:0; top:50%; transform:translateY(-50%); overflow:hidden; font-size:0; transition:.3s } 
#contents .sub_top_wrap .gnb > li > .dp2 > li > a .va .arrow:before { content:"\e942" } 
#contents .sub_top_wrap .gnb > li > .dp2 > li.on > a { background:#fff; color:var(--color-point) } 
#contents .sub_top_wrap .gnb > li > .dp2 > li.on > a .va,
#contents .sub_top_wrap .gnb > li > .dp2 > li:hover > a .va { opacity:1; transform:translateX(0); padding-right:1.5em } 
#contents .sub_top_wrap .gnb > li > .dp2 > li.on > a .va .arrow,
#contents .sub_top_wrap .gnb > li > .dp2 > li:hover > a .va .arrow { font-size:1.25em } 


#contents .sub_page_menu { position:absolute; bottom: 0; left: 50%; transform: translateX(-50%); } 
/* #contents .sub_page_menu .gnb { padding: 6px; background: rgba(255, 255, 255, 0.2); border-radius: 100px; box-shadow: 0 0 0px 1px rgba(24, 24, 24, .11); -webkit-backdrop-filter: saturate(150%) blur(15px); backdrop-filter: saturate(150%) blur(25px); } 
#contents .sub_page_menu .gnb .dp2 { } 
#contents .sub_page_menu .gnb .dp2 > li { } 
#contents .sub_page_menu .gnb .dp2 > li > a { display: block; position: relative; padding: 0 25px; height: 38px; line-height: 38px; color: #fff; font-weight: 600; border-radius: 45px; transition: .3s ease; } 
#contents .sub_page_menu .gnb .dp2 > li > a .tt { font-size: var(--font-size-sm); font-weight: 600; } 
#contents .sub_page_menu .gnb .dp2 > li > a .in { position:relative; padding:0 .5em; } 
#contents .sub_page_menu .gnb .dp2 > li > a .in:after { content:""; position:absolute; left:0; bottom:-.875em; width:100%; height:3px; background:#042d5c; transform:scaleX(0); transition:transform .3s; } 
#contents .sub_page_menu .gnb .dp2 > li.on > a { background: var(--color-point); color: #fff; } 
 */
#contents .nav { align-items: center; justify-content: center; margin-bottom: 1.5rem; display: flex; opacity: 0; transition: 1s ease; transform: translateX(2rem); } 
.load #contents .nav { opacity: 1; transform: translateX(0); } 
#contents .nav > li { position:relative; padding:0 1em; color:#fff; } 
#contents .nav > li:before { position:absolute; left:0; top:50%; transform:translateY(-50%); width: 4px; height: 4px; background: #fff; border-radius: 50%; content: ''; } 
#contents .nav > li:first-child:before { display:none; } 
#contents .nav > li { color:#fff; font-weight:600; } 
#contents .nav > li > * { display:block; } 
#contents .nav > li.home { padding-left: 0; } 
#contents .nav > li.home .xi { font-size:1.125rem; } 
#contents .nav > li .tt { font-size: var(--font-size-base); } 

#contents .subTitle { padding-top: var(--space-6); } 
#contents .subTitle > .tt { text-align: center; font-size: var(--font-size-xl); font-weight: 700; } 

.scroll #contents .sub_top_wrap { width: 100%; } 


/* ========== sub =========== */

/* sub 공통 */
.pageCon.p1 { padding: 3.5rem 0; } 
.pageCon.p2 { padding: 4rem 0 6rem; } 
.pageCon.p3 { padding: 5rem 0 5rem; } 
.pageCon.bg1 { background: var(--color-bg-4); } 

.pageConBox + .pageConBox { margin-top: var(--space-6); } 

.page_tit { margin-bottom: var(--space-6); } 
.page_tit.white { color: #fff; } 
.page_tit .tt { font-size: var(--font-size-base); line-height: var(--line-height-normal); } 
.page_tit .t1 { font-size: var(--font-size-xxl); line-height: 1.4; font-weight: 700; } 
.page_tit .t2 { font-size: var(--font-size-lg); } 
.page_tit .t3 { font-size: var(--font-size-base); font-weight: 600; color: var(--color-point2); } 
.page_tit .t4 { font-size: var(--font-size-md-1); } 
.page_tit .t5 { font-size: var(--font-size-lg-2); } 
.page_tit .t6 { font-size: var(--font-size-xxl-2); } 
.page_tit .t7 { font-size: var(--font-size-xl-1); } 
.page_tit .dot { padding-left: 1rem; position: relative; line-height: var(--line-height-normal); } 
.page_tit .dot::before { content: ''; position: absolute; width: 5px; height: 70%; left: 0; top: 50%; transform: translateY(-48%); background: var(--color-point3); } 
.page_tit .dot.st2 { padding-left: 1.7rem; } 
.page_tit .dot.st2::before { position: absolute; font-size: 1.45rem; left: 0px; top: -2px; color: var(--color-point); content: '\e92d'; font-family: 'xeicon'; background: none; height: auto; transform: translateY(0); } 
.page_tit .dot.st3 { padding-left: 1.9rem; } 
.page_tit .dot.st3::before { position: absolute; font-size: 1.45rem; left: 0px; top: -2px; color: var(--color-point); content: '\e933'; font-family: 'xeicon'; background: none; height: auto; transform: translate(0.7rem, -.6rem) rotate(90deg); } 
.page_tit .small { font-size: var(--font-size-md-1); color: var(--color-black-7); font-weight: 600; } 

.dotList { } 
.dotList > li { position: relative; padding-left: 1rem; font-size: var(--font-size-sm); margin-bottom: .5rem; line-height: var(--line-height-normal); } 
.dotList.s1 > li { font-size: var(--font-size-base); } 
.dotList > li:before { position: absolute; top: 12px; left: 0; width: 6px; height: 1px; background: var(--color-black-4); content: ''; } 
.dotList.dot2 > li:before { position: absolute; left: 0; top: 8px; width: 5px; height: 5px; border-radius: 100px; background: var(--color-black-6); content: ''; } 
.dotList.dot2.s2 > li:before { top: 8px; } 
.dotList > li:last-of-type { margin-bottom: 0; } 
.dotList.s1 > li { font-size: var(--font-size-base); } 
.dotList.c1 > li { color: var(--color-black-6); } 

.page_btn_wrap { gap: 0.5rem; } 
.page_btn_wrap .btn { width: 5.2rem; height:5.2rem; border-radius: var(--radius-sm); display: flex; flex-direction: column; justify-content: center; align-items: center; border: 2px solid; } 
.page_btn_wrap .btn .icon { font-size: var(--font-size-md); } 
.page_btn_wrap .btn .tt { font-size: var(--font-size-xs); } 
.page_btn_wrap .c1 { background: #fff; color: var(--color-point3); border-color: #ddd; } 
.page_btn_wrap .c2 { background: var(--color-point3); color: #fff; border-color: var(--color-point3); } 


/*inquiry*/
#inquiryForm { } 
#inquiryForm .ess:before { font-size: var(--font-size-md); } 
#inquiryForm .inquiryTop { display: flex; align-items: end; justify-content: space-between; margin-bottom: var(--space-6); } 
#inquiryForm .inquiryTop .inTit { font-size: var(--font-size-lg-2); font-weight: 600; line-height: var(--line-height-normal); } 
#inquiryForm .inquiryTop .inTit > i { color: var(--color-point2); } 
#inquiryForm .inquiryTop .rq { font-size: var(--font-size-sm); color: var(--color-black-8); line-height: 1; } 
#inquiryForm .inquiryTop .rq > i { color: var(--color-point) } 

.formWrap { } 
.formWrap .form { display: flex; flex-wrap: wrap; gap: var(--gap-sm); } 
.formWrap .form > li { position: relative; width: 100%; } 
.formWrap .form > li .select-wrapper { width: 100%; } 
.formWrap .form > li .inp_wrap { position:relative; } 
.formWrap .form > li .inp_wrap .input_st:not(textarea) { height:4rem; } 
.formWrap .form > li .inp_wrap .input_st[type=file] { padding-top: 1rem; } 
.formWrap .form > li .inp_wrap .input_st::placeholder { color: var(--color-black-10); font-weight: 300; font-size: var(--font-size-base); } 
.formWrap .form > li .inp_wrap .tit { display: flex; align-items: center; margin-bottom: var(--space-2); margin-top: var(--space-2); } 
.formWrap .form > li .inp_wrap .tit .tt { font-size: var(--font-size-md); font-weight:600; } 
.formWrap .form > li .inp_wrap textarea.input_st { width: 100%; padding-top: var(--space-3); height:15rem; } 
.formWrap .form > li .inp_wrap .input_st { position: relative; font-size: var(--font-size-base); font-weight: 400; display: flex; align-items: center; border:none; border: 1px solid var(--gray-line-1); border-radius: var(--radius-sm); padding: .5rem 1.5rem; outline: 1px solid transparent; transition: all .4s ease-in-out; background: #fff; } 
.formWrap .form > li .inp_wrap .input_st:focus { outline: 1px solid var(--color-point2); } 
.formWrap .form > li .inp_wrap input:-webkit-autofill { box-shadow: 0 0 0 1000px rgba(255,255,255, .5) inset !important; background-color: transparent !important; } 
.formWrap .form > li .inp_wrap .div_field { display: flex; gap: var(--gap-sm); flex-wrap: wrap; align-items: center; width: 100%; } 
.formWrap .form > li .inp_wrap .div_field .divC { display: flex; gap: var(--gap-sm); } 
.formWrap .form > li .inp_wrap .div_field .input_st { flex: 1; } 
.formWrap .form > li .inp_wrap .div_field .find { background: var(--color-point); color: #fff; width: fit-content; } 
.formWrap .form > li .inp_wrap .div_field .hypen { text-align:center; font-weight: 600; font-size: var(--font-size-base); } 
.formWrap .form > li .inp_wrap .address_field { flex:unset } 
.formWrap .form > li .inp_wrap .address_field .input_st { margin-bottom:var(--gap-sm) } 
.formWrap .form > li .inp_wrap .c4 { background-color:var(--color-point); } 
.formWrap .form > li .inp_wrap .email_field .select-wrapper { width: 12rem; } 
.select-wrapper { position:relative; } 
.select-wrapper:before { position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); font-size: 1.5rem; transition: all .4s ease-in-out; font-family: 'xeicon'; z-index: 2; color: var(--color-point); content: '\e936' } 
.select-wrapper:focus-within::before { content: '\e930'; } 

/*** sub_member ***/
/**/
.step_tit { text-align:center; } 
.step_tit .t1 { font-size: var(--font-size-lg-2); font-weight:800; } 
.step_tit .t2 { font-size: var(--font-size-base); margin-top:1.25em; } 

.step_st { display:flex; justify-content:center; gap:0 5rem; margin:2.5rem 0 3rem 0; word-break:keep-all; counter-reset:stepIdx; } 
.step_st:first-child { margin-top:0; } 
.step_st > li { width:6.5em; counter-increment:stepIdx; } 
.step_st > li .ico { position:relative } 
.step_st > li:not(:last-child) .ico:before { content:""; position:absolute; left:100%; top:50%; width:5em; height:1px; background:#ddd } 
.step_st > li .ico .xi { position:relative; font-size:1em; width:1.875em; height:1.875em; margin:0 auto; display:flex; align-items:center; justify-content:center; color:#fff; background:#ccc; border-radius:50% } 
.step_st > li .ico .xi:before { content:counter(stepIdx); } 
.step_st > li .tt { margin-top:.75em; text-align:center; font-size:1.063em; color:#666; font-weight:500; line-height:1.3; } 
.step_st > li.on .tt { font-weight:600; color:var(--color-point2) } 
.step_st > li.on .ico .xi,
.step_st > li.on .ico:before { background:var(--color-point2); } 
.step_st > li.on .ico .xi:before { content:"\e928" } 
.step_st > li.on .ico .xi:after { content:""; position:absolute; top:-.25em; bottom:-.25em; left:-.25em; right:-.25em; border:2px dotted var(--color-point2); border-radius:50%; opacity:.4; } 
.step_st > li:not(.on) .ico .xi:before { font-family:var(--fontBase); font-size:.875em; font-weight:700; } 

/*member style*/
.login_wrap { position: relative; width:540px; max-width: 92%; margin:0 auto; box-sizing:border-box; z-index: 2; } 
.login_wrap.w1 { width:600px; max-width: 85%; margin: 0 auto; } 
.login_wrap.w2 { width:780px; max-width: 94%; margin: 0 auto; } 
.login_wrap.w3 { width:1000px; max-width: 94%; margin: 0 auto; } 
.login_wrap.st1 { padding:3rem 2.5rem; background: #fff; border-radius: var(--radius-md); } 
.login_wrap.st1.gray { background: var(--color-gray-1); } 
.login_wrap .join_sec { display:flex; justify-content:space-between; flex-wrap:wrap } 
.login_wrap .join_sec > li { width: 100%; } 
.login_wrap .join_sec > li.w100 { width:100% } 
.login_wrap .join_sec .table_form > li { padding-top:0; } 

.login_tab { display:flex; padding:0 1px 0 0; margin-bottom:2em; } 
.login_tab > li { flex:1 1 1%; } 
.login_tab > li > a { display:flex; align-items:center; justify-content:center; box-sizing:border-box; position:relative; height:3.5em; border:1px solid rgba(0,0,0,.1); color:rgba(0,0,0,.7); background:#fff; margin:0 -1px -1px 0 } 
.login_tab > li:first-child > a { border-radius:.35rem 0 0 .35rem; } 
.login_tab > li:last-child > a { border-radius:0 .35rem .35rem 0; } 
.login_tab > li > a .t1 { font-weight:500; font-size: var(--font-size-md-1); } 
.login_tab > li > a.on { background:var(--color-point3); border-color:transparent; color:#fff } 
.login_tab > li > a.on:after { content:""; position:absolute; left:50%; transform:translate(-50%, 50%) rotate(45deg); bottom:-1px; width:.75em; height:.75em; background:#fff } 

.layer_inp { display:block; position:relative } 
.layer_inp .inp:focus { z-index:1 } 
.layer_inp .inp { border:1px solid #ddd; margin-bottom:-1px; padding:1rem; padding-left:4rem; height:3.5em; box-sizing:border-box; width:100%; position:relative; font-weight:500; font-size:1.188em } 
.layer_inp select.inp { padding-left:3.75rem } 
.layer_inp select.inp optgroup,
.layer_inp select.inp option { font-weight:400; } 
.layer_inp:first-of-type .inp { border-top-left-radius:.35rem; border-top-right-radius:.35rem } 
.layer_inp:last-of-type .inp { border-bottom-left-radius:.35rem; border-bottom-right-radius:.35rem } 
.layer_inp .tt { position:absolute; left:4.25em; right:0; top:0; height:100%; display:flex; align-items:center; box-sizing:border-box; padding:0 .5em; z-index:2; color:#666; font-weight:500 } 
.layer_inp .tt > i { font-size: var(--font-size-sm); } 
.layer_inp .ico { font-size:1em; position:absolute; left:0; top:0; width:4.5em; height:100%; display:flex; align-items:center; justify-content:center; z-index:2 } 
.layer_inp .ico:before { font-size:1.5em } 
.layer_inp .inp:focus { border-color:var(--color-point2); outline:none } 
.layer_inp .inp:valid ~ .tt,
.layer_inp .inp:focus ~ .tt { right:auto; width:auto; height:1em; transform:translateY(-50%); backdrop-filter:blur(1em); color:var(--color-point2) } 
.layer_inp .inp:valid ~ .tt > i,
.layer_inp .inp:focus ~ .tt > i { font-size:.875em } 

.login_wrap .logoMark { display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-5); } 
.login_wrap .logoMark > img { height: 2.6rem; object-fit: contain; } 
.login_wrap .login { display:flex; flex-direction:column } 
.login_wrap .login > * { width:100%; box-sizing:border-box } 
.login_wrap .btn { height: 3.5rem; border-radius: var(--radius-sm); border:1px solid transparent; font-weight:600; font-size: var(--font-size-base); } 
.login_wrap .btn .xi { font-size:1em; margin-right:.25em } 
.login_wrap .btn.c1 { background:var(--color-point2); color:#fff } 
.login_wrap .btn.c2 { background:#000; color:#fff } 
.login_wrap .btn.c3 { background:var(--color-point); border:none; color:#fff } 
.login_wrap .btn.s1 { font-size:1.063em } 
.login_wrap .check_wrap { padding:1.5em .25em; } 
.login_wrap .check_wrap .label_st { font-size:1.063em; } 
.login_wrap .check_wrap + .page_btn { margin-top:0; } 
.login_wrap .page_btn { margin-top:2em; gap:.5em; } 
.login_wrap .inp_flex { display:flex; gap:1em; } 
.login_wrap .inp_flex .inp_wrap { flex:1 1 0%; min-width:0; } 
.login_wrap .inp_flex .page_btn { width:9em; margin-top:0 } 
.login_wrap .inp_flex .page_btn .btn { height:100% } 
.login_wrap .link_wrap { padding:2em 0; } 
.login_wrap .link_wrap:last-child { padding-bottom:0; } 
.login_wrap .link_wrap a { position:relative; padding:0 1.5em; font-size:1.063em; color:#666; font-weight:500; } 
.login_wrap .link_wrap a + a:before { content:""; position:absolute; left:0; top:50%; width:1px; height:1em; background:#000; opacity:.15; transform:translateY(-50%); } 
.login_wrap .link_wrap a.point { font-size:1.063em; color:#111; font-weight:600; } 
.login_wrap .link_wrap a:hover { text-decoration:underline; } 
.login_wrap .sns_tit { overflow:hidden; margin:2em 0; text-align:center; } 
.login_wrap .sns_tit .in { position:relative; display:inline-block; padding:0 1em; font-size:1.1em; font-weight:600; color:#777 } 
.login_wrap .sns_tit .in:before,
.login_wrap .sns_tit .in:after { content:""; position:absolute; top:50%; width:1000px; height:1px; background:#ddd; } 
.login_wrap .sns_tit .in:before { right:100%; } 
.login_wrap .sns_tit .in:after { left:100%; } 
.login_wrap .sns_login { display:flex; flex-wrap:wrap; align-items:center; gap:.5em; padding: 0 5em; } 
.login_wrap .sns_login > li { flex:1; } 
.login_wrap .sns_login > li .in { height:3.5em; gap:.75em; } 
.login_wrap .sns_login > li .in .ico { font-size:1.500em; } 
.login_wrap .sns_login > li .in .tt { font-size:1.063em; font-weight:500; } 
.login_wrap .sns_login > li.nv .in { background:var(--snsNv); color:#fff; } 
.login_wrap .sns_login > li.ka .in { background:var(--snsKa); } 

.fin_box { background:var(--color-gray-1); border-radius: var(--radius-sm); padding:3rem; text-align:center; word-break:keep-all; } 
.fin_box .fin { display:inline-flex; align-items:center; gap:1rem; margin:.5rem 0; } 
.fin_box .fin * { line-height:normal !important; } 
.fin_box .xIco { margin-bottom:1em; color: var(--color-point2); } 
.fin_box .xIco .xi { font-size:1.750rem; } 
.fin_box .tit { font-size:1.75rem; font-weight:600; margin-bottom: var(--space-1); } 
.fin_box .tit.s1 { font-size:1.375rem } 
.fin_box .tt1 { line-height:1.5; font-size: var(--font-size-base); color: var(--color-black-6); } 
.fin_box .tt2 { font-size:1.250em; font-weight:500; } 
.fin_box .tt_point { font-size:1.750rem; color:var(--color-point3); font-weight:700; } 
.fin_box .tt_no { display:inline-flex; align-items:center; gap:1rem; margin-top:1rem; height:3rem; padding:0 2em; background:var(--color-point3); border-radius:6em; color:#fff; } 
.fin_box .tt_no .no { font-size:1.250rem; font-weight:600; } 
.fin_box .fs:not(:last-child):after { content:"," } 
.fin_box .finTop { margin-bottom: var(--space-4); } 

.agree_box:not(.page_box) { border-radius:.5em; border:1px solid #ddd; padding:1.5em 1.75em; } 
.agree_box p { padding:.375em 0; font-size: 1rem; } 
.agree_box strong,
.agree_box b { font-weight:600; color:#000; } 
.agree_box.tt1 { color:#555; line-height:1.5 } 
.agree_box.tt2 { color:#555; font-size:1.063em; line-height:1.5 } 
.agree_box.tt2 strong,
.agree_box.tt2 b { font-size:var(--font-size-base); } 
.agree_box.h1 { height:18em; } 

.agree_box ol { padding:.375em 0; } 
.agree_box ol > li { padding-left:.875em; text-indent:-.875em; } 

.btn_vf { padding:2em; border:1px solid #ddd; border-radius:.5em; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; min-height:8em; transition:.3s } 
.btn_vf .ico { width:8em; height:8em; border:3px dotted var(--crGray); border-radius:50%; display:flex; flex-direction:column; justify-content:center; margin-bottom:1.5em } 
.btn_vf .ico img { height:45% } 
.btn_vf .t1 { font-weight:700; font-size:1.25em } 
.btn_vf .t2 { color:#666; margin-top:.5em } 
.btn_vf .st { padding:.75em .5em; background:var(--crGrad1); width:100%; max-width:12em; border-radius:.5em; box-sizing:border-box; font-size:var(--font-size-base); font-weight:500; color:#fff; margin-top:1.5em } 
.btn_vf:hover,
.btn_vf:focus { border-color:var(--color-point2); box-shadow:0 0 1em rgba(0,0,0,.1) } 

.newTag { position: relative; } 
.newTag::before { content: 'N'; display: flex; justify-content: center; align-items: center; width: 1rem; height: 1rem; padding: .3em; border-radius: 50%; background: tomato; font-weight: 600; font-size: .875em; color:#fff; position: absolute; right: -.6rem; top: -.6rem; zoom: .8; } 

/*member table*/
.table_form_wrap { } 
.table_form_wrap .form_tit { padding:1em 0 } 
.table_form_wrap .form_tit .t1 { font-weight:700; font-size:var(--font-size-lg) } 
.table_form_wrap .form_tit .t2 { font-weight:700; font-size:var(--font-size-xl) } 
.table_form_wrap .form_tit .t3 { font-weight:500; font-size:var(--font-size-base) } 
.table_form > li { border-bottom:1px solid #ddd; padding:.75em 0 } 
.table_form > li:first-child { border-top:1px solid #111 } 
.table_form > li.bd0 { border-bottom:none } 
.table_form > li.bd1 { border-top:none } 
.table_form > li.p1 { padding:1.5em 0; } 
.table_form .wrap_in { display:flex; align-items:center } 
.table_form .wrap_in .ti_wrap,
.table_form .wrap_in .con_wrap { min-height:3rem; box-sizing:border-box; display:flex; flex-wrap:wrap; align-items:center; } 
.table_form .wrap_in .tit_wrap { width:12rem; gap:.5rem 0; padding:0 1.25rem; } 
.table_form .wrap_in .ti_wrap { width:14rem; gap:.5rem 0; padding:0 1.25rem; } 
.table_form .wrap_in .tit1 { font-size:var(--font-size-base); font-weight:600; } 
.table_form .wrap_in .tit2 { font-size:1.063em; font-weight:600; } 
.table_form .wrap_in .tit3 { font-size:1.000em; font-weight:500; line-height:1.2; } 
.table_form .wrap_in .con_wrap { flex:1 1 0%; min-width:0; gap:.25em; font-size:var(--font-size-sm); } 
.table_form .wrap_in .con_wrap > * { flex:1 1 0%; min-width:0 } 
.table_form .wrap_in .con_wrap .inp_tt { flex:0 0 auto; font-size:.938rem; color:#666; } 
.table_form .wrap_in .con_wrap .input_st { width: 100%; min-width: 8rem; } 
.table_form .wrap_in .con_wrap .line { padding-top:.75rem; margin-top:.75rem; border-top:1px solid #ddd } 
.table_form .wrap_in .con_wrap .h1 { height: 300px; } 
.table_form .wrap_in .con_wrap .w1 { flex:0 0 auto; width:3rem } 
.table_form .wrap_in .con_wrap .w2 { flex:0 0 auto; width:9rem } 
.table_form .wrap_in .con_wrap .w3 { flex:0 0 auto; width:13rem } 
.table_form .wrap_in .con_wrap .w4 { flex:0 0 auto; width:16rem } 
.table_form .wrap_in .con_wrap .w5 { flex:0 0 auto; width:20rem } 
.table_form .wrap_in .con_wrap .w6 { flex:0 0 auto; width:26rem } 
.table_form .wrap_in .con_wrap .w50 { flex:0 0 auto; width:50% } 
.table_form .wrap_in .con_wrap .w100 { flex:0 0 auto; width:100% } 
.table_form .wrap_in .con_wrap .w_auto { flex:0 0 auto } 
.table_form .wrap_in .con_wrap .max1 { max-width:27rem } 
.table_form .wrap_in .con_wrap .max2 { max-width:8.375rem } 
.table_form .wrap_in .con_wrap .max3 { max-width:23.5rem } 
.table_form .wrap_in .con_wrap .min1 { min-width:23.5rem } 

.table_form .wrap_in.col { flex-direction:column } 
.table_form .wrap_in.col > * { flex:0 0 auto; width:100% } 
.table_form .wrap_in.col .tit_wrap { padding:0 0; } 

.table_form .wrap_in .con_wrap .field.col_w3 .input_st { max-width: 12rem; } 

.filebox label { padding: 10px 20px; color: #fff; background-color: #999; cursor: pointer; margin-left: 10px; display: flex; align-items: center; justify-content: center; width: 7.25rem; min-width: 6.25rem; } 
.filebox input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; } 

.qna_wrap { text-align: center; padding: 3.5rem 0; margin-bottom: 2.5rem; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } 
.contact_wrap .form_wrap { flex: 1 1 100%; padding: 3.5rem; background: #f5f5f5; border-radius: .5rem; } 

.qna_wrap .symbol { margin-bottom: .5rem; } 
.qna_wrap .symbol > img { width: 3rem; } 

/* 개인정보 */
.agree_box_wrap .check { padding: 1rem 2rem; text-align: center; background: #edf1f5; display: flex; justify-content: center; align-items: center } 
.agree_box_wrap .check .sub_tt { font-size: var(--font-size-base); font-weight: 600; } 
.agree_box_wrap .agree_box { margin-top: 1rem; height: 16em; overflow-y: scroll; } 

.agree_boxS_pop { border-radius: .5rem; border: 1px solid #ddd; padding: 1.5rem 2rem; color: #555; line-height: 1.8; font-size: var(--font-size-sm); } 

.agree_wrap { box-shadow:0 0 1rem rgba(0,0,0,.1); padding:2rem; color:#666 } 
.agree_box { border-radius:.5rem; border:1px solid #ddd; padding:1.5rem 2rem; color:#555; line-height:1.6; } 
.agree_box.h1 { height:12rem; overflow-y:auto; } 
.agree_box p { padding:.5rem 0; } 
.agree_box strong { font-size:var(--font-size-base); color:#000; } 



/* 공통 탭 메뉴 스타일 */
.con_idx { position: relative } 
.con_idx > .idx { position: absolute; left: 0; top: 0; width: 100%; visibility: hidden; filter: alpha(opacity=0); opacity: 0; } 
.con_idx > .idx.on { position: relative; visibility: visible; filter: alpha(opacity=100); opacity: 1; } 

.sub_tab { } 
.sub_tab .tab_btn { background: var(--color-bg-2); border-radius: 100rem; padding: 0.5rem; box-sizing: border-box; gap: 0.5em; width: fit-content; margin: 0 auto; } 
.sub_tab .tab_btn li { cursor: pointer; } 
.sub_tab .tab_btn li.on .tt { background: var(--color-point2); color: #fff; } 
.sub_tab .tab_btn li .tt { padding: .7rem 2rem; background: #fff; color: var(--color-point2); font-weight: 700; font-size: var(--font-size-md-1); border-radius: 100rem; } 

.page_tab .tab_idx { display:flex; align-items: center; width: 100%; box-sizing: border-box; } 
.page_tab .tab_idx > li { position: relative; text-align: center; padding: 1rem 2rem; box-sizing: border-box; font-size: var(--font-size-base); font-weight: 600; color: #666; cursor: pointer; flex: 1; transition: .3s; background: #f1f1f1; } 
.page_tab .tab_idx > li:hover { background:#f9f9fb; } 
.page_tab .tab_idx > li::before { position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); height: 50%; width: 1px; background: #ccc; } 
.page_tab .tab_idx > li.on { color: #fff; font-weight: 700; background: #fff; background: var(--color-point3); } 
.page_tab .tab_idx > li.on::before,
.page_tab .tab_idx > li:first-child::before { display: none; } 


/* 아이콘 박스 */
.boxIconList { } 
.boxIconList > li { display: flex; } 
.boxIconList > li > .in { flex: 1; border: 2px solid #ddd; background: #fbfbfb; border-radius: .5rem; padding: 1.5rem; box-sizing: border-box; } 
.boxIconList > li > .in > .icon { display: flex; align-items: center; justify-content: center; margin: 0 auto; width:5rem; height: 5rem; border-radius: 50%; background: var(--color-point3); } 
.boxIconList > li > .in > .icon > img { height: 45px; object-fit: contain; } 
.boxIconList > li > .in > .tit { font-size: var(--font-size-md-1); font-weight: 700; text-align: center; margin-top: 1rem; } 
.boxIconList > li > .in > .t1 { text-align: center; font-size: var(--font-size-sm); } 
.boxIconList > li > .in > .tt { font-size: var(--font-size-sm); text-align: center; margin-top: 1rem; color: var(--color-black-7); } 

 /* 온라인 문의 */
.dp1_inquiry #contents { overflow: hidden; } 
.inquiry-con .inquiry-lay { align-items: stretch; margin-top: 2.5rem; gap: 2rem 4rem; } 
.inquiry-con .inquiry-lay .inTxt { margin-top: 3.3rem; } 
.inquiry-con .inquiry-bg-wrap { position: relative; height: 86%; border-radius: 1rem; overflow: hidden; } 
.inquiry-con .inquiry-bg-wrap .gsimgFix { height: 100%; } 
.inquiry-con .inquiry-bg-wrap .gsimgFix .posImg { min-height: 0; } 
.inquiry-con .inquiry-bg-wrap .gsimgFix .posImg img { position: static; object-fit: cover; } 
/* .inquiry-con .inquiry-bg-wrap .img-area { position: absolute; width: 50vw; height: inherit; overflow: hidden; border-radius: 1em 0 0 1em; } */
/* .inquiry-con .inTxt { padding-top: 9em; } */

.addinfo_tw { margin-bottom: .5em; display: flex; flex-direction: column; align-items: end; } 
.addinfo_tw > .tt { font-size: var(--font-size-base); color: #999; font-weight: 500; } 

.select-wrapper { position:relative; } 
.select-wrapper:before { position: absolute; top: 50%; right: 1.5rem; transform: translateY(-50%); font-size: var(--font-size-md); 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:var(--font-size-sm); } 
.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% - .5rem); } 
.form_wrap .form > li .inp_wrap { position:relative; } 
.form_wrap .form > li .inp_wrap .tit,
.form_wrap .form > li .inp_wrap .input_st:not(textarea) { height:4rem; line-height: 3.1rem; } 
.form_wrap .form > li .inp_wrap .input_st::placeholder { font-size: var(--font-size-base); } 
/* .form_wrap .form > li .inp_wrap select.input_st { font-size: var(--font-size-base); } */
.form_wrap .form > li .inp_wrap .tit { position:absolute; top:0; left:0; padding-left:1.5rem; } 
.form_wrap .form > li .inp_wrap .tit .tt { font-size: var(--font-size-sm); font-weight:500; letter-spacing: 0.4px; } 
.form_wrap .form > li .inp_wrap .input_st:not(textarea) { width:100%; padding-left: 190px; } 
.form_wrap .form > li .inp_wrap .input_st[type=file] { line-height: 4.5em; } 
.form_wrap .form > li .inp_wrap textarea.input_st { padding-top:4rem; padding-left:1.5rem; height:12rem; } 
.form_wrap .form > li .inp_wrap .input_st { border:none; background: transparent; border-radius: .15rem; 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:12rem; border: 4px solid rgba(255, 255, 255, .4); transition: all .4s ease-in-out; } 

.form_wrap .form_chk .btn .input_st { background: var(--color-point); border-color: var(--color-point); color: #fff; border: none; } 

.form_label_wrap { height: 100%; align-items: center; } 
.form_label_wrap > li { box-sizing:border-box; margin-right: 3rem; font-size: var(--font-size-base); } 
.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:.125rem; font-size: var(--font-size-sm); } 
.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: var(--font-size-base); margin: 0; } 
.form_label_st:not(.cssbrowser) .xi:before { font-family:xeicon!important; font-style:normal; font-size: var(--font-size-md-1); padding-right:.25rem } 
.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(--color-point); } 
.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(--color-point); } 
.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.5rem; padding: 0 10px; vertical-align: middle; background: transparent; width: 80%; } 
.filebox .upload-name::placeholder { font-size: var(--font-size-md-1); font-weight: 500; color: #aaa; } 
.filebox label { padding: 10px 20px; color: #fff; background-color: var(--color-point); cursor: pointer; margin-left: 10px; border-radius: 5px; display: flex; align-items: center; justify-content: center; width: 30%; min-width: 6.25em; } 
.filebox input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; } 

.form_chk .label_st input[type=checkbox],
.form_chk .label_st input[type=radio] { width: auto; height: auto; overflow: visible; margin-bottom: auto; position: static; } 
.label_st input:checked ~ span { color:var(--color-point) } 
.label_st input[type=radio] ~ .xi { border-radius:50% } 
/* .label_st input:checked ~ .xi { background:var(--color-point); color:#fff; border-color:transparent; } */
/* .label_st input:checked ~ .xi:before { font-size:.813em } */

.form_wrap .form_tit { border-bottom:1px solid #111; padding:.75em 0 } 
.form_wrap .form_tit .t1 { font-weight:700; font-size: var(--font-size-lg-2); } 
.form_wrap .form_tit .t2 { font-weight:700; font-size:var(--font-size-lg-1) } 
.form_wrap .form_tit .t3 { font-weight:500; font-size:var(--font-size-base) } 
.form_wrap .form_con { padding:1.5rem 0 } 
.form_st { border-top:1px solid #111 } 
.form_st > li { border-bottom:1px solid #ddd; padding:.75em 0; flex: 1 50%; } 
.form_st > li.w100 { flex: 1 1 100%; } 
.form_wrap .form_tit + .form_st > li:first-child { border-top:none } 
.form_st > li.bd0 { border-bottom:none } 
.form_lab { display:flex; align-items:center } 
.form_lab .lab_tit,
.form_lab .lab_con { min-height:3em; box-sizing:border-box; display:flex; align-items:center; } 
.form_st.h1 .lab_tit,
.form_st.h1 .lab_con { min-height:2em } 
.form_lab .lab_tit { position: relative; width:9em; min-width: 9em; margin-right:2em; gap:.5em 0; padding-left:.25em } 
.form_lab .lab_tit:before { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 18px; background: #ddd; content: ''; } 
.form_lab .tit1 { font-weight:600; color: var(--color-point); font-size:var(--font-size-base) } 
.form_lab .tit2 { font-weight:500; font-size:var(--font-size-sm); line-height:1.2 } 
.form_lab .lab_con { flex:1 1 0%; min-width:0; gap:.25em; font-weight:400; color: #444; } 
.form_lab .lab_con .input_st { max-width: 80%; } 
.form_lab .lab_con.not(.flex) > * { flex:1 1 0%; min-width:0 } 
.form_lab .lab_con .inp_tt { flex:0 0 auto; font-size:var(--font-size-sm); color:#666; font-weight:400 } 
.form_lab .lab_con .line { padding-top:.75em; margin-top:.75em; border-top:1px solid #ddd } 
.form_lab .lab_con .w1 { flex:0 0 auto; width:3em } 
.form_lab .lab_con .w2 { flex:0 0 auto; width:9em } 
.form_lab .lab_con .w50 { flex:0 0 auto; width:50% } 
.form_lab .lab_con .w100 { flex:0 0 auto; width:100% } 
.form_lab .lab_con .w_auto { flex:0 0 auto } 
.form_lab .lab_con .max1 { max-width:27em } 
.form_lab .lab_con .max2 { max-width:8.375em } 
.form_lab .lab_con .max3 { max-width:23.5em } 
.form_lab .lab_con .min1 { min-width:23.5em } 


/*product search*/
.prosearchCon { position: relative; overflow: hidden; padding: 2rem; box-sizing: border-box; background: var(--color-point); border-radius: var(--radius-md); } 
.prosearchCon .searchBg { position: absolute; right: 0; top: -15svh; width: 30svw; } 
.prosearchCon .searchBg > img { filter: var(--crWhitefil); opacity: 0.035; } 
.prosearchCon .find_WrapCon { position: relative; width: 45svw; margin: 0 auto; } 
#findPro { position:relative; width: 100%; } 
#findPro .input_st { position: relative; width: 100%; height: 4.35rem; border-radius: var(--radius-pill); border: 1px solid transparent; padding: 0 6rem 0 2rem; box-sizing: border-box; } 
#findPro .input_st::placeholder { font-size: var(--font-size-base); font-weight: 500; color: var(--color-black-9); } 
#findPro .sech { position: absolute; width: 3.8rem; height: 3.8rem; display: flex; align-items: center; justify-content: center; background: var(--color-point2); right: .4rem; top: 50%; border-radius: var(--radius-pill); transform: translateY(-50%); border: none; } 
#findPro .sech > .xi { color: #fff; } 

.prosearchCon .tag_wrap { display: flex; align-items: start; gap: var(--gap-lg); padding-top: var(--space-4); } 
.prosearchCon .tag_wrap .best_sch { display: flex; gap: var(--gap-sm); align-items: center; } 
.prosearchCon .tag_wrap .best_sch > .c_plus { display: flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--color-point2); color: #fff; } 
.prosearchCon .tag_wrap .best_sch > .c_tit { font-size: var(--font-size-md-1); font-weight: 600; color: var(--color-point2); } 
.prosearchCon .tag_wrap .tag_list { display: flex; align-items: center; gap: var(--gap-md); } 
.prosearchCon .tag_wrap .tag_list > li { } 
.prosearchCon .tag_wrap .tag_list > li > .tt { font-size: var(--font-size-base); color: rgba(255,255,255, .715); } 


/* ======= 제품소개 ======== */

.productWrap .productInfo { padding: 1.8rem; height: 100%; display: flex; flex-direction: column; justify-content: space-between; } 
.productWrap .productInfo .specList { display: flex; flex-direction: column; gap: 0.5em; } 
.productWrap .productInfo .topTxt .tit { font-size: var(--font-size-md); } 
.productWrap .ProductList { display: flex; flex-wrap: wrap; gap: 4.5rem 1.8rem; } 
.productWrap .ProductList > li { width: calc((100% - 3.6rem) / 3); display: flex; flex-direction: column; justify-content: space-between; } 
.productWrap .ProductList > li .imgWrap .imgBox { height: 12em; display: flex; align-items: center; } 

.productInfo { padding: 1.5rem; box-sizing: border-box; background: var(--color-gray-4); margin-top: var(--space-2); border-radius: var(--radius-md); } 
.productInfo .topTxt { margin-bottom: var(--space-4); } 
.productInfo .topTxt .tit { font-size: var(--font-size-md-1); font-weight: 700; } 
.productInfo .topTxt .codeT { font-size: var(--font-size-sm); color: #666; margin-top: .3rem; } 

.productWrap .productInfo .more_btn { margin-top: var(--space-5); display: flex; gap: .5rem; } 
.productWrap .productInfo .more_btn .xi { opacity: 0; transition: width .4s ease, opacity .4s ease, margin-left .4s ease; margin-left: 0; width: 0; } 
.productWrap .productInfo .more_btn a:hover .xi { opacity: 1; margin-left: 0.5rem; width: 1em; } 

.specList { } 
.specList dl { display: flex; } 
.specList dl + dl { margin-top: 0.45rem; } 
.specList dl dt { width: 6vw; color: #555; font-weight: 700; flex-shrink: 0; } 

.product_cateBtn { display: flex; gap: .5em; border-radius: 100px; overflow-x: auto; overflow-y: hidden; margin-bottom: var(--space-4); } 
.product_cateBtn li { } 
.product_cateBtn li a { display: block; padding: 0em 1.5em; height: 3em; line-height: 3em; background: #fff; border-radius: 100px; color: #333; border: 1px solid #ccc; } 
.product_cateBtn li a .tt { font-size: var(--font-size-base); font-weight: 600; } 
.product_cateBtn li.on a { background: var(--color-point); color: #fff; border-color: var(--color-point); } 

/* view */
.mall_view_top { padding:1em 1em 5em; gap: 4.5em; } 
.mall_view_top .prod_img { width: 50%; display: flex; gap: .8em; } 
.mall_view_top .page_info { width: 50%; } 
.mall_view_top .prod_img .imgBig { border: 1px solid #ccc; padding: 3rem; box-sizing: border-box; border-radius: 1em; } 
.mall_view_top .prod_img .wrap_in { flex: 1; } 
.mall_view_top .prod_img .imgBig img { display:block; width:100%; height: 40svh; object-fit: contain; } 
.mall_view_top .prod_img .prodImgList { display: flex; gap: 2rem; flex-wrap: wrap; } 
.mall_view_top .prod_img .prodImgList > li { width: calc((100% - 2em) / 2); } 
.mall_view_top .prod_img .prodImgList > li > .imgCon { background: #f1f1f1; height: 54vh; } 
.mall_view_top .prod_img .prodImgList > li > .imgCon > img { width: 100%; height: 100%; object-fit: cover; } 

.mall_view_top .page_info .txt_wrap { margin-top: 1rem; } 
.mall_view_top .page_info .txt_wrap .t1 { font-weight: 500; color: #888; display: flex; gap: 1.5rem; align-items: center; } 
.mall_view_top .page_info .txt_wrap .t1 .tt { position: relative; line-height: 1.5; } 
.mall_view_top .page_info .txt_wrap .t1 .tt::before { content: '\e93f'; position: absolute; right: -1.3rem; top: 50%; transform: translateY(-50%); font-family: xeicon !important; } 
.mall_view_top .page_info .txt_wrap .t1 .tt:last-child:before { display: none; } 
.mall_view_top .page_info .txt_wrap .tit { font-size: var(--font-size-xl-1); font-weight: 700; margin-bottom: 1rem; margin-top: 0.5rem; } 
.mall_view_top .page_info .txt_wrap .t2 { font-size: var(--font-size-base); color: #555; font-weight: 500; padding-bottom: 2rem; line-height: var(--line-height-normal); margin-bottom: 2rem; border-bottom: 1px solid #ddd; } 
.mall_view_top .page_info .txt_wrap .txt { color: #333; padding: 1.5rem 1.5rem 3rem; box-sizing: border-box; border-radius: 1rem; background: #f1f1f1; margin-top: 2em; } 

.mall_view_top .page_info .txt_wrap > .dl_wrap { margin:1.6em 0 2.2em; } 
.mall_view_top .page_info .txt_wrap > .dl_wrap dl { margin-bottom:1.2em; display: flex; } 
.mall_view_top .page_info .txt_wrap > .dl_wrap dl:last-of-type { margin-bottom:0; } 
.mall_view_top .page_info .txt_wrap > .dl_wrap dl dt { display:inline-block; width:30%; font-size: var(--font-size-base); line-height:28px; color:#111; font-weight: 600; letter-spacing:-0.05em; } 
.mall_view_top .page_info .txt_wrap > .dl_wrap dl dd { display:inline-block; width:70%; font-size: var(--font-size-base); line-height:28px; color:#333; letter-spacing:-0.05em; } 

.mall_view_bottom { border-bottom: 1px solid #ddd; } 
.mall_view_bottom .viewTit { } 
.mall_view_bottom .viewTit .t1 { font-size: var(--font-size-md); font-weight: 600; padding: 0.8em 0; box-sizing: border-box; border-top: 1px solid #333; border-bottom: 1px solid #ddd; text-align: center; color: #333; background: #f7f7f7; } 

.mall_view_bottom .img_wrap { padding: 4em 5vw 4em; } 
.mall_view_bottom .img_wrap img { margin: 0 auto; max-width: 100%; display: block; } 

.zoomWrap { position: relative; } 
.zoomWrap .magnifierWrap { position:absolute; left:100%; margin-left:5em; top:0; width:100%; height:100%; overflow:hidden; z-index: 5; box-shadow:0 0 1em rgba(0,0,0,.1); display: none; background-color:#fff } 
.zoomWrap .magnifierWrap .magnifier { position:absolute; background-repeat:no-repeat; background-size:100% 100%; } 
.zoomWrap .pointer { position:absolute; width:30%; height:30%; background:rgba(0,0,0,.1); transform:translate(-50%,-50%); display:none } 
.zoomThumbWrap { display: flex; gap: .5em; width: 20%; flex-direction: column; } 
.zoomThumbWrap > li { width: 100%; } 
.zoomThumbWrap > li .in { border:1px solid #ccc; border-radius: 1em; height: 6.5rem; width: 100%; overflow: hidden; cursor: pointer; padding: .5rem; box-sizing: border-box; } 
.zoomThumbWrap > li .in.on { border-color:var(--color-point); border-width: 2px; } 
.zoomThumbWrap > li .in img { width: 100%; height: 100%; object-fit: contain; } 

/* 찾아오시는 길 */
.location_Bg .map_con { margin-bottom: 6rem; } 
.location_Bg .map_con:last-of-type { margin-bottom: 0rem; } 
.map_wrap { width: 100%; } 
.map_wrap > .root_daum_roughmap { border-radius: 1rem 1rem 0 0; overflow: hidden; } 
.map_wrap iframe { width: 100%; } 
.root_daum_roughmap { width: 100% !important; } 
.root_daum_roughmap .cont .section_address, .root_daum_roughmap .wrap_controllers { display: none; } 
.location_info { margin-top: -0.25rem; } 
.location_info > .con { display: flex; gap: 3rem; background: #ffffff; padding: 3rem 4rem; border-radius: 0 0 1rem 1rem; border: 1px solid #e2e8f0; align-items: stretch; box-shadow: 0 0.625rem 1.875rem rgba(25, 71, 186, 0.04); } 
.location_info > .con > .office { width: 30rem; border-right: 1px solid #e2e8f0; display: flex; align-items: center; } 
.location_info > .con > .office > .tt { font-size: 1.5rem; font-weight: 800; color: var(--color-point3); word-break: keep-all; line-height: 1.5; } 
.location_info > .con > .office .logo { width:100%; padding-right:3rem; box-sizing:border-box; } 
.location_info > .con > .address { width: 60%; padding: 1.2rem 0; } 
.location_info > .con > .address .tit { font-size: 1.4375rem; font-weight: 600; color: var(--color-point); } 
.location_info > .con > .address .tit .xi { margin-right: 0.5rem; background: var(--color-point2); color: #fff; width: 1.875rem; height: 1.875rem; font-size: 1rem; line-height: 1.875rem; text-align: center; border-radius: 50%; } 
.location_info > .con > .address > .add_info { display: flex; gap: 2rem; align-items: center; margin-top: 1.5rem; } 
.location_info > .con > .address > .add_info > li > .call_con { display: flex; align-items: center; gap: .5rem; } 
.location_info > .con > .address > .add_info > li > .call_con > .xi { font-size: 1.0625rem; color: #555; } 
.location_info > .con > .address > .add_info > li > .call_con > .tt { font-size: 1.0625rem; color: #555; } 
.location_info > .con > .map_view { width: 8rem; border: 1px solid var(--color-point2); border-radius: 1rem; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: .2s; color: var(--color-point2); } 
.location_info > .con > .map_view > .xi { font-size: 2.125rem; } 
.location_info > .con > .map_view > .mapViewT { font-size: 1.0625rem; font-weight: 500; margin-top: .35rem; } 
.location_info > .con > .map_view:hover { background: var(--color-point2); color: #fff; } 
.locWrap { margin-top: 4rem; } 
.locWrap .locList > li.w100 { flex: 1 1 100%; max-width: 100%; } 
.locWrap .locList > li > .in { margin: 0 0 3rem 2rem; } 
.locWrap .locList > li > .in > .iconWrap { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; border-bottom: 2px solid #f0f4f8; } 
.locWrap .locList > li > .in > .iconWrap > .tt { font-size: 1.3125rem; font-weight: 600; line-height: 1; } 
.locWrap .locList > li > .in .icon { position: relative; top: 1px; display: flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; color: var(--color-point2); background: #e8f4fd; border-radius: 0.5rem; } 
.locWrap .locList > li > .in > .info { padding-left: 4.6rem; } 
.locWrap .locList > li > .in > .info > li { margin-bottom: .5rem; } 
.locWrap .locList > li > .in > .info > li:last-of-type { margin-bottom: 0; } 
.locWrap .locList > li > .in > .info .con > .tt { font-size: 1.0625rem; font-weight: 400; line-height: 1.6; } 
.locWrap .locList > li > .in > .info .con > .tt > i, .locWrap .locList > li > .in > .info .con > .tt > b { vertical-align: baseline; } 
.locWrap .locList > li > .in > .info .con .txt_box { background: #f8fafc; padding: 1.2rem; box-sizing: border-box; margin-top: .7rem; border-radius: 0.8rem; border: 1px solid #edf2f7; } 
.locWrap .locList > li > .in > .info .con .txt-in { margin-top: 1rem; gap: 0.5rem .7rem; } 
.locWrap .locList > li > .in > .info .con .txt-in:first-child { margin-top: 0; } 
.locWrap .locList > li > .in > .info .con .txt-in > span { background: #fff; padding: 0.5rem 0.5rem; border-radius: 5px; align-items: center; flex-wrap: wrap; gap: var(--gap-sm); } 
.locWrap .locList > li > .in > .info .con .txt-in .xi { font-size: 0.75rem; border-radius: 50%; background: #e2e8f0; color: #718096; padding: 0.3rem; width: fit-content; } 
.locWrap .locList > li > .in > .info .con .txt-in i:not(.xi) { display: inline-block; padding: .25rem .75rem; white-space: nowrap; border-radius: 100px; overflow: hidden; background: #eee; font-size: 0.875rem; } 
.locWrap .locList > li > .in > .info .con .txt-in i.nor { background: rgba(0, 129, 222, 0.08); color: var(--color-point2); font-weight: 600; border: 1px solid rgba(0, 129, 222, 0.15); } 

/* 사업영역 */
.business_area { margin-bottom:8em; } 
.biz_title { text-align: center; margin-bottom: 6rem; } 
.biz_title h2 { font-size: 2.25rem; font-weight: 800; color: var(--color-point3); letter-spacing: -0.05em; } 
.biz_title p { font-size: 0.875rem; color: var(--color-point2); font-weight: 600; margin-top: 0.5rem; letter-spacing: 0.1em; } 
.biz_mix_list { gap: 2rem; } 
.biz_mix_item { align-items: stretch; gap: 2rem; position: relative; } 
.biz_mix_item.reverse { flex-direction: row-reverse; } 
.biz_mix_item .num_side { width: 3.5rem; align-items: center; padding-top: 1rem; display: none; } 
.biz_mix_item .num_side .num { font-size: 1.75rem; font-weight: 700; color: #cbd5e1; transition: color 0.4s ease; } 
.biz_mix_item:hover .num_side .num { color: var(--color-point2); } 
.biz_mix_item .num_side .line { flex: 1; width: 2px; background: #edf2f7; margin-top: 1rem; } 
.biz_mix_item .content_box { flex: 1; background: var(--color-gray-4); border-radius: 1.5rem; border: 1px solid transparent; overflow: hidden; align-items: center; transition: background-color 0.4s ease; } 
/* .biz_mix_item:hover .content_box { background: #fff; border-color: #ccc; } */
.biz_mix_item .txt_box { width: 55%; padding: 3.5rem; box-sizing: border-box; } 
.biz_mix_item .txt_box .sub_tit { font-size: 0.8125rem; color: var(--color-point2); font-weight: 500; letter-spacing: 0.05em; display: block; transition: color 0.4s ease; } 
.biz_mix_item:hover .num_side .num { color: var(--color-point2); } 
/* .biz_mix_item:hover .sub_tit { color:var(--color-point2)!important; } */
.biz_mix_item .txt_box h3 { font-size: 1.75rem; font-weight: 700; color: var(--color-point3); letter-spacing: -0.02em; display: flex; align-items: baseline; gap: 0.75rem; } 
.biz_mix_item .txt_box h3 .kor_tit { font-size: 1.0625rem; font-weight: 500; color: #64748b; font-style: normal; } 
.biz_mix_item .txt_box .desc { font-size: 1rem; color: #555; line-height: 1.7; margin-top: 1.2rem; word-break: keep-all; } 
.biz_mix_item .img_box { width: 45%; height: 20rem; overflow: hidden; } 
.biz_mix_item .img_box img { width: 100%; height: 100%; object-fit: cover; } 
.biz_mix_item .txt_box { width: 65%; } 
.biz_mix_item .txt_box h3 .kor_tit { color: var(--color-point2); } 
.biz_mix_item .img_box { width: 35%; height: 16rem; display: flex; align-items: center; justify-content: center; background: rgba(0, 129, 222, 0.02); position: relative; transition: all 0.4s ease; } 

/* @media (max-width: 48rem){
 .biz_mix_item, .biz_mix_item.reverse { flex-direction: column; } .biz_mix_item .num_side { display: none; } .biz_mix_item .content_box { flex-direction: column; } .biz_mix_item .img_box, .biz_mix_item .txt_box { width: 100%; } .biz_mix_item .img_box { height: 14rem; order: -1; } .biz_mix_item .txt_box { padding: 2rem; } .biz_mix_item .img_box { height: 10rem; } 
 } */

.biz_grid_wrap { gap: 3rem; } 
.biz_grid_item { align-items: center; justify-content: space-between; gap: 1.5rem; min-height:17rem; height: auto; } 
.biz_grid_item.reverse { flex-direction: row-reverse; } 
.biz_grid_item .grid_desc { background-color:var(--color-gray-4); height:100%; padding:3.5rem; border-radius:1.5rem; /* border: 1px solid #ccc; */ transition: background-color 0.4s ease; display:flex; flex-flow:column; justify-content: flex-start; gap:1em; box-sizing:border-box; width:100% } 
.biz_grid_item .grid_desc .top_tit { display:flex; flex-direction:column; gap:0.5em; } 
.biz_grid_item .grid_desc .grid_num { font-size: 0.8125rem; color: var(--color-point2); font-weight: 500; letter-spacing: 0.05em; display: block; } 
.biz_grid_item .grid_desc .grid_tit { font-size: 1.75rem; font-weight: 700; color: var(--color-point3); letter-spacing: -0.02em; display: flex; flex-direction:column; align-items: baseline; } 
.biz_grid_item .grid_desc .grid_tit .kor { font-size: 1.125rem; font-weight: 500; color: var(--color-point3); display: block; margin-top: 0.35rem; } 
.biz_grid_item .grid_desc .grid_txt { font-size: 1rem; color: #555; line-height: 1.7; word-break: keep-all; } 
.biz_grid_item .grid_img { overflow: hidden; border-radius: 1.5rem; background: #f8fafc; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.03); } 
.biz_grid_item .grid_img.large { width: 50%; height: 26rem; } 
.biz_grid_item .grid_img.small { height: 100%; border: 1px solid #ccc; } 

.biz_grid_item .grid_img img { width: 100%; height: 100%; object-fit: cover; } 
/* @media (max-width: 48rem){
 .biz_grid_item, .biz_grid_item.reverse { flex-direction: column; align-items: flex-start; gap: 2rem; } .biz_grid_item .grid_desc, .biz_grid_item .grid_img { width: 100% !important; margin: 0 !important; } .biz_grid_item .grid_img { height: 16rem !important; order: -1; } 
 } */


.no_prod { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8rem 1rem; text-align: center; border:1px solid #ccc; border-radius:1rem; } 
.no_prod .icon_box { margin-bottom: 1.5rem; display: flex; justify-content: center; align-items: center; } 
.no_prod .icon_box img { width: 4rem; height: auto; opacity: 0.7; } 
.no_prod .txt { font-size: 1.125rem; font-weight: 500; color: #333333; line-height: 1.6; margin: 0 0 0.5rem 0; } 
.no_prod .sub_txt { font-size: 0.875rem; color: #888888; line-height: 1.5; margin: 0; } 