/* global defaults */
:root { --smooth-transform-transition:transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000); --smooth-clip-path-transition:clip-path 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000); } 
.pc-only { display: block !important; } 
.m-only { display: none !important; } 
.scrollDisable { overflow: hidden; touch-action: none; } 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,span,th,td,legend { margin:0; padding:0; } 
fieldset,img,abbr,acronym { border:none; } 
fieldset { display:block; } 
ol,ul { list-style:none outside; } 
h1,h2,h3,h4,h5,h6,address,caption,cite,code,dfn,em,th,var { font-size:100%; } 
p { margin-top:0; margin-bottom:0; } 
.accessibility,hr,legend,caption,hr { position:absolute; top:0; left:0; width:0; height:0; font-size:0; line-height:0; margin:0; padding:0; overflow:hidden; visibility:hidden; text-indent:-1000em; } 
.skip { position:absolute; top:-50px; left:0; z-index:9999; width:100%; height:35px; padding-top:15px; display:block; font-size:12px; line-height:20px; color:#121212; background-color:#eee; text-align: center; } 

/* Skip Navigation */
#skip_to_container a { z-index:100000; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden; } 
#skip_to_container:hover,#skip_to_container:active,#skip_to_container:focus { width:100%; height:auto; margin:0; padding:5px 0; font-weight:400; font-size:12px; line-height:1; color:#111; text-decoration:none !important; text-indent:10px; } 

/* s: All Style */
a:link, a:visited { text-decoration:none } 
a:hover { text-decoration:none } 
input[type=text],input[type=email],input[type=tel],input[type=submit],input[type=password],input[type=image],input[type=button],textarea,select { -webkit-border-radius:0; -moz-appearance:none; -webkit-appearance:none; appearance:none; } 
 input[type=text], input[type=tel], input[type=phone], input[type=number], input[type=search], input[type=password] { line-height:2.75rem; border:1px solid #CACACA; border-radius:0.5rem; padding:0 2rem 0 1rem; outline:none; font-size:0.875rem; } 
 input[type=text].borderbottom, input[type=tel].borderbottom, input[type=phone].borderbottom, input[type=number].borderbottom, input[type=search].borderbottom, input[type=password].borderbottom { border:none; border-bottom:1px solid #000; border-radius: 0; } 
 .textarea { border-radius: 8px; border:1px solid #cacaca; overflow: hidden; padding:11px 16px; background-color: #fff; } 
 .textarea textarea { font-size:0.875rem; border:none; resize: none; font-size:14px; outline: none; width: 100%; min-height: 100px; } 
 textarea::placeholder { font-size:0.875rem; color:#989692; } 
 input[type=text]:disabled, input[type=tel]:disabled, input[type=phone]:disabled, input[type=number]:disabled, input[type=search]:disabled, input[type=password]:disabled { background-color: #F2F2F2; } 
 input[type=text]:read-only, input[type=tel]:read-only, input[type=phone]:read-only, input[type=number]:read-only, input[type=search]:read-only, input[type=password]:read-only,textarea:read-only { background-color: #F2F2F2; } 
 input[type=text]::placeholder, input[type=tel]::placeholder, input[type=phone]::placeholder, input[type=number]::placeholder, input[type=search]::placeholder, input[type=password]::placeholder { color:#989692; font-weight:600; font-size:0.875rem; } 
select::-ms-expand { display:none } 
 .input-area { display:inline-flex; align-items: center; position:relative; } 
 .input-area .ip-close { position:absolute; right:1.25rem; top:50%; transform: translateY(-50%); width:1rem; height:1rem; background: url("../images/common/form-close.png")no-repeat center; display: none; } 
 .wd100p { width:100% !important; } 
 .wd600 { width:600px !important; } 
 .wd330 { width:330px !important; } 
 .wd300 { width:300px !important; } 
 .wd278 { width:278px !important; } 
 .wd250 { width:250px !important; } 
 .wd230 { width:230px !important; } 
img,video,audio,object,embed,iframe { max-width:100%; } 
/*:lang(zh), zh { font-family: 'Kanit', sans-serif; } */
body,th,td,input,select,button,textarea { font-style:normal; font-weight:normal; font-family: 'Pretendard', sans-serif !important; color:#111; line-height:1.2; letter-spacing:-0.02em; /*-webkit-font-smoothing: antialiased; font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; */ } 
/*'Trirong', */
table { width:100%; border-collapse:collapse; table-layout:fixed; } 
figure { margin:0; padding:0; font-size:0; line-height:0; } 
br { font-family:'Dotum', sans-serif !important; } 

 .w-65 { width: 65% !important; } 
/* library */
.tal { text-align: left !important; } 
.tac { text-align: center !important } 
.tar { text-align: right !important; } 
.taj { text-align: justify !important; } 
.vam { vertical-align:middle !important; } 
.vat { vertical-align:top !important; } 
.vab { vertical-align:bottom !important; } 
.float_l { float: left; } 
.float_r { float: right; } 
.clear_b { clear: both; float: none; } 
.clear_r { clear: right; float: none; } 
.clear_l { clear: left; float: none; } 
.normal { font-weight: normal; } 
.block { display: block !important; } 
.block_i { display: inline-block !important; } 
.block_n { display: none !important; } 
.bold { font-weight: bold; } 
.deco_l { text-decoration:line-through; } 
.deco_u { text-decoration:underline; } 
.displaynone { display:none !important; } 
.displayflex { display:flex; align-items:center; } 
.displayflex-wrap { flex-wrap:wrap; } 
.displayflex-spw { display:flex; justify-content:space-between; align-items:center; } 
.displayflex-align-start { align-items:flex-start !important; } 
.displayflex-align-end { align-items:flex-end !important; } 
.displayflex-flex-start { justify-content:flex-start !important; } 
.displayflex-flex-end { justify-content:flex-end !important; } 
.position-re { position:relative !important; } 


.cRed { color:var(--cRed) !important; } 
.cOrange { color:var(--cOrange) !important; } 
.cDarkgray { color:var(--cDarkgray) !important; } 
.f11 { font-size:11px !important; } 
.f12 { font-size:12px !important; } 
.f13 { font-size:13px !important; } 
.f14 { font-size:14px !important; } 
.f15 { font-size:15px !important; } 
.f16 { font-size:16px !important; } 
.f17 { font-size:17px !important; } 
.f18 { font-size:18px !important; } 
.f19 { font-size:19px !important; } 
.f20 { font-size:20px !important; } 

 .fw100 { font-weight: 100 !important; } 
 .fw200 { font-weight: 200 !important; } 
 .fw300 { font-weight: 300 !important; } 
 .fw400 { font-weight: 400 !important; } 
 .fw500 { font-weight: 500 !important; } 
 .fw600 { font-weight: 600 !important; } 
 .fw700 { font-weight: 700 !important; } 
 .fw800 { font-weight: 800 !important; } 
 .fw900 { font-weight: 900 !important; } 

.modal-backdrop { width:100%; height:100%; } 
.container { max-width: 1230px; } 
/* div.disabled,
p.disabled,
span.disabled,
ul.disabled,
li.disabled,
input.disabled,
textarea.disabled { border-color:#E3E6E8 !important; background-color:#F5F5F5 !important; opacity:0.45 !important; } */
.break-all { word-break:break-all !important; } 

*, :before, :after { box-sizing:border-box; word-break:keep-all; } 
/* :focus { outline-width:1px; border:0; outline-style:solid; outline-offset:0px; } */



/* page style */

html, body { width:100%; margin:0; padding:0; min-width: 350px; max-width: 100%; } 
body.layerPopScrFixed { overflow-y:hidden; } 
 body { position:relative; } 

.ml5 { margin-left:0.3125rem !important; } 
.ml10 { margin-left:0.625rem !important; } 
.ml15 { margin-left:0.9375rem !important; } 
.ml20 { margin-left:1.25rem !important; } 
.ml40 { margin-left:2.5rem !important; } 
.ml60 { margin-left:3.75rem !important; } 

.mr0 { margin-right:0 !important; } 
.mr5 { margin-right:0.3125rem !important; } 
.mr10 { margin-right:0.625rem !important; } 
.mr15 { margin-right:0.9375rem !important; } 
.mr20 { margin-right:1.25rem !important; } 
.mr60 { margin-right:3.75rem !important; } 


.mt0 { margin-top:0 !important; } 
.mt5 { margin-top:0.3125rem !important; } 
.mt10 { margin-top:0.625rem !important; } 
.mt15 { margin-top:0.9375rem !important; } 
.mt20 { margin-top:1.25rem !important; } 
.mt25 { margin-top:1.5625rem !important; } 
.mt30 { margin-top:1.875rem !important; } 
.mt40 { margin-top:2.5rem !important; } 
.mt60 { margin-top:3.75rem !important; } 
.mt80 { margin-top:5rem !important; } 
.mt100 { margin-top:6.25rem !important; } 

.mb0 { margin-bottom:0 !important; } 
.mb5 { margin-bottom:0.3125rem !important; } 
.mb10 { margin-bottom:0.625rem !important; } 
.mb20 { margin-bottom:1.25rem !important; } 
.mb30 { margin-bottom:1.875rem !important; } 
.mb40 { margin-bottom:2.5rem !important; } 

 .pl0 { padding-left:0 !important; } 
 .pl5 { padding-left:0.3125rem !important; } 
.pl10 { padding-left:0.625rem !important; } 
.pl15 { padding-left:0.9375rem !important; } 
.pl20 { padding-left:1.25rem !important; } 
.pl60 { padding-left:3.75rem !important; } 

.pr0 { padding-right:0 !important; } 
.pr5 { padding-right:0.3125rem !important; } 
.pr10 { padding-right:0.625rem !important; } 
.pr15 { padding-right:0.9375rem !important; } 
.pr20 { padding-right:1.25rem !important; } 
.pr60 { padding-right:3.75rem !important; } 


.pt0 { padding-top:0 !important; } 
.pt5 { padding-top:0.3125rem !important; } 
.pt10 { padding-top:0.625rem !important; } 
.pt20 { padding-top:1.25rem !important; } 
.pt30 { padding-top:1.875rem !important; } 
.pt40 { padding-top:2.5rem !important; } 

.pb0 { padding-bottom:0 !important; } 
.pb5 { padding-bottom:0.3125rem !important; } 
.pb10 { padding-bottom:0.625rem !important; } 
.pb20 { padding-bottom:1.25rem !important; } 
.pb30 { padding-bottom:1.875rem !important; } 
.pb40 { padding-bottom:2.5rem !important; } 

/* Link Style */
a:link,
a:visited { text-decoration:none; color:#121212; } 
a:hover { text-decoration:none; color:#121212; } 


input[type=checkbox].chkbox { display:none; } 
input[type=checkbox].chkbox + label { font-size:14px; color:#3A464F; display:inline-flex; align-items:center; margin:0; } 
input[type=checkbox].chkbox + label:before { content:""; width:20px; height:20px; background:#DBE1E5 url('../images/common/checked-icon.svg') no-repeat center; border:none; border-radius:3px; overflow:hidden; margin-right:12px; } 
input[type=checkbox].chkbox:checked + label { } 
input[type=checkbox].chkbox:checked + label:before { background:#F58220 url('../images/common/checked-icon.svg') no-repeat center; } 
input[type=checkbox].chkbox:checked + label { } 
input[type=checkbox].chkbox.b-chk + label { font-size:20px; } 
input[type=checkbox].chkbox.b-chk + label:before { width: 28px; height: 28px; border-radius: 7px; } 
input[type=checkbox].chkbox.b-chk:checked + label:before { background:#F58220 url('../images/common/checked-icon.svg') no-repeat center; } 



input[type=radio].radio { display:none; } 
input[type=radio].radio + label { font-size:16px; color:#666666; display:inline-flex; align-items:center; margin:0; font-size:1rem; position:relative; } 
input[type=radio].radio + label:before { content:""; width:1.375rem; height:1.375rem; background:#fff; border:2px solid #CCCCCC; border-radius:50%; overflow:hidden; margin-right:8px; } 
input[type=radio].radio + label:after { content:""; width:6px; height:6px; border-radius:50%; position:absolute; background-color: #ccc; left:0.5rem; top:0.5rem; } 
input[type=radio].radio:checked + label { color:#111111; font-weight: 500; } 
input[type=radio].radio:checked + label:before { background:#222; border-color:#222; } 
input[type=radio].radio:checked + label:after { background-color: #fff; } 




/* 셀렉트박스 디자인 */
/* default */
 div.select-box-default-st { position:relative; display:inline-block; color:#494949; padding:0px; margin:0px; white-space:normal; } 
div.select-box-default-st span.selectText { position:relative; display:block; font-size:14px; font-weight:600; color:#989692; line-height:2.625rem; min-width:13.5rem; height:2.875rem; border:1px solid #CACACA; padding:0px 1rem; margin:0 !important; overflow:hidden; cursor:pointer; border-radius: 0.5rem; text-align:left; background-color: #fff; } 
div.select-box-default-st span.selectText:before { content:""; position:absolute; top:50%; right:1rem; transform:translate(0,-50%); width:1.25rem; height:1.25rem; overflow:hidden; background:url('../images/common/sel-icon.svg') no-repeat center bottom/1.25rem 2.5rem; transition: all .25s .0s ease-in-out; } 
div.select-box-default-st.active span.selectText { border: 1px solid #222222; background-position:right 3px top 3px; outline:none; } 
div.select-box-default-st.active span.selectText:before { background-position:center top; } 
div.select-box-default-st > .select-wrap { display:none; position:absolute; top:calc(100% + 0.25rem); left:0px; min-width:100%; /*width:100%; */z-index:2; width: 100%; background-color: #fff; border:1px solid #DFDFDF; box-shadow:1px 1px 5px rgba(0,0,0,0.035); border-radius:0.75rem; } 
div.select-box-default-st > .select-wrap.up { top:auto; bottom:calc(100% - 1px); padding-top:0; padding-bottom:3px; } 
div.select-box-default-st ul.select-box-option { overflow:hidden; width:calc(100% - 1rem); height:auto; max-height:185px; overflow-y:auto; padding:0 0.5rem 0 0.75rem; margin:1rem 0; } 
div.select-box-default-st ul.select-box-option.col-4 { overflow-y:auto; height:10rem; } 
div.select-box-default-st ul.select-box-option li { display:inline-block; font-size:1rem; width:100%; height:auto; border-bottom:0; padding:0.625rem 1.25rem; cursor:pointer; /* white-space:nowrap; */text-align: left; border-radius:0.5rem; } 
div.select-box-default-st ul.select-box-option li:hover { background-color: #F5F5F5; } 
div.select-box-default-st ul.select-box-option li.optgroup { } 
div.select-box-default-st ul.select-box-option li:hover.optgroup { background-color:#FFF; } 
div.select-box-default-st ul.select-box-option li.selected { background-color: #F5F5F5; } 
 div.select-box-default-st ul.select-box-option::-webkit-scrollbar { width:4px; background-color:transparent; border-radius:10px; padding:0px } 
 div.select-box-default-st ul.select-box-option::-webkit-scrollbar-thumb { display: block; width: 4px; /* 스크롤바의 길이 */
 background-color: #DFDFDF; /* 스크롤바의 색상 */
 border-radius: 10px; } 

/* 말줄임 : 1줄 */
.clamp-line1
,div.select-box-default-st span.selectText
 {
 overflow:hidden; display:block !important; display:-webkit-box !important; -webkit-line-clamp:1; /*말줄임 수정 가능*/-webkit-box-orient:vertical; word-break:break-all; } 
/* 말줄임 : 2줄 */
.clamp-line2
 {
 overflow:hidden; display:block !important; display:-webkit-box !important; -webkit-line-clamp:2; /*말줄임 수정 가능*/-webkit-box-orient:vertical; word-break:break-all; } 
/* 말줄임 : 3줄 */
.clamp-line3
 {
 overflow:hidden; display:block !important; display:-webkit-box !important; -webkit-line-clamp:3; /*말줄임 수정 가능*/-webkit-box-orient:vertical; word-break:break-all; } 
.scroll-item { opacity: 0; transition: transform 1s ease, opacity 1s ease; transform: translateY(50px); } 

.scroll-item.on { opacity: 1; transition: transform 1s ease, opacity 1s ease; transform: translateY(0); } 

#app { width: 100%; } 



.inner { width:100%; position:relative; margin:0 auto; max-width:1440px; padding:0 1.25rem; } 


.b-btn { display:inline-flex; align-items: center; justify-content: center; line-height: 3.5rem; color:#fff !important; font-size:1.125rem; font-weight:600; background-color: #222; padding:0 1.75rem; border-radius: 3.125rem; } 



header { width: 100%; position: sticky; left:0; top:0; height:80px; z-index: 10; background-color: #000; } 
header > .wrap { padding:0 90px; display: flex; align-items: center; height:100%; width: 100%; justify-content: space-between; } 
header > .wrap .gnb { } 
header > .wrap .gnb > ul { display: flex; align-items: center; gap:0 120px; } 
header > .wrap .gnb > ul > li > a { color: rgba(255, 255, 255, 0.7); font-size:18px; font-weight: 500; position:relative; transition: .25s; } 
header > .wrap .gnb > ul > li > a.active,
header > .wrap .gnb > ul > li > a:hover { color:rgba(255, 255, 255, 1) } 
header > .wrap .gnb > ul > li > a:before { content:''; width: 0; height:3px; background-color: #fff; position: absolute; left:50%; transform: translateX(-50%); bottom:-9px; transition: .25s; } 
header > .wrap .gnb > ul > li > a.active:before,
header > .wrap .gnb > ul > li > a:hover:before { content:''; width: 100%; height:3px; background-color: #fff; position: absolute; left:50%; transform: translateX(-50%); bottom:-9px; } 
footer { width: 100%; z-index: 5; position: relative; } 
footer .t-footer { background-color: #1C1D36; height:80px; } 
footer .t-footer .inner { height:100%; display:flex; align-items: center; justify-content: space-between; } 
footer .t-footer .inner .t-link { display: flex; align-items: center; } 
footer .t-footer .inner .t-link > a { color:#8D8D99; font-size:14px; display: flex; align-items: center; } 
footer .t-footer .inner .t-link > a + a { margin-left:20px; padding-left:20px; position: relative; } 
footer .t-footer .inner .t-link > a + a:before { content:''; background-color: #585861; width: 1px; height: 12px; position: absolute; left:0; top:50%; transform: translateY(-50%); } 
footer .t-footer .inner .sns { display: flex; align-items: center; gap:10px; } 
footer .t-footer .inner .sns > a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background-color: #0E101B; } 
footer .t-footer .inner .sns > a:before { content:''; width: 40px; height:40px; display: inline-block; background: url("../images/common/sns-icon.svg")no-repeat; } 
footer .t-footer .inner .sns > a.face:before { background-position: left center; } 
footer .t-footer .inner .sns > a.youtube:before { background-position: left -40px center; } 
footer .t-footer .inner .sns > a.insta:before { background-position: left -80px center; } 
footer .b-footer { background-color: #0E101B; } 
footer .b-footer .inner > div { padding:20px 0 30px; } 
footer .b-footer .inner > div .addr { font-size:14px; color:#8D8D99; line-height: 1.5; } 
footer .b-footer .inner > div .copy { display: block; font-size:14px; color:#585861; margin-top:40px; } 
#pageTopScrollBtn { position: fixed; right: 90px; bottom: 60px; z-index: 100; } 
#pageTopScrollBtn > a { display: flex; flex-direction: column; align-items: center; justify-content: center; width:64px; height:64px; border-radius: 50%; color: #3A464F; font-size:14px; text-align: center; font-weight: 500; box-shadow: 0px 10px 20px rgba(0,0,0,0.3); overflow: hidden; } 

#pageTopScrollBtn > a.topBtn { color:#fff; font-weight: 600; border: 1px solid rgba(235, 237, 249, 0.2); } 

#pageTopScrollBtn > a.topBtn:before { content:''; background: url("../images/common/float-arrow.svg")no-repeat; display: inline-block; width: 64px; height: 64px; } 
.mobile-gnb{display: none;}
@media screen and (max-width: 1300px){
    header > .wrap{padding:0 2.3077vw;}
    header > .wrap .gnb > ul{gap:7.6923vw;}
    #pageTopScrollBtn{right:1.9231vw}
}
@media screen and (max-width: 768px){
    .pc-only { display: none !important; } 
    .m-only { display: block !important; }
    header{position:relative;}
    header > .wrap{padding:0 20px;}
    header > .wrap .header-logo{max-width: 26.6667vw;}
    header > .wrap .gnb{display: none;}
    .mobile-gnb{display: block;background-color: #000;padding:15px 20px;position: sticky;top:0;z-index: 100;}
    .mobile-gnb > ul { display: flex; align-items: center; gap:0 16px;justify-content: center;} 
    .mobile-gnb > ul > li > a { color: rgba(255, 255, 255, 0.7); font-size:15px; font-weight: 500; position:relative; transition: .25s; } 
    .mobile-gnb > ul > li > a.active,
    .mobile-gnb > ul > li > a:hover { color:rgba(255, 255, 255, 1) } 
    .mobile-gnb > ul > li > a:before { content:''; width: 0; height:3px; background-color: #fff; position: absolute; left:50%; transform: translateX(-50%); bottom:-9px; transition: .25s; } 
    .mobile-gnb > ul > li > a.active:before,
    .mobile-gnb > ul > li > a:hover:before { content:''; width: 100%; height:3px; background-color: #fff; position: absolute; left:50%; transform: translateX(-50%); bottom:-9px; } 
    footer .t-footer{height:70px;}
    footer .t-footer .inner .t-link > a + a{margin-left:10px;padding-left:10px;}
    footer .t-footer .inner .sns > a{width:30px;height:30px;}
    footer .t-footer .inner .sns > a:before{width:30px;height:30px;background-size:90px 30px;}
    footer .t-footer .inner .sns > a.face:before { background-position: left center; } 
    footer .t-footer .inner .sns > a.youtube:before { background-position: left -30px center; } 
    footer .t-footer .inner .sns > a.insta:before { background-position: left -60px center; } 
    footer .b-footer .inner > div{padding:10px 0 20px;}
    footer .b-footer .inner > div .copy{font-size:12px;margin-top:20px;}
    #pageTopScrollBtn{right:20px;}
    #pageTopScrollBtn > a{width:40px;height:40px;}
    #pageTopScrollBtn > a.topBtn:before{width:40px;height:40px;background-size:40px auto;}

}