@charset "utf-8"; /* CSS Document */
.box0 { width:1800px; max-width:96%; margin:0 auto; } 
.box1 { width:1400px; max-width:96%; margin:0 auto; } 
.box2 { width:1200px; max-width:96%; margin:0 auto; } 
.box3 { width: 1560px; max-width: 96%; margin: 0 auto; } 

html:not(.pop) body { min-height:100vh; min-height:calc(var(--vh, 1vh) * 100) } 

.pcHide { display:none !important; } 
.moHide { } 

.gnb li.m_hide { display:none } 
.gnb .layer { display:none !important; } 
/* #contents .gnb .m_products .layer { display:flex !important; } 
#contents .gnb .m_products .link { display:none !important; } */

.sns .list { gap:.5em; } 
.sns .list > li .in { width:2em; height:2em; background:#fff; border-radius:50%; color:#ca0202; transition:.2s; } 
.sns .list > li .in .xi { font-size:1em; } 
.sns .list > li .in .tt { display:none; } 
.sns .list > li .in:hover { background:#ca0202; color:#fff; } 

.fullH { height:calc(100vh); box-sizing:border-box; } 
.fullMH { min-height:calc(100vh) !important; box-sizing:border-box; } 

.filW { filter:brightness(0) invert(1); } /*화이트*/
.filB { filter:brightness(0) invert(0); } /*블랙*/
.filRE { filter:invert(1); } /*색상반전*/

.headT { padding-top:6.875em; } 
.headH,
#header .gnb_wrap .gnb > li,
#header .gnb_wrap .gnb > li .dp1 { height:6.875em; transition:height .2s, background .2s; box-sizing:border-box; } 

/*header*/
#header { z-index:999; position:fixed; top:0; left:0; width:100%; transition:background .4s; } 
#header:before { content:""; position:absolute; left:0; width:100%; height:1px; top:calc(6.875em - 1px); transition:.2s; } 
#header .inner { color:#fff; } 
#header .logo { width: 23em; } 
#header .side_wrap { width:22em; } 
#header .logo,
#header .all_wrap .all_btn { filter:brightness(0) invert(1); } 

#header .logo > .in img { width:13em; transition:.2s; transform-origin:left center; } 

#header .gnb_wrap .gnb > li { overflow:hidden; } 
#header .gnb_wrap .gnb > li.m_sample{ display: none;}
#header .gnb_wrap .gnb > li .dp1 { position:relative; padding:0 3em; } 
#header .gnb_wrap .gnb > li .dp1 .tt { font-size:1.125em; font-weight:500; text-transform:uppercase; } 
#header .gnb_wrap .gnb > li .dp1:after { content:""; display:block; position:absolute; left:0; bottom:0; width:100%; height:2px; background:#ca0202; opacity:0; transform:scaleX(0); transition:transform .3s; } 
#header .gnb_wrap .gnb > li.act .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after { opacity:1; transform:scaleX(.8); } 
#header:not(.active) .gnb_wrap .gnb > li .dp1:after { filter:brightness(0) invert(1); } 

#header .gnb_wrap .gnb > li .dp2 { display:block; max-width:12em; margin:0 auto; transition:.6s; } 
#header .gnb_wrap .gnb > li .dp2 > li > a { display:block; padding:.75em 1em; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in { position:relative; display:inline-block; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .in:after { content:""; position:absolute; left:0; bottom:-.375em; width:100%; height:1px; background:#ca0202; opacity:0; transform:scaleX(0); transition:transform .3s; } 
#header .gnb_wrap .gnb > li .dp2 > li > a .tt { font-size:1.063em; } 
#header .gnb_wrap .gnb > li .dp2 > li.act > a .in:after { opacity:1; transform:scaleX(1.1); } 
/* #header .gnb_wrap .gnb > li .dp3 { display:none; } */

#header.prodOn .gnb_wrap .gnb > li.m_products { overflow: visible; } 
#header.prodOn .gnb_wrap .gnb > li:not(.m_products) .dp2 { opacity: 0; visibility: hidden; } 
#header .gnb_wrap .gnb > li.m_products .dp2 { position: relative; } 

#header .gnb_wrap .gnb > li.m_products .dp2 > li > a { position: relative; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li:not(:first-child) > a:before { content: ''; position: absolute; width: 1em; height: 1em; transform: rotate(45deg) translateY(-70%); background: #f5f5f5; right: -.125em; top: 50%; transition: .3s; opacity: 0; visibility: hidden; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li:not(:first-child).act > a:before { opacity: 1; visibility: visible; z-index: 1111; } 


#header.prodOn .gnb_wrap .gnb > li.m_products .dp2 > li.act .dp3 { opacity: 1; visibility: visible; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li .dp3 { position: absolute; left: 100%; top: 0; /* transform: translateY(-50%); */ z-index: 1111; transition: .3s; padding: 2em 0; background: #f5f5f5; opacity: 0; visibility: hidden; width: 100%; height: 100%; flex-direction: column; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li.act .dp3 { opacity: 1; visibility: visible; } 

#header .gnb_wrap .gnb > li.m_products .dp2 > li .dp3 > li.act { background: #eee; } 

#header .gnb_wrap .gnb > li.m_products .dp2 > li .dp3 > li .dp4 { position: absolute; left: 100%; top: 0; /* transform: translateY(-50%); */ z-index: 1111; transition: .3s; padding: 2em 0; background: #eee; opacity: 0; visibility: hidden; width: 100%; height: 100%; flex-direction: column; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li.act .dp3 > li.act .dp4 { opacity: 1; visibility: visible; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li.act .dp3 > li.act .dp4 > li.act { background: #ddd; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li.act .dp3 > li .dp4 > li > a { padding: .75em .5em; position: relative; } 
#header .gnb_wrap .gnb > li.m_products .dp2 > li .dp3 > li > a { padding: .75em .5em; } 

#header .side_wrap .btn_list { margin-right: 1.5em; } 
#header .side_wrap .btn_list > li .con { display: flex; align-items: center; gap: .25em; background: #fbe300; color: #3b1e1e; border-radius: 10em; position: relative;height: 2.5em;width: 100%;padding: 0 1em;box-sizing: border-box; } 
#header .side_wrap .btn_list > li .con > .quick_icon { } 
#header .side_wrap .btn_list > li .con > .tt { font-size: .9em; font-weight: 600;} 

#header.searchOpen .headH { height:6.875em !important; } 
#header.searchOpen .logo { z-index:999; filter:none; } 
#header.searchOpen .logo > .in img { transform:scale(1) !important; } 
#header.searchOpen .side_wrap { position:relative; } 
#header.searchOpen .util_wrap .search_btn { position:absolute; z-index:999; top:2em; right:3vw; color:#000; } 
#header.searchOpen .util_wrap .search_btn .ico { font-size:2.500em; transition:.4s; } 
#header.searchOpen .util_wrap .search_btn .ico:before { content:"\e921"; } 
#header.searchOpen .util_wrap .search_btn:hover .ico { transform:rotate(180deg); } 
#header.searchOpen .util_search { opacity:1; visibility:visible; pointer-events:auto; } 

#header .util_search { position:fixed; top:0; left:0; width:100%; z-index:99; opacity:0; visibility:hidden; pointer-events:none; } 
#header .util_search .wrap_con { position:absolute; top:0; left:0; width:100%; padding:6em 0; background:#fff; box-shadow:0 .5em 1em rgba(0,0,0,.2); text-align:center; color:#000; } 
#header .util_search .wrap_con .wrap_in { gap:2em 0; width:800px; } 
#header .util_search .wrap_con .tit .tt { font-size:2.500em; } 
#header .util_search .wrap_con .search { position:relative; } 
#header .util_search .wrap_con .search .inp { width:3.5em; height:3.5em; box-sizing:border-box; border:none; font-size:1.375em; } 
#header .util_search .wrap_con .search .inp.txt { flex:1; padding:0 1em; background:#f5f5f5; } 
#header .util_search .wrap_con .search .inp.btn { background:var(--siteC); color:#fff; } 
#header .util_search .hot_keyword { gap:.25em; } 
#header .util_search .hot_keyword > li { } 
#header .util_search .hot_keyword > li .in { padding:0 1em; height:2.5em; border:1px solid #eee; border-radius:6em; color:#555; transition:.2s; } 
#header .util_search .hot_keyword > li .in:hover { background:var(--siteC); border-color:var(--siteC); color:#fff; } 


#header .util_wrap { gap:0 1.5em; } 
#header .util_wrap > li .in .ico { font-size:1.500em; } 

#header .util_wrap .lang { position:relative; } 
#header .util_wrap .lang .lang_btn { height:2.5em; padding:0 1em; gap:0 .5em; border:1px solid rgba(0,0,0,.15); border-radius:3em; } 
#header .util_wrap .lang .lang_btn .tt { font-size:.938em; font-weight:500; } 
#header .util_wrap .lang .lang_btn .arrow { font-size:1.125em; transition:transform .2s; } 
#header .util_wrap .lang .lang_btn .arrow:before { content:"\e942"; } 
#header .util_wrap .lang .drop { display:none; position:absolute; top:100%; left:0; margin-top:.25em; padding:.5em .5em; width:100%; background:#fff; border:1px solid rgba(0,0,0,.15); border-radius:1em; box-sizing:border-box; text-align:center; color:#000; } 
#header .util_wrap .lang .drop > li > a { display:block; padding:.25em .25em; transition:.2s; } 
#header .util_wrap .lang .drop > li > a .tt { font-size:.875em; } 
#header .util_wrap .lang .drop > li > a:hover { background:#f5f5f5; } 
#header .util_wrap .lang.on .drop { display:block; } 
#header .util_wrap .lang.on .lang_btn .arrow { transform:rotate(-180deg); } 

#header:not(.active) .util_wrap .lang .lang_btn { border-color:rgba(255,255,255,.3); } 
#header:not(.active) .util_wrap .lang .drop { background:transparent; border-color:rgba(255,255,255,.3); color:#fff; } 
#header:not(.active) .util_wrap .lang .drop > li > a:hover { background:rgba(0,0,0,.4); } 

#header .all_wrap { color:#000; } 
#header .all_wrap .all { width:5.5em; height: 6.875em; display: flex; align-items: center; } 
#header .all_wrap .all_btn { position:relative; display:block; width:2.5em; height:1.125em; margin-left:auto; } 
#header .all_wrap .all_btn .ham,
#header .all_wrap .all_btn .ham:before,
#header .all_wrap .all_btn .ham:after { display:block; width:100%; height:2px; background:#000; transition:.2s, background 0s; } 
#header .all_wrap .all_btn .ham:before,
#header .all_wrap .all_btn .ham:after { content:""; position:absolute; left:0; } 
#header .all_wrap .all_btn .ham:before { top:calc(50% - 1px); width:75%; } 
#header .all_wrap .all_btn .ham:after { top:calc(100% - 2px); width:88%; } 
#header .all_wrap .all_btn:hover .ham:before { width:100%; } 
#header .all_wrap .all_btn:hover .ham:after { width:100%; } 

#header .all_wrap .all_layer { position:fixed; top:0; left:0; width:100%; height:100vh; background:#fff; opacity:0; visibility:hidden; pointer-events:none; } 
#header .all_wrap .all_layer .all_inner { width:100%; min-height:100%; overflow:hidden; } 
#header .all_wrap .all_layer .all_inner > .wrap_bg { width:40%; padding:4vw 4vw; opacity:0; } 
#header .all_wrap .all_layer .all_inner > .wrap_in { flex:1; padding:15vh 8em 4vw; overflow:hidden; } 
#header .all_wrap .all_layer .all_inner > .wrap_bg .img { flex:1; } 
#header .all_wrap .all_layer .wrap_middle { padding-bottom:3em; opacity:0; transform:translateY(2em); } 
#header .all_wrap .all_layer .wrap_middle .gnb { display:block; } 
#header .all_wrap .all_layer .wrap_middle .gnb li a { position:relative; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li.m_products .dp2 { flex-wrap: wrap; gap: 1em 0; } 
#header .all_wrap .all_layer .wrap_middle .gnb li .dp3 { display: none; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li + li { margin-top:4em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 { display:inline-block; text-align:left !important; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt { /* font-family:'Gowun Batang', 'Pretendard', 'Noto Sans KR', sans-serif; */font-size:2.000em; font-weight:600; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 { margin-top:1.5em; align-items:center; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li:not(:last-child) > a:after { content:""; margin:0 1.5em; width:1px; height:1em; background:rgba(0,0,0,.2); } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .tt { font-size:1.063em; } 
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li.act > a .tt { text-decoration:underline; } 
#header .all_wrap .all_layer .wrap_bottom { opacity:0; } 
#header .all_wrap .all_layer .wrap_bottom .cs { padding:.5em 0; font-size:1.375em; font-weight:700; } 

.allGnbOn { overflow-y:hidden } 
.allGnbOn body { overflow-y:scroll } 
.allGnbOn #header .all_wrap .all_btn { z-index:999; position:fixed; top:2em; right:3em; width:3.5em; height:3.5em; filter:none; } 
.allGnbOn #header .all_wrap .all_btn .ham { background:transparent !important; transition:0s; } 
.allGnbOn #header .all_wrap .all_btn .ham:before,
.allGnbOn #header .all_wrap .all_btn .ham:after { width:100% !important; top:50% !important; } 
.allGnbOn #header .all_wrap .all_btn .ham:before { transform:rotate(45deg); } 
.allGnbOn #header .all_wrap .all_btn .ham:after { transform:rotate(-45deg); } 
.allGnbOn #header .all_wrap .all_layer { z-index:99; opacity:1; visibility:visible; pointer-events:all; } 
.allGnbOn #header .all_wrap .all_layer .all_inner > .wrap_bg { opacity:1; transition:1s; transition-delay:.2s; } 
.allGnbOn #header .all_wrap .all_layer .wrap_middle { opacity:1; transform:translate(0); transition:1s; transition-delay:.2s; } 
.allGnbOn #header .all_wrap .all_layer .wrap_bottom { opacity:1; transition:1s; transition-delay:.4s; } 


.scroll .headH,
.scroll #header .gnb_wrap .gnb > li,
.scroll #header .gnb_wrap .gnb > li .dp1 { height:5em; } 
.scroll #header .logo > .in img { transform:scale(.9,.9); } 
.scroll #header:before { top:calc(5em - 1px); } 

.wrapHide { height:5em; } 
.stickyT { position:sticky !important; top:5em; } 

#header.active { background:#fff; } 
#header.active .inner { color:#000; } 
#header.active .logo,
#header.active .all_wrap .all_btn { filter:none; } 
#header.active .all { height: 5em; } 
#header.active .gnb_wrap .gnb > li.act .dp1,
#header.active .gnb_wrap .gnb > li.on .dp1 { color:#ca0202; } 

#header.gnbOpen { box-shadow:0 4px 1em rgba(0,0,0,.15); } 
#header.gnbOpen:before { background:#000; opacity:.1; } 
#header.gnbOpen .gnb_wrap .gnb > li { height:auto; } 
#header.gnbOpen .gnb_wrap .gnb .dp2 { padding:2em 0; } 

#quick_new { position:fixed; z-index:100; bottom:6em; right:2.5em; text-align:right; } 
#quick_new .quick_wrap { position:relative; height:3.5em; width: 100%; padding: 0 1.5em; box-sizing:border-box; } 
#quick_new .quick_wrap > .in { position:relative; white-space:nowrap; overflow:hidden; } 
#quick_new > li .quick_wrap:before { content:''; position:absolute; top:0; right:0; width:100%; height:100%; border-radius: 10em; } 
#quick_new > li .quick_wrap .quick_icon { text-align:center } 
#quick_new > li .quick_wrap .quick_icon > .xi { font-size: 1.5em; } 
#quick_new > li .quick_wrap .quick_tt { font-size:1.063em; font-weight:600; padding-left: .5em; } 

#quick_new > li .kakao_btn { color:#3b1e1e; } 
#quick_new > li .kakao_btn:before { background:#fbe300; } 
#quick_new > li .insta_btn { color: #fff; } 
#quick_new > li .insta_btn:before { background: #e82155; } 
#quick_new > li .call_btn { color:#fff; } 
#quick_new > li .call_btn:before { background:var(--siteC); } 
#quick_new > li .naver_btn { color:#00c63b; } 
#quick_new > li .naver_btn:before { background:#fff; border:1px solid #00c63b; } 


#footer { background:rgb(23, 20, 21); color: #fff; } 
#footer .gotop { position:fixed; right:1em; bottom:1em; width:3.5em; line-height:3.5em; background:#000; text-align:center; color:#fff; border-radius:50%; transition:.3s; transform:translateY(100%); opacity:0; visibility:hidden; border:1px solid rgba(255,255,255,.2); z-index:3; } 
#footer .gotop .xi { font-size:1.5em } 
#footer .gotop:hover { background: var(--siteC); } 
body.scroll #footer .gotop { transform:translateY(0); opacity:1; visibility:visible } 
#footer .wrapIn { display:flex; align-items:flex-start; gap:4em; padding:4em 0 } 
#footer .logo_wrap { display:flex; flex-wrap:wrap; align-items:center; gap:2em; flex:1 1 0%; min-width:0 } 
#footer .logo_wrap .logo img { display:block; height:2em; filter: brightness(0) invert(1); } 
#footer .info { width:100% } 
#footer .info > li { float:left; margin-right:2em; font-size:.875em; font-weight:700; opacity:.8; margin-bottom:.5em } 
#footer .info > li.br { clear:left } 
#footer .info:after { content:""; display:block; clear:both } 
#footer .info > li.copyright { font-size:.75em; opacity:.5; text-transform:uppercase; letter-spacing:0; margin-top:1.5em } 
#footer .menu { display:flex; gap:2em } 
#footer .menu > li > a { font-weight:700; font-size:.938em; color: rgba(255,255,255, .75) } 
#footer .menu > li.point > a { font-weight:700; color: #fff; } 
#footer .menu > li:hover > a { color: rgba(255,255,255, .9) } 
#footer .menu_wrap,
#footer .etc_wrap { margin-top:1em } 
#footer .menu_wrap .gnb { gap: 2em; } 
#footer .menu_wrap .gnb > li { width: 12em; } 
#footer .menu_wrap .gnb > li:not(.m_product, .m_community, .m_sample),
#footer .menu_wrap .gnb > li .dp4 { display:none } 
#footer .menu_wrap .gnb a { text-align:left; justify-content: start; } 
#footer .menu_wrap .gnb a.layer { display: none; } 
#footer .menu_wrap .gnb > li .dp3,
#footer .menu_wrap .gnb > li .dp2 { gap: .5em; flex-wrap: wrap; } 
#footer .menu_wrap .gnb > li .dp2 > li { width: calc(50% - .25em); } 
#footer .menu_wrap .gnb > li .dp2 > li > a .tt,
#footer .menu_wrap .gnb > li .dp1 .tt { font-weight:800; text-transform:uppercase; font-size: 1.15em; } 
#footer .menu_wrap .gnb > li .dp2 > li > a .tt { transition: .2s; } 
#footer .menu_wrap .gnb > li .dp2 > li > a:hover .tt { color: #fff; } 
#footer .menu_wrap .gnb > li .dp1 .in { margin-bottom: 1em; } 
#footer .menu_wrap .gnb > li .dp3 > li > a .tt,
#footer .menu_wrap .gnb > li .dp2 > li > a .tt { font-weight:700; font-size:.875em; color:#777 } 
#footer .menu_wrap .gnb > li .dp3 > li:hover > a .va,
#footer .menu_wrap .gnb > li .dp2 > li:hover > a .va { } 
#footer .etc_wrap { display:flex; flex-direction:column; align-items:flex-end; gap:1em; width: 15%; } 
#footer .cs_wrap { text-align:right } 
#footer .cs_wrap .t1 { font-weight:700; font-size:1.125em; color:#666 } 
#footer .cs_wrap .call { display:flex; align-items:center; gap:.5em } 
#footer .cs_wrap .call .xi { width:2em; height:2em; background:#fff; color:var(--siteC2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1em } 
#footer .cs_wrap .call .no { font-weight:700; font-size:1.25em; } 
#footer .sns_wrap { display:flex; gap:1em } 
#footer .sns_wrap > li > a { color:#999; width:2em; height:2em; border-radius:50%; display:flex; align-items:center; justify-content:center } 
#footer .sns_wrap > li > a .xi { font-size:1.5em } 
#footer .sns_wrap > li:hover > a { color: #333; } 
#footer .site_wrap { position:relative; z-index:1 } 
#footer .site_wrap .btn { display:block; padding:.75em 1em; padding-right:3em; background:#fff; width:9em; position:relative; } 
#footer .site_wrap .btn .xi { position:absolute; right:0; width:2.5em; text-align:center; top:50%; color: #111; line-height:1em; margin-top:-.5em; transition:.3s; font-size:1em } 
#footer .site_wrap .btn .tt { font-weight:700; font-size:.875em; color:#666 } 
#footer .site_wrap .siteBtn { font-weight:500 } 
#footer .site_wrap .list { position:absolute; bottom:100%; width:100%; transition:.3s; opacity:0; visibility:hidden } 
#footer .site_wrap .list .btn { overflow:hidden } 
#footer .site_wrap .list .btn .xi { right:-2em } 
#footer .site_wrap .list .btn .xi:before { transform:scale(.75) } 
#footer .site_wrap .list .btn:hover { background:#ddd; } 
#footer .site_wrap .list .btn:hover .xi { right:0 } 
#footer .site_wrap.on .list { opacity:1; visibility:visible } 
#footer .site_wrap.on .siteBtn .xi { transform:rotate(180deg) } 

html:lang(ko) #footer .lang-ko { display: inline-block; } 
html:lang(ko) #footer .lang-not { display: none; } 
html:not(:lang(ko)) #footer .lang-not { display: inline-block; } 
html:not(:lang(ko)) #footer .lang-ko { display: none; } 
/*contents*/
.subLayout #contents { padding-top: 10em; } 
.subLayout.dp2_detailView #contents { padding-top: 7em; } 
#contents { } 
#contents .sub_page_top { position:relative; height:36em; text-align:center; } 
#contents .sub_page_top > .bg { position:absolute; top:0; left:0; width:100%; height:100%; } 
#contents .sub_page_top > .bg:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(180deg,rgba(0,0,0,.6) 40%,rgba(0,0,0,.15) 100%); } 
#contents .sub_page_tit { position:relative; flex:1; color:#fff; } 
#contents .sub_page_tit .sub_txt { margin-bottom:1em; } 
#contents .sub_page_tit .sub_txt .tt { font-size:1.250em; opacity:.5; } 
#contents .sub_page_tit .sub_tit .tt { font-size:3.250em; font-weight:700; } 

#contents .sub_page_menu { position:relative; } 
#contents .sub_page_menu .gnb { display:block; } 
#contents .sub_page_menu .gnb > li:not(.m_products) .dp3 { display:none; } 
#contents .sub_page_menu .gnb > li .dp2 { justify-content:center; } 
#contents .sub_page_menu .gnb > li .dp2 > li { width:25%; max-width: 15%; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 { position: relative; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li { flex: 1 1 auto; max-width: auto; width: auto; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li.m2_all .link { display: flex !important; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li.m2_all .layer { display: none !important; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li.m2_new .link { display: flex !important; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li.m2_new .layer { display: none !important; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 { display: none; position: absolute; width: 100%; top: 100%; left: 0; background: #fff; border: 1px solid #ddd; border-top: none; border-radius: 0 0 10px 10px; z-index: 11; box-shadow: 0 10px 10px rgba(0,0,0,.05); } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li { flex: 1; position: relative; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li > a { font-size: 1.125em; font-weight: 500; transition: .35s; color: #aaa; position: relative; padding: 2em; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li:hover > a,
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.on > a { color: #333; font-weight: 700; } 


#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li > a:before { content: ''; position: absolute; left: 50%; bottom: 1em; transform: translateX(-50%); background: #ca0202; width: 0; height: 2px; opacity: 0; transition: .3s; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li:hover > a:before,
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.on > a:before { width: 50%; opacity: 1; } 


/* #contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ > a { display: none; } */
/* #contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_.on > a { display: none; } */
/* #contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ > a.layer { display: block !important; } */
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4 { display: none; background: #f5f5f5; border-radius: 10px; position: relative; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4:before { content: ''; position: absolute; width: 10px; height: 10px; transform: rotate(45deg) translateX(-50%); left: 50%; top: -2px; background: #f5f5f5; z-index: -1; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_:hover .dp4 { display: block; position: absolute; left: 0; top: 100%; width: 100%; box-shadow: 0 0 10px rgba(0,0,0,.1); border: 1px solid #ddd; overflow: hidden; background: #fff; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4 > li { } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4 > li > a { padding: 1em; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4 > li.on,
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_ .dp4 > li:hover { background: #f5f5f5; } 
#contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp3 > li.m3_0003_0023_.on .dp4 > li:last-child { margin-bottom: 0; } 

/* #contents .sub_page_menu .gnb > li.m_products .dp2 > li .dp4 { display: none; } */
#contents .sub_page_menu .gnb > li.m_products .dp2 > li.on .dp3 { display: flex; } 
#contents .sub_page_menu .gnb > li .dp2 > li > a { position:relative; padding:0 .5em; height:5em; background:rgba(0,0,0,.3); transition:.2s; color: #fff; } 
#contents .sub_page_menu .gnb > li .dp2 > li + li > a:before { content:""; position:absolute; top:50%; left:0; width:1px; height:1em; background:#ccc; transform:translateY(-50%); } 
#contents .sub_page_menu .gnb > li .dp2 > li > a .tt { font-size:1.188em; font-weight:500; } 
#contents .sub_page_menu .gnb > li .dp2 > li.act > a,
#contents .sub_page_menu .gnb > li .dp2 > li.on > a { color:#ca0202; background: #fff; } 
#contents .sub_page_menu .gnb > li .dp2 > li.on > a:after { opacity:1; } 
#contents .sub_page_menu .gnb > li .dp2 > li.on + li > a:before { display: none; } 

/*
.subLayout .headH,
.subLayout #header .gnb_wrap .gnb > li,
.subLayout #header .gnb_wrap .gnb > li .dp1 { height:5em; } 
.subLayout #header .logo > .in img { transform:scale(.9,.9); } 
.subLayout #header:before { top:calc(5em - 1px); } 
*/

.subLayout #header { background:#fff; border-bottom: 1px solid #ddd; } 
.subLayout #header .inner { color:#000; } 
.subLayout #header .logo,
.subLayout #header .all_wrap .all_btn { filter:none; } 
.subLayout #header .all { height: 5em; } 
.subLayout #header .gnb_wrap .gnb > li.act .dp1,
.subLayout #header .gnb_wrap .gnb > li.on .dp1 { color:#ca0202; } 

.subLayout #contents .sub_page_menu .gnb > li .dp2 { justify-content: start; gap: .75em; } 
.subLayout #contents .sub_page_menu .gnb > li .dp2 > li { width: auto; max-width: auto; } 
.subLayout #contents .sub_page_menu .gnb > li .dp2 > li + li > a:before { display: none; } 
.subLayout #contents .sub_page_menu .gnb > li .dp2 > li > a .tt { font-weight: 600; } 
.subLayout #contents .sub_page_menu .gnb > li .dp2 > li > a { display: flex; align-items: center; justify-content: center; padding: 0 1.5em; box-sizing: border-box; border: 1px solid #000; background: #fff; height: 3em; border-radius: 150px; color: #171717; } 
.subLayout #contents .sub_page_menu .gnb > li .dp2 > li.on > a { background: #000; border: #000; color: #fff; box-shadow: 0 0 1em rgba(0,0,0, .2); } 

#contents .sub_con_tit { padding:0em 0 0; text-align:center; } 
#contents .sub_con_tit .tt { position:relative; display:inline-block; font-size:2.500em; font-weight:700; } 

#contents .sub_con_top { padding: 2em 0 3em; } 
/* #contents .sub_con_top .con_nav { margin-bottom:1.25em; } */
#contents .sub_con_top .con_nav > li { position:relative; padding:0 .625em 0 1.25em; color:#888; } 
#contents .sub_con_top .con_nav > li:before { content:"\e93e"; font-family:xeicon; position:absolute; left:0; top:50%; transform:translateY(-50%); font-size:.750em; color:#888; } 
#contents .sub_con_top .con_nav > li:first-child:before { display:none; } 
#contents .sub_con_top .con_nav > li:first-child { padding:0 .25em 0 0; } 
#contents .sub_con_top .con_nav > li:last-child .tt { color:#333; font-weight:600; } 
#contents .sub_con_top .con_nav > li > * { display:block; } 
#contents .sub_con_top .con_nav > li .home .xi { font-size:1.125em; } 
#contents .sub_con_top .con_nav > li .tt { font-size:1em; } 

.subLayout #contents .sub_con_top { padding: 0 0 1.5em; } 

#contents .sub_slogan { margin-bottom: 2.5em; } 
#contents .sub_slogan > .tt { font-size: 3.515em; text-transform: uppercase; font-weight: 700; } 

#contents .doc { padding:4em 0 10em; } 
#contents .doc.search { padding: 2em 0 10em; } 


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


/*SUB PAGE*******************/
/*inc*/
.page_con { padding:6em 0; } 
.page_con:last-child { padding-bottom:10em; } 
.page_con.bg1 { position:relative; } 
.page_con.bg1:before { content:""; z-index:-1; position:absolute; top:0; right:0; width:40%; height:100%; background:#f5f5f5; } 
.page_con.bg1.bgL:before { right:auto; left:0; width:60%; } 

.page_txt:not(:last-child) { margin-bottom:3em; } 
.page_txt.m1 { margin-bottom:1.5em; } 
.page_txt.m2 { margin-bottom:5em; } 
.page_txt.b1 { padding:1em 1.5em; background:#f5f5f5; } 
.page_txt .tit.icon { position:relative; } 
.page_txt .tit.icon:before { content:""; } 

.page_txt .tit + .tit { margin-top:1em; } 
.page_txt .tit + .txt { margin-top:2em; } 
.page_txt > .txt { margin-top:2em; } 
.page_txt > .txt:first-child { margin-top:0; } 

.page_txt .line { } 
.page_txt .line:before { content:""; display:inline-block; width:1px; height:2px; background:#ca0202; } 
.page_txt .line.w { margin:1.75em 0; } 
.page_txt .line.w:before { width:2.25em; } 
.page_txt .line.h { margin:1.5em .125em; } 
.page_txt .line.h:before { height:1.5em; } 
.page_txt .line:first-child { margin-top:0; } 
.page_txt .line:last-child { margin-bottom:0; } 
.page_txt .line + .tit,
.page_txt .line + .txt { margin-top:0; } 

.page_col { gap:2em 6em; } 
.page_col > li { } 
.page_col > li.w1 { width:40%; } 
.page_col + .page_col { margin-top:8em; } 
.page_col > li .p1 { padding:3em 0 4em 0; } 
.page_col > li .round { border-radius:2em; overflow:hidden; } 
.page_col > li .wrap_img { position:relative; height:100%; } 
.page_col > li .wrap_img.w1 { width:80%; margin:0 auto; } 


/**/
.agree_box { border-radius:.5em; border:1px solid #ddd; padding:1.5em 2em; color:#555; line-height:1.8; } 
.agree_box.h1 { height:12em; overflow-y:auto; } 
.agree_box p { padding:.5em 0; } 
.agree_box strong { font-size:1.125em; color:#000; } 


/***********************/
/*POPUP******************/
.popWrap.def { width:52em; } 
.popWrap.mem { width:28em; } 
.popWrap.msg { width:38em; } 


/***********************/
/*MAIN******************/
.main #header { transition:transform .4s; } 
.main #header.up { transform:translateY(-100%); } 

.h100 { height:100vh; box-sizing:border-box } 

.visualSlider .el { position:relative; overflow:hidden; height:100vh; } 
.visualSlider .el .vod { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover } 
.visualSlider .el .vod_wrap:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.4) } 
.visualSlider .el .bg { position:absolute; left:0; top:0; width:calc(100% + 4em); height:100%; opacity:0; transition:3s, opacity 5s; filter: brightness(50%); } 
.visualSlider .el.swiper-slide-active .bg,
.visualSlider .el.swiper-slide-duplicate-active .bg { left:-4em; opacity:1; transition:5s, opacity 1s; } 
.visualSlider_wrap .slogan { position:absolute; left:0; width:100%; /* top:50%; transform:translateY(-50%); */ bottom: 11em; z-index:10; color:#fff; text-align:left; } 
.visualSlider_wrap .slogan .wrap_in { display:flex; flex-direction:column; /* align-items:center */ } 
.visualSlider_wrap .slogan .t1 { font-size:1.375em; font-weight:500; white-space:nowrap; opacity:0; letter-spacing:.5em; } 
.visualSlider_wrap .slogan .t2 { font-size:2.915em; font-weight:600; /* margin-top:.875em */ } 
.visualSlider_wrap .slogan .t3 { font-size:1.438em; opacity:0; margin-top:.5em; line-height: 1.5em; } 
.visualSlider_wrap .slogan .row { height:1.125em; display:block; overflow:hidden; margin-bottom:.15em; line-height:1 } 
.visualSlider_wrap .slogan .row .in { display:inline-block; transform:translateY(150%) } 
.visualSlider_wrap .el.swiper-slide-active .slogan .t1 { transition:2s; opacity:.6; letter-spacing:0; } 
.visualSlider_wrap .el.swiper-slide-active .slogan .t3 { transition:2s; opacity:1; transition-delay:1s } 
.visualSlider_wrap .el.swiper-slide-active .slogan .row .in { transition:1.5s; transform:translateY(0) } 
.visualSlider_wrap .el.swiper-slide-active .slogan .row:nth-child(2) .in { transition-delay:.6s } 

.visualSlider_control { position:absolute; left:0; bottom:2em; width:100%; z-index:10 } 
.visualSlider_control .paging { color:#fff; width:auto; display:flex } 
.visualSlider_control .paging span { position:relative; background:rgba(255,255,255,.5); opacity:1; width:0; height:3px; border-radius:0; position:relative; transition:.3s; height:2px; counter-increment: vIndex; display:block; margin:0 1.5em } 
.visualSlider_control .paging span:before { content:counter(vIndex); position:absolute; right:100%; top:50%; width:1.5em; transform:translateY(-50%) } 
.visualSlider_control .paging span:nth-child(-n+10):before { content:"0" counter(vIndex); font-size:.875em } 
.visualSlider_control .paging { margin-left:1.5em } 
.visualSlider_control .paging > span:after { content:""; position:absolute; left:0; top:0; width:0; height:100%; background:#fff } 
.visualSlider_control .paging > span.swiper-pagination-bullet-active { width:5em } 
.visualSlider_control .paging > span.swiper-pagination-bullet-active:after { width:100%; transition:7s } 
.visualSlider_control .swiperBtn { margin-left:.25em } 

.visualSlider_arrow { position:absolute; top:50%; left:0; width:100%; z-index:10; } 
.visualSlider_arrow .swiperBtn { position:absolute; top:0; transform:translateY(-50%); font-size:4.500em; cursor:pointer; opacity:.6; transition:.2s; } 
.visualSlider_arrow .swiperBtn.prev { left:1vw; } 
.visualSlider_arrow .swiperBtn.next { right:1vw; } 
.visualSlider_arrow .swiperBtn:hover { opacity:1; } 


.family_wrap { } 
.family_wrap .familyCon { width:100%; overflow:hidden; } 
.family_wrap .familySlide { width:100%; padding:0 2.5em; animation: slideLeft 5s linear infinite; } 
.family_wrap .familySlide .item { min-width:12em; } 

.mainSlide_wrap.ani { overflow: visible !important; } 

/* .mainClientSlide { width:100%; overflow:hidden; padding:3.8em 0; padding-bottom:1em; } 
.mainClientSlide .swiper-wrapper { width:fit-content; animation: slideLeft2 20s linear infinite; } 
.mainClientSlide .swiper-slide { width:fit-content; padding:0 0; } 
.mainClientSlide .swiper-slide .slide_st { width: 19.5em; position: relative; margin-right: 20px; } */

.mainSlide_wrap.ani { width:100%; overflow:hidden; padding:3.8em 0; padding-bottom:1em; } 
.mainSlide_wrap.ani .mainClientSlide { width:fit-content; animation: slideLeft2 35s linear infinite; display: flex; } 
.mainSlide_wrap.ani .swiper-wrapper { width:fit-content; padding:0 0; } 
.mainSlide_wrap.ani .swiper-wrapper .swiper-slide { width:19.5em; position: relative; margin-right: 20px; } 
/* .family_wrap2 .familySlide2 .item:after { content: ''; position: absolute; height: 2em; width: 1px; background-color: #ddd; right: 0; top: 50%; transform: translateY(-50%); } */

@keyframes slideLeft2 { 100% { transform: translateX(-50%); } 

0% { transform: translateX(0); } 
 }

@keyframes slideLeft { 100% { transform: translate3d(-60rem, 0, 0); } 

0% { transform: translate3d(0, 0, 0); } 
 }


#nav { position: fixed; left:3vw; width:auto; bottom:3em; z-index:1; display:flex; } 
#nav:before { content:""; position:absolute; left:0; top:50%; width:calc(100% - 5em); height:1px; background:#fff; opacity:.2 } 
#nav > li * { display:inline-block; vertical-align:middle; } 
#nav > li > a { color:#fff; width:5em; position:relative; opacity:.6 } 
#nav > li > a .dot { width:.5em; height:.5em; border-radius:50%; background:#fff; position:relative; transform:translateX(-50%); } 
#nav > li > a .dot:after { content:""; position:absolute; left:50%; top:50%; width:100%; height:100%; border:1px solid #fff; transform:translate(-50%, -50%) scale(2); border-radius:50%; opacity:0 } 
#nav > li > a .tt { position:absolute; left:0; top:100%; transform:translateX(-50%); margin-top:.75em; width:100%; text-align:center; opacity:0 } 
#nav > li > a .t1 { font-size:.750em; font-weight:300; text-transform:uppercase; } 
#nav > li:hover > a,
#nav > li.on > a,
#nav > li:hover > a .dot:after,
#nav > li.on > a .dot:after,
#nav > li:hover > a .tt,
#nav > li.on > a .tt { opacity:1; transition:.3s } 
#nav.filB { opacity:.7; } 

.fp-viewing-0 #nav,
.nav_non #nav { opacity: 0; visibility: visible; clip-path: inset(100%); } 

.moveDownAni { animation-name:moveDownAni; animation-duration: 3s; transform-origin:center; animation-iteration-count:infinite } 
@keyframes moveDownAni { 100% { top:150% } 
 }

.moveUpDownAni { animation:moveUpDownAni 1.5s ease-in-out infinite; } 
@keyframes moveUpDownAni { 
 0% { transform:translateY(-.5em); } 
50% { transform:translateY(.5em); } 
100% { transform: translateY(-.5em); } 
 }

.gradientAni { background-size:200% 200%; animation:gradientAni 6s infinite cubic-bezier(0.65, 0, 0.35, 1); } 
@keyframes gradientAni { 
 0% { background-position:0% 50%; } 
50% { background-position:100% 50%; } 
100% { background-position:0% 50%; } 
 }

.rotateAni { animation:rotateAni 8s linear infinite; } 
@keyframes rotateAni { 100% { transform:rotate(360deg); } 
 }

.fpR { transform:translateX(-10%); opacity:0; transition:1s } 
.fp-section.active .fpR { transform:translateX(0); opacity:1 } 
.fpL { transform:translateX(10%); opacity:0; transition:1s } 
.fp-section.active .fpL { transform:translateX(0); opacity:1 } 
.fpT { transform:translateY(50%); opacity:0; transition:1s } 
.fp-section.active .fpT { transform:translateY(0); opacity:1 } 
.fpB { transform:translateY(-50%); opacity:0; transition:1s } 
.fp-section.active .fpB { transform:translateY(0); opacity:1 } 
.fpZ { transform:scale(.5); opacity:0; transition:1s } 
.fp-section.active .fpZ { transform:scale(1); opacity:1 } 
.fpO { opacity:0; transition:2s } 
.fp-section.active .fpO { opacity:1 } 

.section.fix .fpR,
.section.fix .fpL,
.section.fix .fpT,
.section.fix .fpO { transform:translate(0); opacity:1; } 


.main .section { word-break:keep-all; } 
.main_con.p1 { padding:9em 0 10em; } 
.main_con.p1 + .main_con.p1 { padding-top:0; } 

.main_txt { margin-bottom:2em; } 
.main_txt.white { color: #fff; } 
.main_txt:last-child { margin-bottom:0; } 
.main_txt.m1 { margin-bottom:1em; } 
.main_txt.m2 { margin-bottom:5em; } 
.main_txt .tit { margin-top:1.25em; } 
.main_txt .txt { margin-top:2em; line-height:1.6; } 
.main_txt .tit:first-child,
.main_txt .txt:first-child { margin-top:0; } 
.main_txt .o1 { opacity:.7; } 
.main_txt .t1 { font-size:1.000em; } 
.main_txt .t2 { font-size:1.063em; } 
.main_txt .t3 { font-size:1.125em; } 
.main_txt .t4 { font-size:1.250em; } 
.main_txt .t5 { font-size:1.375em; } 
.main_txt .t6 { font-size:1.500em; } 
.main_txt .t7 { font-size:1.750em; } 
.main_txt .t8 { font-size:2.000em; } 
.main_txt .t9 { font-size:2.625em; } 
.main_txt .t10 { font-size:3.000em; } 
.main_txt .t11 { font-size:3.750em; } 
.main_txt .t12 { font-size:6.750em; } 

.main_txt .tit a { position:relative; display:inline-block; } 
.main_txt .tit a:before { content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background:#ca0202; opacity:0; transform:scaleX(0); transition:transform .2s; } 
.main_txt .tit a:hover:before { opacity:1; transform:scaleX(1); } 
.main_nature .main_txt .tit a:before { background:#006838; } 

.main_txt .ttIco { position:relative; display:inline-block; } 
.main_txt .ttIco:before { content:""; position:absolute; left:calc(100% - .5em); bottom:calc(100% - .25em); width:1.375em; height:1.375em; background:url(../images/inc/logoS.svg) no-repeat 50% 50%; background-size:contain; transform:rotate(25deg); } 

.main_more > .more { position:relative; gap:0 1em; padding:.5em 2em; height:3.75em; min-width:12em; background:#ca0202; border-radius:6em; text-align:center; color:#fff; } 
.main_more > .more .in_tt { font-size:1.125em; font-weight:500; } 
.main_more > .more .xi { font-size:1.250em; } 

.main_more > .more.st1 { width:3.75em; height:3.75em; background:transparent; border:1px solid rgba(0,0,0,.4); border-radius:50%; transition:.2s; } 
.main_more > .more.st1 .xi { font-size:1.250em; } 
.main_more > .more.st1:hover { background:#ca0202; border-color:#ca0202; color:#fff; } 

.main_txt.cw .tt { color:#fff; } 
.main_txt .nw { white-space:nowrap; } 
.main_more.cw > .more { } 
.main_more.cw > .more.st1 { border-color:#ca0202; color:#fff; } 

/*메인 포트폴리오*/
.tupper { text-transform: uppercase; } 
.main_top { display: flex; justify-content: space-between; padding-bottom: 1.5em; margin-bottom: 1em; } 
.main_tab { margin-bottom: 4.5em; display: flex; justify-content: center; align-items: center; } 
.main_tab > li { } 
.main_tab > li > .tab-btn { position:relative; cursor: pointer; font-size: 22px; font-weight: 700; color: rgb(0,0,0); position: relative; padding: 0 32px; } 
.main_tab > li > .tab-btn:before { position: absolute; right: 0; top: 50%; width: 1px; height: 16px; transform: translateY(-50%); background: rgb(188,188,188); content: ''; } 
.main_tab > li.on > .tab-btn,
.main_tab > li > .tab-btn:hover { color: var(--siteC); } 
.main_tab > li:last-of-type > .tab-btn:before { display: none; } 
.main_product { padding-top: 1.5em; background: rgb(23, 20, 21); } 
.main_product .main_tab > li > .tab-btn { color: rgba(255,255,255, .65); } 
.main_product .main_tab > li.on > .tab-btn,
.main_product .main_tab > li > .tab-btn:hover { color: #fff; } 
.main_product .swiperBtn.btn { color: #fff; } 
.main_product .mainSlide_wrap .el .slide_st .con .txt { color: rgba(255,255,255, .65); } 
.main_product .mainSlide_wrap .el .slide_st:hover .con .txt { color: #fff; } 

.prodSlide2 .swiperControl .swiperBtn { position: absolute; top: 50%; transform: translateY(-50%); } 
.prodSlide2 .swiperControl .swiperBtn.prev { left: 0; } 
.prodSlide2 .swiperControl .swiperBtn.next { right: 0; } 
.prodSlide2 .swiperControl .paging { position: absolute; left: 50%; bottom: 1em; transform: translateX(-50%); z-index: 99; } 

/*메인 인증서*/
.main_certi .mainSlide_wrap .el .slide_st .img { background: #f5f5f5; border: 1px solid #ddd; } 


/*메인 샘플*/
.main_sample { background: rgb(23, 20, 21); } 
.main_sample .main_tab > li > .tab-btn { color: rgba(255,255,255, .65); } 
.main_sample .main_tab > li.on > .tab-btn,
.main_sample .main_tab > li > .tab-btn:hover { color: #fff; } 
.main_sample .swiperBtn.btn { color: #fff; } 
.main_sample .mainSlide_wrap .el .slide_st .con .txt { color: rgba(255,255,255, .65); } 
.main_sample .mainSlide_wrap .el .slide_st:hover .con .txt { color: #fff; } 

/*메인 문의*/
.main_contact { } 
.main_contact .contact_wrap { display: flex; } 
.main_contact .contact_wrap .box-left { width: 50%; position:relative; height: 100vh; overflow: hidden; } 
.main_contact .contact_wrap .box-left .bgImg { width: 100%; height: 100%; } 
.main_contact .contact_wrap .box-left .bgImg > img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.15); transition: all 5s; } 
.main_contact.active .contact_wrap .box-left .bgImg > img { transform: scale(1); } 
.main_contact .contact_wrap .box-left:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.25); content: ''; } 
.main_contact .contact_wrap .box-right { width: 50%; padding: 3em 10em; height: 100vh; box-sizing: border-box; background: rgb(244, 244, 244); display: flex; justify-content: center; align-items: center; } 

.main_contact .contact_wrap .box-left > .inner { position:absolute; top: 0; padding: 8em 8em 0 8em; box-sizing: border-box; z-index: 2; } 
.main_contact .contact_wrap .box-left > .inner > .text-group { color: #fff; } 
.main_contact .contact_wrap .box-left > .inner > .text-group .sub { font-size: 24px; font-weight: 700; margin-bottom: 1.5em; } 
.main_contact .contact_wrap .box-left > .inner > .text-group .title { font-size: 40px; font-weight: 800; line-height: 1.4; margin-bottom: .5em } 
.main_contact .contact_wrap .box-left > .inner > .text-group .desc { font-size: 20px; color: rgba(255,255,255, .8) } 

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

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

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

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

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

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

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

.main .form_chk .label_st input[type=checkbox] { appearance: none; -webkit-appearance: none; -moz-appearance: none; } 
.main .form_chk .label_st input[type=radio] { /* width: auto; height: auto; overflow: visible; margin-bottom: auto; */ } 
.label_st { display:inline-flex; align-items:center; min-height:1em; gap:0 .25em; cursor:pointer; line-height:1; box-sizing:border-box; } 
.label_st input ~ .tt { flex:1; font-weight:500; } 
.label_st input:checked { accent-color:var(--siteC); } 
.label_st input:checked:before { font-size: 1.4em; font-family: 'xeicon'; content: '\e929'; color: var(--siteC); } 
.dp2_inquiry .label_st input:checked:before { display: none; } 
.label_st input:checked ~ .tt { color:var(--siteC); } 
.label_st .main_check[type=checkbox] { display: flex; align-items: center; justify-content: center; width: 25px; height: 25px; background: #fff; margin-right: 10px; margin-top: 0; border: 2px solid transparent; border-radius: 5px; cursor: pointer; } 
.label_st .main_check:checked { border: 1px solid var(--siteC); } 
.label_st.main_agree { position: relative; width: 100%; } 
.label_st.main_agree .agreeT { font-size: 16px; font-weight: 600; color: #222; } 
.label_st.main_agree .st { position: absolute; bottom: -10px; display: block; margin-top: 5px; font-size: 13px; font-weight: 500; color: #999; word-break: keep-all; } 
.form_chk .chk a { min-width: 9em; } 

.sub .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; } 
.sub .form_wrap .form > li .inp_wrap .tit,
.sub .form_wrap .form > li .inp_wrap .input_st:not(textarea) { min-height:4.5em; } 
.sub .form_wrap .form > li .inp_wrap .input_st.hauto:not(textarea) { height: 100%; } 
.sub .form_wrap .form > li .inp_wrap .input_st::placeholder { font-size: 1.15em; } 
.sub .form_wrap .form > li .inp_wrap .tit { position:absolute; top:0; left:0; padding-left:2em; } 
.sub .form_wrap .form > li .inp_wrap .tit .tt { font-size: 1.215em; font-weight:600; } 
.sub .form_wrap .form > li .inp_wrap .input_st:not(textarea) { width:100%; padding-left:13em; } 
.sub .form_wrap .form > li .inp_wrap textarea.input_st { padding-top:4em; padding-left:1.5em; height:12em; } 
.sub .form_wrap .form > li .inp_wrap .input_st { border:none; background: transparent; border-radius: .15em; outline: 1px solid transparent; transition: all .4s ease-in-out; } 
.sub .form_wrap .form > li .inp_wrap input:focus { outline: 1px solid #fff; } 

/**/
.mainSlide_wrap { position:relative; padding:0 5em; } 
.mainSlide_wrap .el .slide_st { display:block; cursor: pointer; } 
.mainSlide_wrap .el .slide_st .img { background:#fff; border-radius: .5em; overflow: hidden; } 
.mainSlide_wrap .prod2 .el .slide_st .img { background: #e5e5e5; } 
.mainSlide_wrap .prod2 .el .slide_st .img .bgfix { background-size: contain; } 
.mainSlide_wrap .el .slide_st .con { margin-top:1em; } 
.mainSlide_wrap .el .slide_st .con .txt { font-size:1.125em; font-weight:500; transition: .2s; } 
.mainSlide_wrap .el .slide_st:hover .con .txt { color: var(--siteC); } 

.mainSlide_wrap .el .slide_st.st2 { } 
.mainSlide_wrap .el .slide_st.st2 .img { padding:.75em .75em; border:1px solid #ddd; } 
.mainSlide_wrap .el .slide_st.st2 .img .in { height:100%; transition:.3s; } 
.mainSlide_wrap .el .slide_st.st2 .img .in img { max-width:70%; max-height:50%; } 

.mainSlide_control { position:absolute; left:0; right:0; top:50%; } 
.mainSlide_control .swiperBtn { position:absolute; top:0; transform:translateY(-50%); } 

.main_clients { position:relative; } 
.main_clients:before { content:""; position:absolute; left:0; bottom:0; width:100%; height:25vh; } 
.main_foodpark { } 
.main_foodpark .main_clients:before { background:#961f1a; } 

.flex.reverse { flex-direction: row-reverse; } 
.flex > .fx2 { flex: 2; } 
.flex > .fx1 { flex: 1; } 

/*디자인*/
.priceimgB { padding: 3em; box-sizing: border-box; border: 1px solid #ddd; border-radius: 1em; text-align: center; } 
.priceimgB > img { width: 60%; object-fit: contain; } 

/*인증서*/
.page_certificate { } 
.page_certificate .list { gap: 6em 2em; } 
.page_certificate .list > li { position: relative; flex: 0 0 calc(25% - 1.5em); cursor: pointer; } 
.page_certificate .list > li .img-area { position: relative; padding: 2.5em; background: #f8f8f8; border: 3px solid transparent; transition: 0.3s; } 
.page_certificate .list > li .xi { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 2.5em; height: 2.5em; border: 3px solid var(--siteC); border-radius: 50%; color: #fff; background: var(--siteC); opacity: 0; visibility: hidden; transition: 0.3s; } 
.page_certificate .list > li:hover .xi { opacity: 1; visibility: visible; } 
.page_certificate .list > li:hover .img-area { border-color: var(--siteC); } 
.page_certificate .list > li .img-area .imgfix { box-shadow: 0 0 30px rgba(0, 0, 0, .075); width: 240px; height: 340px; } 
.page_certificate .list > li .txt { margin-top: 1.5em; text-align: center; } 
.page_certificate .list > li .txt > p { font-size: 1.125rem; } 
.page_certificate .list > li .txt > span { display: inline-block; font-size: 1rem; color: var(--crGray3); margin-top: 10px; } 

/*연혁*/
.his-wrapper { } 
.his-wrapper .hisImg { width: 100%; height: 20em; margin-bottom: 2.5em; } 
.his-wrapper .hisImg > img { width: 100%; height: 100%; object-fit: cover; } 
.his-wrapper .page_tit { } 
.his-wrapper .page_tit > .t2 { font-size: 40px; font-weight: 700; margin-bottom: .35em; } 
.his-wrapper .page_tit > .t4 { font-size: 24px; font-weight: normal; } 
.his-wrapper .his-group { margin-top: 4em; } 
.his-wrapper .his-group .inner-box { display: flex; padding: 3em 0; border-bottom: 1px solid #ddd; } 
.his-wrapper .his-group .inner-box:first-of-type { border-top: 1px solid #ddd; } 
.his-wrapper .his-group .inner-box:last-of-type { border-bottom: none; padding-bottom: 0em; } 
.his-wrapper .his-group .inner-box .year { width: 25%; line-height: 1; font-size: 4em; letter-spacing: -0.05em; font-weight: 800; color: #171717; } 
.his-wrapper .his-group .inner-box .infoList { width: 75%; } 
.his-wrapper .his-group .inner-box .infoList > li { position:relative; padding-left: 1em; line-height: 1.4; font-size: 1.315em; margin-bottom: 1em; word-break: keep-all; color: #171717; } 
.his-wrapper .his-group .inner-box .infoList > li:before { position: absolute; left: 0; content: '-'; } 

/*오시는 길*/
.map_info { margin-top: 3.5em; display: flex; gap: 10em; } 
.map_info > .con { width: 50%; } 
.map_info .con .tit { font-size: 1.315em; font-weight: 800; margin-bottom: 1.5em; } 
.map_info .cominfo { } 
.map_info .cominfo > li { margin-bottom: .5em; } 
.map_info .cominfo > li:last-of-type { margin-bottom: 0em; } 
.map_info .cominfo > li > .inner { display: flex; } 
.map_info .cominfo > li > .inner > .tt { font-size: 1.15em; font-weight: 700; min-width: 7em; } 
.map_info .cominfo > li > .inner > .txt { font-size: 1.15em; color: #444; line-height: 1.4; word-break: keep-all; } 
.root_daum_roughmap .wrap_controllers,
.root_daum_roughmap .cont { display: none; } 

/*인사말*/
.introSlide_wrap { position: relative; } 
.introSlide_wrap .introSlide_control { } 
.introSlide_wrap .introSlide_control .swiperBtn { width: 3em; height: 3em; background: rgba(0, 0, 0, .7); color: #fff; transition: .3s; opacity: 1; } 
.introSlide_wrap .introSlide_control .swiperBtn:before { font-size: 1.315em; display: flex; height: 100%; align-items: center; justify-content: center; } 
.introSlide_wrap .introSlide_control .swiperBtn:hover { background: rgba(0, 0, 0, .9) } 
.introSlide_wrap .introSlide_control .prev { position: absolute; left: .75em; top: 50%; transform: translateY(-50%); z-index: 9 } 
.introSlide_wrap .introSlide_control .next { position: absolute; right: .75em; top: 50%; transform: translateY(-50%); z-index: 9 } 
.introSlide { position: relative; width: 100%; height: 30em; } 
.introSlide .el .bg { width: 100%; height: 100%; } 
.introSlide .el .bg>img { width: 100%; height: 100%; object-fit: cover; } 
.introSlide_wrap.fac { margin-bottom: 2.5em; } 
.introSlide_wrap.fac .introSlide { height: 27.5em; } 
.intro_infoW { margin-top: 4em; display: flex; gap: 5em; } 
.intro_infoW .titT { width: 25%; } 
.intro_infoW .titT>.tit { font-size: 1.815em; font-weight: 800; line-height: 1.4; } 
.intro_infoW .txt_area { width: 75%; } 
.intro_infoW .txt_area>.tt { font-size: 1.263em; line-height: 1.6; color: #444; margin-bottom: 1.5em; word-break: keep-all; } 
.intro_infoW .txt_area>.tt:last-of-type { margin-bottom: 0em; } 

/*분양절차*/
.page_list.icoStep { gap: 3.25em; } 
.page_list.icoStep > li { display: flex; flex: 1; } 
.page_list.icoStep > li .in { flex: 1; } 
.page_list.icoStep > li .in .circle_wrap { position: relative; z-index: 2; } 
.page_list.icoStep > li .in .circle_wrap .circle_in { position:relative; width: 96%; margin: 0 auto; } 
.page_list.icoStep > li .in .circle_wrap .circle { gap: 1em; background: #fff; border: 25px solid #f1f1f1; border-radius: 50%; } 
.page_list.icoStep > li:last-of-type .in .circle_wrap .circle { border: 25px solid var(--siteC2); } 
.page_list.icoStep > li .in .circle_wrap .num_wrap { position: absolute; top: 1em; left: 50%; width: auto; transform: translateX(-50%); } 
.page_list.icoStep > li .in .circle_wrap .num_wrap .num { font-size: 3.515em; font-weight: 800; color: #8dd7f7; } 

.page_list.icoStep > li .in .circle_wrap .num_wrap .num:before { font-size: .875em; } 
.page_list.icoStep > li .in .circle_wrap .ico_wrap img { width: 3.125em; } 
.page_list.icoStep > li .in .circle_wrap .tit .tt { font-size: 1.500em; font-weight: 700; } 
.page_list.icoStep > li .in .con_wrap { display: flex; flex: 1 0 auto; position: relative; margin-top: 4.25em; justify-content: center; } 
.page_list.icoStep > li .in .con_wrap .txt { gap: 1.5em 0; flex: 1; padding: 1.125em 1.125em 1.75em; background: #fff; border-radius: .75em; line-height: 1.5; } 
.page_list.icoStep > li .in .con_wrap .dot_list { padding: 0 4em; box-sizing: border-box; margin-top: 2.5em; } 
.page_list.icoStep > li .in .con_wrap .dot_list > li { position: relative; margin-bottom: .35em; font-size: 1em; font-weight: 600; } 
.page_list.icoStep > li .in .con_wrap .dot_list > li:last-of-type { margin-bottom: 0em; } 
.page_list.icoStep > li .in .con_wrap .dot_list > li:before { position: absolute; top: 7px; left: -.75em; width: 4px; height: 4px; border-radius: 50%; background: #000; content: ''; } 
.page_list.icoStep > li .in .con_wrap .txt .tt { font-weight: 500; } 
.page_list.icoStep > li .in .circle_wrap .circle .entit { position:relative; top: 10px; } 
.page_list.icoStep > li .in .circle_wrap .circle .entit .en { text-transform: uppercase; font-size: 1em; font-weight: 600; } 
.page_list.icoStep > li .in .con_wrap .txt .small { font-size: .875em; color: #555; } 

.page_list.icoStep > li + li .in .circle_wrap:before { content: "\e93e"; font-family: xeicon; font-size: 2.000em; color: #ddd; position: absolute; top: 50%; left: -1.625rem; transform: translate(-50%, -50%); } 
.page_list.icoStep > li .in .con_wrap:before,
.page_list.icoStep > li .in .con_wrap:after { content: ""; position: absolute; left: 50%; transform: translateX(-50%); box-sizing: border-box; } 
.page_list.icoStep > li .in .con_wrap:before { bottom: 100%; width: 2px; height: 5em; background: #dcdcdc; } 
.page_list.icoStep > li .in .con_wrap:after { top: 0; width: 10px; height: 10px; background: #fff; border: 3px solid var(--siteC); border-radius: 50%; transform: translate(-50%, -50%); }