@charset "utf-8";
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-1Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-2ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

/********************
// resetcode
********************/
html, body{overflow-x:hidden;}
html, body, div, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,textarea,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,input,select,button,
time, mark, audio, video {
margin: 0;padding: 0;border: 0;font-size: 16px; line-height:1.6em;  font-family: 'Paperozi', 'sans-serif'; ;
font-weight:400;  vertical-align: baseline; color:#232429; word-break:keep-all; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);letter-spacing: 0;}

.inner, .serviceInner{width:80dvw; margin-left:auto; margin-right:auto;}

.tit{letter-spacing: -0.02em;}
.tit2{letter-spacing: -0.04em;}
.wf1{flex:1;}

img{line-height: 0;}
td,th{vertical-align: middle;}
label, button{cursor: pointer;}

b{font-weight:700 !important}

.longTxt {    white-space: nowrap;          overflow: hidden;     text-overflow: ellipsis;}
.long2Txt {    display: -webkit-box;    -webkit-box-orient: vertical;    -webkit-line-clamp: 2;     overflow: hidden; }
.wds{white-space: pre-wrap;}
.underLine{text-decoration:underline;}
.wdib{    display: inline-block;}

/********************
// 색상
********************/
.co_white{color:#fff;}
.co_black{color:#000;}

.cog0{color: #ECEEF0;}
.cog1{color: #E4E6E9;}
.cog2{color:#CCD0D5;}
.cog3{color:#A9AEB7;}
.cog4{color:#7E8692;}
.cog5{color:#68707D;}
.cog6{color:#555A65;}
.cog7{color:#494D55;}
.cog8{color:#40424A;}
.cog9{color:#393B40;}
.cog10{color:#232429;}

.co1-0{color:#F1FCF3}
.co1-1{color:#DFF9E3}
.co1-2{color:#C2F0CA}
.co1-3{color:#91EA40}
.co1-4{color:#4AC962}
.co1-5{color:#34B34D}
.co1-6{color:#25943A}
.co1-7{color:#217431}
.co1-8{color:#1F5C2B}
.co1-9{color:#1B4C25}
.co1-10{color:#092A11}

.cod-0{color:#FFF0F0}
.cod-1{color:#FFDDDD}
.cod-2{color:#FFC0C0}
.cod-3{color:#FF9494}
.cod-4{color:#FF5757}
.cod-5{color:#FF2323}
.cod-6{color:#F50000}
.cod-7{color:#D70000}
.cod-8{color:#B10303}
.cod-9{color:#920A0A}
.cod-10{color:#500000}

.cow-0{color:#FEFCE8}
.cow-1{color:#FFFBC2}
.cow-2{color:#FFF388}
.cow-3{color:#FFE545}
.cow-4{color:#FDD008}
.cow-5{color:#EDB905}
.cow-6{color:#CD8F01}
.cow-7{color:#A36505}
.cow-8{color:#874F0C}
.cow-9{color:#724111}
.cow-10{color:#432105}

.cos-0{color:#EAFFF4}
.cos-1{color:#CEF8E1}
.cos-2{color:#A2F4CC}
.cos-3{color:#62E9AE}
.cos-4{color:#25D28C}
.cos-5{color:#06B877}
.cos-6{color:#139B69}
.cos-7{color:#008357}
.cos-8{color:#006746}
.cos-9{color:#00553B}
.cos-10{color:#003022}

.coi-0{color:#EFFAFF}
.coi-1{color:#DFF4FF}
.coi-2{color:#B8ECFF}
.coi-3{color:#78DFFF}
.coi-4{color:#31CFFF}
.coi-5{color:#06B9F1}
.coi-6{color:#0095CE}
.coi-7{color:#0077A7}
.coi-8{color:#02648A}
.coi-9{color:#085372}
.coi-10{color:#06344B}

.cob-2{color:#D6E4EF}
.cob-3{color:#BCD2E5}
.cob-5{color:#89A2CB}
.cob-7{color:#5F73A3}
.cob-8{color:#4F5F84}

/********************
// 백그라운드
********************/
.bco_main{background-color:#F8FAFC}
.bco_0{background-color:#F2F6FA}

.bco_white{background-color:#fff;}
.bco_black{background-color:#000;}
.bcog0{background-color: #ECEEF0;}
.bcog1{background-color: #E4E6E9;}
.bcog2{background-color:#CCD0D5;}
.bcog3{background-color:#A9AEB7;}
.bcog4{background-color:#7E8692;}
.bcog5{background-color:#68707D;}
.bcog6{background-color:#555A65;}
.bcog7{background-color:#494D55;}
.bcog8{background-color:#40424A;}
.bcog9{background-color:#393B40;}
.bcog10{background-color:#232429;}

.bco1-0{background-color:#F1FCF3}
.bco1-1{background-color:#DFF9E3}
.bco1-2{background-color:#C2F0CA}
.bco1-3{background-color:#91EA40}
.bco1-4{background-color:#4AC962}
.bco1-5{background-color:#34B34D}
.bco1-6{background-color:#25943A}
.bco1-7{background-color:#217431}
.bco1-8{background-color:#1F5C2B}
.bco1-9{background-color:#1B4C25}
.bco1-10{background-color:#092A11}

.bcod-0{background-color:#FFF0F0}
.bcod-1{background-color:#FFDDDD}
.bcod-2{background-color:#FFC0C0}
.bcod-3{background-color:#FF9494}
.bcod-4{background-color:#FF5757}
.bcod-5{background-color:#FF2323}
.bcod-6{background-color:#F50000}
.bcod-7{background-color:#D70000}
.bcod-8{background-color:#B10303}
.bcod-9{background-color:#920A0A}
.bcod-10{background-color:#500000}

.bcow-0{background-color:#FEFCE8}
.bcow-1{background-color:#FFFBC2}
.bcow-2{background-color:#FFF388}
.bcow-3{background-color:#FFE545}
.bcow-4{background-color:#FDD008}
.bcow-5{background-color:#EDB905}
.bcow-6{background-color:#CD8F01}
.bcow-7{background-color:#A36505}
.bcow-8{background-color:#874F0C}
.bcow-9{background-color:#724111}
.bcow-10{background-color:#432105}

.bcos-0{background-color:#EAFFF4}
.bcos-1{background-color:#CEF8E1}
.bcos-2{background-color:#A2F4CC}
.bcos-3{background-color:#62E9AE}
.bcos-4{background-color:#25D28C}
.bcos-5{background-color:#06B877}
.bcos-6{background-color:#139B69}
.bcos-7{background-color:#008357}
.bcos-8{background-color:#006746}
.bcos-9{background-color:#00553B}
.bcos-10{background-color:#003022}

.bcoi-0{background-color:#EFFAFF}
.bcoi-1{background-color:#DFF4FF}
.bcoi-2{background-color:#B8ECFF}
.bcoi-3{background-color:#78DFFF}
.bcoi-4{background-color:#31CFFF}
.bcoi-5{background-color:#06B9F1}
.bcoi-6{background-color:#0095CE}
.bcoi-7{background-color:#0077A7}
.bcoi-8{background-color:#02648A}
.bcoi-9{background-color:#085372}
.bcoi-10{background-color:#06344B}

.bcoo-1{background-color:#ED7D22}

.bcob-2{background-color:#D6E4EF}
.bcob-3{background-color:#BCD2E5}
.bcob-5{background-color:#89A2CB}
.bcob-7{background-color:#5F73A3}
.bcob-8{background-color:#4F5F84}

.shadow-001{box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);}

table {width: 100%; border-collapse: collapse; table-layout: fixed; }
th {border-top: 1px solid #E4E6E9; border-bottom: 1px solid #E4E6E9;} 
td {border-bottom: 1px solid #E4E6E9;}


/** 폼 기본형태 **/
.inputBox { display: flex; flex-direction: column; }
.inputBox .inputDetail { position: relative; display: flex; align-items: center; }
.inputBox input {width: 100%;  border: 1px solid #E4E6E9; outline: none; box-sizing: border-box; transition: border-color 0.2s ease-in-out;   }
.inputBox input::placeholder { color: #7E8692; }
.inputBox input:focus {border:1px solid #217431}

/** 폼 애러형태 **/
.inputBox .icon {position: absolute; right: 20px; width: 16px; height: 16px; pointer-events: none; display: none; }
.inputBox .errorTxt { color: #ef4444; display: none; margin-top:10px; }
.inputBox.error input {border:2px solid #ef4444; padding-right: 44px; }
.inputBox.error input:focus { border-color: #ef4444;}
.inputBox.error .errorIcon {display: block; }
.inputBox.error .errorTxt {display: block; }

.pagenation a{width:40px; height:40px; display:flex; align-items: center; justify-content: center; font-size:20px; border-radius: 99px;}
.pagenation a.active{background:#A9AEB7; color:#fff;}

textarea{border:1px solid #E4E6E9; resize: none;}
textarea:focus{border:1px solid #217431; outline: none;}

/* html body를 붙여 우선순위를 대폭 올림 */
html body select,
select.inputBox {
    border: 1px solid #E4E6E9;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fefefe !important;
    background-image: url('/img/seletArrow.svg') !important;
    background-repeat: no-repeat !important;
    background-position: 98% center !important;
    background-size: 12px 12px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: normal !important;
}