@charset "euc-kr";

@import url("/_pub/SBW/assets/css/_component.css");

html,body {width:100%; height:100%; min-height:100%;}
body {-webkit-text-size-adjust:none; word-break:break-all; line-height:1.4; background:var(--bg-01); color:var(--fc-02); letter-spacing:-0.04rem;scroll-behavior: smooth;}
body,button,dd,dl,dt,fieldset,form,input,legend,li,ol,p,select,table,td,textarea,th,ul,h1,h2,h3,h4,h5,h6 {margin:0; padding:0; -webkit-box-sizing:border-box; box-sizing:border-box;}
body,button,input,select,table,textarea {font-size:1.6rem; font-weight:400; font-family:'Spoqa','Pretendard','Sans-serif','µ¸¿ò','dotum';}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
table {table-layout:fixed; width:100%; border-spacing:0;}
caption,
legend {overflow:hidden!important;position:absolute !important;width:1px !important;height:1px !important;clip:rect(0 0 0 0)!important;margin:-1px !important;padding:0!important;color:transparent!important;}
ol,ul {list-style:none;}
em,address {font-style:normal;}
img,fieldset,iframe {border:0;}
img {max-width:100%;height:auto;vertical-align:top;}
a {display:inline-block; color:inherit; text-decoration:none;}
a:hover {text-decoration:none;}
a:visited { color: var(--color-01); }
area {outline:none}
input,select,textarea,button {border:0; border-radius:0; -webkit-appearance:none; appearance:none;}
button {background-color:transparent; color:inherit; cursor:pointer;}
button:hover {color:inherit;}
input::-ms-clear,
input::-ms-reveal {display:none; width:0; height:0;}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration {display:none;}
input[type=date]::-webkit-inner-spin-button {display:none;}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-calendar-picker-indicator {display:none;}
input[type=number] {-moz-appearance:textform;}
input::-webkit-input-placeholder {color:#6e6e6e; text-align: left;}
/* wa_sscn_½É»ç 15p 260317: outline-offset Ãß°¡ s */
input[type=text]:focus,
input[type=date]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=password]:focus {border: 1px solid #0f73e9; outline-offset: -2px;} 
textarea:focus {border: 1px solid #0f73e9; outline-offset: 4px;}
select::-ms-expand {display:none;}
select:required:invalid {color:#1e1e1e;}
select:focus {border: 1px solid #0f73e9 !important; outline-offset: -2px;}
/* wa_sscn_½É»ç 15p 260317: outline-offset Ãß°¡ e */
option {color:var(--fc-01);}
option[value=""][disabled] {display:none;}


/* Set Class */
.hidden {overflow:hidden!important;position:absolute !important;width:1px !important;height:1px !important;clip:rect(0 0 0 0)!important;margin:-1px !important;padding:0!important;color:transparent!important;} /* ??? ???? ???? ???? ?????? ???? */
.dimmed {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); filter:alpha(opacity=60); touch-action:none; z-index:200;}
.eps {display:inline-block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} 
.fl {float:left;}
.fr {float:right;}
.txt-left {text-align:left !important;}
.txt-right {text-align:right !important;}
.txt-center {text-align:center !important;}
.top {vertical-align:top !important;}
.middle {vertical-align:middle !important;}
.bottom {vertical-align:bottom !important;}
.clearfix:after {display:table; content:''; clear:both;}
.required {display:inline-block; position:relative; text-indent:-9999em;}
.required:after {content:'*'; display:block; position:absolute; top:0; left:0; width:1rem; height:2rem; color:#de001b; font-weight:700; text-indent:0;}
.wide {width:100% !important;} /* width 100% */
.inline {display:inline-block; vertical-align:middle;} /* inline */
.block {display:block !important;}
.none {display:none !important;}
.scroll {overflow:auto; position:relative; width:100%;} 
.underline{text-decoration: underline; text-underline-position: under; } /* 241007 ¼öÁ¤ */
.linethrough{text-decoration: line-through;}
.link-txt:hover {color:#0f73e9; text-decoration: underline;}
.dev-nofix {min-height:2000px !important;}
.keep-a {word-break:keep-all !important;}
.sep-txt {display:inline; position:relative; padding-left:1.2rem; color:var(--bdc-02); vertical-align:bottom;}
.sep-txt::before {content:''; display:inline; position:absolute; top:.4rem; left:.4rem; width:.1rem; height:1.2rem; background-color:var(--fc-08);}
.acc-name > span:first-child.sep-txt {padding-left:1.7rem;}
.acc-name > span:first-child.sep-txt::before {left:.9rem;}
.masking {overflow:hidden; width:100%; word-break:keep-all; word-wrap:break-word;}
.between {display: flex; justify-content: space-between; width: 100%;}
.hidden-loop {font-size: 0; line-height: 0; text-shadow: none; color: transparent; display: inline-block; opacity: 0 !important; overflow: hidden !important; position: absolute; word-break: break-all; z-index: -10 !important;}

/* Width */
.w-20 {width:20%;}
.w-40 {width:40%;}
.w-45 {width:45%;}
.w-50 {width:50%;}
.w-60 {width:60%;}
.w-80 {width:80%;}
.full {width:100% !important;}

/* Gap */
.mgt-0 {margin-top:0 !important;}
.mgl-0 {margin-left:0 !important;}
.mgr-0 {margin-right:0 !important;}
.mgb-0 {margin-bottom:0 !important;}

.mgt-5 {margin-top:.5rem !important;}
.mgt-8 {margin-top:.8rem !important;}/* 260915 Ãß°¡ */
.mgt-10 {margin-top:1rem !important;}
.mgt-12 { margin-top: 1.2rem !important; }
.mgt-15 {margin-top:1.5rem !important;}
.mgt-20 {margin-top:2rem !important;}
.mgt-24 {margin-top:2.4rem !important;}
.mgt-30 {margin-top:3rem !important;}
.mgt-32 { margin-top: 3.2rem !important; }
.mgt-35 {margin-top:3.5rem !important;}
.mgt-40 {margin-top:4rem !important;}
.mgt-45 {margin-top:4.5rem !important;}
.mgt-50 {margin-top:5rem !important;}
.mgt-60 {margin-top:6rem !important;}
.mgt-65 {margin-top:6.5rem !important;}
.mgt-70 {margin-top:7rem !important;}
.mgt-80 {margin-top:8rem !important;}
.mgt-100 {margin-top:10rem !important;}
.mgt-110 {margin-top:11rem !important;}
.mgt-180 {margin-top:18rem !important;} /* 261023 Ãß°¡ */

.mgb-10{margin-bottom: 1rem !important;}
.mgb-20{margin-bottom: 2rem !important;} /* 250807 Ãß°¡ */
.mgb-30{margin-bottom: 3rem !important;}
.mgb-40{margin-bottom: 4rem !important;}
.mgb-50 { margin-bottom: 5.0rem !important; }
.mgb-60{margin-bottom: 6rem !important;} /* 240930 Ãß°¡ */

.mgl-5 {margin-left:0.5rem !important;}
.mgl-10 {margin-left:1rem !important;}
.mgl-15 {margin-left:1.5rem !important;}/*2024-02-14*/
.mgl-20 {margin-left:2rem !important;}/*2024-02-14*/
.mgl-25 {margin-left:2.5rem !important;}
.mgl-30 {margin-left:3rem !important;}
.mgl-40 { margin-left: 4.0rem !important; }
.mgl-60 {margin-left:6rem !important;}/* 241210 Ãß°¡ */

.mgr-30 {margin-right:3rem !important;}

.pa-10{ padding: 1rem !important;}
.pa-20{ padding: 2rem !important;}
.pa-24{ padding: 2rem !important;}

.pdt-0 {padding-top:0 !important;}
.pdt-30 {padding-top:3rem !important;} /* 250306 Ãß°¡ */
.pdl-0 {padding-left:0 !important;}
.pdl-10{padding-left: 1rem !important;}
.pdr-0 {padding-right:0 !important;}
.pdb-0 {padding-bottom:0 !important;}

.bdt-0 {border-top: 0 !important;}
.bdt-gray { border-top: 1px solid #ebebeb; } /* 250306 Ãß°¡ */
.bdl-0 {border-left: 0 !important;}
.bdr-0 {border-right: 0 !important;}
.bdb-0 {border-bottom: 0 !important;}

.lh-2{line-height: 2rem !important;}
.lh-4{line-height: 4rem !important;}

.gap-xxxxs-minus {margin-top:-.2rem !important;}
.gap-xxxs-minus {margin-top:-.4rem !important;}
.gap-xxs-minus {margin-top:-.8rem !important;}
.gap-xs-minus {margin-top:-1.2rem !important;}
.gap-xs-2-minus {margin-top:-1.6rem !important;}
.gap-sm-minus {margin-top:-2rem !important;}
.gap-sm-2-minus {margin-top:-2.4rem !important;}
.gap-sm-3-minus {margin-top:-2.8rem !important;}
.gap-lg-minus {margin-top:-4.8rem !important;}

.vat{vertical-align: top !important;}

/*---------------------------------------/
   datepicker
/---------------------------------------*/
.ui-widget-header {
    border:0;
    background: #fff;
}
.ui-datepicker-calendar>thead>tr>th {
    font-size:1.4rem
}
.ui-datepicker .ui-datepicker-header {
    position: relative;
    margin-bottom:2rem;
    padding: 0;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button, html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
    border:0;
    background-color: transparent;
    font-weight: normal;
    color: #454545;
    text-align: center;
}
.ui-datepicker-current {display: none;}
.ui-datepicker-close {
    position: absolute;
    top:1.6rem;
    right:1.6rem;
    width: 2rem;
    height: 2rem;
}
.ui-datepicker-close::before {
    content:'';
    position: absolute;
    top:0;
    right:0;
    width:2rem;
    height:2rem;
    background:url(/_pub/SBW/assets/img/common/btn-close.png) 0 0 no-repeat;
}
.ui-datepicker .ui-datepicker-title select {
    margin:0;
    padding:0 1.5rem 0 0.5rem;
    font-size:1.8rem;
    font-weight: 500;
    background-image: url(/_pub/SBW/assets/img/icon/icon-down.png);
    background-position: right center;
    background-repeat: no-repeat;
}
.ui-datepicker .ui-datepicker-title .ui-datepicker-year {width:7rem;}
.ui-datepicker .ui-datepicker-title .ui-datepicker-month {width:5rem; margin-left: 1.5rem;}
.ui-datepicker {
    display: none;
    position: absolute;
    top:50px;
    left:0;
    width: 34.5rem;
    padding:1.8rem;
    background-color: #fff;
    border-radius:1.2rem;
    box-sizing: border-box;
}
.ui-widget.ui-widget-content {
    border: 2px solid #0f73e9;
}
#datepicker:focus>.ui-datepicker {
    display: block;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    display: none;
    top: 0;
    width: 5.2rem;
    height: 5.2rem;
    cursor: pointer;
}
.ui-datepicker .ui-datepicker-prev {
    left: 0;
}
.ui-datepicker .ui-datepicker-next {
    right: 0;
}
.ui-state-disabled {
    cursor: auto;
    color: hsla(0, 0%, 80%, 1);
}
.ui-state-disabled .ui-state-default {color:#919191;}
.ui-datepicker-other-month .ui-state-default {color:#919191;}
.ui-datepicker-title {
    text-align: center;
    font-size: 1.8rem;
}
.ui-datepicker-calendar {
    width: 100%;
    border:0 !important;
}
.ui-datepicker-calendar>thead>tr>th {
    height: 3.0rem !important;
    padding:0 !important;
    font-size:1.6rem !important;
    font-weight:400 !important;
    color: #6e6e6e !important;
    text-align: center !important;
    background: #fff !important;
}
.ui-datepicker-calendar>tbody>tr>td>a {
    color: #47484a;
    font-size: 1.6rem;
    font-weight: 400 !important;
    text-decoration: none;
}
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover {
    cursor: auto;
    background-color: #fff;
}
.ui-datepicker-calendar>tbody>tr>td {
    height: 3rem !important;
    padding:0 0.7rem !important;
    font-weight: 400 !important;
    text-align: center !important;
    font-size: 1.6rem !important;
    border-radius: 100% !important;
    cursor: pointer !important;
}
.ui-datepicker-calendar>tbody>tr>td:hover {
    background-color: transparent;
    opacity: 0.6;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
    border: 0px solid #cccccc;
    background-color: transparent;
    font-weight: normal;
    color: #2b2b2b;
}
.ui-datepicker .ui-datepicker-prev .ui-icon,
.ui-datepicker .ui-datepicker-next .ui-icon {
    top: 0;
    width: 5.2rem;
    height: 5.2rem;
    margin: 0;
    background-position: center center;
    background-repeat: no-repeat;
}
.ui-widget-header .ui-icon.ui-icon-circle-triangle-e {
    right: 0;
    left: auto;
    background-image: url(/_pub/SBW/assets/img/btn/btn-48-next-gray.png);
    background-size: 2.4rem 2.4rem;
} 
.ui-widget-header .ui-icon.ui-icon-circle-triangle-w {
    left: 0;
    background-image: url(/_pub/SBW/assets/img/btn/btn-48-prev-gray.png);
    background-size: 2.4rem 2.4rem;
} 
.ui-datepicker-calendar>tbody>tr>td:first-child a{
    color: red !important;
} 
.ui-datepicker-calendar>tbody>tr>td:last-child a{
    color: #0099ff !important;
} 
.ui-datepicker-calendar>thead>tr>th:first-child {
    color: red !important;
} 
.ui-datepicker-calendar>thead>tr>th:last-child {
    color: #0086ff !important;
}
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    width:3rem;
    height:3rem;
    margin: 0;
    padding: 0;
    background: #0f73e9;
    color: #fff;
    line-height: 3rem;
    border:0;
    border-radius: 50%;
}
.ui-datepicker-current-day .ui-state-active {
    width: 3.0rem;
    height: 3.0rem;
    margin: 0;
    padding: 0;
    background: #ddd;
    color: #000;
    font-weight: 500 !important;
    line-height: 3rem;
    border:0;
}
.form-ele .ui-datepicker-trigger {
    position: absolute;
    top:0.1rem;
    right:0.1rem;
    width:4rem;
    height:4.4rem;
    background: url(/_pub/SBW/assets/img/icon/icon-calendar.png) no-repeat center center;
    font-size:0;
    line-height: 0;
    text-indent: -9999px;
}
.ui-datepicker-calendar.table table th, 
.ui-datepicker-calendar.table table td {border-left: none;}


/* flex container */
.flex-container{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    
    -webkit-flex-direection:row;
    -ms-flex-direction: row;
    flex-direction: row;

    -webkit-flex-wrap:nowrap;
    -ms-flex-wrap:nowrap;
    flex-wrap: nowrap;

    -webkit-justify-content:flex-start;
    -ms-flex-pack:start;
    justify-content: flex-start;

    -webkit-align-content:stretch;
    -ms-flex-pack:start;
    -ms-flex-line-pack:stretch;
    align-content: stretch;
}
.flex-box{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;

    -webkit-justify-content:space-between;
    -ms-flex-pack:space-between;
    justify-content: space-between;
}
.flex-center { -webkit-justify-content:center; -ms-flex-pack:center; justify-content: center; } /* 240930 Ãß°¡ */
.flex-end {justify-content: end; } /* 260121 Ãß°¡ */

/* loader */
.load-screen {display:none; position: fixed; top:0; left:0; right:0; bottom:0; z-index:300; display: flex; flex-direction: column; align-items: center; justify-content: center; background:rgba(255,255,255,0.75);} /* 260702 ´ëÃâÁøÇàÇöȲ ·Îµù dim¿µ¿ª Å佺Ʈ Æ˾÷º¸´Ù À§¿¡ ¿Ã¶ó´Â Çö»óÀ¸·Î z-index °ª ¼öÁ¤ (9999 ¡æ 300) */
.loader {position: relative; width:8rem; height:1.6rem;}
.loader span {position: absolute; top:0; left:0; z-index:1; width:1.6rem; height:1.6rem; border-radius: 50%;}
.loader .ball1 {background: #d05259; transform: translateX(0) scale(1); animation:ballMoveX1 2s linear infinite;}
.loader .ball2 {background: #2374ae; transform: translateX(3.2rem) scale(1); animation:ballMoveX2 2s linear infinite;}
.loader .ball3 {background: #77787b; transform: translateX(6.4rem) scale(1); animation:ballMoveX3 2s linear infinite;}
.load-screen p {margin-top:3rem; text-align: center;}

@keyframes ballMoveX1 {
    0% {transform: translateX(0) scale(1)}
    25% {transform: translateX(3.2rem) scale(0.8)}
    50% {transform: translateX(6.4rem) scale(1)}
    75% {z-index:2; transform: translateX(3.2rem) scale(1.3)}
    100% {transform: translateX(0) scale(1)}
}
@keyframes ballMoveX2 {
    0% {transform: translateX(3.2rem) scale(0.8)}
    25% {transform: translateX(6.4rem) scale(1)}
    50% {z-index:2; transform: translateX(3.2rem) scale(1.3)}
    75% {transform: translateX(0) scale(1)}
    100% {transform: translateX(3.2rem) scale(0.8)}
}
@keyframes ballMoveX3 {
    0% {transform: translateX(6.4rem) scale(1)}
    25% {z-index:2; transform: translateX(3.2rem) scale(1.3)}
    50% {transform: translateX(0) scale(1)}
    75% {transform: translateX(3.2rem) scale(0.8)}
    100% {transform: translateX(6.4rem) scale(0.8)}
}


.section-wrap:has(.wideCut) {overflow:hidden;}

/* 112156 ¼ö¾î»ó´ã */
/* var */
:root {
    font-size:10px;
    --sab: calc(constant(safe-area-inset-bottom) / 2);
    --sab: calc(env(safe-area-inset-bottom) / 2);

    /* font Size */
    --fz-12: 1.2rem !important;
    --fz-13: 1.3rem !important;
    --fz-14: 1.4rem !important;
    --fz-15: 1.5rem !important;
    --fz-16: 1.6rem !important;
    --fz-18: 1.8rem !important;   
    --fz-20: 2.0rem !important;
    --fz-24: 2.4rem !important;
    --fz-28: 2.8rem !important;
    --fz-30: 3.0rem !important;

    /* color */
    --color-blue1: #0086ff; /* --color-point, --color-posi */
    --color-blue2: #007efc;
    --color-blue3: #2d4ec8;
    --color-blue4: #339eff;
    --color-blue5: #66b6ff;
    --color-blue6: #99cfff;
    --color-blue7: #cce7ff;
    --color-blue8: #e6f3ff;
    --color-blue9: #f2f9ff;
   /*  --color-point: var(--color-blue1); */
    --color-point2: #ff7bac;
    --color-point3: #39d9f4;
    --color-nega: #ec4956;
    --color-info: #f9a825;
    --color-posi: var(--color-blue1);
    --color-00: #000;
    --color-01: #13161c;
    --color-02: #46494f;
    --color-03: #696e77;
    --color-04: #8f949e;
    --color-05: #c2c6cf;
    --color-06: #d8dbe0;
    --color-07: #f4f6f9;
    --color-08: #fff;

    /* space */
    --lv-xl: 4.8rem;
    --lv-la: 3.2rem;
    --lv-md: 2.4rem;
    --lv-sm: 2.0rem;
    --lv-xs: 1.2rem;
}

.flex {display:flex !important;}
.flex.center { align-items: center; }
.counHour.disabled {background-color: #f6fafe; color: #707070;}
.counMin.disabled {background-color: #f6fafe; color: #707070;}

/* Font Size */
.fz-12 {font-size: var(--fz-12) !important;}
.fz-13 {font-size: var(--fz-13) !important;}
.fz-14 {font-size: var(--fz-14) !important;}
.fz-15 {font-size: var(--fz-15) !important;}
.fz-16 {font-size: var(--fz-16) !important;}
.fz-18 {font-size: var(--fz-18) !important;}
.fz-20 {font-size: var(--fz-20) !important;}
.fz-24 {font-size: var(--fz-24) !important;}
.fz-28 {font-size: var(--fz-28) !important;}

.mgl-50 {margin-left:5rem !important;}

/* *:focus {border:2px solid red} */

/* badge */ /* 250121 Ãß°¡ */
.badge { display: inline-block; padding: 0.7rem 1.4rem; background: var(--color-blue8); color: var(--color-blue3); font-size: var(--fz-16); font-weight: 600; border-radius: 2.1rem;  }


/*********** SSCN ***********/
/* [Badge] */
.badge-wrapper { display: flex; align-items: center; justify-content: flex-start; gap: .4rem; }
.badge-wrapper .badge { padding: .4rem 1rem; width: auto; height: 2.4rem; border-radius: 1.2rem; font-size: 1.2rem; line-height: 1.3; font-weight: 500; }

.badge[class*='line-'] { border-width: 1px; border-style: solid; background: var(--color-08); }
.badge.line-blue { border-color: var(--color-blue10); color: var(--color-blue10); }
.badge.line-red { border-color: var(--color-nega); color: var(--color-nega); }
.badge.line-teal { border-color: #008fa8; color: #008fa8; }
.badge.line-slate { border-color: #566bba; color: #566bba; }
.badge.line-dark { border-color: #46494F; color: #46494F; }

/* [Divider] */
.divided > *:not(:last-child) { position: relative; padding-right: 2rem; margin-right: 2rem; }
.divided > *:not(:last-child)::after { content: ''; display: block; width: 1px; height: 1rem; background: var(--color-gray2); position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.divided.divided-sm > *:not(:last-child) { padding-right: 1rem; margin-right: 1rem; }